On the personal front, I will be getting married and my fiancée put together a wedding invitation website on The Knot. It’s mostly fine as a standard website builder, but the latency of navigating from one page to the next is insanely bad, taking up to 7 seconds. The weird thing is if you navigate to the page directly, it actually loads pretty quickly, so it was something to do with intra-site navigation.

I probably should spend more time to debug this, but my instinct was to spin up a quick wedding website on my own. In an unimaginable stroke of luck, I found this NextJS portfolio template that fulfilled my list of quite idiosyncratic requirements:

• i18n: I need to display the content in 3 languages (English, Chinese, Japanese)
• Password-protected route to an otherwise frontend-only app (for the RSVP)
• Image-heavy (naturally)
• Mobile-responsive

I spent most of yesterday firing up Cursor and using the new Sonnet 3.7, and was quite pleased with the result.

Some technical notes:

• I embraced the vibe coding spirit, i.e. since I knew this was not code I had to maintain in the long run, I focused on whether the result was what I wanted.
• In a single day, I consumed 168 premium (Claude 3.7) requests. The monthly quota is 500.
• It is obviously much easier to vibe code when you can actually read and evaluate the code.
• I thought a particular feature was a good illustration of what it’s like to build with AI.
  • I asked Claude to build this photo timeline page, to emulate what was available on The Knot. From start of prompt to a working prototype took <30 minutes.
  • While I prompted it to create a simple straight line of photos, Claude actually went ahead and implemented the left-right alternating photo feature on its own
  • It even made the photos expandable upon clicking, which goes beyond what the original The Knot site-builder offered.
  • However, once the prototype was built, the eagle-eyed user would quickly notice rough edges that need to be smoothened. So, for example, if one clicks on multiple photos without closing the previous photo, it’s easy to get the site to be in a weird state
    • Weirdly positioned photos
  • To properly produce a polished product, much more than 30 minutes is required, but in this case, I didn’t think it was worth the time to polish the photos timeline further (in fact, I feel shy about publishing our photos to the Internet in this way…)

In other words, I think vibe coding is uniquely suitable for a low-stakes, frontend-only project like this. If I were building serious, mission-critical software, I would almost definitely not build it this way.