#​345 — June 28, 2023

Read on the Web

Together with  Fusion Auth
React Status

An Update on Next.js's App Router — The ‘app router’ in Next.js 13+ offers a new approach for structuring Next apps and is recommended for all new ones going forward (it became stable in Next.js 13.4 last month). This post provides a welcome update on how the project sees the feature evolving and how the team is continuing to integrate and collaborate with React generally.

Delba de Oliveira and Lee Robinson (Vercel)

📅  React Jam: A Gamejam for React Developers — React probably isn’t the first option you think of for building a game, but this online event hopes to change that, or at least expand your horizons. Game jams are popular events for developing small games to a deadline, and they’ve got some prizes and judges lined up. It starts on July 20.

React Jam Team

Auth, Built for Devs by Devs — The best frontend language deserves the best auth service. Add MFA, SSO, biometrics and advanced threat detection with just a few clicks. Put FusionAuth to work for you.

FusionAuth sponsor

▶  Don't Follow This Bad React Advice — Jack tackles three commonly seen pieces of React advice that you should think about before following blindly: avoiding the spread operator, not to use useMemo, and only using the updating variant of a useState state setter. Most boolean advice is junk advice, says Jack.

Jack Herrington


▶  React Server Components from Scratch: The Video — Dan Abramov recently released an introduction to RSCs built around reimplementing them from scratch. He asked on Twitter if anyone could record the post in video form and Jesse stepped up with a little 'dramatic reading' for added effect.

Jesse Pence

Creating a Seamless Multi-Language User Interface — A look at the fundamentals of building a React app with basic i18n and multi-language support.

Muhammed Ali

Things You Might Not Know About Next.js's Image Component — Next.js’s Image component has a range of useful capabilities of which you may not be aware.

Alex Barashkov

React Developers, Save $1 Off Your Next Domain Name Registration

Porkbun.com sponsor

Testing Your React Hooks with Vitest — Tips for planning and testing custom hooks with Vitest and React Testing Library.

Maya Shavin

How to Cache Your React Native Dependencies in GitHub Actions — An optimization if you’re building your React Native apps CI/CD-side.
Aryella Lacerda

How to Build a Lightweight 'Collapse' Component
Jonathan Chaffer

Where to Host Your Remix App in 2023
Jacob Paris

🛠 Code and Tools

Typist: Tiptap-Based Rich Text Editor Component — An unashamedly opinionated yet simple text editor control. You can try the examples in the sidebar. It's suited for basic rich text situations like writing comments or messages and also has a single-line mode.


React Shepherd: Guide Your Users Through a Tour — This homepage eats its own dog food with a tour of its own. A wrapper around the Shepherd library. GitHub repo.

Chuck Carpenter

React Authentication — Without Complexity — Userfront streamlines authentication & access control so engineers can focus on their core business. Read the docs now.

Userfront sponsor

💌  MJML: The Responsive Email Framework — HTML emails are a nightmare to code (believe us!) but MJML provides a component-based framework to make it less daunting if you don’t read CanIEmail on a regular basis. To bring React into the picture, you then need Faire’s mjml-react so you can create HTML emails with React components.


💡 Josh W Comeau wrote a neat tutorial about using MJML with React last year.

Blitz.js: It 'Picks Up Where Next.js Leaves Off' — I wasn’t expecting its 2.0 beta phase to last over a year, but this Next.js-oriented toolbox of libraries and conventions is nonetheless ready for action and offers up scaffolding, a type-safe API layer, middleware, auth, and more.

Brandon Bayer

OpenNext: A Serverless Adapter for Next.js Apps — Takes the Next.js build output and converts it to a package that can be deployed to AWS Lambda, Lambda@Edge, CloudFront and S3 with SST.



Find React Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.