개요
React Native App을 개발하는 방법은 React Native CLI를 사용하는 방법과 Expo를 사용하는 방법이 있습니다.
React Native CLI(Command Line Interface)와 Expo는 React Native 앱을 개발하기 위한 두 가지 주요 접근 방식입니다. 각각의 방식은 자체적인 특징과 장단점이 있는데 개발자가 더 많은 컨트롤과 자유를 원한다면 React Native CLI를 선택하고, 빠르고 간편한 시작 및 개발을 원한다면 Expo를 선택할 수 있습니다. 각각의 특징은 아래와 같습니다.
React Native CLI:
- Native 모듈 지원: React Native CLI는 네이티브 모듈을 더 유연하게 사용할 수 있는 환경을 제공합니다. 네이티브 코드에 직접 접근할 수 있어서 특정 플랫폼에 특화된 코드를 작성하거나 외부 라이브러리를 더 쉽게 통합할 수 있습니다.
- 완전한 커스터마이징 가능성: React Native CLI를 사용하면 프로젝트를 완전히 커스터마이징할 수 있습니다. 특별한 요구사항이나 고급 설정이 필요한 경우에 적합합니다.
- 네이티브 코드 작성: 네이티브 코드를 직접 작성해야 하는 경우에 적합합니다. 특정 네이티브 모듈을 사용하거나 성능 최적화가 필요한 경우에 유용합니다.
Expo:
- 간편한 시작: Expo는 개발 환경 설정과 프로젝트 초기 구성을 간편하게 제공합니다. 특히 새로운 개발자들이나 빠르게 프로토타입을 만들어야 하는 경우에 적합합니다.
- 내장된 API와 서비스: Expo는 많은 내장 API와 서비스를 제공하여 특정 기능을 구현할 때 별도의 네이티브 모듈을 작성하지 않고도 사용할 수 있습니다. 이로써 편리하게 카메라, 지도, 푸시 알림 등을 통합할 수 있습니다.
- Expo 클라우드 서비스: Expo 서비스를 사용하면 빌드, 테스트, 배포를 클라우드에서 관리할 수 있습니다. Expo CLI를 사용하지 않아도 Expo 서비스를 활용할 수 있습니다.
- 단순한 플랫폼 관리: Expo는 iOS 및 Android 플랫폼 간의 일관된 경험을 제공하며, 특별한 네이티브 모듈을 작성하지 않으면서도 다양한 기능을 사용할 수 있도록 도와줍니다.
Expo 사용 방법
Expo 사이트에서 회원가입 및 프로젝트를 생성해줍니다.
npm install --global eas-cli
EAS CLI를 전역으로 설치하는 명령어입니다. EAS (Expo Application Services)는 Expo 앱의 더 나은 빌드 및 배포 경험을 제공하기 위한 도구 및 서비스입니다.
npx create-expo-app 프로젝트이름
Expo 프로젝트를 생성하는 명령어입니다. 이 명령어를 사용하면 프로젝트이름의 Expo 프로젝트가 생성되며, 프로젝트의 초기 설정이 자동으로 이루어집니다.
cd 프로젝트이름
프로젝트이름 폴더 안으로 이동합니다.
eas init --id id값
EAS 프로젝트를 초기화하는 명령어입니다. 이 명령어는 EAS를 사용하여 Expo 앱을 빌드하고 배포하기 위한 프로젝트 설정을 초기화합니다. --id 플래그는 프로젝트의 고유 식별자를 나타냅니다. expo 사이트에서 생성한 프로젝트의 id를 입력해주면 됩니다.
expo start
Expo 개발 서버를 시작하는 명령어입니다. 개발 서버를 시작하면 Expo Go 앱을 통해 프로젝트를 시뮬레이터 또는 실제 기기에서 실행할 수 있습니다. 개발 중에 코드 변경 사항이 실시간으로 반영되므로 효율적으로 작업할 수 있습니다.
eas build:configure
build 정보를 담고 있는 eas.json 파일을 생성합니다.
eas build --platform android
EAS를 사용하여 Android용 Expo 앱을 빌드하는 명령어입니다. 이 명령어를 실행하면 빌드 프로세스가 시작되고, 최종적으로 Android 앱의 빌드 결과물을 얻을 수 있습니다. --platform 플래그를 사용하여 빌드 대상 플랫폼을 지정합니다. 해당 명령어의 결과로 abb 파일을 다운받을 수 있는 url이 생기는데 해당 url을 클릭해서 abb 파일을 다운로드 받아서 구글 플레이스토어에 제출 시 사용하면 됩니다.
참고자료
'개발 > react native' 카테고리의 다른 글
[React Native] Kakao Map 사용 방법 (2) | 2024.02.01 |
---|---|
[Expo] eas update를 통해 앱배포없이 수정사항 반영하기 (1) | 2024.01.24 |