How to use Claude Code for coding

codingbeginner6 min read6/4/2026

I Spent a Week Coding with Claude Code—Here's What Actually Works

Last Tuesday, I hit a wall. I was staring at a TypeScript error that said Type 'undefined' is not assignable to type 'string' across 47 files in a React Native project I inherited. The previous dev had left no tests, no comments, and a pattern of passing undefined through six layers of props like a hot potato. My usual approach—grep, fix one file, rinse, repeat—would take two days.

I opened my terminal, typed claude code, and watched it rewrite the entire prop typing in under four minutes. Seven files changed. Zero regressions (I checked). That's when I stopped treating Claude Code as a toy and started using it like a senior dev who never sleeps.

Here's exactly how I use it, what breaks, and where you'll waste time if you're not careful.

What Claude Code Actually Is

Claude Code is Anthropic's terminal-based coding agent. It runs in your existing project directory, reads your files, and can edit them directly. Unlike Cursor or GitHub Copilot's chat, this thing operates on your file system—it can git commit, run tests, and even npm install dependencies mid-conversation.

I tested it on macOS (Apple Silicon), but it works on Linux and Windows via WSL2. Installation is one line:

npm install -g @anthropic-ai/claude-code

Then authenticate with your API key. You'll need a paid Anthropic account—the free tier won't cut it for anything beyond toy projects.

The Setup That Saved Me Hours

Before you ask Claude to do anything, run this in your project root:

claude code

This opens an interactive session. The first thing I do is give it context:

I'm working on a React Native app with TypeScript. The project uses:
- React Navigation v6
- Redux Toolkit for state
- Jest + React Native Testing Library for tests
- No linter currently configured

Read the package.json and tsconfig.json, then tell me what you understand about the project.

This is critical. Claude Code will scan your project structure and remember it for the session. I've found it retains context for about 20-30 minutes of active conversation before it starts forgetting file paths. If you're working on something complex, restart the session every hour.

Real Example: Refactoring a Messy Component

Here's where Claude Code shines. I had a UserProfile component that was 800 lines long, mixing API calls, form state, and rendering. I gave it this prompt:

Find all components in src/components that are over 300 lines. 
For each one, suggest a refactoring plan that splits it into:
- A custom hook for logic
- A presentation component for rendering
- Keep the same public API (props interface)

Write the plans to REFACTOR.md, then ask me before making changes.

Claude Code responded by reading every .tsx file in the directory, identifying three bloated components, and writing a detailed plan. Then it asked permission to proceed. I said yes, and it:

  1. Created useUserProfile.ts with all the state logic
  2. Created UserProfileView.tsx with just the JSX
  3. Updated the original UserProfile.tsx to compose the two
  4. Ran npx tsc --noEmit to check for type errors
  5. Showed me the diff

The whole thing took about 90 seconds. Here's what the diff looked like:

- const UserProfile: React.FC<UserProfileProps> = ({ userId, onError }) => {
-   const [user, setUser] = useState<User | null>(null);
-   const [loading, setLoading] = useState(true);
-   const [error, setError] = useState<string | null>(null);
-   
-   useEffect(() => {
-     fetchUser(userId).then(setUser).catch(setError).finally(() => setLoading(false));
-   }, [userId]);
-   
-   // 200 more lines of rendering...
- }

+ const UserProfile: React.FC<UserProfileProps> = (props) => {
+   const { user, loading, error } = useUserProfile(props.userId);
+   return <UserProfileView user={user} loading={loading} error={error} onError={props.onError} />;
+ }

Where It Breaks (And How to Fix It)

I've hit three hard limits so far.

1. It hallucinates file paths. I asked it to "update the auth middleware" and it created src/middleware/auth.ts when the actual file was at server/middleware/auth.js. Fix: always specify full relative paths in your prompts.

2. It can't handle circular dependencies. When I asked it to refactor a module with circular imports, it created files that couldn't compile. The error messages were cryptic. Fix: run npx madge --circular src/ before asking for refactors, and tell Claude about any cycles upfront.

3. It forgets test files. I asked it to "add error handling to the API client" and it updated the source file but didn't touch the corresponding test file. When I ran tests, they failed because the mock data didn't match the new types. Fix: explicitly say "also update the test file at src/__tests__/api.test.ts to match."

The Prompt Pattern That Never Fails

After dozens of sessions, I've settled on a structure that works 90% of the time:

Context: [one sentence about the project]
Task: [one sentence about what to do]
Constraints: [list of things it must NOT do]
Verification: [how to check it worked]

Example:

Context: This is an Express.js API with Prisma ORM.
Task: Add pagination to the GET /users endpoint. Use cursor-based pagination with the `cursor` and `take` query params.
Constraints: 
- Don't modify the existing response shape—add `cursor` and `hasMore` fields
- Keep the existing error handling pattern
- Don't install any new packages
Verification: Run `npm test` and confirm all existing tests pass, then check the endpoint returns paginated data.

This works because Claude Code gets confused by ambiguity. If you say "improve performance," it'll rewrite your whole codebase. If you say "add Redis caching to the GET /users route with a 60-second TTL," it nails it.

The Debugging Workflow That Actually Works

When something breaks, I don't ask "why is this broken?"—that leads to generic advice. Instead, I do this:

I'm getting this error when running `npm run build`:

[ERROR] src/api/users.ts:42:3 - error TS2322: Type 'string | undefined' is not assignable to type 'string'

Here's the relevant code from line 40-50:

export function createUser(name: string | undefined): User {
  return { name }; // Error here
}

Read the full file, find why name might be undefined at the call site, and suggest a fix that doesn't change the function signature.

Claude Code will trace the call stack, find the source of the undefined, and propose a fix. It found a case where a route handler wasn't validating the request body before calling createUser. Saved me 20 minutes of manual tracing.

The One Thing I Wish I Knew Earlier

Claude Code has a --resume flag that lets you pick up where you left off. But here's the trick: it only works if you save the session. Do this:

claude code --resume

If you see "No previous session found," you either never had one or you closed the terminal without saving. Sessions auto-save on exit, but if you force-quit the terminal, you lose it.

Also, Claude Code writes to your files without asking by default. I lost a config file this way. Add this to your .claude project file (create it in your project root):

ask_before_edit: true
safe_files:
  - "*.env"
  - "node_modules/**"
  - ".git/**"

This saved me from accidentally committing API keys to a public repo.

Your Next Step (Don't Skip This)

Close this article. Open your terminal. Navigate to a small project you know well—something with less than 20 files. Run claude code and type:

Read every file in this project. Then tell me three things:
1. What's the most likely bug someone would hit?
2. What's the most duplicated code?
3. What's one refactoring that would improve maintainability without changing behavior?

Then ask me before making any changes.

Watch what it says. You'll probably be surprised at what it catches—I was. My "simple" todo app had a race condition in the state management that I'd missed for months.

That's the real power of Claude Code: not writing code for you, but showing you the things you've been overlooking. Use it like a code reviewer who reads every file, not a code generator, and you'll never go back.

Related Agent

C

Claude Code

Anthropic's AI-powered coding agent that helps you write, edit, and review code

Read more →