이 프로젝트는 Ignite CLI V8.4.2 (React Native V0.69.7)를 사용하여 부트 스트레이핑되었습니다.
현재 포함 :
이 프로젝트를 실행하기 전에 컴퓨터에 다음 소프트웨어를 설치해야합니다.
cp .env.example scripts/config/.env.staging
scripts/config/.env.staging
파일에서 다음 변수에 대한 값을 제공합니다.API_URL
백엔드의 URL (예 : http : // localhost : 5000/).GOOGLE_API_TOKEN
Google Maps API 토큰. 여기에서 얻는 방법을 배우십시오.MAPBOX_API_TOKEN
당신의 mapbox 토큰. 여기에서 얻는 방법을 배우십시오.config-env.sh
스크립트를 실행하십시오 ./scripts/config-env.sh staging
.netrc
파일을 만듭니다. machine api.mapbox.com
login mapbox
password YOUR_SECRET_MAPBOX_ACCESS_TOKEN
YOUR_SECRET_MAPBOX_ACCESS_TOKEN
교체하십시오..netrc
파일 권한을 변경합니다 sudo chmod 0600 ~/.netrc
.gradle/gradle.properties
파일을 작성하십시오. MAPBOX_DOWNLOADS_TOKEN=YOUR_SECRET_MAPBOX_ACCESS_TOKEN
YOUR_SECRET_MAPBOX_ACCESS_TOKEN
교체하십시오.npx @sentry/wizard@latest -s -i reactNative
실행하여 센트리를 설정하십시오. 포드의 업데이트 및/또는 설치를 자유롭게 거부하십시오. yarn install
ios/STSApp.xcworkspace
엽니 다.Signing & Capabilities
탭으로 이동하십시오.Automatically manage signing
.다음 명령을 실행하십시오.
yarn android
빌드가 성공하면 장치에서 앱을 수동으로 열어야 할 수도 있습니다.
Ignite Boilerplate Project의 구조는 이것과 유사하게 보입니다.
ignite-project
├── app
│ ├── components
│ ├── config
│ ├── i18n
│ ├── models
│ ├── navigators
│ ├── screens
│ ├── services
│ ├── theme
│ ├── utils
│ ├── app.tsx
├── test
│ ├── __snapshots__
│ ├── mockFile.ts
│ ├── setup.ts
├── README.md
├── android
│ ├── app
│ ├── build.gradle
│ ├── gradle
│ ├── gradle.properties
│ ├── gradlew
│ ├── gradlew.bat
│ ├── keystores
│ └── settings.gradle
├── index.js
├── ios
│ ├── IgniteProject
│ ├── IgniteProject-tvOS
│ ├── IgniteProject-tvOSTests
│ ├── IgniteProject.xcodeproj
│ └── IgniteProjectTests
├── .env
└── package.json
Ignite Boilerplate 프로젝트에는 app
Directory가 포함되어 있습니다. 이것은 바닐라 반응 기본을 사용할 때 일반적으로 만들어야하는 디렉토리입니다.
app
디렉토리의 내부는 다음과 비슷해 보입니다.
app
├── components
├── config
├── i18n
├── models
├── navigators
├── screens
├── services
├── theme
├── utils
├── app.tsx
구성 요소 재사용 가능한 구성 요소가 라이브로 사용하여 화면을 만드는 데 도움이됩니다.
i18n 이곳은 react-native-i18n
사용하는 경우 번역이 사는 곳입니다.
모델이 앱의 모델이 사는 곳입니다. 각 모델에는 mobx-state-tree
모델 파일, 테스트 파일 및 동작, 유형 등과 같은 기타 지원 파일이 포함 된 디렉토리가 있습니다.
항해자 이것은 react-navigation
네비게이터가 사는 곳입니다.
스크린 화면 구성 요소가 사는 곳입니다. 화면은 전체 화면을 차지하고 탐색 계층의 일부가되는 React 구성 요소입니다. 각 화면에는 자산 또는 기타 도우미 파일과 함께 .tsx
파일이 포함 된 디렉토리가 있습니다.
외부 세계와 인터페이스하는 모든 서비스는 여기에서 살 것입니다 (REST API, 푸시 알림 등을 생각하십시오).
여기 테마는 간격, 색상 및 타이포그래피를 포함하여 응용 프로그램의 테마를 유지합니다.
UTILS 는 기타 도우미와 유틸리티를 넣을 수있는 좋은 장소입니다. 데이트 헬퍼, 형성자 등과 같은 것들이 종종 여기에서 발견됩니다. 그러나 응용 프로그램에서 진정으로 공유되는 것만으로 만 사용해야합니다. 헬퍼 또는 유틸리티가 특정 구성 요소 또는 모델에서만 사용되는 경우 해당 구성 요소 또는 모델과 함께 도우미를 공동으로 집어 넣는 것을 고려하십시오.
app.tsx 이것은 앱의 진입 점입니다. 여기에서 나머지 응용 프로그램을 렌더링하는 기본 앱 구성 요소를 찾을 수 있습니다.
이 디렉토리는 농담 구성과 모의를 보유합니다.
Create a token
클릭하십시오Create token
클릭하고 토큰을 복사하십시오. sk.