Claude Code

Configure Claude Code to help write, review, and update your WebMCP documentation

Configure Claude Code to help write, review, and update your docs.

Claude Code is an agentic command line tool that can help you maintain your documentation. It can write new content, review existing pages, and keep docs up to date.

You can train Claude Code to understand your documentation standards and workflows by adding a CLAUDE.md file to your project and refining it over time.

Getting started

1. Prerequisites

   Ensure you have:

   • Active Claude subscription (Pro, Max, or API access)
   • Node.js 16+ installed
   • Git repository initialized
2. Install Claude Code

   npm install -g @anthropic-ai/claude-code
   
3. Navigate to docs

   cd your-docs-directory
   
4. Add CLAUDE.md (optional)

   Add the CLAUDE.md file template below to train Claude Code on your documentation standards.

5. Start Claude Code

   claude
   

CLAUDE.md template

Save a CLAUDE.md file at the root of your docs directory to help Claude Code understand your project. This file trains Claude Code on your documentation standards, preferences, and workflows. See Manage Claude’s memory in the Anthropic docs for more information.

WebMCP Template

# WebMCP documentation

## Working relationship
- You can push back on ideas-this can lead to better documentation. Cite sources and explain your reasoning when you do so
- ALWAYS ask for clarification rather than making assumptions
- NEVER lie, guess, or make up information

## Project context
- Format: MDX files with YAML frontmatter
- Config: docs.json for navigation, theme, settings
- Components: Mintlify components
- Organization: WebMCP-org GitHub organization
- Main repository: https://github.com/WebMCP-org/docs

## Content strategy
- Document just enough for user success - not too much, not too little
- Prioritize accuracy and usability of information
- Make content evergreen when possible
- Search for existing information before adding new content. Avoid duplication unless it is done for a strategic reason
- Check existing patterns for consistency
- Start by making the smallest reasonable changes

## docs.json

- Refer to the [Mintlify configuration schema](https://mintlify.com/docs/settings/global) when building the docs.json file and site navigation
- Navigation structure is defined in the "navigation" array
- Each group has a "group" name and "pages" array

## Frontmatter requirements for pages
- title: Clear, descriptive page title
- description: Concise summary for SEO/navigation
- sidebarTitle: (optional) Shorter title for sidebar display
- icon: (optional) Icon name from Font Awesome or Lucide

## Writing standards
- Second-person voice ("you")
- Prerequisites at start of procedural content
- Test all code examples before publishing
- Match style and formatting of existing pages
- Include both basic and advanced use cases
- Language tags on all code blocks
- Alt text on all images
- Relative paths for internal links

## Git workflow
- NEVER use --no-verify when committing
- Ask how to handle uncommitted changes before starting
- Create a new branch when no clear branch exists for changes
- Commit frequently throughout development
- NEVER skip or disable pre-commit hooks
- Use descriptive commit messages following conventional commits

## WebMCP-specific guidelines
- Reference the official WebMCP-org repositories
- Examples repository: https://github.com/WebMCP-org/examples
- NPM packages: @mcp-b/transports and related packages
- Focus on Model Context Protocol (MCP) functionality
- Include TypeScript examples with proper type definitions
- Document both browser and Node.js usage patterns

## Do not
- Skip frontmatter on any MDX file
- Use absolute URLs for internal links
- Include untested code examples
- Make assumptions - always ask for clarification
- Reference outdated MiguelsPizza organization links
- Commit node_modules or build artifacts

Sample prompts

Once you have Claude Code set up, try these prompts to see how it can help with common documentation tasks. You can copy and paste these examples directly, or adapt them for your specific needs.

Convert notes to polished docs

Turn rough drafts into proper Markdown pages with components and frontmatter.

Example prompt

Convert this text into a properly formatted MDX page: 

WebMCP allows you to connect AI agents to web functionality. It works by:
1. Installing the browser extension
2. Configuring your MCP server
3. Running your AI agent with MCP support

The main benefits are:
- Direct browser automation
- Real-time web data access
- Secure sandboxed execution

Review docs for consistency

Get suggestions to improve style, formatting, and component usage.

Example prompt

Review the files in docs/ and suggest improvements for:
- Consistent use of components (Cards, Steps, CodeGroups)
- Proper frontmatter on all pages
- Consistent voice and tone
- Missing documentation areas

Update docs when features change

Keep documentation current when your product evolves.

Example prompt

Our WebMCP API now requires an apiVersion parameter. Update our docs to:
1. Include apiVersion: "2024-01" in all code examples
2. Add a migration guide for users on older versions
3. Update the API reference with the new parameter

Generate comprehensive code examples

Create multi-language examples with error handling.

Example prompt

Create code examples for initializing WebMCP in:
- TypeScript (with type definitions)
- JavaScript (ES6 modules)
- React (with hooks)
- Vue 3 (composition API)

Include error handling and configuration options for each.

Extending Claude Code

Beyond manually prompting Claude Code, you can integrate it with your existing workflows.

Automation with GitHub Actions

Run Claude Code automatically when code changes to keep docs up to date. You can trigger documentation reviews on pull requests or update examples when API changes are detected.

GitHub Actions Integration

Learn how to set up automated documentation workflows

Multi-instance workflows

Use separate Claude Code sessions for different tasks:

Writing Session

Focus on creating new content and expanding documentation

Review Session

Dedicated to quality assurance and consistency checks

Team collaboration

Share your refined CLAUDE.md file with your team to ensure consistent documentation standards across all contributors. Teams often develop project-specific prompts and workflows that become part of their documentation process.

Store commonly used prompts in a prompts/ directory in your repository for team reuse.

Custom commands

Create reusable slash commands in .claude/commands/ for frequently used documentation tasks specific to your project or team.

Example command structure:

.claude/
└── commands/
    ├── review-api-docs.txt
    ├── update-examples.txt
    └── check-links.txt

Best practices

Start with small changes

Begin by using Claude Code for simple tasks like reviewing a single page or updating code examples. As you become comfortable, expand to more complex documentation workflows.

Refine your CLAUDE.md regularly

Update your CLAUDE.md file based on patterns you notice. If you find yourself giving the same instructions repeatedly, add them to the file.

Use version control

Always work in a git branch when making documentation changes. This allows you to review Claude Code’s work before merging.

Combine with other tools

Claude Code works well alongside linters, formatters, and other documentation tools. Use it as part of your broader documentation pipeline.

Resources

Claude Code Documentation

Official documentation and reference

Memory Management

Learn about CLAUDE.md and context management

CLI Reference

Complete command line interface guide

Common Workflows

Patterns and examples for typical tasks