DF 勉強会

勉強会

2026年6月16日

CONTENTS

今日の流れ

第1章
AIコーディングエージェント
① AIコーディングエージェントとは ② 準備(セキュリティ) ③ 使いこなすための便利機能
第2章
WordPress 最新トピック
― 最新アップデートをざっくり押さえたい
DF
2
第1章 — AIコーディングエージェント

① AIコーディングエージェントとは

DF
3

① AIコーディングエージェントとは

AIコーディングエージェントとは?

人の指示を受けて、コードを
「考えて → 書いて → 実行する」までを
自分で進めるAI = 自律的に作業してくれる“代理人(エージェント)”

💬 ふつうの言葉で指示

専門知識がなくても、自然言語で「〜して」と頼むだけ。

🙌 作業まで“やる”

相談に答えるだけでなく、ファイル操作・実行まで自分で行う。

🤖 自律的に動く

手順を一つずつ指示しなくても、目的に向けて進めてくれる。

DF
4

OVERVIEW

代表的なCLI型AIコーディングエージェント

普通のAI(チャット)
CLI型エージェント
ClaudeAnthropic
Claude Codeターミナルで自律実行
ChatGPTOpenAI
Codex CLIコマンドラインで実行
GeminiGoogle
Gemini CLI / JulesCLI操作・非同期で自動化
Claude Code 等は VSCode拡張やさまざまな機能もあり、IDE型・リモート型としても使える(型は重なり合う)
DF
3

① AIコーディングエージェントとは

AIコーディングエージェントの種類

用途や“動く場所”で、大きく4タイプに分けられる。

🧩 IDE統合型

Cursor や VS Code など、コードを書くエディタ上でチャット形式でやりとりできる。

AI例Cursor / Windsurf / GitHub Copilot(チャット) / Cline
使用例「このコンポーネントをリファクタして」→ 該当ファイルを直接編集
特徴全体を把握しながら作業。初心者でも視覚的に使いやすい

💡 コード補完型

タイピング中にAIが続きを予測・提案する(一番軽量)。

AI例GitHub Copilot(補完) / Tabnine / Amazon Q Developer
使用例関数名を書くと中身を灰色で提案 → Tabキーで確定
特徴作業フローを邪魔せず、補助的に効率を上げる

🖥️ CLI型 今日の主役

ターミナル上でAIエージェントに作業を任せる。

AI例Claude Code / Codex CLI / Gemini CLI / Aider
使用例「この仕様でファイル一式作って」→ 生成・編集・実行まで自律
特徴自律性・自由度が高く、まとめて委任できる(中〜上級者向け)

☁️ リモート型

クラウド上でAIが非同期に作業し、結果(PRなど)を返す。

AI例Devin / GitHub Copilot Workspace / Claude Code(クラウド) / Google Jules
使用例Issueを割り当てる → 裏で実装し Pull Request を作成
特徴手元PCを占有せず、複数タスクを並行で任せられる
DF
5

CHAT AI

通常のクロード(チャットAI)
= 脳みそ だけ

  • 基本は「考える・提案する」のが役割
  • 自分でファイルを作る・実行する「手」は持たない
  • イメージは「優秀な相談相手 = 脳みそ」
🧠
脳みそ
考える・提案する
できるのは“考えること”だけ
DF
4
?ここで疑問

「脳みそだけ」のチャットAI。
では ―― AIコーディングエージェントは何が違う

カギは「手(実行する力)」を持つこと
DF
5

CODING AI

AIコーディングエージェント
= 脳みそ + 両手フル稼働

  • 人の指示を受け、「考えて → 書いて → 実行する」まで自分で進める
  • “書いて・実行”できるのは、ファイル操作・コマンド操作ができるから
  • 通常のクロードとの違いは、この「手」を持つこと
🧠
脳みそ
考える
🙌
両手
ファイル操作・コマンド操作
自由度がまるで違う
だから ―― 「考えて → 書いて → 実行する」までを自分で進めるAI
DF
6
?素朴な疑問

そもそも「手を動かす」って、
具体的に何をしてる?

その正体は「ターミナル・コマンド操作」
DF
7

COMMAND

“色々できる”理由のひとつ
― それが「コマンド操作」

  • 色々できるのは複数の理由がある。その大きな柱のひとつが「コマンド操作」
  • コマンド操作=ターミナルに文字で「命令」を打つこと
  • マウスのクリックではなく、文字でPCに直接指示する

“色々できる”を支える理由(例)

⌨️ コマンド操作 ← 今回はここを掘り下げる
📄 ファイルの直接操作
🧰 ルールや道具で賢く動く(後述)
DF
8

COMMAND

コマンド操作を見てみる

  • 文字を打ち込んでPCに指示する
  • マウスのクリックの代わりに「コマンド」を入力
  • 移動・一覧・編集・実行…なんでもできる
~/project $ cd blog # 移動(チェンジディレクトリ)
~/blog $ ls # ファイル一覧を表示
index.html style.css script.js posts/
~/blog $ code style.css # ファイルを開いて編集
~/blog $
この「打ち込んで指示する」操作こそ、クロードコードができること
DF
10

COMMAND

「コマンド操作」とは?

ターミナルに“命令(コマンド)”を打ち込むこと。代表的な基本コマンドはこちら。

cd
移動(Change Directory)
フォルダ(場所)を移動する
ls
一覧(List)
その場所のファイルを表示する
cat
中身を表示
ファイルの内容を見る
mkdir
作成(Make Directory)
新しいフォルダを作る
cp / mv
コピー / 移動
ファイルを複製・移動する
rm
削除(Remove)
ファイルを消す
打つコマンドを変えるだけで、移動・表示・作成・削除…と何でもできる
DF
9

COMMAND

「コマンド操作」ってなに?

実は元々、パソコンは文字(コマンド)で操作するのが当たり前でした。

〜1980年代
⌨️
CUI(コマンド)
文字を打ち込んで操作。これが“最初”の使い方。
(例:MS-DOS, 1981)
1984年〜
🖱️
GUI(画面操作)
マウス・アイコン・ウィンドウ。誰でも直感的に。
(例:Mac 1984 / Windows)
いま
🤖
コマンドは現役
GUIが主流でも消えていない。直接的でパワフルな操作として活躍。
GUIは“みんなが使えるように”後から生まれた。AIコーディングエージェントは、原点の「コマンド」も扱える。

※ GUIのアイデア自体は1960〜70年代に研究所(Xerox Altoなど)で誕生。広く普及したのはMac・Windows以降。

DF
11
第1章 — AIコーディングエージェント

② 準備(セキュリティ)

「色々できそう」とわかった。では ―― どんな“準備”と“使い方”がいる?
まずは安全に使うための準備(リスクと対策)から。
DF
12

SECURITY — リスク

コマンド操作できる
パソコン全体に触れるということ

  • ファイルの作成・編集・削除・外部通信まで何でもできる
  • もしウイルスや悪意あるコードが紛れ込んだら、被害も大きくなりうる
  • 「できることが増える」=「リスクも上がる」
⚠️
パソコン全体に届く力
便利さの裏返し
!コーディングエディタで“できること”が増えた分、リスクも高まった
DF
13
!では

強力で、便利。でもリスクもある。
では、どう守る?

「安全な箱」の中で動かす
DF
14

CONTAINER — 対策

対策:コンテナ環境で動かす

  • 自分のPCの中に、もう1台別のPCがあるイメージ
  • その中に独立したフォルダ構造(作業用の箱)を用意
  • 中で何が起きても、外側(本体PC)には影響しない
💻 PC(あなたのパソコン)
📁書類
📁ダウンロード
📁プロジェクトA
📁claude-code ›
📁
📦 コンテナ
📁examples
📁plugins
📁scripts
📄README.md
📄CLAUDE.md
■ 赤枠=PC全体■ 青枠=コンテナ(1つの箱)
DF
15

② 準備(セキュリティ)

なぜ“安全度が高い”の?

コンテナ=“使い捨ての別PC”。その箱の中だけでコマンドを動かすから、安全度が上がる。

🧱 本体PCと切り離す

万一ウイルスや危険なコードが動いても、本体のファイル・写真・パスワードには届かない。

♻️ 壊れても捨てるだけ

おかしくなったら、コンテナを削除して作り直せばリセット完了。被害が残らない。

🌐 通信も絞れる(ファイアウォール)
📦 コンテナ 🧱 ファイアウォール ✅ 許可した通信先だけ通す🚫 それ以外はブロック
!ただし完全に安全ではない。あくまで「リスクのハードルを上げる」もの ―― 信頼できるリポジトリでだけ使う/本体の鍵(~/.ssh など)は持ち込まない
DF
16

② 準備(セキュリティ)

実際の入れ方

自分で覚えなくてOK。下のプロンプトをチャットAIに貼って、聞きながら進める。

💬 チャットAIに貼り付け(コピペでOK)
以下のURLを読んで、Claude Code の DevContainer 環境を構築する手順を教えてください。
https://code.claude.com/docs/en/devcontainer

・初心者です
・「Try the reference container」(リポジトリをクローンして使う方法)で進めたい
・コマンドもGUI操作も省略せず、順番に教えてください
・まず私のOS(Mac / Windows)を聞いてください
📘
公式ガイド
code.claude.com/docs/en/devcontainer
🐙
GitHub(リファレンス)
github.com/anthropics/claude-code
OSを聞かせると、手順がブレない
DF
17

② 準備(セキュリティ)

さらに安全に ― 追加の対策

コンテナに加えて、できる対策はまだある。

🛡 security-guidance(公式プラグイン・無料)

2026年5月、Anthropic公開。コードを書いている最中に脆弱性や危険な実装をリアルタイム検出し、同じセッション内で修正を促す。

SQLインジェクション秘密情報の直書きXSS…約25パターン

📄 CLAUDE.md に「禁止コマンド」を明記

「使ってはいけないコマンド」を書いておき、AIに避けさせる。

rm -rf本番への push外部送信 系

※ 確実に止めたいなら、設定(permissions)やフックでブロックするのが確実。

「箱で隔離(コンテナ)」+「書く時にチェック(プラグイン)」+「禁止を明記」で多層に守る
DF
18
第1章 — AIコーディングエージェント

③ 使いこなすための便利機能

覚えておくと便利な機能たち
DF
16

道具① — CLAUDE.md

CLAUDE.md(プロジェクトごとのルールブック)

開く作業ディレクトリで、読み込まれるCLAUDE.mdが決まる(上の階層も重なって適用)。

💻 CLAUDE.md の置き場所
🏠~/.claude/
📄CLAUDE.md① ユーザー設定
📁project/
📄CLAUDE.md② プロジェクト
📁apps/
📁web/
📁src/
📄CLAUDE.md③ サブディレクトリ

優先度の決まり(強い順)

★ 組織の管理ポリシー常に読む
③ サブディレクトリその場所を触ったら
② プロジェクト/親あれば(起動時)
① ユーザー設定常に読む

※ 並びは「強い順」。競合したら作業場所に近い方が優先。

開く場所でルールが決まる → クライアント別・作業別など「ディレクトリの作り方」も大事
正しいパスは ~/.claude/CLAUDE.md(先頭ドット・大文字)。Claude.ai の「記憶」は別の仕組み
DF
17

道具② — Sub Agent

サブエージェント

専門担当に分担して並行で作業。自分でカスタムして「専門エージェント」も作れる。

🧠
司令塔(本体)
🔍
調査担当
⚙️
実装担当
検証担当
カスタム例(自分で作れる)
🛍 futureshop テンプレートタグ専門
📊 BigQuery SQL レビュー専門
🏷 HTMLセマンティック化チェック専門(6項目)
DF
18

道具③ — Skill

スキル(作業マニュアル集)

  • 決まった手順をまとめたマニュアル
  • 毎回のやり方を安定させる
  • 「この作業はこの手順で」をAIに渡せる

📖 スキルの中身(例)

STEP 1 入力を確認する
STEP 2 ルールに沿って処理する
STEP 3 結果を検証して出力する
💬
作り方:一通りAIと作業したあと、「スキルクリエイターで、この作業をスキル化して」と頼むだけ
DF
19

CHAPTER 1 — SUMMARY

第1章 まとめ

  • AIコーディングエージェントは「脳みそ+両手」── 自分で作業まで完結できる
  • 強力ゆえにリスクもあるから、コンテナ(安全な箱)の中で動かす
  • CLAUDE.md・サブエージェント・スキルが、賢い動きを支える道具
DF
23
第2章

WordPress 最新トピック

2026年6月時点
DF
24

第2章 — WordPress 最新トピック

WordPress 7.0「Armstrong」リリース

メジャーアップデートで、AI連携がコアに組み込まれた
WordPress製のAIではなく、どのAIでも等しくWordPressを扱える“共通の土台”ができた。 2026年5月20日 リリース(メジャーアップデート)

🧩 Abilities API

「記事を書く・公開する」などサイトの機能をAIが実行できるようにした仕組み。

6.9 から使える

📡 MCP アダプター

その機能を外部AI(Claude Desktop等)から呼べる形で公開する。

公式ライブラリ

🔌 WP AI Client

サイト側からどのAIにも同じ書き方で命令できる“仲介役”。

7.0 から使える
DF
25

ありがとうございました

ご質問・ご意見を、お待ちしています。

27
クリック(左=前 / 右=次) または  Space で移動