docs/nextjs-style-guide

Fork 0

Files

S.Gromov 36304c14f0

CI/CD Pipeline / docker (push) Failing after 38s

Details

CI/CD Pipeline / deploy (push) Has been skipped

Details

docs: обновить разделы на архитектуру SLM Design

- заменены все упоминания FSD на SLM Design в 10 файлах документации
- обновлены слои features/ и entities/ на business/, infrastructure/, ui/
- обновлены таблицы генерации кода и CLI-примеры
- обновлены примеры путей и деревья файлов (naming, project-structure)
- исправлен YAML frontmatter в architecture.md (двоеточие без кавычек)
- перегенерированы RULES.md и README

2026-04-20 10:40:52 +03:00

3.8 KiB

Raw Blame History

title

title
Workflow

Workflow

Порядок действий при разработке — от создания проекта до реализации фич.

Создание проекта

Инициализация нового проекта из готового шаблона.

Создать проект из шаблона:

npx tiged git@gromlab.ru:templates/nextjs.git my-app
cd my-app
npm install

Проект готов к разработке — стек, структура SLM, конфигурация редактора и шаблоны генерации уже настроены.

Генерация кода

Создание модулей из шаблонов .templates/ вместо ручного создания файлов.

Определить тип модуля и соответствующий шаблон:

Модуль	Слой	Шаблон
Компонент	`ui/`	`component`
Бизнес-модуль	`business/`	`module`
Виджет	`widgets/`	`widget`
Layout	`layouts/`	`layout`
Экран	`screens/`	`screen`
Стор	`stores/`	`store`

Сгенерировать модуль из шаблона.
Если подходящего шаблона нет — сначала создать шаблон, затем использовать.

Ручное создание файловой структуры модулей запрещено.

Добавление страницы

Создание нового маршрута: экран + точка входа для роутинга.

Сгенерировать экран из шаблона screen в src/screens/.
Заполнить экран логикой и стилями.
Создать page.tsx в нужном маршруте src/app/.

page.tsx — тонкая обёртка: только metadata и рендер экрана. Логика, стили и хуки размещаются в экране, не в page.tsx.

Добавление UI-модуля

Создание компонента, бизнес-модуля, виджета или layout.

Сгенерировать модуль из соответствующего шаблона в целевой слой.
Заполнить модуль логикой и стилями.
Дочерние компоненты — генерировать из шаблона component в папку ui/ внутри родителя.

Дочерние компоненты не экспортируются через index.ts родителя.

Стилизация

Выбор инструмента стилизации по приоритету.

Использовать Mantine-компоненты и их пропсы.
Если Mantine не покрывает — использовать CSS-токены (--color-*, --space-*, --radius-*).
Если нужна кастомная стилизация — PostCSS Modules.

Инлайн-стили (style), магические значения и глобальные стили вне app/styles/ запрещены.

Получение данных

Раздел в разработке — SWR, генерация API-клиентов, сокеты.

Управление состоянием

Раздел в разработке — когда создавать стор, что хранить локально и глобально.

Локализация

Раздел в разработке — переводы и i18next.

3.8 KiB Raw Blame History