#113 — November 7, 2018

Read on the Web

react status

Building a Family Tree Maker using Hooks and Microstates — If you missed all of the excitement around the proposed new ‘hooks’ feature in React, you might want to skip back to last week, but this is a great, practical example of using them to create a dynamic, family tree creation component.

Taras Mankovski

A Different, Experimental Way to Manage State in React?“What if some central entity had a view of your entire application and knew the relationships between every property in your store and every component on your page?” Enter recollect. There’s a lot to chew on here.

David Gilbertson

The Complete ⚛️ React Learning Path — Take your React to the next level to find out what it is fully capable of with this comprehensive learning path.

Frontend Masters sponsor

5 Things I Didn't Know About Create React App — Looking for tips for using Create React App? Here are five features you may not know about.

Blanca Mendizábal Perelló

D3blackbox and useD3: Wrap Any D3 Code into a React ComponentD3 is a powerful tool for creating data visualizations and D3blackbox makes it easy to turn D3 examples into React components. useD3 is a hook-based variant.

Swizec Teller

A Netflix Web Performance Case Study — Interesting in a React context because Netflix boosted performance by switching from React and other client-side libraries to vanilla JavaScript while retaining React on the server-side.

Addy Osmani

React Native's Open Source Roadmap — The React Native core team explain what they’ve been doing to better support the thriving community of React Native users and developers outside of Facebook.

Héctor Ramos (Facebook)

💻 React Jobs

Sr. Fullstack Engineer (Remote) — Sticker Mule is looking for passionate developers to join our remote team. Come help us become the Internet’s best place to shop and work.

Sticker Mule

Join Our Career Marketplace & Get Matched With A Job You Love — Through Hired, software engineers have transparency into salary offers, competing opportunities, and job details.


📘 Tutorials

How to Use Storybook in a React Project — Storybook is a tool for building and visualizing components in an isolated environment.

Laure Retru-Chavastel

Lazy-Loading Components in React 16.6 — Code-splitting and lazy-loading React components with Suspense and React.lazy()

Glad Chinda

Techniques for Animating on the (HTML5) Canvas in React

Phil Nash

How Do Top Developers Deliver Video? - Download the 2018 Video Report — Hundreds of developers around the world reveal their preferred video streaming solutions.

Bitmovin sponsor

How to Improve React Native List Performance — How to prevent the list from rerendering all items instead of just the changed elements.

Oleg Kalyta

▶  A React Point of Vue — If you’re a React developer learning Vue or who has to work on Vue code from time to time, this talk covering the nuances and differences between React and Vue should be helpful.

Divya Sasidharan

'Make Brilliant Messes' with Diana Mounter and Emily Plummer — Michael Chan talks to Diana and Emily (who create design systems at GitHub) asking them about the story of design at GitHub, what role React will play in future systems, and what tools make their jobs easier.

React Podcast

🔧 Code and Tools

React A11y: Identifies Accessibility Issues in Your React Elements

React Community

Track Data Once with Segment and Send It to 200+ Tools. Get Started for Free

Segment sponsor

Use Hooks in Classes in React 16.5+

Tanner Linsley

React Simple Img: Lazy Load Images using the IntersectionObserver API

Bill Luo

react-hanger: A Small Collection of Useful Hooks for React 16.7


Catalog: Create Interactive Style Guides using Markdown and React — The docs are themselves an example of the output.

Interactive Things

react-for-electron-only: React Component for Rendering on Electron-Based Clients Only — If you’re serving up the same code to a Web client and an Electron-based desktop client, this could help you split them apart where necessary.

Anubhav Srivastava