Aperçu Markdown

Prévisualiser le Markdown en HTML en temps réel.

Développeur

À propos de l'Aperçu Markdown

Le Markdown est un langage de balisage léger utilisé dans les README, docs et commentaires. Cet outil rend votre Markdown en HTML en temps réel pour que vous puissiez voir le rendu. L'analyse se fait dans votre navigateur avec la librairie marked — rien n'est envoyé à un serveur.

Comment utiliser Markdown Preview

  1. Tapez ou collez votre contenu Markdown dans l'éditeur Markdown à gauche.
  2. Le panneau Aperçu à droite se met à jour en temps réel, montrant le rendu HTML de votre Markdown.
  3. Utilisez la syntaxe Markdown standard : # pour les titres, **gras** pour le gras, *italique* pour l'italique, [texte](url) pour les liens, etc.
  4. Vérifiez l'aperçu pour valider le formatage, puis copiez votre Markdown pour l'utiliser sur votre plateforme cible.

Fonctionnalités principales

  • Aperçu en temps réel — Voyez le HTML rendu se mettre à jour instantanément pendant que vous tapez du Markdown.
  • Support complet du Markdown — Titres, gras, italique, barré, liens, images, listes, blocs de code, citations et tableaux.
  • Compatibilité GFM — Supporte les extensions GitHub Flavored Markdown incluant les tableaux et les listes de tâches.
  • Protection XSS — Le HTML rendu est assaini avec DOMPurify pour empêcher l'injection de scripts depuis des entrées non fiables.
  • Confidentialité basée sur le navigateur — Tout le rendu s'exécute localement dans votre navigateur. Votre contenu ne quitte jamais votre appareil.
  • Aucun compte nécessaire — Commencez à écrire et à prévisualiser immédiatement sans aucune inscription.

Quand utiliser cet outil

  • Rédaction de fichiers README.md pour les dépôts GitHub ou GitLab et vérification du formatage.
  • Écriture de documentation ou d'articles de blog en Markdown et vérification du rendu de sortie.
  • Apprentissage de la syntaxe Markdown avec un retour visuel instantané sur le rendu de chaque élément.
  • Aperçu du contenu Markdown avant de le coller sur des plateformes comme Notion, Jira ou Confluence.
  • Vérification rapide du rendu d'extraits Markdown partagés dans les revues de code ou le chat.

Détails techniques

L'outil utilise la bibliothèque JavaScript marked pour l'analyse Markdown, qui implémente la spécification CommonMark avec des extensions pour le GitHub Flavored Markdown (GFM). Le Markdown est analysé en chaîne HTML, puis passé par DOMPurify pour supprimer les éléments potentiellement dangereux (balises script, gestionnaires d'événements, etc.) avant d'être rendu dans le panneau d'aperçu. Cette étape d'assainissement rend l'outil sûr pour coller du Markdown non fiable provenant de sources externes. L'aperçu se met à jour à chaque frappe en utilisant une fonction de rendu avec temporisation pour des performances fluides. Les blocs de code supportent la coloration syntaxique basique pour les langages courants. L'outil s'exécute entièrement côté client sans communication serveur.

Conclusion

L'Aperçu Markdown offre un moyen rapide, confidentiel et intuitif d'écrire et de prévisualiser du Markdown avec un rendu en temps réel. Que vous rédigiez de la documentation, écriviez des articles de blog ou appreniez la syntaxe Markdown, cet outil basé sur le navigateur fournit un retour visuel instantané sans aucune dépendance serveur.

Questions fréquentes

Quelles fonctionnalités Markdown sont prises en charge ?
Titres, gras/italique, listes, liens, images, blocs de code, citations et tableaux. L'outil utilise la librairie marked pour l'analyse.
Mes données sont-elles envoyées à un serveur ?
Non. L'analyse et le rendu se font entièrement dans votre navigateur. Votre texte ne quitte jamais votre appareil.
L'aperçu est-il sûr pour une entrée non fiable ?
L'aperçu assainit le HTML rendu avec DOMPurify pour que les scripts et balises non sûres soient supprimés. Cela réduit le risque XSS lors du collage de Markdown provenant de sources non fiables.
Puis-je l'utiliser pour les fichiers README GitHub ?
Oui. L'outil supporte le GitHub Flavored Markdown (GFM), donc l'aperçu correspond étroitement au rendu de votre README.md sur GitHub. Cependant, certaines fonctionnalités spécifiques à GitHub (comme le lien automatique des issues) peuvent ne pas être supportées.