사과 냄새나는 IT이야기 TAESTORY,

React-Native 프로젝트의 Back-End를 개발하며, React-Native 개발자가 API 호출하는데 이슈가 있다고하여 직접 테스팅해보기 위해 React-Native 환경을 구축하며 정리한 내용 npx react-native run-ios --simulator 'iPhone 15 Pro'

React-Native 프로젝트의 Back-End를 개발하며, React-Native 개발자가 API 호출하는데 이슈가 있다고하여 직접 테스팅해보기 위해 React-Native 환경을 구축하며 정리한 내용npx react-native@latest init AwesomeProjectNeed to install the following packages: react-native@0.72.6Ok to proceed? (y) y ###### ###### ### #### #### ### ## ### ### ## ## ..

React-Native 프로젝트의 Back-End를 개발하며, React-Native 개발자가 API 호출하는데 이슈가 있다고하여 직접 테스팅해보기 위해 React-Native 환경을 구축하며 정리한 내용 npx react-native 실행 시TypeError: cli.init is not a function for react native 에러가 발생하는 경우 충돌 오류라react-native-cli와 react-native의 재설치가 필요함install new react-native globalnpm uninstall -g react-native-cliinstall new react-native globalnpm install -g react-native-clinpm install -g react-na..

React-Native를 특정 버전으로 init 하고자 하는 경우 --version 옵션을 활용npx react-native init reactNative --version 0.71.13

React-Native 프로젝트의 Back-End를 개발하며, React-Native 개발자가 API 호출하는데 이슈가 있다고하여 직접 테스팅해보기 위해 React-Native 환경을 구축하며 정리한 내용 여러가지 라이브러리들이 설치 되어야하는데 그 과정에서 충돌이 많음.cocoapods의 경우 gem으로 설치하는 가이드가 많아 gem으로 설치를 시도했으나계속 오류가 발생해서 ruby 버전을 변경해도 해결되지 않아 brew를 통해서 설치하였음.brew를 통해서 설치해도 문제 없어보임. sudo npm install -g react-native-clisudo gem install cocoapods#gem으로 cocoapods 설치 실패 시 homebrew로 설치brew install cocoapods#ru..

.env.development와 .env.production 파일을 구분하여 사용하는 것은 개발 환경과 프로덕션 환경에서 다른 설정을 적용하고 싶을 때 유용함..env 파일 설정.env.development: 개발 환경에서 사용될 환경 변수들을 정의. 개발 API 서버 주소나 로깅 레벨 등을 설정.env.production: 프로덕션 빌드에서 사용될 환경 변수를 정의. 운영 환경에 맞는 API 서버 주소, 트래킹 코드, 최적화 옵션 등을 설정두 파일은 프로젝트의 루트 디렉토리에 위치해야함.환경에 따라 파일 사용하기create-react-app을 사용하는 경우, 환경에 따라 자동으로 .env 파일을 사용개발 환경: npm start / yarn start를 사용하여 개발 서버를 시작, .env.develo..

컴포넌트에 데이터를 전달하는 방법컴포넌트를 호출하는 곳에서 아래와 같이 컴포넌트에 초기 값을 전달할 수 있음function App() { const number = 5; return ( );}컴포넌트에서는 인자로 받아서 사용이 가능함.import React, { useState } from "react";const Counter = (props) => { console.log(props); const [count, setCount] = useState(props.initialValue); const onIncrease = () => { setCount(count + 1); }; const onDecrease = () => { setCount(c..

State를 사용하려면 React를 import 해줘야함import React,{useState} from "react";컴포넌트는 상태가 변화하면 화면을 다시 그리는 Re-rendering 과정을 거친다.그에 따라 해당 함수가 다시 호출된다.컴포넌트는 State를 여러개 가질 수 있다.import React, { useState } from "react";const Counter = () => { //0에서 출발 //1씩 증가 //1씩 감소 //[상태의값, 상태변화메소드] = 함수(초기값); const [count, setCount] = useState(0); const onIncrease = () => { setCount(count + 1); }; const onDecrease =..