Loading lesson…
Loading lesson…
Claude Code provides a rich set of operational commands for efficient AI collaboration. These commands fall into categories: Slash commands (built-in features), symbol system (short operations), and natural-language instructions (daily development).
Slash commands are built-in operations that start with /. They provide standardized actions such as project initialization, config management, and status checks.
| Command | Function | Use scenario |
|---|---|---|
/help | Show all commands | quick lookup when you forget commands |
/init | Initialize project and generate CLAUDE.md | new project or adding config |
/plan | Enter planning mode | create plan before complex tasks |
/clear | Clear conversation history | restart when context is messy |
/compact | Compress context | save tokens after long chat |
/diff | Open interactive diff view | inspect current uncommitted changes |
/plugin | Manage plugins | install commit/review extensions |
/context | Show context usage | optimize token cost |
/cost | Show session cost | monitor usage cost |
/config | Open config panel | update settings |
/permissions | Permission management | adjust operation permissions |
/model | Switch model | choose different models |
Command-combination example:
# complete development workflow
/plan # 1. create plan
# ... execute development ...
/diff # 2. inspect changes
Generate a commit message from current diff
!git add -A # 3. stage changes
!git commit -m "..." # 4. commit
/cost # 5. check cost
Symbol system is Claude Code's shorthand operation mechanism. Special symbols quickly trigger specific capabilities.
| Symbol | Name | Purpose | Example |
|---|---|---|---|
/ | Slash command | execute built-in operation | /help, /plan |
@ | At reference | reference file/directory | @src/app.tsx |
! | Bang mode | run terminal command | !npm test |
& | Background run | run task in background | &npm run dev |
Symbol combination tips:
# combine symbols
@src/utils.ts !npm test
# meaning: read utils.ts, then run tests
@src/components/ @src/pages/ compare structures of these two directories
# meaning: reference two directories simultaneously for comparison
!git diff @src/app.tsx explain these changes
# meaning: inspect Git diff and ask Claude to explain specific file changes
File operations are the most common daily actions: read, edit, create, and delete files.
Read files:
# basic read
@src/app.tsx explain this file
# read + analyze
@src/utils/helpers.ts find potential performance issues
# compare read
@src/components/OldButton.tsx @src/components/NewButton.tsx compare differences
Edit files:
# simple edit
Modify formatDate in src/utils/date.ts to support Chinese locale format
# complex edit
@src/api/users.ts Refactor this file:
1. Extract duplicated error handling into shared handleError
2. Replace Promise chains with async/await
3. Add JSDoc comments
# batch edit
Convert all class components under src/components/ into function components
Create files:
# create one file
Create src/components/UserCard.tsx, a card component to display user info
# create related files
Create user module:
1. src/types/user.ts - define User interface
2. src/api/users.ts - user API calls
3. src/components/UserCard.tsx - user card component
4. src/hooks/useUser.ts - hook to fetch user data
Delete files:
# delete with confirmation
Delete src/old-component.tsx (this component is no longer used)
# Claude asks for confirmation and may suggest checking references first
Claude Code deeply integrates with Git so you can complete full version-control workflow without leaving terminal.
Check status:
# show Git status
Show git status and uncommitted changes
# detailed diff
!git diff
Explain changes in src/api/users.ts
Create commits:
# inspect changes
/diff
# generate commit message
Generate a Conventional Commit message from current git diff
# commit manually
!git add -A
!git commit -m "..."
Branch operations:
# create feature branch
!git checkout -b feature/user-authentication
# after implementation
Generate commit message based on current changes
!git add -A
!git commit -m "..."
!git push -u origin feature/user-authentication
Complete Git workflow example:
# 1. start new feature
!git checkout -b feature/payment-integration
# 2. develop feature (with Claude assistance)
Create payment module with Alipay and WeChat Pay
# 3. run tests
!npm test
# 4. inspect changes
/diff
# 5. generate and confirm commit message
Generate a Conventional Commit message from current git diff
!git add -A
!git commit -m "..."
# 6. push remote
!git push -u origin feature/payment-integration
# 7. create PR (optional, with GitHub CLI)
!gh pr create --title "feat: add payment integration" --body "Support Alipay and WeChat Pay"
Code operations are Claude Code's core strengths: generation, explanation, refactoring, and optimization.
Generate code:
# generate component
Create a React Hook to manage auth state, including login/logout/permission checks
# generate utility function
Create a date-formatting utility that supports relative time (e.g. "2 hours ago")
# generate complete module
Create order module with:
- order list page
- order detail page
- create-order API
- order status management
Explain code:
# line-by-line explanation
Explain src/algorithms/quicksort.ts line by line
# high-level explanation
@src/services/payment.ts explain architecture design of this module
# explain complex logic
Explain what reduce in src/utils/dataTransformer.ts is doing
Refactor code:
# architecture refactor
Convert class components in src/components/ to function components
# performance refactor
Optimize rendering performance in src/App.tsx, reduce unnecessary re-renders
# cleanup refactor
@src/utils/helpers.ts Refactor this file:
1. Delete unused functions
2. Extract repeated logic into shared utilities
3. Add type definitions
4. Improve function naming
Debug code:
# error analysis
npm test failed, analyze root cause and fix it
# performance analysis
@src/components/DataTable.tsx This component renders slowly, find bottlenecks
# log analysis
!cat logs/error.log
Analyze these error logs and identify root cause
Testing is essential for quality assurance. Claude Code can help generate tests, run tests, and analyze results.
Generate tests:
# unit tests
Generate unit tests for src/utils/math.ts, including boundary cases
# component tests
Generate React Testing Library tests for src/components/UserForm.tsx
# integration tests
Create integration test for user registration flow from form submission to DB write
Run and debug tests:
# run tests
!npm test
# debug failed tests
Analyze failure reasons and fix
@tests/auth.test.ts
# coverage check
!npm run test:coverage
Which code paths are not covered?
Testing strategy suggestion:
I added user authentication. Please:
1. Generate unit tests for auth.service.ts
2. Generate component tests for LoginForm
3. Run all tests and ensure pass
The most efficient way to use Claude Code is chaining commands into complete workflows.
Scenario 1: bug-fix workflow
# 1. inspect issue
!npm test
Tests failed, analyze why
# 2. locate issue
@src/utils/validation.ts Is the issue in this file?
# 3. fix issue
Fix isEmail in validation.ts to correctly handle addresses containing +
# 4. verify fix
!npm test
# 5. commit fix
Generate a fix-type commit message from current diff
!git add -A
!git commit -m "fix: ..."
Scenario 2: code review workflow
# 1. inspect changes
!git diff --stat
Which files changed?
# 2. detailed review
@src/components/ Review these component changes
# 3. suggest improvements
What improvements should be made based on this review?
# 4. implement improvements
Optimize performance of UserList component
# 5. final review
/diff
Review current changes and point out potential risks and improvements
Scenario 3: new feature workflow
# 1. plan first
/plan
I want to add shopping cart feature
# 2. create branch
!git checkout -b feature/shopping-cart
# 3. implement feature
Implement step by step according to plan
# 4. add tests
Generate tests for shopping cart module
# 5. run tests
!npm test
# 6. code review
/diff
Please do a code review on current diff
# 7. commit
Generate commit message for this feature development
!git add -A
!git commit -m "feat: ..."
!git push