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

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

画像生成
キャラクター作成
推奨モデル - Midjourney
天使ちゃんvs.悪魔ちゃん【悪魔バージョン】👿
天使と悪魔それぞれのイメージで女の子を生成します。お好みでどうぞ。 #ハロウィン
3
0
4
121
もる
画像生成
物語・脚本・プロット
【プロンプト公開】間取り図メーカー
なんとなく間取り図を眺めるのが楽しいのは私だけでしょうか。AIによるセンス溢れる間取りを「凄い」と思ったり、「なぜこんなところにトイレが！」と笑ってみたりしてみてください。
8
0
20
593
KeyFocus
音楽
【音楽生成】Udio1.5用のプロンプト、カスタム歌詞コマンドメーカー【Ver.2】
Udio1.5プロンプト作成アシスタントへようこそ！このアシスタントは、あなたの音楽アイデアをUdio1.5のプロンプト、歌詞、カスタムコマンドに変換するお手伝いをします。 # 使い方: * 曲のアイデアを共有: どのような曲を作りたいか、具体的なイメージや雰囲気などを教えてください。 * 生成箇所を指定: 曲のどの部分（イントロ、バース、コーラスなど）の歌詞やプロンプトを作成したいか、指定してください。未指定の場合は、曲全体の構造を提案します。 * 詳細な指示: 歌詞の言語、曲の構造、雰囲気、使用したい楽器など、より詳しい指示があれば教えてください。例 * * 簡単な例: 「アップテンポなダンスミュージックを作りたいです。歌詞は英語で、未来的な雰囲気を出したいです。」 * * 詳細な例: 「80年代風のシンセポップを作りたいです。イントロはパッドで雰囲気を作り、バースはキャッチーなメロディで、コーラスは高揚感あふれる歌詞で構成したいです。歌詞は日本語でお願いします。」 * 既存の曲をリミックス: 「既存のトラックの情報を提供しますので、構成を再構築してください。【既存のトラックのプロンプト: ***; 既存トラックの歌詞: ***】」 # 出力内容: * プロンプト: Udioに入力するテキストで、曲の雰囲気、ジャンル、楽器などを指定します。 * 歌詞: LyricsをCustomにした際に入力可能なコードです。歌詞とUdioの機能を拡張するための特別な命令が含まれます。コマンドを含む歌詞をUdioに入力する際は、`Lyrics Strength`を75%以上にすると良いそうです。うまくいかない場合はお試しください。 * 解説: アシスタントが生成したプロンプトと歌詞及びコマンドについての詳細な解説です。チャットにて指示すれば省略することもできます。「例：これ以降、解説は不要です。」 # その他: * 繰り返し: 生成された結果が気に入らなければ、プロンプトを修正して再度生成できます。 * 使用する言語モデル: Claude3.5 Sonnetを推奨します。あなたの音楽アイデアを形にするために、このアシスタントを最大限活用してください！よろしければ、このアシスタントを利用して作成したトラックのURLをコメントで共有してください！
2
2
59
445
やっきょく
GPTs
キャラクター作成
花押クリエイター
花押クリエイターは、日本の伝統的な署名や印「花押」のデザインをサポートするためのツールです。国内外のさまざまな文化背景を考慮し、名前やシンボルを基にした個性的で芸術的な花押デザインを提案します。このツールは、歴史的な作法や文化的背景を尊重しながら、現代的なアプローチにも対応します。作成した花押のコンセプトや意図を分かりやすく説明し、カスタマイズや調整も簡単に行うことが出来ます。初めての方から花押愛好家まで、どなたでもご利用いただける「花押クリエイター」で、あなただけの特別なデザインを作りませんか？　GPTsストアで高評価していただけると嬉しいです。 #画像作成 #花押　#サイン
7
2
3.45K
7.78K
shimasang

ReactのComponentからStorybookのStory生成

コメント 0

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