phone_picture

Цель курса

Полностью разобраться с темой Server Side Rendering для SPA: освоить ключевые идеи, привыкнуть к правилам игры на frontend и backend, реализовать удобную заготовку для SSR без Nuxt, Next и т.п.

Задача-максимум — создание за время курса open-source пакетов для SSR на Vue и React.

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

Vue и React совмещены в одном курсе, так как более половины тем, связанных с SSR, для них являются общими. Мы реализуем полноценный и удобный SSR для каждого из фреймворков.

урок 1

  • Теория Server Side Rendering
  • Серверная и клиентская точки входа
  • Жизненный цикл приложения
  • Архитектурные подставы SSR
  • Борьба с синглтонами на уровне ES-модулей
  • Реализация простейшего SSR

урок 2

  • Создание SSR dev-сервера с Vite
  • Статические ресурсы и внешний шаблон
  • Создание контейнера зависимостей
  • Знакомство с AsyncLocalStorage
  • Изоморфный DI на клиенте и сервере
  • Роутинг в SSR режиме

урок 3

  • Получение данных от API
  • Создание hook / composable useAsyncData
  • Жёсткая типизация
  • Ожидание асинхронных данных
  • Suspense + await во Vue
  • Suspense + use в React

урок 4

  • Создание компонента Async Helper
  • Нюансы гидратации SPA
  • Асинхронные данные и проблемы гидратации
  • Проброс кэша через HTML
  • Генерация кэширующего ключа
  • Инвалидация кэша

урок 5

  • Функции API и паттерн репозиторий
  • Ключ выборки функции как метка кэша
  • Феерическая типизация с Dot Key
  • SSR и авторизация пользователей
  • Правильное взаимодействие router и store
  • Игнорирование auth / guest страниц

урок 6

  • Обработка ошибок при SSR
  • Генерация SEO тегов
  • Работа с глобальными данными
  • Проброс состояния хранилища
  • Улучшение производительности SSR
  • Механики серверного кэша

урок 7

  • Создание репозитория универсальных помощников
  • Публикация на npm и github
  • Доработка чистовика системы под Vue
  • Вынесение Vue-кода в отдельный репозиторий
  • Применение библиотеки в проекте

урок 8

  • Доработка чистовика системы под React
  • Решение проблемы промигивания Suspense
  • Фейковый Response для renderToPipeableStream
  • Вынесение React-кода в отдельный репозиторий
  • Применение библиотеки в проекте

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

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

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

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

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

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

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

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

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

В хорошем качестве с возможностью скачать видео. Продолжительность каждого занятия около двух часов. На уроках разбираются домашние работы учеников и новый материал.

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

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

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

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

Обзор курса

Внимание! Для прохождения данного курса необходим хотя бы небольшой опыт в создании SPA на Vue или React, а также понимание базовых тем создания backend на NodeJS.

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

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

Также в данном видео рассказывается о том, почему самописный SSR иногда может быть проще Nuxt / Next.

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

Доступно в формате видеозаписей

со свежего потока (март 2026)

21 000 руб. 10 500 руб.

Хотите цену ещё лучше?
Летняя акция!
 
Способы оплаты

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

Правильно ли смешивать Vue и React

Думаю, что да. Темы Server Side Rendering находятся между frontend и backend, минимум 50% теории и кода для Vue и React будут общими.

Почему желательны знания backend

Потому что SSR осуществляется в среде NodeJS в момент запроса пользователя к серверу. То есть часть кода придётся писать на Node.

Что за идея с open-source пакетами

Как показала практика, самописный SSR неудобно таскать из проекта в проект, вот и хочется сделать библиотеку. Подробный рассказ об этом есть в видео.

Отличается ли это от старых курсов Vue 2 / React 2

Безусловно. Там Server Side Rendering соседствовал с другими темами и всегда получался не доведённым до ума на 100%.

Чем не устраивают Nuxt / Next

Прекрасные инструменты. Но порой разработчика могут не устраивать их архитектурные принципы. К тому же, никто не отменял внедрения SSR в готовый проект, написанный на чистом Vue / React.

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

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