🐸 React Native Template TypeScript

В данный момент Push-уведомления для iOS могут не работать. Если вы столкнулись с данной проблемой попробуйте сами настроить React Native Firebase.

🏷️ Возможности

• Простая JWT аутентификация
• Firebase Push-уведомления
• Загрузочный экран
• Production и Development сборки
• Поддержка SVG иконок

📋 Требования

• Node.js 12 LTS и выше
• Yarn 1.9 и выше
• Xcode 11.13.1 и выше

✔️ Зависимости

• Push-уведомления: React Native Firebase, Notify
• Загрузочный экран: react-native-splash-screen
• Конфигурация переменных окружения: react-native-config
• Поддержка SVG иконок: react-native-svg
• Всплывающие уведомления: react-native-toast-message
• Хранилище данных: Redux Toolkit, Redux Persist

🚀 Быстрый старт

1. Сoздайте проект

npx react-native init MyApp --template https://github.com/vomikay/react-native-template-typescript.git

2. Создайте новое Firebase приложение

3. Добавьте учетные данные для Android

4. Настройте уведомления для iOS

5. Добавьте учетные данные для iOS

6. Установите зависимости

yarn install
cd ios && pod install

7. Запустите приложение

yarn start
yarn android [ios]

❔ FAQ

Как опубликовать приложение в Google Play Store?

Прежде чем загружать релизную сборку в Play Store, обязательно тщательно ее протестируйте. Сначала удалите любую предыдущую версию приложения, которую вы уже установили. Установите приложение на устройство, используя команду yarn android:release. Далее следуйте инструкции с официального сайта React Native.

Как опубликовать приложение в Apple App Store?

Прежде чем опубликовать приложение в Apple App Store, обязательно тщательно его протестируйте. Установите приложение на устройство, используя команду yarn ios:release или команду Build в Xcode со схемой конфигурации Release. Далее следуйте следующей инструкции.

Как изменить иконку Push-уведомлений?

Инонка Push-уведомлений для платформы iOS должна соответствовать иконке, которая испльзуется для приложения. Соответственно, для того, чтобы изменить иконку Push-уведомлений, нужно заменить иконку самого приложения. Human Interface Guidlines.

Для того чтобы изменить иконку Push-уведомлений на Android, следуйте инструкции библиотеки Notify. Затем необходимо добавить иконку для React Native Firebase:

<!-- android/app/src/main/AndroidManifest.xml -->
<manifest xmlns:tools="http://schemas.android.com/tools">
  <application>
    <!-- ... -->

    <meta-data
      android:name="com.google.firebase.messaging.default_notification_icon"
      android:resource="@drawable/my_notification_icon"
    />
  </application>
</manifest>

На Android в любых сообщениях, отображающих уведомления, не используется цвет для окрашивания содержимого. Чтобы задать собственный цвет оттенка, измените следующие файлы:

<!-- android/app/src/main/res/values/colors.xml -->
<resources>
  <color name="my-custom-color">#123456</color>
</resources>

<!-- android/app/src/main/AndroidManifest.xml -->
<manifest xmlns:tools="http://schemas.android.com/tools">
  <application>
    <!-- ... -->

    <meta-data
      android:name="com.google.firebase.messaging.default_notification_color"
      android:resource="@color/my-custom-color"
      tools:replace="android:resource"
    />
  </application>
</manifest>