Markdown-Vorschau
Markdown ist eine leichtgewichtige Auszeichnungssprache zur Erstellung von formatiertem Text mit einfacher Textsyntax. Beliebt für Dokumentation, README-Dateien und Notizen, wird es für die Anzeige in HTML gerendert. Dieses Tool zeigt eine Markdown-Vorschau mit Live-Rendering, extrahiert die Dokumentstruktur (Überschriften, Links, Bilder) und kann in HTML konvertieren.
Spezifikationen
Haeufige Anwendungsfaelle
- README.md-Dateien vor dem Committen als Vorschau prüfen
- Dokumentationsformatierung überprüfen
- Alle Links aus einem Dokument zur Validierung extrahieren
- Markdown für Einbettung in HTML konvertieren
- Dokumentstruktur und Navigation analysieren
Funktionen
- Live-Vorschau mit HTML-Rendering
- Dokumentstruktur extrahieren (Überschriften als Inhaltsverzeichnis)
- Alle Links und Bilder im Dokument auflisten
- Codeblöcke mit Sprachhinweisen erkennen und anzeigen
- Frontmatter (YAML-Metadaten) parsen
- In sauberen HTML-Code konvertieren
- Wort- und Zeichenzahl-Statistiken
Beispiele
README mit Funktionen
Ausprobieren →Ein typisches Projekt-README mit Überschriften, Listen und Code.
# My Project
A brief description of what this project does.
## Installation
```bash
npm install my-project
```
## Features
- **Fast** - Optimized for speed
- **Simple** - Easy to use API
- **Flexible** - Works with any framework
## Links
- [Documentation](https://docs.example.com)
- [GitHub](https://github.com/example/project)Tipps
- Verwenden Sie # für Überschriften (# H1, ## H2, ### H3 usw.).
- Codeblöcke verwenden drei Backticks mit optionalem Sprachbezeichner.
- Links verwenden die Syntax [Text](URL); Bilder verwenden .
- Frontmatter zwischen ---Zeilen kann YAML-Metadaten enthalten.
Verstaendnis Markdown-Vorschau
Markdown ist eine leichtgewichtige Auszeichnungssprache, die 2004 von John Gruber erstellt wurde und so konzipiert ist, dass sie als Klartext lesbar ist und sich sauber in HTML konvertieren lässt. Die Syntax verwendet Satzzeichen, die visuell ihre Formatierung andeuten: # für Überschriften, * für Hervorhebung, - für Listen und Backticks für Code. Markdown-Dateien bleiben auch ohne Rendering nützlich, weshalb das Format für Dokumentation, README-Dateien und technisches Schreiben dominiert.
Die CommonMark-Spezifikation (2014) adressierte die vielen Mehrdeutigkeiten des ursprünglichen Markdown. CommonMark definiert präzise, wie Grenzfälle behandelt werden, und die meisten modernen Parser implementieren sie. GitHub Flavored Markdown (GFM) erweitert CommonMark um Tabellen, Aufgabenlisten, Durchstreichung, automatisch verlinkte URLs und eingerahmte Codeblöcke mit Syntaxhervorhebung.
GFM ist der De-facto-Standard für README-Dateien, Pull-Request-Beschreibungen, Issue-Kommentare und Dokumentationsseiten. Die meisten Dokumentationsplattformen (Notion, Docusaurus, MkDocs, GitBook) unterstützen GFM oder eine Obermenge davon.
Frontmatter ist eine gängige Konvention zum Hinzufügen strukturierter Metadaten zu Markdown-Dateien. Ein YAML-Block, der durch ---Zeilen am Anfang der Datei begrenzt wird, kann Titel, Datum, Autor und Tags enthalten, die von statischen Seitengeneratoren (Astro, Hugo, Jekyll, Next.js) zum Aufbau von Navigation und Seitenlayouts verwendet werden.
In der Praxis bezieht sich "Markdown" fast immer auf CommonMark oder GFM. Die ursprüngliche Markdown-Spezifikation ließ viele Grenzfälle undefiniert, und CommonMark löste diese Mehrdeutigkeiten mit einer strikten Spezifikation. GFM erweitert CommonMark um Tabellen, Aufgabenlisten, Durchstreichung und automatisch verlinkte URLs. Bei der Bewertung eines Markdown-Parsers oder -Renderers ist die Überprüfung der CommonMark-Konformität ein zuverlässiger Indikator dafür, wie gut er Grenzfälle behandelt.
Tabellen in GFM verwenden Pipes (|) zur Spaltentrennung und Bindestriche (-) für die Header-Trennzeile. Die Spaltenausrichtung wird durch Doppelpunkte in der Trennzeile gesteuert: :--- für linksbündig, :---: für zentriert und ---: für rechtsbündig. Tabellen sind eine GFM-Erweiterung und nicht Teil der ursprünglichen Markdown-Syntax. Frontmatter, begrenzt durch ---Zeilen ganz am Anfang der Datei, ist ein YAML-Metadatenblock, der von statischen Seitengeneratoren für Seiten-Metadaten wie Titel, Datum, Layout und Tags verwendet wird. GitHub rendert Frontmatter als Tabelle am Anfang der Datei, obwohl nicht alle Renderer es verarbeiten.
Eingerahmte Codeblöcke verwenden drei Backticks mit einem optionalen Sprachbezeichner nach den öffnenden Backticks — beispielsweise startet eine Zeile mit drei Backticks gefolgt von "javascript" einen JavaScript-Block mit Syntaxhervorhebung. Die verfügbaren Sprachbezeichner hängen von der Rendering-Plattform ab. Das Einrücken von Code um vier Leerzeichen erzeugt ebenfalls einen Codeblock, jedoch ohne die Möglichkeit, eine Sprache für die Hervorhebung anzugeben.