This article was originally published on Rails Designer
In less than a week it's a new year. 2024 was the year I launched Rails Designer. I helped many teams improve their existing Rails UI (four teams I've been pushing pixels for, for over six months! ❤️) and kickstarted a SaaS for three people! 🚀🌕
Oh, and I also published some OSS work (and more coming!). 🧑💻
But besides a really successful Rails UI Components Library with a few dozen developers/teams getting access every(!) week, it also became a pretty successful resource for Rails product engineers (or any Rails developer who wanted to improve their product/front-end skills) reaching monthly visitors in the 5 digits.
So today I wanted to look at what articles drew the most visitors. While I was looking at it, I thought it would be useful for some of you as well. Maybe you haven't been around these parts of the internet since the beginning and you might see an article you haven't read before.
Not using frecency (frequency + recency) scoring, time decay algorithms or applying exponential decay to older visits, because, hey, it is Christmas! 🥂
So here goes. Plain and simple: the ten most popular articles from Rails Designer in 2024!
10. Data-Attributes Magic with Tailwind CSS & Stimulus
This article explores a technique I've been using on showing/hiding elements and content using data-attributes, opposed to adding CSS classes to the respective element. And combines this with a small Stimulus controller. It's a super simple technique, but really powerful to keep your app's UI easy to maintain.
9. Fix Any CSS Z-index Issue With This One Trick
One recurring theme, you will see, with articles in this list, is the use of live code/examples. This one shows how you can win the z-index war by using isolation: isolate (or isolate with Tailwind CSS). 🏆 A CSS property you have to know! Also: What! A! Title! 🤣
8. Building Nested Forms in Rails with Stimulus
Ah, the old nested form. Articles, screencasts and likely ted talks have been made around this subject. But all of them are outdated; some even preceding the jQuery era (feel old already?). This article shows a simple technique that uses a template element and a small Stimulus controller. I should probably write an update to it that goes beyond the basics explained in this article (🤫).
7. Use CSS' only-child instead of if/else logic
A pure CSS-focused article that shows how you can do without that if/else-statement from Ruby, but use CSS to do it for you (works super smooth with Turbo Streams too!). I use this technique all the time! Little fun tidbit: Chris Coyier (from CSS Tricks) that I have been learning CSS from for over a decade, also linked to this article from his blog. ❤️
6. Changing CSS as You Scroll with Stimulus
A JavaScript-focused article that explores a way to change CSS for an element on scroll. Not using an InteractionObserver, but good old scroll listeners (using requestAnimationFrame of course, we are good internet citizens!).
5. Lesser Known Rails Helpers to Write Cleaner View Code
An article that goes over a dozen, or so, Rails helpers quickly. I you haven't read it, I am sure you will learn something new (otherwise feel free to yell at me).
4. Rails' Partial Features You (didn't) Know
Everything there is to know about Rails partials is in this article. No, really! Just like the previous article; if you haven't read it, you will sure learn at least something new. Might be odd considering I offer a pure ViewComponent-based UI Components Library, but that could change soon maybe. Maybe…
3. Stimulus Features You (Didn't) Know
Most Rails developers have a good basic understanding what they can do with Stimulus. But there are quite a few (added over the years) features that are less known (and thus used). This article explored the most lesser known features of Stimulus. It saw quite some shares around the Rails-o-sphere (and gotten great feedback ❤️).
2. UI Design Tips Using Tailwind CSS for Developers
Developers need to do design! That much is clear. This article showed easy to add tips to help your UI get to the next level. The before and after code examples helped here to get the ideas across.
1. Hidden Gems of Tailwind CSS
See that early peak in the graph above? That was because of this article shared on the orange website. The discourse was mostly around how horrible Tailwind CSS is vs how amazing 🤣 (if I remember correct). Also the hero image got some attention (which looking at again, I am not too fond of either now). But even without that source, this article would still be the most-read article. It sees traffic every day since launch and I've improved it every now and then. I think the live examples here too really helped getting the message across.
And there you have it. I told you: Tailwind CSS is popular, of course these two article are the number 1 and 2.
I also wanted to highlight two tools I built that done really well (seeing daily traffic):
There you have it. It was a pretty amazing year for a product/service this new. I've a long list of articles, tools and OSS ideas (some are close to ready) that I will be launching in 2025. I am sure it will be amazing.
If you are celebrating: hope you had a great Christmas (did you give Rails Designer's UI Components Library to anyone? 🎅) and a splendid start of the new year! 🎆
See you in 2025! ❤️
Top comments (0)