Yeah I do get the pushback on Tailwind. Adam called out why he did it in the article, and I figured there is an awful lot of Tailwind-heads out there so we went with it. That reason you point out is a good example of the cognitive dissonance that you get when you have to mentally switch between Tailwind and regular CSS.

To add on to what Chris said, you can literally paste those divs into normal html, and just change className to class and be done.

Even non-React frameworks like Vue and Solid use JSX. I urge you not to be scared of it! 🙂

C’mon now, they are very literally just <div>s. I think if you had to work on a project that involved code like this, and you were already familiar with basic HTML, you wouldn’t say “sorry boss, don’t know that stuff”, you’d go “oh, I get it, it’s just divs”.

I intentionally left JSX in the later examples because it felt more real-world to me. The very reason you might have position: sticky; problems is because you’re looping over some data that produces UI, and there is enough data that it has pushed some part of the UI big enough that the problem only then emerges.

It was written in JSX. It’s hard to see how JSX adds any real complexity. There’s not many web devs at this point who aren’t familiar with it.