A couple of months ago my colleague Michael @mythmon Cooper wanted to add a feature to the front-end code of Whatsdeployed and learned that the whole front-end is spaghetti jQuery code. So, instead, he re-wrote it in React. My only requirements were "Use create-react-app and no redux", i.e. keep it simple.

We also took the opportunity to rewrite some of the ways that URLs are handled. It used to be that a "short link" would redirect. For example GET /s-5HY would return 302 to Location: ?org=mozilla&repo=tecken&name[]=Dev&url[]=https://symbols.dev.mozaws.net/__version__&name[]=Stage... Basically, the short link was just an alias for a redirect. Just like those services like bit.ly or g.co. Now, the short link is a permanent fixture. The short link is included in the XHR calls to the server for getting the relevant data.

All old URLs will continue to work but now the canonical URL becomes /s/5HY/mozilla-services/tecken, for example. The :org/:repo isn't really necessary because the server knows exactly what 5HY (in this example means), but it's nice for the URL bar's memory.

Another thing that changed was how it can recognize "bors commits". When you use bors, you put a bunch of commits into a GitHub Pull Request and then ask the bors bot to merge them into master. Using "bors mode" in Whatsdeployed is optional but we believe it looks a lot more user-friendly. Here is an example of mozilla/normandy with and without bors toggled on and off.

Without "bors mode"
Without "bors mode"

With "bors mode"
With "bors mode"

Thank you mythmon!

Lastly, hopefully this will make it a lot easier to contribute. Check out https://github.com/peterbe/whatsdeployed. All you need is Python 3, a PostgreSQL, and almost any version of Node that can run create-react-apps. Ping me if you find it hard to get up and running.

Comments

Your email will never ever be published.

Previous:
KeyCDN vs. DigitalOcean Nginx April 12, 2019 Web development, Nginx, Web Performance
Next:
I think I might put my whole site behind a CDN April 23, 2019 Web development, Nginx, Web Performance
Related by category:
How I run standalone Python in 2025 January 14, 2025 Python
How to SSG a Vite SPA April 26, 2025 JavaScript, React
Switching from Next.js to Vite + wouter July 28, 2023 JavaScript, React
An ideal pattern to combine React Router with TanStack Query November 18, 2024 JavaScript, React
Related by keyword:
How to create-react-app with Docker November 17, 2017 Linux, Web development, Docker, React, JavaScript
Inline scripts in create-react-app 2.0 and CSP hashes October 5, 2018 Web development, React, JavaScript
A React vs. Preact case study for a widget July 24, 2019 Web development, Web Performance, React, JavaScript
Whatsdeployed November 11, 2015 Python, Web development, Mozilla