---
# System prepended metadata

title: Seminar \#1 - Mermaid
tags: [TKPM-Mermaid]

---

---
Seminar \#1 - Mermaid
===
###### tags: ```TKPM-Mermaid```

## Cú pháp ```mermaid```

[https://mermaid-js.github.io/mermaid/#/](https://mermaid-js.github.io/mermaid/#/)

## Luyện tập

Sử dụng cú pháp `mermaid`, vẽ các diagram sau:

#### Vì một số diagram: cụ thể là State Chart Diagram không thể render vì state VerifyAccount quá dài, đồng thời Class Diagram vì sự cố nào đó nên thêm bất kì dòng sau nó sẽ không thể tự render được nữa.

#### Nên: Nhóm em import link diagram từ Live Editor Mermaid. Thầy có thể kiểm tra code của một diagram bằng cách click vào diagram đó ạ.

### Flow Chart

- Euclide GCD

[![](https://mermaid.ink/img/eyJjb2RlIjoiZ3JhcGggVERcbiAgICBTdGFydCAtLT4gMVtJbnB1dCBBLEJdXG4gICAgMSAtLT4gYzEoKCApKVxuICAgIGMxIC0tPiBjZDF7QiA9IDB9XG4gICAgYzIoKCApKSAtLT4gYzFcbiAgICBjZDEgLS0-fE5PfCBibm97QSA-IEJ9XG4gICAgY2QxIC0tPnxZRVN8IHBhW1ByaW50IEFdXG4gICAgYm5vIC0tPnxOT3wgYXNiW0I9Qi1BXVxuICAgIGJubyAtLT58WUVTfCBhc2FhW0E9QS1CXVxuICAgIGFzYWEgLS0-IGMyXG4gICAgYXNiIC0tPiBjMlxuICAgIHBhIC0tPiBFTkQiLCJtZXJtYWlkIjp7InRoZW1lIjoiZm9yZXN0In19)](https://mermaid-js.github.io/mermaid-live-editor/#/edit/eyJjb2RlIjoiZ3JhcGggVERcbiAgICBTdGFydCAtLT4gMVtJbnB1dCBBLEJdXG4gICAgMSAtLT4gYzEoKCApKVxuICAgIGMxIC0tPiBjZDF7QiA9IDB9XG4gICAgYzIoKCApKSAtLT4gYzFcbiAgICBjZDEgLS0-fE5PfCBibm97QSA-IEJ9XG4gICAgY2QxIC0tPnxZRVN8IHBhW1ByaW50IEFdXG4gICAgYm5vIC0tPnxOT3wgYXNiW0I9Qi1BXVxuICAgIGJubyAtLT58WUVTfCBhc2FhW0E9QS1CXVxuICAgIGFzYWEgLS0-IGMyXG4gICAgYXNiIC0tPiBjMlxuICAgIHBhIC0tPiBFTkQiLCJtZXJtYWlkIjp7InRoZW1lIjoiZm9yZXN0In19)

- Quadratic Equation

[![](https://mermaid.ink/img/eyJjb2RlIjoiZ3JhcGggVERcbiAgICBTdGFydCAtLT4gaW5wW0lucHV0IGEsYixjXVxuICAgIGlucCAtLT4gYWUwe2EgPT0gMH1cbiAgICBhZTAgLS0-IHxZRVN8YmUwe2IgPT0gMH1cbiAgICBiZTAgLS0-IHxZRVN8Y2Uwe2MgPT0gMH1cbiAgICBiZTAgLS0-IHxOT3wxblt4ID0gLWIvYV1cbiAgICBjZTAgLS0-IHxZRVN8aW5mW0luZmluaXR5IG9mIHJlc3VsdF1cbiAgICBjZTAgLS0-IHxOT3xub3NbTm8gc29sdXRpb25zXVxuICAgIGFlMCAtLT4gfE5PfGRlbHRhW2RlbHRhID0gYl4yIC0gNGFjXVxuICAgIGRlbHRhIC0tPiBkZWx0YWViMHtkZWx0YSA-PSAwfVxuICAgIGRlbHRhZWIwIC0tPiB8WUVTfGRlbHRhZTB7ZGVsdGEgPT0gMH1cbiAgICBkZWx0YWUwIC0tPiB8WUVTfCAxbm5beCA9IC1iLzJhXVxuICAgIGRlbHRhZTAgLS0-IHxOT3x0d29yZWFsW1wieCA9IC0oLWItc3FydChkZWx0YSkpLzJhPGJyIC8-eCA9IC0oLWIrc3FydChkZWx0YSkpLzJhXCJdXG4gICAgZGVsdGFlYjAgLS0-IHxOT3xub3JlYWxbTm8gc29sdXRpb25zXSIsIm1lcm1haWQiOnsidGhlbWUiOiJmb3Jlc3QifX0)](https://mermaid-js.github.io/mermaid-live-editor/#/edit/eyJjb2RlIjoiZ3JhcGggVERcbiAgICBTdGFydCAtLT4gaW5wW0lucHV0IGEsYixjXVxuICAgIGlucCAtLT4gYWUwe2EgPT0gMH1cbiAgICBhZTAgLS0-IHxZRVN8YmUwe2IgPT0gMH1cbiAgICBiZTAgLS0-IHxZRVN8Y2Uwe2MgPT0gMH1cbiAgICBiZTAgLS0-IHxOT3wxblt4ID0gLWIvYV1cbiAgICBjZTAgLS0-IHxZRVN8aW5mW0luZmluaXR5IG9mIHJlc3VsdF1cbiAgICBjZTAgLS0-IHxOT3xub3NbTm8gc29sdXRpb25zXVxuICAgIGFlMCAtLT4gfE5PfGRlbHRhW2RlbHRhID0gYl4yIC0gNGFjXVxuICAgIGRlbHRhIC0tPiBkZWx0YWViMHtkZWx0YSA-PSAwfVxuICAgIGRlbHRhZWIwIC0tPiB8WUVTfGRlbHRhZTB7ZGVsdGEgPT0gMH1cbiAgICBkZWx0YWUwIC0tPiB8WUVTfCAxbm5beCA9IC1iLzJhXVxuICAgIGRlbHRhZTAgLS0-IHxOT3x0d29yZWFsW1wieCA9IC0oLWItc3FydChkZWx0YSkpLzJhPGJyIC8-eCA9IC0oLWIrc3FydChkZWx0YSkpLzJhXCJdXG4gICAgZGVsdGFlYjAgLS0-IHxOT3xub3JlYWxbTm8gc29sdXRpb25zXSIsIm1lcm1haWQiOnsidGhlbWUiOiJmb3Jlc3QifX0)

### Class Diagram

[![](https://mermaid.ink/img/eyJjb2RlIjoiY2xhc3NEaWFncmFtXG4gICAgXG5cdEFkZHJlc3MgXCIxXCIgLS0qIFwiMVwiIEN1c3RvbWVyOiBIYXNcblx0Q3VzdG9tZXIgXCIxXCIgLS0gXCIqXCIgUHJvZHVjdDogUHVyY2hhc2VzXG5cdFByZW1pdW1DdXN0b21lciAtLXw-IEN1c3RvbWVyXG5cdFJlZ3VsYXJDdXN0b21lciAtLXw-IEN1c3RvbWVyXG5cdEJpbGwgLS1vIEN1c3RvbWVyOiBCZWxvbmdzIHRvXG5cdEJpbGwgLi58PiBQYXltZW50IENvdW50ZXI6IEFjY2VwdHNcblx0QmlsbCAuLj4gRGlzY291bnRcblx0QmlsbCAuLj4gUHVyY2hhc2VEZXRhaWxcblx0RGlzY291bnQgLi4-IFB1cmNoYXNlRGV0YWlsXG5cdEN1c3RvbWVyIC0tIFB1cmNoYXNlRGV0YWlsXG5cdFB1cmNoYXNlRGV0YWlsIC0tIFByb2R1Y3RcbiAgICBcbiAgQ3VzdG9tZXI6IGN1c3ROYW1lOiBTdHJpbmdcblx0Q3VzdG9tZXI6IGN1c3RJRDogSW50XG5cdEN1c3RvbWVyOiBjdXN0UGhudW06IEludFxuXHRDdXN0b21lcjogcHVyY2hhc2VJdGVtKClcblx0Q3VzdG9tZXI6IHJlcXVlc3RCaWxsKClcblx0Q3VzdG9tZXI6IGVudGVyQ3VzdERldGFpbCgpXG4gICAgXG4gIFByZW1pdW1DdXN0b21lcjogcHJlbWl1bURpc2NvdW50OiBJbnRcblx0UHJlbWl1bUN1c3RvbWVyOiBlbnRlckN1c3REZXRhaWwoKVxuXG4gIFJlZ3VsYXJDdXN0b21lcjogcmVndWxhckRpc2NvdW50OiBJbnRcblx0UmVndWxhckN1c3RvbWVyOiBlbnRlckN1c3REZXRhaWwoKVxuICAgIFxuICBQcm9kdWN0OiBwcm9kdWN0SUQ6IEludFxuXHRQcm9kdWN0OiBwcm9kdWN0TmFtZTogU3RyaW5nXG5cdFByb2R1Y3Q6IHByb2R1Y3RQcmljZTogRmxvYXRcblx0UHJvZHVjdDogZ2V0UHJpY2UoKVxuXHRQcm9kdWN0OiBzZXRQcmljZSgpXG4gICAgXG4gIEFkZHJlc3M6IHN0cmVldDogU3RyaW5nXG5cdEFkZHJlc3M6IGNpdHk6IFN0cmluZ1xuXHRBZGRyZXNzOiB6aXBjb2RlOiBJbnRcblx0QWRkcmVzczogZW50ZXJTdHJlZXQoKVxuXHRBZGRyZXNzOiBlbnRlckNpdHkoKVxuXHRBZGRyZXNzOiBlbnRlclN0YXRlKClcblx0QWRkcmVzczogZW50ZXJaaXBjb2RlKClcbiAgICBcbiAgUHVyY2hhc2VEZXRhaWw6IGN1c3RJRDogSW50XG5cdFB1cmNoYXNlRGV0YWlsOiBxdWFudGl0eTogSW50XG5cdFB1cmNoYXNlRGV0YWlsOiBwdXJjaGFzZURhdGU6IERhdGVcblx0UHVyY2hhc2VEZXRhaWw6IHByb2R1Y3RJRDogSW50XG5cdFB1cmNoYXNlRGV0YWlsOiBjYWxjdWxhdGVUb3RhbEFtdCgpXG5cdFB1cmNoYXNlRGV0YWlsOiBnZW5lcmF0ZVB1cmNoYXNlTGlzdCgpXG4gICAgXG4gIERpc2NvdW50OiBkaXNjb3VudFR5cGVcblx0RGlzY291bnQ6IGRpc2NvdW50VmFsdWVcblx0RGlzY291bnQ6IFNlbGVjdERpc2NvdW50KClcbiAgICBcbiAgQmlsbDogcGF5YWJsZUFtdFxuXHRCaWxsOiBjYWxjdWxhdGVQYXlhYmxlQW10KClcblx0QmlsbDogZ2VuZXJhdGVCaWxsKClcbiAgICBcbiAgICBcbiAgICBcbiAgPDxpbnRlcmZhY2U-PiBQYXltZW50IENvdW50ZXJcblx0UGF5bWVudCBDb3VudGVyOiBjYWxjdWxhdGVQYXlhYmxlQW10KClcblx0UGF5bWVudCBDb3VudGVyOiBnZW5lcmF0ZUJpbGwoKSIsIm1lcm1haWQiOnsidGhlbWUiOiJmb3Jlc3QifX0)](https://mermaid-js.github.io/mermaid-live-editor/#/edit/eyJjb2RlIjoiY2xhc3NEaWFncmFtXG4gICAgXG5cdEFkZHJlc3MgXCIxXCIgLS0qIFwiMVwiIEN1c3RvbWVyOiBIYXNcblx0Q3VzdG9tZXIgXCIxXCIgLS0gXCIqXCIgUHJvZHVjdDogUHVyY2hhc2VzXG5cdFByZW1pdW1DdXN0b21lciAtLXw-IEN1c3RvbWVyXG5cdFJlZ3VsYXJDdXN0b21lciAtLXw-IEN1c3RvbWVyXG5cdEJpbGwgLS1vIEN1c3RvbWVyOiBCZWxvbmdzIHRvXG5cdEJpbGwgLi58PiBQYXltZW50IENvdW50ZXI6IEFjY2VwdHNcblx0QmlsbCAuLj4gRGlzY291bnRcblx0QmlsbCAuLj4gUHVyY2hhc2VEZXRhaWxcblx0RGlzY291bnQgLi4-IFB1cmNoYXNlRGV0YWlsXG5cdEN1c3RvbWVyIC0tIFB1cmNoYXNlRGV0YWlsXG5cdFB1cmNoYXNlRGV0YWlsIC0tIFByb2R1Y3RcbiAgICBcbiAgQ3VzdG9tZXI6IGN1c3ROYW1lOiBTdHJpbmdcblx0Q3VzdG9tZXI6IGN1c3RJRDogSW50XG5cdEN1c3RvbWVyOiBjdXN0UGhudW06IEludFxuXHRDdXN0b21lcjogcHVyY2hhc2VJdGVtKClcblx0Q3VzdG9tZXI6IHJlcXVlc3RCaWxsKClcblx0Q3VzdG9tZXI6IGVudGVyQ3VzdERldGFpbCgpXG4gICAgXG4gIFByZW1pdW1DdXN0b21lcjogcHJlbWl1bURpc2NvdW50OiBJbnRcblx0UHJlbWl1bUN1c3RvbWVyOiBlbnRlckN1c3REZXRhaWwoKVxuXG4gIFJlZ3VsYXJDdXN0b21lcjogcmVndWxhckRpc2NvdW50OiBJbnRcblx0UmVndWxhckN1c3RvbWVyOiBlbnRlckN1c3REZXRhaWwoKVxuICAgIFxuICBQcm9kdWN0OiBwcm9kdWN0SUQ6IEludFxuXHRQcm9kdWN0OiBwcm9kdWN0TmFtZTogU3RyaW5nXG5cdFByb2R1Y3Q6IHByb2R1Y3RQcmljZTogRmxvYXRcblx0UHJvZHVjdDogZ2V0UHJpY2UoKVxuXHRQcm9kdWN0OiBzZXRQcmljZSgpXG4gICAgXG4gIEFkZHJlc3M6IHN0cmVldDogU3RyaW5nXG5cdEFkZHJlc3M6IGNpdHk6IFN0cmluZ1xuXHRBZGRyZXNzOiB6aXBjb2RlOiBJbnRcblx0QWRkcmVzczogZW50ZXJTdHJlZXQoKVxuXHRBZGRyZXNzOiBlbnRlckNpdHkoKVxuXHRBZGRyZXNzOiBlbnRlclN0YXRlKClcblx0QWRkcmVzczogZW50ZXJaaXBjb2RlKClcbiAgICBcbiAgUHVyY2hhc2VEZXRhaWw6IGN1c3RJRDogSW50XG5cdFB1cmNoYXNlRGV0YWlsOiBxdWFudGl0eTogSW50XG5cdFB1cmNoYXNlRGV0YWlsOiBwdXJjaGFzZURhdGU6IERhdGVcblx0UHVyY2hhc2VEZXRhaWw6IHByb2R1Y3RJRDogSW50XG5cdFB1cmNoYXNlRGV0YWlsOiBjYWxjdWxhdGVUb3RhbEFtdCgpXG5cdFB1cmNoYXNlRGV0YWlsOiBnZW5lcmF0ZVB1cmNoYXNlTGlzdCgpXG4gICAgXG4gIERpc2NvdW50OiBkaXNjb3VudFR5cGVcblx0RGlzY291bnQ6IGRpc2NvdW50VmFsdWVcblx0RGlzY291bnQ6IFNlbGVjdERpc2NvdW50KClcbiAgICBcbiAgQmlsbDogcGF5YWJsZUFtdFxuXHRCaWxsOiBjYWxjdWxhdGVQYXlhYmxlQW10KClcblx0QmlsbDogZ2VuZXJhdGVCaWxsKClcbiAgICBcbiAgICBcbiAgICBcbiAgPDxpbnRlcmZhY2U-PiBQYXltZW50IENvdW50ZXJcblx0UGF5bWVudCBDb3VudGVyOiBjYWxjdWxhdGVQYXlhYmxlQW10KClcblx0UGF5bWVudCBDb3VudGVyOiBnZW5lcmF0ZUJpbGwoKSIsIm1lcm1haWQiOnsidGhlbWUiOiJmb3Jlc3QifX0)

### Sequence Diagram

[![](https://mermaid.ink/img/eyJjb2RlIjoic2VxdWVuY2VEaWFncmFtXG4gICAgcGFydGljaXBhbnQgQ3VzdG9tZXJcblxuICAgIEN1c3RvbWVyLT4-K1NlYXJjaFBhZ2U6IDE6b25TZWFyY2goYXV0aG9yKVxuICAgIFNlYXJjaFBhZ2UtPj5TZWFyY2hQYWdlOiAxLjE6dmFsaWRhdGVTZWFyY2hDcml0ZXJpYSgpXG4gICAgXG4gICAgYWx0IGF1dGhvciBlbnRlcmVkXG4gICAgICAgIFNlYXJjaFBhZ2UtPj4rQ2F0YWxvZzoxLjI6c2VhcmNoQnlBdXRob3IoYXV0aG9yKVxuICAgICAgICBDYXRhbG9nLT4-K1NlYXJjaFJlc3VsdDogMS4yLjE6Y3JlYXRlKClcbiAgICAgICAgU2VhcmNoUmVzdWx0LT4-LVNlYXJjaFJlc3VsdFBhZ2U6IDEuMi4xLjE6ZGlzcGxheSgpXG4gICAgZWxzZSBhdXRob3Igbm90IGVudGVyZWRcbiAgICAgICAgU2VhcmNoUGFnZS0-Pi1TZWFyY2hQYWdlOjEuMzpkaXNwbGF5RXJyb3JNZXNzYWdlKClcbiAgICBlbmQiLCJtZXJtYWlkIjp7InRoZW1lIjoiZm9yZXN0In19)](https://mermaid-js.github.io/mermaid-live-editor/#/edit/eyJjb2RlIjoic2VxdWVuY2VEaWFncmFtXG4gICAgcGFydGljaXBhbnQgQ3VzdG9tZXJcblxuICAgIEN1c3RvbWVyLT4-K1NlYXJjaFBhZ2U6IDE6b25TZWFyY2goYXV0aG9yKVxuICAgIFNlYXJjaFBhZ2UtPj5TZWFyY2hQYWdlOiAxLjE6dmFsaWRhdGVTZWFyY2hDcml0ZXJpYSgpXG4gICAgXG4gICAgYWx0IGF1dGhvciBlbnRlcmVkXG4gICAgICAgIFNlYXJjaFBhZ2UtPj4rQ2F0YWxvZzoxLjI6c2VhcmNoQnlBdXRob3IoYXV0aG9yKVxuICAgICAgICBDYXRhbG9nLT4-K1NlYXJjaFJlc3VsdDogMS4yLjE6Y3JlYXRlKClcbiAgICAgICAgU2VhcmNoUmVzdWx0LT4-LVNlYXJjaFJlc3VsdFBhZ2U6IDEuMi4xLjE6ZGlzcGxheSgpXG4gICAgZWxzZSBhdXRob3Igbm90IGVudGVyZWRcbiAgICAgICAgU2VhcmNoUGFnZS0-Pi1TZWFyY2hQYWdlOjEuMzpkaXNwbGF5RXJyb3JNZXNzYWdlKClcbiAgICBlbmQiLCJtZXJtYWlkIjp7InRoZW1lIjoiZm9yZXN0In19)

### State Chart Diagram

[![](https://mermaid.ink/img/eyJjb2RlIjoic3RhdGVEaWFncmFtXG4gICAgXG4gIHN0YXRlIElkbGV7fVxuICBcbiAgWypdIC0tPiBJZGxlXG4gIFxuICBzdGF0ZSBBY2NvdW50QWN0aW9uc3t9XG4gIFxuICBzdGF0ZSBEaXNwZW5zZU1vbmV5e31cbiAgXG4gIHN0YXRlIFByaW50UmVjZWlwdHt9XG4gICAgXG4gIHN0YXRlIFZlcmlmeUFjY291bnR7XG5cbiAgICBzdGF0ZSBWZXJpZnlDYXJke1xuICAgICAgY2FyZFN1Ym1pdHRlZFxuICAgICAgcmVhZENhcmRcbiAgICAgIHJldHVybkNhcmRcbiAgICB9XG4gICAgXG4gICAgc3RhdGUgQ2hlY2tDYXJkIDw8Zm9yaz4-XG4gICAgVmVyaWZ5Q2FyZCAtLT4gQ2hlY2tDYXJkXG4gICAgQ2hlY2tDYXJkIC0tPiBJZGxlOiBbZWxzZV1cbiAgICBDaGVja0NhcmQgLS0-IENhcmRWYWxpZDogW2NhcmRWYWxpZF1cblxuICAgIHN0YXRlIENhcmRWYWxpZHt9XG5cbiAgICBDYXJkVmFsaWQgLS0-IFZlcmlmeVBpblxuICAgICAgXG4gICAgc3RhdGUgVmVyaWZ5UGlue1xuICAgICAgcGluU3VibWl0XG4gICAgICBjaGVja1BpblxuICAgICAgcmV0dXJuQ2FyZFxuICAgIH1cbiAgICBzdGF0ZSBDaGVja1BpbiA8PGZvcms-PlxuICAgIFZlcmlmeVBpbiAtLT4gQ2hlY2tQaW5cbiAgICBDaGVja1BpbiAtLT4gUGluQ29ycmVjdCA6IFBJTlZhbGlkXG4gICAgQ2hlY2tQaW4gLS0-IFBpbkluY29ycmVjdCA6IFtlbHNlXVxuICAgICAgXG4gICAgc3RhdGUgUGluQ29ycmVjdHt9XG5cbiAgICBzdGF0ZSBQaW5JbmNvcnJlY3R7fVxuXG4gICAgUGluSW5jb3JyZWN0IC0tPiBDaGVja1BpbjogW3RyaWVzPG1heFRyaWVzXS90cmllcysrXG4gIH1cbiAgICBcbiAgQWNjb3VudEFjdGlvbnMgLS0-IERpc3BlbnNlTW9uZXlcbiAgXG4gIERpc3BlbnNlTW9uZXkgLS0-IFByaW50UmVjZWlwdFxuICBcbiAgUHJpbnRSZWNlaXB0IC0tPiBUcmFuc2FjdGlvbkNvbXBsZXRlXG4gIFxuICBBY2NvdW50QWN0aW9ucyAtLT4gUHJpbnRSZWNlaXB0XG4gIFxuICBEaXNwZW5zZU1vbmV5IC0tPiBUcmFuc2FjdGlvbkNvbXBsZXRlXG4gIFxuICBUcmFuc2FjdGlvbkNvbXBsZXRlIC0tPiBJZGxlXG4gIFxuICBJZGxlIC0tPiBWZXJpZnlBY2NvdW50IiwibWVybWFpZCI6eyJ0aGVtZSI6ImZvcmVzdCJ9LCJ1cGRhdGVFZGl0b3IiOmZhbHNlfQ)](https://mermaid-js.github.io/mermaid-live-editor/#/edit/eyJjb2RlIjoic3RhdGVEaWFncmFtXG4gICAgXG4gIHN0YXRlIElkbGV7fVxuICBcbiAgWypdIC0tPiBJZGxlXG4gIFxuICBzdGF0ZSBBY2NvdW50QWN0aW9uc3t9XG4gIFxuICBzdGF0ZSBEaXNwZW5zZU1vbmV5e31cbiAgXG4gIHN0YXRlIFByaW50UmVjZWlwdHt9XG4gICAgXG4gIHN0YXRlIFZlcmlmeUFjY291bnR7XG5cbiAgICBzdGF0ZSBWZXJpZnlDYXJke1xuICAgICAgY2FyZFN1Ym1pdHRlZFxuICAgICAgcmVhZENhcmRcbiAgICAgIHJldHVybkNhcmRcbiAgICB9XG4gICAgXG4gICAgc3RhdGUgQ2hlY2tDYXJkIDw8Zm9yaz4-XG4gICAgVmVyaWZ5Q2FyZCAtLT4gQ2hlY2tDYXJkXG4gICAgQ2hlY2tDYXJkIC0tPiBJZGxlOiBbZWxzZV1cbiAgICBDaGVja0NhcmQgLS0-IENhcmRWYWxpZDogW2NhcmRWYWxpZF1cblxuICAgIHN0YXRlIENhcmRWYWxpZHt9XG5cbiAgICBDYXJkVmFsaWQgLS0-IFZlcmlmeVBpblxuICAgICAgXG4gICAgc3RhdGUgVmVyaWZ5UGlue1xuICAgICAgcGluU3VibWl0XG4gICAgICBjaGVja1BpblxuICAgICAgcmV0dXJuQ2FyZFxuICAgIH1cbiAgICBzdGF0ZSBDaGVja1BpbiA8PGZvcms-PlxuICAgIFZlcmlmeVBpbiAtLT4gQ2hlY2tQaW5cbiAgICBDaGVja1BpbiAtLT4gUGluQ29ycmVjdCA6IFBJTlZhbGlkXG4gICAgQ2hlY2tQaW4gLS0-IFBpbkluY29ycmVjdCA6IFtlbHNlXVxuICAgICAgXG4gICAgc3RhdGUgUGluQ29ycmVjdHt9XG5cbiAgICBzdGF0ZSBQaW5JbmNvcnJlY3R7fVxuXG4gICAgUGluSW5jb3JyZWN0IC0tPiBDaGVja1BpbjogW3RyaWVzPG1heFRyaWVzXS90cmllcysrXG4gIH1cbiAgICBcbiAgQWNjb3VudEFjdGlvbnMgLS0-IERpc3BlbnNlTW9uZXlcbiAgXG4gIERpc3BlbnNlTW9uZXkgLS0-IFByaW50UmVjZWlwdFxuICBcbiAgUHJpbnRSZWNlaXB0IC0tPiBUcmFuc2FjdGlvbkNvbXBsZXRlXG4gIFxuICBBY2NvdW50QWN0aW9ucyAtLT4gUHJpbnRSZWNlaXB0XG4gIFxuICBEaXNwZW5zZU1vbmV5IC0tPiBUcmFuc2FjdGlvbkNvbXBsZXRlXG4gIFxuICBUcmFuc2FjdGlvbkNvbXBsZXRlIC0tPiBJZGxlXG4gIFxuICBJZGxlIC0tPiBWZXJpZnlBY2NvdW50IiwibWVybWFpZCI6eyJ0aGVtZSI6ImZvcmVzdCJ9LCJ1cGRhdGVFZGl0b3IiOmZhbHNlfQ)

:::warning
**Bài làm nhóm**. Có thể dùng `Mermaid Live Editor` để thử nghiệm.
