MENU

AIコーディングとは?ツールの種類と始め方、34個のツールを作った運営者の実例【2026年10月】

AIコーディングとは?ツールの種類と始め方、34個のツールを作った運営者の実例【2026年10月】

※本記事にはプロモーション(アフィリエイト広告)を含みます。

AIコーディングについて、こんなことで迷っていませんか?

  • AIコーディングとは何か、ざっくり知りたい
  • Copilot・Cursor・Claude Codeなど、ツールの違いが分からない
  • プログラミングが得意でなくても始められるのか知りたい
  • 実際にどんなものが作れるのか、具体例を見たい
  • AIが書いたコードをそのまま使って大丈夫か不安

先に結論です。AIコーディングとは、AIにコードを書かせ、人は指示と確認に回る開発のしかたのことです。

使い方は大きく3段階あり、入力中のコードを補ってもらう方法から、作業を丸ごとAIに任せる方法まであります。

当ブログの運営者は、Claude Codeで3つのサイトに記事を毎日自動投稿しています。その仕組みや、職人向けの計算・作図ツール34個も、AIに書かせたコードで動いています。

この記事では、AIコーディングの基本に加えて「実際に作らせてうまくいったこと・失敗したこと」を、運営の記録をもとに紹介します。

この記事で分かること

  • AIコーディングとは何か、3つの段階
  • AIコーディングツールの種類と選び方
  • 運営者がAIに作らせたものと規模
  • 始め方の4つの手順
  • 向いている作業・向いていない作業と、実際の失敗

なお、AIで作ったツールやサイトを公開するには、置き場所のサーバーが必要です。当ブログと展開図ラボは、エックスサーバーのWordPressで動いています。

目次

AIコーディングとは?AIにコードを書かせる開発のしかた

AIコーディングは、生成AIにプログラムの作成・修正・説明をさせる開発の方法です。人がすべて手で書くのではなく、やりたいことを言葉で伝えてAIに書かせます。

AIコーディングの3つの段階|補完・対話・エージェント

AIの関わり方は、任せる範囲で3段階に分けると分かりやすくなります。下に行くほど、AIが自分で進める範囲が広くなります。

補完は、エディタで書きかけたコードの続きをAIが提案する使い方です。対話は、チャットで「こういう処理を書いて」と頼み、出てきたコードを自分で貼る使い方です。

エージェントは、AIが自分でファイルを読み、書き換え、動かして確かめるところまで進める使い方です。当ブログが毎日使っているClaude Codeは、この段階のツールです。

バイブコーディングとの違い

似た言葉に「バイブコーディング」があります。こちらはコードの中身をほとんど見ずに、AIとの会話の流れで作っていくスタイルを指すことが多い言葉です。

AIコーディングはもっと広い言葉で、コードを細かく確認しながらAIを使う場合も含みます。考え方の違いは、別の記事で詳しくまとめています。

あわせて読みたい
バイブコーディングとは?意味と始め方、AIに任せて壊れた5つの場面 ※本記事にはプロモーション(アフィリエイト広告)を含みます。 バイブコーディングが気になって、こんなことで迷っていませんか? バイブコーディングという言葉をよく見...

どれくらい使われている?開発者の8割以上が利用か予定

Stack Overflowの2025年の開発者調査では、回答者の84%が開発にAIツールを使っているか、使う予定と答えました。前の年の76%から増えています。

一方で、同じ調査ではAIの出力の正確さを「信頼していない」人が46%で、「信頼している」33%を上回りました。使う人は増えているが、そのまま信じる人は少ないというのが現状です。

AIコーディングツールの種類|動く場所で選ぶ

AIコーディングのツールは、どこで動くかで3種類に分けると選びやすくなります。代表例は、それぞれの代表的な使い方で分けたもので、今は各社ともエージェント的な機能を広げています。

種類動く場所代表例
補完型いつものエディタGitHub Copilot
AIエディタAI内蔵の専用エディタCursor
エージェント型ターミナル・アプリClaude Code
Codex

表のとおり、下に行くほど「エディタでコードを書く人」向けから「言葉で頼む人」向けに寄っていきます。コードを自分で書く習慣がない人ほど、エージェント型のほうが入りやすい面があります。

補完型|今のエディタに足す

補完型は、普段のエディタに機能として追加し、入力中に続きのコードを提案してもらう使い方です。自分で書くのが前提なので、すでにコードを書ける人の手間を減らす道具です。

当ブログでは、補完型のツールは実作業で検証していません。

AIエディタ|エディタごとAIに寄せる

AIエディタは、AIとの会話や複数ファイルの書き換えを前提に作られた専用のエディタです。画面でコードを見ながら、AIの変更を1つずつ取り込めます。

画面でコードを1行ずつ確かめたい人に向く形です。当ブログでは、AIエディタも実作業では検証していません。

エージェント型|言葉で頼んで最後まで任せる

エージェント型は、ターミナルやデスクトップアプリで動き、ファイルの作成・書き換え・実行・確認までAIが進めます。Claude Code、OpenAIのCodexなどがこの種類です。

Claude CodeはClaudeの無料プランでは使えず、有料プランかAPIの従量課金が必要です(2026年10月時点のclaude.comの料金ページ)。費用をかけずに試す方法は、別の記事でまとめています。

あわせて読みたい
Claude Codeは無料で使える?0円で試す方法と限界【2026年10月】 ※本記事にはプロモーション(アフィリエイト広告)を含みます。 Claude Codeを無料で使いたくて、こんなことで迷っていませんか? 無料プランのままClaude Codeを使えるの...

実例|運営者がAIコーディングで作ったもの

ここからは、当ブログの運営者が実際にClaude Codeに書かせて、今も動いているものを紹介します。数字は2026年10月15日に手元のファイルとサイトを数えたものです。

作ったもの中身規模
展開図・計算ツール職人向けの作図・計算34個を公開
アイキャッチ作成記事の画像を自動で作るPython 104行
サイトの点検全ページを巡回して確認Python 184行
図解の一括変換古い図をHTMLに作り直すPython 184行
毎朝の自動公開用意した記事を公開するシェル 69行

どれも、運営者がコードを書いたのではなく、やりたいことを言葉で伝えてAIに書かせたものです。小さな道具は、どれも70〜190行ほどの短いプログラムです。

展開図ラボ|職人向けの計算・作図ツール34個

いちばん大きいのは、Claude Codeで作った職人向けの展開図ツールのサイト(展開図ラボ)です。配管のエビ管やT管、ダクトの展開図、鋼材の重量計算など、トップページから34個のツールにつながっています。

多くのツールは、寸法を入れると図を描き、原寸で印刷できる形にしています。共通の部品が画面の図・原寸印刷・CAD用のデータを出す作りで、新しいツールは形のデータを渡すだけで済むようにしています。

ブログ運営の小さな道具

記事のアイキャッチは、方眼の背景・見出し・線画のイラストを組み合わせて自動で作るスクリプトで作っています。この記事の上の画像も、そのスクリプトの出力です。

サイトの点検スクリプトは、全ページを回ってリンク切れなどを探すものです。2026年9月25日の点検では、Macから上げた画像の日本語ファイル名の形が崩れて表示されていない問題が見つかり、2サイトで約1,000ファイルを直しました。

AIを使わない部分もAIに作らせた

毎朝の自動公開は、パソコンの予約実行で動く69行のシェルスクリプトで、動くときにAIを一切使わない作りです。用意済みの記事を公開するだけの処理に、毎回AIを呼ぶ必要はないからです。

AIコーディングで作るものは、AIが動き続けるものだけではありません。決まった処理はAIに一度書かせて、あとは普通のプログラムとして動かすほうが安く確実です。

AIコーディングの始め方|4つの手順

ここでは、当ブログの運営者が実際に進めてきた順番をもとに、始め方を4つの手順にまとめます。

AIコーディングの始め方

  1. STEP 1道具を1つ選ぶ迷ったら1つに絞る
  2. STEP 21文で頼む小さく作らせる
  3. STEP 3自分で動かす画面と数字で確認
  4. STEP 4ルールを残す同じ失敗を防ぐ
作らせる→確かめる→ルールに残す、をくり返すのが基本

手順1:道具を1つ選ぶ

最初は道具を1つに絞ります。コードを書く人なら補完型やAIエディタ、言葉で頼みたい人ならClaude CodeやCodexのようなエージェント型が入りやすいです。

当ブログの実作業はClaude Codeで、記事の投稿・ツール作り・点検まで回しています。Codex CLIも入れてみましたが、ログイン前の段階で止まっていて、実作業はまだ検証していません。

手順2:作りたいものを1文で頼む

最初の依頼は「入力した寸法から○○を計算して表示するページを作って」のように、1文で言える大きさにします。大きな仕組みを一度に頼むと、どこで間違えたか分からなくなります。

例えば「直径と高さを入れると、円錐の展開図の半径と角度を表示するページを作って」くらいの大きさです。結果を手計算と比べられるので、正しいかを自分で判断できます。

手順3:自分で動かして確かめる

AIの「できました」は、動作の確認になりません。必ず自分で画面を開き、数字や表示を確かめます。

当ブログでは、AIに「スマホで確認しました」と言わせても、iPhoneで崩れていたことがありました。Chrome系の検査だけでは見逃すため、今はiPhoneと同じ表示エンジンで撮った画像を目で見ています。

手順4:失敗をルールに書き残す

同じ失敗を2回させないために、気づいたことは手順書やメモに書き残し、次から読ませます。Claude Codeでは、Skillsや記憶(memory)の仕組みがこの役割をします。

当ブログの運営者の記憶ファイルは、2026年10月14日時点で199件ありました。書き残したルールが、毎日の作業の質を支えていると感じています。

あわせて読みたい
Claude Code skillsとは?SKILL.mdの作り方と使い分け ※本記事にはプロモーション(アフィリエイト広告)を含みます。 Claude Codeの「skills(スキル)」が気になって、こんなことで迷っていませんか? skillsとは何か、CLAUDE.m...

AIコーディングに向いている作業・向いていない作業

毎日使っていると、AIに任せて楽になる作業と、人が持っておくべき作業がはっきり分かれてきます。

人が持つ作業

  • 何を作るかを決める
  • パスワード・鍵の扱い
  • 公開前の最終確認
  • お金がからむ判断

AIに任せる作業

  • 決まった形のくり返し
  • 計算や変換の処理
  • 全ページの点検
  • 既存の部品の使い回し
運営者の実感による分け方。作る作業はAI、決める作業は人

AIコーディングが向いている作業

向いているのは、ルールがはっきりしていて、結果が正しいかを確かめやすい作業です。計算ツール、ファイルの一括変換、全ページの点検などがこれに当たります。

当ブログの図解の一括変換では、古い図を53本の記事・102枚分まとめて作り直し、文字が1つも抜けていないことまでスクリプトで検査しました。変換のあとに元の文字と突き合わせる検査まで、AIに書かせています。

AIコーディングが向いていない作業

向いていないのは、正解を人が決めるべき作業と、秘密の情報を扱う作業です。何を作るか、どこまで公開するかは、AIに決めさせるものではありません。

当ブログでは、記事を書く途中でAIに設定ファイルを読ませようとしたら、Claude Codeの自動判定に「認証情報の探索」として2回とも止められました。設定にはAPIキーなどが入ることがあるためで、この線引きは人の側でも守るべきだと感じています。

AIに作業を任せていて実際に失敗したこと

AIコーディングは便利ですが、任せ方を間違えると大きな手戻りになります。AIに作業を任せている当ブログで、実際に起きた失敗を3つ紹介します。

失敗1:設定を1つ間違えて全記事の説明文が消えた

検索結果の説明文の設定で、存在しない書き方を入れてしまい、全記事の説明文が空になったことがあります。すぐに戻しましたが、1か所の変更がサイト全体に効く設定は特に注意が必要です。

今は、記事ごとに説明文を個別に入れる形にしています。

失敗2:PCでは綺麗な図がスマホで読めなかった

AIに描かせた図(SVG)は、PCでは綺麗でも、スマホでは文字が小さすぎて読めませんでした。2026年10月7日に気づき、今は図をHTMLの部品で組んで、スマホでは自動で縦に並ぶようにしています。

それ以前に作った古い図は、順に作り直しています。

失敗3:内部リンクがカードにならず崩れていた

ブログ内の記事を紹介するカードを、URLだけの段落で書いていたため、カードにならずに崩れていました。WordPressの埋め込みのブロックで書き直して直しました。

今は、公開後のページにカードが正しく出ているかも、点検の項目に入れています。AIに書かせる作業ほど、公開後の画面での確認が欠かせません。

AIコーディングのよくある質問

最後に、AIコーディングについてよく調べられている疑問に答えます。当ブログで試していないことは、そのように書いています。

プログラミング未経験でもできる?

小さな道具なら、言葉で頼むだけで動くものは作れます。ただし、出来上がったものが正しいかを確かめる力は、使いながら身につける必要があります。

最初は、結果が合っているかを自分で判断できるもの(計算結果を手計算と比べられるものなど)から始めるのがおすすめです。

AIコーディングは無料でできる?

無料プランや無料枠のあるツールはありますが、Claude CodeはClaudeの無料プランでは使えません(2026年10月時点)。続けて使うなら、月額の有料プランかAPIの従量課金が必要になります。

費用の目安は、Claude Codeの料金とProとMaxの違いの記事で詳しく書いています。

AIが書いたコードは安全?

そのままでは安全とは言えません。先に紹介した調査でも、AIの出力の正確さを信頼していない開発者のほうが多い結果でした。

公開する前に、動作・表示・外に出る情報を人が確認しましょう。パスワードやAPIキーをコードに直接書かせないことも大切です。

どのツールから始めればいい?

エディタでコードを書く人は補完型かAIエディタ、言葉で頼みたい人はエージェント型が入りやすいです。当ブログで毎日使っているのはClaude Codeで、補完型とAIエディタは実作業で検証していません。

どれを選んでも、「小さく頼む・自分で確かめる・ルールに残す」の進め方は同じです。

まとめ|AIコーディングは「書く」より「確かめる」が仕事

AIコーディングとは、AIにコードを書かせ、人は指示と確認に回る開発のしかたです。補完・AIエディタ・エージェントの3種類があり、言葉で頼みたい人にはエージェント型が入りやすいです。

当ブログで毎日使って分かったのは、作る手間は大きく減ったが、確かめる手間は人に残るということです。そこを省かなければ、計算ツールやブログの自動化のような実用品まで作れます。

  • AIコーディング=AIが書き、人が指示して確かめる
  • 補完・AIエディタ・エージェントの3種類
  • 小さく頼む→自分で確かめる→ルールに残す
  • 決まった処理はAIに書かせて普通のプログラムで動かす
  • 秘密の情報と最終判断は人が持つ

AIで作ったツールやサイトを公開するなら、置き場所のサーバーを用意しておきましょう。当ブログはエックスサーバーを使っていますが、ConoHa WINGのように申し込みと同時にWordPressを入れられるサーバーなら、すぐに公開できます。

URLつけてくれたら引用フリーです。
  • URLをコピーしました!
目次