·storybook-stories
</>

storybook-stories

CSF3 形式を使用して Storybook ストーリーとインタラクション テストを作成および維持します。コンポーネントのストーリー、再生機能、Chromatic によるビジュアル回帰テスト、アクセシビリティ テストをカバーします。コンポーネントのドキュメントの作成、インタラクション テストの作成、テストの失敗のデバッグ、ビジュアル スナップショットの構成、またはストーリー構造の更新を行うときに使用します。 CSF3、再生関数、userEvent、ライブラリ クエリのテスト、Chromatic 構成、autodocs、MDX に使用します。

19インストール·2トレンド·@oakoss

インストール

$npx skills add https://github.com/oakoss/agent-skills --skill storybook-stories

storybook-stories のインストール方法

コマンドラインで storybook-stories AI スキルを開発環境にすばやくインストール

  1. ターミナルを開く: ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます
  2. インストールコマンドを実行: このコマンドをコピーして実行します: npx skills add https://github.com/oakoss/agent-skills --skill storybook-stories
  3. インストールを確認: インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります

ソース: oakoss/agent-skills。

Storybook is a frontend workshop for building UI components in isolation. Stories are written in Component Story Format 3 (CSF3), which uses object syntax with args for type-safe component documentation and testing.

When to use: Component documentation with live examples, interaction testing with play functions, visual regression testing, accessibility validation, design system maintenance, isolated component development.

| Basic story | export const Default: Story = { args } | Use args for simple single components | | Complex story | export const Example: Story = { render } | Use render for multi-component layouts | | Meta configuration | const meta = { component, args } satisfies Meta | Define defaults and argTypes |

CSF3 形式を使用して Storybook ストーリーとインタラクション テストを作成および維持します。コンポーネントのストーリー、再生機能、Chromatic によるビジュアル回帰テスト、アクセシビリティ テストをカバーします。コンポーネントのドキュメントの作成、インタラクション テストの作成、テストの失敗のデバッグ、ビジュアル スナップショットの構成、またはストーリー構造の更新を行うときに使用します。 CSF3、再生関数、userEvent、ライブラリ クエリのテスト、Chromatic 構成、autodocs、MDX に使用します。 ソース: oakoss/agent-skills。

引用可能な情報

AI/検索での引用用の安定したフィールドとコマンド。

インストールコマンド
npx skills add https://github.com/oakoss/agent-skills --skill storybook-stories
カテゴリ
</>開発ツール
認証済み
初回登録
2026-02-25
更新日
2026-03-11

Browse more skills from oakoss/agent-skills

クイックアンサー

storybook-stories とは?

CSF3 形式を使用して Storybook ストーリーとインタラクション テストを作成および維持します。コンポーネントのストーリー、再生機能、Chromatic によるビジュアル回帰テスト、アクセシビリティ テストをカバーします。コンポーネントのドキュメントの作成、インタラクション テストの作成、テストの失敗のデバッグ、ビジュアル スナップショットの構成、またはストーリー構造の更新を行うときに使用します。 CSF3、再生関数、userEvent、ライブラリ クエリのテスト、Chromatic 構成、autodocs、MDX に使用します。 ソース: oakoss/agent-skills。

storybook-stories のインストール方法は?

ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/oakoss/agent-skills --skill storybook-stories インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります

ソースリポジトリはどこですか?

https://github.com/oakoss/agent-skills