ЛентаСтатьиЗаметкиКурсы
Рецепты

UI Kit Architecture

Проектирование дизайн-системы и FSD-приложения: токены, компонентные API, Effector, контракты OpenAPI + Zod, PWA и измеримые KPI.

Состав трека

  1. 1
    UI Kit и мессенджер на React + Effector + Next.js

    Проектирование UI Kit как npm-библиотеки, FSD-приложение на Next.js App Router, контракты OpenAPI+Zod, Effector, Storybook, PWA, Go-мост и измеримые KPI (Lighthouse, size-limit, coverage)

О треке

Трек об архитектуре UI-китов: токены и темизация, компонентные API, версионирование npm-пакета, Storybook как каноническая галерея — и приложение на FSD-слоях, которое собирается поверх кита.

Состав трека

«UI Kit и мессенджер на React + Effector + Next.js» — сквозной курс: от дизайн-токенов и примитивов через Effector, формы и виртуализацию списков до PWA, Core Web Vitals и Go-моста. Результат — публикуемый пакет @myorg/ui-kit и работающий мессенджер на его основе.

Где живёт кит

В команде UI Kit не лежит «рядом с проектом»: он подключается внутрь FSD-каркаса и занимает слой shared, а фичи и виджеты собираются над ним. Правило слоёв — импорт только вниз: app → widgets → features → entities → shared.

Продолжение на боевом стеке — трек «Мессенджер на Go + React»: те же слои и тот же кит, но вместо mock-API — Go-бэкенд с PostgreSQL и WebSocket (список диалогов и чат с realtime).