Независимо от того, являетесь ли вы новичком в React Native или используете фреймворк в течение многих лет, всегда есть чему поучиться. Эта мощная мобильная платформа на основе JavaScript позволяет брать код, который не будет неуместен на веб-сайте, и превращать его в собственное мобильное приложение.

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

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

• 

  9 лучших шаблонов приложений React Native в 2019 году

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

  Начало работы с собственным шаблоном приложения MStore Pro React

  В этом руководстве я покажу вам пример использования шаблона приложения eCommerce React Native для ускорения разработки вашего следующего мобильного приложения.
• 

  9 шаблонов React Native для изучения и использования

  Проверьте эти 9 приложений React Native, шаблоны приложений и библиотеки компонентов от Envato Market. Они помогут вам ускорить свое развитие, будь вы …
• 

  Понимание собственных компонентов, шаблонов и инструментов React

  Вы строите проект с использованием React Native? Проверьте некоторые из лучших инструментов и шаблонов, которые помогут сделать ваш проект успешным!

О React Native Framework

Мобильные приложения существуют уже давно, но недавнее появление основанных на JavaScript каркасов приложений полностью изменило игру. В то время как существует целый ряд различных фреймворков, React Native стал одним из крупнейших претендентов в этой области, предоставляя приложения-гиганты, такие как Facebook, Instagram, Discord, AirBnB и еще сотни (если не тысячи).

Почему React Native стал популярным разработчиком приложений?

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

Теперь, когда мы немного поговорили о важности React Native, давайте рассмотрим первый шаг в пути к React Native — освоение JavaScript.

Перед началом работы с React Native

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

Хорошее место для начала — серия курсов «Практика JavaScript и изучение», которые помогут быстро определить основы JavaScript:

• 
  JavaScript
  Практикуйте JavaScript и учитесь: DOM
  Джереми МакПик
• 
  JavaScript
  Практикуйте JavaScript и учитесь: объектно-ориентированное программирование
  Джереми МакПик
• 
  JavaScript
  Практикуйте JavaScript и учитесь: функции
  Джереми МакПик

Затем вы захотите расширить свои знания, чтобы включить современные основы JavaScript, и, наконец, закрепить свои знания, выполнив несколько проектов:

• 
  JavaScript
  Основы современного JavaScript
  Дэн Веллман
• 
  JavaScript
  3 JavaScript-проекта для начинающих
  Крейг Кэмпбелл

После того, как вы пройдете через это (или, если вы уже знаете немного JavaScript), вам захочется воспользоваться React. React — это JavaScript-фреймворк, который служит основой для React Native и имеет ряд сходств, включая его структуру и зависимость от компонентов.

Когда вы отключите React, вы сможете применить большую часть этой информации к приложению React Native. Если вы уже знакомы с JavaScript и другими фреймворками, не стесняйтесь переходить к изучению React Native.

Для остальных из нас, ознакомьтесь с этими курсами по основам React:

• 
  реагировать
  Основы практической реакции
  Дерек Дженсен
• 
  реагировать
  Современные веб-приложения с React и Redux
  Эндрю Берджесс
• 
  реагировать
  Мышление в действии: методы жизненного цикла компонентов
  Эндрю Берджесс

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

Реагируйте на основы

Мы выполнили все наши предварительные условия, так что теперь пришло время покопаться.

React Native состоит из двух ключевых частей, которые мы хотим решить в первую очередь: его архитектура и использование компонентов. Компоненты часто представляют собой отдельные фрагменты кода или пользовательского интерфейса, построенные по модульному принципу, так что их можно использовать несколько раз в приложении (или даже легко добавлять в другие программы). Они обычно привязаны к элементам экрана, таким как экраны входа в систему, кнопки или другие взаимодействия. Использование этих компонентов в качестве основных строительных блоков приложения дает React Native уникальную архитектуру.

Эта архитектура означает, что элементы часто разделяются, так что их функциональность и пользовательский интерфейс разделяются. Затем они группируются в экраны, каждый из которых представляет буквальный экран, показываемый пользователю. Эта структура облегчает отладку кода, повторное использование компонентов между экранами и перезапись компонентов для использования в новых целях.

Сначала вы можете ознакомиться с этой статьей о React Native Ecosystem, чтобы понять, какие существуют все инструменты, среды и другие полезные ресурсы. После этого этот курс « Начало работы с React Native» научит вас многим основам, таким как настройка среды, работа с JSX и многое другое. Наконец, попробуйте собрать собственный компонент, следуя инструкциям этого руководства по созданию компонента календаря с помощью React Native .

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

Создание полных приложений с React Native

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

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

Хорошее место для начала — это немного углубить ваше понимание JSX и React, пройдя курс глубокого погружения, который позволит пролить больше света на их функциональность:

• 
  реагировать
  Мышление в действии: JSX Deep Dive
  Эндрю Берджесс

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

Вот хороший старт на некоторых из лучших, доступных через Envato:

• 
  Мобильное приложение
  9 лучших шаблонов приложений React Native в 2019 году
  Нона Блэкман
• 
  React Native
  Начало работы с собственным шаблоном приложения MStore Pro React
• 
  реагировать
  9 шаблонов React Native для изучения и использования
  Эрик Дай

Как только вы соберете несколько проектов самостоятельно, пришло время перейти к более сложным частям React Native.

Продвинутые методы и особенности React Native

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

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

• 
  React Native
  Создайте социальное приложение с React Native
  Маркус Мюльбергер

Если вы хотите углубиться в конкретную тему, их много.

Хорошим началом будет быстрое использование Expo для работы с проектами и упрощение тестирования и развертывания:

• 
  React Native
  Проще реагировать на развитие с помощью Expo
  Верн Анчета

Вы также можете узнать, как подключить ваше приложение к расширяемому популярному бэкэнду, такому как AWS:

• 
  Мобильная разработка
  Заряжайте свое приложение React Native с помощью AWS Amplify
  Надер Дабит

Или, посмотрите некоторые из этих более продвинутых курсов по React и React Native:

• 
  реагировать
  6 ультрасовременных курсов реагирования
  Эндрю Блэкман

Построение Вашего Реального Родного Путешествия

Как и любой язык или фреймворк в программировании, вы никогда не закончите. По мере того, как вы продвигаетесь по пути, все время появляются новые функции, и сложные крайние случаи дают о себе знать. Из-за этого ваш путь к обучению может отличаться от чужого.

Как ты изучил React Native? Какие ваши любимые ресурсы для обучения и совершенствования в разработке приложений? Дай мне знать!