New
Code coverage with Storybook test runnerAutomate with Chromatic
Star74,802
Back to Intro to Storybook
Chapters
  • 開始
  • 簡易元件
  • 複合元件
  • 資料
  • 頁面
  • 部署
  • 進行測試
  • 外掛
  • 總結
  • 參與

總結

總結已學到的,接著學習更多 Storybook 技巧
此社群翻譯還未更新至最新版本的 Storybook。請透過英文版本的更變,協助我們更新此翻譯。 歡迎發送 Pull Request.

恭喜!你已經做好在 Storybook 裡的 UI。一路下來,學到如何打造、組合、測試和部署 UI 元件。如果都照著做,部署上去的 Storybook 和程式碼應該會長得像這樣:

📕 GitHub 專案:chromaui/learnstorybook-code
🌎 已部署的 Storybook

Storybook 在 React、React Native、Vue、Angular、Svelte 和其它 framework 都是很犀利的工具。有熱鬧的開發者社群以及豐富的外掛。這份介紹擷取其可能性最淺薄的一部份。只要採用 Storybook,我們有自信讓你對效率和打造堅強的 UI 感到驚艷。

繼續學習

想要深入探索?這些資源會有幫助。

  • Storybook 官方文件記載 API、社群連結與外掛集散地。

  • 快快樂樂學 Storybook 工作流程隆重介紹 Squarespace、Major League Soccer、Discovery Network 和 Apollo GraphQL 裡高效率團隊的最佳工作流程方法。

  • 視覺測試手冊深入探討在 Storybook 以視覺測試元件。免費的 31 頁電子書。

  • Discord 與 Storybook 社群聊天互動。只要你幫助其他 Storybook 使用者,Storybook 使用者也會幫你。

  • Storybook 部落格展示能夠讓 UI 開發工作流程一致的最新版本與功能。

Storybook 入門教學是誰做的?

Chromatic 製作了文字、程式碼與影片剪輯。這份教學是受到 Chromatic 很受歡迎的 GraphQL + React 教學系列所啟發。

還想要有更多這樣的教學和文章嗎?請加入 Storybook 的郵寄清單。

Is this free guide helping you? Tweet to give kudos and help other devs find it.
Next Chapter
參與
一起把 Storybook 分享至全世界
✍️ Edit on GitHub – PRs welcome!
Join the community
5,870 developers and counting
WhyWhy StorybookComponent-driven UI
Open source software
Storybook

Maintained by
Chromatic
Special thanks to Netlify and CircleCI