Prompt Engineering for Vibe Coding

“The art of prompting lies not in asking the right questions, but in knowing how to ask them.” — A developer’s guide to AI-assisted coding

1. Learning the existing code with zero-shot prompt

High-level overview

Give me an overview of this codebase
What are the key data models?
Describe the api endpoints

Explain how and Tell me more details

Explain how the documents are processed
- What is the format of the document expected by the document_processor?
- How are the course chunks loaded to the database?
Explain how the text is transformed into chunks? What is the size of each chunk?

Visualization

Trace the process of handling user’s query from frontend to backend
Draw a diagram that illustrates this flow

Hands-on the project

How can I run the application?

2. Adding Features with few-shot prompt

Plan mode first

Using Ask mode in Copilot, or Shift+Tab to switch plan mode in Claude Code, etc.

Referencing the files to implementation the feature

Template:

Describe Current base feature. Describe the improvement feature.
  - The file 1 to be touched, what's the logic.
  - The file 2 to be touched, what's the logic.
  - More restrict/mandatory requirements.

Sample: Update an API response content to have a reference link.

The chat interface displays query responses with source citations. I need to modify it so each source becomes a clickable link that opens the corresponding lesson video in a new tab:
- When courses are processed into chunks in @backend/document_processor.py, the link of each lesson is stored in the course_catalog collection
- Modify _format_results in @backend/search_tools.py so that the lesson links are  also returned
- The links should be embedded invisibly (no visible URL text)

Referencing images to implementation the feature