React Newsletter #158

create-react-app v3.0.0, application state management with React, and how to avoid a common performance pitfall with React Hooks


News

Release v3.0.0 of create-react-app

Create React App v3.0.0 was just released. Here are the highlights.

  • Jest 24 - Updated from Jest 23 to get the latest improvements in Jest 24.
  • Hooks support with enforced Rules of Hooks with eslint-plugin-react-hooks.
  • TypeScript linting.
  • browserslist support in @babel/preset-env.

Articles

Application State Management with React

Historically we've seen that you can get fancy with state management solutions in React. However, the best solutions are often the most simple. In this post, Kent brings us back to the basics and convincingly describes why the solutions to our problems were the fundamentals all along.

Elixir, Phoenix, Absinthe, GraphQL, React, and Apollo: an absurdly deep dive

If you’re anything like Zach, at least 3 or 4 of the keywords in the title of this article fall under the category of “things he's been wanting to play with but haven’t gotten around to it yet.” In this article, he does just that documenting his experience with each.

How to avoid this React Hooks performance pitfall

React Hooks promise to avoid the overhead of class components while delivering all the same benefits. For example, they allow us to write stateful functional components without having to worry about storing state on the class instance. However, writing stateful components with Hooks requires care. There’s a subtle difference between how state is initialized in the constructor of a class component and how it is initialized by the useState hook. This article dives into what that difference is and what you'll need to do to avoid (in certain cases) making your app slower than necessary.

A thread by Dan on Concurrent React

Is Concurrent Mode just a workaround for “virtual DOM diffing” overhead? Some people got that impression. In this Twitter thread Dan clarifies and breaks down what benefits Concurrent React will give to your app.


Sponsor

Spend Less Time Sweating Over the UI in Your React Apps

Get started with KendoReact’s 55+ professionally developed UI and data visualization components and cut down on the development time of your React apps. With its wide range of customizable components, from the essential to the advanced, it can augment any existing development stack. Try now 30 days for free.


Projects

react-jsonschema-form

A React component for building Web forms from JSON Schema.

react-fetching-library

Simple and powerful fetching library for React. Use hooks or FACCs (Function as Child Components) to fetch data in easy way. No dependencies! Just react under the hood.


Videos

The Great Gatsby Bootcamp

If you’re building websites or web applications, you need to check out Gatsby. Gatsby is a framework for creating blazing fast websites and web applications. Powered by React and GraphQL, Gatsby gives you everything you need to build and launch your next project.

In this 5-hour bootcamp, Andrew put together everything you need to build and launch your first site with Gatsby. You’ll build a website from scratch and learn how to get it deployed to production.


made with ❤️ by ui.dev