Pirate Skills Icon

Holy 💩, I can do that now?

This is how you level up from total Noob to serious Vibe Coder and start building what's in your head right now.

Explore the 6 Vibe Coding Skills

Product

Slot:Head
Upgrades
+Value

Solve a real problem for a lot of real users

Progression Levels
1
Your Idea
2
First Features
3
Feature Planning
4
Sprint Planning
5
User Research
6
Product Strategy

Tooling

Slot:Hands
Upgrades
+Power

Master development tools and AI assistants

Progression Levels
1
Local Setup
2
Cursor Agent
3
Cursor Rules
4
MCP Server
5
Terminal Usage
6
Customized Setup

Design

Slot:Chest
Upgrades
+Style

Build interfaces people actually want using

Progression Levels
1
Landing Page
2
UI Components
3
Style Systems
4
User Flow
5
Mobile Responsive
6
Accessibility

Systems

Slot:Back
Upgrades
+Scalability

Build a robust backend engines powering your app

Progression Levels
1
Fixing Errors
2
Real Functions
3
Saving Data
4
Login & Signup
5
Sending Emails
6
Stripe Payments

Security

Slot:Legs
Upgrades
+Safety

Secure applications for you and your users

Progression Levels
1
Safety First
2
Zero Trust
3
Database Security
4
Auth Security
5
Rate Limiting
6
Dependency Security

Shipping

Slot:Boots
Upgrades
+Speed

Get your app fast and smooth to users

Progression Levels
1
Going Live
2
Debugging Flow
3
Git Workflow
4
Preview & Production
5
Automated Tests
6
Error Tracking

Level Up Your Vibe Coding Skills

Product
Solve a real problem for a lot of real users
+Value
Tooling
Master development tools and AI assistants
+Power
Design
Build interfaces people actually want using
+Style
Systems
Build a robust backend engines powering your app
+Scalability
Security
Secure applications for you and your users
+Safety
Shipping
Get your app fast and smooth to users
+Speed

Level 1

Get your idea live: a simple site online, code saved, local setup working, a clear goal, and basic safety.

1.1
Your Idea
Develop an idea into a concept that helps the AI understand the users problem you want to solve
1.2
Local Setup
Install Cursor on your computer and learn to use it so you have a running version of Next.js on
1.3
Landing Page
Work with professional UI libraries like Magic UI so your new landing page starts in style
1.4
Fixing Errors
Learn to deal with the inevitable errors and warnings the AI produces during development
1.5
Safety First
Learn the most important rules to follow that keep you system and web app safe from harm
1.6
Going Live
Save your code on GitHub and host your landing page on Vercel so you can start sharing it

Level 2

Ship your first feature: a tiny plan, clean UI, a clear build workflow, checked inputs, and tidy code.

2.1
First Features
Turn your concept into a PRD which is like a todo list for the AI and a chance for you to review it
2.2
Cursor Agent
Leverage Cursors agent mode and understand which models to use to build your features
2.3
UI Components
Work with UI components from shadcn/ui to make your first feature look professional
2.4
Real Functions
Build real functionality for your users and connect it to the UI components in your frontend
2.5
Zero Trust
Never trust user input - validate and sanitize everything to prevent XSS and SQL injection attacks
2.6
Debugging Flow
Format your code and detect errors and bad practices automatically with Prettier and ESLint

Level 3

Work like a pro: plan features, give AI helpful rules, consistent styles, saved data, safe access, and reviewed changes.

3.1
Feature Planning
Prioritze and the essential features first to avoid distraction and scope them to a realistic size
3.2
Cursor Rules
Create rules for Cursor to give the AI more context about your product and the tech stack
3.3
Style Systems
Use style definitions to give you web app a themed look and understand Tailwind CSS basics
3.4
Saving Data
Store and retrieve data in Supabase using modern database patterns and secure server-side operations
3.5
Database Security
Learn to assess and improve your Supabase database's security using the Security Advisor
3.6
Git Workflow
Build new features in git branches, create pull requests, and merge it into production

Level 4

Run production basics: sign‑in, planned sprints, smooth onboarding, powerful tools, and preview vs. live sites.

4.1
Sprint Planning
Manage a productive week with new features and important bug fixes in Linear.
Coming Soon
4.2
MCP Server
Enhance your AI abilities with external tools through the power of MCP Server for more context
Coming Soon
4.3
User Flow
Design a user experience from onboarding new users to making it easy to use your app
Coming Soon
4.4
Login & Signup
Let user signup and login to your app with email + password or Google and manage their profile
Coming Soon
4.5
Auth Security
Make sure a user always is who they say they are and do only what they are allowed to do
Coming Soon
4.6
Preview & Production
Configure domains in Vercel for your preview and production environments to reduce surprises
Coming Soon

Level 5

Harden and learn: mobile‑ready pages, helpful emails, abuse protection, auto tests, real user feedback, and command‑line skills.

5.1
User Research
Interview users and invite them to surveys to understand what they want from your app
Coming Soon
5.2
Terminal Usage
Get comfortable with the terminal and use AI to leverage this very powerful tool
Coming Soon
5.3
Mobile Responsive
Make your app work perfectly on phones and tablets so users can access it anywhere
Coming Soon
5.4
Sending Emails
Send welcome emails and push notifications with Resend so users come back to your app
Coming Soon
5.5
Rate Limiting
Stop bots and abusive users from spamming your API with rate limits and CAPTCHA protection
Coming Soon
5.6
Automated Tests
Set up unit and end-to-end tests so you can ship changes with confidence without breaking things
Coming Soon

Level 6

Operate and earn: payments live, accessible design, safe dependencies, error alerts, tuned setup, and a clear roadmap.

6.1
Product Strategy
Create strategic product roadmaps with measurable goals so your product grows systematically
Coming Soon
6.2
Customized Setup
Explore other coding agents like Claude Code to find the right tools for different jobs
Coming Soon
6.3
Accessibility
Add screen reader support and keyboard navigation so users can enjoy your app regardless of ability
Coming Soon
6.4
Stripe Payments
Accept payments with Stripe so users can pay for your product and you can make money
Coming Soon
6.5
Dependency Security
Keep your npm packages and dependencies updated to avoid security vulnerabilities
Coming Soon
6.6
Error Tracking
Set up Sentry to catch crashes and errors so you fix bugs before users complain about them
Coming Soon