на відеозаписі ми будемо детально вивчати технологію, розмірковуючи про підходи до проектування, їх плюси і мінуси. Буде багато прикладів і проектів, тому що в одному проекті важко показати все, що може стати в нагоді в роботі.
В курсі не буде сухих вичавлених відео. Я буду міркувати на основі особистого досвіду. Так що якщо ви любитель сухих відосів, то, напевно, курс вам не підійде.
У конспекті буде вичавка, щоб ви могли швидко освіжити в пам'яті, про що була мова.
програма
- Як працює реактив. Швидкий запуск проекту з create-react-app.
- JSX. Як відтворити компонент: умовний рендеринг, списки та ключі. Тег Fragment. Плагін React-devtools.
- про компонентний підхід у розробці. Створення компонентів. Робота з пропсами. Валідація пропсов.
- стан компонента і коли він потрібен. Односпрямований потік даних. Обробка подій.
- Рефакторинг та архітектура. Правило 100. Куди покласти стан. Контекст реакта.
- навігація по додатку. React-router. Приватні роуты. Редирект і 404 сторінка.
- Як отримати дані з сервера. Різниця між класовим і функціональним компонентом, коли який використовувати. Методи життєвого циклу, коли який використовувати. Обробка помилок в реакті.
- форми. Контрольовані та неконтрольовані компоненти, коли що використовувати. Обробка подій форми.
- рефи. Коли їх використовувати. Робота з нереактівськими бібліотеками в реакті.
- Рефакторинг і патерни в реакті. Контейнер. Компоненти вищого порядку. Рендер пропи. Портал.
- оптимізація та продуктивність. Чому взагалі з'являються лаги. Як знайти просадки в продуктивності. Профайлер реакта і профайлер браузера. Що впливає на продуктивність в реакті і як це поправити.
- Хуки. Що це і навіщо вони потрібні. Коли використовувати хуки, а коли класи.
- Redux. Розуміємо редакс. Middlewares. Запити на сервер з редакції.
- Рефакторинг та архітектура. Селектор. Проектування по фичам. Як зрозуміти, яку архітектуру проектувати.
- бонуси. Спрощення роботи з redux-toolkit. Анімація з react-transition-group. Викочування додатки на github-pages.
- епілог. Підводимо підсумки і будуємо план навчання на майбутнє.
https://privatelink.de/?https://react-from-dima.tilda.ws