この記事では、Visual Studio Code (VS Code) のインストール方法から、OpenAI Codex拡張機能の導入までを、スクリーンショット付きでわかりやすく解説します。
AIエージェントを使った新しい開発スタイルを体験したい方におすすめのガイドです。
🛠 前提条件
- OpenAI アカウントを持っていること
- ネットワーク環境があること
💻 VS Codeのインストール手順
1. 公式サイトにアクセス
Visual Studio Code公式サイト にアクセスします。
2. インストーラをダウンロード
環境に応じてインストーラをダウンロードします。
例: macOSの場合は 「Download for macOS」 をクリック。
3. インストールを実行
ダウンロードしたファイルを開き、画面の指示に従ってインストールを進めます。
インストールが完了したら VS Code を起動してください。
🚀 導入手順
1. VS Codeを起動してセットアップ開始
VS Codeを起動すると「Get started with VS Code」が表示されます。
右下の 「Next Section」 をクリックして進みます。
2. 拡張機能の基本を学ぶ
「Learn the Fundamentals」が表示されます。
「Browse Popular Extensions」 をクリックして、拡張機能一覧を表示します。
3. 「Codex」を検索
拡張機能マーケットプレイスで 「codex」 と検索します。
表示された一覧から 「Codex – OpenAI's coding agent」 を選び、「Install」 をクリックします。
4. 信頼してインストール
「Do you trust the publisher "OpenAI"?」と表示されたら、
「Trust Publisher & Install」 をクリックします。
5. Codexタブを開く
左側のサイドバーにCodexアイコンが追加されます。
クリックして 「Sign in with ChatGPT」 を選びます。
6. 外部サイトに遷移
認証画面が表示されるので、「Open」 をクリックしてOpenAIの認証ページへ進みます。
7. 二段階認証(ワンタイムコード)
セキュリティ認証のため、ワンタイムコード入力画面が表示されます。
アプリで取得したコードを入力するか、「Try another method」 をクリックします。
8. メールで認証する場合
「Email」を選択すると、登録済みメールにワンタイムコードが届きます。
そのコードを入力してログインを完了します。
9. セットアップ完了
サインインが完了すると、CodexがIDE内で利用可能になります。
「Next」 をクリックして初期セットアップを進めましょう。
10. プロジェクトを開く(Open Folder)
Codex(やVS Codeの多くの拡張機能)は、作業フォルダ(ワークスペース)を開いている状態で本領を発揮します。
以下の手順で、コーディング対象のフォルダを開きます。
-
エクスプローラーを開く
左サイドバーの一番上にある ファイル(エクスプローラー)アイコン をクリックします。 -
「Open Folder」をクリック
エクスプローラー内の 「Open Folder」 ボタンを押します。
(既存のGitリポジトリを使う場合は、下の 「Clone Repository」 からURLを入力してクローンしてもOKです。) -
フォルダを選択する
表示されたダイアログで、プロジェクトのルートフォルダ(例:~/works/my-app
やC:\projects\my-app
)を選択して開きます。- 新規で始める場合は、空のフォルダを作成して選択すればOKです。
-
信頼確認(初回のみ)
初めて開くフォルダでは、Do you trust the authors of the files in this folder?
といった信頼確認ダイアログが出ます。
内容に問題がなければ 「Yes, I trust the authors」(Trust)を選択します。セキュリティ上の観点から、出所不明のコードは慎重に確認しましょう。
✅ まとめ
以上で、VS Codeへの Codex拡張機能導入 は完了です。
- OpenAIアカウントでの認証が必要
- 二段階認証(2FA)にも対応
- プロジェクトを開けば、すぐにAIを活用したコーディングが可能
これで、VS Code上で AIに支援してもらいながら効率的にコーディング ができるようになりました 🚀