Academyacademy / vibe-102 / mini-app-brief

Mini App Brief

What this is

The mini app brief is the build plan for Vibe 102.

It keeps the learner, tutor, and AI assistant focused on one small app.

Why it matters

App projects become messy when the data, layout, and build order are vague.

The brief stops AI from adding extra features too early.

What to do

Use this planning prompt before opening the IDE:

Copy prompt

You are a senior frontend developer helping a beginner.

I want to build my first mini web app.

Choose one app type:
[mission task tracker / habit tracker / expense tracker / project bookmark manager / lead tracker]

Requirements:
- beginner friendly
- no backend
- no login
- React + Vite + Tailwind
- use localStorage
- mobile responsive
- can be built in 2.5 hours

Core features:
1. Add an item
2. Show the item in a list
3. Update or mark the item
4. Delete the item
5. Save items in localStorage

Your job:
1. Suggest the simplest tech stack
2. Define the data structure
3. Suggest max 3 core features
4. Suggest the app layout
5. Suggest the build order

Then ask me questions to refine the idea.

Important:
Keep the app simple. Do not add database, authentication, payments, AI features, dashboards, or teams.

For a guided version, open Prompt Lab and choose I have an idea or I need a plan.

Then ask for the final brief:

Copy prompt

Create a final beginner-friendly project brief based on our discussion.

Include:
- app name
- app goal
- tech stack
- max 3 core features
- data structure
- page layout
- localStorage plan
- step-by-step build order

Keep it simple enough to build in 2.5 hours.

Common mistakes

Starting code before the data structure is clear.
Letting AI add filters, charts, accounts, or multiple pages.
Accepting a brief that cannot fit in class time.

Vibe 102 / Current checkpoint

Mini App Brief

Ready to stamp - Saved in this browser only.

0 of 11 checkpoints complete.