Aller au contenu principal

Creation d'un design system avec ReactTS et Storybook

Github : Doc : https://storybook.js.org/docs/react/get-started/install

Qu'est ce qu'un design system ?

Un design system est un ensemble de composants réutilisables permettant de créer une interface utilisateur.

Qu'est-ce que Storybook ?

Storybook est un outil permettant de créer des interfaces utilisateurs de manière isolée. Utile pour créer un design system.

Cela marche via des histoires. Une histoire est un composant ReactTS avec un état donné.

Installation de storybook

npx storybook@latest init

Processus :

  • Projet de base ReactTS
  • Installation de storybook
  • Creation d'un composant Card
  • Creation d'une story pour le composant Card.