Koder Dev
HomeBlogPosts
HomeBlogPosts
Koder dev blog

© 2026 All rights reserved.

プライバシーポリシーXnote
Koder
Koder@koder_dev·05月04日

最近よく見る「話すアバターの広告動画」

…あれ、実はこうやって作られてるのかも? トピックを入れたら → ChatGPTがCMスクリプトを生成 → AkoolでAIアバターと音声を合成 → Convexでリアルタイム保存 → PayPalで課金処理まで対応 しかも、これアプリとして実装されていて UIはshadcn × Tailwind、認証はClerk React × Next.js製で、コード付きで全部再現可能 完成度も高くて、プロトタイプとは思えないレベル。 正直「これ、量産できる時代なんだな…」とゾッとした。 しかもこのチュートリアル、YouTubeで無料公開されてる。

React
Next.js
tailwind CSS
5h
投稿一覧へ90+

この投稿を見てる人はこちらの投稿も見てます👇

Koder
Koder@koder_dev·04月12日

AI面接官、実装してみたくない?

この動画では、AIを使った採用担当エージェントを自分で開発・デプロイする方法が丁寧に解説されてる。 Next.js、React、Supabase、Vapiを使って、 - AIを用いて音声でやりとりできる - 職種に合わせて質問を自動生成 - 面接後のスコア付きフィードバックを自動出力 といった機能が、ちゃんとフルスタックで作れる。 UIはshadcn、認証はSupabase、構成も洗練されててそのまま参考にできるレベル。単に試せるだけじゃなく、再現性が高くて学びも多いのがありがたい。 AIを活用したSaaSに興味ある人、採用プロセスを技術で改善したい人にはかなり刺さるはず。 5時間越えのチュートリアルだから、週末にじっくり触ってみるのもおすすめ。

AI面接官、実装してみたくない?
Supabase
shadcn/ui
React
Next.js
5h
Koder
Koder@koder_dev·05月24日

自分で作る以前に普通に使いたい笑

「録画して共有できるサービスか〜」って 軽い気持ちで見始めたら、 え、これ…全部入りすぎない? - 音声つきで画面録画→自動アップロード - リンク生成で即共有 - AI文字起こしまでついてくる - ギャラリーで検索・フィルターできる - Drizzle × TypeScriptで型安全 - ArcJetでbot除けとレート制限 スタックもキレイで:Next.js / Bunny / ArcJet / Drizzle 正直、これ自分で作れるようになるってヤバい 普通に学習教材として最強だった👇

自分で作る以前に普通に使いたい笑
React
Drizzle
Koder
Koder@koder_dev·04月03日

今流行りの技術スタック全部乗せじゃん!!

管理者ダッシュボードはいろんなアプリで必要になる機能だけど、ここまで最新技術スタックを用いてこの完成度の高さの動画は、まだなかなかないよ😎 <技術スタック> - React Next.js - TypeScript - Zod - Recharts - Shadcn/ui - React-Hook-Form この学びが深すぎる技術構成よ😁Rechartsで表の描画からShadcn/uiを用いたUI構築さらにreact hook formとZodでフォーム検証も簡単に実装できるって、もう最高すぎる! この動画を見れば、モダンな管理ダッシュボードを一から作れるスキルが身につくこと間違いなし! マジで、ダッシュボードを作りたい人は絶対に見るべき!

今流行りの技術スタック全部乗せじゃん!!
shadcn/ui
React
TypeScript
3h