voidea/template/docs/decisions/04-frontend.md

Выбор фронтенда

---

Decision Tree

graph TD
    A[Фронтенд?] --> B{SPA или SSR?}
    B -->|SPA| C[React + Vite + TS]
    B -->|SSR| D[Next.js]
    C --> E{Нужен оффлайн?}
    E -->|Да| F[PWA + vite-plugin-pwa]
    E -->|Нет| G[Без PWA]

---

Варианты

React + Vite + TypeScript

Когда	SPA, PWA, мобильное приложение
Плюсы	Популярный, большая экосистема, Vite быстрый, PWA-ready
Минусы	SPA — медленный первый заход (но PWA решает)

Next.js

Когда	SSR, SEO, контентный сайт
Плюсы	SSR, SEO, App Router
Минусы	Сложнее деплой, не подходит для PWA

---

Стили

Решение	Когда
Tailwind CSS	Всегда (рекомендовано)
CSS Modules	Если Tailwind не подходит
CSS-in-JS	Не рекомендуется (производительность)

---

Состояние

Решение	Когда
React Context + hooks	Маленькое приложение (< 5 страниц)
zustand	Среднее приложение (рекомендовано)
RTK	Большое приложение с множеством запросов

---

PWA

Когда нужен:

• Приложение должно работать оффлайн
• Пользователи на мобильных устройствах
• Нужно push-уведомления

Технологии:

• vite-plugin-pwa — генерация service worker
• manifest.json — установка на домашний экран
• IndexedDB — оффлайн-хранение

---

[ASK]

• Нужен ли фронтенд вообще? (API-first или full-stack?)
• SPA или SSR? (SPA+PWA для приложений, SSR для контента)
• Нужна ли PWA? (да, если мобильные пользователи и оффлайн)
• Какой Router? (react-router-dom — стандарт)