DEV Community

Cover image for The Beginner’s Guide to Writing Your First AI Prompt (The Skill That Makes Vibe Coding Actually Work)
Greg Urbano
Greg Urbano

Posted on

The Beginner’s Guide to Writing Your First AI Prompt (The Skill That Makes Vibe Coding Actually Work)

If you’re new to vibe coding — the “copy → paste → run → tweak” way of learning — you’ve probably already felt the magic.

You describe what you want.

AI writes the code.

You run it.

You tweak one thing.

You learn by doing.

But there’s one part of the process that every beginner struggles with:

Writing the very first prompt.

It sounds simple.

It feels simple.

But it’s the difference between getting a working project in 10 seconds…

and getting a wall of code that does something completely different from what you imagined.

This article fixes that.

This is the guide every beginner vibe coder needs — the guide no coding course, tutorial, or AI chatbot ever gives you.


Why Your First Prompt Matters More Than the Code

Traditional coding starts with syntax.

Vibe coding starts with clarity.

AI isn’t guessing.

It’s following instructions.

If your instructions are vague, the AI has to invent details.

If your instructions are specific, the AI builds exactly what you want.

Your first prompt is the steering wheel.

The AI is the engine.

If the steering is unclear, the engine goes nowhere.


The 5 Elements of a Great First Prompt

Every strong beginner prompt has these five parts:


1. The Format (What kind of file you want)

This is the most common beginner mistake — they forget to specify the format.

Examples:

  • “Write a complete HTML file…”
  • “Write a single Python script…”
  • “Write a C# console app…”
  • “Write an Arduino sketch…”

This prevents the AI from mixing explanation with code or splitting the output into unusable chunks.


2. The Core Thing (What you want to build in one sentence)

This is the heart of the prompt.

Examples:

  • “A bouncing ball animation.”
  • “A click counter.”
  • “A digital clock.”
  • “A simple to‑do list.”

If you can’t describe it in one sentence, it’s too big for a first prompt.


3. One Behavior Detail (What makes it interesting)

This is the secret sauce.

Examples:

  • “…that speeds up each time it hits a wall.”
  • “…that changes color when clicked.”
  • “…that updates every second.”
  • “…that saves tasks between refreshes.”

This prevents generic output and gives the AI something to anchor to.


4. Constraints (What it should NOT do)

Constraints keep the AI from over‑engineering.

Examples:

  • “Use only vanilla HTML, CSS, and JavaScript.”
  • “No external libraries.”
  • “Keep it simple — single file.”
  • “Add comments for a beginner.”

This keeps the code readable, tweakable, and learnable.


5. Skill Level (Tell the AI who you are)

This changes everything.

Examples:

  • “I’m a complete beginner — please comment the code.”
  • “Write it in the simplest way possible.”
  • “Avoid advanced techniques.”

AI adapts to your level — but only if you tell it.


The Perfect First Prompt Template

Here’s the fill‑in‑the‑blank template every beginner should use:

“Write a [FORMAT] that creates [CORE THING].

It should [BEHAVIOR DETAIL].

Use only [CONSTRAINT].

I’m a beginner, so keep it simple and add comments.”

Example:

“Write a complete HTML file that creates a blue ball bouncing around the screen.

The ball should speed up slightly each time it hits a wall.

Use only vanilla HTML, CSS, and JavaScript.

I’m a beginner — keep it simple and add comments.”

Paste that into any AI.

You’ll get something you can run immediately.


How to Refine Your Prompt (The Real Learning Happens Here)

Even with a great prompt, the first output won’t always be perfect.

That’s normal.

That’s expected.

That’s the point.

Here’s the refinement loop:


A. The Addition

“Great — now add a score counter in the top right.”

B. The Correction

“The ball escapes the box. It should bounce off all four walls.”

C. The Simplification

“This is too advanced. Rewrite it using the simplest possible approach.”

D. The Isolation

“Everything works except the color change. Fix just that part.”

This is how real developers work with AI.

This is how vibe coders learn.


Common Beginner Prompt Mistakes (And How to Fix Them)

❌ “Make me a game.”

Too vague.

AI has to guess everything.

❌ “Build a website that looks cool.”

“Cool” is not a specification.

❌ “Write code for a calculator.”

What kind?

What features?

What style?

❌ “Create an app for my business.”

This is a wish, not a prompt.


The First Prompt Isn’t a Test — It’s a Starting Point

You’re not trying to impress the AI.

You’re trying to communicate with it.

The goal isn’t to write the perfect prompt.

The goal is to write a prompt that gets you to Version 1.

Once you have Version 1, everything becomes easier:

  • You can tweak.
  • You can refine.
  • You can experiment.
  • You can learn.

That’s vibe coding.


Try This Right Now

Here’s the ideal first project for any beginner:

“Write a complete HTML file with a red ball bouncing around the screen.

The ball should be 50px wide and move at medium speed.

Use only HTML, CSS, and JavaScript.

I’m a beginner — keep it simple and add comments.”

Paste it.

Run it.

Then tweak:

  • the color
  • the speed
  • the size
  • the background
  • the behavior

You’ll learn more in 10 minutes than in 10 hours of syntax drills.


Final Thought

AI didn’t make coding obsolete.

It made coding approachable.

Your job isn’t to memorize syntax.

Your job is to describe what you want — clearly, simply, and specifically.

The first prompt is the doorway.

Once you step through it, the whole world opens up.

Top comments (0)