#161 — October 23, 2019

Read on the Web

React Status
Your weekly React news digest, every Wednesday

Preparing for the Future with React Prereleases — The React project is introducing official pre-release channels as part of a drive to share upcoming changes (mostly aimed at framework, library or developer tool creators) more quickly and definitively. Here’s how it’ll work.

Andrew Clark

React 16.11.0 Released — There’s no official blog post and it’s a relatively minor release to fix a bug and to remove the unstable_createRoot and unstable_createSyncRoot APIs which are now in the experimental channel instead (see top story above).


Advance Your React Skills in Less Than a Week — Our intensive, week-long Full-stack and React bootcamp will give you tools to apply in whatever web ecosystem you’re working in for years to come.

Big Nerd Ranch sponsor

TinaCMS: A Site Editing Toolkit for Modern React-Based Sites — A new site editing toolkit for two popular React-based frameworks: Gatsby and Next.js. It’s not quite a typical CMS in its own right but will help you implement such features. GitHub repo.


▶  The Suspense is Almost Over — A Pre-ReactConf Concurrent React Rundown — React Conf is this week and both Suspense and Concurrent Mode are likely to be hot topics at the event. Here, two developers talk about what they know so far and what they hope to see unveiled at React Conf.

React Podcast podcast

An Experimental React Suspense-Based useGeoPosition Hook“I’ve been playing around with the part of React Suspense that’s worked (undocumented) for a year now … Based on my research … I think this is going to be the officially supported (low-level) API which will (hopefully) be released … at ReactConf.” Twitter thread here.

Kent C Dodds

💻 Jobs

Software Engineer / Founding Teammate — A well funded, fast-moving startup that is changing the way large teams collaborate on documents. Think: GitHub for documentation.


Have You Tried Vettery? — Vettery specializes in tech roles and is completely free for job seekers. Create a profile to get started.


📘 Tutorials and Stories

55 Lessons Learned From 5 Years of React — A quick-fire list of things Cory has picked up from working with React for several years.

Cory House

How to Implement Redux in 24 Lines of JavaScript — Redux itself started as a very small library so it’s reasonable trivial to recreate its basic features quickly as a way to learn more about what’s involved.

Yazeed Bzadough

Persistent Layout Patterns in Next.js — With Next.js, the default experience when changing pages is to re-render the entire UI, but there are some ways you can maintain a persistent layout.

Adam Wathan

Add Live Chat to Your App in Just a Couple Hours with React Native + Ably — Build in-app chat with essentials like online presence, push notifications, 1:1 and group chat. Easily extend with Webhooks.

Ably sponsor

Debouncing with Redux Middleware — When you don’t want to repeat an action too quickly, debouncing is a solution.

Nick Scialli

A First Look at Ionic React — As we featured last week, Ionic (a cross-platform app development platform) now officially supports React as a first-class target and framework. Here’s a first look at how to approach it.

Nader Dabit

🔧 Code and Tools

chart-race-react: A Bar Chart 'Race' Component — Have you seen those bar chart animations where the bars move around based upon changing values over time? This is that.

Brian Chao

Minimal Pie Chart: Versatile, Lightweight SVG Pie Charts for React — Pass in your data and colors via props, and you’re done. Demos here.

Andrea Carraro

React-Typical: An Animated 'Typing' Component in ~400 bytes — A componentized version of Typical, a very simple mechanism for creating a ‘typing’ effect. Here’s a demo.

Catalin Miron

Heroku Buildpack for create-react-app

Heroku sponsor

Resourcerer: Declarative React Data-Fetching for REST APIs — Resourcerer contains a higher-order component that allows you to easily and declaratively manage your components’ data flows, while also handling loading states and app-wide resource caching.

Sift Engineering

Type Route: A Flexible, Type Safe Routing Library — It’s not React specific but is designed to work well with it.

Type Route

A Basic React-Powered Hacker News Client — Uses Hacker News’s API to load in stories.

Abdul Rauf

Reaptcha: A Wrapper for Google reCAPTCHA — Aims to provide a ‘React way’ to deal with CAPTCHAs.

Jacob Sarnowski