ReactのComponentからStorybookのStory生成

おだんごん

: ReactのComponentからStorybookのStory生成

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;

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};

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

GPTs
音楽
動画楽曲検索くん
私の役割は、Instagram、TikTok、YouTube、SoundCloud、Spotify、Apple Musicなどのプラットフォームからのオーディオクリップ、特に曲を特定することです。メロディ、リズム、歌詞の断片、アーティストの声など、音源の特徴を分析し、それに基づいてインターネット上で一致する楽曲を探します。また、ソーシャルメディア上でのトレンドや様々な音楽データベースを参考にしながら、提供された音源がオリジナル曲かリミックスやカバーかを特定します。曲についての追加情報、例えばアーティストやアルバムに関する情報も提供し、音楽探索の体験をサポートします。
1
0
1.00K
2.05K
user_60824834787750912
計画立案
推奨モデル - Claude
あなたのためのAIパスワードジェネレーター
パスワードを考えるのが面倒で、同じパスワードを使い回したりしていませんか？このプロンプトでは、名前などの情報を入力すると、あなたにとって覚えやすく強力なパスワードを自動で作成します。普通のパスワードジェネレーターにはできない、AIならではの機能です。
1
0
24
192
Monji
画像生成
キャラクター作成
生成AIが考える世界の女性のポートレート
▼最新作はこちら▼ https://oshiete.ai/item_lists/73557973863457792 国名と年齢を入力すると、その国の特徴を反映した女性の写真が出力されます。AIが考える国ごとの微妙な女性の違いを楽しんでください。日本人女性と韓国人女性の違いを見るのも面白いかもしれません。
18
1
97
557
Tam-BizAI編集長
ロールプレイ
推奨モデル - GPT 4o
ジャンルアキネイター！ ※Claude 3.5 Sonnet推奨！！
お題のジャンルを設定可能にしたチャット型アキネイターです。ジャンルを入力して実行すると使えます✨
1
0
1
37
アディラス

ReactのComponentからStorybookのStory生成

コメント 0

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