We’re back reacting to React

#​320 — January 4, 2023

Read on the Web

React Status

React Wrap Balancer: A Component to Make Better Titles — We’d quite like something like this for our newsletters 😉 React Wrap Balancer is a simple component that improves the rendering of titles in your app by avoiding single overhanging words (sometimes known as ‘orphans’). GitHub repo.

Shu Ding

Storybook 7.0 Enters Beta — This is the first major version of this popular frontend UI development tool in nearly two years (so expect breaking changes here). Plenty of new, including a performance overhaul, interaction testing, and much more — see the full changelog here. You can try the beta now, with a migration guide here too.

Storybook

Updated ‘Complete Intro to React’ Course — Learn to build real-world apps using modern React and the latest tools in the React ecosystem like Vite, ESLint, TailwindCSS, React Router, and React Query!

Frontend Masters sponsor

First-Class Support for TypeScript in React Native — With the newly released v0.71 you get a new app template that’s ‘TypeScript (TS) by default’ – TS declarations are shipped with the base package and the documentation is now TypeScript first (Flow or regular JavaScript are still possible, of course).

Nick Gerleman (React Native Team)

Shopify’s Story of Porting Its Largest Mobile App to React Native — Shopify has gone all in with React Native being ‘the future of mobile at Shopify.’ As part of that, it has been migrating its 300+ screen Shopify Mobile app and here’s how that Herculean task’s been going.

Shopify

IN BRIEF:

Next.js 13.1 turned up just before Christmas with some minor enhancements.

Over on Reddit, there was a discussion about why people like using Next.js.

⭐️ Next.js just passed Create React App in GitHub star count if you’re into such measures of popularity.

🤖  ChatGPT as a Universal Redux Reducer? — OpenAI’s ChatGPT has been getting a lot of attention lately so it should come as no surprise there’s yet another novel application for it at the heart of a React app.

Michael Smith

▶  3 React Mistakes, 1 App Killer — React YouTuber extraordinaire Jack Herrington is back for 2023 with a look at three different React related mistakes (and how to work around them).

Jack Herrington

Self-Hosted Form Builder for React: Create and Run Custom Forms For Free

SurveyJS sponsor

Handling Errors Like a Pro in TypeScript“Learn the design pattern I use to handle errors and write cleaner code.”

Kolby Sisk

How I Created a Christmas Music Quiz with React — Nice high-level writeup.

Lloyd Atkinson

Creating a Scheduling App with React, Node and Email.js

Nevo David

🛠 Code and Tools

RAQB 6.0: User-Friendly ‘Query Builder’ for React Apps — Filter-style queries, specifically. Live demo.

Denis Oblogin

Dynaboard: The Pro-Code Web App Builder Made for Developers

Dynaboard sponsor

Recharts: Composable React Charting on top of D3 — There are lots of examples to look at. Line, area, bar, composed, scatter, radar, and pie charts are covered, all in quite a minimal, clean style.

Recharts Group

Schedulely: A CSS Grid-Based React Calendar Control — Still in early development but it boasts a small size, extensibility, and it’s responsive out-of-the-box. GitHub repo.

Bruce Harrison

🤡 uselessHooks: A Collection of Useless React Hooks — Apparently these will ‘impress your coworkers’ – we’re not so sure..

Bilal

Redwood 3.8
↳ React + GraphQL-based full stack framework.

Downshift 7.1
↳ Primitives to build flexible, WAI-ARIA compliant autocomplete or dropdown controls.

🎬 Scene.js 1.9
↳ JS + CSS timeline-based animation library.

Linkify 4.1
↳ Finds URLs in text and converts to links.

React Tracking 9.3
↳ Declarative tracking from the NYT.

React Simple Keyboard 3.5
↳ Customizable virtual keyboard. (Demo.)

PCUI 3.0 – UI components from PlayCanvas.

React Arborist 2.2 – Tree view component.

Mantine 5.10 – Popular component library.

ka-table 7.7 – React table component.

Jobs

Find React Jobs with Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It’s free for job-seekers.

Hired

UX EngineerStimulus is a social platform started by Sticker Mule to show what’s possible if your mission is to increase human happiness. Join our engineering team.

Stimulus

🎁 The Bonus Round

Component Party: A Rosetta Stone of Frameworks? — A comparison of different frameworks (React, Vue, Svelte, Angular, Ember, etc.) by way of simple code snippets covering various tasks.

Mathieu Schimmerling