React Native установка, настройка инструментария и первый запуск

19 мая, 2018 15:16
Admin
14 августа, 2021 18:15

Доброе время суток, друзья! В этой статье я бы хотел поделиться опытом создания и настройки своего первого приложения на React Native. Зачем вообще может понадобиться React Native, мне кажется объяснять не стоит, но все же хотелось бы сказать пару слов, зачем это понадобилось мне.

В процессе работы у меня появилась вынужденная необходимость создания несложного мобильного приложения, и, с учетом того, что я все время занимаюсь разработкой приложений и сайтов в сети интернет и использую в своей работе, как правило, PHP и Javascript, то создание мобильного приложения для смартфона, да еще к тому же сразу для двух платформ: IOS и Android, для меня показалось сомнительной, хоть и интересной задачей. И, как не удивительно, React Native в моем случае показался единственным реальным и рабочим инструментом, который к тому же осуществляет поддержку достаточно большого количества мобильных устройств. Заявленная поддержка – это Android 4.1 (API 16) и >= iOS 8.0. А это порядка 98% пользователей Android и более 90% пользователей IOS.

Что потребуется для установки React Native, запуска и работы с приложением?

К счастью, запуск и настройка инструментария для создания своего приложения достаточно просты. Все что, потребуется – это скачать приложение для вашего телефона, которое называется Expo, редактор кода и терминал. Данное приложение доступно в Google Play и App Store для скачивания. Если вы не хотите устанавливать данное приложение на ваш телефон, то вы также можете зарегистрироваться на сайте expo.io, где у вас будет возможность разрабатывать ваше приложение через ваш браузер.

Сразу хочу сказать, что когда я скачал данное приложение для IPhone, то для его запуска потребовалось добавить проект в "мои проекты" на expo.io. На Android все было проще, поскольку было достаточно просканировать QR код, который любезно сгенерировала мне утилита create-react-native-app.

Важно: требуется понимать, что у вас должен быть установлен node.js на вашем компьютере и npm.

Наши дальнейшие действия таковы:

  • 1 — заходим в терминал и устанавливаем create-react-native-app глобально, если он не установлен, командой: npm install -g create-react-native-app
  • 2 — затем создаем проект вводом команды: create-react-native-app MyApp
  • 3 — переходим в папку проекта: cd MyApp
  • 4 — запускаем проект: npm start

Примерный результат запуска приложения на вашем устройстве (рис.1)

Рис.1 react native

Все готово. Теперь можно сгенерировать QR код для вашего телефона, просканировать его и можно писать нативное приложение на Javascript для ваших мобильных устройств.