Стек

Одно дерево компонентов: сервер рендерит готовый HTML, а браузер подхватывает его через hydration.

Типизировано всё, а типы API общие для клиента и сервера.

Одна таблица маршрутов для сервера и браузера. Ленивые страницы загружаются ещё до рендера.

Данные запрашиваются на уровне маршрута заранее, а после hydration страница читает уже готовый кеш.

Только локальное состояние интерфейса: например, открыт ли модальный диалог. Серверные данные остаются в TanStack Query.

Русский и английский с поддержкой SSR: язык определяется на сервере, а после hydration клиент продолжает работать с той же локализацией.

SCSS и CSS Modules. Цвета вынесены в дизайн-токены, поэтому в стилях нет случайных значений и вся палитра управляется из одного места.

Runtime и менеджер пакетов для монорепозитория. Запускает TypeScript напрямую и не требует отдельного шага сборки для серверного кода.

Веб-сервер для SSR, сессий и прокси на /api. На каждый запрос генерируется свой CSP nonce.

API-слой. Для каждого маршрута схема и обработчик описаны вместе, поэтому валидация и OpenAPI генерируются из одного источника.

Схемы для валидации запросов и данных. Из тех же схем генерируется OpenAPI, поэтому правила не приходится описывать дважды.

Хранилище сессий в production. Сессии не зависят от памяти конкретного процесса и сохраняются между перезапусками приложения.

База для заметок и остального содержимого сайта. Живёт в кластере под управлением оператора CloudNativePG.

Схема и запросы к Postgres на TypeScript. Типы берутся из той же схемы, из которой собираются миграции.

Вход в админку по passkey: пароля нет нигде, подпись проверяется на сервере.

Собирает клиент и сервер, а в development подключается к Fastify и отвечает за dev-сервер и HMR.

Убирает неиспользуемые стили из production-сборки. Для классов в kebab-case используется свой extractor, чтобы нужный CSS не удалялся по ошибке.

Юнит-тесты лежат рядом с кодом и запускаются в CI. Для покрытия задан порог, ниже которого сборка не проходит.

Линтер и форматтер для всего монорепозитория. Один конфиг в корне задаёт общие правила для всех приложений.

Проверяет стили так же, как Biome проверяет код: порядок свойств, вложенность и запрет литеральных цветов вместо токенов.

Находит мёртвый код: неиспользуемые файлы, экспорты и зависимости. Запускается в CI вместе с остальными проверками.

Оба приложения собираются в отдельные образы прямо из монорепозитория. API-образ получается минимальным и не тащит за собой node_modules.

Лёгкий Kubernetes для одной небольшой ARM-машины в Hetzner. Хватает для деплоя и управления сервисами без лишней инфраструктуры.

Здесь живёт репозиторий и CI/CD. Перед деплоем запускаются те же проверки, что и локально, поэтому поведение окружений не расходится.

DNS и туннель перед кластером. Входящий трафик идёт через Cloudflare, поэтому серверу не нужно открывать порты наружу.

Собирает ошибки из браузера и с сервера в одном месте, чтобы видеть всю картину по приложению.