返回 前端
Awesome Storybook
Awesome storybook
Awesome Storybook
¶
> 关于 Storybook 生态系统的精选资源列表:艺术:
Storybook 是一个前端工具,用于更快、更轻松地构建 UI 组件.
欢迎投稿. 通过拉取请求添加链接或创建问题以开始讨论.
Official resources¶
Community resources¶
- Discord
- Medium
- DEV.to
- Brand's materials - 关于 Storybook 的文章和讨论的材料.
- Design system - Storybook 的网站设计系统.
- Storybook Deployer - 用于将故事书部署为静态站点的包.
- Documentation Primitives - 故事书文档的自定义 DocBlocks.
Tutorials¶
- Learn Storybook - 一套学习 Storybook 的教程.
- Practical Guide to Storybook-Driven Development - 关于如何使用 Storybook 工具作为模板化和推动开发工作的方法的教程.
- Adding Storybook Style Guide to a Create React App - 关于如何在使用 Create React App 生成的应用程序中添加 Storybook 的教程.
- Build your components with Storybook - 关于如何创建组件并在 Storybook 中公开它们的教程.
- Storybook React with Full Dark Mode Integration - 有关如何将 Storybook 的暗模式切换与 React 组件集成的教程.
- Intro to Storybook with React [Tutorial & Example] - 了解如何使用 React 在 Storybook 中构建 UI 组件,以实现从设计到实施的更好协作.
Presentations¶
- Storybook, le playground qu'il vous faut pour vos composants UI! (FR)
- React Storybook Tutorial with Examples - Getting Started with React Storybook
- React Storybook: Design, Dev, Doc, Debug Components - React Conf 2017
- VueNYC - Learn Storybook
Blog posts¶
- How I manage to make my Storybook project the most efficient possible - 一组有用的提示,可帮助您管理 Storybook 项目.
- Storybook 5.2 - 世界一流的设计系统基础设施.
- Storybook DocsPage - 漂亮的文档,即刻.
- Storybook Docs sneak peek - 将故事变成活文档.
- Storybook 5.0 - 关于迄今为止最大版本的功能展示.
- Real-time accessibility testing with Storybook - Storybook 中提供的可访问性测试工具的全面概述.
- Using Storybook with VueJS - 了解如何使用 Vue 和 Storybook 构建组件库以创建模块化和可重用的组件.
- Setting up Storybook for Preact - 一个方便的指南,让我们可以轻松地在 Preact 项目中添加故事书.
- Setting up a Component Library with React and Storybook - 了解如何使用 React 和 Storybook 设置组件库,以创建可跨项目共享的模块化和可重用组件.
- Storybook - UI component development tool for React, Vue, and Angular (Article focusing on React) - Storybook 的简要介绍以及如何在 React 应用程序上进行设置.
- Storybook vs Styleguidist - 顶级 UI 组件浏览器的比较.
- Five Reasons to Use Storybook Tests - Storybook 的不同测试解决方案的完整演练:简单的跨浏览器视觉检查、交互测试和用于快照测试的 StoryShots.
Examples¶
- Storybook Design System
- Decathlon Design System (Vitamin)
- GitHub Design System
- Airbnb (react-dates)
- Salesforce Design System
- Auth0 Design System
- AXA France Design System
- Shared React Components Boilerplate
- Apideck Components
- Qui - Vue ⅔ Design system
- Mística Design system
Addons¶
官方和社区插件列表可在故事书 Addon Page.
Contributing¶
欢迎投稿! 阅读 contribution guidelines 第一的.
License¶
在法律允许的范围内, Laurent Thiebault 已放弃该作品的所有版权和相关或邻接权.
