Mastering Mermaid.js: Diagram, Charts and Data Visualization

سرفصل های دوره

Easily and quickly create flowchart, mindmap , User journey, Entity Relationship , pie charts, State and class diagrams

1. Introduction

1. Welcome to Mermaid.js Course

2. Introduction to Mermaid.js

3. Introducing the Live Editor

4. Working with Vscode

5. Working with HTML - Javascript

6. Working With Jupyter Notebook

7. Why Use Mermaid.js

2. Flowchart Diagram

1. Introduction to Flowchart

2. Flowchart Basics

3. Orientation and Error Handling

4. Working with Nodes - Node Text

5. Working with Links

6. More on Working with Links

7. Working with Subgraph

8. Flowchart Node Interactivity

9. Flowchart - Styling Lines and Nodes

3. Sequence Diagram

1. Introduction to Sequence Diagram

2. Sequence Diagram Uses

3. Creating and Connecting Participants

4. Working with Messages, Notes and Comments

5. More on Sequence Objects

6. Activation Box

7. Alternative Frame 1 (Alt)

8. Exercise (Actors, participants, Messages,Alt)

9. Alternative Frame 2 (Parallel)

10. Alternative Frame 3 (Critical Region)

11. More frames (loop, break)

12. Grouping and Coloring

13. Configuration Settings for Sequence Diagram

4. Class Diagram

1. Introduction to Class Diagram

2. Defining a class Diagram

3. Class Visibility and Types

4. Class Relationship

5. Titles, Notes Label and comments

6. Cardinality - Multiplicity

7. Class Annotation

8. Namespace and Styling

9. Styling HTML and CSS

10. Node Interactivity

5. State Diagram

1. Introduction to State Diagram

2. Our First Diagram

3. Describing and Labeling diagram

4. Composite State

5. Working with Choice

6. Fork and Join

7. Styling State Diagram

6. Entity Relationship Diagram

1. Introduction to Entity Relationship Diagram

2. ERD Entities

3. Relationship 1

4. Relationship 2

5. Styling ER Diagram

7. User Journey

1. Introduction to User Journey Diagram

2. User Jounrey in Mermaid.js

3. Exercise 2- Mike and journey Dinner

4. Exercise 3- Dental Business Feedback

8. Gantt Chart Diagram

1. Introduction to Gantt Chart

2. Simple Gantt Chart

3. Adding Dependencies and Status

4. Working with Date-Time 1

5. Working with Date-Time 2

6. Adding Milestone and Compact

7. Styling Gant Chart

8. Interating with Gantt Chart

9. Pie Chart Diagram

1. Introduction to Pie Chart and Sample Diagram

2. Pie Chart Configurations

10. Quadrant Chart Diagram

1. Introduction to Quadrant Chart Diagram

2. Exploring Quadrant Chart 1

3. Exploring Quadrant Chart 2

4. Styling Quadrants

5. Configuration Settings

11. Requirement Diagram

1. Introduction to Requirement Diagram

2. Exploring Requirement Diagram

3. Web App Requirement Diagram

4. Requirement Diagram Full Feature

12. GitGraph Diagram

1. Introduction to GitGraph Diagram

2. GitGraph in Mermaid Live

3. Working with Branch 1

4. Working with Branch 2

5. Configuration Settings 1

6. Configuration Settings 2

7. Styling Gitgraph 1

8. Styling Gitgraph 2

13. C4 Diagram

1. Introduction to C4 Diagram

2. Context Diagram

3. Container Diagram

4. Component Diagram

5. Code Diagram

6. Dynamic Diagram

7. Deployment Diagram

14. Mindmap Diagram

1. Introduction to Mindmap Diagram

2. Starting with Mindmap diagram

3. Node shapes

4. Adding Icons and Special Characters

15. Timeline Diagram

1. Introduction to Timeline Diagram

2. Getting Started

3. Describe and Group Timelines

4. Styling Configuration

16. ZenUML Diagram

1. Introduction to ZenUML Diagram

17. Sankey Diagram

1. Introduction to Sankey Diagram

2. Sankey In Action

3. More Sankey

18. XYChart Diagram

1. Introduction to XYChart Diagram

2. Working with Bar and Chart

3. Sankey Configuration

45,900 تومان

خرید اشتراک افزودن به سبد خرید

خرید دانلودی فوری

در این روش نیاز به افزودن محصول به سبد خرید و تکمیل اطلاعات نیست و شما پس از وارد کردن ایمیل خود و طی کردن مراحل پرداخت لینک های دریافت محصولات را در ایمیل خود دریافت خواهید کرد.

تولید کننده: Udemy