I recently migrated my personal website from Next.js to 11ty, it was a great experience, which I will write more about in a later blog post. There was just one issue. The PageSpeed performance score actually went down. đ¨ Link to PageSpeed.web.dev Mobile performance was looking great, a 4 x…
Now and then I stumble upon some new CSS magic that I didn't know existed. Here are some of the new things I've found in 2024. align-content: center This is a really old one that I completely missed as I've gotten so used to using flexbox to align elements. I…
At work I inherited a really old website running on React. The code was good but by old I mean really old; last commit was 3 years ago and most of the code was 5-6 years old⌠So I converted it to TypeScript and ripped out the old babel/webpack build…
Using environment variables is a great way to store environment-specific values and secrets that should not be in the git repo. Let's say you have an API which runs on localhost locally but a different host in production. On the server Locally you need to add an .env.local-file in your…
Since front end development nowadays is so focused on JavaScript itâs easy to forget that new features are added to HTML as well. HTML 5.1 is already 5 years old (1 November 2016) and I am embarrassed to say that there are some new tags that have passed me by.…
On my previous iteration of bergqvist.it, I used styled jsx for styling my components. I preferred that to other css-in-js frameworks (like JSS) because of it actually using CSS syntax instead of JavaScript objects. // styled jsx example with good old CSS <style jsx>{` .label { color: red; font-style: italic;…
Writing tests can be daunting when starting out, itâs hard to know exactly what to test and then learning the API for your test tool. I wanted to share some small tips that can be useful when starting out. expect.objectContaining() In some cases, you are only interested in the value…
When we started using Material UI (version 3), the support for extending the built-in theme was pretty lacking. The theme interface did not handle any additional color settings such as âsuccessâ or âwarnâ and trying to extend the theme did not work since parts of interfaces canât be overwritten. So…
There is an official way of using RTL with redux as some people pointed out, but for small quick tests mocking useSelector may still be of use. đ Recently I finally made the switch from Enzyme to React testing library (RTL) which also means that instead of rendering components using…
I love RSS-feeds (and still curse Google for cancelling Google Reader) and use them as my main news source for things I find interesting, so with this article I would like to help people to add RSS-feeds to their blogs. If you read my article about how to add a…
While building my blog with Next.js, I naturally wanted to support sitemaps because it can supposedly help out the search engines. For my small blog it will not make any difference, but for larger sites itâs more important. Google has this to say. Using a sitemap doesnât guarantee that all…
A few weeks ago I had the privilege of attending SmashingConf in New York, traveling from a chilly Swedish autumn to a quite pleasant New York end of summer. I spent the weekend fighting jet lag by taking long walks and touristing, so I could be fit for the first…
TypeScript has really taken off lately in the React world, and rightly so, itâs a great way to keep your code documented and help you keep some errors at bay. I have worked with TypeScript in a few projects the last few years, all involving Angular in some form but…