Academyacademy / vibe-102 / react-vite-tailwind
React Vite Tailwind
What this is
React + Vite + Tailwind is the Vibe 102 class stack.
React handles app parts and state. Vite runs the app locally fast. Tailwind helps style the app without a large CSS file.
In simple words:
| Tool | What it is |
|---|---|
| React | A JavaScript library for building the app screen from reusable pieces called components. |
| Vite | A development tool that creates and runs the project on localhost so you can see changes fast. |
| Tailwind | A styling system that lets you design with small class names directly in your HTML or JSX. |
Why it matters
Vibe 102 is about app behavior.
This stack keeps the class focused on:
- components
- input
- state
- lists
- buttons
- responsive UI
- localStorage
It avoids routing, server logic, backend setup, and authentication.
What to do
Use the stack from your project brief.
When the tutor asks you to create the project, use the setup instructions from your AI assistant and stop at localhost.
Your checkpoint is simple:
Reference
The app opens on localhost.
The page loads.
No feature has been built yet.Do not continue until localhost works.
Common mistakes
- Comparing every framework instead of building.
- Adding Next.js server features.
- Installing extra libraries before the app works.
- Treating Tailwind polish as more important than app behavior.
Vibe 102 / Current checkpoint
React Vite Tailwind
Ready to stamp - Saved in this browser only.
0 of 11 checkpoints complete
0 of 11 checkpoints complete.