
Библиотека лонгрида
Переиспользуемый контентный слой: редактор блоков и рендер для студента в одном пакете
- React
- TypeScript
- Zustand
- Ant Design
- +5
Редактор образовательных программ: дерево модулей, лонгриды, тесты, публикация
Детали и код закрыты соглашением: описываю задачи и решения без раскрытия внутренностей.

Инструмент, в котором методисты и преподаватели собирают курсы: структура из модулей и уроков, контентный редактор лонгридов, конструктор тестов, проекты и публикация в плеер. Мой самый долгий проект — больше семисот коммитов.
Контекст
Конструктор — точка входа для авторов курсов. Здесь собирается программа: модули, уроки, лонгриды, вебинары, тесты и проекты. Результат уходит в плеер, где его проходят студенты.
Продукт живой: требования появляются от методистов, преподавателей и администраторов, поэтому редактор постоянно обрастает новыми типами контента и правилами.
Задача
Главная сложность редактора — состояние. Дерево курса, черновики блоков, порядок элементов, незакоммиченные правки и валидация живут одновременно, а пользователь ожидает, что ничего не потеряется.
Вторая сложность — общий контент с плеером. Один и тот же лонгрид должен редактироваться в конструкторе и одинаково отображаться студенту, иначе автор не понимает, что увидит группа.
Третья — рост кодовой базы. За несколько лет редактор из набора страниц превратился в большое приложение, и без формальных правил зависимостей связи между модулями быстро запутались бы.
Решение
Конструктор и плеер используют один контентный слой: автор редактирует те же блоки, которые видит студент. Новые типы материалов добавляются, не ломая уже собранные курсы.
Результат
Конструктор — продукт, где я проработал дольше всего и где видно накопленный эффект: структура приложения выдержала несколько волн новых требований, а типовая фича перестала требовать правок в половине кодовой базы.
Этим проектом я горжусь больше остальных: он объединяет и архитектурную работу, и продуктовые сценарии, и переиспользуемую библиотеку, которая живёт своей жизнью в других приложениях.


Переиспользуемый контентный слой: редактор блоков и рендер для студента в одном пакете
Прохождение курса: лонгриды, вебинары, тесты с перетаскиванием, подсказки GPT по выделенному тексту

Каталог курсов на Next.js плюс LMS для студентов, преподавателей и администраторов