React — библиотека, которая перевернула наши представления о том, как разрабатывать фронтенд. В этом курсе мы затронем все аспекты его работы и шаг за шагом, начиная с простых компонентов, дойдем до взаимодействия с бэкендом и интеграции с кодом, написанным без его использования (на jQuery).
Чему вы научитесь:
- Создавать полноценные приложения на React
- Грамотно организовывать состояние приложение
- Взаимодействовать с бекендом по API
- Интегрировать React со сторонними библиотеками
Уроки курса
-
2
Компоненты
Познакомиться с базовой единицей в react — компонентом. Научиться его создавать и отрисовывать в браузере. -
5
Работа с коллекциями
Научиться обрабатывать коллекции данных внутри компонентов. -
6
Различия jsx и html
Узнать об особенностях jsx, которые работают не так как в html. -
7
Обработка имён классов
Научиться правильно работать с классами компонентов, которые могут изменяться динамически.упражнение
-
11
Автоматное программирование
Вспомнить что все вокруг автоматы. Научиться правильно работать с автоматами в React.упражнение
-
13
Неизменяемость
Научиться работать с составными структурами в неизменяемом стиле. Познакомиться с библиотекой `immutability-helper`. -
14
Вложенные компоненты
Разобраться с хранением состояния и управлением событиями во вложенных компонентах. -
15
Функциональные компоненты
Рассмотреть создание компонентов на основе функций и использования пространств имён.упражнение
-
17
Тестирование
Узнать о проблемах, которые поджидают разработчика при работе с исходным кодом. -
18
Асинхронная обработка
Узнать об особенностях работы с объектом событием в асинхронном коде. Попрактиковаться в создании асинхронных обработчиков.упражнение
-
19
Жизненный цикл компонента
Познакомиться с жизненным циклом компонента в процессе работы.упражнение
Испытания
Это практические задания, которые мы советуем выполнить после завершения курса. Задания помогут вам получить дополнительный опыт в программировании и закрепить полученные навыки.
| # | Задание | % завершений |
|---|---|---|
| 1 | Не трогай меня | 76% |
| 2 | Модальные окна | 56% |
Автор
Сооснователь и CEO образовательного проекта Хекслет. Программирую с 2007 года. За это время прошёл путь от разработчика до технического директора и управляющего отдельным подразделением (филиалом). Управлял командами, в которых больше 50 разработчиков.
- Программирую на языках: Elixir, Clojure, JavaScript, PHP, Ruby.
- Соорганизатор конференции Nastachku.ru.
- Вимер.
- Топлю за DevOps и автоматизированные тесты.
Впечатления
Спасибо за отличный курс по React! Раньше для меня Reaсt казался чем то сложным , но после такого досконального объяснения разных мелочей , рад что стал намного лучше разбираться в нем чем раньше. После подробного изучения темы про DOM API , React получилось пройти в два раза быстрее , хотя сама тема в 2 раза больше )))
Спасибо за такие задачи! Очень сильно заставляет поработать с знаниями из всего курса, что очень важно при обучении.
Крутой курс, спасибо!
Чуть-чуть сократил решение учителя. При использовании стрелочной функции this замыкается до компонента и this.onChange(e) отрабатывает правильно.
