/ / Cách đưa sơ đồ nàng tiên cá vào dự án GitHub của bạn

Cách đưa sơ đồ nàng tiên cá vào dự án GitHub của bạn

[*]

[*]Bạn có biết rằng GitHub hiện cung cấp hỗ trợ cho sơ đồ Nàng tiên cá không? Đây là cách triển khai chúng trong ứng dụng của riêng bạn.


Một sơ đồ dòng chảy đơn giản cùng với cú pháp nàng tiên cá được sử dụng để mô tả nó

Nền tảng chia sẻ mã phổ biến, GitHub, đã công bố hỗ trợ một loại nội dung nhúng mới. Trong các tệp đánh dấu, giờ đây bạn có thể sử dụng cú pháp Nàng tiên cá để dễ dàng tạo biểu đồ luồng, sơ đồ trình tự, v.v.

Hương vị đánh dấu của GitHub đã xử lý hình ảnh, danh sách công việc và mã ngắn biểu tượng cảm xúc. Với sự hỗ trợ cho các sơ đồ phổ biến, GitHub đang nỗ lực để có thêm tài liệu hữu ích, nhiều thông tin hơn.

Có gì mới với GitHub?

Bây giờ bạn có thể nhúng mã Nàng tiên cá vào README.md và các tệp đánh dấu khác. Nếu bạn làm vậy, GitHub sẽ hiển thị một sơ đồ được mô tả bằng mã đó. Mã nàng tiên cá sử dụng một cú pháp đơn giản mô tả các phần riêng lẻ của mỗi sơ đồ bằng văn bản thuần túy.

Xem thêm: GitHub là gì? Giới thiệu về các tính năng cơ bản của nó

Làm thế nào để bạn bao gồm các sơ đồ?

  1. Chọn một tệp đánh dấu hiện có hoặc tạo một tệp mới để thêm vào kho lưu trữ của bạn. Sử dụng .md hoặc .markdown các phần mở rộng.

  2. Thêm một số mã Nàng tiên cá vào tệp đó. Chính xác mã nào là tùy thuộc vào bạn; đây là một ví dụ đơn giản để bắt đầu:

    graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
  3. Xem tệp trên GitHub. Bạn sẽ thấy một bản vẽ sơ đồ đẹp mắt.

Bây giờ bạn chỉ cần tìm hiểu vô số các sơ đồ mà Mermaid có sẵn. Hoặc bạn có thể chỉ cần tham khảo tài liệu về Nàng tiên cá và khi bạn cần một sơ đồ.

Tôi có thể sử dụng những loại sơ đồ nào?

Mermaid hỗ trợ các loại sơ đồ sau:

  • Sơ đồ

  • Sự liên tiếp

  • Lớp

  • Tình trạng

  • Mối quan hệ thực thể

  • Hành trình của người dùng

  • Gantt

  • Bánh

  • Yêu cầu

Xem thêm: Biểu đồ Gantt so với Biểu đồ PERT: Sự khác biệt là gì?

Mỗi cú pháp có cú pháp riêng, để phản ánh loại dữ liệu mà biểu đồ hiển thị. Ví dụ, đây là mã cho một sơ đồ trình tự đơn giản:

sequenceDiagram
Bart->>Homer: Don't have a cow, man.

Trông giống như thế này khi được kết xuất:


Một sơ đồ trình tự cho thấy hai diễn viên, Bart và Homer, với một hành động duy nhất.

Và đây là mã cho một sơ đồ trạng thái cơ bản:

stateDiagram-v2
[*] --> New
New --> Ready: admitted
Ready --> Running: scheduler dispatch
Running --> Ready: interrupt
Running --> Waiting: I/O or event wait
Waiting --> Ready: I/O or event completion
Running --> Terminated: exit
Terminated --> [*]

Kết xuất như vậy:


Biểu đồ trạng thái hiển thị vòng đời của một quy trình Unix

Thêm giá trị cho các dự án GitHub của bạn với sơ đồ nàng tiên cá

Sơ đồ nàng tiên cá là một bổ sung hữu ích cho GitHub, đặc biệt vì chúng tôi tin rằng chúng khuyến khích tài liệu tốt hơn. Nhiều dự án có thể được nâng cao với một số giải thích trực quan ngay trong tài liệu hoặc tệp README của họ.

GitHub bây giờ là một dịch vụ phổ biến như vậy, các tính năng và thay đổi của nó ảnh hưởng đến nhiều nhà phát triển trên khắp thế giới. Rất may, có hỗ trợ cho sơ đồ Nàng tiên cá nếu bạn cần và vô hình nếu bạn không. Nhưng, hy vọng rằng ít nhất bạn sẽ bắt đầu thấy một số tài liệu đẹp hơn.


host-website-github
Cách lưu trữ một trang web miễn phí bằng các trang GitHub

Nếu bạn có một trang web đơn giản, bạn không cần phải trả tiền cho dịch vụ lưu trữ web. Bạn có thể sử dụng Trang GitHub miễn phí!

Đọc tiếp


Thông tin về các Tác giả

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *