YouTip LogoYouTip

Home > Uncategorized > Claude Code Basic

Claude Code Basic

📅 2026-06-24 | 📂 Uncategorized
```html\n\n\n\n \n Claude Code Basic Usage | Online Tutorial\n\n\n

Introduction to Claude Code's Core Features for Daily Development

\n

This chapter introduces the most commonly used core features of Claude Code in daily development, including how to interact with Claude, read and modify code, execute commands, handle files, and some practical tips that can significantly improve efficiency.

\n\n
\n\n

Basic Interaction Methods

\n\n

1. Interactive Mode (Most Commonly Used)

\n

Start Claude Code in the project directory and enter interactive mode to directly input questions or instructions:

\n 
cd /path/to/your/project\nclaude
\n

In interactive mode, you can directly input natural language without any special formatting:

\n
    \n
  • What is this project about?
    • \n
  • Help me find the bug in src/auth.ts
    • \n
  • Add a getUserById method to UserService
    • \n
\n

You can specify files using the @ symbol. For example, if there's a test.html file in the claude-test directory:

\n Image 1\n

We can navigate into claude-test:

\n 
cd claude-test
\n

Then ask:

\n 
@test.html What is this file for?
\n Image 2\n\n

2. One-Time Task Mode

\n

If you only need to perform a one-time task without entering interactive mode, you can directly add the task description after the command:

\n 
claude "Explain the scripts field in package.json"
\n

After execution, it will automatically exit, suitable for use in shell scripts or quick queries.

\n\n

3. One-Time Query Mode (-p)

\n

Use the `-p` parameter to execute a one-time query. Claude's response will be directly output to the terminal, suitable for combination with other commands:

\n 
claude -p "What's wrong with this code?" < src/utils.ts\n# Save Claude's analysis result to a file\nclaude -p "Analyze security risks in project dependencies" > security-report.md
\n\n

4. Continue Last Conversation (-c)

\n

Claude Code saves conversation history. Use the `-c` parameter to continue the most recent unfinished conversation in the current directory without re-establishing context:

\n 
claude -c
\n\n
\n\n

Understanding and Analyzing Code

\n\n

1. Understanding Overall Project Structure

\n

When first entering an unfamiliar project, you can let Claude perform an overall analysis:

\n
    \n
  • What is the architecture of this project?
    • \n
  • What are the main technologies and dependencies used?
    • \n
  • Please introduce the project's directory structure.
    • \n
\n

Claude Code will automatically read project files for analysis. **You do not need to manually specify which files to read**, as it will determine which content needs to be viewed itself.

\n\n

2. Analyzing Specific Files or Modules

\n
    \n
  • Explain the working principle of src/middleware/auth.ts
    • \n
  • What methods does the UserRepository class have? What are their purposes?
    • \n
  • What does this SQL query mean?
    • \n
\n\n

3. Tracing Code Call Chains

\n
    \n
  • When a user logs in, what is the code execution flow? List everything from the entry point to the database.
    • \n
  • Where is the findUserByEmail function called?
    • \n
  • Where is the data from this interface finally stored in which database table?
    • \n
\n\n

4. Understanding Complex Logic

\n
    \n
  • What does this recursive function mean? Can you give an example?
    • \n
  • Why is useCallback used here? What happens if it's not used?
    • \n
  • What kind of strings can this regular expression match?
    • \n
\n\n
\n\n

Modifying Code

\n\n

1. Adding New Features

\n

Describe the feature you need, and Claude will find the appropriate location and implement it:

\n
    \n
  • Add an updatePassword method to UserService, requiring validation of the old password.
    • \n
  • Add request rate limiting to the login interface, allowing a maximum of 5 requests per minute from the same IP.
    • \n
  • Create a formatCurrency utility function that supports passing in a currency code parameter.
    • \n
\n\n

2. Fixing Bugs

\n

Describe the problem phenomenon, and Claude will locate the cause and provide a repair solution:

\n
    \n
  • After logging out, refreshing the page still shows the user as logged in. Help me find the cause and fix it.
    • \n
  • This function throws an error when the input is an empty array. Fix it.
    • \n
  • The console reports an error: "Cannot read properties of undefined (reading 'map')". Help me locate and fix it.
    • \n
\n\n

3. Refactoring Code

\n
    \n
  • Split this 500-line component into smaller sub-components.
    • \n
  • Convert callback-style asynchronous code to async/await.
    • \n
  • There is a lot of duplicate code in these functions. Help me extract them into a common function.
    • \n
\n\n

4. Reviewing Modifications

\n

Claude Code will display diffs before modifying files for your review. You can discuss the modification plan proposed by Claude:

\n
    \n
  • Don't change the code yet, just tell me how you plan to modify it.
    • \n
  • Your previous modification had a problem: it didn't handle concurrency. Let's start over.
    • \n
  • This plan is acceptable, but change the function name to validateUserCredentials.
    • \n
\n

> Claude Code will show the modification content and request your confirmation before executing any file modifications. You can choose to **accept (yes)**, **reject (no)**, or continue discussing before confirming. Don't feel like you must accept all modifications at once—first review and confirm when you're satisfied.

\n\n
\n\n

Executing Commands and Tests

\n\n

1. Letting Claude Run Commands

\n

Claude Code can directly execute commands in the terminal. You can describe what you want to do in natural language:

\n
    \n
  • Run tests to see if any fail.
    • \n
  • Install the dayjs dependency.
    • \n
  • Build the project and check for errors.
    • \n
\n

Claude will select the correct command to execute based on project configuration (such as scripts in `package.json` or commands in `CLAUDE.md`).

\n\n

2. Running Specific Tests

\n
    \n
  • Run tests for the auth module.
    • \n
  • Run all tests and generate a coverage report.
    • \n
  • Why did this test fail? Help me fix it.
    • \n
\n\n

3. Viewing Command Output

\n

Claude will use command output as context and directly provide suggestions based on the output content:

\n
    \n
  • Run npm run build. If there are errors, help me fix them.
    • \n
  • Run lint and fix all warnings.
    • \n
\n\n
\n\n

File Operations

\n\n

1. Creating New Files

\n
    \n
  • Create src/utils/date.ts and implement date formatting-related utility functions.
    • \n
  • Create a Docker Compose configuration file containing PostgreSQL and Redis services.
    • \n
  • Create .github/workflows/ci.yml to configure GitHub Actions to automatically run tests.
    • \n
\n\n

2. Searching for Files and Content

\n
    \n
  • Are there any codes handling file uploads in the project? Where?
    • \n
  • Where are localStorage used? Find all files using console.log.
    • \n
\n\n

3. Batch Modifications

\n
    \n
  • Replace http://api.example.com with https://api.example.com in all files.
    • \n
  • Change PropTypes to TypeScript type definitions in all components under src/components/.
    • \n
  • Add JSDoc comments to all interface functions in the src/api/ directory.
    • \n
\n\n
\n\n

Git Operations

\n

Claude Code deeply integrates with Git and can complete almost all Git operations using natural language.

\n\n

1. Viewing Changes

\n
    \n
  • Which files did I modify?
    • \n
  • What changes were made in this commit?
    • \n
  • What were the last 10 commits changed?
    • \n
\n\n

2. Committing Code

\n
    \n
  • Commit this change.
    • \n
  • Commit this modification. The commit message should explain that the login verification bug was fixed.
    • \n
\n

Claude will automatically generate commit messages compliant with standards based on actual changes. You can also use shortcut commands:

\n 
claude commit
\n\n

3. Branch Management

\n
    \n
  • Create a new feature/user-profile branch.
    • \n
  • Switch to the develop branch.
    • \n
  • Merge the latest changes from the main branch.
    • \n
\n\n

4. Handling Merge Conflicts

\n
    \n
  • Help me resolve merge conflicts.
    • \n
  • This file has conflicts. Help me check which version is correct.
    • \n
\n\n
\n\n

Context Management Tips

\n\n

1. Manually Specifying Files

\n

Using the `@file path` syntax allows you to explicitly tell Claude which file to reference, avoiding guessing:

\n
    \n
  • Refer to the type definitions in @src/types/user.ts and add type annotations to UserService.
    • \n
  • Check whether the interface implementation complies with the specifications in @docs/api-spec.md.
    • \n
\n\n

2. Clearing Context

\n

When the conversation has been going on for a long time or you switch to a completely different task, it is recommended to clear the context and start fresh:

\n 
/clear
\n

After clearing, Claude's "memory" returns to its initial state, and the new session is not affected by previous conversation content.

\n\n

3. Compact Context

\n

When you feel that Claude starts "forgetting" previous content or the conversation becomes too long, you can compact the context:

\n 
/compact
\n

This will summarize the current conversation content into a concise summary, freeing up context space while retaining key information to continue working.

\n\n

4. Reasonable Task Decomposition

\n

For complex tasks, do not describe everything at once. It is better to break them down into several steps and complete them step by step:

\n
    \n
  • ❌ Bad practice: Give Claude too many requirements at once:
    • \n 
    "Help me refactor the entire user module, including adding type annotations, splitting files, optimizing database queries, adding caching, writing tests, updating documentation"
    \n
  • ✅ Good practice: Break it down into independent steps:
    • \n
      \n
    1. "Analyze the existing structure of the src/user/ directory and tell me what problems exist."
      2. \n
    2. "First, add TypeScript type annotations to all functions."
      3. \n
    3. "Split files over 200 lines into smaller modules."
      4. \n
    4. "Optimize database queries and add necessary indexes."
      5. \n
    \n
\n\n
\n\n

Common Slash Commands

\n

In interactive mode, typing `/` will pop up a list of all available commands. The following are the most commonly used slash commands:

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
CommandFunctionUsage Scenario
/helpView all available commands and function descriptionsWhen you don't know what functions are available
/clearClear conversation history and start a new sessionWhen switching to a new task
/compactCompact the current conversation context to free up spaceWhen the conversation is long and Claude starts forgetting
/initAnalyze the project and generate a CLAUDE.md fileWhen first using in a new project
/resumeSelect and restore a previous conversation from historyContinuing yesterday's unfinished task
/undoUndo the last file modificationWhen Claude's modification effect is incorrect
/redoRedo a previously undone modificationAfter undoing, realizing the original was better
/loginLogin or switch accountWhen you need to switch to another account
/configView and modify configurationsAdjusting Claude Code behavior settings
/costView token usage for this sessionWhen using an API account, pay attention to costs
\n\n
\n\n

Practical Tips

\n\n

1. Let Claude Analyze First, Then Act

\n

For complex problems, first let Claude explain theApproach, confirm the direction is correct, then proceed with execution:

\n
    \n
  • Do not modify the code yet. First analyze the possible reasons for login failure and list your troubleshootingApproach.
    • \n
  • How do you plan to implement this feature? Describe thePlan first, and I will confirm before writing the code.
    • \n
\n\n

2. Provide Error Information and Logs

\n

When encountering errors, directly paste the error information into the conversation. Claude will locate the problem based on the error content:

\n 
Encountered this error during runtime. Help me analyze the cause:\nTypeError: Cannot read properties of null (reading 'userId')\nat getUserProfile (src/services/user.ts:42:18)\nat async ProfileController.getProfile (src/controllers/profile.ts:15:20)
\n\n

3. Use Screenshots to Describe UI Issues

\n

Claude Code supports multimodal input. You can directly paste screenshots into the conversation to describe UI-related issues:

\n
    \n
  • This button doesn't respond when clicked, but there are no errors in the console. Help me troubleshoot.
    • \n
  • Implement the Header component according to this design.
    • \n
\n\n

4. Use "Continue"

\n

If Claude's response is truncated or you feel it hasn't finished, simply say "Continue":

\n 
Continue\nIs there more? Implement the remaining parts as well.
\n\n

5. Request Explanations for Modifications

\n

For important code modifications, you can request explanations for each change:

\n
    \n
  • After modification, explain the purpose of each change to me.
    • \n
  • Why use Promise.allSettled instead of Promise.all here?
    • \n
\n\n

6. Limit Claude's Scope of Operation

\n

When you don't want Claude toFreely/Arbitrarily modify other files, you can clearly limit the scope:

\n
    \n
  • Only modify src/auth.ts, do not modify elsewhere.
    • \n
  • Only read code, do not modify. Help me analyze the performance bottlenecks of this module.
    • \n
\n\n
\n\n

Common Workflow Examples

\n\n

Workflow One: Quickly Understand a New Project

\n

Example

\n

Step 1: Start and Understand the Project

\n 
> What is this project about? What technologies are used?
\n

Step 2: Understand Directory Structure

\n 
> Introduce the project's directory structure, focusing on core modules
\n

Step 3: Understand How to Run Locally

\n 
> How to run this project locally?
\n

Step 4: Generate Project Description File

\n 
> Help me generate a CLAUDE.md file summarizing the key information of the project
\n\n

Workflow Two: Fix a Bug

\n

Example

\n

Step 1: Describe the Problem

\n 
> User feedback: After modifying personal information, the username at the top of the page is not updated in real time
\n

Step 2: Let Claude Analyze the Cause

\n 
> First analyze the possible causes. Do not modify the code yet.
\n

Step 3: Confirm the Plan and Fix

\n 
> The second reason you mentioned seems more likely. Fix it according to thatApproach.
\n

Step 4: Verify the Fix

\n 
> Run relevant tests to confirm the fix is effective
\n\n

Workflow Three: Add a New Feature

\n

Example

\n

Step 1: Describe the Requirement

\n 
> Need to add a status filter function to the order list. Statuses include: Pending Payment, Paid, Shipped, Completed
\n

Step 2: Understand Existing Code

\n 
> First, take a look at the existing code structure related to orders
\n

Step 3: Implement the Function

\n 
> Implement the filtering function without affecting existing functionality
\n

Step 4: Add Tests

\n 
> Write test cases for this new feature
\n

Step 5: Commit Code

\n 
> Commit this change
\n\n

Workflow Four: Code Review

\n

Review Specific Files

\n 
> Help me review src/payment/processor.ts, focusing on error handling, boundary conditions, and security risks
\n \n\n```
← Claude Code SubagentClaude Code First Demo →

📂 Categories