#217 — December 2, 2020

Read on the Web

React Status
Your weekly React news digest, every Wednesday

The React Hooks Announcement In Retrospect: 2 Years Later — We introduced hooks in issue 112 in late 2018 and barely an issue has gone by without mentioning them since! This post reflects on their pros, cons, and influence both on React and other frameworks (Vue 3 and Svelte in particular).

Ryan Carniato

How the BBC Migrated 31 Million Readers to an Isomorphic React App and Improved Page Performance — Back in issue 213 we presented Simorgh: The BBC Does React, Too? While not a direct follow-on, this is another deep dive into the broadcaster’s development landscape and their efficiency gains with React.

Chris Hinds (BBC)

Hit the Ground Running with the New KendoReact Resources Hub — Blogs, tutorials, videos and more - the new React resources hub created by the KendoReact team puts together all the materials you need to master the art of React UI. What do you want to learn today?

Progress KendoReact sponsor

useEffect vs useLayoutEffect — According to Kent, 99% of the time you will want to use useEffect. But every once in a while useLayoutEffect is a better choice, such as to avoid that distracting flicker when DOM mutations take effect.

Kent C. Dodds

React Aria: React Hooks for Accessible UI Primitives — Adobe steps up with a WAI-ARIA-compliant library to ensure the best UI experience for all users.

Adobe

💻 Jobs

React Developer at X-Team (Remote) — Join the most energizing community for developers and work on projects for Riot Games, FOX, Sony, Coinbase, and more.

X-Team

Find a Job Through Vettery — Create a profile on Vettery to connect with hiring managers at startups and Fortune 500 companies. It's free for job-seekers.

Vettery

📘 Tutorials and Stories

▶  Building React Applications in F# with Zaid Ajaj — Broaden your development horizons with the F# functional language and the Fable JavaScript compiler, as presented at the recent .NET Conf 2020 with host Layla Porter.

dotNET

The Perfect Dark Mode for Next.js — Further to the dark mode theme we kicked off last week (but for Gatsby users), ‘perfect’ in this context means without the dreaded flicker of light mode thrown into the mix to spoil the whole thing.

Sreetam Das

Common React Interview Questions and Vetted, Eloquent Answers to Rehearse — If you’re looking to finally nail that interview, this could be worth revising. Though, of course, gaining insight rather than parroting learned answers is the real goal.

Alex Booker

Stream Announced the Public v2.0 Availability of Their React Native SDK

Stream sponsor

Decouple Data From UI With React Hooks — Learn how to write a functional component leveraging the Fetch API to address both the data retrieval latency and the subsequent re-rendering of the component with the returned data.

Suhan Wijaya

Comparing Styling Methods In Next.js — Next.js offers a variety of options for styling on both the global and component level and this article looks at seven options and how to implement each of them.

Adebiyi Adedotun Lukman

Animated Transitions with React Router v5
Tyler McGinnis

🛠 Code and Tools

supported by Okta

Reapop 3.0: Simple and Customizable Notifications — Everything you’re likely to need for notifications, as illustrated by one of the better interactive demos we have seen in some time.

Louis Barranqueiro

React Awesome Reveal: Reveal Animations Using the Intersection Observer API — This is one of those libraries which can either be used as-is in your next project, or as a learning tool for better understanding the Intersection Observer API. Check out the demo.

Dennis Morello

Wallaby.js: The Fastest JavaScript and TypeScript Test Runner (20% Discount) — For a limited time, Wallaby.js is discounted by 20%. Don’t miss out on this opportunity to super-charge your react testing.

Wallaby.js sponsor

React-Tensorflow: React Hooks for Google's Machine Learning Platform — If you’ve ever wanted to integrate the Google-developed Tensorflow machine learning platform into your React app, now you can.

Josh Ellis

Several React Native Libraries for “Native Features” — Take full advantage of the hardware’s capabilities while seemlessly integrating with the UI using these eight libraries, each of which is described in just the right amount of detail to get you started.

Shanika Wickramasinghe

Twin: Tailwind Combined With CSS-in-JS — Good news: you no longer have to choose between the Tailwind framework and CSS-in-JS.

Ben Rogerson

A Next.js API Middleware Approach — Rather than write functions inside your API route handler, how about the middleware approach?

Hunter Tunnicliff