Our stack of choice - revisited
Previously, we have shared our development stack of choice. We feel confident using the tools we use and have always kept an open mind about new technology options. If you haven't read the previous post, I recommend you read it first. 😊
Few areas in the industry evolve as fast as web development. As developers, it’s more important than ever for us to keep up with technology changes.
Since we like to focus on productivity and getting things done correctly, we realized it was time to revisit some of our development choices.
We still stick to React
Yes, React is here to stay. It's safe to say today that both Node and React still have a market share to capture, and therefore you will see them being the most relevant JS frameworks for the next couple of years — if not a decade. The community is only growing stronger with popular vanilla plugins offering React-friendly versions. There are other fascinating open-source libraries, such as Svelte and SolidJS. It is important to have more quality choices and not put all your eggs in one basket. But we are still keeping ours in React. For now.
We realize SASS is often under-appreciated
The way you write CSS still matters a lot. We have best practices with mixins and a couple of do's and don'ts. However, one thing remains: don't underestimate CSS.
Make a few rules with your team and stick to them — no matter what. If your project is supposed to scale, your rules must be as strict as possible. This will ensure your codebase can grow consistently, making it maintainable and easy to jump into. Believe it or not, this can be the most challenging part of scaling your app.
This is why we realized how good SASS could be. It helps have a more readable codebase. The same can be achieved with other solutions, but SASS makes everything easier. When you thought new CSS features would eventually make preprocessors obsolete, they didn't.
Animation still dictates how you do it
Our thinking on how to address animations remains the same: "Usually, we have a healthy mix of both. It's not the best maintenance, as keeping some configuration synched between CSS and JS can be cumbersome, but hey. We want the smooth pixels. It's worth it." - Me, from our previous “Our development stack of choice”.
We like to be pragmatic about motion and WebGL. We have a few go-to choices for when we need to get things done, including Lottie, Framer motion and react-three-fiber. These are solid, popular choices and easy to integrate with a codebase. Meanwhile, CSS is still favored here as much as possible to ensure the best possible performance in the browser, just like we have been doing.
Shout out to Studio Freight, which released an excellent smooth-scrolling library called Lenis, which we are big fans of. Pop Motion's popcorn proved to be very useful, too.
After years of practicing WebGL websites, we decided to open source our internal library for progressively enhancing websites with WebGL.
Sanity rocks our socks
It was good while it lasted. While Prismic has some pros, including its friendly UI, it is somewhat limiting and entirely manual. We still like Prismic very much, but in our quest for our tech-stack holy grail, we decided to give Sanity a try.
We don't work for Sanity, nor are we sponsored by them. So I'll leave their link here if you want to check their features.
Truth be told, though, they have a solid and very developer-friendly product. If we have to pick three reasons, they would be:
- Building schemas with code
- Having reusable components
- Providing a great editorial experience
These reasons opened up many possibilities with us. This is our default choice of CMS for now.
The flexibility of Sanity’s editor alone is a worthy reason to give it a shot. Your devs and your client will be happy with a clean implementation that has everything you need to make a custom experience.
NextJS is miles ahead of Gatsby
We like to be a little biased. And this would only be a good post to read with something controversial, so here it is. The title speaks for itself, and I urge you to follow up with NextJS news and milestones.
Don't get me wrong, Gatsby is awesome. It's great to have both tools together in the same market. Both are exciting and great to use, and we still come back to Gatsby when we have to—but starting a project from scratch? NextJS is our default pick. With NextJS we stay cutting-edge by following the latest React features and performance-focused updates.
And this is where we are today. If you are curious about our tech stack or how much we have changed/evolved since the last blog post :)
The curiosity remains. We like to check what's out there and still keep an eye out for quality tools — as any good developer should. We are closer to hitting the sweet spot on a tech stack that we are proud to reuse and evolve.
Cheers to front-end development for making this a fun ride.