iOS — Prism aka le Storybook de SwiftUI.
Une plateforme pour les partager tous 📈
StoryBook ? 🤓
À l’air du Design System et du branding, nos amis du web ont un outil très pratique “StoryBook” (https://storybook.js.org/).
Cette plateforme permet d’exposer les différents composants réalisés, ce qui permet aux designers/développeur de voir les composants déjà existant ainsi que de les tester en live.
🎉 Prism, le showroom de vos composants !
Le projet est open source ! https://github.com/joey-barbier/ios-prism
Vous pouvez fork le repo pour créer votre propre Prism, pour ça il vous suffit de rajouter vos composants puis de builder 🙌🏻
Il ne vous reste plus qu’à partager votre app Prism à vos designers, développeurs…
Je rajouterai plusieurs composants par la suite sur mon GitHub donc n’hésites pas à me follow: https://github.com/joey-barbier/
🧱 Comment créer un composant ?
Pour créer un composant, vous pouvez utiliser le script “new.rb” :
Une fois exécuté, le script va vous demander la catégorie de votre nouveau composant (exp: Loader, Button, ActivityIndicator …) ainsi que son nom.
Une fois les informations saisies, il va générer la class de votre composant, sa démo et mettre à jour le fichier PodSpec ! 🎉
La vue de démo du composant 🎛
Un dossier `NomDuComposant+Demo` a été généré dans ce dossier vous pouvez voir les différentes vues (correspondant au menu):
- …+Colors: Vue permetant la gestion UI de votre composant
- …+Documentation: Pour d’afficher votre documentation directement dans l’application
- …+Params: Afficher les différents champs de configuration de votre composant (titre, taille …)
- …+Preview: Vue qui va être utilisée pour afficher votre composant
- …+Status: Dans le cas ou votre composant dispose de plusieurs état.
Si vous avez un doute, n’hésitez pas à vous inspirer du composant PrismButtonLoader présent dans le repo.
Merci 🫶🏻
Merci pour la lecture, pensez à partager l’article et pour finir vous pouvez lâcher vos meilleurs claps ! 👏 ⬇️
PS: Teasing, la prochaine update sera “La gestion des tests” 🤫
