de_DEen_USes_ESfa_IRfr_FRhi_INid_IDjapl_PLpt_PTru_RUvizh_CNzh_TW

این مدل C4، که توسط سیمون براون توسعه داده شده است، رویکردی قدرتمند و سلسله مراتبی برای تصویرسازی معماری نرم‌افزار است. این مدل از چهار سطح انتزاعی استفاده می‌کند تا سطح مناسب جزئیات را برای مخاطبان مختلف، از ذینفعان کسب‌وکار تا توسعه‌دهندگان، فراهم کند. این ویژگی آن را برای ایجاد مستندات شفاف، قابل نگهداری و متناسب با مخاطب مناسب می‌کند.

Introduction to C4 Model: a Quick Guide - Visual Paradigm Blog

این راهنما جامع از مطالعه موردی معروف سیستم بانکی اینترنتی Big Bank plc — یک مثال داستانی اما واقع‌گرایانه از ساخت یک پلتفرم بانکداری آنلاین برای مشتریان شخصی برای مشاهده حساب‌ها و انجام پرداخت‌ها. این مطالعه موردی نشان می‌دهد که چگونه مدل C4 به صورت تدریجی به کار گرفته شود، با استفاده از PlantUML برای «معماری به عنوان کد». همچنین از ابزارهای مدرنی مانند استودیو C4 PlantUML پشتیبانی‌شده از هوش مصنوعی Visual Paradigm (که در اوایل سال ۲۰۲۵ عرضه شد) برای شتاب بخشیدن به ایجاد و نگهداری آن.

مروری بر مدل C4

این مدل شامل چهار سطح است:

  1. سطح ۱: زمینه سیستم — تصویر کلی: سیستم، کاربران و وابستگی‌های خارجی.

  2. سطح ۲: مخازن — واحدهای اصلی قابل انتشار (اپلیکیشن‌ها، خدمات، پایگاه‌های داده) و انتخاب‌های فنی سطح بالا.

  3. سطح ۳: مؤلفه‌ها — بلوک‌های ساختاری منطقی داخل یک مخزن.

  4. سطح ۴: کد — جزئیات سطح پایین اختیاری (مثلاً کلاس‌ها)؛ اغلب به جای ارجاع به کد منبع نادیده گرفته می‌شوند.

نمایش‌های پشتیبانی‌کننده دیگر شامل نمودارهای پویا (جریان‌های زمان اجرا) و نمودارهای نصب هستند.

به کارگیری مدل C4: مطالعه موردی سیستم بانکی اینترنتی Big Bank plc

سطح ۱: نمودار زمینه سیستم

هدف:
ارائه یک مرور سطح بالا برای ذینفعان کسب‌وکار و مخاطبان غیرفنی، نشان دادن اینکه سیستم بانکی اینترنتی چگونه در محیط گسترده‌تر جای می‌گیرد بدون استفاده از اصطلاحات فنی.

عناصر کلیدی:

  • فرد:
    مشتری بانکداری شخصی — مشتری دارای یک یا چند حساب بانکی شخصی.

  • سیستم نرم‌افزاری: سیستم بانکداری اینترنتی — به مشتریان اجازه می‌دهد اطلاعات حساب خود را مشاهده کنند و پرداخت‌ها انجام دهند.

  • سیستم‌های خارجی:

    • سیستم بانکداری اصلی (ماشین اصلی موجود) — داده‌های مشتری، حساب‌ها و تراکنش‌ها را مدیریت می‌کند.

    • سیستم ایمیل (مثلاً AWS SES) — تأییدیه‌ها و اطلاع‌رسانی‌ها را ارسال می‌کند.

روابط:

  • مشتریازسیستم بانکداری اینترنتی استفاده می‌کند.

  • سیستم بانکداری اینترنتیازسیستم بانکداری اصلی برای داده‌ها و تراکنش‌ها استفاده می‌کند.

  • سیستم بانکداری اینترنتیایمیل را از طریقسیستم ایمیل ارسال می‌کند.

این سطح چیزها را ساده و صریح در مورد دامنه و ادغام‌ها نگه می‌دارد.

مثال PlantUML (با اقتباس از مطالعه موردی):

@startuml
!include https://static.visual-paradigm.com/plantuml-stdlib/C4-PlantUML/master/C4_Context.puml
LAYOUT_TOP_DOWN()
LAYOUT_WITH_LEGEND()
title نمودار زمینه سیستم (سطح 1) برای سیستم بانکداری اینترنتی
Person(customer, "مشتری بانکداری شخصی", "یک مشتری با یک یا چند حساب بانکی شخصی.")
System(internet_banking_system, "سیستم بانکداری اینترنتی", "به مشتریان اجازه می‌دهد اطلاعات حساب‌ها را مشاهده کنند و پرداخت‌ها انجام دهند.")
System(core_banking_system, "سیستم بانکداری اصلی", "ماشین اصلی موجود که داده‌های مشتری، حساب‌ها و تراکنش‌ها را مدیریت می‌کند.")
System_Ext(email_system, "سیستم ایمیل", "سرویس ساده ایمیل AWS (AWS SES) برای ارسال تأییدیه‌ها.")
Rel(customer, internet_banking_system, "از استفاده می‌کند")
Rel(internet_banking_system, core_banking_system, "از استفاده می‌کند")
Rel(internet_banking_system, email_system, "ایمیل را از طریق ارسال می‌کند")
@enduml

سطح 2: نمودار کانتینر

هدف: ورود به جزئیات برای نشان دادن بلوک‌های اصلی (کانتینرها) و انتخاب‌های فناوری، با تمرکز بر مهندسان معماری، توسعه‌دهندگان و تیم‌های DevOps.

عناصر کلیدی (در محدوده سیستم بانکداری اینترنتی):

  • برنامه صفحه تکی (SPA) — جاوااسکریپت + آنگولار، رابط کاربری کامل در مرورگر وب.

  • اپلیکیشن موبایل — iOS/Android با React Native (یا مشابه)، عملکرد محدود.

  • اپلیکیشن API — جاوا + اسپرینگ بوت، API JSON/HTTPS که هر دو فرانت‌اند را پشتیبانی می‌کند.

  • پایگاه داده — پستگرس، داده‌های جلسه، ترجیحات و خلاصه‌های کش شده را ذخیره می‌کند (داده‌های اصلی در سیستم اصلی باقی می‌مانند).

خارجی — سیستم بانکداری اصلی و سیستم ایمیل.

رابطه‌ها:

  • مشتری از SPA و اپلیکیشن موبایل از طریق HTTPS استفاده می‌کند.

  • SPA و اپلیکیشن موبایل به اپلیکیشن API (JSON/HTTPS) تماس می‌گیرند.

  • اپلیکیشن API به پایگاه داده می‌خواند/می‌نویسد (JDBC/SQL).

  • اپلیکیشن API با سیستم بانکداری اصلی (JSON/HTTPS) و سیستم ایمیل (HTTPS) تعامل دارد.

این نمودار به عنوان «منبع واحد حقیقت» برای تصمیم‌گیری‌های فناوری عمل می‌کند.

مثال PlantUML (از اسپریت‌ها برای آیکون‌ها استفاده می‌کند):

@startuml
!include https://static.visual-paradigm.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml
!include https://raw.githubusercontent.com/tupadr3/plantuml-icon-font-sprites/master/devicons/angular.puml
!include https://raw.githubusercontent.com/tupadr3/plantuml-icon-font-sprites/master/devicons/java.puml
!include https://raw.githubusercontent.com/tupadr3/plantuml-icon-font-sprites/master/devicons/postgresql.puml
LAYOUT_TOP_DOWN()
LAYOUT_WITH_LEGEND()
title نمودار کانتینر C4 برای سیستم بانکداری اینترنتی
Person(customer, "مشتری بانکداری شخصی", "یک مشتری با یک یا چند حساب بانکی شخصی.")
System_Boundary(internet_banking_system, "سیستم بانکداری اینترنتی") {
    Container(spa, "اپلیکیشن صفحه تکی", "جی‌اس + انگولار", "رابطه کاربری کامل بانکداری اینترنتی", $sprite="angular")
    Container(mobile_app, "اپلیکیشن موبایل", "آی‌او‌اس/اندروید (ریکت نیتیو)", "عملکرد محدود", $sprite="react")
    Container(api_app, "اپلیکیشن API", "جاوا + اسپرینگ بوت", "API JSON/HTTPS", $sprite="java")
    ContainerDb(database, "پایگاه داده", "پستگرس", "داده‌های جلسه، ترجیحات، خلاصه‌های کش شده", $sprite="postgresql")
}
System(core_banking_system, "سیستم بانکداری اصلی", "سیستم اصلی موجود...")
System_Ext(email_system, "سیستم ایمیل", "AWS SES...")
Rel(customer, spa, "استفاده می‌کند", "HTTPS")
Rel(customer, mobile_app, "استفاده می‌کند", "HTTPS")
Rel(spa, api_app, "تماس می‌گیرد", "JSON/HTTPS")
Rel(mobile_app, api_app, "تماس می‌گیرد", "JSON/HTTPS")
Rel(api_app, database, "می‌خواند و می‌نویسد", "JDBC/SQL")
Rel(api_app, core_banking_system, "پرس و جو / به‌روزرسانی", "JSON/HTTPS")
Rel(api_app, email_system, "ایمیل را از طریق ارسال می‌کند", "HTTPS")
@enduml

سطح 3: نمودار مؤلفه

هدف : جزئیات ساختار داخلی یک کانتینر کلیدی (در اینجا، اپلیکیشن API) برای تیم‌های توسعه‌دهنده.

مؤلفه‌های کلیدی (درون اپلیکیشن API):

  • کنترلر حساب‌ها (اسپرینگ MVC) — خلاصه‌ها و موجودی‌ها را ارائه می‌دهد.

  • کنترلر احراز هویت (اسپرینگ MVC) — ورود، جلسات، توکن‌ها.

  • کنترلر بازنشانی رمز عبور (اسپرینگ MVC) — بازنشانی رمز عبور از طریق ایمیل.

  • مؤلفه امنیت (اسپرینگ بیان) — احراز هویت، JWT، هشینگ.

  • مؤلفه مدیریت حساب (اسپرینگ بیان) — فراخوانی‌های بانکداری اصلی را هماهنگ می‌کند.

  • مؤلفه اطلاع‌رسانی ایمیل (اسپرینگ بیان) — ایمیل‌ها را ارسال می‌کند.

تعاملات — کنترلرها از امنیت استفاده می‌کنند؛ مدیریت حساب از بانکداری اصلی استفاده می‌کند؛ ایمیل از پایگاه داده استفاده می‌کند؛ فرانت‌اند‌ها به کنترلرها تماس می‌گیرند.

مثال PlantUML:

PlantUML Diagram

@startuml
!include https://static.visual-paradigm.com/plantuml-stdlib/C4-PlantUML/master/C4_Component.puml
LAYOUT_WITH_LEGEND()
title دیاگرام مؤلفه‌ای برای سیستم بانکداری اینترنتی - کاربرد API
Container(spa, "برنامه صفحه تکی", "javascript و angular", "...")
Container(ma, "اپلیکیشن موبایل", "...", "...")
ContainerDb(db, "پایگاه داده", "...", "...")
System_Ext(mbs, "سیستم بانکداری ماینفریم", "...")
Container_Boundary(api, "کاربرد API") {
    Component(accounts, "کنترلر حساب‌ها", "Spring MVC", "...")
    Component(auth, "کنترلر احراز هویت", "Spring MVC", "...")
    Component(reset, "کنترلر بازنشانی رمز عبور", "Spring MVC", "...")
    Component(security, "اجزای امنیت", "Spring Bean", "...")
    Component(accountmgmt, "اجزای مدیریت حساب", "Spring Bean", "...")
    Component(email, "اجزای اطلاع‌رسانی ایمیل", "Spring Bean", "...")
    Rel(accounts, security, "استفاده می‌کند")
    Rel(auth, security, "استفاده می‌کند")
    Rel(reset, security, "استفاده می‌کند")
    Rel(accountmgmt, mbs, "استفاده می‌کند", "XML/HTTPS")
    Rel(email, db, "خواندن", "JDBC")
}
Rel(spa, accounts, "استفاده می‌کند", "JSON/HTTPS")
Rel(spa, auth, "استفاده می‌کند", "JSON/HTTPS")
Rel(spa, reset, "استفاده می‌کند", "JSON/HTTPS")
Rel(ma, accounts, "استفاده می‌کند", "JSON/HTTPS")
Rel(ma, auth, "استفاده می‌کند", "JSON/HTTPS")
Rel(ma, reset, "استفاده می‌کند", "JSON/HTTPS")
@enduml

سطح ۴: دیاگرام کد (اختیاری)

هدف: جزئیات سطح کلاس را برای مناطق خاص (مثلاً احراز هویت) نشان دهد.

اغلب حذف می‌شود — به کد منبع به جای آن ارجاع داده می‌شود.

مثال — دیاگرام کلاس UML برای احراز هویت:

  • AuthenticationController از JwtTokenProvider و UserRepository استفاده می‌کند.

مثال PlantUML:

@startuml
classDiagram
class "AuthenticationController" {
    +login(credentials)
    +refreshToken()
}
class "JwtTokenProvider" {
    +generateToken(user)
    +validateToken(token)
}
class "UserRepository" {
    +findByUsername()
}
AuthenticationController ..> JwtTokenProvider : "استفاده می‌کند"
AuthenticationController ..> UserRepository : "استفاده می‌کند"
@enduml

نمایش‌های پشتیبان

  • دیاگرام پویا (مثلاً توالی «مشاهده خلاصه حساب»): مشتری → SPA → API → پایگاه داده/بانک مرکزی → پاسخ.

  • دیاگرام نصب: اجزای را به زیرساخت می‌پیوندد (مثلاً AWS EC2 برای API، RDS برای پایگاه داده، ماینفریم داخلی).

استفاده از ابزارهای هوش مصنوعی Visual Paradigm

ابزارهای Visual Paradigmاستودیوی C4 PlantUML پرقدرت هوش مصنوعی (صدور در اواخر سال ۲۰۲۵) این فرآیند را تحول می‌بخشد:

  • ورودی زبان طبیعی (مثلاً «ایجاد یک مدل C4 برای یک سیستم بانکداری اینترنتی با SPA، اپلیکیشن موبایل، API Spring Boot، PostgreSQL و ادغام با ماینفریم»).

  • هوش مصنوعی کد و دیاگرام‌های PlantUML را برای تمام سطوح تولید می‌کند.

  • از ربات چت هوش مصنوعی برای تکرار استفاده کنید (مثلاً «افزودن MFA به جزء احراز هویت» یا «تولید نمایش نصب روی AWS»).

  • همگونی بین سطوح را حفظ کنید و از «مستندات زنده» پشتیبانی کنید.

  • صدور، مدیریت نسخه و ادغام با مخازن.

این ابزار خروجی ساختاریافته و مطابق با C4 را به طور قابل اعتمادتری نسبت به هوش مصنوعی‌های عمومی ارائه می‌دهد.

بهترین روش‌ها

  1. با کارگاه‌ها شروع کنید — از تخته‌های سفید برای سطح ۱ برای هم‌راستایی ذینفعان استفاده کنید.

  2. معماری را به عنوان کد رفتار کنید — فایل‌های PlantUML را در مخزن خود ذخیره کنید تا با تغییرات کد به صورت خودکار به‌روزرسانی شوند.

  3. با هوش مصنوعی خودکارسازی کنید — از Visual Paradigm برای تولید و بهبود نمودارها به سرعت استفاده کنید.

  4. تمرکز بر مخاطب — جزئیات فنی را از سطح ۱ حذف کنید؛ به تدریج آن‌ها را اضافه کنید.

  5. آن را سبک نگه دارید — تنها ظروف پیچیده را در سطح ۳ جزئیات بدهید؛ سطح ۴ را در صورت ضرورت از نظر بگذارید.

  6. مستندات را پیش ببرید — نمودارها را «زنده» کنید تا از ایجاد مدارک منسوخ جلوگیری شود.

مطالعه موردی شرکت بیگ بانک plc همچنان مثال کلاسیکی از کارایی مدل C4 در سناریوهای واقعی است که شفافیت، همکاری و ارتباط معماری مقیاس‌پذیر را تقویت می‌کند. برای اطلاعات بیشتر، به وب‌سایت رسمی C4 یا ابزارهای هوش مصنوعی Visual Paradigm مراجعه کنید.

This post is also available in Deutsch, English, Español, Français, English, Bahasa Indonesia, 日本語, Polski, Portuguese, Ру́сский, Việt Nam, 简体中文 and 繁體中文.