Claude Quickstarts Development Guide

Legal

• When changes are made to files that have a copyright notice add them to that subdirectory's CHANGELOG.md file.

Computer-Use Demo

Setup & Development

• Setup environment: ./setup.sh
• Build Docker: docker build . -t computer-use-demo:local
• Run container: docker run -e ANTHROPIC_API_KEY=$ANTHROPIC_API_KEY -v $(pwd)/computer_use_demo:/home/computeruse/computer_use_demo/ -v $HOME/.anthropic:/home/computeruse/.anthropic -p 5900:5900 -p 8501:8501 -p 6080:6080 -p 8080:8080 -it computer-use-demo:local

Testing & Code Quality

• Lint: ruff check .
• Format: ruff format .
• Typecheck: pyright
• Run tests: pytest
• Run single test: pytest tests/path_to_test.py::test_name -v

Code Style

• Python: snake_case for functions/variables, PascalCase for classes
• Imports: Use isort with combine-as-imports
• Error handling: Use custom ToolError for tool errors
• Types: Add type annotations for all parameters and returns
• Classes: Use dataclasses and abstract base classes

Customer Support Agent

Setup & Development

• Install dependencies: npm install
• Run dev server: npm run dev (full UI)
• UI variants: npm run dev:left (left sidebar), npm run dev:right (right sidebar), npm run dev:chat (chat only)
• Lint: npm run lint
• Build: npm run build (full UI), see package.json for variants

Code Style

• TypeScript: Strict mode with proper interfaces
• Components: Function components with React hooks
• Formatting: Follow ESLint Next.js configuration
• UI components: Use shadcn/ui components library

Financial Data Analyst

Setup & Development

• Install dependencies: npm install
• Run dev server: npm run dev
• Lint: npm run lint
• Build: npm run build

Code Style

• TypeScript: Strict mode with proper type definitions
• Components: Function components with type annotations
• Visualization: Use Recharts library for data visualization
• State management: React hooks for state

Claude Quickstarts

Claude Quickstarts is a collection of projects designed to help developers quickly get started with building applications using the Claude API. Each quickstart provides a foundation that you can easily build upon and customize for your specific needs.

Getting Started

To use these quickstarts, you'll need an Claude API key. If you don't have one yet, you can sign up for free at console.anthropic.com.

Available Quickstarts

Customer Support Agent

A customer support agent powered by Claude. This project demonstrates how to leverage Claude's natural language understanding and generation capabilities to create an AI-assisted customer support system with access to a knowledge base.

Go to Customer Support Agent Quickstart

Financial Data Analyst

A financial data analyst powered by Claude. This project demonstrates how to leverage Claude's capabilities with interactive data visualization to analyze financial data via chat.

Go to Financial Data Analyst Quickstart

Computer Use Demo

An environment and tools that Claude can use to control a desktop computer. This project demonstrates how to leverage the computer use capabilities of Claude, including support for the latest computer_use_20251124 tool version with zoom actions.

Go to Computer Use Demo Quickstart

Browser Tools API Demo

A complete reference implementation for browser automation powered by Claude. This project demonstrates how to leverage Claude's browser tools API for web interaction, including navigation, DOM inspection, and form manipulation using Playwright.

Go to Browser Tools API Demo Quickstart

Autonomous Coding Agent

An autonomous coding agent powered by the Claude Agent SDK. This project demonstrates a two-agent pattern (initializer + coding agent) that can build complete applications over multiple sessions, with progress persisted via git and a feature list that the agent works through incrementally.

Go to Autonomous Coding Agent Quickstart

General Usage

Each quickstart project comes with its own README and setup instructions. Generally, you'll follow these steps:

1. Clone this repository
2. Navigate to the specific quickstart directory
3. Install the required dependencies
4. Set up your Claude API key as an environment variable
5. Run the quickstart application

Explore Further

To deepen your understanding of working with Claude and the Claude API, check out these resources:

• Claude API Documentation
• Claude Cookbooks - A collection of code snippets and guides for common tasks
• Claude API Fundamentals Course

Contributing

We welcome contributions to the Claude Quickstarts repository! If you have ideas for new quickstart projects or improvements to existing ones, please open an issue or submit a pull request.

Community and Support

• Join our Anthropic Discord community for discussions and support
• Check out the Anthropic support documentation for additional help

License

This project is licensed under the MIT License - see the LICENSE file for details.