Claude Code in action — Workflows thực tế

/init — first thing mỗi project

Claude:

CLAUDE.md example

• Scan codebase structure
• Read README, package.json, main files
• Identify: languages, frameworks, patterns, commands
• Generate CLAUDE.md

cd my-project
claude
> /init

CLAUDE.md example

Auto-generated. Review + customize.

Future sessions

CLAUDE.md loaded automatically. Claude knows:

Don't need re-explain.

• Build commands
• Coding style
• Architecture

# Claude Code instructions for my-project

## Project overview
React + TypeScript SPA. PostgreSQL backend via GraphQL.

## Build & test
- `npm run dev` — dev server
- `npm run build` — production build
- `npm test` — run tests
- `npm run lint` — ESLint check

## Coding conventions
- Use functional components with hooks (no classes)
- Prefer TypeScript strict mode
- Tests alongside component: `foo.tsx` + `foo.test.tsx`

## Architecture
- `src/components/` — presentation
- `src/hooks/` — reusable logic
- `src/api/` — GraphQL queries/mutations
- `src/lib/` — utilities

Workflow 1: Context → Plan → Implement

Step 1: Context

Claude reads, understands existing pattern.

Step 2: Plan (NO CODE YET)

> Read src/auth/login.tsx and related files

Step 2: Plan (NO CODE YET)

Claude:

> Plan to add two-factor authentication.
> Do NOT write code yet. Just outline the approach.

Workflow 1: Context → Plan → Implement (tiếp)

Review plan. Adjust:

Plan:
1. Add 2FA setup screen in /settings/security
2. Store TOTP secret in users table (new migration)
3. Add /auth/verify-2fa endpoint
4. Update login flow: after password, check if 2FA enabled → prompt code
5. Add hook `useTwoFactor()` for state management
6. Tests: unit + integration

Workflow 1: Context → Plan → Implement (tiếp)

Step 3: Implement

> Good. Also add: backup codes (6 codes user downloads once).

Step 3: Implement

Claude execute step-by-step:

Each step visible → can interrupt if going wrong.

Why 3 steps?

• Create migration
• Add components
• Add endpoint
• Write tests
• Run tests
• Plan cheap to fix. Code expensive.
• Catch misunderstanding early.
• Claude's plan often better than your first sketch.

> Implement the plan

Workflow 2: Test-Driven (TDD)

Flow:

TDD particularly powerful với Claude — clear success criteria, Claude can iterate until tests pass.

• Tests written first
• Tests fail (RED)
• Implement
• Tests pass (GREEN)
• Claude runs tests to verify

> Read src/lib/date-utils.ts

> Brainstorm test cases for new function `format_relative_time(date)` 
  that returns "2 hours ago", "yesterday", etc.

> From that list, select 8 most important. Write tests in date-utils.test.ts.
  Tests should fail initially since function doesn't exist.

> Now implement `format_relative_time` to pass all tests.

Workflow 3: Bug fixing

Claude:

Structured + verifiable.

• Grep for "api/users"
• Read handler
• Write test (verify fails)
• Edit handler
• Run tests (pass)

> There's a bug: /api/users returns 500 when user doesn't exist, 
  should return 404.

> 1. Find the relevant handler
> 2. Write failing test for the 404 case
> 3. Fix the handler
> 4. Run tests to confirm

Workflow 4: Refactor

Claude:

• Analyze component
• Propose split (e.g., Header, Bio, Actions subcomponents)
• Execute refactor with Edit
• Verify via npm test

> Read src/components/UserProfile.tsx

> This component is 400 lines. Plan how to split into smaller components.

> Do the refactor. Keep same behavior. Run tests after.

Workflow 5: Learning codebase

Onboarding tool — faster than reading docs.

> What are the main patterns in this codebase? Show 2-3 examples.

> How does authentication work end-to-end?

> Generate a diagram (ASCII) of the main data flow.

command — enforce rules

Found pattern Claude missed? Add rule:

Claude asks: project / local / user. Choose appropriate.

Future sessions: Claude follows rule automatically.

> # Always prefer `useCallback` for event handlers passed to child components
> # Prefix private helper functions with underscore

Multi-step with TodoWrite

Claude Code auto-uses TodoWrite for long tasks:

Claude creates todos:

> Implement user dashboard redesign:
> - New layout
> - Chart widgets
> - Responsive
> - Tests

Multi-step with TodoWrite (tiếp)

Marks complete as progress. Visible trackable.

● Design new layout (in_progress)
● Implement chart widgets
● Add responsive breakpoints
● Write tests

Handling large changes

Claude Code hadsome safety:

Review prompts. Don't just press Yes blindly.

• Confirms destructive ops (rm -rf, force push)
• Shows diff before write
• Respects .gitignore
• Won't run untrusted scripts without asking

Best practices

1. One task per session

Fresh /clear for unrelated tasks. Prevents context pollution.

2. Commit frequently

Claude + git = magic. Commit after each working state. Easy rollback.

3. Review generated code

Don't ship without read. Claude sometimes:

4. Use extended thinking for hard problems

(CLI flag or prompt pattern)

Claude reason more carefully.

5. Cost monitor

• Over-engineers
• Misses edge case
• Inconsistent style (unless CLAUDE.md sharp)

> --think "Fix this race condition bug"

5. Cost monitor

Check spend per session. Tune down model if hitting limits.

> /cost

Common sessions

Daily — morning standup

5-min summary.

Weekly — tech debt

cd project
claude
> What changed since yesterday? Summarize from git log.
> Any CI failures I should look at? Check GitHub Actions.

Weekly — tech debt

Prioritized backlog.

Code review

> Analyze codebase for technical debt. List top 5 items với impact estimate.

Code review

Second pair of eyes.

Documentation

> Review PR #123 changes. Focus on correctness, security, performance.

Documentation

Auto-sync docs.

> Update README to reflect the new features added this week.

Headless usage (automation)

Claude Code runs without interactive:

Use trong CI/CD, cron jobs.

claude -p "Run linter, fix all auto-fixable issues, commit with message 'chore: lint fixes'"

Anti-patterns

❌ "Just build it"

Too vague. Claude ships sub-par attempt.

Fix: Break down. Plan first. Iterate.

❌ No CLAUDE.md

Every session Claude re-learn codebase.

Fix: /init ngay first session. Update over time.

❌ Skip plan step

Jump to implement → Claude misdirected → rewrite.

Fix: Always plan first for non-trivial tasks.

❌ Ignore Claude's plan feedback

Claude says "Warning: this approach has X issue". Ignore → bug.

Fix: Read plans carefully. Engage.

❌ Full codebase write access in prod

Claude makes mistake → merge directly.

Fix: Always feature branch + PR review.

> Build a full e-commerce site

Áp dụng ngay

Bài tập 1: 3-step workflow (30 phút)

Pick real feature you want add. Run:

Compare vs single-shot. Quality usually much higher.

Bài tập 2: TDD workflow (30 phút)

New function needed? Try TDD:

Note quality + maintainability.

• Context: feed 3-5 relevant files
• Plan: detailed, no code
• Implement: execute
• Brainstorm tests
• Write tests (fail)
• Implement
• Verify pass

Tóm tắt

🎯 3-step workflow: Context → Plan → Implement. Best practice.

🎯 /init tạo CLAUDE.md. Commit + share với team.

🎯 TDD với Claude Code — tests first, Claude iterate to pass.

🎯 # command ghi rules dynamically.

🎯 Commit frequently — rollback easy.