Generador de Tablas Markdown: Crear Tablas en Markdown

Generador de Tablas Markdown

Las tablas GFM (GitHub Flavored Markdown) usan caracteres de tuberia para separar columnas, una línea separadora con guiones para definir el encabezado y dos puntos opcionales en la línea separadora para controlar la alineación. El formato es soportado por GitHub, GitLab, muchos generadores de sitios estaticos y la mayoría de los editores Markdown.

Sintaxis de Tablas GFM

La tabla mínima válida requiere una fila de encabezado, una línea separadora y al menos una fila de datos:

| Name | Role |
|------|------|
| Alice | Engineer |
| Bob | Designer |

La línea separadora debe contener al menos tres guiones (---) por celda. Mas guiones no importan; no cambian el comportamiento, solo afectan la legibilidad en el código fuente.

Alineación de Columnas

La alineación se establece con dos puntos en la línea separadora:

| Left | Center | Right |
|:-----|:------:|------:|
| text | text | text |

La alineación a la derecha es más útil para columnas numericas donde quieres alinear los digitos.

Formato de Tuberias en el Código Fuente

Las tuberias al inicio y final de cada fila son opcionales en la especificación, pero la mayoría de los formateadores y linters las requieren. No necesitas rellenar las celdas para alinear visualmente las tuberias. Estas dos tablas se renderizan igual:

| Column 1 | Column 2 | Column 3 |
|----------|----------|----------|
| Short | A much longer cell value | x |

|Column 1|Column 2|Column 3|
|---|---|---|
|Short|A much longer cell value|x|

Prettier y formateadores similares rellenaran la versión corta a la versión alineada al guardar.

Lo que las Tablas Markdown No Pueden Hacer

Sin celdas combinadas

Cada fila debe tener exactamente el mismo número de celdas. No hay equivalente a colspan o rowspan. Si una celda esta conceptualmente vacia, usa un espacio o dejalo en blanco: | |.

Sin tablas anidadas

Una celda de tabla no puede contener otra tabla. Las celdas tampoco pueden contener elementos de bloque como bloques de código, citas o listas. El formato en línea (negritas, código, enlaces) funciona dentro de las celdas.

Sin celdas multilinea

Una celda no puede abarcar varias líneas en el código fuente. Si necesitas poner mucho texto en una celda, la tabla sera difícil de leer. La solución es mantener las celdas cortas o cambiar a una estructura de contenido diferente.

Tablas HTML como Alternativa

Cuándo las tablas GFM no son lo suficientemente flexibles, el HTML sin procesar funciona en la mayoría de los documentos Markdown:

<table>
  <tr>
    <th colspan="2">Encabezado combinado</th>
  </tr>
  <tr>
    <td>Celda 1</td>
    <td>Celda 2</td>
  </tr>
</table>

Esto funciona en GitHub y en la mayoría de los generadores de sitios estaticos. No funciona en entornos que limpian el HTML por seguridad (algunos wikis, algunas herramientas de previsualización Markdown).

Generar Tablas a Partir de Datos

Si tienes datos estructurados y necesitas convertirlos a Markdown, varios enfoques funcionan bien:

import pandas as pd

df = pd.read_csv("data.csv")
print(df.to_markdown(index=False))

// Node.js: TSV básico a tabla Markdown
const rows = tsvString.trim().split("\n").map(r => r.split("\t"));
const header = `| ${rows[0].join(" | ")} |`;
const sep = `| ${rows[0].map(() => "---").join(" | ")} |`;
const body = rows.slice(1).map(r => `| ${r.join(" | ")} |`).join("\n");
console.log([header, sep, body].join("\n"));

Manteniendo las Tablas Legibles en el Código Fuente

Para tablas que editas manualmente en el código fuente, algunos habitos ayudan. Manten el contenido de las columnas corto (idealmente menos de 20 caracteres). Usa un formateador Markdown (Prettier con opción prose-wrap) para que la alineación se maneje automáticamente. Para tablas que se leen principalmente renderizadas y rara vez se editan, la alineación en el código fuente importa menos.

Si usas VS Code, la extensión Markdown Table puede formatear tablas automáticamente al guardar y te permite navegar entre celdas con Tab como en una hoja de calculo.