2941b14b38
- Moved contents of main_dc/yalarba/easySite/easySite/ up to easySite/ - Updated docker-compose.yml build context path - Deleted empty nested easySite/ directory
13 KiB
13 KiB
📚 Документация проекта EasySite
🏗️ Общая архитектура проекта
EasySite - это полноценная платформа для создания сайтов, построенная на Nuxt.js 3 с использованием server-side rendering и автоматической генерацией сайтов.
Технологический стек:
- Frontend: Nuxt.js 3, Vue 3, TypeScript
- Backend: Nuxt Server (API Routes) (Golang, gorm, chi)
- Стилизация: Кастомные CSS-переменные, компонентный подход
- SEO: Автоматическая sitemap, мета-теги
- Деплой: Node.js сервер
📁 Структура приложения
Маршрутизация (Routing)
Основные маршруты:
Публичные страницы:
/- Главная страница с CTA и шагами создания сайта/about- Страница "О компании" с информацией о команде/contact- Контакты/news- Новости/objects- Каталог объектов/сайтов/partner- Партнерская программа/requisites- Реквизиты компании/reviews- Отзывы пользователей/rules- Правила использования/support- Поддержка/vacations- Возможности/предложения
Страницы соглашений:
/agreements/privacy- Политика конфиденциальности/agreements/userAgreement- Пользовательское соглашение
Аутентификация:
/auth/login- Вход в систему/auth/register- Регистрация
Пользовательская зона:
/profile- Профиль пользователя/profile/edit- Редактирование профиля/profile/settings- Настройки аккаунта/objects/create- Создание нового объекта/objects/my-objects- Мои объекты/сайты/reviews/write- Написание отзыва/support/create- Создание обращения в поддержку
Вспомогательные:
/plugins/auth- Плагин аутентификации
🎯 Бизнес-логика
1. Процесс создания сайта (3 шага)
Шаг 1: Регистрация (/auth/register)
// Пример бизнес-логики регистрации
interface RegisterData {
email: string;
password: string;
confirmPassword: string;
// ... другие поля
}
// Валидация:
// 1. Проверка уникальности email
// 2. Сложность пароля
// 3. Согласие с пользовательским соглашением
// 4. Создание верификационного токена
Шаг 2: Добавление услуг (/objects/create)
interface Service {
id: string;
title: string;
description: string;
category: string;
price?: number;
images: string[];
features: string[];
// ... другие поля
}
// Процесс:
// 1. Пользователь заполняет информацию об услугах
// 2. Загрузка изображений
// 3. Категоризация
// 4. Сохранение в базу данных
Шаг 3: Генерация сайта (/objects/my-objects)
// Автоматическая генерация включает:
// 1. Создание уникального URL (поддомен или путь)
// 2. Генерация HTML-страниц на основе шаблонов
// 3. Наполнение контентом из профиля пользователя
// 4. SEO-оптимизация
// 5. Публикация на хостинге
🔐 Система аутентификации
Файлы аутентификации:
server/
├── api/
│ ├── auth/
│ │ ├── login.post.ts # POST /api/auth/login
│ │ ├── register.post.ts # POST /api/auth/register
│ │ └── logout.post.ts # POST /api/auth/logout
├── middleware/
│ ├── auth.ts # Глобальный middleware
└── utils/
└── auth.ts # Утилиты аутентификации
Flow аутентификации:
- Регистрация → создание аккаунта + email верификация
- Вход → JWT токен + refresh токен
- Защита роутов → middleware проверка
- Выход → инвалидация токенов
🗺️ Карта сайта (Sitemap)
Конфигурация (nuxt.config.ts)
sitemap: {
siteUrl: 'https://easysite102.ru',
sources: ['/api/__sitemap__/urls'], // Динамические URL
exclude: ['/admin/**', '/private/**'],
defaults: {
changefreq: 'daily',
priority: 0.7,
lastmod: new Date().toISOString()
}
}
Генерация динамических URL:
// server/api/__sitemap__/urls.ts
export default defineEventHandler(async () => {
const objects = await db.objects.findMany({
where: { published: true }
})
return objects.map(object => ({
loc: `/objects/${object.slug}`,
lastmod: object.updatedAt,
changefreq: 'weekly'
}))
})
🎨 Компоненты и страницы
Главная страница (index.vue)
Особенности:
- Hero-секция с gradient text
- 3-шаговый процесс создания сайта
- Адаптивный дизайн (mobile-first)
- SEO-оптимизация через
useSeoMeta()
Страница "О нас" (about.vue)
Структура:
- Hero секция с изображением
- Блок "Наш путь" (текст + статистика)
- Команда (текущая + открытые позиции)
- Ценности компании
- CTA секция
SEO настройки:
useSeoMeta({
title: 'О компании - EasySite',
description: 'Узнайте больше о нашей компании...',
ogTitle: 'О компании - EasySite',
ogDescription: 'Узнайте больше...',
})
🎯 Ключевые компоненты системы
1. Layout система (layouts/default.vue)
<template>
<div class="app-layout">
<AppHeader />
<NuxtPage />
<AppFooter />
</div>
</template>
2. Навигация
- Главное меню для публичных страниц
- Боковое меню для авторизованных пользователей
- Breadcrumbs для сложных путей
3. Формы
- Регистрация/авторизация
- Создание объекта
- Редактирование профиля
- Написание отзывов
- Обращения в поддержку
🛠️ API Endpoints
Публичные API:
GET /api/objects # Список объектов
GET /api/objects/:id # Детали объекта
GET /api/reviews # Отзывы
GET /api/news # Новости
Защищенные API:
POST /api/auth/login # Вход
POST /api/auth/register # Регистрация
POST /api/auth/logout # Выход
GET /api/profile # Профиль
PUT /api/profile # Обновление профиля
POST /api/objects # Создание объекта
GET /api/user/objects # Мои объекты
PUT /api/objects/:id # Обновление объекта
DELETE /api/objects/:id # Удаление объекта
POST /api/reviews # Создание отзыва
POST /api/support/tickets # Обращение в поддержку
🏗️ Структура базы данных (пример)
-- Пользователи
CREATE TABLE users (
id UUID PRIMARY KEY,
email VARCHAR(255) UNIQUE NOT NULL,
password_hash VARCHAR(255) NOT NULL,
name VARCHAR(100),
avatar_url TEXT,
verified BOOLEAN DEFAULT false,
created_at TIMESTAMP DEFAULT NOW(),
updated_at TIMESTAMP
);
-- Объекты/Сайты
CREATE TABLE objects (
id UUID PRIMARY KEY,
user_id UUID REFERENCES users(id),
title VARCHAR(255) NOT NULL,
slug VARCHAR(255) UNIQUE NOT NULL,
description TEXT,
template_id VARCHAR(50),
status VARCHAR(50) DEFAULT 'draft',
settings JSONB,
published_at TIMESTAMP,
created_at TIMESTAMP DEFAULT NOW()
);
-- Услуги
CREATE TABLE services (
id UUID PRIMARY KEY,
object_id UUID REFERENCES objects(id),
title VARCHAR(255) NOT NULL,
description TEXT,
price DECIMAL(10,2),
position INTEGER
);
🚀 Развертывание
Переменные окружения:
# База данных
DATABASE_URL=postgresql://...
# JWT
JWT_SECRET=your_jwt_secret_key
JWT_REFRESH_SECRET=your_refresh_secret_key
# Email
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_USER=your_email@gmail.com
SMTP_PASS=your_app_password
# Домены
BASE_URL=https://easysite102.ru
CLIENT_URL=https://easysite102.ru
# Telegram уведомления
TELEGRAM_BOT_TOKEN=your_bot_token
TELEGRAM_CHAT_ID=your_chat_id
Команды для запуска:
# Установка
npm install
# Разработка
npm run dev
# Сборка
npm run build
# Продакшен
npm run preview
# Деплой
npm run deploy
📈 Мониторинг и аналитика
Встроенные метрики:
- SEO метрики - через sitemap и meta теги
- Производительность - Lighthouse scores
- Аналитика - Google Analytics/Tag Manager
- Ошибки - Sentry/Bugsnag
Кастомизация:
// Плагин для аналитики
// plugins/analytics.ts
export default defineNuxtPlugin(() => {
// Инициализация аналитики
useGtag({
config: { id: 'G-XXXXXXXXXX' }
})
})
🛡️ Безопасность
Реализованные меры:
- CSRF защита - для всех POST запросов
- XSS защита - санитизация пользовательского ввода
- SQL инъекции - использование ORM с параметризованными запросами
- JWT токены - с ограниченным временем жизни
- Rate limiting - ограничение запросов
- CORS политики - настройка доменов
🔧 Расширение функционала
Планы развития:
- Шаблоны сайтов - добавление новых дизайнов
- Мультиязычность - i18n поддержка
- Платежная система - подписки и платежи
- Аналитика сайтов - статистика посещений
- Мобильное приложение - через Capacitor/PWA
📋 Чеклист для нового разработчика
- Установить Node.js 18+
- Клонировать репозиторий
- Установить зависимости
npm install - Настроить
.envфайл - Запустить БД (PostgreSQL)
- Выполнить миграции
npm run db:migrate - Запустить dev сервер
npm run dev - Проверить доступность по
localhost:3000 - Протестировать регистрацию пользователя
- Проверить генерацию сайта
🆘 Поддержка и устранение неисправностей
Частые проблемы:
-
Sitemap не генерируется
- Проверить настройки в
nuxt.config.ts - Убедиться что
siteUrlправильный - Проверить доступность
/api/__sitemap__/urls
- Проверить настройки в
-
Аутентификация не работает
- Проверить JWT секреты
- Убедиться в правильности middleware
- Проверить cookies настройки
-
Не загружаются изображения
- Проверить конфигурацию
@nuxt/image - Убедиться в правильности путей
- Проверить права доступа
- Проверить конфигурацию
Контакты для поддержки:
- Разработчик: Валитов Газиз (https://valitovgaziz.ru)
- Telegram бот: Чат уведомлений
- Email поддержка: support@easysite102.ru
Эта документация покрывает основные аспекты проекта EasySite. Для более детальной информации по конкретным модулям обращайтесь к соответствующей секции документации.