소개

React Native를 사용하여 만들고 싶은 네이티브 어플리케이션이 생겼기 때문에, 우선은 셋업의 비망록으로서 이 기사를 남깁니다.
덧붙여서 React Native는 Cross-Platform (iOS, Android, Web etc ...)에 대응하는 응용 프로그램을 개발할 수 있습니다.
참조 : React Native

실행 환경

macOS Catalina: 10.15.4
node: v12.18.3
react-native-cli: 2.0.1
watchman: 4.9.0

환경 구축

brew를 사용하여 Node와 Watchman을 설치합니다.

Node는 괜찮습니다. Watchman은 FaceBook 권장 파일 변경 관리 도구입니다.
참조: Watchman 공식

brew install node
brew install watchman

또, CocoaPods를 인스톨하면 편리하기 때문에 install 해 갑니다.
CocoaPods는 라이브러리 관리 도구입니다.

참조: CocoaPods 설명

sudo gem install cocoapods

프로젝트 만들기

iOS 시뮬레이터를 시작합니다.

open -a Simulator

iOS 시뮬레이터의 기동을 확인할 수 있으면, 일단 닫고,
다음은 응용 프로그램을 만들고 iOS에서 시작합니다.

react-native init Test(プロジェクトの名前)
cd Test
react-native run-ios

실행 후 아래와 같이 애플리케이션이 시작됩니다.

디렉토리 구성

이쪽 참조: React 공식 Doc 를 참고로 해,
다음은 디렉토리 구성의 예입니다.
이번에는 파일 형식별로 그룹화하는 방법을 채택합니다.

api/
  APIUtils.js
  APIUtils.test.js
  ProfileAPI.js
  UserAPI.js
components/
  Avatar.js
  Avatar.css
  Feed.js
  Feed.css
  FeedStory.js
  FeedStory.test.js
  Profile.js
  ProfileHeader.js
  ProfileHeader.css

끝

다음에, 실제로 작성한 어플리케이션과 코드를 기사로 해 가겠습니다.