動かないときは、エラーをそのまま貼る：名簿から名前を選ぶ

受講生

エラーって怖い。
壊しちゃったのかなって思う…

先生

壊れていません。エラーは
AIへの手がかりです。
意味が分からなくても、貼れば直ります。

見本1：名簿から選べるようにする

毎回名前を打つのは大変なので、名簿のファイルを作って、そこから選べるように頼みました。

実際の画面まず名簿.txt（5人の仮の名前）を作ってよいかの確認。このあと index.html の書きかえの確認が4回続いた

実際の画面Claude Code の報告。赤枠のとおり、「ブラウザによっては、ファイルを直接開いたページから別のファイルを自動で読めません。そのときは「名簿.txt を選ぶ」ボタンで選んでください」と、先に書いてあった

見本2：開くだけでは、名簿が出ない

名簿.txt をテキストエディット（Mac のメモ帳のようなアプリ）で開いて、6人目の「山本 りん」を1行足して保存。（撮影では、1行を足す作業はターミナルから行いました。）ブラウザで開き直しても、予約表の上には「名簿を読み込んでいません」と出たままで、名前の候補も出ませんでした。

AIが作った実物予約表の上のほう。「名簿を読み込んでいません」と出たまま（撮影では画面に出さない形の Chrome で撮りました）

こんなときは、ブラウザのコンソール（ページの裏で起きたことを見る窓）を開きます。Chrome なら option＋⌘＋J で開きます。赤い字が出ていました。

見本3：見たまま＋赤い字を、そのまま貼る

録画（早送り）貼ってから、直るまで（早送り。実際は38秒）

実際の画面Claude Code の説明。赤枠が「原因」と「直し方」

AIが作った実物直したあと。「名簿:6人」と出た（赤い字は消えた）。名前の欄の候補には、山本 りんを含む6人が入っていた

名前の欄をクリックすると名簿の名前が候補に出る、と Claude Code は説明しました。撮影では、候補の画面そのものは撮れなかったので、候補に6人分が入っていることを確かめました。

あなたの番：名簿から選べるようにしよう

① 名簿から選べるように頼む

貼る文（全文）

名前を毎回打つのが大変です。生徒さんの名簿を「名簿.txt」に1行1人で書いておくので、予約表ではその名簿から名前を選べるようにしてください。名簿.txt には、仮の名前を5人分入れておいてください。

実際の画面

確認が5回出ます。どれも、中身を読んでから 1 で Enter。

② うまく動かないところがあったら、見たまま＋赤い字を貼る

あなたの予約表では、同じことが起きるとは限りません（Claude Code の作り方は毎回ちがいます）。何か動かないときに、下の形で頼みます。

• 何をしたか（名簿.txt に1人足して、開き直した）
• 何が起きたか（名簿が読み込まれず「名簿を読み込んでいません」と出る）
• 赤い字（コンソールで、赤い行を選んでコピー。全部そのまま貼る）

頼む文の形（最後に赤い字を貼る）

名簿.txt に「山本 りん」を足して、ブラウザで開き直したのですが、名簿が自動で読み込まれず「名簿を読み込んでいません」と出ます。毎回ボタンで選ぶのは面倒なので、開くだけで名簿が出るようにしたいです。ブラウザのコンソールに、赤い字でこう出ていました。（ここに赤い字をそのまま貼る）

実際の画面撮影で貼った文。長い英語の赤い字も、そのまま全部貼りました

③ 確認の画面を読んで、Enter

実際の画面名簿.js を作る確認。中身は名簿（1行に1人）。1 で Enter。このあと index.html の書きかえの確認が4回続きました

つまずきやすいところ

最初の疑問に戻ります

※ ターミナルの画面は、2026年10月19日に吉田のiMac（Mac）で Claude Code（2.1.303）を実際に動かして撮ったものです。モデルは Sonnet 5.5。確認の画面は、最初の設定のまま（毎回たずねる）でした。できた予約表は、同じiMacの Chrome（画面に出さない形で起動したもの）で開いて撮りました。どのプランで同じことができるか、Windows でどう見えるかは、この講座では確かめていません。アカウントの情報は消してあり、フォルダの場所はデスクトップの表示に置きかえています。AI の答えの文は、毎回すこしずつちがいます。