2026/07/30

VS Code でエージェント型 AI と働く仕事環境 (IDE) の勧め ---- 還暦を過ぎた英語教師から非エンジニア系の大学生に送る

 

 

 

  

この記事で得られるもの:ウィンドウを行き来せずに、一つの画面で調べ物も執筆も AI との作業も完結する環境。

費用VS Code は無料です。AI の契約は有料ですが、無料の範囲だけでも始められます。

今日かかる時間15 分。

 


気が散らない仕事場

文章を書いていて、こんなことはないでしょうか。

調べ物をしようとブラウザーを開く。ついでに X/Twitter を見る。誰かのブログに飛ぶ。メールも確認しておこうと思う。——気がつくと、自分が何をやっていたのか分からなくなっている。あるいは、あるウィンドウで作った文章をコピーして別のウィンドウに貼り付け、また戻り、を延々と繰り返している。

私が皆さんに勧めたいのは、この行ったり来たりを無くす環境です。左にフォルダー構造、真ん中に自分の書いている文章、右に AI。この三つが一つの画面に並んでいて、その画面から出る必要がありません。

私は初めてこの環境を使ったとき、午前中ずっと集中して仕事ができました。この集中度には自分でも驚きました。

先に一つ言っておきます。私はプログラミングをしません。これから紹介する VS Code はエンジニアが使う道具ですが、このアプリで書くことにコードの知識は一切要りません。VS Code を「文章を書き、考えるための、とても出来のよい場所」として使う話です。

 


エージェント型 AI とは何か

「エージェント型 AI」という言葉を当たり前のように使いますが、これまでのチャット型 AI との違いがはっきりしない方もいるでしょう。

私がよく使う喩えで言えば、こうです。歩いていた人間にとって、パソコンの登場は自転車を手に入れたようなものでした。そこにチャット型 AI が加わり、原付二輪車になりました。ずいぶんパワーアップしたわけです。そして 2026 年ごろから世界的に普及したエージェント型 AI は、車です。原付とは比べものになりません。

人間関係でたとえるなら、チャット型 AI は会社の先輩です。わからないことを聞けば、ある程度のことは教えてくれます。しかし実際に作業をするのは皆さん自身です。

エージェント型 AI は皆さんの部下、あるいは外部の業者です。ですから皆さんの主な役割は、明確な指示を出すことになります。チャット型 AI が一問一答だったのに対し、エージェント型 AI で皆さんが行うのは依頼、あるいは発注です。そして AI が最終的に返してくるのは納品、つまり仕事の完成品です。

その途中で交わす会話を、一つの画面の中で行えるようにする——それが以下で述べる環境です。

代表的なものを挙げておくと、Claude なら Claude Cowork Claude CodeChatGPT なら ChatGPT Work Codex があります。前者二つが軽自動車、後者二つが普通乗用車といったところでしょうか。この記事で扱うのは後者、Claude Code Codex です。

 


VS Code を勧める理由

VS Code(無料)を勧める理由は三つあります。

https://code.visualstudio.com/

第一に、Markdown を扱うのに非常に便利だからです。 Markdown は、いくつかの記号を使っただけのとても簡単なメモ形式で、AI と人間の共通メディアと言ってよいものです。ただ、ふつうのテキストファイルに書くと記号が並ぶだけで見にくく、かといって Word を使うほどのものでもありません。VS Code なら Markdown の記号が色付きで表示され、構造が一目で分かります。ファイル自体も非常に軽いので、ハードディスクの負担になりません。

第二に、使い方が世界中で確立しているからです。 初めて見ると画面がたくさんに分割されていて驚くかもしれませんが、分からないことは検索すればほぼ必ず答えが見つかります。

第三に、無料だからです。 Microsoft 社が提供しているので、信頼性の点でも安心できます。

 


費用と、無料でできること

VS Code そのものは無料ですが、Claude Code Codex を使うには各社との契約(有料・月額20米ドル程度)が必要です。

ですから、順番を分けて考えてください。


無料でできることVS Code を入れ、Markdown で文章を書き、フォルダー構造を整え、後で述べる `_WorkLog.md` の習慣をつける。ここまでで、集中できる仕事場は手に入ります。

有料が必要なことAI の拡張機能を右側の枠で動かすこと。


先に無料の部分だけを一週間使ってみて、「この画面で仕事をするのは快適だ」と思えたときに、初めて契約を考えれば十分です。私自身、あれもこれもと AI にお金を使うのではなく、いま持っている契約でできることを掘り下げる方針を取っています。とはいえ、ClaudeChatGPTの有料契約は、未来への投資と考えれば私は十分に価値があると思っています。

 


VS Code の画面構成


VS Code の画面構成

〈図1VS Code の画面構成。左に EXPLORER、中央にエディター、右に AI、中央下は `_WorkLog.md`


最初は簡単に考えておけば結構です。


一番上:「File」「Edit」などのメニュー。どのアプリにも共通ですから説明は要らないでしょう。

左端:フォルダー構造。なぜここにフォルダーが、と最初は思うかもしれません。しかし AI と作業をしていくと、いま扱っているファイルがどのフォルダーにあるのかという情報が決定的に大切だと分かってきます。消すこともできますが、まずはそのままに。

中央:エディター。文章をどんどん書いていくところです。

AI。拡張機能を入れると、ここに AI が現れます。

:ターミナル。コンピューターの最も深い部分から操作するところです。しばらく使わないと思います。私はこの領域をターミナルとしてではなく、作業用ファイルを開く場所として使っています(後述)。


要は、左にファイル構造、真ん中にエディター、右に AI。これだけ覚えておけば十分です。

 

わからないことの調べ方

画面に圧倒されて手が止まったら、Google app for desktop を起動し、「画面を共有」を指定してください。VS Code の画面がそのまま共有されますから、「これこれをしたいのですが、どうしたらいいですか」と聞けば、すぐに教えてもらえます。設定の質問も、機能の質問も、これで大半は片づきます。

なお Google app for desktop Windows 用のアプリです。

https://search.google/google-app/desktop/

Mac では名称が変わり、Gemini アプリになります。

https://gemini.google/mac

画面共有ができる点は同じですので、以下「Google app for desktop」とあるところは、Mac の方は「Gemini アプリ」と読み替えてください。

覚えておくと便利なのが、command palette です。Ctrl + Shift + P、あるいは F1 キーで開きます。VS Code の機能はほぼここから呼び出せますから、いろいろ試してみるとよいでしょう。

設定の際に JSON と呼ばれるコードの記入を求められることがありますが、心配は要りません。「これこれをしたいので JSON コードを書いてくれ」と頼めば書いてもらえます。それを指定された場所に貼り付けるだけです。

とはいえ、たくさんの機能が必要なわけではありません。最初に整えるとよいのは、Markdown の記号が色付きで表示されるようにすること、Markdown ファイルとしてすぐ保存できるようにしておくこと、フォントの大きさを決めること、この三つくらいでしょう。dark mode light mode は好みで、いつでも切り替えられます。

一点だけ提案があります。VS Code の操作画面は日本語に変換できますが、英語のままにしておくことをお勧めします。コンピューターや AI の用語は英語が主流ですから、早いうちに慣れておく方が得です。

 


拡張機能——Claude Code Codex の導入

中央のエディターだけで文章を書くことに慣れてきたら、左端のアイコンから「拡張機能」を開きます。ここから Claude Code CodexChatGPT を出している OpenAI 社のエージェント型 AI)を導入できます。必ず Anthropic 社と OpenAI 社が提供している公式の拡張機能を選んでください。それぞれ一つずつダウンロードして登録すれば、契約を持っている限りただちに使えます。これで AI 入りの統合開発環境、IDEIntegrated Development Environment)の出来上がりです。

ここで一つだけ、先に守っておいてほしいことがあります。 エージェント型 AI は皆さんのパソコンの中のファイルを実際に読み書きします。ですから、最初は空のフォルダーを一つ作り、その中だけで試してください。卒業論文の唯一のコピーが入っているフォルダーを、いきなり AI に開かせてはいけません。AI が間違った作業をしたとき、既存のファイルを壊してしまうことがありえます。触らせる範囲をどう決めるかは、後の節で詳しく述べます。

もう一点。Dropbox などのクラウド同期フォルダーの中で AI に作業させると、同期の衝突という別種の問題が起こります。慣れるまでは、同期されないローカルのフォルダーで試すのが安全です。

 


エディターと AI の直結

フォルダー構造でファイルを適切に指定すれば、中央のエディターに書かれていることを右側の AI がそのまま参照できます(以下は Claude Code を中心に説明します)。

たとえば文章を書いていて、調べたいことが出てきたとします。右側の AI に検索や調査をさせ、結果を出力欄に出させる。それをコピーしてもいいですし、指示の仕方によっては、AI の出力を直接エディターに書かせることもできます。

さらに便利なのが、選択範囲の受け渡しです。中央で書いている文章をカーソルで選択すると、Claude Code 側に「一部が選択されている」という表示が出ます。その状態で AI の入力欄に例えば "reply" とだけ入力すれば、AI は反転表示された部分をそのまま読んで実行します。コピー&ペーストすら要りません(残念ながら、現在の Codex 拡張機能にこの機能はありません)。

この右側の AI はウェブ検索もできますし、皆さんのローカルファイル、つまりパソコンの中のファイルも読めます。Word で書きながらブラウザーとエクスプローラーを行き来していた頃とは、作業環境の強さがまったく違います。

 


チャット言語とファイル言語

AI とやりとりする言語を「チャット言語」、AI が作るファイルや皆さんが AI に読ませるファイルの言語を「ファイル言語」と呼んで区別すると便利です。

チャット言語を英語にすると、AI の返答の表現を使って返事をすることになりますから、単語も表現も英語の発想法も自然に身についていきます。強くお勧めします。

その上で注意が必要なのは、チャット言語が英語でも、ファイル言語は日本語である場合があることです。この区別を明示しておかないと、AI が勘違いしてチャット言語のままファイルを出力してしまいます。

 


@ によるファイル指定

IDE AI とやりとりするとき便利なのが、アットマーク(@)です。@ を付ければ、AI は指定されたファイルやフォルダーを読み取ります。

ですから @ 付きのファイル名を並べて「このファイルとこのファイルとこのファイルを比較した上で出力してください」と言えば、複数のファイルを自動的に読んで仕事をしてくれます。AI の入力欄で @ の後に文字を打ち始めると候補が表示されるので、名前を正確に覚えている必要もありません。

文脈が十分に共有されていれば、「さきほどあなたが作ったファイル」といった日常的な言い方でも通じることがあります。ただし、やりすぎは禁物です。明確な指示を基本にしてください。これは人間同士のコミュニケーションでも同じことです。

 


ファイル名と半角・全角

ファイル名やフォルダー名は、できるだけ英語で、半角で、空白を入れずに付けることをお勧めします。

名前に空白を入れないのは古くからのコンピューター業界の流儀です。Word のような一般ユーザー向けアプリでは空白が許容されるようになりましたが、AI に扱わせる場合は、いまも空白なしが求められる場面が多くあります。

半角の徹底は Markdown 記号でも同じです。たとえばシャープ記号(#)のすぐ後ろに文字をくっつけて書くと、見出しとして認識されません。全角の記号で Markdown 記号を打った場合も同様で、色がハイライトされません。日本語では半角と全角を使い分けなくてはならず、ここが実に面倒なところです。

切り替えはキーボード左上の半角/全角キーで行いますが、これが押しにくい。Windows パソコンで右手と左手の親指だけで切り替える方法を書きましたので、よければ読んでみてください。(Mac の方は「英数」「かな」キーがすでに親指の位置にありますので、この工夫は要りません。)

 https://x.com/yosukeyanase/status/2080237994301345936?s=20

 


`_WorkLog.md` ——プロンプトの下書き場

ここは、私がとても便利に思っている習慣です。

私は AI への入力(プロンプト)が長くなりそうなときは、まず `_WorkLog.md` というファイルに下書きします。中央のエディターを上下に分割し、上を書いている文書ファイル、下をこの `_WorkLog.md` にするのです。


表記についての補足:「`」(バッククォート)で囲むのは、ファイルやフォルダーの名前をそのままの形で正確に示すための記号です。またファイル名の先頭に「_」を付けるのは、そのファイルをフォルダーの一番上に表示させるための工夫です。


下書き用のファイルを別に持つ理由は三つあります。


AI のチャット入力窓は小さすぎる。書いた文章を読み返すことが難しく、落ち着いて考えられません。

誤送信が起きる。日本語で書いていると、変換候補を確定したつもりで Enter を押してしまい、未完成のプロンプトが飛んでいきます。`_WorkLog.md` ならその心配がありません。

AI の長い出力を見ながら書ける。右側の出力欄の該当箇所を見ながら、下のエディターで自分の文章を組み立てられます。入出力欄だけでやりとりしていると、AI の回答と自分の入力欄の間を何度も往復することになり、これが地味に効きます。


つまりこのファイルは、思考をゆっくり進めるための場所です。ターミナルを使わない私たち非エンジニアにとって、画面下の領域の実用的な使い道でもあります。

画面の分割方法:エディター部分の上にある「画面が二つに分かれたアイコン」を押すと左右に分かれます。上下に分けたい場合は、Alt を押しながら同じアイコンを押してください。`_WorkLog.md` は下でも横でも、好きな方で構いません。

 


AI に触らせる範囲と、フォルダー構成

エージェント型 AI を自分のパソコンで使うなら、どこまでを AI に触らせ、どこから先は触らせないかを決めておく必要があります。決めていないと、AI が誤作動したときに既存のファイルを壊しかねません。

そしてこれは、単なる安全対策ではありません。フォルダー構造を考えることは、自分の仕事をどう分析するかということです。自分の仕事は大きく分けるといくつになるのか。その一つ一つは、さらに細分化するとどうなるのか。そういう問いです。

私はエージェント型 AI を使うまで、`研究``教育``行政``生活` の四つを主なフォルダーとしていました。エージェント型 AI を使い始めてからは、AI にファイルを作成・編集させてよい領域を上記の4つのフォルダーと並行して設置した `AIWorkspace` というフォルダーにまとめています。Claude Code のワークスペース (`ClaudeWorkspace`) の中には `MySecondBrain` を入れていますが、これについては別の記事に書きました。

https://yanase-yosuke.blogspot.com/2026/06/claude-cowork-obsidian.html

 


ScratchpadTemporaryProject——三種類の作業場

私のワークスペース(`ClaudeWorkspace`, `CodexWorkspace`)には、主に三種類のフォルダーがあります。前提として、私は `AIWorkspace` 全体をAI専用の作業場と考えています。仕事が完成したら、成果物は必ず AI 領域の外、つまり研究・教育・行政・生活のどこかに移します。


`Scratchpad`10 分か 30 分で終わる臨時の作業をする場所。

`TemporaryFolder``ClaudeTemp01`, `ClaudeTemp02`,  `CodexTemp01`, `CodexTemp02`など):数日で終わる仕事の場所。会社で言えば会議室 1、会議室 2 でしょうか。会議室はどの部門でも予約すれば使えますが、終わったらすぐ空けなくてはなりません。ですから仕事が終わったら、完成品は所定のフォルダーへ移し、不要なファイルは処分して、きれいに空にします。

プロジェクトフォルダー`ClaudeProjects`, `CodexProjects`):数週間から数か月かかる仕事の場所。その下にサブフォルダーを作り、たとえば `2026-08-22-OkayamaPresentation` のような名前で関連ファイルを貯めていきます。会議室ではなく、営業部や経理部のように特定の部署がずっと使い続ける部屋にあたります。


この三つの区別があるだけで、ファイルが散らかりません。

 


おわりに——最初の一歩

長々と書きましたが、やることは段階に分けられます。


今日(15 分)

VS Code をインストールする。フォルダーを一つ開く。`_WorkLog.md` という名前のファイルを作って、一行書いてみる。今日はこれで終わりです。

今週

何らかの文章の下書きを、その VS Code の中で書いてみる。Markdown の記号(`#` `-` の二つで十分です)を使ってみる。分からないことは Google app for desktop に画面を共有して聞く。

慣れてきたら

拡張機能から Claude Code Codex を入れる。まず空のフォルダーで試す。エディターを上下に分けて `_WorkLog.md` を持つ。


ここまで読んで分かってきたかもしれませんが、AI を使うことは単なるテクニックではありません。自分の仕事をどう分析するか、自分の頭脳と集中力をどうマネジメントするかという問題です。フォルダー構造を考えることも、プロンプトを下書きすることも、突きつめればそこに行き着きます。

そして最後にもう一度だけ。できれば AI とのチャット言語を英語にしてください。AI の用語はほとんどが英語ですから、AI を英語で使えば、英語と AI を掛け算で上達させることができます。皆さんの将来の可能性が大きく広がります。

集中して仕事をし、終わったら休むなり遊ぶなり、豊かな時間を過ごしてください。そのための環境です。

 

〈補足〉VS Code とよく似た構造を持つ Cursor という IDE が、現在たいへん人気を得ています。私も導入を検討しないわけではありませんが、まずは手元の Claude Code Codex を載せた VS Code でできるだけのことをやろうと考えています。私も少しずつ、仕事のやり方を学んでいるところです。

 

追記:この文書は、別ファイルで説明したHAHA原則に基づいてAIを利用し、最終的に私自身が判断して作成したものです。

VS Code でエージェント型 AI と働く仕事環境 (IDE) の勧め ---- 還暦を過ぎた英語教師から非エンジニア系の大学生に送る

          この記事で得られるもの :ウィンドウを行き来せずに、一つの画面で調べ物も執筆も AI との作業も完結する環境。 費用 : VS Code は無料です。 AI の契約は有料ですが、無料の範囲だけでも始められます。 ...