#202 — August 19, 2020

Read on the Web

React Status
Your weekly React news digest, every Wednesday

The Six Main Changes in React 17Last week, we covered the late breaking news of React v17.0's first release candidate. Since then, folks have had a chance to go through the details and distill them into succinct talking points. It might be a 'no new features' release, but there are subtle changes.

Mr. Herath

Storybook 6.0: Production-Grade Component DevelopmentStorybook is a widely-adopted and well-regarded open source library for UI compenent development. This major new release is aimed squarely at the requirements of the professional frontend developer community.

Michael Shilman

▶  Let’s Build a React Data Grid with KendoReact — The data grid is a key UI component used in most business apps. In this video, TJ demos how to implement the KendoReact Data Grid and how to work with some of its most used features, such as paging, filtering and theming. Watch it now.

Progress KendoReact sponsor

An Open Letter to the Gatsby Open Source Community — One of the founders of GatsbyJS offers a suprisingly candid response to community concerns about how Gatsby contractors (and employees) have been treated in the past, as well as the natural friction between an open source project and its associated company. Kyle Matthews also offers some thoughts regarding the future of their open source efforts.

Kyle Mathews

Dash: Dropdowns, Sliders, and Graphs for Your Analytics Code — Built in conjunction with React, this popular library will supercharge your data analysis and presentation. The samples are quite impressive.

Plotly

Build a React Application with Amazon Web Services — For nearly two decades AWS has offered cloud services which power countless numbers of web apps/services. Entry level pricing is very affordable (it might even be free) so why not consider making your next React app powered by AWS? Here’s how.

Amazon Web Services

💻 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

Get Tech Interviews This Week — Create a profile on Vettery to connect with hiring managers at startups and Fortune 500 companies. It's free for job-seekers.

Vettery

ℹ️ Interested in running a job listing in React Status? There's more info here.

📘 Tutorials and Stories

Animating List Reordering with React Hooks — There seems to be no end to the uses for React Hooks. Starting with an Instagram Story-inspired bubble component, this article describes how Hooks are used to smoothly swap the bubble elements in a visually pleasing way. It may inspire your own similar efforts.

Tara Ojo

Building a Button with Adobe Spectrum — Back in React Status #198 we led the issue with news of the release of Adobe’s React Spectrum. In the first part of a series of articles, this experienced Adobe engineer goes through the implementation details for Press Events.

Devon Govett

Building Chat With React? Stream Chat Has You Covered — This tutorial shows you how to quickly build chat leveraging Stream's Chat API and the Stream Chat React components.

Stream sponsor

TypeScript 4.0 Finally Delivers What I’ve Been Waiting For — There is also a new release (candidate) of Microsoft’s TypeScript. In the author’s response to his article’s title, he makes the case for labeled tuple elements: in short, there are now labels in TypeScript parameter lists which are actually meaningful. Finally indeed.

Nathaniel Kessler

How to Configure HTTPS in a React App on localhost — The local instance of the app you built with create-react-app only runs insecure HTTP by default. Today’s internet unequivocally demands https, so here are the steps required for the suprisingly tricky configuration to get production like security on localhost.

Flavio Copes

▶  From Web Comics to React Core with Rachel Nabors — In case you think online communities just happen (like they did in the early days–sort of) today there are few organizations which can afford to leave community development to the vagaries of random chance. That’s really just the beginning of the story of how Rachel Nabors came to be working for Facebook in London. Listen to her fascinating journey.

The Overflow Podcast podcast

Learn All You Need to Know When Considering Your Content Protection

Bitmovin Inc. sponsor

▶  React 17’s Best New Feature: Gradual UpgradesReact 17 boasts ‘no new features’, but this isn’t entirely true – what’s new is just more subtle and will still benefit you.

Harry Wolff

Records and Tuples for React — A look at a proposal currently progressing smoothly through TC39 and how records and tuples may eventually prove interesting for use with React.

Sébastien Lorber

🔧 Code and Tools

ts-migrate: A Tool for Migrating to TypeScript At Scale — Learn about how Airbnb used codemods to accelerate migration from JavaScript to TypeScript and how their new ts-migrate tooling (GitHub repo) can help with the process.

Sergii Rudenko

Semantic UI React: The Official React Integration for Semantic UI — Amazon, Netflix and Microsoft are amongst the many companies using Semantic UI for both internal and customer-facing applications. It’s a natural complement for React using this ‘factory-authorized’ integration.

Semantic Org

zustand: Yet Another State Management Solution? — There’s room for yet another state management solution, right? Well, maybe. But only if it’s small, fast and scaleable, all of which zustand claims to be. It also eschews boilerplating and opinionated code, which might also come as a pleasant change as compared to the alternatives.

react-spring

OverlayScrollbars: Customizable and Styleable Scrollbars — Creator Rene Haas kicked off the OverlayScollbars project with a desceptively simple premise: existing scrollbars were ugly and consume too much screen real estate. This library covers up the old scrollbars and lets you create and style new ones.

Rene Haas

Chaskiq: Open Source Messaging Platform — We covered messaging/chat newcomer Papercups in last week's issue, this is another alternative in that space worthy of consideration. It's built on top of Ruby on Rails and React.

Chaskiq

Flareact: An Edge-Rendered React Framework Built for Cloudflare Workers — Features file-based page routing with dynamic page paths and edge-side data fetching APIs.

Josh Larson

A Template for Building React Native Apps for Tizen-Based Samsung Smart TVs — One of those things you’ll know you need if you do :-) It’s rough, but if you’re targeting this platform, hopefully useful. There’s more info on this wiki page.

Issam El Nasiri