JokerDev Studio — это персональный сайт-портфолио для презентации услуг по разработке небольших сайтов, лендингов, сайтов-визиток и Telegram-ботов. Сайт нужен, чтобы показать услуги, примеры работ, ориентировочные цены, отзывы, подход к работе и дать посетителю быстрый способ оставить заявку.
На сайте сделана главная страница с адаптивной версткой под мобильные и десктопные устройства. Есть шапка с навигацией, мобильное меню, главный экран, блок с услугами, блок с примерами проектов, отзывы, форма заявки, футер с контактами и отдельная страница политики конфиденциальности. Также добавлен cookie-баннер и переключение светлой/темной темы с сохранением выбора пользователя.
Заявка реализована через модальное окно: пользователь указывает имя, что нужно сделать, цель проекта, сроки, бюджет и пожелания. После отправки открывается Telegram с уже подготовленным текстом заявки. Для работы нужно указать VITE_TELEGRAM_USERNAME. Также в проекте есть серверный обработчик /api/lead для отправки заявок через Telegram Bot API, но текущая форма главной страницы использует именно открытие Telegram-ссылки, а не прямую отправку через backend.
Для SEO подключены title, description, robots, canonical, Open Graph, Twitter Card и JSON-LD structured data. Есть sitemap, favicon, robots.txt, OG-изображение, meta-теги в index.html, включая Yandex verification и Telderi verification. Сайт рассчитан на продвижение и корректное отображение при отправке ссылки в мессенджерах и соцсетях.
Технически сайт написан на React 18, TypeScript и Vite. Для интерфейса используется Ant Design 5, маршрутизация сделана через React Router, SEO управляется через react-helmet-async, стили главной страницы написаны через CSS Modules и глобальные CSS-переменные. Сборка оптимизирована через Vite: есть разделение vendor-чанков, генерация sitemap, обработка и конвертация изображений в WebP/AVIF.
Что подключено: адаптивная главная страница, форма заявки через Telegram, SEO-мета, Open Graph, JSON-LD, sitemap, robots.txt, cookie-баннер, политика конфиденциальности, светлая/темная тема, lazy loading секций, оптимизированные изображения, конфиг для деплоя на Vercel.
Что не подключено: онлайн-оплата, личный кабинет, база данных, полноценная CRM, админ-панель, каталог с реальной корзиной и оплатой. Яндекс.Метрика в коде подготовлена, есть ID и функции событий, но загрузка скрипта Метрики сейчас закомментирована в src/main.tsx, поэтому для полноценной аналитики ее нужно включить.