Adventures in Automation, Part 5

This is the fifth article in a series documenting my quest to transform a $5/month VPS into a playground for experimenting with web programming technologies.

In Parts One through Four, I started with a blank slate and ended up with a collection of Docker projects that integrate seamlessly into a single, unified web experience. But as I used my site daily to manage my kids' chores, I realized something: everything was completely public. I had no authentication system. Could I just “log in with Google” like so many other websites do? Turns out, yes.

Auth0 is one of several authentication providers that simplify this complex aspect of modern web programming. Initially, I attempted to integrate Auth0 directly into my React frontend, but I struggled to make it work. My second attempt was to follow an Auth0 QuickStart guide using Node.js and Express, which I had chosen for my backend. This time, it worked immediately—I could log in using my Google account. Glorious!

I customized the QuickStart app, making it match my site's design and adding an API endpoint. As long as cookies were preserved across requests, authentication flowed seamlessly between frontend and backend apps.

However, I didn't want to lock my entire site into a single identity provider. To keep things flexible, I used environment variables to inject the authentication API URL into each app. This way, my apps remained agnostic about which authentication service was running behind the scenes—an application of the loose coupling principle.

This method of injecting parameters into running containers worked so well that I applied it again in my next challenge: adding common UI components across my site without locking them into a single framework or language. But that's a story for next week!

Do you like logging in with Google or Facebook? Share your thoughts on LinkedIn!