Разработка сайта ресторана «Берёзки»
Ресторан SEO Производительность Двуязычный
О проекте
Ресторану «Берёзки» в отеле Welton требовался быстрый, минималистичный сайт, оптимизированный для поисковых систем, с основной информацией о ресторане, меню и возможностью бронирования.
Основная задача
Создание двуязычного сайта (русский/английский) с индивидуальной статической генерацией для каждой языковой версии при сохранении оптимальной производительности и SEO-превосходства.
Процесс
Сбор информации
Работа с клиентом
- Собрано всё необходимое содержание и разделы
- Определены ключевые требования к информации о ресторане
- Установлены спецификации системы бронирования
Разработка дизайна
Фокус на пользовательском опыте
- Создан минималистичный дизайн в Figma
- Оптимизирован под mobile-first подход
- Обеспечена интуитивно понятная структура навигации
Разработка
Техническая реализация
- Фронтенд: Nuxt с TypeScript
- Бэкенд: Bun (Elysia)
- Большой упор на скорость загрузки
- JSON-LD (микроразметка) для лучшей индексации
Интеграция
Подключены необходимые системы аналитики:
- Google Search Console для SEO-мониторинга
- Яндекс Метрика для детальной аналитики
- Вебвизор для анализа поведения пользователей
Получить консультацию
Технологии Full-stack Bun экосистема
Основной стек
- Фронтенд: Nuxt 4 (Vue 3, Nitro server)
- Язык: TypeScript
- Сборка: Vite + Tailwind CSS v4
- База данных: SQLite (Turso/libSQL) с Drizzle ORM
- Бот: Telegram Bot API (GramIO)
Ключевые интеграции
- i18n: @nuxtjs/i18n для двуязычной поддержки
- Управление состоянием: Pinia
- Валидация: Zod
- Деплой: Docker, Bun runtime
- Аналитика: Яндекс Метрика + Rybbit (кастомная CDN аналитика)
Архитектура
API Endpoints
| Endpoint | Метод | Назначение |
|---|---|---|
| /api/form | POST | Отправка форм бронирования |
| /api/requests | GET | Админ-панель - список заявок |
| /api/requests | POST | Обновление статуса заявки |
| /api/otp | GET | OTP-верификация для админа |
| /api/healthcheck | GET | Проверка работоспособности системы |
Структура базы данных
requests— заявки на бронирование (id, name, date, time, persons, tel, status, metaData)otps— коды доступа администратора (code, status, expiresAt, cookie)
Интеграция с Telegram
- Уведомления: Новые бронирования отправляются напрямую в Telegram-канал
- Управление: Подтверждение/отклонение бронирований через Telegram
- Резервное копирование: Ежедневный бэкап базы данных в Telegram
Уникальные особенности
1. Безопасная админ-панель
- Двухфакторная аутентификация через Telegram (OTP + cookie)
- Традиционные пароли не требуются
- Автоматическое управление сессиями
2. Двуязычная SEO-стратегия
- Раздельная статическая генерация для русского и английского
- Индивидуальные карты сайта для каждого языка
- Оптимизированные meta-теги и JSON-LD разметка
3. Оптимизация производительности
- Google Core Web Vitals score: 95/100
- Сайт готов к взаимодействию: <500ms
- Оптимизированные изображения и кеширование
4. Система бронирования
- Интегрирована с операционной деятельностью ресторана
- Уведомления менеджеров в реальном времени
- Простая форма с комплексной валидацией
Результаты Через 2 месяца после запуска
Поисковая производительность
100+ кликов из результатов Google за первые два месяца Стабильный рост органического трафика
Скорость загрузки
- 95/100 Google Core Web Vitals score
- <500ms время до интерактивности
- Оптимизировано для мобильных и десктопа
Пользовательский опыт
- Двуязычная поддержка с полной SEO-оптимизацией
- Интуитивное бронирование с интеграцией Telegram
- Комплексная аналитика на нескольких платформах
Опишите свои цели моему AI-агенту
Дополнительные возможности
- Интеграция PDF-меню с Google Drive
- Модульная система дизайна для лёгкого обновления контента
Почему это работает
Для владельцев бизнеса
- Быстрый запуск и немедленные результаты
- Не требуется техническое обслуживание
- Уведомления в реальном времени о новых бронированиях
- Комплексная аналитика для бизнес-решений
Для клиентов
- Быстрая загрузка даже на мобильных устройствах
- Лёгкое бронирование на предпочитаемом языке
- Полная информация об услугах ресторана
- Адаптивный дизайн на всех устройствах