AWS Amplify를 이용한 React Native 앱 개발기 (1) 환경설정

 

Local - 기본 도구 설치 및 확인

node -v
npm -v

npm install -g yarn
npm install -g expo-cli
npm install -g @aws-amplify/cli

 

 

Local - Expo(React Native) 프로젝트 생성

expo-cli init

 

expo-cli init 명령어 수행 후, 앱 이름을 지정해주면 관련 폴더 및 파일들이 자동으로 생성된다.

 

 

 

Local - AWS profile 설정

액세스 키는 IAM > 사용자 에서 생성 가능

amplify configure

 

리전을 선택하고, 액세스 키를 입력해 프로필 설정을 완료한다.

 

Local - Amplify, React Native 라이브러리 설치

yarn add @aws-amplify/ui-react-native aws-amplify @aws-amplify/react-native react-native-safe-area-context @react-native-community/netinfo @react-native-async-storage/async-storage react-native-get-random-values

 

 

AWS - Amplify 앱(프로젝트) 생성

Amplify > Amplify Studio 시작하기

 

AWS 콘솔에서 앱 생성이 완료되면 Hosting environments와 Backend environments(Amplify Studio)를 사용할 수 있다.

 

 

Local - 개발 환경과 Amplify 연동

amplify pull --appId (AppId) --envname (Status)

 

로컬에서 pull 명령어를 수행하면 amplify 폴더와 소스 디렉터리 경로로 설정한 src 폴더가 생성되며, src 하위에 aws-export.js 파일이 생성된다. 이 파일은 클라우드로부터 변경사항이 업데이트되면 pull 명령어를 수행할 때마다 사용자의 개발 환경에 맞게 자동으로 수정된다.

 

 

Local - 앱 실행

yarn start
# 또는
npx expo run:ios

 

yarn start 명령어로 앱을 실행할 수 있다.

참고 : ios 에뮬레이터 실행 중 로그인 관련 오류를 발견해 npx expo run:ios 명령어로 실행해주었다.