Créer un convertisseur Markdown semble simple sur le papier : Markdown -> HTML -> PDF.
En réalité, c'est un champ de mines technique. Voici comment nous avons résolu les problèmes les plus complexes lors du développement de mdconverter.io.
1. Le Shadow DOM pour la Prévisualisation
Le premier défi était d'afficher un aperçu fidèle du document final (avec des styles comme "Swiss Corporate" ou "Néobrutal") sans casser le design du site lui-même.
Si nous injectons h1 { color: yellow; border: 3px solid black; } dans la page, tout le site devient jaune.
La solution ? Le Shadow DOM.
const shadowRoot = previewContainer.attachShadow({ mode: 'open' });
shadowRoot.innerHTML = `<style>${scopedCss}</style><div>${content}</div>`;Cela crée une capsule étanche. Le CSS à l'intérieur n'affecte pas le site, et le CSS du site (Tailwind) ne pénètre pas dans l'aperçu.
2. DomPDF et le "Full Bleed"
Générer des PDF avec DomPDF en PHP est standard, mais gérer des arrière-plans pleine page (Full Bleed) tout en gardant des marges de sécurité pour le texte est complexe.
Le problème : Si on met width: 100% sur le contenu avec un padding, le contenu dépasse de la page A4.
La solution a été d'utiliser width: auto combiné à des marges @page mises à zéro :
@page { margin: 0px; } /* Le fond touche les bords */
.document-content {
padding: 2.5cm; /* Marge interne virtuelle */
width: auto !important; /* Laisse le padding dicter la largeur */
}3. Le Hack du DOCX "Fake"
Générer un vrai fichier binaire .docx (qui est un ZIP de fichiers XML) est très lourd en ressources serveur.
Nous avons opté pour une approche "Low-Tech" mais extrêmement robuste : le HTML Word-Compliant.
En envoyant les bons en-têtes MIME :
header("Content-Type: application/vnd.ms-word");
Et en ajoutant des balises XML spécifiques dans le HTML :
<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word'>
Word interprète le HTML comme un document natif. Cela nous permet d'utiliser du CSS standard pour styliser des documents Word, ce qui serait impossible avec les librairies PHPWord classiques.
Conclusion
Ce projet prouve qu'en 2025, on n'a pas toujours besoin de React ou Laravel. Une architecture PHP native, bien pensée, avec une gestion intelligente du DOM et des headers, offre des performances inégalées (Temps de génération < 0.1s).