ChatGPT APIを使ってWeb上でチャットできるようにしよう！ (Next.js利用)

Channel:
Japan サファはユーチューバー【AIイラスト】
Subscribers:
13,500
Published on ● Video Link: https://www.youtube.com/watch?v=Kr75rc8BEtg


Duration: 5:04
63 views
1

今回は Next.js と ChatGPT API を利用してWeb画面上でChatGPTとチャットできるようにしてみます。

■前提条件
・ChatGPT APIキーを取得している
・Next.jsの基本的な利用方法を理解している

また前回の動画も見ていると、より理解しやすいような内容となっています。
・ChatGPT APIを使って会話プログラムを作ってみる
https://www.youtube.com/watch?v=M9_A2yYk5go

■目次
0:00 - 茶番
1:28 - 実装開始
2:15 - Next.jsでの環境変数の定義方法
2:49 - 作成したデモの実演
3:25 - ソースコード解説
4:35 - 締めの言葉

■作成したソースコード
https://gist.github.com/safa-dayo/ed9b16839d425487a1c2f9c7b2176d36

■関連情報のURL
・ChatGPT APIキーの取得方法（サファの動画）
https://www.youtube.com/watch?v=uaRjLwyncTA

・ChatGPT APIに関するドキュメント
https://platform.openai.com/docs/api-reference/chat/create?lang=node.js

・Next.js
https://nextjs.org/

#chatgpt #nextjs #chatbot



Other Videos By サファはユーチューバー【AIイラスト】


2023-03-28【画像生成AI】スマートフォンからもStableDiffusionで画像生成が可能です
2023-03-27【手短に試してみたい人向け】Google Colab でStable Diffusion web UIを簡単に試す動画
2023-03-25iPhoneのホーム画面からすぐにChatGPTを使えるようにする方法
2023-03-25ChatGPTにブロック崩しのゲームを作ってもらおう！
2023-03-23【Google ColabでPython学習】ColabからPlaywrightを触ってみよう！
2023-03-21【AI画像生成】Windows PC でStable Diffusionを動かそう
2023-03-18Atomの後継！？Zedというテキストエディターについて
2023-03-16GoogleColabからStableDiffusionを使って画像を生成してみる
2023-03-11【Pythonプログラミング】Google ColaboratoryからもChatGPT APIを触ってみよう！
2023-03-09ChatGPTにTwitterみたいな 画面を作ってもらおう！
2023-03-07ChatGPT APIを使ってWeb上でチャットできるようにしよう！ (Next.js利用)
2023-03-05ChatGPT APIを使って会話プログラムを作ってみる
2023-03-02ChatGPT APIを使ってNode jsで Hello world してみる
2023-02-28【ChatGPT】AIパワーの無駄遣い
2023-02-16【おすすめグッズ紹介】サファがヒーター付きマッサージピローをおすすめする動画
2023-02-11プログラマー・エンジニアあるある - 自分の書いたコードが読めない
2023-02-10#4 Astroを触ってみるだけの配信（黙々）
2023-02-10#3 Astroを触ってみるだけの配信（黙々） - TODOリストを作っていく（その１）
2023-02-09Astroを触ってみるだけの配信（黙々）
2023-02-09#2 Astroを触ってみるだけの配信（黙々） - prettier設定、markdown(mdx)導入
2023-02-09Vimにrust-analyzerを設定する方法


Tags:
ChatGPT API
Next.js
プログラミング