Перейти к содержимому

🎯pr. Описание технологического стека (стек технологий)

1.      Описание технологического стека

PWA — технология (для Прогрессивных веб-приложение)

Нужно тестирование для MVP, но минимальное и разумное, не «корпоративный ад».

см. про тестирование ниже.

Пиши чистые функции (Pure Functions) чтобы их было легко тестировать. Тогда вам не нужно настраивать окружение или менять глобальные переменные перед тестом.  Для тестов JS кода используем библиотеку «Vitest» или используем «Jest» лучше для проектов с использованием библиотеки «React Native».

см. ниже дополнительно об этом.

Для MVP тесты нужны, потому что:

  • ты будешь часто менять код
  • ошибки в backend = сломанный продукт
  • баги тормозят развитие сильнее, чем тесты

📌 Но: не 100% покрытие, а ключевые сценарии.

Backend

  • Python
  • Flask — лёгкий и гибкий веб-фреймворк для построения REST API
  • Flask-RESTful / Flask Blueprints — структурирование API
  • SQLAlchemy (ORM) — абстракция работы с базой данных (что обеспечивает независимость бизнес-логики от конкретной СУБД.)
  • Alembic — миграции схемы базы данных
  • JWT / Flask-Login (опционально) — аутентификация и авторизация
  • Gunicorn — production WSGI сервер + Nginx (При росте)

Frontend

  • HTML5
  • CSS3
  • JavaScript (ES6+)
  • React — построение пользовательского интерфейса
  • Axios / Fetch API — взаимодействие с backend API
  • React Router — маршрутизация
  • State management (Context API / Redux — при необходимости)

Database

  • SQLite — на этапе разработки и MVP
  • PostgreSQL — для production и масштабирования (При росте)

3. Краткая формулировка (для документов)

Можно вставлять как готовый текст для промта в ИИ:

Backend реализован на Python с использованием Flask.
Для работы с базой данных применяется ORM SQLAlchemy, что обеспечивает независимость бизнес-логики от конкретной СУБД.
На этапе разработки используется SQLite, с возможностью последующего перехода на PostgreSQL без существенных изменений в коде.
Управление изменениями схемы базы данных осуществляется с помощью Alembic.
Frontend реализован на JavaScript с использованием React, HTML и CSS, взаимодействие с backend происходит через REST API.

Gunicorn («Зеленый Единорог») — это высокопроизводительный WSGI-сервер на Python для UNIX-систем, который служит мостом между веб-серверами (например, Nginx) и вашим Python-приложением (Django, Flask и т.д.), обеспечивая надежную обработку HTTP-запросов и масштабирование благодаря архитектуре с несколькими рабочими процессами (воркерами). Он упрощает развертывание, требует мало ресурсов и отлично подходит для продакшн-среды. 

Nginx (произносится «энджи́нкс») — это высокопроизводительный веб-сервер с открытым исходным кодом, который также используется как обратный прокси-сервер, балансировщик нагрузки и почтовый прокси-сервер, славящийся своей эффективностью при работе с большим количеством одновременных соединений, минимальным потреблением ресурсов и гибкой настройкой для быстрой доставки контента. Разработанный российским программистом Игорем Сысоевым в 2002 году для решения проблемы производительности, он стал одним из самых популярных в мире.

Alembic — это инструмент миграций базы данных для SQLAlchemy, который позволяет версионировать и безопасно изменять структуру базы данных, а также легко переносить схему между разными СУБД.

Repository / Service Layer — это уже архитектура, не библиотека. Объясню очень простыми словами, потом покажу код и зачем это тебе конкретно.


1. Коротко, в одной фразе

Repository / Service Layer — это способ разделить код, чтобы:

  • бизнес-логика не зависела от базы данных
  • смена БД (SQLite → PostgreSQL) была лёгкой
  • код был понятным и поддерживаемым

🔹 Для маленького MVP — не обязательно
🔹 Для проекта “в рост” — очень желательно


Repository / Service Layer — это способ разделить код, чтобы:

  • бизнес-логика не зависела от базы данных
  • смена БД (SQLite → PostgreSQL) была лёгкой
  • код был понятным и поддерживаемым


Идея Repository Layer
. Repository = «работа с данными»

Он:

  • знает как хранить и получать данные
  • не знает зачем

app/

── routes/          # Flask endpoints

│   └── user_routes.py

── services/        # бизнеслогика

│   └── user_service.py

── repositories/    # доступ к данным

│   └── user_repository.py

── models/          # SQLAlchemy models

│   └── user.py

── db.py

└── app.py

📌 Frontend и Backend разделены
📌 Backend = API
📌 Frontend = SPA (Single Page Application)

SPA (Single Page Application) — это веб-приложение, которое работает как единое целое на одной HTML-странице, динамически загружая и обновляя только необходимые данные с помощью JavaScript, вместо перезагрузки всей страницы, что обеспечивает быструю, плавную и похожую на нативное приложение (десктопное или мобильное) работу, как, например, в Gmail, Google Docs или Trello.

Backend — Flask (API-first)

📂 Структура backend

backend/

── app/

│   ── __init__.py        # create_app()

│   ── config.py          # configs (dev/prod)

│   ── extensions.py      # db, migrate, jwt

│   │

│   ── models/            # SQLAlchemy models

│   │   └── user.py

│   │

│   ── repositories/      # доступ к данным

│   │   └── user_repository.py

│   │

│   ── services/          # бизнес-логика

│   │   └── user_service.py

│   │

│   ── routes/            # API endpoints

│   │   └── user_routes.py

│   │

│   ── schemas/           # (опц.) Marshmallow / validation

│   └── utils/

── migrations/            # Alembic

── tests/

── requirements.txt

── wsgi.py

└── run.py

Frontend — React (SPA)

📂 Структура frontend

frontend/

── src/

│   ── api/            # запросы к backend

│   │   └── client.js

│   │

│   ── services/       # бизнес-логика UI

│   │   └── auth.js

│   │

│   ── pages/          # страницы

│   │   └── Login.jsx

│   │

│   ── components/     # UI компоненты

│   │   └── Button.jsx

│   │

│   ── hooks/

│   ── context/

│   ── App.jsx

│   └── main.jsx

── public/

└── package.json

Дополнительные технологии:

  Docker

  Redis (кэш / очереди)

  Celery (фоновые задачи)

Переход MVP → рост

На MVP:

  • SQLite
  • один сервер
  • минимальный CI

При росте:

  • PostgreSQL
  • Gunicorn + Nginx
  • Docker
  • Redis (кэш / очереди)
  • Celery (фоновые задачи)

Почему это «стартап-архитектура»

✔ Быстрый старт
✔ Чистый код
✔ Лёгкое масштабирование
✔ Понятна инвесторам
✔ Подходит для Германии / EU (compliance)

Принцип тестирования для MVP (золотое правило)

Тестируем то, что дорого сломать

Для стартапа это:

  • регистрация / логин
  • платежи (если есть)
  • работа с БД
  • ключевая бизнес-логика

Минимальный набор тестов для MVP (чек-лист)

✅ Service layer — 5–10 тестов
✅ API — 3–5 smoke tests
✅ Frontend — 2–3 теста
➡️ Итого: 1–2 часа настройки

Формулировка для бизнес-плана

Для обеспечения базовой стабильности MVP используется автоматизированное тестирование ключевой бизнес-логики и API. Тестирование организовано с фокусом на критические пользовательские сценарии и не препятствует быстрой итерации продукта.

Итог

✔ Да, тесты для MVP нужны
✔ Но минимально и разумно
✔ Backend важнее frontend
✔ Service Layer — главный фокус

1. Что значит unit test

Unit test (модульный тест) — это тест:

который проверяет одну маленькую часть логики в изоляции

В нашем случае:

  • один метод
  • один класс
  • одно бизнес-правило

Пример:

«Можно ли зарегистрировать пользователя с новым email?»


2. Что значит fake repository

Fake repository — это:

поддельная (упрощённая) реализация работы с данными

Он:

  • не использует базу данных
  • хранит данные в памяти
  • ведёт себя «как настоящая БД», но проще

Vitest — это инструмент для тестирования JavaScript/TypeScript, аналогичный Jest, но более современный и быстрый.


Jest — созданный командой Facebook, является наиболее широко используемым фреймворком для тестирования JavaScript. Jest  лучше поддерживает «React Native».

Конечно! Чтобы тесты на Vitest (или любом другом фреймворке) писались легко и просто, саму функцию нужно проектировать с расчетом на тестирование. Этот подход часто называют Design for Testability.

Используйте Инъекцию Зависимостей (Dependency Injection)

Если функция должна отправлять запрос в API или работать с датой, не пишите это внутри функции. Передавайте эти инструменты как аргументы.

Пример с датой: Вместо использования new Date() внутри функции (которая всегда разная), передайте дату параметром.

JavaScript

// Функция проверяет, наступил ли дедлайн

export function isDeadlinePassed(deadline, now = new Date()) {

  return now > deadline;

}

В тесте Vitest: вы просто передадите любую фиксированную дату в now и легко проверите логику.

Маленькие функции — одна задача

Если функция делает 10 вещей сразу, тест для нее превращается в кошмар. Разделяйте логику.

  • Функция А: Получает данные.
  • Функция Б: Трансформирует данные (вот её тестировать проще всего).
  • Функция В: Сохраняет данные.

Чек-лист для «простого» тестирования:

  1. Избегайте static и глобальных состояний.
  2. Возвращайте значение, а не просто выводите в console.log.
  3. Не делайте асинхронным то, что может быть синхронным. Тестировать синхронный код всегда быстрее и проще.
  4. Сначала напишите тест (TDD). Если вам неудобно писать тест к функции, которую вы еще не создали — значит, архитектура функции слишком сложная.