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' />
.
I have been a long time fan of Standard ā the JavaScript Style Guide. It removed a lot of decisions and discussions from the teams Iāve worked with. And it became an essential tool for every single JavaScript project Iāve worked on for the last several years. One dependency and you get consistent code style and catch a lot bugs right in your editor.
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.
PolyChrome is an extension for Firefox that can run Standard ML programs embedded in HTML documents. The extension provides a foreign function interface to JavaScript. As a result, JavaScript libraries and interfaces provided by the browser, such as DOM and Canvas, can be used from Standard ML.
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.
And now, years later, we have Reason (ML family) using React (a functional approach to UI) and even React Native (a message bridge between JavaScript and a native host).