Just for the lols, agregué soporte de Mermaid al blog en el cuerpo de los textos.
Mermaid, en pocas palabras es al mismo tiempo un markup language para dibujar diferentes tipos de diagramas y un intérprete de éste escrito en JavaScript, lo que lo hace sumamente fácil de desplegar en web.
Cabe mencionar que este formato es aceptado e interpretado chido por Notion.
En pocas palabras hace que esto:
flowchart TD
a --> b
b --> c
b --> dse dibuje como esto:
flowchart TD a --> b b --> c b --> d
Un ejemplo más chido
Estas son las distancias de diferentes aeropuertos importantes en el mundo, vistos de una forma diferente. Todas las distancias las saqué del gran gcmap.
flowchart TD
MEX["MEX"] -->|"3,358 km"| JFK["JFK"]
MEX -->|"2,945 km"| PIT["PIT"]
MEX -->|"3,618 km"| PDX["PDX"]
MEX -->|"1,194 km"| HOU["HOU"]
MEX -->|"9,496 km"| BCN["BCN"]
MEX -->|"3,027 km"| SFO["SFO"]
MEX -->|"3,158 km"| BOG["BOG"]
MEX -->|"998 km"| MID["MID"]
MEX -->|"2,014 km"| PHX["PHX"]
JFK -->|"3,928 km"| PDX
SFO -->|"885 km"| PDX
PIT -->|"3,457 km"| PDX
HOU -->|"1,820 km"| PIT
HOU -->|"2,967 km"| PDX
MEX -->|"9,080 km"| MAD["MAD"]
MAD -->|"484 km"| BCN
BCN -->|"858 km"| CDG["CDG"]
MEX -->|"9,199 km"| CDG
MEX -->|"8,904 km"| LHR["LHR"]
JFK -->|"5,555 km"| LHR
Esto, del lado del código se ve como:
flowchart TD
MEX["MEX"] -->|"3,358 km"| JFK["JFK"]
MEX -->|"2,945 km"| PIT["PIT"]
MEX -->|"3,618 km"| PDX["PDX"]
MEX -->|"1,194 km"| HOU["HOU"]
MEX -->|"9,496 km"| BCN["BCN"]
MEX -->|"3,027 km"| SFO["SFO"]
MEX -->|"3,158 km"| BOG["BOG"]
MEX -->|"998 km"| MID["MID"]
MEX -->|"2,014 km"| PHX["PHX"]
JFK -->|"3,928 km"| PDX
SFO -->|"885 km"| PDX
PIT -->|"3,457 km"| PDX
HOU -->|"1,820 km"| PIT
HOU -->|"2,967 km"| PDX
MEX -->|"9,080 km"| MAD["MAD"]
MAD -->|"484 km"| BCN
BCN -->|"858 km"| CDG["CDG"]
MEX -->|"9,199 km"| CDG
MEX -->|"8,904 km"| LHR["LHR"]
JFK -->|"5,555 km"| LHR
