Méthode projet

Cette page décrit une méthode de livraison pour utiliser DSFR Bundle dans un projet Symfony réel : cadrage, implémentation, recette, mise en production et maintenance.

Plan de démarrage

Étape	Livrable
Cadrage	liste des pages, composants DSFR nécessaires, niveau Community/Pro
Socle	installation DSFR, layout de base, assets, thème de formulaires
Design système applicatif	layouts réutilisables, conventions de noms, exemples d'écrans
Développement	composants Twig uniquement, props typées, pas de macros ni include internes
Recette	profiler DSFR, tests clavier, responsive, accessibilité de premier niveau
Production	licence, domaines, cache, assets versionnés, monitoring

Architecture recommandée

templates/
  base.html.twig
  layouts/
    public.html.twig
    authenticated.html.twig
    admin.html.twig
  pages/
    dashboard.html.twig
    search.html.twig
    form.html.twig

Les layouts portent l'en-tête, le pied de page, les liens d'évitement, le conteneur principal et les zones réutilisables. Les pages métier composent ensuite les composants DSFR.

Convention Twig

<twig:dsfr:container>
  <twig:dsfr:grid:row gutters>
    <twig:dsfr:grid:col cols="12" lg="8">
      {% block content %}{% endblock %}
    </twig:dsfr:grid:col>
    <twig:dsfr:grid:col cols="12" lg="4">
      {% block sidebar %}{% endblock %}
    </twig:dsfr:grid:col>
  </twig:dsfr:grid:row>
</twig:dsfr:container>

Règles d'équipe :

• composants Twig UX publics uniquement ;
• collections passées avec : ;
• ids explicites pour modales, menus, accordéons et onglets ;
• textes accessibles fournis dans les props ;
• classes DSFR ajoutées à la main seulement quand il s'agit d'utilitaires documentés.

Definition of done

Domaine	Contrôle
DSFR	les composants utilisés existent dans le catalogue du bundle
Twig	pas de macro ni include de template interne du bundle
Accessibilité	labels, captions, legends, aria-controls et alternatives vérifiés
Responsive	mobile, tablette et desktop vérifiés
Licence	aucun composant Pro bloqué en production
Qualité	make ci, profiler DSFR et tests métier passés

Recette avant livraison

php bin/console debug:dsfr-components
php bin/console dsfr:license:validate
make ci

Ouvrez ensuite les pages clés en environnement dev et contrôlez le panneau DSFR du profiler : répartition Community/Pro, composants rendus, props, alertes et licence.

Maintenance

• Centralisez les layouts transverses.
• Évitez les variantes locales non documentées.
• Ajoutez une recette dans la documentation interne quand un nouveau pattern de page apparaît.
• Lors d'une mise à jour DSFR, testez d'abord les pages contenant navigation, formulaires, modales, tableaux et paramètres d'affichage.