<< Back to Projects

Designing My Personal Website

March 5, 2026#v0#cloudflare#neon#supabase#codex#next.js#tailwind css#vercel

> The Vision

I wanted a simple home on the internet. A place to share the vibe-coding projects I’ve worked on.

This time, I had a clear design in mind: a retro 8-bit pixel art world that felt nostalgic and playful. I imagined a video-game-style character greeting visitors and introducing who I am, alongside a simple Projects page where I could publish blog posts about the things I’ve been building.

Thankfully, there are not many Anna Jangs out there building personal website. I was able to secure anna-jang.com at a reasonable price on Cloudflare.

>> Choosing The Tool

In an interview with Vercel Founder Guillermo Rauch, Lenny said v0 was the third most-used engineering tool his readers used day-to-day, ranking just behind Cursor and Github.

To this point, I had only used Vercel for deployment. I hadn’t tried their native AI builder yet so I decided to try it out.

What I instantly liked about v0 was its feature to enhance prompt. Normally I’d paste prompts into ChatGPT or Claude refine them, especially early in a project. Having that built directly into the tool felt super convenient.

This was the enhanced prompt it generated from my rough design idea:

Design a vibrant and playful personal portfolio website that features an 8-bit pixel art animation theme to evoke a fun and nostalgic atmosphere. The homepage should include a simple animation of a female Asian character welcoming visitors with a greeting like 'Welcome to Anna's world!'. When visitors click on the 'About' section, a speech bubble should appear, providing a brief, engaging description of who I am and the purpose of the site. The website should have a 'Projects' section accessible via navigation, which leads to a separate page displaying a list of blog posts, each showcasing my projects through text, screenshots or demos. The blog post creation process must be straightforward and user-friendly to enable easy writing and updating of content. Ensure that the entire website maintains a consistent 8-bit pixel art aesthetic and fun vibe throughout, with a clear, intuitive user experience suitable for showcasing personal projects.

Surprisingly, most of what you see on the site came from this first generation.

>> Challenges

Because I built the site using v0, the system naturally suggested I use Neon, Vercel’s native serverless Postgres database. One downside was that it doesn’t have a built-in authentication. Things started breaking when I tried to add a log-in function for editing blog posts.

Since I already had an account with Supabase, which includes database, authentication, and store (for images), migrating the database ended up being the easier solution.

v0 was excellent in the initial design phase, but it burned through credits quickly, even when fixing small bugs.

Eventually I downloaded the project file and finished it using Codex.

>> Tech Stack

  • Next.js + React + TypeScript - Full-stack web framework
  • Tailwind CSS + Shadcn UI + Radix UI - Styling
  • Supabase - Database/auth/image storage
  • Cloudflare - Domain purchase
  • Vercel - Deployment
  • v0 + Codex - Vibe coding tools
Designing My Personal Website - Anna's Pixel World