8.3 KiB
6. Техническая архитектура, стек и состав компонентов
6.1 Общая архитектурная схема
Программный продукт реализуется по клиент-серверной модели и включает веб-клиент, сервер бизнес-логики, базу данных, модуль интеграции и вспомогательные сервисы уведомлений.
6.2 Состав прикладных сервисов
Согласно действующей карте деплоя в составе проекта используются следующие сервисы:
web-frontend— клиентский и менеджерский веб-интерфейсapollo-backend— сервер GraphQL и бизнес-логикаvault— централизованное хранилище секретовtg-bot— Telegram-контурmax-bot— MAX-контурbonus-bot— бонусный мессенджерный контур
Основные прикладные сервисы web-frontend и apollo-backend разворачиваются через dokploy_webhook на сервере main.
6.3 Технологический стек фронтенда
Клиентская часть программного продукта реализуется на следующих технологиях:
Nuxt 4— прикладной веб-фреймворкVue 3— библиотека пользовательского интерфейса@nuxtjs/apolloи@vue/apollo-composable— работа с GraphQLGraphQL Code Generator— генерация типизированных GraphQL-документовTailwind CSSиdaisyUI— базовая стилизация интерфейсовStorybook— контур изоляционного просмотра компонентовVitePress— подготовка проектной документации
6.4 Технологический стек серверной части
Серверная часть программного продукта реализуется на следующих технологиях:
Node.js— среда выполненияExpress 5— HTTP-серверApollo Server 5— GraphQL-серверPrisma 7— доступ к данным и ORM-слойPostgreSQL— основное хранилище данныхZod— валидация структур данных в прикладных сценарияхNodemailer— отправка уведомлений по электронной почте
6.5 Архитектура клиентской части
Клиентская часть организована по следующим слоям:
- страницы
app/pages— входные экранные формы - компоненты
app/components— переиспользуемые элементы интерфейса - composables
app/composables— клиентская логика и представление данных - GraphQL-документы
graphql/operations— отдельные запросы и мутации - сгенерированная типизированная схема
app/composables/graphql/generated.ts - серверные proxy и интеграционные обработчики
server/api
Ключевые экранные маршруты текущей реализации:
/productsи/products/[slug]— каталог и карточка товара/cart— корзина/client-ordersи/client-orders/[id]— клиентские заявки и заказы/clientsи/clients/[id]— менеджерский контур клиентов/ordersи/orders/[id]— менеджерский контур заказов/catalog-settings— административные настройки каталога/bonus-program,/bonus-system/*— бонусный контур
6.6 Карта слоев и компонентов
6.7 Архитектура серверной части
Серверная часть организована по следующим основным модулям:
src/server.js— инициализация HTTP-сервера и GraphQL-сервераsrc/schema.graphql— контракт GraphQL APIsrc/resolvers.js— реализация GraphQL-операцийsrc/context.js— построение контекста запросаsrc/auth.js— аутентификация и токены доступаsrc/access.js— правила авторизации и проверки ролейsrc/prisma-client.js— точка подключения Prismasrc/messenger*.js,src/telegram*.js,src/max-mini-app.js— мессенджерный контур и мини-приложения
6.8 Взаимодействие фронтенда и backend
Взаимодействие клиентской и серверной части строится через GraphQL API.
На стороне Nuxt используется серверный proxy-маршрут /api/graphql, который:
- принимает запросы браузера
- прокидывает cookie и авторизационные заголовки
- перенаправляет запрос в
apollo-backend - возвращает результат в клиентское приложение
Такой подход позволяет:
- изолировать прямой backend endpoint от браузерного клиента
- централизованно передавать авторизационные данные
- поддерживать единый клиентский GraphQL endpoint
6.9 Интеграционные и вспомогательные HTTP-точки
Помимо GraphQL API, во фронтенд-контуре реализованы вспомогательные серверные маршруты:
/api/graphql— proxy в backend GraphQL API/api/auth/messenger-start— запуск сценариев messenger login / connect/api/dadata/address— подсказки адресов/api/dadata/bank— подсказки банковских реквизитов/api/dadata/party— подсказки контрагентов/api/messenger-avatar/[connectionId]— выдача изображений, связанных с мессенджерными подключениями
6.10 Компонентные требования к реализации
Архитектура программного продукта должна сохранять следующие правила:
- экранная логика должна находиться на уровне страниц и composables
- переиспользуемые элементы интерфейса должны быть вынесены в компоненты
- каждый GraphQL-документ должен храниться в отдельном
.graphqlфайле - клиентский код должен использовать сгенерированные типизированные документы
- серверная логика доступа к данным должна проходить через Prisma
- бизнес-правила доступа должны контролироваться серверной частью, а не только интерфейсом
6.11 Требования к конфигурации и секретам
Сервисы программного продукта должны получать прикладные секреты из Vault.
В конфигурации сервисов допускается хранение только bootstrap-параметров для подключения к Vault. Бизнес-секреты, ключи интеграций и иные чувствительные данные должны загружаться из Vault при старте приложения.