spotthestation

Добро пожаловать в STSApp

Этот проект был загружен с использованием Ignite CLI V8.4.2 (React Native V0.69.7).

В настоящее время включает в себя:

• Реагировать на родной
• Реагировать навигацию
• MOBX State Tree
• Машинопись
• И еще!

Начиная

Предварительные условия

Прежде чем вы сможете запустить этот проект, вам нужно будет установлено следующее программное обеспечение на вашем компьютере:

• Node.js (v16.x или выше)
• пряжа (v1.x)
• Реагировать Native Cli

Установка

1. Скопируйте образец файла env в каталог конфигурации:

    cp .env.example scripts/config/.env.staging
   

2. В файле scripts/config/.env.staging предоставьте значения для следующих переменных:
   • API_URL - URL вашего бэкэнда, например: http: // localhost: 5000/.
   • GOOGLE_API_TOKEN - ваш токен API Google Maps. Узнайте, как его получить здесь.
   • MAPBOX_API_TOKEN - ваш токен Mapbox. Узнайте, как его получить здесь.
   • Вы можете оставить другие переменные без изменений
3. Запустите скрипт config-env.sh

    ./scripts/config-env.sh staging
   

4. Создать файл .netrc в вашем домашнем каталоге (не каталог проектов) со следующим контентом:

    machine api.mapbox.com
   login mapbox
   password YOUR_SECRET_MAPBOX_ACCESS_TOKEN
   

   Замените YOUR_SECRET_MAPBOX_ACCESS_TOKEN с помощью токена Mapbox.
5. Изменить разрешения на файл .netrc

    sudo chmod 0600 ~/.netrc
   

6. Создать файл .gradle/gradle.properties в вашем домашнем каталоге (не в каталоге проекта) со следующим контентом:

    MAPBOX_DOWNLOADS_TOKEN=YOUR_SECRET_MAPBOX_ACCESS_TOKEN
   

   Замените YOUR_SECRET_MAPBOX_ACCESS_TOKEN с помощью токена Mapbox.
7. Запустите npx @sentry/wizard@latest -s -i reactNative чтобы настроить Sentry. Не стесняйтесь отвергать обновления и/или установку стручков.
8. Установить зависимости проекта:

    yarn install
   

Запуск на устройстве iOS

1. Откройте ios/STSApp.xcworkspace в xcode.
2. Перейдите на вкладку Signing & Capabilities .
3. Tick Automatically manage signing .
4. Выберите команду разработчиков. Примечание. Поскольку этот проект использует Push -уведомления, команды личного развития не будут работать.
5. Измените идентификатор пакета на любое значение.
6. Нажмите значок «Пуск», чтобы создать и запустить приложение на вашем устройстве.

Запуск на устройстве Android

Запустите следующую команду:

 yarn android

Если Build удастся, вам может потребоваться открыть приложение вручную на вашем устройстве.

Структура проекта

Структура проекта Ignite Cowerplate будет выглядеть похоже на это:

 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

./App Directory

В проект Ignite Cowerplate включен каталог app . Это каталог, который вы обычно должны создавать при использовании Vanilla React Native.

Внутри каталога app выглядит похоже на следующее:

 app
├── components
├── config
├── i18n
├── models
├── navigators
├── screens
├── services
├── theme
├── utils
├── app.tsx

Компоненты здесь живут ваши многоразовые компоненты, которые помогут вам построить экраны.

I18N Это где ваши переводы будут жить, если вы используете react-native-i18n .

Модели здесь будут жить модели вашего приложения. Каждая модель имеет каталог, который будет содержать файл модели mobx-state-tree , файл тестирования и любые другие поддерживающие файлы, такие как действия, типы и т. Д.

Навигаторы именно здесь будут жить ваши навигаторы react-navigation .

Экраны , где будут жить ваши компоненты экрана. Экран - это компонент React, который займет весь экран и станет частью иерархии навигации. Каждый экран будет иметь каталог, содержащий файл .tsx , вместе с любыми активами или другими помощниками.

Услуги Любые услуги, которые взаимодействуют с внешним миром, будут жить здесь (подумайте о API Rest, Push -уведомлениях и т. Д.).

Тема здесь живет темой для вашего приложения, включая расстояние, цвета и типографику.

Utils Это отличное место, чтобы поставить разных помощников и коммунальных услуг. Такие вещи, как помощники даты, форматер и т. Д., Часто встречаются здесь. Тем не менее, его следует использовать только для вещей, которые по -настоящему делятся в вашем приложении. Если помощник или утилита используется только определенным компонентом или моделью, рассмотрите возможность совместного размещения вашего помощника с помощью этого компонента или модели.

app.tsx Это точка входа в ваше приложение. Здесь вы найдете основной компонент приложения, который отдает оставшуюся часть приложения.

./test каталог

В этом каталоге будут удерживать ваши шутки конфигурации и издеваться.

Как получить токен Mapbox?

1. Создайте учетную запись здесь
2. Перейти на страницу доступа к токенам
3. Нажмите Create a token
4. Назовите свой токен, отметьте все общедоступные флажки, отметьте следующие флажки Secret Scopes:
   • Стили: скачать
   • Загрузки: читать
   • Видение: скачать
   • Навигация: скачать
5. Нажмите Create token и скопируйте свой токен. Это должно начать с sk.