26
Frontend Developer Resources 2022
I don't know if I'll keep doing this every year, but I did one of these in 2020, and that post got some good signal, so I renamed it to Frontend Developer Resources 2020, which brings us to Frontend Developer Resources 2022. Oops, I missed 2021. Technically we're still in 2021, but humour me. I also added sprinkles of shameless plugs. π
This post is not a complete list, more a list of stuff I found compelling in 2021 that will keep you set in 2022 and build off of my previous list. You may see some repeats from my 2020 post here, but they're still super relevant.
Most resources are free, but some resources you need to pay. I also highly recommend an egghead.io subscription. I've been a happy subscriber for quite a while now.
If you have an educational stipend at work, use it. Also, many public libraries give you access for free to paid resources like LinkedIn Learning. Check out your local library before purchasing certain content. Also, just a massive shoutout to public libraries. π
I work with Preact daily, and I also work with React. There are other libraries and frameworks out there, but I will veer away from all that in this post. The browser extensions section is the only place where I'll mention frameworks and libraries.
This post is a work in progress, so expect this list to update throughout 2022.
Regardless of whether or not you start with a library or framework, at some point, as a frontend developer, you will need to understand JavaScript in more depth. Here are some excellent resources to get you there.

Introducing "Learning Patterns": patterns.dev - a free 435+ page book on JavaScript + React design & performance patterns from @lydiahallie and I. On the web, ePub & PDF.
07:36 AM - 20 Dec 2021
Tasks, microtasks, queues and schedules β A great post from Jake Archibald on some more advanced stuff
Lydia Hallie's JavaScript Visualized series on DEV β Lydia is great at explaining concepts through visualizations.
Just JavaScript β From Dan Abramaov and Maggie Appleton. Like the site says:
Discover and rebuild your JavaScript mental models.
TypeScript is getting more and more popular every year. Even if you're not a fan of it, it's good to be at least aware of it.
Let's skip the centring jokes in CSS. We're in the 2020s now, and this is something relatively easy to do nowadays. Dig in and level up on your CSS.
If you're doing web development long-term, you must become familiar with semantic markup. Pass on the order for
<div />
soup.Accessibility is super important and honestly, if you want to stand out as a frontend developer, levelling up here is a good move.
Animations are a great way of enhancing a user experience, but remember, don't add animations to your site for the sake of adding animations. Here's some great people's work to check out in this space.
Testing is a big topic, and I'll scratch the surface here, but knowing what to test is super important. At the end of the day, when you ship something, ask yourself, "Do I feel confident with shipping this?".
A lot of cool stuff is happening on The Edge. I haven't done much here, but looking to level up in 2022.
We all love tools. There's plenty to go around, but I'll touch on a few.
npx gitgnore node
(It works for other languages as well, or if you omit the language, it will give you a list of all the supported gitignores)These are some great reads.
I'm a big fan of Twitch. I stream on my own at livecoding.ca as well as on the DEV Twitch stream. Here are some great folks you should be watching for all things frontend.
I'm sure I've missed some stuff, but this is the initial brain dump. As mentioned initially, I will update this over the coming year.
If you liked this, consider subscribing to my newsletter!
26