Wednesday 8 December 2021

Learn From Remix

I’ve built websites that are used by millions of people all over the world. I’ve made more mistakes than I care to count and I’ve had to deal with the repercussions of those mistakes for years thereafter. Through all of this, my team and I have been trying to strike the best balance between user and developer experience. We have built custom solutions and used libraries/tools all in an effort to solve problems with our user experience and increase our own productivity. The struggle is real.

Then Remix came around and reduced that struggle for me a great deal. I rebuilt my website with Remix and was blown away. Honestly, I felt like I could create an amazing user experience and not be ashamed of the code it took to get me there. I love Remix so much that I eventually joined the team (so: disclaimer). In case you haven’t heard of Remix before, it’s a web framework for building stellar user experiences that “remixes” the web as it has worked since the 90s with the awesome technology we have today. Here are a few of the things I love most about it:

  • Seamless client-server code: I mean, there’s definitely a separation between what runs on the client and what runs on the server and it’s clear, but it’s so easy to move between the two within the same file that I feel like I can say “Yes” to more product feature ideas.
  • Progressive enhancement: Remix allows me to #useThePlatform better than anything else I’ve used. Their use of web APIs means that the better I get at Remix, the better I get at the web. And because apps I build with Remix work without JavaScript, I get real progressive enhancement for poor network conditions where the JavaScript takes a long time to load or fails to load entirely.
  • CSS — Bringing the cascade back: Because Remix allows me to easily control which of my CSS files is on the page at any given time, I don’t have all the problems that triggered the JavaScript community to invent workarounds like CSS-in-JS.
  • Nested routing: This allows Remix to optimize the data requests it makes as the user navigates around the page (which means it’s faster and cheaper for users who pay for limited internet). It also allows me to handle errors in the context of the part of the app that fail without taking down the entire page in the process.
  • Simple mutations: Instead of a complicated JavaScript library for managing mutations, Remix just uses the platform <form />. And Remix manages your client-cache so you don’t have to worry about invalidating your cache at all. In fact, with Remix you don’t think about this at all. It’s managed for you and you just get a nice declarative API.
  • Normalized platforms: We have lots of options for where we deploy our apps. Remix normalizes these (kinda like jQuery for platforms). So whether you want to deploy to serverless, cloudflare workers, or a regular node app, it doesn’t matter. Just write the same code and deploy wherever you like.

There’s a lot to love about Remix, but I’ll wrap it up here.

I realize that not everyone can migrate their site over to Remix, and that’s ok. The tagline of Remix is: Build better websites (sometimes with Remix). The one thing I think I want to encourage you to do to make your website better is to learn about and from Remix and apply some of the ideas to your website. And if you can migrate to Remix, all the better. 😆

Remember, we’re all just trying to make the world a little bit better, and my hope in writing this is that I’ve given you ideas of how you can make your own corner of the world better. Good luck!



from CSS-Tricks https://ift.tt/3pFAuSE
via IFTTT

No comments:

Post a Comment

Passkeys: What the Heck and Why?

These things called  passkeys  sure are making the rounds these days. They were a main attraction at  W3C TPAC 2022 , gained support in  Saf...