Copy
Stay up to date with the latest news on React.
View this email in your browser

The React Newsletter

Hi <<First Name>>,
 
Deep dive: How do React hooks really work?

Hooks are a fundamentally simpler way to encapsulate stateful behavior and side effects in user interfaces. They were first introduced in React and have been broadly embraced by other frameworks like VueSvelte, and even adapted for general functional JS. However, their functional design requires a good understanding of closures in JavaScript.

In this article, we reintroduce closures by building a tiny clone of React Hooks. This will serve two purposes – to demonstrate the effective use of closures, and to show how you can build a Hooks clone in just 29 lines of readable JS. Finally, we arrive at how Custom Hooks naturally arise.


Read more
 
How React Context can come to the rescue if you don’t know Redux
React has become a fuzzword in front end development over the past few years. React is getting stronger and stronger with the new updates rolling out. This article will help you learn about React Context, which is a pure blessing for developers struggling with Data management between multiple components.

Read more
 
setState Machine - Michele Bertoli
What if your components' state was deterministic? Learn about implementation of State Machines to manage React Components' state - from the basics of the Automata theory to autogenerated tests.

Watch video
 
Let’s build a search bar in React!

I know, I know…another task app…

Hear me out though! We are going to build a task app that also filters the list based on a search query in real time. Sound complicated? It’s not as complicated as you may think, so let’s dig in!


Read more
 
Accurately measuring layout on the web

We all want to make faster websites. The question is just what to measure, and how to use that information to determine what’s “slow” and what could be made faster.

The browser rendering pipeline is complicated. For that reason, it’s tricky to measure the performance of a webpage, especially when components are rendered client-side and everything becomes an intricate ballet between JavaScript, the DOM, styling, layout, and rendering. Many folks stick to what they understand, and so they may under-measure or completely mis-measure their website’s frontend performance.

So in this post, I want to demystify some of these concepts, and offer techniques for accurately measuring what’s going on when we render things on the web.


Read more
 
The Love-Hate Relationship between React Router and React Components

As React developers, a majority of us enjoy working with React Router and how well it fits our React application.

Why we ❤️ React Router:

However, you will face some roadblocks while using React Router if your application-specific needs become a little more complicated than the regular usage you see on every tutorial on the web.

The good news is that even in those scenarios, React Router still allows us to solve problems in a clean way; but the solution might not be as obvious in the first glance. That was the case for us at Fjong dev team👗 when we were changing the query params in the route path and expected a Component re-render, but that was not the case.

Before we dive into this specific issue and how we solved it, Lets us talk about few aspects of the great relationship between React Router and React Components.


Read more
 
React video courses
Because I need to pay my bills 😉
 
Copyright © 2019 ABL - The Problem Solver, All rights reserved.


unsubscribe from this list    update subscription preferences 

Email Marketing Powered by Mailchimp