こんにちは、とまだです。

ChatGPTのサブスクリプション（Plus/Pro）を契約しているけど、チャット機能しか使ってないという方も多いのではないでしょうか？

そのサブスクで 追加料金なしで使えるAIコーディングツール「Codex」 はご存知でしょうか。

最近は AI でのコーディングといえばカーソルやClaude Codeが主流になりつつありますが、Googleトレンドを見るとCodexも特に日本で人気を集めています。

今回は、Codexの基本的な使い方から実際にWebサイトを作るまでを解説します。

忙しい人のために要約

ChatGPT Plus/Proユーザーなら 追加費用なし でCodexが使える
IDE版とCLI版の2種類があり、用途で使い分け可能
環境構築は5分、Webサイト作成は30分で完成
トークン制限は5時間ごとにリセットされる仕組み

動画版ではもっと詳しく、よく使う設定やコマンドまで解説してます！

Codexとは？

OpenAIが提供するAIコーディングエージェント「Codex」は、ChatGPTの技術を活用した開発支援ツールです。

CursorやClaude Codeと同じように、自然言語で指示を出すだけでコードを生成してくれます。

2つの使い方を理解しよう

Codexには大きく分けて2つの使い方があります。

IDE版（VS Code拡張機能）

普段使っているVS Codeから直接使える方法です。
サイドパネルにCodexが常駐し、エディタから離れることなくAIと対話できます。

対応エディタ：

VS Code
VS Code Insiders
Cursor
Windsurf

CLI版（ターミナル）

ターミナルからcodexコマンドで起動する方法です。
より柔軟な操作が可能で、プロジェクト全体を把握しながら開発を進められます。

Claude Codeを使ったことがある方なら、すぐに馴染めるはずです。

どちらから始めるか迷ったら、まずはIDE版から試してみることをおすすめします。
慣れてきたら、より高度な操作ができるCLI版にチャレンジしてみましょう。

5分で完了！環境構築ガイド

ChatGPTサブスクリプションの準備

まず、ChatGPTでPlusまたはProプランに登録します。
月額$20〜で、Codexだけでなく最新のGPT-5も使い放題になります。

ちなみに私は20ドルの Plus プランを使ってCodexを普段は使っていますが、これだけでも十分コーディングはできます。

IDE版のセットアップ

VS Codeを開いて、拡張機能マーケットプレイスで「Codex」を検索します。

OpenAI公式の青いバッジが付いているものをインストールしてください。

インストール後の流れ：

サイドバーのCodexアイコンをクリック
「Sign in with ChatGPT」でログイン
認証完了で準備OK

CLI版のセットアップ

Node.jsがインストールされていることを確認してから、以下のコマンドを実行します。

# Node.jsの確認
node -v
npm -v

# Codexをインストール
npm install -g @openai/codex

# 起動
codex

初回起動時にChatGPTアカウントでの認証が必要になります。

実践！3分でウェブサイトを作ってみよう

実際にCodexを使って、モダンなWebサイトを作成してみましょう。

IDE版で作る場合

新しいフォルダを作成してVS Codeで開きます。
Codexパネルを開いて、以下のような指示を入力してみてください。

モダンなUIのウェブサイトを作成してください
HTML、CSS、JavaScriptも使って動きのあるサイトにしてください

数分で、グラデーション背景やスムーズなアニメーション付きのウェブサイトが完成します。

CLI版で作る場合

プロジェクトフォルダで以下のコマンドを実行しましょう。

# プロジェクトフォルダで起動
codex

# プロジェクトを理解させる（AGENTS.mdを作成）
/init

# ランディングページを作成（プロンプト送信）
Codexのランディングページを作成してください。モダンなUIで動きのあるページにしてください

CLI版では、ファイルの生成過程が詳細に表示されるので、何が起きているかを理解しやすいです。

知っておきたい！重要な機能・コマンド

IDE版とCLI版でそれぞれできることは異なりますが、基本的にどちらでも便利な機能がありますので一部ご紹介しておきます。

IDE版の必須機能

機能	説明
モード切り替え	Agent/Chat/Full Accessから選択
新規チャット	鉛筆アイコンで新しい会話を開始
コンテキスト追加	＋ボタンでファイルを会話に含める

CLI版の必須コマンド

コマンド	機能
`/init`	プロジェクトを理解させる（AGENTS.md生成）
`/model`	AIの賢さレベルを調整
`/compact`	会話を要約してトークン節約
`/new`	新しい会話を開始
`/status`	使用状況を確認

他にもありますが、よく使うものでいうとこの辺りですね。

具体的な使い方は動画版で詳しく解説しています。

テクニック：AGENTS.mdでプロジェクトを理解させる

AGENTS.mdは、Codexにプロジェクトの情報を伝える指示書です。

Claude Codeにおける、CLAUDE.mdファイルに相当するものです。

このファイルを作成しておくと、Codexがプロジェクトの文脈を理解して、より適切なコードを生成してくれます。

よくあるトラブルと解決法

トークンの上限に達してしまった

/compactコマンドで会話を要約するか、5時間待ってリセットされるのを待ちます。
効率的に使うコツは、定期的に会話を整理することです。

例：

Windows環境でインストールできない

Node.jsの最新版をインストールし、管理者権限でコマンドプロンプトを実行してください。
それでも解決しない場合は、npmのキャッシュをクリアしてみましょう。

使用制限を理解して効率的に活用

Codexには以下の制限があります。

5時間ごとにリセットされる仕組み
一度に処理できるトークン数に上限あり
同時実行できるタスク数に制限

以下のコマンドを使ってトークン節約をしておきましょう。

定期的に/compactを実行
新しいタスクは/newで開始
モデルレベルを適切に調整（/model）

これらを意識することで、制限内で最大限の成果を出せます。

📺 Codex の使い方をもっと学びたい方へ

本記事では基本的な使い方を解説しましたが、Codex にはまだまだ多くの機能があります。

特にコマンドの使い方など、知っておくべき知識が多いので動画版もおすすめです！

動画で学べる内容：

実際の操作画面を見ながらの環境構築
エラーが出たときの具体的な対処法
IDE版とCLI版の使い分けのコツ
AGENTS.mdの高度な活用方法
トークンを節約するテクニック
実際にウェブサイトとランディングページを作る様子

チャンネル登録もお忘れなく！最新のAI開発ツールの情報を定期的にお届けしています。

また、参考になりましたら高評価で応援をよろしくお願い致します！