// Recommended Setup
Complete developer guide for setting up Claude Code + Cline β two AI coding assistants running side-by-side in VS Code. One workspace, two engines, maximum productivity.
Getting Started
This section covers everything needed to get both Claude Code and Cline up and running side-by-side in VS Code. You'll install both tools so they're always available in a single editor.
Prerequisites
VS Code
v1.98.0+
Latest stable release recommended
Node.js
v18.0+
Required for Claude Code CLI
API Access
Key Required
Your team API key
Install Claude Code
Claude Code requires both a CLI tool and a VS Code extension. The extension depends on the CLI binary.
Step 1: Install the CLI
# Using npm (recommended)
npm install -g @anthropic-ai/claude-code
# Using Homebrew
brew install claude-code
# Verify installation
claude --versionStep 2: Authenticate the CLI
claude authThis opens a browser window to link your Anthropic account.
Step 3: Install VS Code Extension
- Open Extensions view (Cmd/Ctrl+Shift+X)
- Search for βClaude Codeβ
- Install the extension published by Anthropic
Install Cline
Cline is an open-source, model-agnostic coding agent installed directly as a VS Code extension.
- Open Extensions view (Cmd/Ctrl+Shift+X)
- Search for βClineβ
- Install the extension with ID
saoudrizwan.claude-dev
npm install -g cline.Configuration for Self-Hosted LLM
Our team uses a self-hosted LLM endpoint. Both tools need to be configured to connect to the same OpenAI-compatible API. Complete both configurations below.
Configure Cline with Your API Key
Example Configuration
Configure Claude Code (Team Premium)
Our team uses Claude Code Team Premium seats with full access to all features. No environment variable workaround needed β just sign in with your team account.
# Authenticate with your Team Premium account
claude auth
# (Optional) Set your preferred model
export ANTHROPIC_MODEL='claude-sonnet-4-20250514'
# (Optional) Enable high-reasoning mode
export CLAUDE_CODE_EFFORT_LEVEL=max
# Launch Claude Code
claudeConfiguration Troubleshooting
Cline shows "Failed to connect"
Verify the Base URL includes /v1 at the end. Check that there are no trailing slashes.
Model not found error
Ensure the Model ID is exactly "deepseek-v4-pro" (case-sensitive).
API Key rejected
Double-check your key for typos. Keys are case-sensitive. Request a new one from your team lead.
Claude Code auth fails
Run "claude auth" again. Ensure you are signing in with team SSO credentials, not a personal account.
Claude Code Guide
With our Team Premium subscription, Claude Code runs on Anthropic's native models (Claude Opus/Sonnet) with 6.25x usage capacity, full MCP integration, and Agent Teams for multi-agent workflows.
@-Mentions & Context
Provide context to the agent by referencing files and directories directly in the chat:
@src/components/Reference an entire folder@auth.tsReference a specific file@auth.ts#5-10Reference specific line rangePlan Mode
For complex tasks, use the /plan command to generate a step-by-step markdown plan before execution.
/plan Refactor the authentication module to support OAuth2
# Claude Code will generate a plan like:
# 1. Create OAuth2 provider interface
# 2. Implement Google OAuth2 provider
# 3. Update auth middleware
# 4. Add token refresh logic
# 5. Update testsCLAUDE.md Project Context
Create a CLAUDE.md file in your project root to provide persistent instructions:
# CLAUDE.md
## Project Overview
This is a TypeScript monorepo using Turborepo.
## Coding Conventions
- Use functional components with hooks
- Prefer named exports over default exports
- All API routes must include error handling
- Use Zod for runtime validation
## Architecture
- /packages/ui - Shared component library
- /apps/web - Next.js frontend
- /apps/api - Express backend
## Testing
- Run tests with: pnpm test
- Coverage threshold: 80%
- Always mock external API callsAgent Teams (Team Premium)
Run multiple Claude instances in parallel, working collaboratively on complex tasks:
# Enable Agent Teams (experimental)
export CLAUDE_CODE_EXPERIMENTAL_AGENT_TEAMS=1
# Launch Claude Code and spawn a team
claude
> "Refactor the auth module. Use 2 teammates:
> - Agent 1: Rewrite the token refresh logic
> - Agent 2: Update all affected tests"
# Navigate between agents: Shift+Down/UpCline Guide
Cline is an open-source autonomous agent focused on flexibility and deep IDE integration. Its model-agnostic design makes it ideal for use with our self-hosted endpoint.
Plan/Act Workflow
π Plan Mode
The agent analyzes your request and proposes a strategic plan. No files are modified. You review the approach before any code is written.
β‘ Act Mode
After approving the plan, the agent executes: writing code, editing files, and running terminal commands.
Human-in-the-Loop
Cline will pause and request permission before:
- Executing any terminal command
- Applying file changes (create, edit, delete)
- Installing packages or dependencies
- Making API calls or network requests
Custom Rules (.clinerules)
# .clinerules
## Project Stack
- Framework: Next.js 14 with App Router
- Database: PostgreSQL with Prisma ORM
- Styling: Tailwind CSS
- State: Zustand for client state
## Rules
- Always use TypeScript strict mode
- Prefer server components by default
- Use 'use client' only when necessary
- All API routes must validate input with Zod
## Avoid
- Do not use class components
- Do not add unnecessary dependencies
- Avoid inline styles; use Tailwind classesProject Memory & Code Structure
The biggest productivity multiplier isn't how you prompt β it's how you structure your project's memory. Both Claude Code and Cline have persistent memory systems.
The Four-Layer Memory Architecture
Static, team-shared instructions. Loaded at every session start.
Equivalent to CLAUDE.md but for Cline. Should mirror same standards.
Structured folder tracking progress, context, architecture decisions.
Path-scoped rules that load only when relevant. Hooks enforce rules via scripts.
Recommended Repository Structure
your-project/
βββ CLAUDE.md # Claude Code project memory (committed)
βββ CLAUDE.local.md # Personal overrides (gitignored)
βββ .clinerules # Cline project rules (committed)
βββ .claude/
β βββ settings.json # Claude Code settings & hooks
β βββ rules/
β βββ frontend.md # Loads only for src/components/**
β βββ api.md # Loads only for src/api/**
β βββ testing.md # Loads only for **/*.test.*
βββ memory-bank/ # Cline Memory Bank (committed)
β βββ projectbrief.md # Foundation: goals & scope
β βββ productContext.md # The "why" behind the project
β βββ activeContext.md # Current focus & next steps
β βββ systemPatterns.md # Architecture & design patterns
β βββ techContext.md # Tech stack & constraints
β βββ progress.md # Milestones & known issues
βββ src/
β βββ CLAUDE.md # Module-level overrides (optional)
β βββ ...
βββ .gitignore
βββ package.jsonUnified Workflow: Both Tools Together
The real power lies in running both Claude Code and Cline side-by-side inside VS Code. Each tool has distinct strengths β together they create a unified AI-powered development environment.
Your strategic architect. Best for:
- β Complex multi-file refactoring
- β MCP-powered integrations
- β Autonomous test-fix-iterate loops
- β Codebase-wide analysis & planning
Your precision executor. Best for:
- β Quick feature implementation
- β Step-by-step approval workflows
- β Safe experimentation with checkpoints
- β Rapid prototyping & UI work
Real-World Workflow Scenarios
ποΈ Building a New Feature
Claude Code β Use /plan to architect the solution. Analyze existing code, propose file structure.
Cline β Implement the feature file-by-file using Plan/Act mode. Leverage checkpoints for safe iteration.
Claude Code β Run the autonomous test loop: execute tests, read failures, fix issues, re-run until green.
π Debugging a Complex Bug
Claude Code β Analyze the codebase: find all code paths that could cause the issue.
Cline β Apply targeted fixes one at a time, reviewing each diff. Use checkpoints to test approaches.
Claude Code β Verify fix across the codebase: run full test suite, check for regressions.
π Quick Prototyping
Cline β Rapidly scaffold UI components using Plan/Act. Create checkpoints before each major change.
Cline β Iterate quickly: if an approach doesn't work, revert to checkpoint and try again.
Claude Code β Once solid, use Claude Code to refine, add tests, and prepare for production.
MCP Integration Guide
The Model Context Protocol (MCP) is an open standard for securely connecting AI agents to external tools, databases, and APIs.
MCP Client
Claude Code / Cline
MCP Server
GitHub, PostgreSQL, Jira...
GitHub Integration
Connect Claude Code to GitHub for native issue tracking, branch management, and PR creation.
# Store your GitHub Personal Access Token
export GITHUB_TOKEN="ghp_your_token_here"Best Practices
Start with a plan
Always use Plan mode before making complex changes. Review and edit the plan before execution.
Be specific with context
Use @-mentions to load only relevant files. This improves response quality and reduces token usage.
Use checkpoints liberally
Create a checkpoint before any risky change. Cline's checkpoint system makes experimentation safe.
Keep CLAUDE.md concise
Under 200 lines. Focus on WHAT (project context), WHY (architecture decisions), and HOW (workflows).
Sync your rule files
Keep CLAUDE.md and .clinerules aligned. When you update one, update the other.
Review every diff
Never auto-approve changes without reviewing the diff. Use the gutter indicators to understand what changed.
One task at a time
Keep conversations focused. Don't mix unrelated tasks in the same chat session.
Commit frequently
Make small, focused commits. This makes it easier to revert if an AI-generated change introduces issues.
Collaboration
When working in a team with AI tools, coordination is essential. Share your project memory files (CLAUDE.md, .clinerules, memory-bank/) via Git so every developer benefits from the same AI context.
# After Claude Code creates an architecture plan, tell Cline:
"I just used Claude Code to plan a refactor of the auth module.
The plan is in the terminal output. Please implement step 1:
Create the OAuth2 provider interface at src/auth/providers/oauth2.ts"
# After Cline implements changes, tell Claude Code:
"Cline just created 3 new files for OAuth2 support.
@src/auth/providers/ Review these files and run the test suite."Troubleshooting
Agent makes unwanted changes
Always start in Plan mode. Review the approach before allowing Act mode. Use checkpoints as safety nets.
Token usage is too high
Be more specific with @-mentions. Keep CLAUDE.md concise. Avoid loading entire directories when a single file will do.
Agent loses context mid-task
For Cline, update the Memory Bank. For Claude Code, ensure CLAUDE.md captures the current state. Break long tasks into smaller steps.
Conflicting changes between tools
Coordinate via the handoff pattern. Always tell the receiving tool what the other just did.
Generated code doesn't follow standards
Update your CLAUDE.md / .clinerules with more specific rules. Include examples of correct patterns.
Security
Never commit API keys
Store all keys in environment variables. Add .env to .gitignore.
Use fine-grained tokens
For GitHub MCP, create tokens with minimal required permissions scoped to specific repositories.
Review AI-generated code
Always review diffs before approving. AI can inadvertently introduce security vulnerabilities.
Keep tools updated
Regularly update Claude Code CLI and Cline extension to get the latest security patches.
Scope MCP permissions
Configure MCP servers with least-privilege access. Don't give agents write access to production databases.
Cheat Sheet
Claude Code Commands
/planGenerate a step-by-step plan/initAuto-generate CLAUDE.md/compactCompress context to save tokens/reviewReview recent changes/costShow session token usage@fileReference a file for contextShift+TabToggle auto-accept modeCline Tips
Plan β ActAlways plan before actingCheckpointsAuto-created at key moments.clinerulesProject-specific standardsMemory BankPersistent context across sessionsHuman approvalRequired for all file changesAuto-approveOptional for read-only opsRevertRoll back to any checkpointPrompting Tips
Be specific about scope
"Refactor the auth middleware in src/middleware/auth.ts to support refresh tokens" vs. "Fix the auth"
Provide context explicitly
"Using our Prisma schema at prisma/schema.prisma, create a new migration for the User model changes"
Define success criteria
"Create the API route. It should pass the existing test suite in tests/api/users.test.ts"
Reference conventions
"Follow the same pattern used in src/api/products/route.ts for error handling and validation"
Cost Tracking
Both tools consume tokens. Track usage to stay within budget and optimize your workflows.
Claude Code
Use /cost to check session usage. Team Premium includes 6.25x capacity vs Pro plan.
Cline
Token usage is shown in the Cline panel status bar. Uses our self-hosted deepseek-v4-pro endpoint.
.gitignore
Add these entries to your .gitignore to keep sensitive and local-only files out of version control:
# Claude Code local overrides
CLAUDE.local.md
# Claude Code internal state
.claude/tasks/
.claude/todos/
# Understand-Anything cache (optional: commit knowledge-graph.json)
.understand-anything/cache/
# Environment variables
.env
.env.local
# IDE
.vscode/settings.json
# Dependencies
node_modules/Setup Script
Run this script to scaffold the recommended directory structure for a new project:
#!/bin/bash
# AI Development Setup Script
# Creates the recommended file structure for Claude Code + Cline
echo "π Setting up AI development environment..."
# Create CLAUDE.md
cat > CLAUDE.md << 'EOF'
# CLAUDE.md
## WHAT β Project Context
- Project: [Your Project Name]
- Stack: TypeScript, Next.js 14, PostgreSQL, Prisma, Tailwind CSS
## WHY β Architecture Decisions
- Server Components by default
- Zod for ALL runtime validation
- Prefer named exports over default exports
## HOW β Workflows
- Build: yarn build
- Test: yarn test
- Lint: yarn lint
EOF
# Create .clinerules
cat > .clinerules << 'EOF'
# .clinerules
## Project Stack
- Framework: Next.js 14 with App Router
- Language: TypeScript (strict mode)
- Styling: Tailwind CSS
## Rules
- Use functional components with hooks
- Prefer named exports
- All API routes must validate input with Zod
EOF
# Create Claude Code rules directory
mkdir -p .claude/rules
touch .claude/settings.json
# Create Memory Bank
mkdir -p memory-bank
touch memory-bank/projectbrief.md
touch memory-bank/activeContext.md
touch memory-bank/progress.md
touch memory-bank/techContext.md
touch memory-bank/systemPatterns.md
echo "β
Setup complete! Files created:"
echo " - CLAUDE.md"
echo " - .clinerules"
echo " - .claude/rules/"
echo " - memory-bank/"
echo ""
echo "Next steps:"
echo " 1. Customize CLAUDE.md with your project details"
echo " 2. Run 'claude auth' to authenticate Claude Code"
echo " 3. Configure Cline with your API key"// end of recommended setup guide
based on claude-code-cline-guide v2.0 Β· last updated May 2026