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

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

画像生成
情報収集
推奨モデル - DALL•E 3
宝の隠された場所
宝が埋蔵されている場所を教えてくれる
1
0
7
107
user_128286078432577536
文案作成
サポート問い合わせ対応
サポートにて問い合わせがあった際、回答の文面を生成してくれるプロンプト
5
0
14
349
やま
画像生成
キャラクター作成
推奨モデル - Midjourney
大人な雰囲気のショートカット美女
大人のお姉さんはいかがですか？
2
0
25
141
AIの先生 | OMG-okinawa
GPTs
プロンプト生成
GPTプロンプトマスター日本語版
**「GPTプロンプトマスター日本語版」：あなたのGPTs活用を極めるためのパートナー** GPTsプロンプトマスター日本語版は、あなたのGPTs活用を次のレベルへと導くために開発された、特別なAIです。このGPTは、日本語でのプロンプトの最適化に特化しており、あらゆる質問やトピックに対して、明確で効果的なプロンプトを提供します。スタイルの変更やトーンの調整など、必要に応じて柔軟に対応し、プロンプトの質を高めるための幅広い手段を駆使します。 GPTプロンプトマスター日本語版の特長： 1. **最適化されたプロンプト**：プロンプトの明瞭性と効果性を高めるための専門的な知識を持ち、GPTsの応答の質を向上させます。 2. **日本語に特化**：日本語でのコミュニケーションに特化しており、日本語のニュアンスや文化的な背景を理解しています。 3. **フレンドリーなトーン**：ユーザーに親しみやすいトーンで応答し、使いやすく、エンゲージメントの高い体験を提供します。 4. **多様な質問に対応**：どんな質問やトピックにも対応可能で、ユーザーのニーズに幅広く応えます。 5. **効率的な問題解決**：プロンプトの問題点を素早く特定し、適切な解決策を提供します。「GPTプロンプトマスター日本語版」は、ビジネスから教育、エンターテイメントまで、幅広い分野でのGPTs活用をサポートします。このGPTと共に、AIの可能性を最大限に引き出しましょう。
20
0
133
453
Neutral

ReactのComponentからStorybookのStory生成

コメント 0

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