Migrer un projet Symfony de Bootstrap vers le DSFR
Beaucoup d'applications Symfony historiques utilisent Bootstrap ou un design system interne. Une migration vers le DSFR doit être progressive pour éviter une réécriture complète.
La bonne approche consiste à isoler les zones à forte valeur :
- layout principal ;
- navigation ;
- formulaires ;
- tableaux ;
- alertes et badges ;
- modales et confirmations.
DSFR Bundle aide cette migration parce qu'il donne une API Twig stable. Vous pouvez remplacer un fragment Bootstrap par un composant DSFR sans construire toute la page en une seule fois.
Exemple de remplacement
Au lieu d'un bouton Bootstrap :
<button class="btn btn-primary">Enregistrer</button>
utilisez :
<twig:dsfr:button label="Enregistrer" />
Ce changement paraît petit, mais il évite d'empiler des classes et conventions contradictoires.
Réussir la migration
- ne mélangez pas longtemps Bootstrap et DSFR sur les mêmes composants ;
- créez des layouts DSFR propres ;
- migrez les formulaires avec le thème DSFR ;
- vérifiez le responsive écran par écran ;
- utilisez le profiler pour voir les composants réellement rendus.
Pour commencer, consultez Installation, Layouts et grille et Recettes développeur.
FAQ
Faut-il réécrire toute l'application pour passer au DSFR ?
Non. Une migration progressive est généralement préférable : layout, navigation, formulaires, tableaux et feedback peuvent être remplacés par lots sans réécrire toute la logique Symfony.
Que faire des classes Bootstrap existantes ?
Évitez de les mélanger durablement avec les classes DSFR. Gardez une période de transition courte, puis remplacez les blocs Bootstrap par des composants Twig DSFR documentés.