Claude Code Guide: Features and Best Practices

Contents

1. Quick Reference Cheatsheet
2. Installation
3. Using Claude Code
4. Models
5. CLAUDE.md - Providing Claude Code with Context
6. Prompting, Planning, and Execution
7. Checkpoints: Undoing Code and Context
8. Git and Version Control
9. Usage and Context Control
10. Settings and Permissions
11. Claude Plugins and Plugin Marketplaces
12. Claude Skills
13. Claude Subagents
14. Claude MCP Servers
15. Custom Statuslines
16. Frequently Asked Questions
17. Conclusion

Quick Reference Cheatsheet

Prefixes

• ! - Bash mode prefix
• @ - Mention files/folders

Keyboard Shortcuts

• Esc+Esc - Open rewind menu (undo changes)
• Shift+Tab - Auto accept edits mode
• Shift+Tab+Tab - Plan mode

Slash Commands

• /init - Creates a CLAUDE.md file
• /login - Switch Claude accounts
• /model [model] - Sets model
• /usage - Spent and remaining usage
• /rewind - Open rewind menu (undo changes)
• /clear - Clears all context window
• /compact [instructions] - Compacts/summarises context
• /config - Views current configuration settings
• /permissions - Views current allowed commands
• /review - Request code review
• /status - Shows status, including MCP connections
• /memory - Allows editing Claude's memory
• /plugin - Lists available and installed plugins
• /mcp - Lists connected and unconnected MCP servers
• /agents - Lists user and built-in agents, option to create new agent
• /doctor - Shows diagnostics and current Claude Code version
• /help - Shows help menu

Installation

To install Claude Code, refer to the official instructions at code.claude.com/docs/en/setup .

Using Claude Code

Claude Code operates within the directory where you launch it, typically your project's root folder. To start Claude Code in your terminal, run:

claude

When first running Claude Code, you should be prompted to log in. You will need to be on a paid plan, either “Pro”, “Max”, or “Team”. If you are not prompted to log in, use the slash command:

/login

Prompts are typed in the input bar. You can paste text and screenshot images, and drag and drop files into the terminal.

Essential Commands and Shortcuts

Shift+Tab

Using Shift+Tab will switch Claude Code between accept edits mode, plan mode, and back to default mode.

Auto-Accept Edits: Using Shift+Tab with accept edits on will allow Claude Code to add and edit files without asking each time.

Plan Mode: Using Shift+Tab with plan mode on will tell Claude to assess your requirements, ask any clarifying questions if necessary, and output the plan before adding and modifying files.

Bash Mode

You can switch into “Bash mode” to run terminal commands yourself:

!

! ls

Models

Claude Code supports three models:

1. Opus - highest capability model, slower response times, higher usage costs
2. Sonnet - balanced performance and cost, suitable for most development tasks
3. Haiku - fastest responses, lowest usage costs, ideal for straightforward tasks

You can switch between models using the slash command:

/model

Recommended Setup: Opus Plan Mode with Sonnet Execution

Using Opus in Plan Mode, then executing the plan using Sonnet is a great default. Use this slightly hidden feature to have this occur automatically:

/model opusplan

CLAUDE.md - Providing Claude Code with Context

The most effective way to optimise Claude Code performance is to provide a CLAUDE.md file in your project root. This file serves as project documentation for Claude, outlining common development commands, project architecture, directory structure, and essential development practices.

You can have Claude Code create a CLAUDE.md file automatically:

/init

# CLAUDE.md

## Development Commands

### Local Development
- `bun run dev` - Start development server at http://localhost:5173
- `bun run build` - Build for production
- `bun run test` - Run Vitest tests
- `bun run format` - Format code with Prettier

## Project Architecture

This is a personal website built with React Router v7, deployed on Cloudflare Workers.

### Key Architecture Components

**Framework**: React Router v7 with SSR enabled
**Styling**: Tailwind CSS v4 with custom animations

### Key Development Patterns

**SEO**: Comprehensive meta tags, Open Graph, Twitter Cards, and JSON-LD structured data

Prompting, Planning, and Execution

Prompting

Write prompts as you would brief a software developer: clearly state requirements, provide context about the existing codebase, and specify expected outcomes. Use natural language rather than attempting to write code-like commands.

If your prompt will be quite long, you can write your prompt to a file then import that file into Claude Code using the @ prefix:

@prompt.md

Planning

Claude Code enters Plan Mode when your prompt explicitly requests planning (e.g., “Plan the implementation of...”) or when you enable it manually using Shift+Tab.

Plan the implementation of a new search feature. There should be a search icon in the website header which expands to take a search term input. The search functionality should search through the articles, guides, and blog posts on the website.

Parallel Agents for Brainstorming

You can have Claude Code run multiple instances in parallel to brainstorm implementation strategies. For example:

Use parallel subagents to brainstorm 3 potential ways to implement a contact form that sends an email to my email address when someone uses the form. The solution should be able to be run on Cloudflare Workers.

Checkpoints: Undoing Code and Context

When Claude Code takes an unintended direction, you can use checkpoints to restore previous states without starting a new session. Each prompt creates an automatic checkpoint. View checkpoints with:

/checkpoints

Note: Checkpoints are session-specific and temporary. They are not a replacement for Git version control. Always commit important changes to Git for permanent version history.

Usage and Context Control

Check your remaining usage with:

/usage

Clear all context to start fresh:

/clear

Compact your message history to free up context space:

/compact

Settings and Permissions

To avoid repetitive permission prompts, configure command permissions in a .claude/settings.local.json file. For shared settings that can be committed to a Git repository, use .claude/settings.json. The global settings file for all projects is at ~/.claude/settings.json.

{
  "permissions": {
    "allow": [
      "Bash(cat:*)",
      "Bash(ls:*)",
      "Bash(grep:*)",
      "Bash(npm run test:*)",
      "Bash(npm run build:*)"
    ],
    "ask": [
      "Bash(rm:*)",
      "Bash(curl:*)",
      "Bash(git:*)",
      "Bash(docker:*)"
    ],
    "deny": [
      "Bash(ssh:*)",
      "Read(./.env)",
      "Read(./.env.*)",
      "Read(**/*.key)"
    ],
    "env": {
      "CLAUDE_CODE_ENABLE_TELEMETRY": "0",
      "ANTHROPIC_MODEL": "opusplan"
    }
  }
}

Claude Plugins and Plugin Marketplaces

Plugins provide a distribution mechanism for installing Claude Skills and MCP servers from official and community sources. View available plugins:

/plugin

Exercise caution when installing plugins from external sources. The official Claude plugins marketplace has “code intelligence” plugins available. For example, to install the TypeScript code intelligence:

/plugin install typescript-lsp@claude-plugins-official

Claude Skills

Claude Skills are a way of loading specialised knowledge into Claude Code. Unlike the CLAUDE.md file, SKILL.md file contents are not loaded into the context until the Skill is invoked.

Example Custom Skill: React Component Optimiser

First create the directory for the Skill in your home directory:

mkdir -p ~/.claude/skills/react-optimiser

Then create a SKILL.md file inside the new directory:

---
name: react-optimiser
description: Analyses React components for performance issues and implements optimisations. Use when reviewing component performance, addressing re-render issues, or when asked to optimise React code.
---

When optimising React components:

1. **Analyse first**: Examine the component for unnecessary re-renders, expensive computations, key prop issues
2. **Create optimisation plan**: List specific issues found with proposed solutions and potential side-effects
3. **Wait for approval**: Present the plan and ask which optimisations to implement
4. **Implement carefully**: Apply changes incrementally, preserve existing functionality

Use the Skill by asking Claude:

Use the React Optimiser skill to analyse the `Header.tsx` component

Or by using the slash command:

/react-optimiser ./components/Header.tsx

Claude Subagents

Custom subagents can be created to handle specific tasks, such as a “Code Reviewer” subagent or a “Security Reviewer” subagent. To create a subagent:

/agents

Then select Create new agent and choose Personal to save the subagent in your home directory (~/.claude/agents/) so it can be used in multiple projects. Select Generate with Claude and describe your requirement when asked. For example:

A security reviewer agent that explores the code to highlight any potential security risks, vulnerabilities, or oversights. It should explain the risk or vulnerability and provide solutions or mitigations.

You can then run the subagent by asking Claude to use it:

Use the security-reviewer agent to explore the codebase and highlight any potential vulnerabilities

Claude MCP Servers

Model Context Protocol (MCP) is a standardised protocol that enables Claude to interact with external services and tools. MCP servers provide integrations with email providers (Gmail), project management platforms (Asana), communication tools (Slack), design applications (Canva), databases, and web browsers.

Playwright MCP

Playwright MCP allows Claude Code to see a website or web application. To install:

/plugin install playwright@claude-plugins-official

Then use Playwright by asking Claude something like:

Use Playwright to inspect my homepage and suggest layout changes to reduce bounce rates

Context7

Context7 provides Claude with access to current documentation and code examples for frameworks, libraries, and tools. This supplements Claude's training data with up-to-date information. To install:

/plugin install context7@claude-plugins-official

Custom Statuslines

You can configure a custom statusline that appears below the input box in Claude Code to display session information such as the current Git branch, working directory, context window usage, and active model.

Create a file at ~/.claude/statusline.sh with your statusline script, make it executable (chmod +x ~/.claude/statusline.sh), and add to your ~/.claude/settings.json:

  "statusLine": {
    "type": "command",
    "command": "~/.claude/statusline.sh",
    "padding": 0
  }

Frequently Asked Questions

What is the difference between Skills and Subagents?

Skills are reusable prompt templates that load specialised instructions when invoked, without consuming context until used. They're ideal for specific workflows like code reviews or optimisation tasks. Subagents are independent Claude instances that can run in parallel or background, with their own context windows and tool access permissions.

How much does Claude Code cost?

Claude Code requires a paid Claude subscription: Pro (individual use), Max (higher usage limits), or Team (collaborative features). Usage counts against your plan's monthly limits based on the model used (Haiku consumes fewer tokens than Sonnet, which consumes fewer than Opus). Check your current usage with the /usage command.

Can I use Claude Code offline?

No. Claude Code requires an active internet connection as it communicates with Anthropic's API servers to process requests. All AI inference happens on Anthropic's infrastructure, not locally on your machine.

How do I prevent Claude Code from reading sensitive files?

Add deny rules to your ~/.claude/settings.json or .claude/settings.json file. For example: "deny": ["Read(./.env)", "Read(./.env.*)", "Read(**/*.key)"]. This prevents Claude from accessing environment files, private keys, or other sensitive data.

What are MCP servers and why would I use them?

Model Context Protocol (MCP) servers extend Claude Code's capabilities by connecting it to external services like Gmail, Slack, databases, or design tools like Canva. For example, the Playwright MCP allows Claude to view and interact with websites, whilst Context7 provides access to up-to-date documentation for frameworks and libraries.

Conclusion

Claude Code transforms software development by bringing AI assistance directly into your terminal whilst maintaining full control over your codebase. The key to maximising its effectiveness lies in proper configuration: create a comprehensive CLAUDE.md file, use plan mode for complex features, configure appropriate model selection (opusplan for most workflows), and leverage advanced features like Skills and MCP servers where appropriate.

Start with the basics: installation, CLAUDE.md creation, and model selection. Then progressively adopt advanced features as your workflow matures. Use checkpoints to experiment safely, configure permissions to balance convenience with security, and create custom Skills for repetitive tasks in your domain.

For the latest documentation and updates, refer to the official Claude Code documentation at code.claude.com/docs.