ai-app について
AI アプリの計画と実装を支援し、既存の技術スタックと SDK のメジャーバージョンを維持するスキルです。バージョン選定、サーバー側の認証情報管理、ユーザーフロー、統合テストを案内します。
主な機能
- 01AI SDK とプロバイダーのバージョンを特定
- 02認証情報と認可をサーバー側で管理
- 03最小限の完結したユーザーフローを構築
- 04サーバーストリームとクライアント転送を整合
- 05複数ターン、ツール状態、失敗を検証
活用シーン
- 01新しい AI アプリの開始
- 02既存スタックへのチャット追加
- 03エージェントダッシュボードの実装
- 04ストリーミングによる複数ターンの検証
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/インストール後、Claude Code で/ai-appを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/agent-dashboard.mdchatbot.mdexamples.mdproject-structure.md詳細
AI アプリケーションのセットアップ
ユーザー、データ、運用を中心に、要件に沿ったアプリを構築します。移行がタスクに含まれていない限り、既存のスタックと SDK のメジャーバージョンを維持します。新しい JavaScript プロジェクトには Bun を使用します。
- インストール済みの AI SDK のメジャーバージョンを
ai-sdkで確認し、実装にはai-sdk-6またはai-sdk-7を使用します。新しいアプリでは、AI SDK 7 をデフォルトとして使用します。つまり、ai@7、@ai-sdk/react@4、各プロバイダーパッケージはlatestです（プロバイダーのメジャーバージョンはそれぞれ異なります。Node.js 22 以上が必要です）。依存関係で v6 が必須の場合に限り、v6 を維持します。AI Elements は引き続き v6 を対象としており、パッチを適用するまでcontext.tsxは v7 の型チェックに失敗します（ai-elementsを参照）。Web の例を使用する前に、バージョンに対応したai/docs/とプロバイダーのドキュメントを確認します。 - フレームワークのセットアップには
nextjs-shadcnを、ビジュアルの方向性にはfrontend-designを使用します。必要なチャット UI にコンポーネントが適している場合はai-elementsを使用します。レジストリの props を推測せず、インストール済みのソースを確認してください。 - プロバイダーの認証情報と認可はサーバー側で管理します。モデル ID は設定または選択したプロバイダーのカタログから取得します。
- ユーザーフローは、完全な機能を備えた最小限のものを実装します。アプリで必要な場合は、永続化、承認、添付ファイル、検索、候補、ダッシュボードを追加します。
- サーバーのストリームとクライアントのトランスポートを一致させます。プロジェクトの型チェックとビルドに加えて、2 回目のターン、関連するツールの状態、安全なエラー処理、モバイルでの動作を検証します。
構築するアプリに応じて読むドキュメント
- チャットボット：会話とストリームの契約。
- エージェントダッシュボード：実行、承認、実行状態。
- 例：最新の公式実装。
- プロジェクト構成：固定のツリー構成を前提としない境界。
nextjs-chatbot：永続的な履歴、フィードバック、埋め込み、本番環境での確認事項。
これらのリファレンスは要件を説明するものであり、そのままコピーして使える本番向けテンプレートではありません。
コメント
Markdown 対応