Intro to Storybook
  • はじめに
  • 単純なコンポーネント
  • 複合的なコンポーネント
  • データ
  • 画面
  • デプロイ
  • テスト
  • アドオン
  • まとめ
  • 貢献する
Framework:
ReactReact NativeVueAngularSvelteEmber

まとめ

今までの知識をまとめて、Storybook のテクニックをもっと学びましょう
このコミュニティの翻訳は、最新の Storybook バージョンに対応していません。英語ガイドの最新の変更を適用して、この日本語ガイドの更新にご協力ください。 Pull requests を大歓迎します。.

Storybook で最初の UI を作成しましたね。お疲れ様でした!ここまでの章で UI コンポーネントを作成し、複合させ、テストし、デプロイする方法を学びました。同じように進めていれば、リポジトリーとデプロイされた Storybook は以下のリンクと同じようになっていることでしょう。

📕 GitHub のリポジトリー: chromaui/learnstorybook-code
🌎 デプロイされた Storybook

Storybook は React、React Native、Vue、Angular、Svelte、その他のフレームワークにとって強力なツールです。開発者コミュニティーも活発でアドオンも充実しています。このチュートリアルで紹介した内容は、Storybook で出来ることの一部にすぎません。一度 Storybook を導入すれば、強固な UI を効率的に作れることに驚くことでしょう。

さらに学ぶには

もっと深く掘り下げたいですか?役に立つリソースを紹介します。

  • Storybook の公式ドキュメントには API ドキュメント、コミュニティのリンク、アドオンのギャラリーがあります。
  • 楽しい Storybook のワークフローでは Squarespace や、メジャーリーグサッカー、ディスカバリーネットワーク、 Apollo GraphQL といった効率の良いチームにおけるワークフローのベストプラクティスを紹介しています。
  • 視覚的なテストのハンドブックでは、コンポーネントを Storybook で視覚的にテストする方法を掘り下げています。無料の 31 ページある eBook です。
  • Storybook Discord では Storybook のコミュニティに参加できます。他の Storybook ユーザーと協力しましょう。
  • Storybook ブログではリリース情報や、UI 開発のワークフローを合理的にするための機能を紹介します。

Storybook チュートリアルについて

文書や、コード、製作は Chromatic の貢献です。このチュートリアルは Chromatic の GraphQL + React tutorial series を参考にしています。

このようなチュートリアルや記事をお望みならば、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!
Docs
Documentation
Add Storybook to your project in less than a minute to build components faster and easier.
reactvueangularweb-components
Tutorial
Tutorials
Learn Storybook with in-depth tutorials that teaches Storybook best practices. Follow along with code samples.
Learn Storybook now
Storybook
The MIT License (MIT). Website design by @domyen and the awesome Storybook community.
StorybookShowcaseDocsTutorialsAddonsBlogReleasesGet involvedUse casesSupportTelemetryTeam
Community GitHub Twitter Discord chat Youtube Component Driven UIs
Subscribe
Get news, free tutorials, and Storybook tips emailed to you.

Maintained by
Chromatic
Continuous integration by
CircleCI
Hosting by
Netlify