Что такое React?
React - это бесплатная библиотека JavaScript с открытым исходным кодом для создания сложных пользовательских интерфейсов путем разделения приложения на более мелкие компоненты. Она поддерживается Facebook и сообществом разработчиков.
Подготовка перед изучением React
Прежде чем изучать React нужно ознакомиться с HTML, CSS и JavaScript. HTML и CSS можно изучить за 2-3 недели, поскольку они используются для создания макетов веб-приложений. JavaScript требует некоторого времени для освоения, поскольку это язык программирования. Нужно потратить по крайней мере месяц или два на изучение JavaScript. Нужно не просто учить, но и учится создавать небольшие проекты для реализации полученных знаний. Вы можете написать несколько мини-проектов, таких как списки дел, калькулятор, генератор случайных шуток и т.д.
JavaScript
Изучая JavaScript, вы должны не торопиться изучать уже продвинутые концепции (как новичок). Предварительно необходимо изучить много материалов для начинающего разработчика, чтобы вы смогли создать несложные проекты на ванильном JavaScript.
Ниже темы, которые стоить изучить:
- Variables
- If/else conditions and switch statements
- Difference between var, let & const
- Functions
- Arrays
- Array methods like filter, map, reduce etc.
- ES6 Concepts
- Promises
- Callbacks
- Async/await
- Classes and OOPs Concepts
- Working with APIs Again
React
Когда вы изучили базовые принципы JavaScript, можно попробовать погрузиться в React. Для начала изучения вам подойдут официальные учебники React для общего представления о том, как работает React. React Docs очень грамотно написаны и охватывают основы React. Далее представлены темы для изучения, которые позволяет очень глубоко узнать язык.
JSX Components (Functional and Class based) Lifecycle Methods State Props Handling events Forms Conditional Rendering Working with third-party APIs.
Как только вы углубите знания в данных темах, вы можете попробовать создать проект. Можно начать с новых или переделывать уже готовые, которые вы создали во время обучения ванильного JavaScript на React.
Это библиотека маршрутизации для React, которая поможет вам перемещаться по различным страницам в вашем приложении. Она позволяет узнать о загрузке содержимого заданной страницы, передаче параметров в URL, перенаправлении и т.д. Важно понимать, что react router не функцией React, а библиотека маршрутизации, созданная для React.
Когда вы накопили базу знаний, а также попрактиковались над созданием проектов на React, нужно изучать продвинутые концепции, такие как Hooks, Context и т.д. Просмотрите React Docs и изучите эти концепции.
Context Hooks Error Boundaries Higher Order Components Code Splitting Refs Forwarding Refs Render props
Полезные материалыПосле изучения основ React, будет хорошо, если вы изучите дополнительные библиотеки, такие как Material UI, reactstrap, tailwindcss, Semantic UI и др. Данные библиотеки очень помогут при ежедневном написании кода. Однако, не обязательно изучать все подряд, лучшее время для пополнения знаниями, как только вы освоили основы React и сделали первые проекты.
Можно вас похвалить! Вы проделали большой путь 🥳 Вы стали разработчиком React. Теперь вам просто нужно оттачивать свои навыки, создавая проекты и часто обращаясь к React Docs и изучать все новое и новое.
Немного полезных ресурсов для изучения React:Не пытайтесь выучить все сразу, поймите и примите тот факт, что вы новичок и потратьте побольше времени на изучение начальных концепций. Не бойтесь писать плохой код. Как уже говорилось, вы - новичок, в какой-то момент им становится каждый. Поймите, что прогресс >>>> совершенство
Избегайте ада учебников 🤯. Tutorial Hell - это термин, когда вы следуете за учебником за учебником, и вам кажется, что вы учитесь, а на самом деле вы ничему не учитесь. Если вы смотрите учебники на Youtube, не просто смотрите видео за видео. Осознайте, что вы застряли в аду учебников, прекратите смотреть больше видео и начните создавать свои собственные проекты. Больше практикуйтесь.
Сделайте Google, StackOverflow, статьи и блоги своими лучшими друзьями. Начните гуглить свои вопросы, есть большая вероятность, что ваша проблема/ошибка уже была решена кем-то другим в интернете.
Благодарим, что уделили время. Пробуйте и у вас все получится обязательно!
Источник статьи: https://dev.to/