Prompt Engineering & Working with AI

Get better results — learn how to communicate effectively with AI to get the code and solutions you need.

INFO

• Time: ~60 minutes
• Difficulty: Beginner
• What you'll learn: Effective prompting for code, managing context, handling AI mistakes

---

This Page Covers

• Getting better results from AI
• Prompting specifically for code
• Managing context across conversations
• Handling AI mistakes and hallucinations

---

Getting Better Results from AI

The difference between a helpful AI response and a frustrating one often comes down to how you ask. Learning to write better prompts is like learning to ask better questions — it is a skill that improves with practice.

Be Specific, Not Vague

Vague prompts lead to generic results. Specific prompts get you exactly what you need.

Bad prompt:

Make a website

This gives AI almost nothing to work with. You will get something generic that probably does not match what you had in mind.

Good prompt:

Create a landing page for a freelance photographer. Include:
- Hero section with name and tagline
- Portfolio grid showing 6 images
- Contact form with name, email, and message fields
- Footer with social links

Use a dark theme with white text.

This tells AI exactly what you want, how it should be structured, and what it should look like.

Provide Context

The more AI understands about your situation, the better it can help. Include:

• What you are building and why: "I'm creating a portfolio to showcase my design work to potential clients"
• Who will use it: "Visitors will be non-technical people browsing on mobile phones"
• Technical constraints: "I need this to work without a backend" or "It must load quickly on slow connections"
• Reference examples: "Something like Stripe's homepage but simpler" or "Similar to the Apple product pages"

Context helps AI make better decisions about things you did not explicitly mention.

Show Examples (Few-Shot Prompting)

Few-shot prompting means giving AI examples of what you want before asking it to create something new. Think of it like showing a teacher an example of the assignment before asking them to create something similar — the example communicates style, format, and expectations better than words alone.

Example prompt:

Here's an example of a product card I like:

<div class="product">
  <img src="shoe.jpg" alt="Running shoe">
  <h3>Trail Runner Pro</h3>
  <p class="price">$129</p>
  <button>Add to Cart</button>
</div>

Now create a similar card for a backpack product.

By showing an example first, AI understands your preferred style, structure, and naming conventions.

---

Prompting Specifically for Code

When asking AI to write code, a structured approach helps you get better results.

Describing What You Want Built

Use this template to describe features clearly:

I want to build [what].
It should [key features].
Use [technology/framework if you care].
The user can [main actions].
Style it like [reference or description].

Example using the template:

I want to build a task management app.
It should let users create, complete, and delete tasks.
Use HTML, CSS, and vanilla JavaScript.
The user can add new tasks, mark them complete with a checkbox, and remove them.
Style it like a minimal to-do app with a clean white background.

Specifying Constraints

Be explicit about technical requirements:

• Technology choices: "Using React and TypeScript" or "Plain HTML and CSS only"
• Simplicity preferences: "Keep it simple, no external dependencies" or "Avoid using any libraries"
• Device requirements: "Make it mobile-responsive" or "Optimize for desktop screens"
• Performance needs: "Keep the file size small" or "It should work offline"

If you do not specify, AI will make its own choices — which may not match what you wanted.

Asking for Explanations

Do not just accept code without understanding it. Ask AI to teach you:

• "Explain this code line by line" — breaks down each part so you understand what it does
• "Why did you choose this approach?" — reveals the reasoning behind design decisions
• "What does this part do?" — gets clarification on confusing sections
• "What are the alternatives?" — shows you other ways to solve the same problem

Understanding the code you use makes you a better developer and helps you modify it later.

---

Context Management for Projects

As your projects grow, keeping AI informed about your codebase becomes important.

Project Context Files

AI tools can read project instructions files to understand your codebase. The most common format is a CLAUDE.md file placed in your project's root folder.

Tool Compatibility

CLAUDE.md is recognized by Claude-based tools (Claude Code, Cursor, Windsurf). ChatGPT uses different mechanisms for project context — it relies on uploaded files or its "Custom Instructions" feature. GitHub Copilot doesn't support project-level instruction files; it learns from the code around your cursor.

Example CLAUDE.md:

# Project Overview
This is a portfolio website for a photographer.

## Tech Stack
- HTML, CSS, JavaScript
- No frameworks

## Conventions
- Use semantic HTML
- Mobile-first CSS
- Keep JavaScript minimal

## File Structure
- index.html (main page)
- styles/ (CSS files)
- scripts/ (JavaScript files)
- images/ (optimized photos)

When you start a conversation in a project that has a CLAUDE.md file, compatible AI tools read it automatically and understand your project's context, conventions, and requirements.

When to Start Fresh

Sometimes conversations go off track. Signs you need a new conversation:

• AI keeps making the same mistake despite corrections
• Responses are getting confused or contradictory
• You have significantly changed direction from where you started
• The conversation has gotten very long and AI seems to "forget" earlier context

Starting fresh with clean context and a clear initial prompt often works better than trying to fix a confused conversation.

---

When AI is Wrong

AI is helpful but not perfect. Learning to spot and handle mistakes is essential.

Recognizing Hallucinations

AI sometimes makes things up with complete confidence. Watch for:

• Made-up function names or APIs: AI might reference functions that do not exist in the library you are using
• Outdated syntax: Code that worked in older versions but is no longer valid
• Overconfident wrong answers: AI stating incorrect information as fact
• Invented libraries: Suggesting packages that sound real but do not exist

The more confident AI sounds, the more carefully you should verify unusual claims.

Verification Strategies

Before trusting AI-generated code, check:

1. Does it run? Try the code and see if it actually works
2. Does it do what I asked? Test the functionality against your requirements
3. Check official docs if unsure: When AI references a library or API, verify it exists in the official documentation
4. Test edge cases: Try unusual inputs to see if the code handles them correctly

When in doubt, ask AI to explain its reasoning — sometimes this reveals flawed assumptions.

---

Describing Project Ideas

Turning a vague idea into something AI can help you build requires practice.

From Vague to Specific

Vague idea:

An app to track habits

Better description:

A simple web app where users can:
- Add new habits they want to track
- Check them off each day
- See a streak counter showing how many days in a row they completed each habit

Include:
- A list of all habits
- A daily checklist view
- A streak display next to each habit

The second version gives AI clear direction about what to build.

Template for Project Descriptions

Use this template to turn your ideas into actionable descriptions:

1. What is it? (one sentence) "A habit tracking web app"

2. Who uses it? "People who want to build daily routines"

3. What can they do? (3-5 features)

   • Add new habits
   • Mark habits complete each day
   • View their streak for each habit
   • Delete habits they no longer want

4. What should it look like? "Clean and minimal, like a simple checklist app. White background, checkboxes, and streak numbers."

Iterating on Requirements

Your first description rarely captures everything. Use follow-up prompts to refine:

• "Yes, but also add..." — extend with new features
• "Can you make it simpler by..." — reduce complexity
• "Change the [part] to..." — modify specific elements
• "What about when the user..." — address edge cases

Building projects is a conversation. Each exchange helps you and AI get closer to what you actually want.

---

Key Takeaways

• Specific prompts get better results than vague ones
• Context and examples dramatically improve output
• Use templates to structure your requests for code
• Manage context across conversations with CLAUDE.md files
• Verify AI output, especially for critical code
• Iterate on requirements through conversation