CandidDevelopers
$catrecommended-setup.md

// 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.

v2.0|16 sections|source
section 01

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.

πŸ“ŒThis Guide Is a Recommendation, Not a Mandate
The workflows described here reflect how our team gets the most out of these tools together β€” but they're not obligatory. What is required is that you use your API key (DeepSeek, Kimi K2.6, or another approved provider for Cline) and your Claude Code account (Team Premium seat).

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

Terminal
bash
# Using npm (recommended)
npm install -g @anthropic-ai/claude-code

# Using Homebrew
brew install claude-code

# Verify installation
claude --version

Step 2: Authenticate the CLI

Terminal
bash
claude auth

This opens a browser window to link your Anthropic account.

Step 3: Install VS Code Extension

  1. Open Extensions view (Cmd/Ctrl+Shift+X)
  2. Search for β€œClaude Code”
  3. Install the extension published by Anthropic

Install Cline

Cline is an open-source, model-agnostic coding agent installed directly as a VS Code extension.

  1. Open Extensions view (Cmd/Ctrl+Shift+X)
  2. Search for β€œCline”
  3. Install the extension with ID saoudrizwan.claude-dev
πŸ“ŒNote
Cline is also available for JetBrains IDEs and as a global CLI tool via npm install -g cline.
section 02

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

API ProviderOpenAI Compatible
Base URL<your-api-base-url>
Model ID<your-model-id>
API KeyProvided per developer

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.

Terminal
bash
# 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
claude

Configuration 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.

section 03

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 range

Plan Mode

For complex tasks, use the /plan command to generate a step-by-step markdown plan before execution.

Plan Mode Example
markdown
/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 tests

CLAUDE.md Project Context

Create a CLAUDE.md file in your project root to provide persistent instructions:

CLAUDE.md
markdown
# 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 calls
⚠️Important
Commit CLAUDE.md to your Git repository so all team members benefit from the same context.

Agent Teams (Team Premium)

Run multiple Claude instances in parallel, working collaboratively on complex tasks:

Agent Teams
bash
# 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/Up
🚨Warning
Agent Teams multiply token usage β€” each agent has its own context window. Best for large, parallelizable tasks.
section 04

Cline 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
markdown
# .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 classes
section 05

Project 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

πŸ“˜
CLAUDE.mdβ€” Onboarding handbook for Claude Code

Static, team-shared instructions. Loaded at every session start.

πŸ“—
.clinerulesβ€” Onboarding handbook for Cline

Equivalent to CLAUDE.md but for Cline. Should mirror same standards.

🧠
Memory Bankβ€” Dynamic project state (Cline)

Structured folder tracking progress, context, architecture decisions.

βš™οΈ
Rules & Hooksβ€” Conditional rules (Claude Code)

Path-scoped rules that load only when relevant. Hooks enforce rules via scripts.

Recommended Repository Structure

Project Structure
plaintext
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.json
section 06

Unified 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.

⚑ Claude CodeAnthropic Models

Your strategic architect. Best for:

  • β†’ Complex multi-file refactoring
  • β†’ MCP-powered integrations
  • β†’ Autonomous test-fix-iterate loops
  • β†’ Codebase-wide analysis & planning
🎯 Clinedeepseek-v4-pro

Your precision executor. Best for:

  • β†’ Quick feature implementation
  • β†’ Step-by-step approval workflows
  • β†’ Safe experimentation with checkpoints
  • β†’ Rapid prototyping & UI work
⚠️Important
Both tools share the same VS Code workspace. Changes made by one are immediately visible to the other.

Real-World Workflow Scenarios

πŸ—οΈ Building a New Feature

1

Claude Code β€” Use /plan to architect the solution. Analyze existing code, propose file structure.

2

Cline β€” Implement the feature file-by-file using Plan/Act mode. Leverage checkpoints for safe iteration.

3

Claude Code β€” Run the autonomous test loop: execute tests, read failures, fix issues, re-run until green.

πŸ› Debugging a Complex Bug

1

Claude Code β€” Analyze the codebase: find all code paths that could cause the issue.

2

Cline β€” Apply targeted fixes one at a time, reviewing each diff. Use checkpoints to test approaches.

3

Claude Code β€” Verify fix across the codebase: run full test suite, check for regressions.

πŸš€ Quick Prototyping

1

Cline β€” Rapidly scaffold UI components using Plan/Act. Create checkpoints before each major change.

2

Cline β€” Iterate quickly: if an approach doesn't work, revert to checkpoint and try again.

3

Claude Code β€” Once solid, use Claude Code to refine, add tests, and prepare for production.

section 07

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.

Terminal
bash
# Store your GitHub Personal Access Token
export GITHUB_TOKEN="ghp_your_token_here"
πŸ’‘Tip
Create a fine-grained token with read access to issues/PRs and write access to code/PRs, scoped to relevant repositories only.
section 08

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.

section 09

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.

πŸ’‘Tip
When handing off work from one tool to another mid-task, always give the receiving tool context about what the other just did. Include file paths and a summary of changes.
Handoff Example
markdown
# 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."
section 10

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.

section 11

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.

section 12

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 context
Shift+TabToggle auto-accept mode

Cline Tips

Plan β†’ ActAlways plan before acting
CheckpointsAuto-created at key moments
.clinerulesProject-specific standards
Memory BankPersistent context across sessions
Human approvalRequired for all file changes
Auto-approveOptional for read-only ops
RevertRoll back to any checkpoint
section 13

Prompting 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"

section 14

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.

πŸ’‘Tip
Be precise with @-mentions, use /compact when context grows large, and avoid Agent Teams for small tasks.
section 15

.gitignore

Add these entries to your .gitignore to keep sensitive and local-only files out of version control:

.gitignore
gitignore
# 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/
⚠️Important
DO commit: CLAUDE.md, .clinerules, memory-bank/, .claude/settings.json, .claude/rules/. These are shared team resources.
section 16

Setup Script

Run this script to scaffold the recommended directory structure for a new project:

setup.sh
bash
#!/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