2020-09-07 14:02:09 +08:00
# Tutorials
2020-08-21 18:41:57 -07:00
This is list of publicly available Tutorials in Mermaid. This is intended as a basic introduction for the use of the Live Editor and HTML with mermaid.
2020-09-07 14:02:09 +08:00
For the purposes, the Live-Editor is capable of taking care of all diagramming needs, and these are the most common use cases for it.
2020-08-21 18:41:57 -07:00
2020-09-07 14:02:09 +08:00
## Live-Editor Tutorials
The definitions that can be generated the Live-Editor are also backwards-compatible as of version 8.7.0.
2020-08-21 18:41:57 -07:00
https://www.youtube.com/watch?v=SQ9QmuTHuSI& t=438s
https://www.youtube.com/watch?v=5RQqht3NNSE
https://www.youtube.com/watch?v=7_2IroEs6Is& t=207s
https://www.youtube.com/watch?v=9HZzKkAqrX8
https://www.youtube.com/watch?v=7_2IroEs6Is& t=207s
https://www.youtube.com/watch?v=9HZzKkAqrX8
2020-09-07 14:02:09 +08:00
## Mermaid with HTML:
Examples are provided in [Gettting Started ](n00b-gettingStarted.md )
2020-08-21 18:41:57 -07:00
2020-09-07 14:02:09 +08:00
**CodePen Examples:**
2020-08-21 18:41:57 -07:00
https://codepen.io/CarlBoneri/pen/BQwZzq
https://codepen.io/tdkn/pen/vZxQzd
https://codepen.io/janzeteachesit/pen/OWWZKN
2020-09-07 14:02:09 +08:00
## Mermaid with Text Area:
2020-08-21 18:41:57 -07:00
2020-09-07 14:02:09 +08:00
https://codepen.io/Ryuno-Ki/pen/LNxwgR