S.Gromov
e835210d6d
- Добавлен обзор REST с разделением на «Создание клиента» и «Использование» - Добавлена страница создания клиента с описанием структуры модуля - Переписана автогенерация: npx без --swr, расширения типов вынесены в types/ - Ручной клиент сокращён до шаблона по файлам - Добавлены GET-хуки REST-клиента с контрактом useGet..., key-функциями и isReady - Добавлена страница выбора стратегий с приоритетом ISR перед SSR - Добавлены стратегии: серверный await, параллельные запросы, передача промиса, начальные данные для клиентских хуков, клиентский GET-хук, business-композиция - Уточнено влияние серверного await и SWR fallback на режим рендера - Удалены устаревшие страницы fetching/server.md и fetching/client.md - Обновлён generate-llms.ts: очистка stale-файлов перед копированием - Обновлены сайдбар, MAP.md, data/index.md, page-level.md
NextJS Style Guide
Стандарты разработки фронтенд-приложений на Next.js и TypeScript.
Сайт: https://nextjs-style-guide.gromlab.ru
Использование
Для AI-агентов:
- llms.txt — Карта разделов, оглавление со ссылками на разделы.
- llms-full.txt — Вся документация одним файлом.
Для проекта:
- nextjs-style-guide.zip — Набор Markdown-файлов для распаковки в
./ai/nextjs-style-guide/или другую папку проекта.
Структура документации
Подсказки
Подсказки — короткие ответы на типовые вопросы и решения для спорных ситуаций.
Базовые правила
Каким должен быть код — стандарты, не привязанные к конкретной технологии.
| Раздел | Отвечает на вопрос |
|---|---|
| Технологии и библиотеки | Какой стек используем? |
| Именование | Как называть файлы, переменные, компоненты, хуки? |
| SLM Design | Что такое SLM и зачем она нужна? |
| Архитектура: Слои | Какие слои есть и как между ними устроены зависимости? |
| Архитектура: Модули | Что такое модуль и как он устроен? |
| Архитектура: Сегменты | Какие сегменты есть внутри модуля? |
| Стиль кода | Как оформлять код: отступы, кавычки, импорты, early return? |
| Документирование | Как писать JSDoc: что документировать, а что нет? |
| Типизация | Как типизировать: type vs interface, any/unknown? |
Создание проекта
Как начать новый проект — варианты установки и эталонный набор инструментов.
| Раздел | Отвечает на вопрос |
|---|---|
| Создание проекта из шаблона | Как начать проект из готового шаблона? |
| Создание проекта вручную | Как поднять проект с нуля без шаблона? |
| Чистая установка Next.js | Как поставить голый Next.js под дальнейшую сборку? |
Настройка
Как сконфигурировать проект — пошаговая настройка инструментов и инфраструктуры.
| Раздел | Отвечает на вопрос |
|---|---|
| Алиасы импортов | Как настроить алиасы импортов? |
| Biome | Как настроить линтер и форматтер? |
| PostCSS | Какие плагины PostCSS нужны и как их настроить? |
| Стили | Как подключить базовые стили и токены? |
| SVG-спрайты | Как подключить генерацию SVG-спрайтов? |
| Шаблоны генерации | Как подключить шаблоны для кодогенерации? |
| VS Code | Как настроить редактор для проекта? |
Использование
Как это устроено и как этим пользоваться — структура, примеры и правила для конкретных областей.
| Раздел | Отвечает на вопрос |
|---|---|
| Структура проекта | Как организованы папки и файлы по SLM? |
| Компоненты | Как устроен компонент: файлы, пропсы, clsx? |
| Файлы роутинга | Как описывать layout, page, loading, error, not-found? |
| Шаблоны и генерация кода | Как работают шаблоны, синтаксис и инструменты генерации? |
| Стили | Как писать CSS: вложенность, медиа, токены? |
| SVG-спрайты | Как использовать SVG-спрайты в коде? |
| Изображения | (не заполнен) |
| Видео | (не заполнен) |
| Stores | (не заполнен) |
| Хуки | (не заполнен) |
| Шрифты | (не заполнен) |
| Локализация | (не заполнен) |
Данные
Как работать с источниками данных — REST, realtime и потребление в компонентах.
| Раздел | Отвечает на вопрос |
|---|---|
| Источники данных | Как устроена работа с данными в проекте? |
| REST: Автоматическая генерация | Как сгенерировать REST-клиент автоматически из OpenAPI? |
| REST: Ручное создание | Как написать REST-клиент вручную? |
| REST: Серверные компоненты | Как получать данные в серверных компонентах? |
| REST: Клиентские компоненты | Как получать данные в клиентских компонентах? |
| Realtime | Как работать с realtime-каналами и сокетами? |