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.

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, Link is still a real Web 1.0™ anchor tag in the final output.

Taking the concept further, the Next team recently 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 image optimisation is a powerful concept. 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, improvements can be made under the hood, without me, the developer, having to worry about them.

The last thing I want mention goes back to 2019, when I was a wee lass learning to code I remember there was some angst against Next's requirement of a pages directory. But this "limitation" seems to have turned out to be an advantage. So much is enabled for so little ceremony because Next can guarantee a file inside the pages directory is a route. Some innovations include per page code splitting, per page choose-your-own-adventure data fetching and api routes.

To summarise, I'm enjoying Next because it's an empowering foundation to build my stack on. It gives me, a solo (for now) developer, 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.

Still writing...

Tailwind

...

TypeScript

...

MDX

...

React Query

...

Prisma

...

CSS-in-~~JS~~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!