Hi there, and welcome to another issue of the Top 3 in Tech newsletter!

This week I got some awesome tools and resources ready for you, so let’s get right to it:

1. Supabase

Supabase is a super cool technology I’ve been looking into recently. It’s an open source Firebase alternative that’s been around for a few years - but it feels like it has hit a great point of maturity recently, with tons of cool features and really good documentation!

The problem with a tool like Firebase has always been that it’s owned by Google. Which means, it might have some great features and be easy to work with, but using it locks you in to Google’s ecosystem and pricing model. Which can be very risky to build on top of.

Supabase goes the other way. They do have a managed platform you can pay to use (with a generous free plan too), but since it’s open source, there’s nothing stopping you from hosting it yourself - completely avoiding the platform lock-in of something like Firebase.

Additionally, it’s just a super smooth way to get an entire backend up and running complete with:

… and much more, in a very short amount of time. They also have a great JavaScript client to then interact with all of these features, and it works like a breeze (with great documentation for when you get stuck).

So, if you’re a front-end developer (like me) who’s also interested in adding a backend layer in order to build full-scale, production-ready applications, Supabase is an amazing place to start. I was stoked to see how easy it was to setup these features in hours that would otherwise take me days or weeks if I had to do it all manually…

Check out and learn more about Supabase here

2. HTMX

If you’ve been on Twitter lately, you might have heard of HTMX - a new HTML-focused UI library that works (kind of…) like a substitute for the modern JS frameworks like React and Vue.

Basically, it allows you to “sprinkle in” additional attributes in your HTML to make it more interactive - like adding a “hx-get” attribute to a button that will then fetch and update the HTML based on what gets delivered from your backend server.

It’s definitely an interesting approach, and I think it makes sense for rather simple sites built with traditional backend frameworks like Laravel, Django or Ruby on Rails. But writing a large, interactive, front-end heavy application using this pattern seems… adventurous, if you ask me 🤔

Either way, there’s been a lot of debate about HTMX and it’s definitely a very different paradigm than we’re used to, so I thought it was worth talking about. But if you’re currently learning React or another JS framework, don’t worry - that’s not getting replaced by HTMX any time soon (my bet is on never).

If you’re curious, check out this 100 second breakdown video to learn more about HTMX:

3. Refactoring.Guru

The last pick for this week is a cool website I came across for learning more about refactoring, design patterns, and other technical programming topics.

I’m a front-end developer, so I’ve always focused on crafting beautiful and usable user interfaces - as that’s what I love to do! But as the capabilities of the front-end has grown in the recent years, more and more code is now moving to the front-end. It’s not really enough to just be great at HTML and CSS anymore - you also need to have a solid grasp of JavaScript for more than just manipulating UI.

This development means that our front-ends get more complex. And as a piece of software grows in complexity, so does the need to write robust, clean and extendable code. Refactoring.Guru helps you do just that, by breaking down tons of ways for you to write better code: like when/how to refactor your code to prevent bugs, and how design patterns can help you (and other developers!) better understand and work on your codebase.

It’s been a great resource for me to learn about the more technical aspects of programming and get a better understanding of how to write higher quality code. And of course it doesn’t hurt that most of the guides have awesome visual examples, like this raccoon breaking down a function that has become too long and unwieldy:

So yeah, definitely check out Refactoring.Guru if you want to level up your core programming skills. Even if some of the refactorings or design patterns might not seem that applicable to you now, I can almost guarantee they will be in the future - so just knowing that they exist is already a good start.

​That's all for now! See you in 2 weeks ✌️

If you did, why not share it with your friends! Either by forwarding this email, or by posting about it on LinkedIn, Twitter or Facebook. You can also simply copy/paste the link mads.fyi/top3 on other platforms. It really helps to keep me motivated and let the newsletter grow 🔥

— Mads Brodt