見出し画像

ChatGPTを使ったアプリ作成:英語/中国語/日本語の単語カードで自分だけのオリジナルアプリを作成してみよう

今回は、ウェブブラウザベースのトリリンガルになるためのオリジナルアプリを作る方法を紹介します。ChatPGTで作っていくPromptで、一連の工程をみていき、単語学習を効率化していきましょう。

どんな見た目のアプリか?

この記事を見れば、以下のような見た目で、◯の部分をクリックすると

以下のように中国語に切り変わるアプリをつくることができるようになります。また、一連の工程をChatGPTで実施していくPromptを掲載しています

※注1)Promptを実行してもうまく行かない部分はありますが、それも今後の改修に向けたポイントとして認識しておくことにします
※注2)実施の都度、結果が変わる可能性があるので、完全な再現性は担保できない可能性があります

Step 0:要件定義とPromptの設計

1.3言語(日本語/英語/中国語)の単語を日常会話やビジネス会話のカテゴリー別に登録でき、クリックすると切り替えられるようにする
2.単語の登録は必要に応じてできるようにする
3.ブラウザアプリとして最小限の単位で作成する。具体的にはindex.htmlとstyle.cssとapp.jsの3つのファイル
4.フラッシュカードのようなイメージ


上記をもとに、Promptを設計すると以下になります。

ここから先は

7,676字 / 3画像

この記事が気に入ったらサポートをしてみませんか?