AIにコードを書かせるとき、いちばん大事なのは、前提（使う技術や約束ごと）を最初にそろえることです。「開発・Web／アプリ」タブは、その前提を毎回きちんと渡すための、10のコマンドです。
土台になる3つ
汎用開発フレーム（全スタック対応） 無料のおすすめ
フロントエンド、バックエンド、データベースなどの技術を選んで固定し、設計の原則、型安全、エラーの扱いの約束ごとを、AIに一度で正確に伝える基本の枠です。
- こんなときに：新しい会話で、開発の相談を始めるとき
- 選ぶ・書く項目：フロントエンド（Next.js／React／React Native／Vue など）、バックエンド（Server Actions／Hono／Express／FastAPI など）、データベース、作りたいもの
要件定義・ユーザーストーリー化 無料のおすすめ
アイデアの段階の機能から、そのまま開発に使える、受け入れ条件（Given-When-Then）つきのバックログを作ります。
- 選ぶ・書く項目：サービス、作りたい機能
DBスキーマ＆型定義の自動生成 無料のおすすめ
画面の仕様や、データの関係から、Prisma のスキーマと、フロント・バック共通の TypeScript の型を、まとめて作ります。
- 選ぶ・書く項目：画面やデータの仕様
作る・確かめる4つ
再利用できるUIコンポーネント
Tailwind CSS と TypeScript で、読み込み中・エラーの状態や、アクセシビリティまで考えた React コンポーネントを作ります。
- 選ぶ・書く項目：フロントエンド、作りたいUI
APIハンドラー＆入力チェック（Zod）
入力のチェック、データベースの操作、エラーの応答（401／400／500）までを、一連の処理として作ります。
- 選ぶ・書く項目：エンドポイント、目的
単体テストの自動生成（Vitest / Jest）
正常な場合だけでなく、空の値、境界の値、空の配列、時間切れなどの「端のケース」まで網羅した、テストのコードを作ります。
- 選ぶ・書く項目：テストしたいコード
OpenAPI / Swagger の仕様定義
フロントとバックの食い違いを防ぐため、仕様を決めた時点で、OpenAPI 3.0 形式（YAML）にします。
- 選ぶ・書く項目：エンドポイントの仕様
技術別・設計の3つ
Next.js（App Router）フルスタック 無料のおすすめ
サーバーとクライアントの境界の分け方、入力チェック、トランザクションを、安全に扱うための、Next.js 向けの指示です。
- 選ぶ・書く項目：作りたいもの
React Native（Expo）＋ Supabase
画面の安全領域、一覧の表示速度、Supabase の行レベルのセキュリティ（RLS）まで落とし込んだ、モバイルアプリ向けの指示です。
- 選ぶ・書く項目：作りたいもの
機能別のディレクトリ構成と規約
大きくなっても破綻しない、機能単位のディレクトリ構成と、ファイルの置き場所のルールを決めます。
- 選ぶ・書く項目：サービスの概要
上手に使うコツ
- 最初に「汎用開発フレーム」で前提を渡してから、個別のコマンドを使うと、答えのぶれが減ります。
- 生成されたコードは、必ず動かして、テストしてから使ってください。秘密の鍵やパスワードは、プロンプトに書かないでください。
- 「万能・テキスト」タブの「コードレビュー」も、書いたコードの点検に使えます（万能・テキスト②）。
使い方は、どのコマンドも同じです。「開発・Web／アプリ」タブを開き、コマンドの行を押して、選択肢を選び、空欄に書き込みます。プレビューで確かめてから、「⚡ 挿入」で、開いているAIの入力欄に入れます（はじめての使い方）。