Vibe Coding My Website with Cursor + GPT-4.1

For the first post on Practical AI, I wanted to share a small win that felt like magic: building and customizing my personal website using AI-powered vibe coding.

I started with the Next.js Portfolio Starter Kit from Vercel — a solid, minimal template that's perfect for showcasing projects and a blog. But instead of manually tweaking code, I used Cursor (an AI-native code editor) paired with GPT-4.1 to make the edits.

The experience? Surprisingly smooth. I didn't write a single line of code manually.

For example:

• I asked Cursor to "add a profile picture to the homepage" → done.
• "Update the navigation links" → done.
• "Push changes to production" → yes, even that worked.

Even slightly more nuanced instructions like "on the main page, add a second-level heading above the blog posts titled 'Latest posts'" were interpreted correctly and executed in seconds.

Was it all basic stuff? Yes. But that's the point — all those little edits that would normally take 15–30 minutes each (with lots of context switching) took seconds. Vibe coding isn't just a meme; it's a real productivity booster, especially when you're trying to get something off the ground quickly.

In my next post, I'll take a look at Lovable — another tool that fits the vibe coding ethos.

Until then: Vibe coding continues!