liveBook · Manning

MermaidJS

As explained in AI-Powered Developer: Build software with ChatGPT and Copilot

Mermaid is a diagramming and charting tool that generates visual diagrams from text-based definitions.

Mermaid is a JavaScript-based diagramming and charting tool that turns text-based definitions into diagrams. Its plain-text syntax fits Markdown, wikis, and documentation tools, making diagrams easy to generate alongside architectural discussion. section 3.3

Use Mermaid to make an application's architecture visible: model components, their interactions, class relationships, and system boundaries. It supports flowcharts, sequence diagrams, class diagrams, state diagrams, and C4 views. section 3.3 section 3.4

Iterate on an IT asset-management class model

Start with a Python ITAM system using FastAPI, SQLAlchemy, and hexagonal architecture. Request a Mermaid class diagram, then refine it by adding Asset as Hardware’s parent, moving funding details into FundingDetails, and introducing a DepreciationStrategy interface with concrete implementations. The resulting relationship view can show inheritance, containment, uses, and implementation links. section 3.3

I would like to build an ITAM project written in Python. It will focus on the tracking and management of Hardware. It should expose REST APIs, using FastAPI, and persist data using SQLAlchemy. It should use hexagonal architecture. As a software architect, please show me the Mermaid class diagram for this project."

A focused prompt supplies the domain, language, frameworks, persistence layer, and architectural pattern needed to request a first Mermaid class diagram. section 3.3

Mermaid can also express a C4 progression: context diagrams show interactions inside and outside the system; container diagrams show components and relationships; component and code diagrams provide increasingly detailed views. Pair diagram generation with explicit requirements, because stated choices such as FastAPI, SQLAlchemy, and hexagonal architecture shape the proposed design. section 3.3 section 3.3

How AI-Powered Developer: Build software with ChatGPT and Copilot covers it

How deep it goes
Progresses from class relationships to C4 context, container, component, and code views.
Examples
Demonstrates an ITAM system with Hardware, Asset, FundingDetails, depreciation strategies, and C4 diagrams.
What it assumes
Assumes an application design context and uses specified architecture, language, framework, and persistence choices as diagram inputs.
What you can do after
Apply it via Mermaid to create and iteratively refine architecture and class diagrams from textual requirements.
How it connects
Connects with hexagonal architecture, C4 model, UML, PlantUML, SOLID principles, and the Visitor pattern.

Also explained in

Compare how 2 books explain MermaidJS →

Related concepts

This explainer was generated by Manning's knowledge graph from the text of AI-Powered Developer: Build software with ChatGPT and Copilot. The section links point to the parts of the book it draws on.