Claude Code Best Practices for Web Development
I’ve been using Claude Code to build runyournumber.com — a personal finance calculator — mostly in one to two hour sessions after work. These are my practical notes from that experience: what works, what doesn’t, and a few things I wish I’d known earlier.
Start Small
It’s much better to start small, get something concrete working, then build on top of it incrementally. This mirrors how I write software normally — start with a few lines, grow to a function, then another function. Don’t try to build too much at once, especially early on. The process is inherently iterative: look at what you have, decide what to build next, repeat.
Two Modes: Plan Mode and Accept Edits
Claude Code has two main modes. The first is Plan Mode, and the second is Accept Edits, which is the execution mode.
Before diving into implementation, use Plan Mode to clarify the task: what needs to be done, how the system should be designed, and how different components interact. Once in Plan Mode, Claude will ask clarifying questions and typically offer around four options. The first three are usually concrete proposals, with the first one being recommended. There’s also a free-text input where you can type your own prompt. You don’t have to pick just one option — you can combine them, for example choosing options two and three together.
Once you’ve figured out what you want to implement, Claude automatically switches to Accept Edits mode. This is where the agent executes your plan — writing scripts, writing code, and completing your task. You can press Ctrl+B to see what the agent is doing under the hood.
Stay in Design Mode Longer Than You Think
Even when Claude says the design is ready to implement, I usually push for more clarifying questions. Fast implementation is great, but not if you end up building the wrong thing. Wasted implementation time also means wasted tokens. I’ve told Claude explicitly: “I’m not in a rush to implement — I want a clear, complete design first.”
memory.md
Everything you want the agent to remember should go into the memory.md file. This file is injected into the system prompt, so the agent will remember its contents across sessions. A good practice is to ask the agent to update memory.md after each design and implementation phase, so the repository and documentation stay in sync. When you return to a project after a break, memory.md also serves as a progress tracker — a quick way to catch up on where things stand.
Sub-Agents
Claude Code supports sub-agents. Type /agents to enter sub-agent mode, where you can create a new agent and assign it a color for easy identification in the terminal. When creating an agent, you describe its role, responsibilities, and name. For example, I have:
- A UX Specialist agent for design reviews
- A Senior Engineer agent for code reviews and architecture discussions
- A Savvy Finance User agent that simulates an actual user of my calculators
You only need to provide a short description and Claude will generate a full prompt for the agent. For example: “A financial user, ~40 years old, married with two kids, has a mortgage and car payment, household income around $100K.” The main agent builds out the persona from there, and you can trigger this agent whenever needed.
Run Multiple Terminals in Parallel
You can open multiple terminals and run a separate Claude Code instance in each. I use this to parallelize work — for example, running design and implementation in one terminal while doing market research in another. These tasks read and write different files, so they don’t interfere. In the market research terminal, the agent searches the web, reads large amounts of content, and synthesizes findings. The detailed view lets you follow along — you can see what the agent is reading, how it’s reasoning, and what questions it has. Note that this is different from Claude’s experimental Agent Teams feature, which coordinates multiple agents differently.
Best Interface: CLI in VS Code
I’ve tried Claude Code via the web interface, mobile app, desktop app, and the CLI in VS Code. The CLI in VS Code is by far the most stable. The mobile and web versions sometimes fail to execute tool calls accurately and may complain that certain features aren’t available in the environment. For reliable, fast work, the VS Code CLI is the way to go.
Use Screenshots When Stuck
When setting up servers or online services and you’re not sure what to do, take a screenshot and paste it into Claude Code. Claude can read the image and guide you through it. This is surprisingly useful.
AI May Suggest Different Tooling Each Time
When I was building runyournumber.com, the agent suggested using a GitHub plugin to let it autonomously commit and push. On my next project, it suggested completely different tooling for the same kind of workflow. The lesson: keep things simple when asking Claude to implement a design, and don’t ask for too much at once.
Pro Plan vs. Max Plan
I started on the Pro plan, which is enough to bootstrap a working website. But as the project grew and I needed more features, I kept hitting rate limits — sometimes within 30 minutes of actively writing code. I upgraded to the Max plan so I could work without interruption, which matters when you only have an hour or two per day. Note: if you switch mid-month from Pro to Max, you’re only charged the prorated difference — not the full $100. It might end up being around $80 or so after a few days in Pro plan.
Claude Code is still evolving, and not everything works perfectly every time. But if you’re a developer with limited hours and a side project you’ve been putting off, it’s worth trying. Start small, stay in Plan Mode longer than feels necessary, and adjust as you go.