docs: уточнить правила и заголовки вложенных разделов
- Подзаголовки архитектуры подняты до самодостаточных: Слои SLM, Модули SLM, Сегменты SLM - Подзаголовки REST-клиентов подняты до самодостаточных: Автогенерация REST-клиента, Ручное создание REST-клиента - Для серверных/клиентских компонентов h1 оставлен коротким, контекст полностью переносится в описание - Лендинг docs/docs/index.md актуализирован под новые имена; «Создание проекта» и «Данные» вынесены в отдельные группы - В CONTRIBUTING описана отдельная группа разделов «Настройка» и весь набор типов: basics, creating-project, setup, usage - Зафиксирован принцип: подъём контекста в h1 — только грамматически естественный, иначе контекст переносится в описание - Frontmatter дополнен обязательным полем description - Удалены устаревшие OLD_parts/ и notes
This commit is contained in:
58
README.md
58
README.md
@@ -1,6 +1,6 @@
|
||||
# NextJS Style Guide
|
||||
|
||||
Соглашения по разработке Next.js проектов: архитектура и слои приложения, структура кода, организация модулей, стилизация, типизация и инфраструктура.
|
||||
Стандарты разработки фронтенд-приложений на Next.js и TypeScript.
|
||||
|
||||
Сайт: https://nextjs-style-guide.gromlab.ru
|
||||
|
||||
@@ -17,9 +17,9 @@
|
||||
|
||||
## Структура документации
|
||||
|
||||
### Workflow
|
||||
### Подсказки
|
||||
|
||||
[Workflow](docs/docs/workflow.md) — пошаговая карта типовых задач: с чего начать, как добавить страницу/компонент, как подключить данные, стили, локализацию.
|
||||
[Подсказки](docs/docs/workflow.md) — короткие ответы на типовые вопросы и решения для спорных ситуаций.
|
||||
|
||||
### Базовые правила
|
||||
|
||||
@@ -29,7 +29,7 @@
|
||||
|--------|-------------------|
|
||||
| Технологии и библиотеки | Какой стек используем? |
|
||||
| Именование | Как называть файлы, переменные, компоненты, хуки? |
|
||||
| Архитектура: Обзор | Что такое SLM и зачем она нужна? |
|
||||
| SLM Design | Что такое SLM и зачем она нужна? |
|
||||
| Архитектура: Слои | Какие слои есть и как между ними устроены зависимости? |
|
||||
| Архитектура: Модули | Что такое модуль и как он устроен? |
|
||||
| Архитектура: Сегменты | Какие сегменты есть внутри модуля? |
|
||||
@@ -37,20 +37,27 @@
|
||||
| Документирование | Как писать JSDoc: что документировать, а что нет? |
|
||||
| Типизация | Как типизировать: type vs interface, any/unknown? |
|
||||
|
||||
### Установка и настройка
|
||||
### Создание проекта
|
||||
|
||||
**Как поднять и сконфигурировать проект** — пошаговая настройка инструментов и инфраструктуры.
|
||||
**Как начать новый проект** — варианты установки и эталонный набор инструментов.
|
||||
|
||||
| Раздел | Отвечает на вопрос |
|
||||
|--------|-------------------|
|
||||
| Создание проекта: Из шаблона | Как начать проект из готового шаблона? |
|
||||
| Создание проекта: Вручную | Как поднять проект с нуля без шаблона? |
|
||||
| Next.js | Как настроить Next.js под проект? |
|
||||
| Алиасы | Как настроить путевые алиасы импортов? |
|
||||
| Biome | Как настроить Biome (линтер и форматер)? |
|
||||
| Стили | Как подключить и настроить стили проекта? |
|
||||
| Создание проекта из шаблона | Как начать проект из готового шаблона? |
|
||||
| Создание проекта вручную | Как поднять проект с нуля без шаблона? |
|
||||
| Чистая установка Next.js | Как поставить голый Next.js под дальнейшую сборку? |
|
||||
|
||||
### Настройка
|
||||
|
||||
**Как сконфигурировать проект** — пошаговая настройка инструментов и инфраструктуры.
|
||||
|
||||
| Раздел | Отвечает на вопрос |
|
||||
|--------|-------------------|
|
||||
| Алиасы импортов | Как настроить алиасы импортов? |
|
||||
| Biome | Как настроить линтер и форматтер? |
|
||||
| PostCSS | Какие плагины PostCSS нужны и как их настроить? |
|
||||
| SVG-спрайты | Как настроить генерацию SVG-спрайтов? |
|
||||
| Стили | Как подключить базовые стили и токены? |
|
||||
| SVG-спрайты | Как подключить генерацию SVG-спрайтов? |
|
||||
| Шаблоны генерации | Как подключить шаблоны для кодогенерации? |
|
||||
| VS Code | Как настроить редактор для проекта? |
|
||||
|
||||
@@ -62,19 +69,26 @@
|
||||
|--------|-------------------|
|
||||
| Структура проекта | Как организованы папки и файлы по SLM? |
|
||||
| Компоненты | Как устроен компонент: файлы, пропсы, clsx? |
|
||||
| Страницы (App Router) | Как описывать layout, page, loading, error, not-found? |
|
||||
| Данные: Введение | Как устроена работа с данными в проекте? |
|
||||
| Данные: REST: Клиенты: Автоматическая генерация | Как сгенерировать REST-клиент автоматически из OpenAPI? |
|
||||
| Данные: REST: Клиенты: Ручное создание | Как написать REST-клиент вручную? |
|
||||
| Данные: REST: Получение данных: Серверные компоненты | Как получать данные в серверных компонентах? |
|
||||
| Данные: REST: Получение данных: Клиентские компоненты | Как получать данные в клиентских компонентах (SWR)? |
|
||||
| Данные: Realtime | Как работать с realtime-каналами и сокетами? |
|
||||
| Файлы роутинга | Как описывать layout, page, loading, error, not-found? |
|
||||
| Шаблоны и генерация кода | Как работают шаблоны, синтаксис и инструменты генерации? |
|
||||
| Стили | Как писать CSS: PostCSS Modules, вложенность, медиа, токены? |
|
||||
| Изображения | _(не заполнен)_ |
|
||||
| Стили | Как писать CSS: вложенность, медиа, токены? |
|
||||
| SVG-спрайты | Как использовать SVG-спрайты в коде? |
|
||||
| Изображения | _(не заполнен)_ |
|
||||
| Видео | _(не заполнен)_ |
|
||||
| Stores | _(не заполнен)_ |
|
||||
| Хуки | _(не заполнен)_ |
|
||||
| Шрифты | _(не заполнен)_ |
|
||||
| Локализация | _(не заполнен)_ |
|
||||
|
||||
### Данные
|
||||
|
||||
**Как работать с источниками данных** — REST, realtime и потребление в компонентах.
|
||||
|
||||
| Раздел | Отвечает на вопрос |
|
||||
|--------|-------------------|
|
||||
| Источники данных | Как устроена работа с данными в проекте? |
|
||||
| REST: Автоматическая генерация | Как сгенерировать REST-клиент автоматически из OpenAPI? |
|
||||
| REST: Ручное создание | Как написать REST-клиент вручную? |
|
||||
| REST: Серверные компоненты | Как получать данные в серверных компонентах? |
|
||||
| REST: Клиентские компоненты | Как получать данные в клиентских компонентах? |
|
||||
| Realtime | Как работать с realtime-каналами и сокетами? |
|
||||
|
||||
Reference in New Issue
Block a user