# Global-IT24 Landing Page Лендинг для компании Global-IT24 - профессиональный монтаж систем видеонаблюдения в Москве. ## 🌐 Веб-сайт **Production:** https://video.mscsrv.ru ## 📦 Технологии - **Framework:** Next.js 14.2.28 - **UI:** React 18.2, Tailwind CSS - **UI Components:** Radix UI, Shadcn/ui, Lucide Icons - **Database:** PostgreSQL + Prisma ORM - **Email:** Nodemailer (SMTP Mail.ru) - **Notifications:** Telegram Bot API - **Deployment:** Docker + Traefik - **Language:** TypeScript ## ✨ Возможности - 🎨 Адаптивный дизайн (Desktop, Tablet, Mobile) - 📱 Оптимизирован для мобильных устройств - 📧 Email уведомления о новых заявках - 💬 Telegram уведомления в реальном времени - 💾 Сохранение заявок в базу данных PostgreSQL - 🔒 SSL сертификаты через Let's Encrypt (Traefik) - 🚀 Оптимизация производительности Next.js - 🐳 Docker контейнеризация ## 📋 Структура проекта ``` global_it24_landing/ ├── nextjs_space/ # Next.js приложение │ ├── app/ # App Router │ │ ├── api/ # API Routes │ │ │ └── contact/ # Endpoint для обработки заявок │ │ ├── layout.tsx # Корневой layout │ │ └── page.tsx # Главная страница │ ├── components/ # React компоненты │ │ ├── ui/ # UI компоненты (Shadcn/ui) │ │ ├── contact-form.tsx # Форма контакта │ │ └── ... │ ├── lib/ # Утилиты и библиотеки │ │ ├── email.ts # Email уведомления │ │ ├── telegram.ts # Telegram уведомления │ │ ├── db.ts # Prisma client │ │ └── utils.ts # Вспомогательные функции │ ├── prisma/ # Database schema │ │ └── schema.prisma # Prisma схема │ ├── public/ # Статические файлы │ └── package.json # Зависимости ├── Dockerfile # Docker образ ├── docker-compose.yml # Docker Compose конфигурация ├── traefik-config-example.yml # Traefik конфигурация ├── deploy.sh # Скрипт развертывания ├── update.sh # Скрипт обновления ├── logs.sh # Просмотр логов ├── status.sh # Проверка статуса ├── stop.sh # Остановка контейнера ├── backup.sh # Резервное копирование ├── check-network.sh # Проверка сетевой связности └── README.deployment.md # Инструкция по развертыванию ``` ## 🚀 Быстрый старт ### Разработка (локально) ```bash # Клонировать репозиторий git clone https://git.mscsrv.ru/sa/global_it24_landing.git cd global_it24_landing/nextjs_space # Установить зависимости yarn install # Настроить переменные окружения cp .env.example .env nano .env # Запустить dev сервер yarn dev ``` Откройте http://localhost:3000 в браузере. ### Production развертывание Подробная инструкция по развертыванию находится в [README.deployment.md](./README.deployment.md) **Краткая версия:** ```bash # На вашем Ubuntu сервере cd /path/to/global_it24_landing # Настроить .env cp .env.example .env nano .env # Запустить развертывание ./deploy.sh ``` ## ⚙️ Конфигурация ### Переменные окружения (.env) ```env # Database DATABASE_URL="postgresql://user:password@host:5432/database" # SMTP Configuration SMTP_HOST=smtp.mail.ru SMTP_USER=your-email@mail.ru SMTP_PASSWORD=your-smtp-password NOTIFICATION_EMAIL=your-email@mail.ru # Telegram Bot TELEGRAM_BOT_TOKEN=your-bot-token TELEGRAM_CHAT_ID=your-chat-id # Application NEXT_PUBLIC_SITE_URL=https://video.mscsrv.ru NODE_ENV=production ``` ### Архитектура развертывания ``` Internet ↓ [DNS: video.mscsrv.ru] → 192.168.50.59 ↓ [Traefik: 192.168.50.59] (SSL, Reverse Proxy) ↓ проксирует на порт 3000 [App Server: Ubuntu Docker Container] ↓ [Next.js App + PostgreSQL] ``` ## 📧 Система уведомлений При каждой новой заявке через форму на сайте: 1. ✅ Данные сохраняются в базу данных PostgreSQL 2. 📧 Отправляется Email уведомление на info@global-it24.ru 3. 💬 Отправляется сообщение в Telegram бот **Формат уведомлений:** - Имя клиента - Телефон (кликабельная ссылка) - Email (если указан) - Тип услуги - Сообщение (если есть) ## 🛠 Команды управления ```bash # Развертывание ./deploy.sh # Обновление (рестарт контейнера) ./update.sh # Просмотр логов ./logs.sh # Проверка статуса ./status.sh # Остановка контейнера ./stop.sh # Резервное копирование ./backup.sh # Проверка сетевой связности с Traefik ./check-network.sh ``` ## 🗄 База данных **Schema (Prisma):** ```prisma model ContactSubmission { id String @id @default(cuid()) name String phone String email String? serviceType String? message String? createdAt DateTime @default(now()) @@map("contact_submissions") } ``` **Миграции:** ```bash cd nextjs_space yarn prisma migrate dev yarn prisma generate ``` ## 📱 Секции лендинга 1. **Hero** - Главный экран с призывом к действию 2. **Преимущества** - Ключевые преимущества компании 3. **Услуги** - Типы систем видеонаблюдения (дома, офисы, промышленность) 4. **Процесс работы** - Этапы установки системы 5. **Прайс** - Ценовые пакеты 6. **Контакты** - Форма обратной связи 7. **Footer** - Контактная информация и соцсети ## 🔐 Безопасность - SSL сертификаты через Let's Encrypt (Traefik) - Security headers (X-Frame-Options, CSP, etc.) - SMTP пароли и токены в переменных окружения - .env файл в .gitignore - Валидация данных форм - Rate limiting на API endpoints (можно добавить) ## 📈 Производительность - Next.js Standalone build для минимального размера образа - Статическая генерация страниц где возможно - Оптимизация изображений (Next.js Image) - Сжатие (Traefik compress middleware) - CDN ready (статические файлы могут быть вынесены) ## 🐳 Docker **Сборка:** ```bash docker build -t global-it24-landing . ``` **Запуск:** ```bash docker compose up -d ``` **Остановка:** ```bash docker compose down ``` ## 📝 Логи ```bash # Docker logs docker compose logs -f # Или через скрипт ./logs.sh # Логи находятся в .logs/ ``` ## 🔄 Обновление кода ```bash # Остановка текущего контейнера docker compose down # Получение обновлений из git git pull origin master # Пересборка и запуск ./deploy.sh ``` ## 📞 Контакты **Global-IT24** - 📱 Телефон: 8(985)489-16-19 - 📧 Email: info@global-it24.ru - 🌐 Сайт: https://video.mscsrv.ru - 📍 Москва ## 📄 Лицензия Proprietary - Global-IT24 © 2025 ## 🔗 Ссылки - [Документация Next.js](https://nextjs.org/docs) - [Документация Prisma](https://www.prisma.io/docs) - [Документация Traefik](https://doc.traefik.io/traefik/) - [Документация Docker](https://docs.docker.com/) - [Shadcn/ui Components](https://ui.shadcn.com/) ## 👨‍💻 Разработка **Разработано с использованием:** - Next.js App Router - TypeScript - Tailwind CSS - Docker - PostgreSQL **Repository:** https://git.mscsrv.ru/sa/global_it24_landing --- **Сделано с ❤️ для Global-IT24**