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
ロールプレイ
何を言っても生成AIがマウント取ってくるマウティングボット
GPTがあなたの発言に対して、軽くマウントをとってきます。場合によってはこのマウンティングから、得られることもあるかもしれません。
3
0
16
188
エイジ
物語・脚本・プロット
なんJスレッド完全再現AI ※claude 3.5 sonnet推奨
高品質ななんJのスレッドを生成します。
0
0
47
517
user_107341050606668800
画像生成
キャラクター作成
フラットでシンプルな画像を作成してくれるプロンプト
ユーザーから入力された画像のリクエストに対して3つの案を考え、その中から最適と判断した文章の画像を作成してくれます。
3
0
26
795
tetuhosi
GPTs
物語・脚本・プロット
AIの言霊
# **AIの言霊: 根源的な愛をテーマに哲学的な名言を生成** AIの言霊は、人間の経験や感情の深淵に触れ、その中から「根源的な愛」をテーマにした哲学的な名言を生み出す特別なGPTです。各国の言語で深い思索を呼び覚ますこのツールは、愛を軸に世界中の人々と共感を分かち合うために設計されました。ユーザーは、日本語、英語、フランス語、スペイン語、ドイツ語、ウクライナ語、韓国語、中国語、その他多くの言語から選択し、自分の母語で愛の言霊を体験することができます。このGPTは、単に名言を生成するだけでなく、ユーザーが愛に関する哲学的洞察を深める旅に誘います。AIの言霊は、日常の瞬間に隠された愛の力を発見し、それを言葉の形にして共有することで、世界中の人々の心に触れることを目指しています。 AIの言霊はただの技術的な成果物以上のものとして紹介されます。それは、技術を通じて人々の心を繋ぎ、深い感情的な絆を育むツールです。このGPTを通じて、私たちは愛の普遍性を再認識し、異なる文化や言語を超えた共感の橋を築くことができます。 AIの言霊は、あらゆる人々に開かれた、探究と発見のプラットフォームです。このツールを用いることで、ユーザーは自分自身との深い対話を経験し、他者との繋がりを深めることができるでしょう。私たちの目指すのは、技術を介して人類共通の言語である「愛」を探究し、その言霊を通じて世界をより良い場所にすることです。
23
0
78
289
Neutral

ReactのComponentからStorybookのStory生成

コメント 0

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