{/* Content */}
;}; \\`\\`\\`
**Effect:** You say "help me create a user card component", and Claude automatically follows your team's standard process β tests, types, documentation, all included.
> ? **Plain English Analogy:** It's like writing an "Operation Manual" for a new employee. They follow the manual and don't need you to watch over them every time.
* * *
## Layer 3: `hooks/` β Set an Unbypassable Guardrail
#### What is the problem?
Sometimes AI performs operations you absolutely don't want β like directly deleting a database in production, or running an `rm -rf` command. Relying on prompts to tell it not to do this is unreliable.
#### Solution
Hooks are **Shell scripts that automatically run before and after every Claude tool call**. They are pure code logic with deterministic execution. AI cannot bypass them.
**Three core files:**
hooks/βββ PreToolUse.sh β Runs BEFORE tool invocationβββ PostToolUse.sh β Runs AFTER tool invocationβββ SessionStart.sh β Runs when session STARTS
**PreToolUse.sh Example β Intercepting dangerous commands:**
#!/bin/bash# Check the command Claude is about to execute TOOL_INPUT="$2"# Forbidden: rm -rf /if echo "$TOOL_INPUT" | grep -qE "rm\\s+-rf\\s+/"; then echo "Blocked: Destructive delete command forbidden" >&2 exit 1fi# Forbidden: operating production database without confirmationif echo "$TOOL_INPUT" | grep -q "prod_db" && echo "$TOOL_INPUT" | grep -qE "DROP|DELETE"; then echo "Blocked: Destructive operations on production database require human confirmation" >&2 exit 1fiexit 0
**PostToolUse.sh Example β Auto-format after saving files:**
#!/bin/bash# Every time Claude finishes writing a file, auto-run lint and formatting TOOL_NAME="$1" FILE_PATH="$2"if [ "$TOOL_NAME" = "write_file" ]; then case "$FILE_PATH" in *.ts|*.tsx|*.js|*.jsx) npx eslint --fix "$FILE_PATH" npx prettier --write "$FILE_PATH" echo "Auto-formatted: $FILE_PATH"Claude Code Devsetup
**Have you encountered these situations?**
* Every time you open a new session, you have to explain your project's naming conventions to Claude again
* Claude suddenly runs a dangerous command, like deleting files
* You ask Claude to do a code review, but it puts the entire project into context, which is slow and expensive
* You've carefully trained a set of Claude usage patterns, but new colleagues have no idea how to reuse them
All these problems can be solved with a structure called **Agent Development Kit (ADK)**.
Its core is 5 folders. Through these 5 folders, we can turn Claude Code into an automated development team with memory, rules, division of labor, and reproducibility.
**Overall Structure:**
Your Project/βββ CLAUDE.md/ β Layer 1: Memoryβββ skills/ β Layer 2: Knowledgeβββ hooks/ β Layer 3: Guardrailsβββ subagents/ β Layer 4: Division of Laborβββ plugins/ β Layer 5: Replication
!(https://example.com/wp-content/uploads/2026/05/1e881ccf-bece-46c8-bc5d-fc2e59d40a20.png)
| Layer | Directory / File | Function | Core Significance | Analogy |
| --- | --- | --- | --- | --- |
| Layer 1 | `CLAUDE.md/` | Global rules and memory center for the agent | Defines AI behavior norms, project background, development constraints | AI Project Operation Manual |
| | `architecture.rules` | Architecture rules definition | Specifies code structure, naming conventions, directory design | Technical Team Coding Standards |
| | `global.md` | Global shared memory | Long-term rules that apply to all projects | AI's Long-term Memory |
| | `project.md` | Current project-specific memory | Business background and special requirements of the current repository | Enhanced Project README |
| Layer 2 | `skills/` | Skill module directory | Injects professional capabilities into AI | AI's Skill Library |
| | `SKILL.md` | Skill description file | Tells AI when to invoke this skill | Skill Manual |
| | `scripts/` | Skill scripts directory | Stores automation scripts and templates | Tool Box |
| | `context.md` | Skill context | Provides background knowledge needed during skill execution | Professional Knowledge Base |
| Layer 3 | `hooks/` | Hook system | Automatically inserts check logic before/after execution | Automated Security Audit |
| | `PreToolUse.sh` | Pre-tool-use hook | Validates before executing commands | "Dangerous Operation Confirmator" |
| | `PostToolUse.sh` | Post-tool-use hook | Auto-processes after execution completes | Auto-formatting, Notifications |
| | `SessionStart.sh` | Session start hook | Initializes development environment | IDE Startup Script |
| Layer 4 | `subagents/` | Sub-agent directory | Splits different specialized Agents | AI Team Collaboration System |
| | `code-reviewer.md` | Code review Agent | Specifically responsible for code Review | Reviewer Engineer |
| | `test-runner.md` | Test Agent | Automatically runs tests | QA Test Engineer |
| | `explorer.md` | Exploration Agent | Analyzes codebase structure | Technical Researcher |
| Layer 5 | `plugins/` | Plugin system | Modularizes and distributes capabilities | AI Application Marketplace |
| | `manifest.json` | Plugin configuration list | Defines plugin metadata | npm package.json |
| | `marketplace.url` | Plugin marketplace address | Plugin download and sharing entry | App Store |
| | `team.install` | Team installation script | One-click sync team environment | DevOps Initialization Script |
Each layer solves a specific problem. Let's break them down one by one.
* * *
## Layer 1: `CLAUDE.md` β Give Claude Long-term Memory
#### What is the problem?
Claude has no cross-session memory. You tell it today to use PascalCase for component naming, but when you open a new session tomorrow, it forgets.
#### Solution
Place a `CLAUDE.md` file in your project and write everything you don't want to repeat. Every time a session starts, Claude automatically reads it.
**Two files, two scopes:**
| File Location | Scope |
| --- | --- |
| `~/.claude/CLAUDE.md` | Applies to **all projects** on your computer |
| Project root `.claude/CLAUDE.md` | Applies to **only this repository** |
**What to write? Think about what you most often repeat to Claude:**
# Project: My E-commerce Platform## Tech Stack- Frontend: Next.js 14 (App Router)- Styling: Tailwind CSS- Database: PostgreSQL + Prisma## Naming Conventions- Component files: PascalCase, e.g., `UserCard.tsx`- Utility functions: camelCase, e.g., `formatPrice.ts`- API routes: kebab-case, e.g., `/api/user-profile`## Notes- Forbidden to use `any` type- All async functions must have try/catch- Must pass ESLint check before committing- Do not directly operate on `main` branch## Code Style- Indentation: 2 spaces- Quotes: single quotes- Prefer arrow functions
**Effect:** You no longer need to paste a long background introduction at the beginning of every conversation.
* * *
## Layer 2: `skills/` β Store Your Experience
#### What is the problem?
Every time you ask Claude to write a new component, it might do it differently each time β sometimes adding tests, sometimes not; sometimes with TypeScript types, sometimes without.
#### Solution
Write the standard approach as a skill file and put it in the `skills/` directory. Claude will **automatically match and invoke** the corresponding skill based on your task description. You don't need to enter any commands.
**Directory Structure:**
skills/βββ SKILL.md β Skill Index (description + trigger conditions)βββ create-component.md β Standard process for creating React componentsβββ write-api.md β Standard process for writing APIsβββ fix-bug.md β Standard process for debugging
**What does a skill file look like?**
--- name: create-react-component description: > When user says "create component", "new page", or "write a UI", automatically invoke this skill.---# Standard Process for Creating React Components## Steps1. Check if a component with the same name already exists under `src/components/`2. Create a new `.tsx` file using PascalCase naming3. Must define TypeScript interface, `any` is not allowed4. Synchronously create corresponding Storybook stories under `src/stories/`5. Create unit test files under `__tests__/`## Code Template \\`\\`\\`tsx interface Props { // Define props here}export const ComponentName: React.FC = ({ }) => { return
YouTip