Как создавать и распространять любое приложение React Native с помощью New Expo Services

Как создавать и распространять любое приложение React Native с помощью New Expo Services

Software Mansion активно участвует в выставке Expo с 2017 года. Помимо работы над частями Expo с открытым исходным кодом, такими как модули Expo и интерфейс командной строки Expo, мы помогаем создавать и поддерживать инфраструктуру Expo. Одним из достижений, которым мы гордимся, является наша работа над сервисом сборки Expo.

Экспо анонсировала EAS Build в прошлом году. Сервис позволяет создавать и подписывать любой проект React Native для платформ Android и iOS из любой операционной системы (даже из Windows!). С момента первого выпуска сервис прошел долгий путь, чтобы стать общедоступным в ноябре 2021 года. EAS Build поставляется с бесплатной услугой EAS Submit, которая делает тяжелую работу, когда вы решаете поделиться своим приложением с широкой аудиторией или просто отправляете другую сборку в магазин. Новый инструментарий — EAS CLI — легко интегрируется с вашим проектом Expo. Вы быстро сочтете, что это еще одна кнопка быстрой перемотки вперед от команды Expo.

В этом сообщении блога я хотел бы показать, как использовать все новые функции, которые EAS Build и EAS Submit привносят в экосистему Expo. После нескольких минут чтения вы сможете создавать и распространять любой проект React Native, используя всего несколько простых команд.

Создание нового проекта

Давайте создадим проект, который использует Bluetooth для поиска ближайших устройств. Добавление поддержки Bluetooth было одной из самых популярных функций, запрашиваемых мобильными разработчиками, использующими Expo. Expo по-прежнему не предоставляет собственного модуля Bluetooth, но вы можете интегрировать любой сторонний пакет npm, например react-native-ble-plx, с вашим приложением на основе Expo с минимальными усилиями.

В отличие от классической службы сборки Expo (expo build:[android|ios]), EAS Build поддерживает создание проектов React Native с помощью собственного собственного кода. Вы даже можете создать проект для Android или iOS, который вообще не использует React Native, но это нерекламируемая функция, требующая небольшой доработки.

Я инициализировал свой проект с помощью expo init и выбрал голый шаблон. Голый шаблон включает нативные проекты Android и iOS. Это позволило мне установить и настроить пакет react-native-ble-plx, который является одним из самых популярных вариантов Bluetooth в React Native.

После добавления кнопки для запуска/остановки сканирования ближайших устройств, интеграции с Bluetooth и отображения списка устройств приложение готово к распространению.

Вы можете найти исходный код приложения на https://github.com/dsokal/bluetooth-scanner.

Начните использовать ЭАС

Использование EAS Build & Submit не требует слишком большой настройки. Все, что вам нужно, это новый интерфейс командной строки под названием EAS CLI. Вы можете установить его, как и любой другой пакет npm — npm install -g eas-cli.

Установка CLI — это первый шаг. Второй и последний шаг — настройка проекта для сборки с помощью EAS Build. Запустите eas build:configure и выберите, какие платформы вы хотите настроить. Совет. Кроме того, вы можете просто запустить eas build, чтобы настроить проект и начать сборку.

Сборка и отправка EAS настраиваются с помощью файла eas.json. EAS CLI использует концепцию профилей сборки/отправки, так что вы можете один раз определить свои рабочие процессы разработки и производства, а затем переключаться между ними с помощью параметра --profile PROFILE_NAME. По умолчанию eas.json выглядит примерно так:

Он поставляется с предопределенными профилями сборки, которые позволяют вам использовать самые мощные функции Expo/EAS: Сборки для разработки, Внутреннее распространение и управление учетными данными.

Сборки разработки

Разработка мобильных приложений может быть разочаровывающей. Сборка вашего приложения для Android или iOS может занять несколько минут, и когда вы впервые начнете создавать свое приложение, вам придется довольно часто перестраивать проект. Сам React Native может стать ответом на эту проблему. Обычно вам не нужно трогать нативный код, вместо этого вы изменяете код JavaScript. Из-за этого (пере)сборка нативного проекта не занимает много времени.

Когда вы начинаете свой проект мобильного приложения в Expo, у вас есть отличный инструмент под названием Expo Go. Это позволяет вам разрабатывать приложение без необходимости создавать нативные проекты. Установите приложение на свой телефон, запустите expo start в каталоге проекта, отсканируйте QR-код и приступайте к разработке. Каждый раз, когда вы меняете код, приложение обновляется в мгновение ока.

Проблема с Expo Go заключается в том, что он поставляется с предустановленным набором нативных модулей. Это хорошо для многих случаев использования мобильных приложений, но может иметь ограничения. Если вы хотите использовать пользовательский модуль (например, react-native-ble-plx), вы не сможете должным образом протестировать свое приложение с помощью Expo Go. Сборки для разработки — это решение проблемы. Вы можете создать собственное клиентское приложение, похожее на Expo Go, которое будет содержать все нативные модули, необходимые вашему приложению. Кроме того, в отличие от приложения Expo Go, сборка для разработки не будет включать все модули Expo, которые вы не используете. Это делает ваше пользовательское клиентское приложение легким и приближенным к вашей производственной среде.

Чтобы использовать сборки для разработки, установите пакет expo-dev-client в свой проект, следуйте инструкциям на странице (только при использовании чистого рабочего процесса), а затем запустите eas build --profile development. При сборке для iOS вам потребуется зарегистрировать устройство в EAS, прежде чем оно сможет запускать ваше приложение через внутреннее распространение. Этот шаг описан в следующем параграфе. Имейте в виду, что сборки для разработки все еще находятся в предварительной версии!

Внутреннее распространение

Всякий раз, когда вы работаете над новой функцией для своего приложения, вы хотите убедиться, что она работает так, как задумано. Обычно это включает в себя создание вашего приложения и совместное использование его с командой контроля качества. Несмотря на то, что на Android задача достаточно проста (вам просто нужно собрать APK вместо AAB), на iOS при использовании TestFlight возникает несколько проблем:

• Время обработки вашей новой сборки может занять до 30 минут.
• TestFlight может одновременно иметь только одну активную сборку.
• Приложение TestFlight необходимо установить на iPhone/iPad.

EAS Build упрощает процесс создания приложений для внутреннего использования с помощью внутреннего распространения. Просто установите "distribution": "internal" в профиле сборки (или используйте предопределенный профиль сборки — preview), и вы сможете поделиться своей сборкой с кем угодно в течение нескольких минут.

На iOS вам также потребуется зарегистрировать все устройства (iPhone и iPad) с помощью eas device:create, но это так же просто, как сканирование QR-кода и выполнение инструкций, отображаемых на экране.

Когда вы зарегистрируете все свои устройства, запустите eas build --profile preview, и вы получите общий URL-адрес для своей сборки (и QR-код). Откройте его на любом из зарегистрированных устройств и начните тестирование приложения одним нажатием кнопки установки.

Создание приложения для публичного распространения

Когда придет время (и команда QA одобрит последнюю сборку), вы захотите распространить приложение в Google Play Store и Apple App Store. EAS Build пригодится не только вам, но и всей вашей команде. Вы настраиваете проект один раз, и от этого выигрывает вся команда. Каждый, кто добавлен в организацию Expo, может запускать сборки так же, как и человек, настроивший проект. Точно так же, используя ту же самую команду, вы можете запустить сборку из CI. Кроме того, при создании мобильного приложения вам иногда нужно быть экспертом по учетным данным, необходимым для подписи вашего приложения (вам нужно знать, что такое сертификат распространения, профиль подготовки, ключ push-уведомлений, хранилище ключей и т. д.).

EAS Build позволяет создать собственный проект в облаке, в уже настроенной среде, а также позаботится об управлении учетными данными. Это означает, что вам не нужно устанавливать Android Studio и Xcode на свой компьютер. Вам даже не нужен Mac для создания приложения для iOS. Наконец, вам не нужно знать, что такое хранилище ключей и даже как его создать.

Создание проекта React Native для распространения в магазине — это просто запуск eas build в каталоге проекта. Интерфейс командной строки EAS проведет вас через весь процесс управления учетными данными и распечатает URL-адрес страницы сведений о сборке, где вы сможете отслеживать ход сборки и просматривать журналы сборки. Когда сборка завершится, вы получите URL-адрес артефакта сборки.

Отправка приложения в App Store

У вас есть архив приложений, готовый к отправке в магазин приложений. EAS Submit может помочь вам с этой задачей. Если вы использовали EAS Build для сборки проекта, вы будете удивлены тем, насколько легко отправить последнюю сборку в магазин приложений. В то же время EAS Submit также поддерживает загрузку приложений, созданных в другом месте.

Единственное ограничение процесса отправки приложения заключается в том, что вам придется загрузить свою первую сборку Android в Google Play Store вручную. Это ограничение Google Play Store, которое, надеюсь, будет преодолено в будущем. iOS-часть задачи более проста — вы можете загрузить свою первую сборку в Apple App Store без ручного вмешательства.

Запустите eas submit -p PLATFORM --latest, чтобы отправить последнюю сборку в магазин приложений. Если вы раньше не использовали EAS Submit, EAS CLI запросит у вас учетные данные Apple ID (для создания ключа API) или Ключ учетной записи службы Google. Если вы решите хранить ключи API на серверах EAS, все последующие отправки будут уже предварительно настроены.

Автоматизация процесса сборки и отправки

Как вы уже видели, EAS Build & Submit может упростить рабочие процессы разработки приложений для вас и вашей команды. Однако это еще не все, что может предложить EAS. Вы можете дополнительно автоматизировать свои рабочие процессы с помощью автоматической отправки сборки. То есть вы можете указать EAS отправить ваше приложение в соответствующий магазин приложений при успешной сборке проекта. Для этого запустите сборку так же, как и раньше, но добавьте флаг --auto-submit. Если вы хотите создать свой проект как для Android, так и для iOS, а затем загрузить сборки в магазины приложений, запустите eas build -p all --auto-submit и наслаждайтесь чашечкой кофе — об остальном позаботится EAS.

Если предоставляемые EAS автоматические отправки недостаточно гибки для вас, вы всегда можете воспользоваться сборкой/отправкой вебхуков. Вы можете создать HTTP-сервер, выставить API в Интернет и зарегистрировать его с помощью eas webhook:create. Ваша конечная точка API будет вызываться со всеми соответствующими метаданными при каждой успешной или неудачной сборке/отправке. Вы можете, например, реализовать свою собственную логику, которая будет загружать сборку Android в альтернативные магазины, которые еще не поддерживаются EAS.

Сосредоточьтесь на важных вещах

Создание и отправка проектов Expo/React Native никогда не было проще, чем сейчас. В сообществе всегда был вопрос, на который нет хорошего ответа — «Должен ли я использовать Expo или React Native?». Теперь ответ кажется очевидным — «Это не имеет значения, но Expo — правильный выбор, если вы хотите сэкономить время». С EAS Build & Submit вы можете сосредоточиться на самом важном для успеха вашего мобильного приложения — на самом приложении.