Claude Code + Playwright MCP can now design, debug, and ship production-ready landing pages in minutes.

I’ve tested this workflow on real projects and it’s faster than any manual setup I’ve ever tried.

Here’s the full breakdown ↓ 1/ Why this matters

Most people see Claude Code as a tool for creating the backend.

With Playwright MCP, it turns into a front-end engine:
• Builds layouts from prompts
• Opens a real browser to preview results
• Tests every breakpoint automatically
• Finds bugs, fixes them, and retests

This is design, testing, and QA happening in one place.

What is Vibe Marketing?

I’ve been deep-diving into this lately.

It’s the biggest unfair advantage I’ve seen since early FB ads in 2008 or the App Store in 2010.

Here’s what I’ve learned so far ↓ 1/ What is Vibe Marketing?

It’s where AI + automation meet modern marketing.

At the core:
• Vibe coding tools (Lovable, Cursor, Claude Code)
• AI agent workflow tools (Gum Loop, Make, Zapier)

Together → they automate and scale processes humans used to grind through manually.

We’ve built 20+ MVPs for our clients with AI

The biggest thing I learned about AI coding is… it needs a detailed plan.

Most people jump straight into coding. That’s a mistake.

Documentation is 80% of the work. Implementation is only 20%.

Here’s how I build my MVPs:

🧵👇 1/ Plan Before You Code

AI tools are powerful, but they need guidance to perform well. A clear roadmap reduces hallucinations, debugging errors, and unnecessary revisions.

Before I even open Cursor, I have these docs ready:

- Project Requirements Doc
- Tech Stack Doc
- App Flow Doc
- Frontend Guidelines Doc
- Backend Structure Doc

I used to create these manually. Now I use @codeguidedev to generate them in minutes. Saves time, reduces hallucinations, and makes everything smoother.

Cursor + Supabase + MCP = AI-powered MVP development at its best.

This is how I’m shipping client MVPs faster, cheaper, and smarter with AI handling the backend, database, and migrations.

Let’s break it down. 1/ The Problem with Traditional Development

Building MVPs the old way takes too much time:
- Setting up the database
- Writing boilerplate code
- Managing API integrations
- Handling migrations manually

But with Cursor + Supabase + MCP, AI automates most of this, letting you focus on shipping fast.

Cursor and Claude Code make building fast. But without a system, your MVP will break.

Here are 7 lessons I learned after building 20+ MVPs with Lovable, Cursor, and Claude Code.

Bookmark this if you want to ship clean, not just fast. 1/ The wrong stack will break your MVP

Cursor doesn’t code like humans. It replicates patterns it’s seen before.

So if your stack is rare or messy, it’ll hallucinate.

What works for me:
• Next/React for frontend
• Supabase for backend
• Stripe for payments
• Vercel for deploying

Cursor flows clean when your stack is AI-native.

Top 5 MCP Servers for Vibe Coding

If you’re building with AI and still doing everything manually, this thread will change your workflow forever.

Bookmark this ↓ 1. What’s an MCP?

MCP = Model Context Protocol

Think of MCP like USB-C, but for AI.

It connects your AI agent to tools, databases, docs, and services in one clean setup.

Just like USB-C lets one cable do it all, MCP gives Cursor clean access to what it needs so it can actually work like a real dev.

No more dumping context manually.

This is how AI actually gets useful.

Every AI Tool I Use to Build MVPs FAST for My Clients

As an MVP agency owner, speed and efficiency are everything.

Here’s my go-to AI stack that has completely changed how I build MVPs: 1/ @lovable_dev

I start almost every project in Lovable.

It lets me:
• Build UIs quickly with built-in integrations
• Sync directly with Supabase for backend functionality
• Integrate Stripe for payments and OpenAI for AI features

Example: I built a subscription-based app where the entire UI/UX, auth, payments, and dashboards were set up in a few hours. The time saved is insane.

Here’s my @lovable_dev + @cursor_ai workflow for building MVPs.

Nothing beats this combo.

I’ve shipped 12+ real products using it. Here’s the full breakdown ↓

And if you want the detailed video, comment “lovable” and follow. I’ll DM it to you. 1/ Start in @lovable_dev

Every MVP starts inside Lovable.

Why? It lets me build full apps visually with:
• Supabase auth (email, Google, magic links)
• Stripe integration (checkout, subscriptions)
• OpenAI-powered features
• Fully responsive frontend flows

This saves me days of manual coding.

This is the most efficient Cursor workflow I’ve used.

If you’re building MVPs fast, this combo is unbeatable:

TaskMaster + Cursor + CodeRabbit

Bookmark this. 1/ Why you need TaskMaster

Cursor is powerful, but as your MVP grows, you’re juggling:

• Feature backlog
• Refactors
• Bugs
• AI forgetting context

TaskMaster fixes that.

It acts like a project manager inside your terminal.

GitHub Link: github.com/eyaltoledano/c…

How I designed and built a PWA using AI

The client wanted a mobile app, but I recommended a PWA for faster development and lower costs.

Here’s how I designed, built, and launched it using AI ↓ 1/ Planning the Idea With AI

Every project starts with a clear understanding of the problem, solution, and audience.

I used @ChatGPTapp to turn the client’s rough idea into a structured brief.

Prompt:
“I’m starting a team productivity tracker for remote teams. It should help managers track work hours, task completion, and team efficiency. Convert this into a concise project brief.”

ChatGPT structured it into:
- Problem: Teams struggle to track and improve their daily work
- Solution: A web-based productivity tracker with AI-generated insights
- Target Users: Remote teams handling multiple projects

Having a well-defined brief saved time and avoided confusion later.

I can’t stop building beautiful hero sections inside @lovable_dev
This one turned out insane.

Credits: @DannPetty
Full breakdown below ↓ 1/ Start with visual inspiration

I found this layout from Dann Petty’s portfolio and instantly knew I wanted to rebuild it.

Great structure. Clean font. Strong first impression.

https://x.com/DannPetty/status/1936107118353895663

If you’re still copy-pasting Shadcn components manually, you’re wasting 80% of your dev time.

I’ve built 20+ MVPs and learned this the hard way.

Here’s the workflow that changed everything 👇 Most devs do this:

→ Ask ChatGPT to build UI
→ Get broken components
→ Debug CSS for 2 hrs
→ Copy-paste Shadcn docs
→ Fix styling
→ Repeat forever

Sound familiar?

1 year ago, I was a full-time dev trying to make an extra $1K/month.

Today:
→ I run an AI MVP agency
→ A paid community for AI-first devs
→ Launching my first SaaS soon
→ All bringing in ~$30K/month total

Didn’t plan this.
Just kept building in public.

Here’s the story 👇 1/ Started with small goals

Back in Sep 2024, I was just posting what I was learning and building.
Hackathons, AI experiments, random ideas.

Didn’t care about likes.
I just wanted to build, share, and maybe make $1K extra alongside my full-time job.

https://twitter.com/1676906284715503617/status/1840435812766220707

Want to steal the UI/UX of top companies and use it in your own app? (Legally?)

Here’s my exact Mobbin + Figma system to do it ↓ 1/ You don’t need to invent design

You just need to reuse what already works.

Products like Uber, Bolt, and Notion have spent millions perfecting their UX.

Your job is to study their flow and use AI to recreate it.

I’ve vibe coded 18+ MVPs for clients using Cursor.

Security was the one lesson I learned the hard way.

Here’s the checklist I wish I had from day one ↓ 1. Rate limit your endpoints

If you skip this, bots or bad actors can hit your backend 100s of times per second.

This can:
• Crash your database
• Drain your Supabase usage
• Spike costs or open you to attacks

Tools to use:
• Supabase Edge Functions with a rate limiter
• Vercel Middleware
• Basic IP throttling with Next.js middleware

Want to 10x your Cursor or Claude Code workflow?

Stop prompting like a developer.
Start thinking like a product manager.

Here’s how ↓ 1. AI tools are developers, not product managers

Cursor, Windsurf, Lovable, they’re great at execution.

But they can’t make product decisions for you.

If your prompt lacks clarity or structure, the output will suck. Every single time.

How I Make Cursor Write Perfect Code Every Time

It’s not about better prompts.
It’s about better rules.

This is how I train Cursor to ship clean, secure code on the first try ↓ TLDR:

• Set Global Rules for coding style
• Generate Project Rules using /generate cursor rules
• Stop copy-pasting Cursor Rules. Write ones that fit your codebase.
• Use 5–6 custom .mdc files per MVP
• Attach rules as “Always”
• Let Cursor code with real context

The exact workflow I use to ship high quality MVPs fast for my clients.

I use this to plan, design, build, and launch full MVPs in 2–3 weeks.

After 18 builds, here’s the exact system that works.

Bookmark this ↓ 1/ Plan with ChatGPT or Gemini

Before diving into the code, fully grasp the idea.

This phase is about achieving clarity. By its end, you should understand every aspect of the idea: the tech stack, core features, target audience, EVERYTHING.

Use ChatGPT or Gemini to create these docs:
- PRD/ MVP Plan
- UI Development Plan
- Database Design
- Implementation Plan
- Launch Checklist (you can generate this later, but use the same conversation)

Spend time here; it saves you from chaos later.

I’ve built 18+ products for clients using Cursor, and I’ve cracked the most efficient way to use it with minimal mistakes.

If you’re a beginner, this thread has all the tips and tricks you need to get started and make Cursor actually work for you 👇 1/ Set up Cursor Rules

This tells Cursor your coding preferences and standards.

Use /generate-cursor-rules

Stop copy-pasting random project rules. Build them based on your own codebase context. You’ll get way better results.

Save this if you want your next AI site to ACTUALLY look good.

This is the exact UI workflow I use on every client MVP 👇 1/ Stop saying “make this UI beautiful.”

That’s exactly why your site looks messy and inconsistent.

Here’s what I do instead:
→ Take a screenshot of any site I love
→ Drop it into ChatGPT
→ Ask it to create a design.json that captures the layout, colors, spacing, typography

Then I tell Cursor:
“Use this design.json for styling only.”

Works insanely well.

Want to know how I use Cursor and Lovable to ship MVPs fast for clients?
I’ve built 18+ products using this exact workflow.

Here’s the full system I use to plan, design, build, and launch.
👇 Save this. You’ll need it. 1. Start with planning

Before writing a single line of code, I plan everything inside ChatGPT.

The documents I create:
- PRD (Product Requirements Document)
- UI Development Plan
- Database Design
- Implementation Plan

This step is where 90% of the clarity comes from. The more structured these are, the better the output across every tool.