Next Steps for Amateur Claude Users: Web UI to CLI to MCP Servers
Next Steps for Amateur Claude Users: Web UI to CLI to MCP Servers
If you are using Claude through the web app and wondering what all the hype is about, you are missing the biggest productivity jumps. The progression from web UI to CLI to MCP servers is where the real power unlocks - and most people stop at step one.
Where Most People Get Stuck
The web UI is great for one-off questions and document work. It is genuinely useful. But it has a hard ceiling: you cannot give Claude access to your actual files, you cannot run multiple agents in parallel, and the context resets every conversation.
Most developers who try Claude Code for the first time say they never went back to the web app for development work. That is how different the experience is.
Jump 1: Web UI to Claude Code CLI
The biggest single productivity jump is switching from the web interface to Claude Code, Anthropic's command-line tool. The differences that matter:
File system access - Claude reads and edits your actual project files directly. No more copy-pasting code snippets back and forth. You point it at a directory and it operates on your actual code.
Direct execution - Claude runs commands, tests code, reads error output, and fixes based on that output - all in the same session. The feedback loop collapses from minutes to seconds.
CLAUDE.md for persistent context - Create a CLAUDE.md file in your project root with your conventions, architecture decisions, and preferences. Claude reads this at the start of every session. This is the closest thing to persistent memory the CLI offers natively.
Multiple instances - Run several Claude Code instances in parallel across different terminal tabs. Each gets a separate context, each works on a separate task simultaneously.
Install and get started:
npm install -g @anthropic-ai/claude-code
cd your-project
claude
Create a CLAUDE.md in your project root:
# Project: [Your Project Name]
## Tech Stack
- Node.js 22, TypeScript, Express
- PostgreSQL via Prisma ORM
- Jest for testing
## Conventions
- Use functional components, no classes
- Error handling: always return Result types, never throw
- All async functions should be named with Async suffix
- Tests live in __tests__ alongside source files
## Current Focus
[What you are working on right now]
The CLAUDE.md file is what makes each session feel continuous. Claude reads it fresh every time, so your conventions and context carry over without you re-explaining them.
Jump 2: CLI to MCP Servers
MCP (Model Context Protocol) is an open standard that lets Claude connect to external tools. Without MCP, Claude can read files and run terminal commands. With MCP, it can control browsers, query databases, interact with APIs, and manipulate native desktop apps.
Each MCP server you add is a new capability set. The server exposes tools; Claude calls them automatically when the task requires it.
Adding MCP servers in Claude Code:
# Add the Playwright MCP server for browser control
claude mcp add playwright npx @playwright/mcp@latest
# Add the GitHub MCP server for repository management
claude mcp add github npx @modelcontextprotocol/server-github
# Verify what's configured
claude mcp list
Or edit the config file directly at ~/.claude.json:
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["@playwright/mcp@latest"]
},
"github": {
"command": "npx",
"args": ["@modelcontextprotocol/server-github"],
"env": {
"GITHUB_PERSONAL_ACCESS_TOKEN": "your_token_here"
}
}
}
}
Which MCP Servers to Start With
The recommendation from experienced Claude Code users: three servers is the sweet spot, five is the maximum before token overhead hurts performance. Start small:
Playwright - browser control. Claude can navigate websites, fill forms, scrape data, and test web apps. This is the highest-leverage first MCP server for most developers.
# After adding Playwright, Claude can do things like:
# "Go to our staging site, log in with test credentials, and verify the checkout flow works"
GitHub - repository management. Claude can read PRs, leave comments, check CI status, and create issues directly.
Filesystem or SQLite - if you work with data files or a local database, direct read/write access removes a lot of friction.
The key question: what do you spend the most time manually doing in your browser or terminal? That is the MCP server to add first.
Jump 3: From MCP to Autonomous Agents
Once you have MCP servers configured, the next step is letting agents run autonomously on longer tasks. The combination of file system access, execution capability, and tool access (browser, APIs, databases) means an agent can handle a complete workflow end to end.
A practical example - this task runs autonomously with Playwright and GitHub MCP:
Check the three oldest open issues in our GitHub repo. For each one:
1. Try to reproduce the issue locally
2. Write a failing test that captures the bug
3. Leave a comment on the issue with the test and your diagnosis
This would take a developer 30-60 minutes. With MCP-enabled Claude Code, you set it running and review the output.
The Learning Curve Is Real but Short
Claude Code has a steeper onboarding than the web UI. You need to understand CLAUDE.md, know which MCP servers to configure, and get comfortable with giving the agent autonomy to make file changes.
The investment is roughly a few hours of setup and experimentation. After that, the productivity return is persistent and compounds as you add more MCP servers and develop better CLAUDE.md files.
The web UI is step zero. Each jump from there multiplies what you can do with the same model.
Fazm is an open source macOS AI agent. Open source on GitHub.