phone_picture

Цель курса

Рассмотреть решение главных задач, возникающих при создании Single Page Application, таких как построение архитектуры приложения, Server Side Rendering, тестирование кода и т.п.

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

Программа курса

Программа примерная, возможны перестановки тем по урокам.

7 сентября, 20:00 — урок 1

  • Анализ SPA после React Level 1
  • Улучшение архитектуры приложения
  • Борьба в модулями-синглтонами
  • Выделение ключевых сервисов
  • Взаимодействие частей системы

11 сентября, 20:00 — урок 2

  • Удобная работа с http (axios | fetch)
  • Глобальная обработка http-ошибок
  • Отображение http-ошибок и fallback-данные
  • Нюансы работы с React Context
  • Адекватное внедрение зависимостей

12 сентября, 20:00 — по желанию

  • Дополнительный бесплатный урок
  • Минимальные основы TypeScript
  • Использование TypeScript с React
  • Типизация компонентов и хуков
  • Типизация хранилища mobx

14 сентября, 20:00 — урок 3

  • Тотальная типизация SPA
  • TypeScript: простые и жёсткие примеры
  • Создание ключевых хуков
  • Нюансы работы с Mobx
  • Создание обёртки над React Router Dom

18 сентября, 20:00 — урок 4

  • Улучшение тренировочного SPA
  • Изучение серверного API
  • Работа с авторизацией
  • Создание модуля store user
  • Создание закрытых страниц

25 сентября, 20:00 — урок 5

  • Идеи Server Side Rendering
  • Сервер на node.js + express
  • SSR шаг за шагом на простом примере
  • Client и server entries
  • Настройка vite config

28 сентября, 20:00 — урок 6

  • SSR в более сложном SPA
  • Работа с роутером и хранилищем
  • Проблема асинхронных компонентов
  • Гидратация клиентской части
  • Наполнение базового шаблона

2 октября, 20:00 — урок 7

  • Схемы дополнительной оптимизации
  • Настройка кода ответа сервера
  • Предзагрузка данных и состояния
  • Выборочный SSR для страниц
  • Кэширование страниц

5 октября, 20:00 — урок 8

  • Основы работы с vitest
  • jsdom + @testing-library/react
  • Тестирование компонентов
  • Тестирование хранилища
  • End 2 end тесты

В итоге мы создадим простое SPA, зато

  • Написанное на typescript
  • С адекватной архитектурой
  • С простым и ненапряжным SSR
  • Готовое к тестированию
  • Позволяющее внедрить mock любого сервиса

Преподаватель курса

Дмитрий Лаврик

Профессиональный веб-разработчик

Опыт работы в сфере разработки сайтов более 10 лет. Ориентируется во всех вопросах создания сайтов, от вёрстки до backend-а.

Опытный преподаватель

Начиная с 2011 года, под его руководством тысячи учеников прошли путь от новичков до успешных веб-программистов. Если вы ещё не знакомы с Дмитрием, рекомендуем заглянуть на его youtube-канал, где вы найдете много полезных видео и сможете узнать стиль преподавания Дмитрия.

Дмитрий Лаврик

Что вы получите

8 онлайн уроков

По понедельникам и четвергам с 20:00 МСК. Продолжительность каждого занятия около двух часов. На уроках разбираются домашние работы учеников и новый материал.

Видеозаписи всех уроков

Если вы по какой-то причине не смогли посетить урок, не переживайте, спустя пару часов после окончания занятия он доступен в записи в хорошем качестве :)

Материалы и исходники

Все примеры, которые мы рассматриваем на уроках, вы получаете в архиве. Таким образом, даже не написав ни строчки кода, вы получаете набор готовых решений, сделанных на уроке.

Домашние задания

После каждого урока выдаётся домашнее задание, которое нужно сделать для закрепления пройденного материала. Плохие оценки не ставим – только конструктивные комментарии :)

Обратную связь от преподавателя

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

Доступ в закрытую группу

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

Обзор курса

Внимание! Для прохождения данного курса необходимо уметь создавать простые SPA на React + любой router + любое хранилище + axios || fetch.

Если вы хотите ознакомиться с мыслями автора о курсе,

посмотрите видео, расположенное рядом

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

Запись на курс

Курс уже стартовал!

18 000 руб. 12 600 руб.

Присоединяйтесь!

 
Способы оплаты

Часто задаваемые вопросы

Какой начальный уровень знаний необходим

Уровень программы базового курса React - умение создавать простейшие SPA, взаимодействовать с серверным api ( axios | fetch )

Будут ли записи уроков

Да, конечно. Видеозапись и материалы выкладываются в течение нескольких часов после окончания урока.

Зачем TypeScript в курсе по React

Статический анализ кода даёт слишком много преимуществ. Да и примерно половина вакансий по React сейчас содержит пункт про TypeScript.

А что если я совсем не знаю TypeScript

Для тех, кто не знает TypeScript, предусмотрено дополнительное бесплатное занятие между вторым и третьим уроками.

Почему Mobx, а не Redux

Мы берём самый простой и приятный store. А в итоговом SPA заменить его на Redux или Recoil будет совсем несложно.

Но ведь Redux популярнее

Да, популярнее. Но схема с Redux + Redux Toolkit сложнее, планирую сделать по ней отдельный мини-курс на два-три урока.

Почему в расписании пропуск 21 сентября

Небольшой перерыв ровно в середине курса точно не помешает.

Будут ли ещё потоки этого курса

Будут, но, точно, не скоро. Сложные курсы стартуют один-два раза в год.