Sam Jarman

View Original

Project: When's It At?

I recently had two problems that came together as a solution.

I was annoyed at times for global events (such as Fortnite’s downtime windows) being published in UTC or PST - and not even shown to me in my own timezone. I wanted to know when it was happening in my time zone and how far away that was.

The second problem I had was that I really wanted to try to host a simple CRUD style app on Cloudflare workers and see what it can do. I wanted to try out their DNS, Key-value storage, static file hosting and worker JS environment. I’d used it a little bit at a previous company, but like most technologies, if you don’t set it up yourself you don’t learn too much.

Inspired by When Is Keynote?, enter the solution: whensit.at


When’s it at is a React app served entirely from a Cloudflare worker. The user interacts with a simple form, completes a CAPTCHA (to prevent people spamming the otherwise quite open API) and then submits the event information. Seconds later, thanks to Cloudflare, that data is pushed around the world to Cloudflare’s 100+ data centres. The ‘backend’ here, or more accurately, the worker code, has a couple of jobs. First, it can go out to the external web, it needs to do this to verify the captcha. And secondly, it can read and write from Cloudflare’s KV storage.

The user can then share a link to someone and that’ll load in lightning-fast time for them and start counting down.

I live in Sydney and there is a Sydney Cloudflare location. The API takes just 54ms to respond. Insanely fast.

Now, obviously, such a site doesn’t require such low latency, but it’s an actually useful tool that I wanted to see in the world, plus it’s a chance to learn. It costs $5 a month to run this (and all my other workers, TBA).

This project is also suitable for me to learn other front end frameworks in the future. The likes of Svelte and Preact currently appeal.


As for Cloudflare workers, I enjoyed the experience. The CLI “Wrangler” make things quite easy, but finding a suitable template to write both worker code and front end code in TypesScript and build and deploy it was difficult, and the solution I came up with is a little janky, but something I’ll look to improve with my next project. I think if I need a simple hosting solution in the future, a worker is a sensible thing to reach for. Performant by default, a lot of hosting needs in a single place (dns, database, code) and cheap to use. Like any technology, it has its strengths and some projects make suit those or may not.