使った道具

ChatGPTCodexCursorの違いを、初心者が実際の使い分けから解説

公開日 2026-06-17 / 更新日 2026-06-17 / 読了時間 6分

この記事で分かること
  • 3つの役割の違い
  • LP制作での使い分け
  • 初心者が最初に選ぶ順番

最初に結論

初心者の自分にとって、ChatGPTは考える場所、Codexは実際のファイルを直す場所、Cursorはコードを確認・編集する作業場所という位置づけでした。どれが一番すごいかではなく、作業の段階によって役割が違います。

背景

AI副業を始めた頃は、似た名前のツールが多く、何をどこで使うのか分かりませんでした。ChatGPTだけでWebサイトが完成すると思い込むと、ファイル管理や表示確認で止まります。逆に、いきなりコード編集ツールを開いても、何を作るかが決まっていなければ進みません。

実際に行ったこと

実店舗LPの制作では、まずChatGPTで店の魅力、ページ構成、見出し、掲載情報を整理しました。ChatGPTは文章化が得意で、何を伝えるべきかを考える段階で役に立ちました。店主へのヒアリング内容をもとに、強み、来店理由、メニューの見せ方を整理しました。

次にCodexを使い、実際のHTML、CSS、JavaScriptのファイルを確認しながら修正しました。単発のコードだけでなく、既存ファイルとの関係を見ながら変更できる点が重要でした。リンク、画像、スマホ表示、余白など、実装の細かい部分を詰める時に使いました。

Cursorは、コードを目で確認しながら作業する場所として使いました。ファイル構成を見たり、修正された内容を確認したり、必要に応じて自分でも編集するための作業台に近い感覚です。

制作工程

CodexとCursorで確認しながら修正した画面

Codexの作業結果とHTMLコードを表示したCursor画面
Codexの作業結果とHTMLコードを確認しながら、実際のファイルを修正している画面です。完成物ではなく、制作工程の証拠として掲載しています。

つまずいた点

初心者が混乱しやすいのは、ツールの役割を重ねて考えてしまうことです。ChatGPTに「全部作って」と頼むだけでは、実際のファイル反映や公開作業が残ります。Codexに任せる場合でも、何を直したいのか、どの状態が完成なのかを自分が説明できないと、方向がぼやけます。

また、料金や利用できる機能は変わる可能性があります。この記事では自分の使い分けを書いていますが、最新の料金、モデル、提供条件は必ず各サービスの公式情報で確認してください。

分かったこと

ChatGPTは「考える、整理する、文章化する」。Codexは「実際のファイルを確認し、コードを修正する」。Cursorは「コードを見ながら編集する」。この分け方にすると、初心者でも迷いにくくなりました。

AIに任せるほど、人間側の指示も重要になります。特にLP制作では、コードより先に、誰に何を伝えるかを決める必要がありました。道具を増やす前に、作業の順番を整理することが大切です。

初心者への結論

最初はChatGPTで考えを整理し、小さなHTMLページをCodexで直し、Cursorなどで確認する流れが始めやすいです。最初から全部の機能を覚える必要はありません。まず、1ページ作って公開するところまで進めると、必要な道具の意味が見えてきます。

関連記事

この記事を書いた人

SIMけん。専門家ではなく、実際に試した内容を初心者目線で記録しています。

記事内容の訂正窓口

仕様変更や誤りに気づいた場合は、お問い合わせページから連絡してください。