Подводные камни React Native

Кроссплатформенные фреймворки, такие как Flutter, Ionic, Cordova, React Native и другие становятся все популярнее среди мобильных разработчиков. Один из самых востребованных кроссплатформенных фреймворков, который используют в своих приложениях ведущие мировые компании – это React Native. О преимуществах этого фреймворка мы недавно уже писали. А в новом материале мы расскажем о том, с какими трудностями столкнулись наши мобильные разработчики в работе над реальными проектами на React Native.

Проблемы с чатом:

Современные мобильные приложения взаимодействуют со сторонними сервисами – Stripe, Facebook, Instagram и др. Далеко не все из перечисленных предоставляют готовые библиотеки для работы с этим фреймворком, что накладывает некоторые ограничения на использование этих сервисов. Так, например, нашему заказчику было необходимо приложение с использованием чата от Twilio.

Однако из-за отсутствия SDK ориентированного конкретно под React Native и готовых библиотек, нам пришлось идти на компромисс и использовать SDK для браузерного JS. Одна из особенностей мобильных приложений – наличие состояния бэкграунда, когда приложение свернуто. Из-за этого используемая нами библиотека не всегда работала верно. Так, например, у нас переставал грузиться чат при переводе приложения в активное состояние. Однако в большинстве случаев использование браузерных библиотек может ускорить процесс разработки и облегчить вам жизнь.

Архитектурные проблемы:

Поскольку работу над проектом мы начали, практически не имея опыта в React Native, вопрос построения правильной архитектуры оставался для нас открытым. Это было необходимо для того, чтобы в последующем код было максимально легко поддерживать и масштабировать.

В первые дни работы над проектом мы писали код на чистом Java Script, не прибегая ни к каким его расширениям. Но позже нам стало понятно, что в работе над такими крупными проектами типизация просто необходима. Использование TypeScript убережет вас от банальных ошибок, связанных с опечатками, сделает код более легким для прочтения и ускорит темпы разработки.

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

Также при первом знакомстве с React Native мы углубились в документацию фреймворка на официальном сайте. В разделе «Getting started» утверждается, что Expo – это самый простой путь, чтоб начать разрабатывать новые React Native-приложения, поскольку большинство полезных функций уже реализовано в нем. Но по мере усложнения проекта нам стало крайне необходимо использовать некоторые нативные решения, что невозможно при работе с Expo. Пришлось переходить на ExpoKit, с которым уже можно использовать нативные библиотеки. Поэтому, рекомендуем начинать разработку уже на основе ExpoKit, а не Expo.

Push-уведомления:

Большинство современных мобильных приложений для оповещения пользователя о каких-то событиях использует push-уведомления. В нашем приложении эта функция была реализована при помощи Expo. Однако оповещения работали не на всех версиях приложения. Для того, чтобы нотификация работала как на Android, так и на iOS нам пришлось реализовать комбинированный способ работы с push-уведомлениями: на iOS мы использовали нативную реализацию, которую предлагает сам React Native, а для Android воспользовались ExpoKit.

Проблема с авторизацией:

Изначально в приложении была реализована возможность авторизации через соцсети, а не с помощью традиционных логина и пароля.

Однако в процессе опытной эксплуатации пользователь столкнулся с трудностями, связанными со сменой аккаунта. Ему приходилось самостоятельно заходить через браузер, чистить кэш для того, чтобы выйти из аккаунта. Библиотека для работы с AWS поддерживала работу с соцсетями только для web-части, но не для мобильной разработки. В конечном итоге по просьбе клиента мы перешли на авторизацию через логин и пароль, что значительно облегчило авторизацию. 

При работе с React Native важно: 

1. Писать не на JS, а на TypeScript. Иначе код сложно читать, поддерживать и расширять;
2. Грамотно выстроить архитектуру приложения с учетом использования библиотек, в т.ч. Redux;
3. Разрабатывать на основе ExpoKit;
4. При возникновении проблем, связанных с использованием библиотек, не стоит бояться модифицировать исходный код, ставить в нем логи.

Хочешь познакомиться с React Native поближе или узнать о других кроссплатформенных фреймворках? Звони (383) 332-44-29, пиши jobs@technologika.ru, подписывайся и следи за обновлениями в наших соцсетях: ВК и FB, Instagram.