Mise en pratique de FSD

Maintenant que nous comprenons les couches, voyons comment appliquer FSD concrètement dans un projet Astro.

Adapter FSD au contexte

FSD est une méthodologie, pas un dogme. Pour un blog statique Astro, certaines adaptations sont naturelles :

• Pas de couche features : dans un SSG, il n’y a pas de logique interactive complexe à isoler
• Pas de couche processes : les workflows multi-étapes n’existent pas dans un blog
• 5 couches suffisent : shared → entities → widgets → pages → app

Structure concrète

src/
├── shared/         # UI générique, utilitaires
├── entities/       # Article, Tag (domaine métier)
├── widgets/        # Blocs composites (ArticleFull, Header...)
├── pages/          # Routes Astro
└── app/            # Layout, config globale, styles

Les erreurs à éviter

1. Sur-découper : ne créez pas une entité pour chaque petit concept. Si un type n’est utilisé qu’à un seul endroit, il peut rester local
2. Ignorer les barrel exports : chaque slice doit exposer un index.ts comme point d’entrée unique
3. Importer par chemins internes : toujours passer par le barrel, jamais @entities/article/model/types

Conclusion

FSD apporte de la prévisibilité à vos projets front-end. Chaque fichier a sa place, chaque import suit une règle claire. Le coût d’adoption est faible, et les bénéfices se font sentir dès que le projet grandit.

Essayez-le sur votre prochain projet, vous ne reviendrez pas en arrière.