Предположения. У вас есть базовые знания ReactJS, но вы все еще новичок в React Native. Вы из тех людей, которые просто хотят погрузиться в изучение React Native, не читая заранее большого количества документации (потому что - для вас - обучение на практике - лучшее!).

Во-первых, что такое React Native? React Native - это платформа JavaScript, с помощью которой мобильные приложения выглядят нативными, независимо от того, работают ли они на iOS или Android. (Как это удивительно?) Способ ее использования аналогичен (хотя и не идентичен) популярной библиотеке Javascript ReactJS. Кроме того, он обладает аналогичными преимуществами, такими как возможность создания многоразовых настраиваемых компонентов.

Теперь приступим к работе с React Native.

  1. Убедитесь, что у вас установлена ​​последняя версия Node.js.
  2. Используйте свой терминал, чтобы перейти к месту, где вы хотите начать свой проект.
  3. Установите Expo CLI с помощью следующей команды:
npm install -g expo-cli

(Что, черт возьми, такое Expo? Это набор инструментов, которые помогут вам начать работу с React Native как можно скорее. Конечно, есть и другие варианты, такие как React Native CLI + Xcode или Android Studio, но чтобы начать работу легко и быстро как новичок, просто придерживайтесь Expo пока.)

4. Затем запустите новый проект с помощью следующей команды.

 expo init NameOfYourProject

Ого, как дела! Вас направят к мастеру с просьбой выбрать шаблон.

Просто нажмите «Enter» для первого варианта «blank: минимальное приложение, чистое, как пустой холст».

5. Теперь перейдите в корневой каталог вашего нового приложения.

cd NameOfYourProject

Сейчас хорошее время, чтобы открыть проект в редакторе кода. Я использую Visual Studio Code и собираюсь набрать «code.» в своем терминале.

6. Запустите сервер разработки.

npm start

В вашем браузере откроется новое окно.

7. Выберите, где вы хотите просматривать свое приложение в процессе его разработки. Вы можете нажать «запустить в веб-браузере», чтобы открыть его в новой вкладке браузера. (Примечание: если ваш терминал запрашивает пароль, введите тот, который вы используете для входа в свой компьютер).

Вы также можете запустить приложение на эмуляторе Android или симуляторе iOS. Если вы загрузите Expo на свое собственное мобильное устройство, вы даже сможете запустить приложение на этом устройстве, привнеся аутентичный мобильный опыт в процесс разработки.

8. Начни кодирование! На скриншоте ниже вы можете увидеть симулятор iOS рядом с стандартным кодом App.jss.

Внесите изменения в содержимое тега «Текст» во время работы сервера.

Как видите, изменения содержимого отражаются в приложении.

9. Остальное зависит от вас! Начни экспериментировать; начать строительство!

Полезные ресурсы

  • Документация React Native
  • Документация ReactJS
  • Node.js, чтобы скачать последнюю версию
  • "Экспо"