Cursor AI vs V0: Building a Travel Website Homepage (Day 9 Learning in Public)
Day 9 of building my Bali travel directory in public, and I finally got to work on the fun stuff - the actual user interface. But here's the thing: I started with V0, got frustrated, and ended up switching to Cursor AI completely. Let me tell you exactly what happened and why this decision might save you some headaches.
Quick summary
I spent today building the homepage for my travel directory, comparing V0 against Cursor AI for UI development. Spoiler alert: Cursor won by a landslide, and I ended up scrapping V0 entirely. Plus, I learned some valuable lessons about project structure and keeping things organized from day one.
Why I'm building this travel directory
Living here in Bali with my partner Grace, we get constant messages from friends asking for recommendations. "Where should we stay in Canggu?" "What's the best restaurant in Ubud?" You know how it goes.
Instead of answering the same questions over and over, I decided to build a proper travel directory where we can share our actual experiences. Not just another boring listing site, but something personal with real insights from people who actually live here.
The challenge was figuring out the best way to build the user interface quickly without compromising on quality.
What I tried first (spoiler: it didn't work great)
I started with V0 because, honestly, everyone's talking about it. The idea seemed perfect - describe what you want, upload some inspiration images, and boom, you get components ready to use.
Here's exactly what I did:
I found this color palette I really liked - purple, green, blue, and gray tones. I also wanted to use the Satoshi font, but since it's not a Google font, I found Newton as a similar alternative.
I uploaded three inspiration images to V0 and wrote this prompt:
"I would like you to help me come up with a design guideline for my Bali travel directory. It's me and my partner Grace... I uploaded three images where I like the color palette. I have a font I like called Newton. I want a nice hero section, About Us section, featured listings, and recommended activities. Give it a nice personal touch, not just a boring directory."
The V0 experience (and why it frustrated me)
V0 came back with something that looked decent at first glance. But here's where things got annoying:
The colors weren't implementing properly. It kept using this dark brown tone instead of the vibrant palette I wanted. When I asked for more colorful elements, it somehow made everything look cheap and added dark mode automatically (which I didn't ask for).
The bigger issue? I couldn't figure out the best workflow for moving components from V0 to my actual codebase. Should I use npx shadcn add? Download as zip? Just copy-paste the code?
I found myself spending more time fighting with V0 than actually building.
The breakthrough moment with Cursor AI
While V0 was processing my requests, I decided to try the same thing in Cursor AI. I uploaded the same images and gave it a similar prompt about creating a travel-friendly homepage design.
You know what's wild about this? Cursor not only understood my codebase structure but started making changes in real-time. I could see it updating the global CSS, implementing the color palette properly, and creating components that actually fit my project structure.
Here's how I actually built the homepage
Step 1: Setting up the design system in Cursor
Instead of fighting with external tools, I just told Cursor: "Please analyze the codebase first, then create a very travel-friendly homepage design using the colors from the uploaded palette."
Cursor immediately understood I was using Shadcn UI and Tailwind, and started building components that matched my existing setup.
Step 2: Building the homepage sections
The homepage structure I ended up with:
Hero section: Two-column layout (no full background image)
About Us section: "Meet Robin and Grace" with personal touch
Favorite stays: Card layout without pricing (since it's seasonal)
Activities section: Grid layout with placeholder images
Popular areas: For internal linking to destination pages
Newsletter signup: Simple and clean
Step 3: Adding real content and images
I went to Unsplash, grabbed some Bali images, and created folders in my public directory:
public/images/activities/public/images/listings/
Then I told Cursor: "I added placeholder images in these folders. Can you use those so we have a better idea how the page will look?"
It automatically integrated them and the site started looking real.
Step 4: Organizing the project structure
Here's something important I learned: keep your files organized from the beginning. I asked Cursor to move all public pages into a marketing folder, admin pages into a dashboard folder, and auth pages into their own folder.
This might seem obvious, but when you're building fast, it's easy to let things get messy.
The stuff that went wrong
The About Us section had way too much spacing between the heading and content. The font colors were too light and hard to read. I also realized I was being too generic with my prompts initially.
The biggest issue was that I wasted probably 2 hours trying to make V0 work when I could have just used Cursor from the start.
How I fixed the problems
For the spacing issues, I just told Cursor directly: "There's too much space between the heading and content in the About Us section. Can we reduce this?"
For the font readability: "We need darker font colors because it's quite hard to read."
For better visual hierarchy: "Can we add badges per section showing what each section is about? Make the badges colorful and bold."
Cursor handled all of these requests immediately and showed me the changes in real-time.
What it looks like now
The homepage has this nice flow:
Clean hero with "Discover Bali through our eyes" tagline
Personal about section with space for our photo
"Our favorite stays" without pricing complications
"Unforgettable experiences" activities grid
Popular areas for SEO and internal linking
Simple newsletter signup
It's responsive, the colors actually work, and most importantly - it feels personal, not like another generic travel site.
Lessons I'm taking from this
Start with what integrates best with your workflow: V0 might be impressive, but if it doesn't play nice with your existing setup, you'll waste time
Be specific with your prompts: "Make it more colorful" is too vague. "Add purple and green from the uploaded palette" works better
Organize your project structure early: Moving files around later is annoying
Sometimes the simpler tool wins: Cursor AI just worked better for my specific use case
The biggest surprise? I thought I'd need V0's specialized UI generation, but Cursor AI understood design just as well while being integrated into my actual development environment.
What I'm working on next
Tomorrow I'm tackling the authentication system - login and registration pages. After that, I'll build the admin dashboard so Grace and I can easily add new places and experiences.
I'm also planning to create individual destination pages (Canggu, Ubud, etc.) for better SEO and to give people exactly what they're searching for.
Final thoughts
This whole experience reminded me why I love building in public. I could have spent weeks trying to perfect the V0 workflow, but sharing the process forced me to make a decision and move forward.
If you're building something similar, don't get stuck on tools. Pick what works with your existing setup and keeps you moving. The perfect tool is the one that doesn't get in your way.
Also, having a clear project structure from day one saves so much headache later. Trust me on this one.
Following along with the 60-day challenge? I'm documenting everything as I build this travel directory from scratch. The goal is 1,000 subscribers in 60 days - if this helps you with your own projects, hitting that subscribe button would mean the world to me.