以前、Windows11のWSL2環境にClaude Codeを導入しました。
同じくAIコーディング支援ツールとして名前をよく聞くOpenAIの「Codex」も気になっていたので、今回は同じ環境にCodex CLIを導入してみます。
今回はお試しで無料のfreeプランを使用します。
ちなみに、Windows11にWSL2とUbuntuを導入する手順は以下を参照ください。
Codex CLIとは
Codex CLIはOpenAIが提供しているAIコーディング支援ツールです。
ターミナルから起動して、コードの作成や修正、ファイルの解析などを依頼できます。
Claude Codeと同じくCLIベースなので、使い方のイメージも近いです。
参考↓
Codex CLIをインストール
Codex CLI本体をインストールします。
npm i -g @openai/codex実行後、念のためバージョンを確認します。
codex --version
問題なくバージョン情報が表示されたので、インストールは成功しているようです。
初回起動
それではCodex CLIを起動してみます。
codex初回はログイン方法の選択が出てきます。
私は作成済みのアカウントがあるので、1.を選択しました。
無料のfreeプランを使用しています。
選択するとブラウザが起動し、認証を行います。
認証が完了するとターミナルに戻り、Codex CLIを利用できるようになりました。
実際に触ってみる
前回のClaude Codeの記事と同じように、簡易的なTODOアプリを作ってみます。
同じプロンプトを投げれば違いも分かりそうです。
仮でディレクトリを作成し、そこでCodex CLIを起動します。
mkdir test02cd test02codex実行したプロンプト
# TODOアプリを作成してください
HTML・CSS・JavaScriptのみを使用して、シンプルなTODOアプリを作成してください。
## 要件
### ファイル構成
```
todo-app/
├── index.html
├── style.css
├── script.js
└── README.md
```
### 動作
ブラウザで `index.html` を開くだけで動作するようにしてください。
追加の環境構築やライブラリのインストールは不要です。
---
## 機能
以下の機能を実装してください。
### TODO追加
- 入力欄を用意する
- 「追加」ボタンを押すとTODOを追加する
- Enterキーでも追加できる
---
### TODO一覧
一覧表示してください。
各TODOには
- チェックボックス
- タイトル
- 編集ボタン
- 削除ボタン
を表示してください。
---
### 完了
チェックを付けると
- 打ち消し線
- 色を薄くする
---
### 編集
編集ボタンを押すとタイトルを変更できます。
---
### 削除
削除ボタンを押すとTODOを削除してください。
---
### データ保存
ブラウザの localStorage を使用してください。
ページをリロードしてもTODOが残るようにしてください。
---
## 入力チェック
- 空文字は禁止
- 前後の空白は削除
- 最大100文字
エラー時は画面にメッセージを表示してください。
---
## デザイン
シンプルで見やすいデザインにしてください。
条件
- 白背景
- カード風
- 角丸
- 適度な余白
- レスポンシブ対応
---
## コード品質
- HTML・CSS・JavaScriptを分離する
- JavaScriptはES6以降で記述する
- コメントは必要最低限
- 可読性を重視する
---
## README
README.mdには
- アプリ概要
- 機能一覧
- 使い方
を記載してください。
---
## 出力
必要なファイルをすべて生成してください。
コードは省略せず、完成した状態で出力してください。生成されたindex.htmlを開くと、こちらもTODOアプリが出来ていました。（約1分30秒で完成）
同じプロンプトでも、見た目や実装の細かい部分は少し違いが出ました。
使ってみた感想ですが、Claude Codeにかなり近い操作感で操作できました。
まとめ
今回はWSL2上のUbuntu環境にCodex CLIを導入してみました。
インストール自体はコマンド1つで完了し、Claude Codeの導入と同様簡単でした。
しばらく両方を使ってみて、気づきがあれば記事にしていけたらと思います。
