React Newsletter #234

Webpack 5 released, new React docs, and why to use React hooks over HOCs


News

Webpack 5 released

Highlights include:

  • Faster builds
  • Smaller builds
  • Federated Modules (faster scaled builds)
  • Better Stats
  • Better Module Types
  • And more!

React Team announced plans for redoing the React Docs

Since Hooks have become increasingly popular in the React community, the React Team have heard from confused learners as well as industry trainers asking why the docs are still so class component-centric. The new docs will take a Hooks-first approach, while focusing on "how to think in React."


Articles

Why React Hooks over HOCs

Robin Wieruch writes about some common problems with higher-order components and how they can be solved by React Hooks.

Microsoft plans to use React to unify Outlook across platforms

This article discusses Microsoft's efforts to move Outlook's Windows, macOS, and mobile clients to a common architecture at the UI layer by using React.

React 17 delegates events to root instead of document

This article explains why React 17 no longer attaches event handlers at the document level and how it instead attaches them to the root DOM container into which React tree is rendered.


Tutorials

Building an attractive, mobile-ready navbar in any web framework

In this tutorial, Ben Holmes identifies a few key traits that all attractive static sites share and then walks through how to build each of those in React, Svelte, and vanilla JavaScript.

Getting Started with Gatsby: Build Your First Static Site

This beginner-friendly tutorial gives you a helpful first look at using Gatsby to build a static site if you haven't used it before.


Projects

react-avatar

A React component that you can use to allow your users to load, crop, and preview an avatar image.

react-force-graph

A React component for 2D, 3D, VR and AR force directed graphs.

Astrofox

Astrofox is an open-source motion graphics program that lets you easily create music visualizations and turn them into videos.


Videos

Build an Income Tracker in React

This 30-minute video from Tyler Potts walks you through building an income tracker using the useState, useEffect, and useRef hooks.

made with ❤️ by ui.dev