Pourquoi "convertir ce site Web en React" est si pénible et comment j'en ai automatisé 80 %

Chaque développeur frontend a vécu ce ticket : "Voici notre site marketing, reconstruisez-le dans React." Ou la version freelance : "Pouvez-vous déplacer notre site Webflow vers Next.js pour qu'on arrête de payer l'abonnement ?" Vous ouvrez DevTools. Vous commencez à copier des styles. Vous êtes des coussinets oculaires. Vous recréez le DOM à la main, section par section, et trois jours plus tard, vous obtenez quelque chose qui ressemble presque à l'original, sauf que l'espacement des héros est légèrement décalé et que personne ne peut vous dire pourquoi. Je l'ai fait suffisamment de fois pour créer un outil pour éliminer les 80 % ennuyeux : collez une URL, obtenez un projet Next.js + Tailwind modifiable. Cet article explique pourquoi cette conversion est vraiment difficile, les problèmes qui font de « simplement gratter le HTML » une réponse naïve et l'architecture que le travail vous impose. Le problème n'est pas d'obtenir le HTML. C'est tout après. Si le travail consistait à "récupérer le balisage", curl le résoudrait. Le plus difficile est qu’un site Web moderne n’est pas son code HTML. Il s'agit de styles calculés, pas de styles créés. Le style utile réside dans le CSSOM rendu après la résolution de la cascade, des requêtes multimédias et de l'héritage, et non dans la feuille de style que vous pouvez télécharger. UN