AVERTISSEMENT : Ce système de conception est uniquement destiné à être utilisé pour les sites web officiels des services publics français. Son objectif principal est de faciliter l'identification des sites gouvernementaux par les citoyens. Voir les conditions.
Ce module est une boîte à outils avancée qui tire parti de @gouvfr/dsfr, l'implémentation en JS/CSS vanilla du DSFR.
Bien que ce module soit écrit en TypeScript, l'utilisation de TypeScript dans votre application est optionnelle (mais recommandée car elle apporte des avantages exceptionnels à la fois pour vous et votre base de code).
@gouvfr/dsfr
/dist/dsfr.css
."use client";
💡 Besoin de pages de connexion et d'inscription prêtes à l'emploi et conformes au DSFR ? Consultez keycloak-theme-dsfr.
Ce module est un produit du pôle Logiciel libre et open source d'Etalab.
Ce projet est co-maintenu par des fonctionnaires de diverses administrations françaises :
git clone https://github.com/codegouvfr/react-dsfr
cd react-dsfr
yarn
# Démarrer storybook
yarn storybook
# Démarrer les applications de test
yarn start-cra # Pour tester dans une configuration Create React App
yarn start-vite # Pour tester dans une configuration Vite
yarn start-next-pagesdir # Pour tester dans une configuration Next.js 13 PagesDir (la configuration par défaut)
yarn start-next-appdir # Pour tester dans une configuration Next.js 13 AppDir
# Exécuter tous les tests unitaires (test/runtime):
yarn test
# Exécuter uniquement test/runtime/cssVariable.test.ts (par exemple)
npx vitest -t "Resolution of CSS variables"
Merci ! Voir le guide de contribution.
Ce dépôt a été initialisé à partir de garronej/ts-ci, consultez la documentation de ce starter pour comprendre le cycle de vie de ce dépôt.
Quelques projets qui utilisent @codegouvfr/react-dsfr
.