ReactのComponentからStorybookのStory生成

ReactのComponentからStorybookのStory生成

StorybookのStoryを生成します。

0
0
70
3

投稿日時:

  • プロンプト実行例
  • プロンプトを見る
ReactのComponentからStorybookのStory生成

Componentを入力してください。 コードブロックで囲むと綺麗に表示できます。

TypeScript
1export type ExampleProps = {
2  message: string;
3};
4
5const Example: FunctionComponent<ExampleProps> = ({message}) => {
6  const {isActive, setIsActive} = useState(true);
7  return (
8    <Fragment>
9      <button onClick={() => setIsActive(!isActive)}>オンオフ</button>
10      {isActive && <p>{message}</p>}
11    </Fragment>
12  );
13}
14
15export default Example;
ReactのComponentからStorybookのStory生成
TypeScript
1import React, { useState } from 'react';
2import { Story, Meta } from '@storybook/react';
3
4import Example, { ExampleProps } from './Example';
5
6export default {
7  component: Example,
8  title: 'Example',
9} as Meta;
10
11const Template: Story<ExampleProps> = (args) => <Example {...args} />;
12
13export const Default = Template.bind({});
14Default.args = {
15  message: 'Hello, World!'
16};

コメント 0

他のプロンプトもチェック

  • GPTs

    物語・脚本・プロット

    ### **『なんでもGAMEツクール』の世界へようこそ** 「なんでもGAMEツクール」は、あらゆる物語や出来事や画像を魅力的なテキストアドベンチャーゲームに変える、革新的なAI技術を駆使したプラットフォームです。本から映画やアニメやゲームやニュース、歴史の出来事や画像に至るまで、何でもゲーム化することが可能。プレイヤーは自分の好きなテーマを選び、その世界に没入する体験を楽しむことができます。 ### ★物語の再発見 「なんでもGAMEツクール」は、あなたが選んだ本や映画、アニメなどの物語を生き生きとしたアドベンチャーゲームに変換。Dall-Eによる魅力的な画像とともに、プロットの重要なポイントを見逃すことなく、詳細にわたり描き出します。物語の進行に沿った選択肢を通じて、プレイヤーは物語の中で重要な役割を果たし、結末を自らの手で導きます。 ### ★多様なテーマへの対応 本や映画やアニメに限らず、あらゆるテーマや出来事や画像をゲーム化。歴史上の重大な出来事、最新のニュース、さまざまな文化や国の特色を反映した物語など、無限の可能性を秘めています。プレイヤーは自らの興味や好奇心を満たしながら、新たな視点から世界を体験することができます。 ### ★プレイヤー主体のインタラクティブ体験 プレイヤーは物語の主人公となり、各決定が物語に深い影響を与えるという感覚を持ちながら進行します。プレイヤーの選択は、物語の進行において重要な役割を果たし、独自の物語を紡ぎ出します。 ### ★創造性とオリジナリティの融合 物語の原作に忠実でありながら、プレイヤーの創造性にもスペースを与えることで、既存の物語に新たな命を吹き込みます。プレイヤーが行う選択によって、異なる展開や結末が生まれ、毎回異なる体験が可能です。 --- 「なんでもGAMEツクール」は、物語を新たな形で体験するための扉を開くツールです。このユニークなプラットフォームで、あなたの好奇心を刺激し、未知の物語の世界に足を踏み入れてみませんか?
    8
    0
    18
    121
  • 計画立案

    推奨モデル - GPT 4o
    事業戦略を生成します!
  • GPTs

    ロールプレイ

    各都道府県の「特徴」「地方」「県庁所在地」に関する4択クイズを出題します。 ゲームスタート時に出題範囲を設定できます。 小学生の娘の勉強向けに作りました。 スマホやタブレットの音声入力で回答するとより手軽にクイズを楽しめます。
    2
    1
    38
    600
  • GPTs

    キャラクター作成

    ▼最新作はこちら▼ https://oshiete.ai/item_lists/73557973863457792 あなたの顔写真を送付するだけで顔面偏差値を数字で出力してくれます。各項目別に点数付けしてくれて、顔の強みや特徴まで分析してくれるツール。客観的評価を知りたい方はぜひ使ってみてください。
    6
    2
    2.54K
    9.12K