🟦 Нотация С4: примеры схем архитектуры для проекта #AdFlowGA 🟦

Если вы никогда не работали с архитектурой, и на текущем или новом проекте появляется задача описать её в C4, то хочется увидеть полноценные образцы, а не учебные примеры на "три квадратика".

Поэтому я продолжаю собирать для вас базу полезных материалов и подготовила примеры схем архитектуры в нотации C4 для нового проекта.



Что внутри:

🟦 C4 / Context
Показывает систему на самом верхнем уровне:
▫️ саму систему,
▫️ всех пользователей и роли,
▫️ внешние системы, с которыми есть интеграции.

На этом уровне уже удобно знакомиться с системой,
с ролями пользователей и внешними взаимодействиями.

Протоколы интеграций здесь указывать не обязательно,
но если их добавить, схема становится полезнее.


🟦 C4 / Container
Показывает внутреннюю организацию системы:
▫️ пользователей и внешние системы,
▫️ приложения,
▫️ сервисы и микросервисы,
▫️ API Gateway,
▫️ базы данных,
▫️ файловые хранилища,
▫️ брокеры.

На что здесь стоит обратить внимание:
✔️ как отличаются контейнеры пользовательских приложений и backend-компонентов;
✔️ везде подписаны технологии - выяснять обязательно;
✔️ как на стрелках обозначены REST API, GraphQL, gRPC, SDK;
✔️ как показаны связи сервисов с БД и файловыми хранилищами.

Из практики:
+ API Gateway я показываю шестиугольником — так на схеме он читается удобнее (по нотации - прямоугольник);
+ микросервисы тоже показываю прямоугольниками, чтобы не было лишнего смешения разных форм (по нотации - шестиугольники).
+ главное — не просто повторять нотацию, а делать схему понятной с первого взгляда.


🟦 C4 / Component и C4 / Code
Это уже более глубокие уровни, которые показывают внутреннюю организацию кода внутри конкретного контейнера.

На практике они нужны не всегда.

Во многих задачах достаточно качественно проработанных Context и Container, чтобы понимать архитектуру системы.


⌛️ Сколько заняла подготовка: около 90 минут
Но важно: я не рисовала архитектуру с нуля.
У меня уже были исходники и понимание проекта, и я переводила почти готовую схему в C4.

Мои исходные схемы:
+ схема 1 с API Gateway, без внутренних интеграций
+ схема 2 с внутренними взаимодействиями

Если бы архитектуру пришлось собирать полностью с нуля, без исходников и без знания проекта, на такую работу легко мог уйти целый рабочий день — и больше.



Что помогает ускорить работу с C4:
🔹 AI + код Structurizr
🔹 AI + код PlantUML
🔹 AI + код MermaidChart
🔹 Встроенный AI в Draw.io (кривой черновик)



⚙️ Создано в draw.io
🔗 Исходники С4 для AdFlowGA



Сохраняйте эти схемы C4 в личную базу знаний — они не раз выручат, когда нужно будет быстро вспомнить, как наглядно показать архитектуру 🔖


📱 TG | 💙 VK | 💬 Max

#АрхитектураGA