もと @moto_ai_jp
AI学習 › 作り方講座 › アプリを作る › STEP 5

アプリを作る · STEP 5 / 10 · 応用

Claude Code で手元のフォルダに作る

チャットの中では収まらなくなったら、手元のフォルダで作ります。ファイルが自分のパソコンに残るので、育てていくアプリに向いています。

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10

作業用フォルダを作る

「書類」などに、アプリ用の新しいフォルダを作ります。大事なファイルが入っているフォルダでは始めません。

VS Code でフォルダを開き、Claude Code を起動

入れ方と開き方は、ステップアップ入門の VS Code 編にまとめています。VS Code 編を見る
ファイル新しいテキストファイルファイルを開く…フォルダーを開く…最近使用した項目を開く📁 my-first-claude中身は空でOK
「ファイル」→「フォルダーを開く…」で、練習用のフォルダを選びます。

仕様メモを置いて頼む

前のステップの SPEC.md をフォルダに入れて、「SPEC.md を読んで、まず計画を出して」と頼みます。計画を読んでから「進めて」と伝えます。

ブラウザで開いて確かめる

Web の道具なら、できた index.html をブラウザで開いて触ります。「ローカルでサーバーを立てて」と頼むと、その方法も案内してくれます。

そのまま使える頼み方の例

（Claude Code で）
このフォルダの SPEC.md を読んで、アプリを作る計画を出してください。
- 使う技術は、できるだけ少なく（まずは HTML と JavaScript だけで）
- ファイルの構成と、作る順番を出す
- まだファイルは作らないでください

できたらチェック

このステップ：0 / 2