Claude Max 6 / Claude Code: Best practices for agentic coding 2

Claude Codeを使った開発の効率を上げる準備です。(2025.09.25)

Claude Code: Best practices for agentic coding

上記の公式HPから日本語にして抜粋するだけです。

2. Give Claude more tools

Claudeにもっと道具を与えろ

shellも使える。MCPも使える。REST APIも使える。

MCPを介してClaude Codeをツールに接続する

自分の興味 : Asana, Atlassian, Notion, Box, Figma, Canva

2-1. Use Claude with bash tools

Claudeをbashと一緒に使え

2-2. Use Claude with MCP

ClaudeをMCPと一緒に使え

2-3. Use custom slash commands

slash commandsについて理解を深めるために、具体的な例をClaude Opus 4.1に提示してもらいます。

指示内容 : claude codeのcustom slash commandsについて、簡単な例を用いて説明してください。徐々に中級レベルの説明にしていってください。出力は新規ファイルに保存してください。

英語で指示 : Explain custom slash commands in your claude code with simple examples, gradually moving to intermediate level explanations. Save the output to a new file.

claude-code-slash-commands-guide.md

# Custom Slash Commands in Claude Code

Custom slash commands allow you to create reusable prompts and workflows in Claude Code. They're stored as Markdown files and can be executed with simple syntax during your coding sessions.

## Simple Examples

### 1. Basic Command Structure

Create a simple command to explain code:

```bash
# Create the commands directory
mkdir -p .claude/commands

# Create a basic explain command
echo "Explain what this code does in simple terms:" > .claude/commands/explain.md
```

Usage: `/explain [code or file reference]`

### 2. Code Review Command

```markdown

Review this code for:
- Bugs and potential issues
- Code style and best practices
- Performance considerations
- Security vulnerabilities

$ARGUMENTS
```

Usage: `/review src/app.js` or `/review` (then paste code)

### 3. Quick Documentation Generator

```markdown

Generate documentation for this code including:
- Function/class descriptions
- Parameter explanations
- Return value details
- Usage examples

$ARGUMENTS
```

Usage: `/docs @src/utils.js`

## Intermediate Examples

### 4. Test Generation with Arguments

```markdown

---
description: Generate comprehensive tests for the given code
args:
  - name: framework
    description: Testing framework to use (jest, vitest, etc.)
  - name: coverage
    description: Coverage level (basic, comprehensive)
---

Generate $2 tests for this code using $1 framework:
- Unit tests for all functions
- Edge case testing
- Mock external dependencies
- Ensure good test coverage

$ARGUMENTS
```

Usage: `/test jest comprehensive @src/calculator.js`

### 5. Refactoring Command with Multiple Arguments

```markdown

---
description: Refactor code following specific patterns
args:
  - name: pattern
    description: Refactoring pattern (extract-function, reduce-complexity, etc.)
  - name: target
    description: Target language version or framework
---

Refactor this code using the $1 pattern for $2:
- Improve readability and maintainability
- Follow modern best practices
- Preserve existing functionality
- Add appropriate comments

Code to refactor:
$ARGUMENTS
```

Usage: `/refactor extract-function ES2023 @legacy/oldCode.js`

### 6. Database Query Optimizer

```markdown

---
description: Analyze and optimize database queries
allowed_tools: ["Bash", "Read", "Write"]
---

Analyze this database query for optimization opportunities:

Query: $1
Database type: $2

Please:
1. Identify performance bottlenecks
2. Suggest index improvements
3. Rewrite for better performance
4. Explain the optimization reasoning

!echo "Analyzing query performance..."

$ARGUMENTS
```

Usage: `/optimize-query "SELECT * FROM users WHERE created_at > '2023-01-01'" postgresql`

### 7. Project Structure Command

```markdown

---
description: Analyze and suggest improvements to project structure
---

Analyze the current project structure and provide recommendations:

!find . -type f -name "*.js" -o -name "*.ts" -o -name "*.json" | head -20

Based on the file structure above and the following details:
$ARGUMENTS

Please suggest:
- Better organization patterns
- Missing configuration files
- Potential architectural improvements
- Industry best practices for this type of project
```

Usage: `/structure This is a React/TypeScript web application with Node.js backend`

### 8. Advanced Git Workflow Command

```markdown

---
description: Create a comprehensive git workflow for feature development
args:
  - name: feature
    description: Feature name or description
  - name: base_branch
    description: Base branch (main, develop, etc.)
---

Set up a complete git workflow for feature: $1

Base branch: $2

!git status
!git branch --show-current

Steps to execute:
1. Create and switch to feature branch
2. Set up proper commit message template
3. Configure pre-commit hooks if needed
4. Provide guidance for pull request creation

$ARGUMENTS
```

Usage: `/git-workflow user-authentication main`

### 9. Performance Analysis Command

```markdown

---
description: Comprehensive performance analysis
allowed_tools: ["Bash", "Read", "Grep", "WebFetch"]
---

Perform comprehensive performance analysis on:
$1

Analysis type: $2 (frontend/backend/database/full-stack)

!echo "Starting performance analysis..."

Tasks:
- Identify performance bottlenecks
- Analyze bundle size (if frontend)
- Check for memory leaks
- Review async operations
- Suggest optimization strategies
- Provide before/after metrics if possible

Additional context:
$ARGUMENTS
```

Usage: `/perf @src/app.js frontend Heavy rendering issues on large datasets`

### 10. API Design Command

```markdown

---
description: Design RESTful API endpoints
args:
  - name: resource
    description: Main resource name (users, products, etc.)
  - name: auth_type
    description: Authentication type (jwt, oauth, basic)
---

Design a RESTful API for managing $1 with $2 authentication:

Requirements:
$ARGUMENTS

Please provide:
- Complete endpoint definitions
- Request/response schemas
- Error handling patterns
- Authentication flow
- Rate limiting considerations
- Documentation examples
```

Usage: `/api-design products jwt CRUD operations, search, filtering, pagination`

## Tips for Creating Effective Commands

1. **Use descriptive names**: Make command names intuitive
2. **Leverage frontmatter**: Add descriptions and argument hints
3. **Combine tools**: Use `!` for bash commands and `@` for file references
4. **Structure arguments**: Use `$1`, `$2` for specific arguments, `$ARGUMENTS` for everything
5. **Add context**: Include relevant background information in your prompts
6. **Test thoroughly**: Verify commands work with different argument combinations

## Organization Strategies

### Project-specific commands (.claude/commands/)
- Shared with team
- Project-specific workflows
- Technology stack specific

### Personal commands (~/.claude/commands/)
- Cross-project utilities
- Personal coding preferences
- General-purpose tools

### Namespacing with subdirectories
```
.claude/commands/
├── frontend/
│   ├── react.md
│   └── vue.md
├── backend/
│   ├── express.md
│   └── fastapi.md
└── testing/
    ├── unit.md
    └── integration.md
```

Usage: `/frontend/react`, `/backend/express`, etc.

This guide covers the fundamentals through intermediate usage of custom slash commands in Claude Code. Start with simple commands and gradually build more sophisticated workflows as you become comfortable with the syntax and capabilities.

htmlです。

Custom Slash Commands in Claude Code

Custom slash commands allow you to create reusable prompts and workflows in Claude Code. They’re stored as Markdown files and can be executed with simple syntax during your coding sessions.

Simple Examples

1. Basic Command Structure

Create a simple command to explain code:

# Create the commands directory
mkdir -p .claude/commands

# Create a basic explain command
echo "Explain what this code does in simple terms:" > .claude/commands/explain.md

Usage: /explain [code or file reference]

2. Code Review Command

<!-- .claude/commands/review.md -->
Review this code for:
- Bugs and potential issues
- Code style and best practices
- Performance considerations
- Security vulnerabilities

$ARGUMENTS

Usage: /review src/app.js or /review (then paste code)

3. Quick Documentation Generator

<!-- .claude/commands/docs.md -->
Generate documentation for this code including:
- Function/class descriptions
- Parameter explanations
- Return value details
- Usage examples

$ARGUMENTS

Usage: /docs @src/utils.js

Intermediate Examples

4. Test Generation with Arguments

<!-- .claude/commands/test.md -->
---
description: Generate comprehensive tests for the given code
args:
  - name: framework
    description: Testing framework to use (jest, vitest, etc.)
  - name: coverage
    description: Coverage level (basic, comprehensive)
---

Generate $2 tests for this code using $1 framework:
- Unit tests for all functions
- Edge case testing
- Mock external dependencies
- Ensure good test coverage

$ARGUMENTS

Usage: /test jest comprehensive @src/calculator.js

5. Refactoring Command with Multiple Arguments

<!-- .claude/commands/refactor.md -->
---
description: Refactor code following specific patterns
args:
  - name: pattern
    description: Refactoring pattern (extract-function, reduce-complexity, etc.)
  - name: target
    description: Target language version or framework
---

Refactor this code using the $1 pattern for $2:
- Improve readability and maintainability
- Follow modern best practices
- Preserve existing functionality
- Add appropriate comments

Code to refactor:
$ARGUMENTS

Usage: /refactor extract-function ES2023 @legacy/oldCode.js

6. Database Query Optimizer

<!-- .claude/commands/optimize-query.md -->
---
description: Analyze and optimize database queries
allowed_tools: ["Bash", "Read", "Write"]
---

Analyze this database query for optimization opportunities:

Query: $1
Database type: $2

Please:
1. Identify performance bottlenecks
2. Suggest index improvements
3. Rewrite for better performance
4. Explain the optimization reasoning

!echo "Analyzing query performance..."

$ARGUMENTS

Usage: /optimize-query "SELECT * FROM users WHERE created_at > '2023-01-01'" postgresql

7. Project Structure Command

<!-- .claude/commands/structure.md -->
---
description: Analyze and suggest improvements to project structure
---

Analyze the current project structure and provide recommendations:

!find . -type f -name "*.js" -o -name "*.ts" -o -name "*.json" | head -20

Based on the file structure above and the following details:
$ARGUMENTS

Please suggest:
- Better organization patterns
- Missing configuration files
- Potential architectural improvements
- Industry best practices for this type of project

Usage: /structure This is a React/TypeScript web application with Node.js backend

8. Advanced Git Workflow Command

<!-- .claude/commands/git-workflow.md -->
---
description: Create a comprehensive git workflow for feature development
args:
  - name: feature
    description: Feature name or description
  - name: base_branch
    description: Base branch (main, develop, etc.)
---

Set up a complete git workflow for feature: $1

Base branch: $2

!git status
!git branch --show-current

Steps to execute:
1. Create and switch to feature branch
2. Set up proper commit message template
3. Configure pre-commit hooks if needed
4. Provide guidance for pull request creation

$ARGUMENTS

Usage: /git-workflow user-authentication main

9. Performance Analysis Command

<!-- .claude/commands/perf.md -->
---
description: Comprehensive performance analysis
allowed_tools: ["Bash", "Read", "Grep", "WebFetch"]
---

Perform comprehensive performance analysis on:
$1

Analysis type: $2 (frontend/backend/database/full-stack)

!echo "Starting performance analysis..."

Tasks:
- Identify performance bottlenecks
- Analyze bundle size (if frontend)
- Check for memory leaks
- Review async operations
- Suggest optimization strategies
- Provide before/after metrics if possible

Additional context:
$ARGUMENTS

Usage: /perf @src/app.js frontend Heavy rendering issues on large datasets

10. API Design Command

<!-- .claude/commands/api-design.md -->
---
description: Design RESTful API endpoints
args:
  - name: resource
    description: Main resource name (users, products, etc.)
  - name: auth_type
    description: Authentication type (jwt, oauth, basic)
---

Design a RESTful API for managing $1 with $2 authentication:

Requirements:
$ARGUMENTS

Please provide:
- Complete endpoint definitions
- Request/response schemas
- Error handling patterns
- Authentication flow
- Rate limiting considerations
- Documentation examples

Usage: /api-design products jwt CRUD operations, search, filtering, pagination

Tips for Creating Effective Commands

Use descriptive names: Make command names intuitive
Leverage frontmatter: Add descriptions and argument hints
Combine tools: Use ! for bash commands and @ for file references
Structure arguments: Use $1, $2 for specific arguments, $ARGUMENTS for everything
Add context: Include relevant background information in your prompts
Test thoroughly: Verify commands work with different argument combinations

Organization Strategies

Project-specific commands (.claude/commands/)

Shared with team
Project-specific workflows
Technology stack specific

Personal commands (~/.claude/commands/)

Cross-project utilities
Personal coding preferences
General-purpose tools

Namespacing with subdirectories

.claude/commands/
├── frontend/
│   ├── react.md
│   └── vue.md
├── backend/
│   ├── express.md
│   └── fastapi.md
└── testing/
    ├── unit.md
    └── integration.md

Usage: /frontend/react, /backend/express, etc.

This guide covers the fundamentals through intermediate usage of custom slash commands in Claude Code. Start with simple commands and gradually build more sophisticated workflows as you become comfortable with the syntax and capabilities.