By default, Next.js or Webpack doesn’t help you with optimizing images. This means custom configuration or scripting, processing images by hand, using an image CDN or not optimising images at all. next-img provides and alternative streamlined approach for adding images to your Next.js projects. It combines a Next.js plugin, a custom webpack loader and a React component to make serving images in an optimal fashion in a way that is almost as easy as typing
<img src='foo.png' />.
Prettier, another tool that was created to boost productivity, came out in 2017 and I’ve had a serious look at it more recently. And it is amazing. Not only it takes away having to make decisions about your code style, but it also formats code for you and does that really well. This really speeds up development.
The issue with Standard is that it’s just a linter, it can’t format your code nearly as well as Prettier can. The issue with Prettier is that it’s only a formatter and it doesn’t tell you about potential bugs in your code. And the issue with trying to use them both is that their incompatible, Prettier formats the code in a way that doesn’t match Standard’s Style Guide.
This is where Healthier comes in. It’s just like Standard in pretty much every aspect, but with all of the style linting rules removed. This way you can format your code with Pretter and lint it with Healthier.
Tiny Atom is a React state management library. Actually, it’s framework agnostic, but there you go. Yes, yes, it’s a little bit like Redux. Yes, I’m one of those people. To be honest, it is a little frustrating, this whole topic.
I long believed that Redux had and still has a good idea behind it. It’s a very powerful idea of modeling your application’s state and transitions. But I’ve also long believed that Redux API is less than optimal. The issue I think is that it was simply created, worked well enough, and then too quickly got too popular, essentially freezing the API. Why is it so popular then if it’s not that good? I don’t know, maybe because of the docs? Tutorials? Momentum? Ecosystem? Cargo cult? Dan?
Tiny Atom is not perfect. I am always thinking about how to develop the next version, it hasn’t clicked 100%. But for now, it’s a library I choose commonly for the task and it hasn’t disappointed.
Spaceboard is a free to post and free to read job board for techies. It takes inspiration from the timeless utility and familiarity of sites such as Hacker News. It tries to remove all the noise and leave you with a focused stream of job posts. It’s a little experiment we launched out of Zero. It hasn’t gained much traction yet – distribution of products is much more challenging than building them. But it was a good practise round and we have a lot more to give.
Jetpack is one of these projects that aims to help developer productivity. Over the years I’ve seen the same pattern being used over and over for bootstrapping Single Page Apps. Here’s what you do with jetpack.
Install it into a fresh repo. Create
index.js with some code. For example,
React.render(...). And now run
jetpack. And that’s it, you have a working and ready to ship to production application setup. You can add a Node.js based API into this same repo. And once you’re ready – jetpack can build the app’s assets for you to deploy to your favorite hosting provider or your internal company infra. Touching webpack config wasn’t necessary.
This project is a fun memory, especially since the compile to JS use cases have gained huge popularity in recent years. Back in 2011 it wasn’t clear if compiling ML to JS was the most performant approach or whether it was better to utilise FFI. The mechanic of how the language got executed in the browser was less interesting, the focus and the fun part was exploring how UIs would get built using a pure functional language.