Vibe-coding with taste

Hey! If you’re reading this, welcome to my website.

Although I already have an existing website, I justified creating another one because I wanted a platform to share my thoughts and showcase my portfolio.

I wrote approximately zero lines of code in the process of creating this website. Honestly, my biggest contribution was probably my taste. That includes:

• How the codebase is structured
• The design language of the website, i.e. my taste in visuals
• Making my own life easier when maintaining and adding to the website

I think taste extends beyond just how something looks. It also influences the decisions you make when building something, including what not to build.

What I didn’t build

SPA vs MPA

For example, I don’t think there’s much of an argument for using a SPA framework like React for this website. State management becomes more trouble than it’s worth, and I don’t really need the responsiveness of a SPA here. The only place I actually use React is the tag filter on the Writing page. Everything else is just HTML.

SPA:

<Link to="/writing/hello-world">Hello world</Link>

// ...then on the post page
const { data: post, isLoading } = useQuery({
  queryKey: ['post', slug],
  queryFn: () => fetch(`/api/posts/${slug}`).then((r) => r.json()),
});
if (isLoading) return <Spinner />;

MPA:

<a href="/writing/hello-world">Hello world</a>

Of course, this isn’t to say that every SPA requires this much boilerplate. But for a website that’s mostly static content, I don’t see much value in introducing client-side routing, state management, and additional JavaScript when plain HTML does the job.

Comments

Another deliberate decision was the commenting system on this website. I really didn’t want to store comments in a database, and build a backend (however simple it may be). The fact is that, I’d have to find a way to host an extra service(s) and that cost money. More money than I’m willing to spend…

In fact, Claude initially steered me towards building a Go service backed by an entire Postgres database. I ended up using Giscus, an open-source commenting system powered by GitHub Discussions.

Even better, I effectively got authentication through GitHub, which provides at least some barrier against anonymous abuse. The biggest win, though, is that I don’t have to pay to host or maintain my own backend.

The trade-off is that you need a GitHub account to comment, but honestly, if you’re reading this, you probably have one.

My taste

Finally, I want to talk more about the visual style of this website.

I placed a lot of emphasis on having a consistent design language. Of course, Claude created the initial spike, but I didn’t want to end up with just another generic vibe-coded website. (Although, many people may think this still looks very vibe-coded, and I’d agree to some extent.)

I think what makes this website unique is how I’ve tried to sprinkle my personality across each page.

The landing page features a 3D Blender model that I made quite a few years ago. I still remember spending hours looking up how to model a book, a lamp, and window blinds in Blender, a process I genuinely enjoyed. There’s even real-time lighting (via Three.js) in the scene you see!

Another personal touch is the use of company logos on my Work page. I once saw this flamboyant resume that used company logos instead of the standard Jake’s Resume styling, which I found extremely cool. Obviously, I’m not the first person to use company logos to showcase work experience, but it’s something I really wanted on my website.

Ultimately, I think that’s what I wanted out of this project. I didn’t necessarily want to write all the code myself. I wanted to build something that looks and feels like mine, while making deliberate decisions about how it works.

And if I’m going to vibe-code an entire website, I might as well do it with some taste.

Play