小さな変更
文言の修正や項目の追加など、1回で終わる変更の進め方です。いちばんよく使います。
こんなときに使う
- 画面の文言、色、並び順を変えたい
- 入力項目や、一覧の列を1つ足したい
- 不具合を1つ直したい
いくつかの画面にまたがる機能を作りたいときは、大きめの機能 を使います。
始める前に
- Claude Code で
100raku-vibe-coding-platformフォルダを選んでいることを確かめます。 - 新しい会話で始めます。前の作業と同じ会話で別の変更を頼むと、2つの変更が混ざってしまいます。
- どのアプリの、どの画面を、どう変えたいかを決めておきます。
ステップ1：依頼する
次の依頼文の【 】の部分を書き換えて、Claude Code に送ります。
アプリ名が分からないときは、App Portal に表示されている名前を書きます。Claude が該当するアプリを探します。
ステップ2：計画を確かめる
Claude が計画を説明します。次の3点を確かめます。
- 頼んだことと合っているか
- 頼んでいないことまで変えようとしていないか
- 分からない言葉が残っていないか
よければ「OK」と返します。違うところがあれば、その場で伝えます。
データの入れ物（テーブル）を追加したり変えたりする変更は、ほかのアプリにも影響することがあります。作業は進めて構いませんが、マージする前に管理者に見てもらいます。
ステップ3：Claude が作るのを待つ
Claude が変更を作り、ビルドを確認します。ビルドは、アプリを正しく組み立てられるかの確認です。途中で質問や確認が来たら答えます。
ステップ4：画面で確かめる
できあがると、Claude が、Claude のアプリの中のブラウザでアプリを開いて見せます。あなたのパソコンの中だけで動いていて、入っているのは架空のテストデータです。実際にさわって確かめます。
- 頼んだ変更ができているか。 計画で説明されたとおりになっているかを見ます。
- まわりが壊れていないか。 変更した画面の前後の画面や、関係しそうな機能も動かします。
確かめ方のくわしい説明は、画面を確かめる にあります。
はじめて画面を開くときだけ、準備に数分かかります（お試し用のデータベースを入手するためです）。2回目からは、数秒で開きます。
直したいところがあれば、同じ会話のまま Claude に伝えます。
よければ「OK」と返します。Claude が PR を作り、PR の URL を教えてくれます。
プレビューは、インターネット上に用意する、お試し用の環境です。実際のデータで見たいとき、メールが届くかなどを試したいとき、ほかの人に見せたいときに使います。用意に 10〜20 分かかり、動いている間は費用がかかるので、ふだんは作りません。迷ったら「なしで進めてください」と答えます。あとからでも頼めます。
ステップ5：確認してマージする
ここからは、あなたの番です。確認してマージする の手順で、自動チェックを確かめてマージします。
PR を作ったあとで、直したいところが見つかったら
同じ会話のまま Claude に伝えます。Claude が直すと、同じ PR が更新されます。
伝え方の例
| 伝わりにくい頼み方 | 伝わりやすい頼み方 |
|---|---|
| 一覧を見やすくしてほしい | 一覧の文字を大きくして、行の間隔を広げてほしい |
| ボタンを直してほしい | 登録画面の「保存」ボタンを押しても、何も起きない。押したら一覧画面に戻るようにしてほしい |
| 項目を増やしてほしい | 登録画面に「備考」という入力欄を足してほしい。入力は任意で、一覧にも表示してほしい |
よくある失敗
- 1回の依頼に、いくつもの変更を詰め込む
- 計画を読まずに「OK」と返す
- 画面を見ずにマージする
- 前の作業と同じ会話で、別の変更を頼む
クイズ
Claude が開いた画面を見たら、頼んだ列は追加されていましたが、並び順を変えたくなりました。どうしますか？