Changer

The site is built on Next 14, using React Server Components and nested layouts to create a really slick experience with minimal bloat. Builder.io provides a headless CMS with an extremely flexible layout engine that's a joy to build new blocks for.

Whilst I'm usually a fan of native web animations, the amount of (literally) moving pieces in this project found me reaching for Framer Motion. It's a pretty nifty little library with an intuitive DX and a really reasonable bundle size, so it ticks my boxes.

The home hero animation is based on SVG filters with moving gradient angles, and let me tell you - it's not worth trying to update SVG filters on the fly in Safari.

In fact, I reckon we put Safari in jail with Internet Explorer and give up on it until Apple can get serious about their browser.

Oh yeah, let's talk about the forms!

What a saga.

Like many sane people, Changer were taking applications to their programs through a Google Form. Great idea! Trusted platform. Integrates with the stuff you're already using, you know, pretty standard stuff.

My bright idea was to bring the forms on-site. Yeah, Google has an API to retrieve forms, but if you've ever tried to retrieve something out of a Google API before, you have my condolences. The docs are terrible, stuff that should be API key accessible needs OAuth, and then long-lived refresh tokens sometimes just... don't live very long.

My favourite piece of the puzzle is that the GET API returns field IDs as hexadecimal strings, but the (supremely jank, undocumented) POST API needs them in base 10. Fantastic.

I've gotta make a post somewhere recording my findings so that next time someone else tries this and finds out what it takes, they become so viscerally sick that they can't continue on their journey of self-harm.