Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Construire sa bibliothèque de composants avec S...

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Jean-Phi Baconnais Jean-Phi Baconnais
August 10, 2021
Programming
25
0

Construire sa bibliothèque de composants avec Storybook

Avatar for Jean-Phi Baconnais

Jean-Phi Baconnais

August 10, 2021

More Decks by Jean-Phi Baconnais

See All by Jean-Phi Baconnais
Et si GitLab Duo devenait votre nouvel ami codeur imaginaire ?
Avatar for Jean-Phi Baconnais jeanphibaconnais
0
35
🗄️Et si vous mettiez à disposition vos jobs de CI/CD sur une étagère ?
Avatar for Jean-Phi Baconnais jeanphibaconnais
0
36
Touraine Tech - Késako, il crée son propre runner GitLab quand il démarre son environnement de dev Gitpod
Avatar for Jean-Phi Baconnais jeanphibaconnais
0
160
L'open source rendu beaucoup plus accessible avec Gitpod 🫶
Avatar for Jean-Phi Baconnais jeanphibaconnais
0
120
GitLab 💚 Kubernetes
Avatar for Jean-Phi Baconnais jeanphibaconnais
1
43
_France_DevOps__-_20023-06-06_-_GitLab_Cloud_Seed_____le_déploiement_de_votre_application_sur_Google_Cloud_sans_difficulté.pdf
Avatar for Jean-Phi Baconnais jeanphibaconnais
0
33
Késako ⁉, il crée son propre runner GitLab quand il démarre son environnement de dev Gitpod : 🤯
Avatar for Jean-Phi Baconnais jeanphibaconnais
0
120
Cloud Seed 🌱- le voyage extraordinaire promis par GitLab pour déployer rapidement votre application sur GCP
Avatar for Jean-Phi Baconnais jeanphibaconnais
0
370
L'open source ? Vous allez voir, ce n'est pas que du développement
Avatar for Jean-Phi Baconnais jeanphibaconnais
0
74

Other Decks in Programming

See All in Programming
Migration to Signals, Signal Forms, Resource API, and NgRx Signal Store @Angular Days 03/2026 Munich
Avatar for Manfred Steyer manfredsteyer
PRO
0
220
一度始めたらやめられない開発効率向上術 / Findy あなたのdotfilesを教えて！
Avatar for Takashi Kokubun k0kubun
3
2.7k
Radical Imagining - LIFT 2025-2027 Policy Agenda
Avatar for LIFT lift1998
0
100
20260313 - Grafana & Friends Taipei #1 - Kubernetes v1.36 的開發雜記：那些困在 Alpha 加護病房太久的 Metrics
Avatar for ChengHao Yang tico88612
0
250
条件判定に名前、つけてますか？ #phperkaigi #c
Avatar for Hiromi Hishida 77web
2
930
「速くなった気がする」をデータで疑う
Avatar for Leaf senleaf24
0
130
Mastering Event Sourcing: Your Parents Holidayed in Yugoslavia
Avatar for Marek Matulka super_marek
0
140
「効かない！」依存性注入（DI）を活用したAPI Platformのエラーハンドリング奮闘記
Avatar for Maki Hayashi mkmk884
0
290
モックわからないマン卒業記 ~振る舞いを起点に見直した、フロントエンドテストにおけるモックの使いどころ~
Avatar for Tasuku Watanabe tasukuwatanabe
3
440
CS教育のDX AIによる育成の効率化
Avatar for ニフティ株式会社 niftycorp
PRO
0
180
SkillがSkillを生む：QA観点出しを自動化した
Avatar for sontixyou sontixyou
1
370
RSAが破られる前に知っておきたい 耐量子計算機暗号(PQC)入門 / Intro to PQC: Preparing for the Post-RSA Era
Avatar for mackey0225 mackey0225
3
110

Featured

See All Featured
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
281
24k
Chasing Engaging Ingredients in Design
Avatar for Sebastian Deterding codingconduct
0
160
Code Review Best Practice
Avatar for Trisha Gee trishagee
74
20k
Tips & Tricks on How to Get Your First Job In Tech
Avatar for Honza Javorek honzajavorek
1
480
SEO for Brand Visibility & Recognition
Avatar for Aleyda Solis aleyda
0
4.4k
Joys of Absence: A Defence of Solitary Play
Avatar for Sebastian Deterding codingconduct
1
330
Prompt Engineering for Job Search
Avatar for Mfonobong Umondia mfonobong
0
250
How to build an LLM SEO readiness audit: a practical framework
Avatar for Nick Samuel nmsamuel
1
700
How GitHub (no longer) Works
Avatar for Zach Holman holman
316
150k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
Avatar for Tech SEO Connect techseoconnect
PRO
0
92
Information Architects: The Missing Link in Design Systems
Avatar for Michelle Chin soysaucechin
0
860
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
2
1.7k

Transcript

  1. Construire sa bibliothèque de composants avec Storybook

  2. @JPhi_Baconnais

  3. Pourquoi ?

  4. Pour moi le front, c’est 👉 https://unsplash.com/@thomascouillard

  5. https://unsplash.com/@whoishimesh Quand on arrive sur un projet ...

  6. None

  7. Construire une bibliothèque de composants

  8. Isolation des composants

  9. Définition et visualisation des différents état des composants

  10. Visualisation de l’aspect responsive

  11. Démo

  12. Ok pour le dév et ?


  13. Partager des composants

  14. Storybook BBC

  15. Des modules complémentaires Tests de non-régression visuelle Add-on

  16. None

  17. Merci @JPhi_Baconnais https://storybook.js.org/ https://storybook.js.org/tutorials/