Zum Hauptinhalt springen

Markdown-Tabellen-Generator – kostenlos

Markdown-Tabellen mit Ausrichtung pro Spalte visuell bearbeiten. Aus CSV oder TSV importieren, GitHub-Flavored-Markdown-Ausgabe kopieren.

Funktioniert nach dem Laden offline
Aus CSV, TSV oder Markdown importieren
Vorschau
NameE-MailRolle
Alicealice@example.comAdmin
Bobbob@example.comBearbeiter
Carolcarol@example.comBetrachter
| Name  | E-Mail            |   Rolle    |
| :---- | :---------------- | :--------: |
| Alice | alice@example.com |   Admin    |
| Bob   | bob@example.com   | Bearbeiter |
| Carol | carol@example.com | Betrachter |

Häufige Anwendungen

  • Erstellen Sie Tabellen für GitHub README-DateienGitHub rendert Markdown-Tabellen nativ. Erstellen Sie visuell Funktionsvergleichstabellen, API-Referenzen oder Roadmaps.
  • API- und ReferenzdokumentationstabellenErstellen Sie Parametertabellen, Statuscode-Referenzen und Feld-Definitionstabellen für API-Dokumentation.
  • Erstellen Sie Tabellen in Obsidian / Notion / LogseqMarkdown-erste Notiz-Apps unterstützen alle Tabellen. Erstellen Sie schneller hier als in Klartext.
  • Fügen Sie Blog-Beiträgen Tabellen hinzuPreisvergleiche, Funktionsmatrizen und Tutorial-Referenztabellen — Markdown ist die am wenigsten reibungsfreie Möglichkeit, sie hinzuzufügen.
  • CSV in Markdown-Tabelle konvertierenFügen Sie CSV aus einer Tabelle ein und erhalten Sie eine zur Einfügung in Dokumente oder Notizen bereite Markdown-Tabelle.

So funktioniert es

Dieses Tool ist ein vollständig clientseitiger Markdown-Tabelleneditor auf Basis von selbst geschriebenem JavaScript – ohne Tabellenbibliothek von Drittanbietern. Er erzeugt die Pipe-Tabellen-Syntax von GitHub Flavored Markdown direkt im Browser, mit Live-Auffüllung der Spaltenbreiten und Ausrichtungsmarkierungen pro Spalte, und kann dieselben Daten auch als HTML, CSV, JIRA-Wiki-Markup oder reStructuredText-Rastertabelle exportieren.

  1. 1
    Zellen im visuellen Raster bearbeiten
    Jede Kopfzeile und Zelle ist ein bearbeitbares Eingabefeld. Während Sie tippen, lösen React-State-Änderungen einen useMemo-Aufruf aus, der den Generator sofort erneut ausführt, sodass sich der Ausgabebereich bei jedem Tastenanschlag ohne Entprellverzögerung aktualisiert.
  2. 2
    Der Generator füllt auf und maskiert die GFM-Syntax
    Die selbst geschriebene Funktion generateMarkdown misst die maximale Inhaltsbreite jeder Spalte, füllt jede Zelle zur Ausrichtung mit Leerzeichen auf, erzeugt die Trennzeile mit den Markierungen :--- / ---: / :---: und maskiert Pipe-Zeichen als \| sowie Zeilenumbrüche als br-Element, damit die Tabelle in jedem Markdown-Renderer gültig bleibt.
  3. 3
    CSV, TSV oder eine vorhandene Markdown-Tabelle importieren
    Das Einfügen in das Importfeld löst entweder einen selbst geschriebenen RFC-4180-CSV/TSV-Parser (lib/csv.ts) oder einen eigenen Markdown-Tabellenparser aus, der Zeilen an nicht maskierten Pipes teilt und die Ausrichtung aus der Trennzeile liest – so können Sie eine vorhandene Tabelle zurück in den Editor holen.
  4. 4
    Im benötigten Format kopieren
    Ein Wechsel des Ausgabeformat-Tabs führt den passenden Generator erneut aus (HTML mit style-Attributen, CSV nach RFC 4180, JIRA-Wiki-Markup mit ||-Kopfzeilen oder reStructuredText-Rastertabellen mit +---+-Rändern), und die Kopieren-Schaltfläche schreibt das Ergebnis über die Standard-API navigator.clipboard in die Zwischenablage.

Ähnliche Tools

Häufige Fragen