---
title: "Claude Code Mods とは何か、そしてどのように動作するか #ClaudeCode #Tutorial"
url: "https://claudemods.dev/ja/builds/what-are-claude-code-mods-and-how-do-they-work-claudecode-tu-2d0f79"
source: "https://www.youtube.com/watch?v=ORSNig1cdsg"
source_type: "resource"
author: "DIY Smart Code"
author_handle: "DIY Smart Code"
stars: 0
category: "ワークフロー・CI"
categories: ["workflow"]
tags: ["cli", "hooks", "mods", "plugins", "tutorial"]
permission_level: null
scan_complete: false
added: "2026-10-15T02:06:17.471Z"
updated: "2026-10-13T10:00:39.000Z"
locale: "ja"
content_locale: "ja"
---

# Claude Code Mods とは何か、そしてどのように動作するか #ClaudeCode #Tutorial

Claude Code mods とは何か、/plugin でのインストールと無効化、claude plugin validate での検証、Claude での作成、claude plugin test でのオフラインテストを扱う 3 分間のハンズオンチュートリアル。

## Description

バージョン 2.1.296 での Claude Code mods のハンズオンウォークスルー：5 時間、7 日間、コンテキスト使用量を表示し、80% でポップアップ、97% でサウンドを鳴らす使用量メーター mod。mod は JS/TS イベントハンドラーを備えたプラグインであり、hooks/hooks.json の modules キーで区別され、mod だけがインターフェースに描画できることを説明します。/plugin install でのインストール、Space での無効化、クリーンなセッションのための --safe-mode、claude plugin validate での mod のチェック（$.process.run のような呼び出しに注意）、プラグイン作成スキルを使って Claude に mod を ~/.claude/dev-mods/ に書かせ、ホットリロードを可能にすること、サインインやネットワークなしで claude plugin test をオフラインで実行することを扱います。

## Original README

What Are Claude Code Mods and How Do They Work #ClaudeCode #Tutorial

Claude Code mods, hands-on: the four mods running on my own Claude Code, how to install one and switch it off, how to check a mod with claude plugin validate before you install it, and how to have Claude write one for you. A mod is a plugin with code that Claude Code runs inside itself, so it can draw in the interface where a settings hook can't.
----
Higgsfield AI — Create AI Videos & Visuals
Get 10% OFF here: https://higgsfield.ai?fpr=thomas-dccf7e

🚀 DYNAMOUS AI COMMUNITY

Want to learn agentic coding with live daily events and workshops?
Check out Dynamous AI: https://dynamous.ai/?code=646a60
Get 10% off here 👉 https://shorturl.smartcode.diy/dynamous_ai_10_percent_discount

⚡ HOSTINGER — RELIABLE HOSTING FOR YOUR PROJECTS (10% OFF)

Whether you're shipping a portfolio, a side project, n8n flows, or AI agents — I use Hostinger for fast, affordable VPS + web hosting.

Get 10% off here 👉 https://hostinger.com/DIYSMARTCODE

n8n: https://n8n.partnerlinks.io/diysmartcode

(Affiliate links — costs you nothing, supports the channel.)
----

What you will see in this 3-minute breakdown:
→ A real run on Claude Code 2.1.296: /plugin shows "4 mods active", and my usage-meter mod writes 5-hour, 7-day and context usage under the prompt, with a pop-up at 80% and a sound at 97%
→ What a mod is: a plugin with JavaScript or TypeScript event handlers that Claude Code calls on a tool call, a submitted prompt, or a part of the interface being drawn. One "modules" key in the plugin's hooks/hooks.json makes it a mod
→ Mods vs settings hooks: a settings hook runs as a command outside Claude Code and can stop a tool call, but only a mod can add a pane or a band to the screen. My studio-hud band picked up a render check the moment Claude ran it
→ Install with /plugin install plugin-name@marketplace (mods need Claude Code v2.1.287 or later). Switch one off in the Installed tab of /plugin with Space. For one session without installed mods, start with --safe-mode, which turns off your other customizations too
→ Check before you install: claude plugin validate lists every event a mod hooks and every call it makes, without running it. Look for calls like $.process.run, which starts programs as you
→ Let Claude write one: describe the mod in a session, Claude writes it with the built-in plugin-authoring skill into ~/.claude/dev-mods/, you enable hot reloading for the session, and you copy the folder out to keep it
→ Test it offline: claude plugin test runs a mod's tests with no session, sign-in or network. All five usage-meter tests pass

Claude Code docs, Mods overview (install, /plugin, --safe-mode, validate): https://code.claude.com/docs/en/plugins/mods/overview
Claude Code docs, Create a mod (modules key, plugin-authoring, hot reloading, dev-mods): https://code.claude.com/docs/en/plugins/mods/create
Claude Code docs, Test a mod (claude plugin test): https://code.claude.com/docs/en/plugins/mods/test
Claude Code docs, Manage mods (the calls to look for): https://code.claude.com/docs/en/plugins/mods/admin
Claude Code docs, Mods reference (events): https://code.claude.com/docs/en/plugins/mods/reference
Claude Code docs, Install plugins (enable or disable with Space): https://code.claude.com/docs/en/plugins/install
Claude Code docs, CLI reference (--safe-mode): https://code.claude.com/docs/en/cli-reference
Claude Code docs, Status line (5-hour and 7-day usage): https://code.claude.com/docs/en/statusline
Claude Code changelog (2.1.287, Claude Mods): https://code.claude.com/docs/en/changelog
Our Claude Code mods launch Short: https://youtu.be/tTe7GOJuc0E

Which would you build first: a usage warning, or a slash command of your own?

#ClaudeCode #Claude #ClaudeCodeMods #ClaudeMods #ClaudeCodePlugins #ClaudePlugins #ClaudeCodeTutorial #ClaudeCodeTips #ClaudeCodeSetup #ClaudeCodeForBeginners #ClaudeCodeHooks #Anthropic #AICoding #AIAgents #AgenticCoding #DeveloperTools #CodingWithAI #VibeCoding #DevTips #Shorts