どんな話？
コードの見方と、外へ持ち出す3つの出口（見る・まとめて受け取る・GitHubにつなぐ）を整理した回です。最初に開く画面のapp/page.tsxは6行でした。Download ZIPは3回押して、3回ともファイルは保存されませんでした。GitHubは設定の画面を開いたところまでで、つないでいません。公式の説明では、つなぐとリポジトリがコードの「正」になり、消すとコードは取り戻せなくなるかもしれません。
この記事でわかること
- 出口は3つ。Codeの画面で見る、ZIPでまとめて受け取る、GitHubにつなぐ。できることが増えるかわりに、取り消しにくくなる
- 最初に開く画面のapp/page.tsxは、たった6行。第8話で足したAIを呼ぶ処理はapp/api/refine-note/route.tsで、package.jsonは、このアプリが使っている外の部品の一覧
- 「Download ZIP」は3回押して、3回ともファイルは保存されなかった。1回は「An unexpected error occurred.」と表示された。制作ではブラウザを外から自動で操作していて、それが関係している可能性がある
- 作業用のフォルダには「.env.development.local」があり、Codeの左の一覧には出ていなかった。ZIPを人に渡す前に、名前が「.env」で始まるファイルが入っていないかを見る
- Settingsの「GitHub」の画面には「No GitHub repository connected」という文と、「Connect」のボタンが1つ。公式の説明では、v0が作るリポジトリはprivate（非公開）
- 公式の説明では、GitHubのリポジトリをつなぐと、それがプロジェクトのコードの「正」になる。リポジトリを消すと、コードは取り戻せなくなるかもしれない。つながりを外す手順は、公式の説明書に書かれていない
やることチェックリスト
0/5記事を読みながら、できたものにチェックを付けていけます。チェックはこの端末に残ります。
ぜんぶできた！おつかれさまでした。
くわしい手順と画面の図は、Xの記事にあります。
こんな人に
- 「このアプリはv0の中にしかないのでは」「v0が使えなくなったら、全部なくなるのでは」と、ふと不安になった人
- 自分のアプリがどんなファイルでできているかを、コードを読めなくても知っておきたい人
- GitHubにつなぐ前に、確かめることと、つないだあとの決まりを知りたい人
この話のTIPS
- コツ受け取ったZIPは、押した時点の写しです。そのあとでv0のアプリを直しても、手元のZIPは変わりません。直すたびに受け取り直す必要があります。
- 注意GitHubのリポジトリをつなぐと、それがプロジェクトのコードの「正」になる。リポジトリを消すと、コードは取り戻せなくなるかもしれない。つないだあとの決まりは、1つだけ覚えてください。リポジトリは、消す前に、ほかの場所に写しがあるかを確かめる。