コードが書けなくてもAIで作れる範囲と、そこで止まる理由

• 1ファイルで完結するものは、未経験でもほぼ作れる
• 止まるのは「エラーが出たとき」。原因を伝える語彙がないと抜け出せない
• 公開や保存が絡むと、AIの外側の知識が必要になる

「コードが書けなくても作れる」という話をよく見る。どこまで本当か、意図的に自分の知識を使わずに試した。

作れたもの：1ファイルで完結する範囲

次のようなものは、指示を出すだけで動くところまで到達した。

• HTMLとCSSだけの1ページ。問い合わせ先や営業時間を載せた案内
• 入力した数字を計算して表示する簡単なツール
• CSVを読み込んで並べ替えるだけのページ

共通しているのは、ファイルが1つで、保存先を考えなくていいこと。ブラウザで開けば結果が見えるので、動いたかどうかの判断もつく。

止まった場面：エラーが出たとき

最初に詰まったのは、画面が真っ白になったときだった。何も表示されないので、何を伝えればいいのか分からない。

「動きません」と伝えると、AIは一般的な原因をいくつか挙げてくる。ただし当たっているかは分からず、提案されたコードに置き換えると今度は別の箇所が壊れた。

抜け出せたきっかけ

ブラウザに開発者ツールという画面があり、そこにエラーの内容が出ていると知ってからは進むようになった。その文言をそのまま貼ると、的確な修正が返ってくる。

つまり詰まるのはコードが書けないからではなく、状況を伝える手段を知らないからだった。エラーを見る方法さえ覚えれば、やり取りは成立する。

もう一度止まった場面：公開しようとしたとき

手元で動いたものを人に見せようとした段階で、別の壁が来た。

• ファイルをどこに置けば見えるようになるのか
• サーバーとドメインの関係
• アップロードの手順と、権限の設定

これらはコードの話ではないので、AIに聞いても一般的な説明しか返らない。契約しているサービスによって手順が違うため、結局は使っているサービスの説明書を読むことになった。

AIに頼る前に覚えると効く3つ

コードを書けるようになる必要はないが、これだけ知っていると詰まる回数が減った。

• 開発者ツールの開き方 — ブラウザでF12。エラーの文言をそのまま貼れる
• ファイルの拡張子と役割 — .html .css .js が何を担当するか。どのファイルの話か伝えられる
• 元に戻す手段 — 変更前をコピーして残す。壊れたときに戻れる

3つ目が特に効く。AIは「さっきの状態に戻して」と言っても戻せない。前のやり取りを覚えていても、ファイルの中身は見ていないからだ。自分で控えを取る以外に方法がない。

向いている使い方、向いていない使い方

• 向いている — 手元で完結する小さな道具。作って捨てる前提のもの
• 向いている — 既にあるコードの一部を直す。どこが悪いか示せる場合
• 向いていない — 長く使う仕組み。後から直せないと困る
• 向いていない — 人のデータを預かるもの。安全性の判断がつかない

最後の点は強調しておきたい。問い合わせフォームのように他人の情報を受け取るものは、動いて見えても安全とは限らない。この判断は、コードが読めないと難しい。

「動いた」と「使える」の間にあるもの

手元で動くところまでは行っても、人に渡せる状態とは違う。試してみて分かった差を挙げる。

• スマホで崩れる — パソコンの画面でしか確認していないと気づかない
• 想定外の入力で止まる — 空欄や記号を入れると動かなくなる
• 別のブラウザで動かない — 片方だけで確認して終わりにしがち

どれも「言えば直してくれる」が、そもそも問題に気づかないと言えない。確認の観点を知らないことが、未経験者にとっての本当の壁だった。

確認の観点を先に聞いておく

対策として、作る前に「これを確認すべき項目を挙げて」と聞くようにした。チェック項目が先にあれば、一つずつ潰せる。作ってから「何か問題ある？」と聞くより、抜けが少ない。

まとめ

• 1ファイルで完結し、手元で結果が見えるものは未経験でも作れる
• 詰まるのはエラーが出たとき。エラーの見方を覚えると進む
• 公開・保存はAIの外側の知識が必要になる
• 他人のデータを扱うものは、動いても安全性の判断ができない