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

The React Newsletter

Hi <<First Name>>,
Introducing Hooks
Hooks are a new feature proposal that lets you use state and other React features without writing a class. They’re currently in React v16.7.0-alpha and being discussed in an open RFC.

This new function useState is the first “Hook” we’ll learn about, but this example is just a teaser. Don’t worry if it doesn’t make sense yet!

Read more
React Suspense with Netlify Functions

React’s upcoming Suspense feature is the most exciting thing to happen in React since… well, since React. However, it is tricky for frontend devs to try it out. Netlify Functions could help.

What’s React Suspense?

React Suspense is a generic way for components to suspend rendering while they load data from a cache. It is a fundamentally new capability that:

  • lets you render a component tree “in background”
  • while components are fetching data, and
  • display them only after the whole tree is ready.

For slow connections, it gives you full control over where and when to show a placeholder. It doesn’t destroy the previous view while this is happening. Watch the JSConf Iceland demo if you haven’t already.

Read more
Unit testing side effects with Jest and Introscope
Testing ES6 modules can be tough, esp. if the module has a small public API with rich internals. We developed a babel plugin (called Introscope) helping to look inside any module turning it into a factory function. This helps us develop some cool techniques for more or less robust side effects based testing with mocks, spies, and Jest snapshots.

Watch video
Introduction to Yup Object Validation In React

In this article we will visit why you should be using Yup in your React projects, what it does exactly, and how to make the most out of the package to simplify your code, with examples.

Yup is designed for front-end browser based use. If you are interested in server-side object schema validation with NodeJS, take a look at my article on Joi.

Read more
How to prevent a rerender in React
In this React performance optimization tutorial, you will learn about React’s shouldComponentUpdate lifecycle method and React’s PureComponent API to a prevent rerender for React components. Usually React components and their child components rerender if state or props change. However, by using React’s API, you can step in and make the decision when to rerender a component. You can find the finished application in this GitHub repository.

Read more
Use the New Profiler in React Developer Tools to Generate Flame Charts and Interactions
React version 16.5.0 has been released and one of the features that it supports is the new Profiler in the React Developer Tools. In the above video and following blog post, we will update an existing app to ⚛ React 16.5.0 and show off various features of the new Profiler. The tool can record a lot of information from your React App, but you can also add interaction tracking to help track user generated events.

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

unsubscribe from this list    update subscription preferences 

Email Marketing Powered by Mailchimp