Alur Kerja Praktik Terbaik Berbantuan AIAlur Kerja Praktik Terbaik Berbantuan AI

In the previous chapters, we learned how to use AI IDEs to write code, how to manage code versions with Git, and how to design and implement API interfaces. But when you face a real development task, you may run into questions like these:In the previous chapters, we learned how to use AI IDEs to write code, how to manage code versions with Git, and how to design and implement API interfaces. But when you face a real development task, you may run into questions like these:

• "This project has thousands of files. Where should I start?""This project has thousands of files. Where should I start?"
• "My boss asked me to add a new feature, but I'm not familiar with this part of the codebase.""My boss asked me to add a new feature, but I'm not familiar with this part of the codebase."
• "I have no idea where this bug is. There is just too much code.""I have no idea where this bug is. There is just too much code."
• "I need to refactor this pile of code, but I'm afraid of breaking something.""I need to refactor this pile of code, but I'm afraid of breaking something."

The essence of these questions is: how do you use AI tools efficiently in real development scenarios to get work done?The essence of these questions is: how do you use AI tools efficiently in real development scenarios to get work done?

In this lesson, we will learn how to build a systematic AI-assisted development workflow so that you can use AI efficiently across different development scenarios. Through concrete examples, we will show how to use AI in new feature development, bug fixing, code refactoring, and more.In this lesson, we will learn how to build a systematic AI-assisted development workflow so that you can use AI efficiently across different development scenarios. Through concrete examples, we will show how to use AI in new feature development, bug fixing, code refactoring, and more.

> 💡 Prerequisites> 💡 Prerequisites

>>

> Before studying this section, it is recommended that you first understand:> Before studying this section, it is recommended that you first understand:

> - [AI IDE Basics](../../stage-1/ai-ide/) - master the basic use of AI IDEs> - [AI IDE Basics](../../stage-1/ai-ide/) - master the basic use of AI IDEs

> - [Git and GitHub Workflow](../../stage-2/backend/git-workflow/) - understand code version management> - [Git and GitHub Workflow](../../stage-2/backend/git-workflow/) - understand code version management

> - [Using Large Models to Help Write API Code](../../stage-2/backend/ai-interface-code/) - understand the basic concept of AI-assisted development> - [Using Large Models to Help Write API Code](../../stage-2/backend/ai-interface-code/) - understand the basic concept of AI-assisted development

Before we start using AI to assist development, we first need to understand what AI can and cannot do. Only then can we build the right collaboration model.Before we start using AI to assist development, we first need to understand what AI can and cannot do. Only then can we build the right collaboration model.

1.1 What AI Is Good At1.1 What AI Is Good At

Think of AI as a very smart assistant that still needs clear instructions. It can quickly generate a code skeleton based on your description, and it can also read thousands of lines of code in seconds to find the part you need. If there are obvious syntax errors or common security vulnerabilities, it can help you discover them too. Repetitive tasks such as batch-renaming variables, formatting code, and generating documentation comments are especially suitable to hand over to AI.Think of AI as a very smart assistant that still needs clear instructions. It can quickly generate a code skeleton based on your description, and it can also read thousands of lines of code in seconds to find the part you need. If there are obvious syntax errors or common security vulnerabilities, it can help you discover them too. Repetitive tasks such as batch-renaming variables, formatting code, and generating documentation comments are especially suitable to hand over to AI.

Put simply, AI is good at work that has clear rules and can be automated.Put simply, AI is good at work that has clear rules and can be automated.

1.2 What AI Is Not Good At1.2 What AI Is Not Good At

But AI also has its limitations. It does not understand your business logic. Unless you tell it in detail, it will not know how your company's order flow works. It also cannot make decisions such as technical selection or architecture design that require weighing trade-offs, because those depend on your experience and understanding of the project. AI also does not know your team's special conventions, such as "all APIs must have logging" or "error codes must use enums." You need to configure those rules or tell it explicitly.But AI also has its limitations. It does not understand your business logic. Unless you tell it in detail, it will not know how your company's order flow works. It also cannot make decisions such as technical selection or architecture design that require weighing trade-offs, because those depend on your experience and understanding of the project. AI also does not know your team's special conventions, such as "all APIs must have logging" or "error codes must use enums." You need to configure those rules or tell it explicitly.

Most importantly, code generated by AI cannot be used directly. You must review and test it. It may generate code that looks correct but is actually problematic, and it may ignore certain edge cases.Most importantly, code generated by AI cannot be used directly. You must review and test it. It may generate code that looks correct but is actually problematic, and it may ignore certain edge cases.

1.3 How to Collaborate with AI1.3 How to Collaborate with AI

Once you understand AI's capability boundaries, the collaboration model becomes clear: you are responsible for deciding what to build, making decisions, and ensuring quality; AI is responsible for executing concrete coding work, finding information, and surfacing obvious problems.Once you understand AI's capability boundaries, the collaboration model becomes clear: you are responsible for deciding what to build, making decisions, and ensuring quality; AI is responsible for executing concrete coding work, finding information, and surfacing obvious problems.

It is like working with a junior developer. You tell them what needs to be done, they implement it, and then you review the code. The difference is that AI executes much faster, but its judgment is weaker than a human's.It is like working with a junior developer. You tell them what needs to be done, they implement it, and then you review the code. The difference is that AI executes much faster, but its judgment is weaker than a human's.

Different types of projects require different development styles and AI usage strategies. Choosing the right strategy can greatly improve development efficiency.Different types of projects require different development styles and AI usage strategies. Choosing the right strategy can greatly improve development efficiency.

2.1 Brand-New Projects (Starting from Scratch)2.1 Brand-New Projects (Starting from Scratch)

Project characteristics:Project characteristics:

• No historical baggage, so you can design freelyNo historical baggage, so you can design freely
• You need to establish project structure and code conventionsYou need to establish project structure and code conventions
• Suitable for fast iteration and trial-and-errorSuitable for fast iteration and trial-and-error

Recommended workflow:Recommended workflow:

Step 1: Plan the project structureStep 1: Plan the project structure

Before you start coding, first ask AI to help you plan the project structure and technical choices:Before you start coding, first ask AI to help you plan the project structure and technical choices:

I want to build a task management app with these features: - User registration and login - Create, edit, and delete tasks - Task categories and tags - Task reminders Please help me: 1. Recommend a suitable tech stack 2. Design the project directory structure 3. Plan the database schema

Step 2: Build the basic frameworkStep 2: Build the basic framework

Based on the plan, ask AI to create the basic project structure:Based on the plan, ask AI to create the basic project structure:

Based on the plan we just discussed, help me: 1. Create the project directory structure 2. Initialize config files (package.json, .env, etc.) 3. Create the basic server code

Step 3: Implement features one by oneStep 3: Implement features one by one

Implement feature modules one at a time by priority:Implement feature modules one at a time by priority:

Now implement the user registration feature with these requirements: - Register with email and password - Store passwords in encrypted form - Email verification

Key points:Key points:

• Establish code conventions early so AI generates code that follows themEstablish code conventions early so AI generates code that follows them
• Test and verify every feature module as soon as it is completedTest and verify every feature module as soon as it is completed
• Keep project documentation updated in timeKeep project documentation updated in time

2.2 Mature Projects (Large Existing Codebases)2.2 Mature Projects (Large Existing Codebases)

Project characteristics:Project characteristics:

• Large codebase with historical conventionsLarge codebase with historical conventions
• You need to keep coding style consistentYou need to keep coding style consistent
• Changes must consider the scope of impactChanges must consider the scope of impact

Recommended workflow:Recommended workflow:

Step 1: Understand the project structureStep 1: Understand the project structure

Before changing code, first ask AI to help you understand the project:Before changing code, first ask AI to help you understand the project:

This is an e-commerce project, and I need to add a coupon feature. Please help me: 1. Analyze the overall project structure 2. Find the order-related code 3. See how other similar features are implemented

Step 2: Find reference codeStep 2: Find reference code

Ask AI to find similar implementations in the project as references:Ask AI to find similar implementations in the project as references:

Find how other promotional features in the project, such as full reduction and discounts, are implemented

Step 3: Follow the existing styleStep 3: Follow the existing style

Ask AI to implement the new feature in the style of the existing code:Ask AI to implement the new feature in the style of the existing code:

Please implement the coupon feature by referring to how the full-reduction promotion is implemented. Keep the same code style and directory structure.

Key points:Key points:

• Understand first, then change things, so you do not damage the existing architectureUnderstand first, then change things, so you do not damage the existing architecture
• Keep coding style consistentKeep coding style consistent
• Test related functionality after the changeTest related functionality after the change

2.3 Rapid Prototypes (Validating Ideas)2.3 Rapid Prototypes (Validating Ideas)

Project characteristics:Project characteristics:

• Speed matters most, code quality matters lessSpeed matters most, code quality matters less
• Used to validate product ideas or technical approachesUsed to validate product ideas or technical approaches
• May later be discarded or rewrittenMay later be discarded or rewritten

Recommended workflow:Recommended workflow:

Describe the requirement directly and implement quickly:Describe the requirement directly and implement quickly:

Build a simple todo app with these requirements: - Add, delete, and mark tasks as completed - Store data locally - Keep the UI simple, as long as it works

Iterate quickly:Iterate quickly:

Add search Switch it to a dark theme Add task categories

Key points:Key points:

• Do not worry too much about code quality or conventionsDo not worry too much about code quality or conventions
• Validate ideas quickly and adjust direction in timeValidate ideas quickly and adjust direction in time
• If the prototype succeeds, it will need refactoring laterIf the prototype succeeds, it will need refactoring later

2.4 Maintenance Projects (Mostly Bug Fixes)2.4 Maintenance Projects (Mostly Bug Fixes)

Project characteristics:Project characteristics:

• The code is already stable, and the main task is fixing issuesThe code is already stable, and the main task is fixing issues
• You need to locate problems quicklyYou need to locate problems quickly
• Changes must be made carefully to avoid introducing new issuesChanges must be made carefully to avoid introducing new issues

Recommended workflow:Recommended workflow:

Step 1: Locate the problemStep 1: Locate the problem

User feedback: after clicking the "Submit Order" button, the page freezes Console error: TypeError: Cannot read property 'id' of undefined Please help me: 1. Analyze possible causes 2. Find the relevant code

Step 2: Analyze the root causeStep 2: Analyze the root cause

Check in what situations this error occurs Inspect the data flow

Step 3: Apply the fixStep 3: Apply the fix

Fix this problem, and: 1. Add defensive code to avoid similar issues 2. Add error messages to improve user experience

Key points:Key points:

• Test thoroughly after the fix to ensure it does not affect other functionalityTest thoroughly after the fix to ensure it does not affect other functionality
• Add defensive code to improve system robustnessAdd defensive code to improve system robustness
• Record the problem and solution for future referenceRecord the problem and solution for future reference

In day-to-day development, we encounter many different types of tasks. Below are several of the most common AI-assisted workflows.In day-to-day development, we encounter many different types of tasks. Below are several of the most common AI-assisted workflows.

3.1 Developing a New Feature3.1 Developing a New Feature

Scenario: the product manager gives you a new requirement, and you need to implement a new feature.Scenario: the product manager gives you a new requirement, and you need to implement a new feature.

Complete workflow:Complete workflow:

Step 1: Understand the requirement (done by you)Step 1: Understand the requirement (done by you)

Before you start coding, first clarify:Before you start coding, first clarify:

• What feature needs to be implemented?What feature needs to be implemented?
• What are the inputs and outputs?What are the inputs and outputs?
• What are the edge conditions and exceptional cases?What are the edge conditions and exceptional cases?
• What are the performance and security requirements?What are the performance and security requirements?

Step 2: Understand the existing code (ask AI to help)Step 2: Understand the existing code (ask AI to help)

I need to implement a user comment feature. Please help me: 1. Check whether there is anything similar in the project 2. Find how user data and article data are stored 3. Understand the database operation conventions in this project

Step 3: Make an implementation plan (with AI)Step 3: Make an implementation plan (with AI)

Based on the analysis we just did, implementing the comment feature requires: 1. Creating a comment data model 2. Implementing CRUD APIs for comments 3. Adding comment display and posting functionality to the frontend Please help me confirm whether this plan is reasonable and whether anything is missing

Step 4: Implement the feature (AI generates, you review)Step 4: Implement the feature (AI generates, you review)

According to the plan, first implement the comment data model. Requirements: - Include comment content, author, article ID, and creation time - Support nested comment replies - Add necessary indexes

Now implement the comment API endpoints. Requirements: - Post a comment - Delete a comment (only your own comments can be deleted) - Get all comments for an article - Support pagination

Finally implement the frontend comment component. Requirements: - Show the comment list - Comment posting form - Support replying to comments

Step 5: Test and verify (done by you)Step 5: Test and verify (done by you)

• Manually test the main flowManually test the main flow
• Test edge cases such as empty content and overly long contentTest edge cases such as empty content and overly long content
• Test permission control such as being unable to delete someone else's commentTest permission control such as being unable to delete someone else's comment
• Ask AI to help you write automated testsAsk AI to help you write automated tests

Real conversation example:Real conversation example:

You: I want to add a user comment feature so users can post comments on articles AI: Okay, let me first understand the project structure. [AI analyzes the project code] I see that the project already has a user system (models/user.js) and an article system (models/article.js). Implementing the comment feature requires: 1. Creating a comment data model (models/comment.js) 2. Adding comment-related APIs (routes/comment.js) 3. Adding comment display and posting functionality to the article detail page Should I start implementing it? You: Yes, let's start. Create the data model first AI: [Generates models/comment.js] I have created the comment data model with these fields: - id: comment ID - content: comment content - userId: author ID - articleId: article ID - parentId: parent comment ID (for nested replies) - createdAt: creation time Should I implement the API next? You: Yes, implement the API

3.2 Fixing Bugs3.2 Fixing Bugs

Scenario: a user reports a problem, and you need to locate and fix it quickly.Scenario: a user reports a problem, and you need to locate and fix it quickly.

Complete workflow:Complete workflow:

Step 1: Gather information (done by you)Step 1: Gather information (done by you)

Record the following information:Record the following information:

• What is the error message?What is the error message?
• How can this problem be reproduced?How can this problem be reproduced?
• When did it start happening?When did it start happening?
• How large is the impact scope?How large is the impact scope?

Step 2: Locate the problem (ask AI to help)Step 2: Locate the problem (ask AI to help)

User feedback: after clicking the "Submit Order" button, the page freezes Browser console error: TypeError: Cannot read property 'id' of undefined The error occurs on line 45 of checkout.js Please help me: 1. Analyze possible causes 2. Find the relevant code 3. Check the data flow

Step 3: Analyze the root cause (with AI)Step 3: Analyze the root cause (with AI)

Check where this user object comes from Inspect under what circumstances user could be undefined

Step 4: Implement the fix (AI generates, you review)Step 4: Implement the fix (AI generates, you review)

Fix this problem with these requirements: 1. Add defensive code to check whether user exists 2. If user does not exist, redirect to the login page 3. Add a friendly error message

Step 5: Verify the fix (done by you)Step 5: Verify the fix (done by you)

• Reproduce the issue using the original steps and confirm the problem is solvedReproduce the issue using the original steps and confirm the problem is solved
• Test related functionality to ensure no new problems were introducedTest related functionality to ensure no new problems were introduced
• Think about whether similar problems exist elsewhereThink about whether similar problems exist elsewhere

Real conversation example:Real conversation example:

You: A user reported that after logging in, refreshing the page logs them out AI: This is usually a token storage or validation issue. Let me check: 1. Where is the token stored, localStorage or cookies? 2. Is the token reloaded when the page refreshes? Please tell me which file contains the token-related code You: utils/auth.js AI: [Analyzes utils/auth.js] I found the issue: the token is stored in sessionStorage, and sessionStorage is cleared when the page is refreshed. Solution: use localStorage instead Would you like me to change it? You: Yes, change it AI: [Modifies the code] The change is complete. The token is now stored in localStorage, so it will not be lost after a page refresh. I recommend that you test: 1. Log in and refresh the page to confirm the user stays logged in 2. Close and reopen the browser to confirm the user stays logged in

3.3 Refactoring Code3.3 Refactoring Code

Scenario: the code has become hard to maintain, and it needs refactoring to improve code quality.Scenario: the code has become hard to maintain, and it needs refactoring to improve code quality.

Complete workflow:Complete workflow:

Step 1: Define the refactoring goal (done by you)Step 1: Define the refactoring goal (done by you)

Clarify the following:Clarify the following:

• What problem are you trying to solve? (duplicate code? messy structure? performance issues?)What problem are you trying to solve? (duplicate code? messy structure? performance issues?)
• How large is the scope of the refactor?How large is the scope of the refactor?
• What level of risk is acceptable?What level of risk is acceptable?

Step 2: Make a refactoring plan (with AI)Step 2: Make a refactoring plan (with AI)

These three functions (getUserList, getArticleList, getCommentList) contain a lot of duplicated code for pagination, sorting, and filtering. Please help me: 1. Analyze the duplicated parts 2. Propose a refactoring plan 3. Evaluate the risk of the refactor

Step 3: Prepare a safety net (ask AI to help)Step 3: Prepare a safety net (ask AI to help)

Before refactoring, please write test cases for me first so that the behavior stays the same after the refactor

Step 4: Refactor step by step (AI executes, you verify)Step 4: Refactor step by step (AI executes, you verify)

According to the plan we just discussed, first extract the shared function

Now optimize the data structure

Finally update the call sites

Step 5: Verify the result (done by you)Step 5: Verify the result (done by you)

• Run all tests and make sure they passRun all tests and make sure they pass
• Manually test key functionalityManually test key functionality
• Check whether code quality has improvedCheck whether code quality has improved

Real conversation example:Real conversation example:

You: These three functions have a lot of duplicate code. Can you help me refactor them? [Paste the code of the three functions] AI: I analyzed them, and the main differences are: - getUserList: gets the user list - getArticleList: gets the article list - getCommentList: gets the comment list Their common logic is pagination, sorting, and filtering. Refactoring plan: 1. Extract a generic getList function 2. Pass the different parts as parameters This can reduce 80% of the duplicated code. Should I implement it? You: Yes, but first help me write test cases AI: [Generates tests] I have written tests for all three functions, covering the main use cases. Can I start refactoring now? You: Yes, start refactoring AI: [Refactors the code] Refactoring is complete. I created a generic getList function, and the original three functions now all call that shared function. Please run the tests to confirm everything works: npm test

3.4 Code Review3.4 Code Review

Scenario: a teammate submitted code, and you need to review it.Scenario: a teammate submitted code, and you need to review it.

Complete workflow:Complete workflow:

Step 1: Quickly understand the change (ask AI to help)Step 1: Quickly understand the change (ask AI to help)

Summarize what this PR changed Which files were mainly modified

Step 2: Check common issues (ask AI to help)Step 2: Check common issues (ask AI to help)

Check this change for: 1. Security issues (SQL injection, XSS, etc.) 2. Performance problems (N+1 queries, memory leaks, etc.) 3. Obvious bugs 4. Whether the coding style follows the project conventions

Step 3: Deep review (done by you)Step 3: Deep review (done by you)

• Whether the business logic is correctWhether the business logic is correct
• Whether edge cases were consideredWhether edge cases were considered
• Whether there is a better implementation approachWhether there is a better implementation approach
• Whether tests should be addedWhether tests should be added

Step 4: Give feedback (done by you)Step 4: Give feedback (done by you)

• Point out the places that need changesPoint out the places that need changes
• Explain why they should be changedExplain why they should be changed
• Provide improvement suggestionsProvide improvement suggestions

Real conversation example:Real conversation example:

You: Help me review this PR [Provide the PR link or code] AI: I reviewed the change and found these issues: 1. Security issues: - Line 23: user input is not escaped, which may lead to XSS risk - Line 45: the SQL query is built by string concatenation, which risks injection 2. Performance problems: - Line 67: the database is queried inside a loop, which creates an N+1 problem 3. Code quality: - The handleSubmit function is too long (200 lines); consider splitting it - Error handling is missing Would you like me to explain any of these in more detail? You: Explain the SQL injection issue in detail AI: On line 45:

const query = SELECT * FROM users WHERE name = '${userName}';const query = SELECT * FROM users WHERE name = '${userName}';

 This directly concatenates user input into the SQL statement. If a user enters `' OR '1'='1`, it becomes:

SELECT * FROM users WHERE name = '' OR '1'='1'SELECT * FROM users WHERE name = '' OR '1'='1'

 This would return all user data. The correct approach is to use a parameterized query:

const query = 'SELECT * FROM users WHERE name = ?';const query = 'SELECT * FROM users WHERE name = ?';

db.query(query, [userName]);db.query(query, [userName]);

 Would you like me to fix it?

To help AI understand your project better, it is recommended to build a knowledge base inside the project. That way AI can work according to your conventions and habits.To help AI understand your project better, it is recommended to build a knowledge base inside the project. That way AI can work according to your conventions and habits.

4.1 Create a Project Description File4.1 Create a Project Description File

Create a CLAUDE.md or AGENTS.md file in the project root to record key project information:Create a CLAUDE.md or AGENTS.md file in the project root to record key project information:

# Project Overview ## Project Summary This is an online learning platform that provides course management, user learning, assignment submission, and other features. ## Tech Stack - Frontend: React 18 + TypeScript + Vite - Backend: Node.js + Express + PostgreSQL - Deployment: Vercel (frontend) + Railway (backend) ## Project Structure

src/src/

├── components/ # React components├── components/ # React components

├── pages/ # Page components├── pages/ # Page components

├── api/ # API calls├── api/ # API calls

├── utils/ # Utility functions├── utils/ # Utility functions

└── types/ # TypeScript type definitions└── types/ # TypeScript type definitions

 ## Code Conventions - Use ESLint and Prettier to format code - Component files use PascalCase (such as UserProfile.tsx) - Utility functions use camelCase (such as formatDate.ts) - Constants use UPPER_SNAKE_CASE (such as API_BASE_URL) ## Development Flow 1. Create a feature branch from main 2. Submit a PR after development is complete 3. Merge after code review passes ## Common Tasks - Start the development server: `npm run dev` - Run tests: `npm test` - Build for production: `npm run build` - Format code: `npm run format` ## Notes - All API calls must include error handling - User input must be validated and escaped - Use parameterized queries for database operations to avoid SQL injection - Sensitive information (passwords, tokens) must not be written to logs ## Database Schema - users: user table (id, email, password_hash, created_at) - courses: course table (id, title, description, teacher_id) - enrollments: enrollment table (id, user_id, course_id, enrolled_at)

4.2 Record Common Problems and Solutions4.2 Record Common Problems and Solutions

Create docs/troubleshooting.md in the project to record common problems:Create docs/troubleshooting.md in the project to record common problems:

# Common Problems ## Development Environment Problems ### Problem: npm install fails **Cause:** Node version is incompatible **Solution:** Use Node.js 18 or higher ### Problem: database connection fails **Cause:** environment variables are not configured **Solution:** Copy .env.example to .env and fill in the database connection info ## Feature Problems ### Problem: after users log in, refreshing the page logs them out **Cause:** the token is stored in sessionStorage **Solution:** switch to localStorage ### Problem: image upload fails **Cause:** file size exceeds the limit **Solution:** add a file size check on the frontend and limit it to 5MB

4.3 Maintain Technical Decision Records4.3 Maintain Technical Decision Records

Create a docs/decisions/ directory to record important technical decisions:Create a docs/decisions/ directory to record important technical decisions:

# ADR-001: Choosing PostgreSQL as the Database ## Status Accepted ## Background The project needs to choose a relational database. The candidates are MySQL and PostgreSQL. ## Decision Choose PostgreSQL ## Rationale 1. Better JSON support, suitable for storing course content 2. Stronger full-text search 3. The team is more familiar with PostgreSQL ## Consequences - We need to learn PostgreSQL-specific features - Deployment requires a PostgreSQL environment

By mastering some practical techniques, you can make your collaboration with AI more efficient.By mastering some practical techniques, you can make your collaboration with AI more efficient.

5.1 Be Clear and Specific When Describing Problems5.1 Be Clear and Specific When Describing Problems

Bad description:Bad description:

This feature has a problem Help me optimize it

Good description:Good description:

After the user clicks the "Submit" button, the form is not submitted The browser console reports: Uncaught TypeError: Cannot read property 'value' of null The error occurs on line 23 of form.js This list loads very slowly and has 1000 items Please help me add pagination with 20 items per page

Key points:Key points:

• Provide specific error informationProvide specific error information
• Explain the expected resultExplain the expected result
• Give relevant contextGive relevant context

5.2 Do Only One Thing at a Time5.2 Do Only One Thing at a Time

Bad approach:Bad approach:

Help me implement login, registration, password recovery, profile center, password change, and email verification

Good approach:Good approach:

Implement the login feature first, with these requirements: - Email and password login - Remember login state - Error messages (After it is done) Now implement the registration feature (After it is done) Now implement the password recovery feature

Key points:Key points:

• Break large tasks into small tasksBreak large tasks into small tasks
• Test and verify after every completed taskTest and verify after every completed task
• Confirm there are no issues before moving to the next oneConfirm there are no issues before moving to the next one

5.3 Verify Results Promptly5.3 Verify Results Promptly

Bad approach:Bad approach:

• Let AI modify 10 files in a rowLet AI modify 10 files in a row
• Only discover at the end that the first change was already wrongOnly discover at the end that the first change was already wrong
• Waste a lot of timeWaste a lot of time

Good approach:Good approach:

• Modify one file and test immediatelyModify one file and test immediately
• Confirm there is no problem, then continueConfirm there is no problem, then continue
• Correct issues as soon as they are foundCorrect issues as soon as they are found

Key points:Key points:

• Move in small steps and get fast feedbackMove in small steps and get fast feedback
• Do not blindly trust AIDo not blindly trust AI
• Stay in control of the codeStay in control of the code

5.4 Make Good Use of Context5.4 Make Good Use of Context

Technique 1: refer to previous conversationTechnique 1: refer to previous conversation

Implement according to the plan we just discussed Refer to the previous getUserList function

Technique 2: provide related codeTechnique 2: provide related code

This is the existing user model code: [paste code] Please implement the article model in the same style

Technique 3: explain project backgroundTechnique 3: explain project background

This is an e-commerce project using React + Node.js It already has a user system and a product system Now we need to add a shopping cart feature

5.5 Save Useful Conversations5.5 Save Useful Conversations

Scenario: you solved a complex problemScenario: you solved a complex problem

How to do it:How to do it:

1. Record the solution in project documentationRecord the solution in project documentation
2. Refer to it the next time a similar issue appearsRefer to it the next time a similar issue appears
3. Share it with other team membersShare it with other team members

Example:Example:

Create a document under docs/solutions/:Create a document under docs/solutions/:

markdown 📋 Salin📋 Copy

# Solving the N+1 Query Problem ## Problem Description When fetching the article list, the system queries the author information once per article, which causes a performance problem. ## Solution Use a JOIN query to fetch all the data in one go: 

SELECT articles.*, users.name as author_nameSELECT articles.*, users.name as author_name

FROM articlesFROM articles

LEFT JOIN users ON articles.author_id = users.idLEFT JOIN users ON articles.author_id = users.id

CODE 📋 Salin📋 Copy

 **Result:** query time dropped from 2000ms to 50ms ## 5.6 Learn the Art of Asking Questions **Technique 1: ask "why" first**

Why does this code cause a memory leak?Why does this code cause a memory leak?

Why should we use useCallback instead of a normal function?Why should we use useCallback instead of a normal function?

CODE 📋 Salin📋 Copy

 **Technique 2: ask for multiple options**

What are the different ways to implement user authentication?What are the different ways to implement user authentication?

What are the pros and cons of each?What are the pros and cons of each?

CODE 📋 Salin📋 Copy

 **Technique 3: ask for explanations**

How does this code work?How does this code work?

Can you explain this algorithm in detail?Can you explain this algorithm in detail?

CODE 📋 Salin📋 Copy

 # 6. Frequently Asked Questions ## Q1: Can I use AI-generated code directly? **A:** No, not directly. It needs review and testing. AI-generated code may have the following problems: - logical errors or poor handling of edge cases - failure to match the project's coding conventions - security risks - insufficient performance optimization You need to: - carefully read the generated code - understand its logic - test different scenarios - confirm that it follows the project conventions ## Q2: What if AI misunderstands what I mean? **A:** Correct it in time and describe the requirement again. 

That's not what I meant. What I mean is...That's not what I meant. What I mean is...

This understanding is incorrect. It should be...This understanding is incorrect. It should be...

Let me describe the requirement again...Let me describe the requirement again...

← SebelumnyaPreviousClaude Agent Teams: Tim Pengembang Serba AIClaude Agent Teams: Tim Pengembang Serba AI SelanjutnyaNext →Remote Development Claude Code dari SmartphoneRemote Development Claude Code dari Smartphone