Skip to content

NextJS Style Guide

Правила и стандарты разработки на NextJS и TypeScript: архитектура, типизация, стили, компоненты, API и инфраструктурные разделы.

Для ассистентов

Полная документация в одном MD файле: https://gromlab.ru/docs/nextjs-style-guide/raw/branch/main/generated/ru/RULES.md

Структура документации

Workflow

Что делать и в каком порядке — пошаговые инструкции.

РазделОтвечает на вопрос
Начало работыЧто нужно знать перед началом разработки?
Создание проектаКак начать новый проект?
Генерация кодаКакие модули должны генерироваться из шаблонов?
Добавление страницыКак добавить новую страницу в проект?
Добавление UI-модуляКак создать компонент, фичу, виджет, сущность или layout?
СтилизацияКак стилизовать компоненты в проекте?
Получение данныхКак получать данные с сервера?
Управление состояниемКак работать с состоянием?
ЛокализацияКак добавлять переводы и подключать локализацию?

Базовые правила

Каким должен быть код — стандарты, не привязанные к конкретной технологии.

РазделОтвечает на вопрос
Технологии и библиотекиКакой стек используем?
АрхитектураКак устроены слои FSD, зависимости, публичный API?
Стиль кодаКак оформлять код: отступы, кавычки, импорты, early return?
ИменованиеКак называть файлы, переменные, компоненты, хуки?
ДокументированиеКак писать JSDoc: что документировать, а что нет?
ТипизацияКак типизировать: type vs interface, any/unknown, FC?

Прикладные разделы

Как это настроить и использовать — конфигурация, структура и примеры кода для конкретных областей.

РазделОтвечает на вопрос
Настройка VS CodeКак настроить редактор для проекта?
Структура проектаКак организованы папки и файлы по FSD?
КомпонентыКак устроен компонент: файлы, пропсы, clsx, FC?
Page-level компонентыКак описывать layout, page, loading, error, not-found?
Шаблоны и генерация кодаКак работают шаблоны, синтаксис и инструменты генерации?
СтилиКак писать CSS: PostCSS Modules, вложенность, медиа, токены?
Изображения(не заполнен)
SVG-спрайты(не заполнен)
Видео(не заполнен)
API(не заполнен)
Stores(не заполнен)
Хуки(не заполнен)
Шрифты(не заполнен)
Локализация(не заполнен)