Expo의 Development Build 설정하기Setting up Development Build in Expo
📅
🚀
들어가기 전에🔗
✅
Expo Go 어플리케이션의 한계🔗
우리는 Development 빌드가 무엇인지 알기 전에, 기본적으로 셋팅되어있는 Expo Go 어플리케이션에 대해 알아보겠습니다.
npx create-expo-app로 첫 번째 React Native 프로젝트를 생성하고 npx expo start로 실행했을 때, 개발을 위해 Expo Go 앱을 사용했을 가능성이 높습니다. Expo Go는 여러분이 빠르게 코딩을 시작할 수 있도록 저희(엑스포에서와 마찬가지로)가 만들어서 구글 플레이 스토어와 애플 앱 스토어에 제출한 네이티브 앱입니다. 이 앱은 여러 네이티브 라이브러리가 포함된샌드박스 앱입니다(종속성 목록 참조). 즉, 개발자는 로컬 컴퓨터에서 앱의 자바스크립트 코드를 업데이트하고 엑스포 고에서 변경 사항을 확인할 수 있습니다. (출처: Expo 공식 문서↗)
쉽게 말해서, Expo Go 라는 미리 빌드되어있는 껍데기 어플리케이션 안에, 자바스크립트를 수정해서 결과를 빠르게 확인할 수 있는 개발 환경을 제공해주는 것입니다. 하지만 이 좋은 Expo Go에도 한계가 있습니다. 바로 네이티브 코드를 수정할 수 없다는 것입니다. 이런 경우 때문에 특정 라이브러리, 푸쉬 알림 등은 Expo Go에서는 작동하지 않을 수 있습니다. 이런 문제를 해결하기 위해, Expo에서는 네이티브 코드를 수정할 수 있는 방법을 제공하고 있습니다. 그리고 그마저도 쉽게 만들어둔 방식이 바로 Development 빌드입니다.
🚀
expo-dev-client 설치하기🔗
✅
expo-dev-client란?🔗
기존 Expo Go 앱에는 내장되어있어 필요 없었던 기능입니다. 바로 실행중인 터미널 창에서 키보드의 m 버튼을 누르면 나타나는 개발자 메뉴입니다. 이 개발자 메뉴는 Expo Go 앱에서만 사용할 수 있었지만, expo-dev-client를 사용하면 이 개발자 메뉴를 개발자 빌드 상태에서도 사용할 수 있습니다.
✅
설치하기🔗
npx expo install expo-dev-client🚀
네이티브 앱 빌드하기🔗
EAS로 빌드하는 것, 로컬 환경에서 빌드하는 것으로 크게 두 가지 방법이 있습니다.
✅
EAS로 빌드하기🔗
➡️
EAS란?🔗
EAS는 Expo Application Services의 약자로, Expo에서 제공하는 클라우드 서비스입니다. 빌드, 업데이트 및 제출 워크플로우를 다루는 툴을 사용하여 Android 및 iOS용 앱을 빌드할 수 있습니다. 스토어에 배포할 예정이거나, 협업을 할 때에 사용하는 것이 좋습니다. 단, 로컬에 설치되지 않고 사용량 제한이 있으니 주의해야 합니다.
작업 전, 아래 명령어를 사용해서 eas cli를 설치, 로그인해주세요.
npm install -g eas-cli
eas login➡️
Android 빌드🔗
eas build --platform android --profile development➡️
iOS 빌드🔗
IOS 시뮬레이터를 위한 빌드는 루트 폴더에
eas.json 파일을 추가하고 아래와 같이 작성해주세요.{
"build": {
"development": {
"ios": {
"simulator": true
}
}
}
}그리고 아래 명령어를 실행해주세요.
eas build --platform ios --profile development✅
로컬 환경에서 빌드하기🔗
➡️
Android 빌드🔗
npx expo run:android➡️
iOS 빌드🔗
npx expo run:ios단, 실제 기기에서 빌드하는 명령어는 아래와 같습니다.
npx expo run:ios --device✅
빌드 완료 시🔗
➡️
EAS로 빌드한 경우🔗
예를 들어, IOS 시뮬레이터 빌드를 완료했다면 자동으로 다운받을지 물어보는 문구가 뜨며 Expo 대시보드↗에서 빌드가 생성된 것을 확인할 수 있습니다.
빌드를 클릭해 다운을 받으면,
~.tar.gz 파일이 다운로드됩니다. 이 파일을 압축해제하면 패키지 파일이 나오고, 시뮬레이터로 끌어다 놓으면 앱이 설치됩니다.
✅
로컬 환경에서 빌드한 경우🔗
빌드가 완료되면, 시뮬레이터에 앱이 설치됩니다. Expo Go 앱을 사용하지 않고, 네이티브 코드를 수정할 수 있는 개발 환경이 완성되었습니다.
npm start로 실행 후 s를 눌러 개발자 모드로 빌드된 앱을 열어 개발을 진행할 수 있습니다.
🚀
결론🔗
이제 각 운영체제의 빌드에 맞는 폴더(ios, android)가 루트 폴더에 생성되었을 것입니다. 이 폴더 안에 있는 네이티브 코드를 수정하면, Expo Go에서는 확인할 수 없었던 네이티브 코드를 수정할 수 있게 되었습니다.
✅
더 생각해 보기🔗
- 배포 자동화 구축하는 방법은 무엇이 있을까요?
✅