phone_picture

Цель курса

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

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

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

7 мая, 20:00 — урок 1

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

14 мая, 20:00 — урок 2

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

По желанию — видеозапись

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

17 мая, 20:00 — урок 3

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

21 мая, 20:00 — урок 4

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

24 мая, 20:00 — урок 5

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

28 мая, 20:00 — урок 6

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

31 мая, 20:00 — урок 7

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

4 июня, 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, предусмотрено дополнительное бесплатное видео, которые охватывает необходимый минимум для понимания TS-кода.

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

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

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

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