Diagrams

For diagrams, we generally use UML and ERD (because it is an industry standard) and Mermaid lib (it has great support on GitHub, VitePress, PHPStorm and VSCode).

Use Case Diagram

This is high-level diagram type, often used on prototype stage, pretty easy to read by non-technical staff.

• Video: UML Use Case Diagram Tutorial

Sequence diagram

• Video: How to Make a UML Sequence Diagram
• Advanced Guide: Explore the UML sequence diagram

State diagram

• Mermaid: https://mermaid.js.org/syntax/stateDiagram.html
• Video: UML State Diagram Tutorial

Class Diagram

• Video: UML Class Diagram Tutorial