Tools I'm currently enjoying and ones I'm excited to try
I've recently fully returned to the world of web development after a brief hiatus working at Lambda School. (I'm sorry I left, please take me back). As I've got stuck back in, I wanted to share and celebrate the tools that I've had a wonderful experience using.
Next.js
I'm partial to a bit of React.js, and Next.js has always been a standout framework to me.
Back in 2019, when I was a wee lass learning to code I remember there was so much angst against Next's requirement of a pages directory. But what foresight from the creators! Because Next can guarantee a file inside the pages directory is a route, so much is enabled for so little ceremony such as per page code splitting and per page choose-your-poison data fetching.
I'll use Next's Link component to help explain why I enjoy Next itself. As you know, Link is a React component that builds on top of the a HTML tag. Without significantly changing the way you'd normally use the anchor tag you get the benefits of preloading and client side navigation automatically. And of course, the old guard doesn't have to fret because Link is still a real Web 1.0™ anchor tag in the final output.
Taking the concept further, the Next team recently (to me) released the <Image> component. Using an <Image> component the same way you'd use an <img> tag you get a mobile data friendly, anti jank, image for free. The developer is happy, the browser is happy and the end user is happy. The contract is almost: capitalize a HTML tag and get an enhanced-but-real-html-under-the-hood component for free. Automatic optimisation is a powerful concept. Such leverage. I wonder what's next? 🥁
To me, Next.js is to React what Link is to a and what React is to building UI. Because there is a bridge between my interface and the final output, stuff can be done underneath that improves my life, without me, the developer, having to worry about it.
To summarise, I'm enjoying Next because it's an empowering foundation to build my stack on. It gives me, the laydeveloper, access to things previously behind the closed doors of large teams in Series C+ tech startups. It's constantly evolving and zealously backwards compatible. While I am building the 100th button, the great team behind Next is improving the framework and pushing the web forward. People far smarter than me are tweaking the engine to get every ounce of performance out of it and I can redirect all the energy I would have wasted trying to optimize a webpack config into building actual UI. Then you combine Next with Vercel and deploying and hosting is a dream. Oh boy that's awkward. This sounds a bit like a love letter.
Still writing...
Tailwind
...
TypeScript
...
React Query
...
Prisma
...
CSS-in-TS
After a year or so (a decade in JS time) of stability in the styling world, there seems to be a renascence, or at least a new take on styling boxes in JavaScript which seems to be primarily enabled by css variables (?). I'm content with Tailwind for now but tools like stitches and vanilla-extract seem worth a shot, especially for larger design system-y projects. Plus that end-to-end type safety bro!