Как мы делали свой сайт: Astro 5, LightRAG-знания, 152-ФЗ из коробки
Услуги
- complex-systems
- seo-ai-search
- cybersecurity
Стек
- Astro 5
- Svelte 5
- Tailwind 4
- Supabase Postgres 17
- PostgREST
- Pagefind
- Caddy
- Yandex SmartCaptcha
- Beget SMTP
Веб Штурм — IT-услуги B2B. Сайт-визитка на Astro 5 + Svelte 5 + Tailwind 4: Lighthouse 100/100 Mobile (Perf+A11y+SEO+BP), LCP <1.5 сек на mobile 3G, 152-ФЗ из коробки. С 2026-05-03. Демонстрируем process-discipline через сам сайт — то же самое делаем клиентам.
Сайт-визитка ООО Веб Штурм. Мы сами заказчики и сами исполнители — показываем не презентационно, а через реальные решения: всё, что мы сделали тут (Astro 5, LightRAG как knowledge layer, 152-ФЗ-совместимые формы, Lighthouse 100/100), делаем и для клиентов.
Контекст
В 2026 году сайт-визитка IT-компании — не просто «страница о нас». Это точка входа для новых каналов лидов: GEO/AEO-поиск (Яндекс.Нейро, ChatGPT, Perplexity, Google AI Overviews) уже сейчас даёт органику без клика на сайт. Чтобы попадать в AI-ответы, нужны структурированные данные, BLUF-контент и измеримые технические показатели. Параллельно, B2B-клиенты из регулируемых отраслей всё чаще проверяют соответствие подрядчика 152-ФЗ ещё до первого звонка.
Цели при запуске: (1) попасть в AI-выдачу Яндекс.Нейро и Perplexity по запросам об IT-разработке для малого бизнеса в первые недели после запуска; (2) показать process-discipline через демо самого сайта — «мы делаем это для себя, значит сделаем для вас»; (3) отработать все практики compliance и перформанса, чтобы транслировать их в клиентские проекты.
Брейнштурм прошёл 2026-05-03, прод запущен 2026-05-04, расширения портфолио и блога идут непрерывно с тех пор.
Какие вызовы решены
Как добиться 100/100 в Lighthouse на mobile? Astro 5 генерирует полностью статические HTML-файлы — ноль лишней гидратации. Интерактивные острова (поиск, форма) — только Svelte 5 runes, подключаются lazy. Tailwind 4 инлайнит только используемый CSS в <head> на критическом пути. Изображения — WebP/AVIF с width/height атрибутами (нет CLS). Шрифты — preload в <head>, display: swap, subset только кириллица+латиница. Итог: LCP стабильно ниже 1.5 сек на mobile 3G.
Как соответствовать 152-ФЗ на формах? Главная ловушка — Google reCAPTCHA передаёт данные пользователей на серверы Google в США. По 152-ФЗ это трансграничная передача ПД без согласия — штраф от 1 до 6 млн ₽ за повторное нарушение. Заменили на Yandex SmartCaptcha: российский резидент, данные остаются на серверах Яндекса в РФ. Дополнительно — трёхуровневый cookie-consent (necessary / analytics / marketing) с Яндекс.Метрикой, загружаемой только при analytics=true. Newsletter работает через double-opt-in: подтверждение по email до записи в базу.
Как ничего не отдавать с клиента? Все вызовы внешних API — через Astro server endpoints (src/pages/api/*). Supabase service-role key, beget SMTP-пароль, SmartCaptcha secret-key живут только в ENV-переменных systemd unit на сервере. Браузер видит только publishable-ключи (SmartCaptcha client-key и Supabase anon-key с RLS). Секрет не может утечь через DevTools — физически его там нет.
Как обеспечить полнотекстовый поиск без бэкенда? Pagefind — инструмент, который при astro build индексирует все HTML-страницы и создаёт статический индекс в /pagefind/. JS-клиент весит около 80 KB и подгружается lazy только на странице /search. Нет поискового сервера, нет платы за API, нет задержки на холодный старт.
Как делать автодеплой? Gitea Actions runner установлен на той же инфре, что и прод. Push в ветку master → runner запускает workflow: pnpm build → docker build → swap контейнеров → caddy reload. Zero downtime: Caddy за секунды переключает на новый контейнер, старый продолжает отвечать до graceful drain. Полный цикл — около 90 секунд.
Как версионировать статику, чтобы кэш сбрасывался автоматически? Astro добавляет content-hash к именам бандлов: _astro/Page.abc123.js. Для этих файлов выставляется Cache-Control: public, immutable, max-age=31536000 — браузер кэширует навсегда. HTML-страницы — no-cache, must-revalidate, то есть браузер спрашивает сервер при каждом посещении, но получает 304 если ничего не изменилось. Ни одного ручного cache-bust.
Как обеспечить адаптивность для мобильных устройств? Tailwind 4 с mobile-first breakpoints: базовые стили — для 320px, медиа-запросы расширяют для планшетов и десктопа. Тестировали на iPhone SE (320px), Pixel 7 (412px), iPad (768px). Viewport fit=cover для notch-устройств. Минимальный target-size 44×44 px для всех кнопок и ссылок — требование WCAG 2.2 и Apple HIG. Lighthouse Accessibility: 100/100.
Как использовать LightRAG и память проектов в работе? Каждое архитектурное решение перед принятием проверялось через lightrag_query в режиме mix: «какие паттерны мы уже применяли на похожих задачах». Memory-файлы с feedback-правилами (152-ФЗ, deплой, SMTP) читались в начале каждой сессии. Контент кейсов и блога создавался с учётом уже существующего в базе знаний, без повторений. Такая же схема работает у нас на всех проектах клиентов.
Подход
- Astro 5 SSG + island-архитектура для интерактива на Svelte 5 runes: сайт статический по умолчанию, JS появляется только там, где нужен.
- Supabase Postgres 17 для динамики — newsletter (подписки + double opt-in), cookie-consent log, заявки через форму контактов. PostgREST REST API + Row Level Security.
- Server endpoints для секретов — все вызовы внешних API через Astro
src/pages/api/*, ENV только на сервере. Клиент не получает service-role key ни при каких обстоятельствах. - Cookie consent 3-уровневый (necessary / analytics / marketing) — Яндекс.Метрика загружается только при
analytics=true. Согласие сохраняется в localStorage + логируется в Supabase для аудита. - Newsletter с email-queue: beget rate-limiter (30 писем/мин, 1500/час), DKIM 1024-bit + DMARC
p=quarantine pct=25+ SPFredirect=beget.com, RFC 8058 List-Unsubscribe One-Click. Mail.ru, Google и Port25 проверили: PASS. - CI/CD через Gitea Actions на собственной инфре — push в master → 90-секундный deploy через docker, Caddy reload без downtime. Тег
v*→ npm publish для пакетов@webshturm. - Pagefind для full-text search — статический индекс генерится при build, ноль динамической нагрузки, ноль платных API.
- LightRAG + memory-файлы + Obsidian-vault как knowledge layer при разработке — каждый брейнштурм создавал task-карточку в vault, каждое принятое решение сохранялось в LightRAG. Следующая сессия начиналась с
lightrag_query, не с нуля.
Результат
- 60+ коммитов, 33 страницы, 14 блог-статей, 22 000 слов контента
- 196 vitest тестов — зелёных, запускаются при каждом PR
- Lighthouse mobile: 100/100 по всем четырём осям (Performance, Accessibility, SEO, Best Practices)
- LCP <1.5 сек на mobile 3G
- Yandex SmartCaptcha работает; Google reCAPTCHA полностью убрана
- beget SMTP с DKIM/DMARC/SPF verified; Mail.ru + Google verified; Port25 PASS; RFC 8058 List-Unsubscribe One-Click
- Production live: webshturm.ru с 2026-05-04
Эффект для бизнеса
- Сайт = живой пример нашей работы — показываем не «что умеем», а «вот код, вот метрики». Клиент видит, что мы используем те же инструменты для себя, что предлагаем ему.
- GEO/AEO-готовность из коробки — FAQPage JSON-LD, Organization schema, llms.txt, BLUF-заголовки, семантический HTML5. Индексация в Яндекс.Нейро, ChatGPT и Perplexity начинается с первых недель запуска.
- Compliance-out-of-the-box для клиентов из регулируемых отраслей — 152-ФЗ, SmartCaptcha, double opt-in, cookie consent log, server-only secrets. Всё это переносимо в ваш проект как архитектурный паттерн.
- Self-deploy дисциплина — мы используем то же CI/CD на Gitea Actions, что предлагаем клиентам. Не «делаем как получится», а воспроизводимый процесс с нулевым downtime.
Что использовали
Astro 5 + Svelte 5 runes + Tailwind 4, Supabase Postgres 17 + PostgREST + Row Level Security, Pagefind 1.x (статический full-text index), Caddy auto-TLS (zero-config HTTPS), Yandex SmartCaptcha (152-ФЗ compliant), beget SMTP с DKIM 1024-bit / DMARC p=quarantine pct=25 / SPF redirect=beget.com, RFC 8058 List-Unsubscribe One-Click, Gitea Actions runner на собственной инфре, Docker Compose, LightRAG (mix-mode knowledge query) + Graphify (AST-граф workspace) + memory-файлы как knowledge layer при разработке.
Что мы можем сделать у вас
Если у вас компания, которой нужен сайт-визитка с 152-ФЗ-готовностью, GEO/AEO-оптимизацией, Lighthouse 100/100 и автодеплоем — мы делаем такие проекты за 2-3 недели от брейнштурма до прода. Тот же стек, та же дисциплина — отдадим вам в управление с инструкцией и CI/CD, настроенным под вашу инфру. Написать нам
Часто задаваемые вопросы
Что входит в meta-кейс webshturm.ru?
Сколько занял запуск корп-сайта?
Реально ли получить Lighthouse 100/100 на корп-сайте с блогом?
Когда такой стек не подходит?
Похожая задача?
Расскажите контекст — подскажу, что и как делать.
Обсудить похожий проект →