What’s new for React 18?

#​258 — September 29, 2021

Read on the Web

React Status
⚛️ Your weekly React news digest, every Wednesday.

Generating an Image from a Rendered React Component — Rather than implementing separate logic for downloadable images, why not use this straightforward method of creating a JPG or PNG from the component which has already rendered? html2canvas does the heavy lifting here.

Robin Wieruch

▶  How React Got Traction, with Pete HuntThe Swyx Mixtape is Shawn’s curated excerpts from other podcasts covering a broad range of subjects. In this episode (of just 11 minutes) his pick is a conversation between original React Core Team member Pete Hunt and Steve Krause from the Future of Coding podcast.

Shawn ‘Swyx’ Wang podcast

ButterCMS – #1 Rated Headless CMS. Melts into React Apps — ButterCMS is the #1 rated Headless CMS for React. Enable your marketing team to update website content w/ our easy to use dashboard. Fast content API for modern apps. Secure. Scalable. Less Code. Try free today for 30 days.

BUTTERCMS sponsor

What’s New in React 18? — A general roundup of what’s turning up in the next (not yet released) major version of React.

Yagmur Cetin Tas

Creating React Components from the Command Line with Agrippa — Last week in issue 257 we featured the Agrippa library. Now here’s a walkthrough of just how to use it.

Nathan Sebhastian

How to Build More Accessible React Apps — A thorough-yet-still-succinct guide to making your React apps accessible. Besides being simply the right thing to do, there are SEO benefits, an improved UX experience for all users and (in some locales) it will keep you on the right side of the law.

Joseph Mawa

‘My React App is Slow and I Don’t Know Why’ — When you encounter performance issues in your React apps, what performance monitoring tools are available? Three quick suggestions from Alex here.

Alex Sidorenko

Jobs

React Native Engineer at IGN (Remote) — IGN, leading publisher of video game & entertainment news, is seeking a full time engineer to join us and help build the next generation of mobile apps. Interested? We’d love to talk.

IGN

Senior Software Engineer, Full Stack — Forge unlocks liquidity & growth in the private market. Seeking collaborative SWEs to innovate & scale our products and platforms.

Forge

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

Fifty Solitaires: A Beginning — What started out as a bet for a case of beer many years ago morphed into a present day React programming challenge: to implement the game of Solitaire. There’s a catch though: it must implement 50 different sets of gameplay rules. The author invites us to follow along.

Holger Schmitz

A Quick Guide to Dropdown Menus With React

Progress KendoReact sponsor

7 Things You May Not Know About useState

Vladimir Klepov

React Antipatterns to Avoid

Iskander Samatov

NativeScript vs React Native: Which One to Choose for Native Dev in 2021

Max Tsurbeliov

React is Declarative: What Does It Mean?

Alex Sidorenko

🛠 Code and Tools

React Spreadsheet: A Simple Component Implementation for the Pervasive UI Element — A pre-release version of the component which will still save considerable time over building one from scratch. Example here.

Iddan Aaronsohn

React Suite: v5.0 of a Popular Component Library — Major changes include enhanced accessibility, support for CSS variables, refactoring components to employ hooks and numerous other improvements along with a few breaking changes.

React Suite

react-three-flex: The CSS Flexbox for react-three-fiber — Based on Facebook’s Yoga cross-platform layout engine, this library lets you wrap 3D objects in <Box> tags within a <Flex> container.

Poimandres

Burdy: A New Contender in the Headless CMS Space — An apparently ‘clean sheet’ approach to headless CMS, which is Dockerized, AWS-ready, supports a variety of mainstream relational databases and is built with React and TypeScript.

Burdy Technologies

⚡️ Quick Bits:

react-native-flash-message — A flashbar and top notification alert utility.

react-async-hook — A hook for any async operation in React components.

react-native-scrollable-tabview — Make the most of that tiny screen.

react-device-detect — Rendering which reflects the device being used.

react-d3-cloud — A word cloud component for React based on d3-cloud.

Leave a Reply

Your email address will not be published. Required fields are marked *