Web Developer Monthly Newsletter 💻🚀

46th issue! If you missed them, you can read the previous issues of our Web Developer Monthly newsletter here.

If it’s your first time here… (otherwise, skip this part)

Being a web developer is a fantastic career option. You have many job opportunities, you can work around the world, and you get to solve hard problems.

One hard thing, however, is staying up-to-date with the constantly evolving ecosystem. You want to be a top-performing web developer, coder, programmer, software developer, but you don’t have time to select from hundreds of articles, videos and podcasts each day.

This monthly web development newsletter is focused on keeping you up-to-date with the industry, without wasting your valuable time. I curate and share the most important articles, news, resources, podcasts and videos of the month.

Think Tim Ferriss and the Pareto Principle (80/20 rule) meeting the Software Development world. What’s the 20% that will get you 80% of the results?

Let's dive in. Here's what you missed in April 2022 as a Web Developer…

Art With CSS 🎨

So you're spending 1 hour trying to center an element on your website... #hacker. You are about to get a real dose of reality and a big jug of inferiority complex with this article. How to create realistic art using CSS. The article gives you come cool code pens to play with.

One day maybe you can build a website like this (this may be the most beautiful website/online creation I have seen).

Free Tools for Web Developers ✂️

For those of you who don't know, the ZTM team and I list our all-time best free resources here for you.

• How to get paid while learning to code

Or... you can go back and read all of the previous issues of this newsletter. That's a joke. Don't do that!

React News 💎

Mostly everyone's favourite frontend library. What crazy things have they been up to?

• The following article will give you guidance on how to choose libraries for building a React application in 2022. A nice list of must-have/popular libraries in the ecosystem.

• React 18.1 is here with mainly bug fixes.

• A guide on how to create custom hooks.

• Our Complete React Developer Bootcamp was totally re-recorded and fully updated. If you want to learn React by building complex real-world projects... there's no better place!

<img> Guru 🌁

Images are one of the most pervasive parts of the web. This isn’t a huge surprise as we humans are quite visual and the <img> tag has been around for almost 30 years. The humble <img> element has gained some superpowers since it was created.

This article will show you how to use the image tag and optimize these images to improve user-experience and the Core Web Vitals.

JavaScript Function Composition 🦚

Using those three words together in front of your friends will automatically confuse them and make you sound smart. But what does it all mean?

Function composition is where we take two functions, and combine them into one. That is, our new function calls one function, takes the result, and passes it into another function. The interesting part is in the details though. Have a read here.

Change Arrays By Copy 🐾

An interesting JavaScript proposal: “Change Array by copy”. It proposes four new methods for Arrays and Typed Arrays in JavaScript:

.toReversed() .toSorted() .toSpliced() .with()

Read how they would work here.

Security Announcement 💣

On April 12, GitHub Security began an investigation that uncovered evidence that an attacker abused stolen OAuth user tokens issued to two third-party OAuth integrators, Heroku and Travis-CI, to download data from dozens of organizations, including npm. Read about it here especially if you use Heroku or Travis-CI.

How To Lose Your Stars ✨

Github stars are the developer version of Pokémon cards in the school yard. The more you have, the cooler you are to your peers. Well, this is how you lose 54,000 stars on Github overnight (Tip: Don't make your repo private).

Deno On Edge 🦕

Here at ZTM, we love Deno. However, we aren't the only ones. Netlify just announced Netlify Edge Functions: A new serverless runtime powered by Deno. Deno is picking up steam... watch out NodeJS.

How TS Compiler Compiles ✍️

Most of you have used TypeScript...but do you know how it works? At a high level, the TypeScript compiler is a tool to help us analyze and compile the TypeScript code into JavaScript (.js), as well as some type definition files (.d.ts) or source maps (.js.map). Learn how it all works here.

Weekend Project Idea 🧰

Bored on the weekend? Then this is a fun little project for you to do this weekend: Building a Terminal Wordle Game with React

Ps, Wordle is interesting because it is bringing a Web Renaissance.

Hydration is Pure Overhead 💦

In web development, hydration or rehydration is a technique in which client-side JavaScript converts a static HTML web page, delivered either through static hosting or server-side rendering, into a dynamic web page by attaching event handlers to the HTML elements. But it's actually pretty bad. Really enjoyed this article and I agree with the sentiment.

De-AMP 🙅‍♂️

Brave browser is rolling out a new feature called De-AMP, which allows Brave users to bypass Google-hosted AMP pages (which everyone hates), and instead visit the content’s publisher directly. AMP harms users' privacy, security and internet experience, and just as bad, AMP helps Google further monopolize and control the direction of the Web. I'm a big fan of Brave.

Do We Care About Web3? 👽

Are blockchain and Web3 the future or are they just a fad? Stack Overflow asked the developer community about Web3, blockchain, crypto, and whether they are all hype or truly the future of the internet. Here is what developers said.

The Best API Ever 🧘

Title speaks for itself... so I am just going to leave this here. Owen Wilson Wow API

Shy HTML Attributes 😳

Here is a fun read going over some of the often forgotten HTML attributes. It's always important to remember that before you jump and try to implement something using JavaScript, or even worse, downloading a 3rd party library, you should check what good ol' HTML can do.

New Libraries and Tools 🗿

Just because we had a ton of these this month, I've added them into this section. Check out these shiny new/interesting things:

• React Native 0.68 is here! Interesting of note is that this release includes the opt in for the new React Native Architecture we mentioned in the last few months of this newsletter.

• Rome Formatter, a new formatter for JavaScript and TypeScript has just come out. Think of it as a little competitor to Prettier that has become an industry standard. Rome was definitley not built in a day... this release was a long time coming.

• RedwoodJS v1.0 was announced with a weird 1 million dollars of funding announcement.

• Bun is a new early access tool that tries to leave an impression on you by burning your eyes with their landing page :).

• React-Redux v8 is here to sync up with React 18.

• WebAssembly 2.0 is coming out one day. Here is the first draft of the new and improved spec.

• Node 18 is here with experimental native fetch()!

• Everyone's favourite testing library, Jest, got a new upgrade to v28.

News Around the World 🗺

• The tech world (including our very own Daniel Bourke) was all talking about Dall-E 2 this month. A new AI system that can create realistic images and art from a description in natural language. You can see some of the amazing examples here.

• A reminder that web scraping is legal in the U.S.A.

Big Tech News 🏢

• Inside the Longest Atlassian Outage of All Time. Hundreds of companies lost access to JIRA, Confluence and OpsGenie. What can engineering teams learn from the poor handling of this outage?

• Shopify better watch out. Amazon just announced Buy With Prime which is essentially a direct competitor to Shopify.

• Everyone can't stop talking about this one: Elon Musk buys Twitter for $44 Billion.

Completely useless to your career but still great 🙃

• How much time do you have left today?

• Is this the best Drone flight ever taken?

Best Resource of the Month ✅

I loved this. For those that are new to the web development world, you will gain experience as if you started working on the web in the early 2000s. For those that have been around for a while now, this will give you some memories and put things into perspective of where we came from and why we are in the current state of our industry. If you read one thing this month, read this.

Four Eras of JavaScript Frameworks

Trick of the Month 🌗

• This is super cool. Watch out iTerm2... WARP a blazingly fast, Rust-based terminal built for the 21st century.

• How to enable DNS over HTTPS. A way to make sure others don't know the websites that you visit.

• A cool new feature is coming out for Chrome Developer Tools: Performance Insights.

Thanks for reading! Don't be shy now.... Share this newsletter with your friends. See you next month! ❤️

By the way, I teach people how to code and get hired in the most efficient way possible as the Lead Instructor of Zero To Mastery Academy. You can see a few of my courses below or see all ZTM courses here.