本ワークショップでは、現代のAIプロダクト開発において「世界標準」となりつつある、以下のモダン・フルスタック構成を採用します。単に「無料であること」だけではなく、「AIによる高速な試行錯誤(AI-native Development)」を最大化し、参加者の皆様がUX設計の本質に集中できる環境を厳選しました。
採用ツールと役割
GitHub
ソースコード管理
特徴・信頼性: 世界シェアNo.1のプラットフォーム。全エンジニアの共通言語であり、現代のAIプロダクト開発における不可欠な基盤です。
GitHub Codespaces
クラウド開発環境
特徴・信頼性: ブラウザ上に1分で立ち上がる統合開発環境。PCスペックやOSの差に依存せず、参加者全員が「同一の環境」で即座に開発を開始できます。
Vercel
ホスティング / デプロイ
特徴・信頼性: Next.jsの開発元。コードを保存した瞬間に全世界へ公開される、圧倒的なスピードと信頼性を誇ります。OpenAIなどの世界的企業も採用する標準的なインフラです。
Supabase
バックエンド / BaaS
特徴・信頼性: AI(RAG)との親和性が極めて高いオープンソースのデータベース。認証やデータ保存をGUIで完結でき、インフラ構築の手間をゼロにします。
Next.js
アプリケーション・フレームワーク
特徴・信頼性: Reactベースの、世界で最も支持されるフルスタックフレームワーク。UI構築からサーバーサイド処理までを一貫して記述でき、画像最適化やキャッシュ機能が標準装備されており、ユーザー体験(UX)を損なわない高速な動作が可能です。現代のWeb開発における「OS」のような存在です。
なぜこの「組み合わせ」なのか?
本ワークショップでNext.jsを含むこのスタックを体験いただく理由は、以下の3点に集約されます。
- 1
環境構築トラブルの排除とフルスタック開発の両立
従来のワークショップで最大の壁となっていた「環境構築」をCodespacesで完結させます。その上で、Next.jsを採用することで、フロントエンドからバックエンド(API)までを一つのプロジェクトで管理でき、参加者は迷うことなくAIUXの実装へと入ることができます。
- 2
AI時代のフィードバックループの最大化
AIが生成したコードを、GitHub経由でVercelへ即座に反映させる。Next.jsの「高速な描画」とVercelの「即時デプロイ」が組み合わさることで、「数秒で動くものが形になる」体験が可能になります。これはAIUXにおいてプロトタイピングを繰り返すために必須のスキルセットです。
- 3
実戦で使える「世界標準技術」の習得
ここで扱うツールは、OpenAIや多くのスタートアップ、そしてエンタープライズ企業が実際にプロダクト投入している「実績ある技術」です。特にNext.jsとSupabaseの連携は、AI(LLM)を活用したモダンなアプリケーション開発の最適解とされています。ワークショップ後、そのまま実務のプロジェクトへ応用できるスキルが身につきます。
これらのツールは互いに強力な連携機能を持っており、ID連携(GitHubログイン)のみでシームレスに繋がります。この「ツール間の接続性の良さ」が生む、流れるような開発体験をぜひ体感してください。