May 2022 Newsletter

[TODO Add a description of the newsletter]

Joke of the month

Two fish are in a tank. One turns to the other and says, “okay, you man the guns. I’ll drive.” 🥁

Not a good fit!.

Contents 📋


News & Explore

Goodbye Lerna…

At the end of April, the Lerna team announced that they would not maintain the project actively, but quickly, the project was picked up by Nrwl (opens in a new tab).

Announcement: Passing the torch (opens in a new tab)

UI components powered by State Machines?

Yes, you read it correctly. UI components that are framework-agnostic developed like state machines.

Zag (opens in a new tab)

Feature flagging a Next.js Application

When the applications are sometimes growing, they need features to be flagged so they can be turned on/off depending on user/location or even randomness to see how users will react. Here’s how.

Feature Flags in Next.js (opens in a new tab)

Same functionalities and different styles

When there’s a new library, especially front-end libraries, they do the same thing differently. It would be better to see how it translates to another library. So here’s a website for that.

Component Party (opens in a new tab)

No more confusion between …rest and …spread

When it comes to an understanding between rest and spread operators, JavaScript functionality is nearly similar, but naming might be confusing. Here’s a quick guide.

Rest or Spread (opens in a new tab)

Concurrent React and its history

Everybody is talking about it working with the Concurrent features of React. Here’s a quick explanation.

The Story of Concurrent React (opens in a new tab)

In defense of the SPA

William Kennedy has written an article that backs up the SPA. It’s a bit wordy but worth the read.

William Kennedy Blog (opens in a new tab)

Common React errors

It does not matter how long you are developing with React; you came across these errors, and here’s the solution for those.

8 common React error messages and how to address them (opens in a new tab)

Finding components in code

It has never been easier to find the components in your source code…

GitHub Repo (opens in a new tab)

Text Clamping at its finest

When you have to show multiple lines it’s always a burden to make the functionality for show and hide. No more…

GitHub Repo (opens in a new tab)

Human readable errors from TS…

Well, it happened finally we can understand the Typescript and its errors.

Human Readable TS Extension (opens in a new tab)

What is “useEvent”

A new version of RFC on React, “useEvent” has popped up, and let’s see what is it.

What the useEvent React hook is (and isn't) (opens in a new tab)

Zaplib and Rust(post-mortem)

While Zaplib was focused on bringing Rust to web applications there are some takeaways and sunsetting project :disappointed_relieved:

Zaplib Docs (opens in a new tab)

Page Transitions on Chrome

While mobile apps have default transitions on page changes what about the web?

Bringing page transitions to the web (opens in a new tab)


Challenge

When it comes to challenges on JS there are plenty. This one is particularly interesting. Let’s see if you can spot the bug and fix it 🤔

class User {
  async constructor(userId) {
    const user = await getUser(userId)
    this.id = user.id;
    this.name = user.name;
    this.email = user.email;
  }
}
Explanation

Unfortunately, JavaScript class constructors do not allow you to run “async” functions. So you need another method to do this.

class User {`
  static async init(userId) {
    const user = await getUser(userId);
    return new User(user);
  }
  constructor(user) {
    this.id = user.id;
    this.name = user.name;
    this.email = user.email;
  }
}