React - это бесплатная внешняя библиотека JavaScript с открытым исходным кодом для создания сложных пользовательских интерфейсов путем разделения приложения на более мелкие компоненты. Он поддерживается Facebook и сообществом разработчиков.

Предпосылки для изучения React

Прежде чем изучать React, мы бы посоветовали ознакомиться с HTML, CSS и JavaScript. Вы можете изучить HTML и CSS в течение 2-3 недель, поскольку они используются для создания макетов для  веб-приложений. На освоение JavaScript требуется время, поскольку это язык программирования. Потратьте как минимум месяц или два на изучение JavaScript. Нужно не просто учиться, но и все время практиковаться, создавая небольшие проекты для реализации полученных знаний. Вы можете создавать мини-проекты, такие как списки дел , калькулятор , генератор случайных шуток и т. д.

JavaScript

Изучая JavaScript, вы должны избегать некоторых ошибок. Часто новички, когда  изучают JavaScript, я думают, что они должны стать абсолютными мастерами JavaScript, чтобы писать код React (что бессмысленно). Изучая продвинутые концепции (как новичок), и потерпев неудачу, могут подумать, что недостаточно хороши. Но, как новичку вам нужно выучить ровно столько, чтобы вы могли создавать базовые проекты на ванильном JavaScript. Некоторые темы для изучения и глубокого понимания:

1. Переменные
2. Условия if / else и операторы переключения
3. Разница между var, let и const
4. Функции
5. Массивы
6. Методы массива, такие как filter , map , reduce и т. д.
7. Концепции ES6
8. Promises
9. Обратные вызовы
10. Концепции классов и ООП
11. Работа с API 

Опять же, не просто учите, ПРИМЕНЯЙТЕ !!!

React

На данный момент, когда вы изучили основы JavaScript, вам пора погрузиться в React. Вы можете начать изучение React, просмотрев официальную документацию React или воспользовавшись официальным руководством по React. 

React Docs очень хорошо написаны, охватывая основы React. Изучите эти темы очень хорошо, чтобы понять React фундаментально.

1. JSX
2. Компоненты (функциональные и классовые)
3. Методы жизненного цикла
4. Состояние
5. Обработка событий
6. Формы
7. Условный рендеринг
8. Работа со сторонними API.

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

React Router

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

Продвинутый React

Теперь, когда у вас есть базовые знания React, а также созданы некоторые базовые проекты, пришло время изучить некоторые продвинутые концепции, такие как хуки , контекст и т. д. Взгляните на React Docs и изучите эти концепции.

1. Контекст
2. Хуки
3. Границы ошибок
4. Компоненты высшего порядка
5. Разделение кода
6. Ссылки
7. Пересылка ссылок
8. Рендеринг реквизита

Дополнительно

Вы  можете изучить некоторые дополнительные библиотеки , как Material UI , reactstrap , tailwindcss , Semantic  UI и т.д. Эти библиотеки помогут вам в повседневной работе React Dev. Однако не обязательно изучать все, вы можете попробовать изучить их, когда закончите с основами React и сможете создавать проекты.

Поздравляем

Вы разработчик React. Теперь вам просто нужно отточить свои навыки, создавая проекты, часто посещая React Docs и узнавая что-то новое.