강의

멘토링

커뮤니티

NEW
Programming

/

Full-stack

実践AI SaaSフルスタック開発:ビデオチャットアプリを作る

リアルタイムAIエージェント、会議内容の要約、そして通話後機能を備えたAIベースのビデオ会議アプリケーションを作りましょう。

16名 が受講中です。

  • antonio
AI 코딩
실습 중심
토이프로젝트
앱개발
React
Next.js
TailwindCSS
saas
AI Agent

受講後に得られること

  • 一つの完成型AIサービスをエンドツーエンドで完成

  • Next.js 15ベースのAI × SaaSサービス構造設計

  • リアルタイム対話型AIエージェントの実装

  • リアルタイム音声・映像処理パイプライン構築(ビデオ通話を含む)

  • イベント駆動型のAI要約パイプライン構築

  • 認証・サブスクリプション・使用量ベースの課金などSaaS全体のフロー実装(Polar + Better Auth)

  • Inngestでバックグラウンド作業自動化構成

  • CodeRabbit AIレビューによるコード品質の改善

AIサービス、一度作ってみたいけど
どこからどう始めればいいのか途方に暮れていませんか?

AI機能を実装してみる講義は多いですが
「ちゃんとしたAIサービスを作る講義」は多くありません。


今回の講義では

リアルタイム音声・映像処理、自動要約・整理、会議Q&AなどのAI機能から
認証・サブスクリプション・使用量ベースの課金構造まで、SaaSサービスが備えるべき
全体のフローを一つのアプリ内で直接実装してみます。


ポートフォリオ以上の体験、

完成形AIサービスを作る過程
今体験してみてください!


25個以上のプロジェクト型講義で多くの愛を受けているアントニオが
実戦型AIサービス実装講義で帰ってきました!


Point 1

MeetAIを構成する3つのAI機能

リアルタイム会話、自動要約、Q&Aまでサービスにすぐ適用できる3つのAI機能を実装します。

1. リアルタイム対話型AIエージェント

ストリーミングレスポンス

通話が始まったらすぐに参加してストリーミングで応答するReal-time AIエージェント実装


マルチモーダル処理

音声・テキスト入力をすべて処理し、音声で応答するマルチモーダル対話フローを設計

AIペルソナ設定

プロンプト(instructions)で口調と役割を定義し、状況に合ったキャラクター型AI応答を生成



2. AI自動要約機能

イベント駆動型AIパイプラインの自動化

会議終了イベントをトリガーに
スクリプト生成 → 要約 → DB保存まで
一度に処理される自動化パイプライン

非同期処理構造で素早く結果物を生成

ユーザーリクエストと分離された
非同期作業で遅延を減らし、
要約結果を素早く提供するバックエンド設計




3. AI Q&Aアシスタント


GPTスタイルのインターフェース実装

Stream Chat SDKで実装する
ChatGPTスタイルの
Q&Aインターフェース

会議専用アシスタント

会議の要約・文字起こしを基に、
会議の文脈を理解し
フォローアップ質問に答えるAIアシスタントの役割


Point 2

サブスクリプション型SaaS構造の学習

ログイン・サブスクリプション決済・使用量ベースのアップグレードなど
サブスクリプション型SaaSサービスの基本的な流れを体験できます。


Stripe/Clerkの組み合わせよりも軽量で開発者フレンドリーな
オープンソースPolar + Better Authの組み合わせ
認証からサブスクリプション決済までの全体フローを設計します。


ここで、使用量を基準に無料体験の上限をチェックし、
超過時には料金プランのアップグレードを促す
一般的なSaaS課金体系まで一緒に実装してみます。



Point 3

AIと協業するコードレビュー

実務でよく使うGitHub FlowにAIコードレビューを加えました。

講義はGitHub Flowをベースに実習を進め、
PRごとにCodeRabbit AIがどのようなレビューを残すか
確認できるように設定します。


この過程で
コードスタイル、潜在的なバグ、改善ポイントまで
AIと協業するコードレビュー過程を経験できます。

CodeRabbit AIとは?

CodeRabbit AIは、GitHub Pull Requestに自動的に参加し、コードスタイルやバグ、リファクタリングのアイデアまでリアルタイムで提案してくれるAIベースのコードレビューツールです。


講義で扱う技術スタック


🤖 AI機能

• AIベースのリアルタイムビデオ通話

• リアルタイムカスタムエージェント

• 会議内容に関するAI Q&A

• OpenAI連動

🎥 会議および映像・テキスト処理

• リアルタイムビデオ通話SDK(Stream Video)

• リアルタイムチャットSDK(Stream Chat)

• 要約、全体スクリプト、録画本の生成

• 動画再生機能

• 検索およびキーワードハイライト

• 会議記録及び状態管理


💳サブスクリプションとユーザー管理

• サブスクリプション決済(Polar連携)

• ログイン/認証システム (Better Auth)

rul x Eqnm x u to Qnm x Qqnm xr=Qnm x Qnm x Qnm x Qnm x Qqnm x A quelle Qnm x Qnm x Qnm x Qnm x Qqnm x Qqnmx

🛠 実装に使用した核心技術

• Next.js 15 + React 19

• Tailwind CSS v4 + Shadcn UI

• Inngestベースのバックグラウンドジョブ

• CodeRabbit AIコードレビュー自動化

受講前にご確認ください! 📢

この講義はCode with Antonio YouTubeチャンネルでも公開されていますが、
実際にクローンコーディングを完成させるには有料学習資料が必ず必要です。
(全体のコードベース、設定ファイル、構造化されたコンポーネントを含む)

💬 Inflearn講座でのみ提供されます!

  • 13時間の長い映像を体系的なカリキュラムに分けました。希望する部分を素早く見つけて学習し、いつでも気軽に復習できます。

  • 英語が不慣れでも心配しないでください!

    韓国語吹き替えが提供されているので、快適に聞くことができます。

  • 学んだ内容、そのまま流さないでください 🙂

    途中途中AIクイズで楽しく復習できます!

こんな方に
おすすめです

学習対象は
誰でしょう?

  • AI機能を実際のサービスに適用してみたい方

  • Next.js 15ベースのAI × SaaSの流れを体験したい方

  • 完成型AIプロジェクトでポートフォリオを強化したい方

  • AIコードレビュー(CodeRabbit)環境を体験してみたい方

前提知識、
必要でしょうか?

  • JavaScriptとReactに関する基本知識

こんにちは
です。

596

受講生

17

受講レビュー

4

回答

3.9

講座評価

2

講座

안녕하세요, 저는 소프트웨어 엔지니어 Antonio입니다. 7년 이상의 개발 경력을 가지고 있으며, 프로그래밍 세계에 매료되어 이 분야에서 일할 수 있다는 것을 큰 행운으로 생각합니다.

그동안 다양한 프로그래밍 언어와 기술을 다루는 경험을 통해 개발자로서 많은 성장을 이룰 수 있었습니다. 지금까지 쌓은 지식과 경험도 소중하지만, 저는 여전히 배우고 성장하는 데에 큰 열정을 가지고 있습니다.

이러한 경험과 열정을 바탕으로, 프로그래밍에 대한 애정을 나누고 함께 배우며 성장하기 위해 "Code With Antonio" 유튜브 채널과 학습 플랫폼을 운영하고 있습니다. 제가 만든 튜토리얼과 인사이트가 많은 분들께 도움이 되고, 프로그래밍 커뮤니티에 긍정적인 기여를 할 수 있기를 바랍니다.

 

カリキュラム

全体

30件 ∙ (13時間 23分)

講座掲載日: 
最終更新日: 

受講レビュー

まだ十分な評価を受けていない講座です。
みんなの役に立つ受講レビューを書いてください!

期間限定セール

¥27,500

50%

¥6,854

antonioの他の講座

知識共有者の他の講座を見てみましょう!

似ている講座

同じ分野の他の講座を見てみましょう!