Lädt...


🔧 Code Generated Architecture Diagram


Nachrichtenbereich: 🔧 Programmierung
🔗 Quelle: dev.to

Greetings to my fellow Technology Advocates and Specialists.

In this Session, I will demonstrate How to Create Azure Solutions Architecture Diagram by Code.

AUTOMATION OBJECTIVES:-
# TOPICS
1. Example #1: Create "Basic Azure App Service Architecture Diagram" by Code.
2. Example #2: Create "Gaming Architecture Diagram" by Code.
PRE-REQUISITES:-
1. Python 3.6 or higher.
2. Graphviz
3. pip
VALIDATE PRE-REQUISITES:-
Image description
COMMANDS TO VERIFY:-
python --version
dot -V
pip --version
INSTALL DIAGRAMS:-

Install "diagrams" using "pip":-

pip install diagrams

Image description
CODE REPOSITORY:-

Diagram As Code:-

Greetings to my fellow Technology Advocates and Specialists.

This is "Diagram As Code" Series !





















DATE TOPICS CONTENT
01.08.2024 Visualizing Cloud Designations with Mermaid https://dev.to/arindam0310018/visualizing-cloud-designations-with-mermaid-3bl
15.08.2024 Generate Solution Architecture Diagram using Commandline https://dev.to/arindam0310018/code-generated-architecture-diagram-13o3






CONCEPTS:-
I.) DIAGRAMS:-
1. Represents a global diagram context.
2. Diagram context can be created with Diagram class.
3. The first parameter of Diagram constructor will be used for output filename.
II.) NODES:-
1. Represents a single system component object.
2. A node object consists of three parts: i) Provider, ii) Resource type and iii) Name.
III.) CLUSTERS:-
1. Allows you group (or clustering) the nodes.
IV.) EDGES:-
1. Represents a connection between Nodes with some additional properties.

Now, we proceed in Creating Architecture Diagram using Diagrams and Python.

CONSTRUCT OF THE PYTHON CODE TO CREATE ARCHITECTURE DIAGRAM:-
1. Import Diagram, Cluster and Edge.
2. Import the Provider Icons for creating diagrams.
3. Creating the building blocks using Nodes and Cluster.
4. Connect the building blocks using Edges.
EXAMPLE #1:

Create "Basic Azure App Service Architecture Diagram" by Code.

Below follows the Python Code (Generate-Basic-Azure-App-service-Arch-Diagram.py):-

############################################################
## Architecture Diagram: Basic Azure App Service:-

## Components include:-
# 1. User
# 2. Azure Entra ID
# 3. Azure Monitor
# 4. Azure Application Insights
# 5. Azure User Assigned Managed Identity
# 6. Azure Key Vault 
# 7. Azure App Services
# 8. Azure SQL Servers

############################################################

######################################################
# Import Diagram, Cluster and Edge.
# Import the Provider Icons for creating diagrams.
######################################################

from diagrams import Cluster, Diagram, Edge
from diagrams.azure.general import Helpsupport, Servicehealth
from diagrams.azure.devops import ApplicationInsights
from diagrams.azure.security import KeyVaults
from diagrams.azure.identity import ManagedIdentities, ActiveDirectory
from diagrams.azure.compute import AppServices
from diagrams.azure.database import SQLServers

#########################################################
# Creating the building blocks using Nodes and Cluster.
#########################################################

with Diagram("Basic Azure App Service Architecture", show=False, direction="TB"):
    usr = Helpsupport("User")

    with Cluster("Compute"):
        components_webapp = [AppServices("AppServices"), KeyVaults("KV"), ManagedIdentities("UMID")]

    with Cluster("Data"):
        components_db = SQLServers("Azure SQL Database")

    with Cluster("Identity"):
        components_identity = [ActiveDirectory("Microsoft Entra ID")]

    with Cluster("Monitoring"):
        components_monitor = [ApplicationInsights("App Insights"), Servicehealth("Azure Monitor")]

############################################
# Connect the building blocks using Edges.
############################################

    usr >> Edge(color="darkorange") >> components_webapp

    components_webapp >> Edge(color="darkgreen") >> components_db

EXECUTE THE PYTHON CODE:-

python.exe .\Generate-Basic-Azure-App-service-Arch-Diagram.py

OUTPUT OF EXAMPLE #1:-
Image description
EXAMPLE #2:

Create "Gaming Architecture Diagram" by Code.

Below follows the Python Code (Generate-Gaming-Arch-Diagrams.py):-

############################################################
## Architecture Diagram: Gaming using Azure Cosmos DB:-

## Components include:-
# 1. User
# 2. Azure Traffic Manager
# 3. Azure Content Delivery Network
# 4. Azure Storage
# 5. Azure API Management 
# 6. Azure Cosmos DB
# 7. Azure Databricks
# 8. Azure Functions
# 9. Azure Notification Hubs

############################################################

######################################################
# Import Diagram, Cluster and Edge.
# Import the Provider Icons for creating diagrams.
######################################################

from diagrams import Cluster, Diagram, Edge
from diagrams.azure.general import Helpsupport
from diagrams.azure.network import TrafficManagerProfiles, CDNProfiles
from diagrams.azure.storage import StorageAccounts
from diagrams.azure.integration import APIManagement
from diagrams.azure.database import CosmosDb
from diagrams.azure.analytics import Databricks
from diagrams.azure.compute import FunctionApps
from diagrams.azure.mobile import NotificationHubs

#########################################################
# Creating the building blocks using Nodes and Cluster.
#########################################################

# with Diagram("GAMING ARCHITECTURE", show=False, direction="TB"):
with Diagram("GAMING ARCHITECTURE", show=False):
    usr = Helpsupport("User")

    # atm = TrafficManagerProfiles("Azure Traffic Manager")

    apim = APIManagement("Azure API Apps")

    cosmos = CosmosDb("Azure Cosmos DB")

    dbks = Databricks("Azure Databricks")

    # cdn = CDNProfiles ("Azure CDN")

    # storage = StorageAccounts("Azure Storage (Media Files)")

    functions = FunctionApps("Azure Functions")

    notifyhub = NotificationHubs("Azure Notification Hubs")

    with Cluster(""):
         atm = TrafficManagerProfiles("Traffic Manager")

    with Cluster(""):
         cdn = CDNProfiles ("Azure CDN")

    with Cluster(""):
         storage = StorageAccounts("Azure Storage")

############################################
# Connect the building blocks using Edges.
############################################

    usr >> Edge(color="darkgreen") >> atm
    cdn >> Edge(color="darkblue") >> atm
    storage >> Edge(color="darkpurple") >> cdn
    atm >> Edge(color="darkorange") >> apim
    apim >> Edge(color="darkred") >> cosmos
    cosmos >> Edge(color="darkred") >> apim
    cosmos >> Edge(color="darkblue") >> dbks
    cosmos >> Edge(color="darkblue") >> functions
    functions >> Edge(color="darkbrown") >> notifyhub
EXECUTE THE PYTHON CODE:-

python.exe .\Generate-Gaming-Arch-Diagrams.py

OUTPUT OF EXAMPLE #2:-
Image description

Hope You Enjoyed the Session!!!

Stay Safe | Keep Learning | Spread Knowledge

...

🔧 Code Generated Architecture Diagram


📈 46.52 Punkte
🔧 Programmierung

🔧 Draw context diagram and top-level data flow diagram for the group project


📈 39.18 Punkte
🔧 Programmierung

🔧 Create Architecture Diagram as Code for a 2-Tier Bookstore Application


📈 33.28 Punkte
🔧 Programmierung

🔧 Comparing All-in-One Architecture, Layered Architecture, and Clean Architecture


📈 29.94 Punkte
🔧 Programmierung

🔧 My home-kubernetes architecture diagram


📈 29.57 Punkte
🔧 Programmierung

🔧 🚀 Understanding Clean Architecture: Beyond the Dependency Diagram 🚀


📈 29.57 Punkte
🔧 Programmierung

🔧 iCraft Editor - Free 3D Architecture Diagram Drawing Tool


📈 29.57 Punkte
🔧 Programmierung

🔧 NIST GenAI program launches to study how to distinguish AI-generated and human-generated content


📈 26.47 Punkte
🔧 Programmierung

🎥 AI-Generated Ads Versus Human-Generated Ads: Which Converts Better?


📈 26.47 Punkte
🎥 Video | Youtube

🐧 Randomly Generated vs User Generated Paswords


📈 26.47 Punkte
🐧 Linux Tipps

🔧 Diagram as Code with Mermaid


📈 23.3 Punkte
🔧 Programmierung

🔧 A new simple approach to diagram as code on AWS with CDK and D2


📈 23.3 Punkte
🔧 Programmierung

📰 AMD Unveils Zen 2 CPU Architecture, Navi GPU Architecture and a Slew of Products


📈 19.96 Punkte
📰 IT Security Nachrichten

📰 Intel Unveils Roadmaps For Core Architecture and Atom Architecture


📈 19.96 Punkte
📰 IT Security Nachrichten

🔧 Event-Driven Architecture: Do you need other service’s data in microservice architecture


📈 19.96 Punkte
🔧 Programmierung

🔧 What is difference between monolithic architecture and microservices architecture


📈 19.96 Punkte
🔧 Programmierung

🔧 Serverless Architecture VS Monolith Architecture


📈 19.96 Punkte
🔧 Programmierung

🔧 Blackwell Architecture: Pioneering the Bold Future of Architecture!


📈 19.96 Punkte
🔧 Programmierung

🔧 Software Architecture Patterns: Microservices Architecture


📈 19.96 Punkte
🔧 Programmierung

🔧 Software Architecture Patterns: Space-based Architecture


📈 19.96 Punkte
🔧 Programmierung

🔧 Software Architecture Patterns: Layered Architecture


📈 19.96 Punkte
🔧 Programmierung

🔧 Software Architecture Patterns: Event-driven Architecture


📈 19.96 Punkte
🔧 Programmierung

🔧 30 Day SOC Challenge - Day 1 : Logical Diagram


📈 19.59 Punkte
🔧 Programmierung

🔧 How to Create a Venn Diagram in JS (with Some Help of Tolkien)


📈 19.59 Punkte
🔧 Programmierung

🔧 simple mermaid builder in golang: support ER/sequence diagram, pie chart


📈 19.59 Punkte
🔧 Programmierung

🐧 I made a simple diagram on history of OS, feel free to comment


📈 19.59 Punkte
🐧 Linux Tipps

🔧 BPMN Diagram Import Feature in the .NET Workflow Engine Library by Optimajet


📈 19.59 Punkte
🔧 Programmierung

🐧 Linux Storage Stack Diagram


📈 19.59 Punkte
🐧 Linux Tipps

🔧 How to configure the highlight effect of Sankey diagram


📈 19.59 Punkte
🔧 Programmierung

matomo