[React Native] 프로젝트 생성 및 초기 세팅

최근에 Next를 이용해서 개발을 하다가 React Native로 프로젝트를 진행할 일이 생겼다. 초기 세팅하는 방법을 매번 찾아보는 것도 번거로워서 블로그에 따로 정리해 두려고 한다.

1. 윈도우 개발 환경 설정

개발 환경 설정은 React Native 공식문서를 그대로 따라가면 된다.
기존에 설정해 둔 게 있어서 설치가 제대로 되었는지 확인하는 방법만 정리했다.

1.1. Chocolatey 설치

choco --version

1.2. Node.js 설치

node --version
npm --version

1.3. JDK 설치

JDK 설치 확인

java -version

Java 컴파일러 설치 확인

javac -version

1.4. React Native CLI 설치

npm install -g react-native-cli

설치 확인

react-native --version

1.5. 안드로이드 스튜디오 설치

초기에 환경변수 설정하면서 꽤나 애를 먹은 기억이 있다.
에러가 발생하면 반드시 공식문서대로 처음부터 끝까지 다시 체크해야 한다.

환경 변수 설정 잘 되었는지 확인

adb --version

2. 프로젝트 세팅

2.1. React Native 프로젝트 생성

npx react-native init <프로젝트명>
cd <프로젝트명>
npm run android

문제없이 잘 실행된다면 아래와 같은 화면을 확인할 수 있다.

3. comment

여기에 추가로 tsconfig.json과 .eslintrc.js, .prettierrc.js, babel.config.js도 프로젝트에 맞게 커스텀하면 향후 개발함에 있어서 유용하다. 이번 프로젝트를 세팅할 때는 휘뚜루마뚜루 마음대로 세팅했는데 다음에는 네 가지 코드에 대한 것도 정리해야겠다.