React Newsletter #172

React v16.9.0, Apollo Client with React hooks, and investigating Discord's React memory leak


News

React v16.9.0 and the Roadmap Update

"Today we are releasing React 16.9. It contains several new features, bugfixes, and new deprecation warnings to help prepare for a future major release."

Apollo Client, now with React Hooks

Introduced in React 16.8, Hooks are a new way to write stateful components while avoiding the pitfalls of classes. Apollo Client now includes three hooks that you can drop into your app, anywhere you currently use a corresponding higher-order component or render prop component: useQuery, useMutation, and useSubscription.


Articles

Investigating Discord’s React Memory Leak

In November of 2018, Discord tried to upgrade React from 16.5 to 16.7. After they shipped the upgrade, they started getting reports of users experiencing Discord using a lot of memory — something somewhere was leaking. This is that story and how they fixed it.

The React Hooks Guide - Tutorials and Examples

A thorough step-by-step guide for learning the basic and advanced Hooks (state, effects, context, and reducers) included in ReactJS. Eric provides take-home code demos and GitHub projects you can fork as well as resources and links for more learning on the subject of React Hooks.


Tutorials

How Redux Connect compares to the new Redux Hooks

This article walks through the differences between using the traditional connect HOC from Redux compared to the new useSelector, useDispatch, and useStore Hooks.

How to fix the ugly focus ring and not break accessibility in React

Creating beautiful interfaces while maintaining accessibility has always been a challenge in the frontend. One barrier is the ugly “:focus” ring outline. Read on to learn how to figure out whether a focus outline should be shown using a React component. This helps you in making your sites more accessible without compromising on design.


Sponsor

React developers are in demand on Vettery

Vettery is an online hiring marketplace that's changing the way people hire and get hired. Ready for a bold career move? Make a free profile, name your salary, and connect with hiring managers from top employers today.


Videos

Next.js: The React Framework

63% of npm users are using React. Making it the most popular JavaScript framework ever. React is being used everywhere from your favorite websites and web applications to maybe your personal website. However building fast and scaleable React applications is complex. There are many pieces that have to come together, from compilation to optimization to developer experience. Furthermore there are many strategies in which websites and applications are being built today, for example statically prerendering, server-rendering and client-side only rendering. In this talk, you'll explore how Next.js solves all of these problems for you.

Build a YouTube Clone Application Using React

In this video, you'll learn how to build a YouTube clone application from Scratch using React. This project covers lifecycle methods, project structure, destructuring, state management, passing props from parent to child components, API calls, and more.


made with ❤️ by ui.dev