The story of a big testing library migration
#328 — March 1, 2023
Migrating from Enzyme to React Testing Library — The folks at Sentry spent 16 months converting their component tests (involving 803 test suites in all) from Enzyme to RTL and tell the whole story of why, plus the unforeseen challenges they encountered, here.
Priscila Oliveria and Scott Cooper (Sentry)
Next.js 13.2 Released — The popular batteries-included React framework takes a few steps forward in the areas of SEO support (via a new Metadata API for defining SEO-relevant metadata in layouts and pages), custom route handlers, an improved error overlay, and beta releases of statically typed links, Turbopack improvements, and Next.js Cache for progressive ISR and faster re-deploys.
Neutkens, Lai, et al.
A Fresh Introduction to Next 13+ — Learn Next.js, the complete full-stack framework to create basic blog websites up to full-blown apps and APIs! Plus if you are already familiar with Next.js, we have a course building a full app on Next 13+.
Frontend Masters sponsor
‘React Is Holding Me Hostage’ — A bit of an over-the-top title, but the pseudonymous author feels it’s time: “Under protection of this new found trendiness in React displeasure, I’d like to finally say my piece” and spends many words and code examples expressing said displeasure while admitting React is here to stay.
EmNudge
Modularizing React Applications with Established UI Patterns — This post began as the first in a promised series of posts, but has instead gotten longer each week! It’s now quite a significant, practical look at applying UI patterns to React apps to improve organization and maintainability.
Juntao Qiu
IN BRIEF:
A look at how Storybook 7 has revamped Storybook Docs. A neat way to show UI components off.
Bob Ziroll has put together a React Router v6 course on Scrimba.
An attempt at benchmarking Preact Signals versus React alternatives.
Dear Open Source: Let’s Do a Better Job of Asking for Money — React Flow is a popular library for creating node-based UI mechanisms in React and while some projects are having problems getting the funding they need lately, React Flow has found a way to get “paid fairly” for its open source efforts.
John Robb (React Flow)
▶ Prioritizing the Team Over the Tool with Jason Lengstorf
Whiskey Web and Whatnot sponsorpodcast
Less Code, Better UX: Fetching Data Faster with the Next.js 13 App Router — Improvements in data fetching at the page level versus with the Next.js 13 app directory and server components.
Alice Alexandra Moore and Ariel Kanter
Creating Animations in React with React Spring
Voskan Voskanyan
🛠 Code and Tools
Sonner: An Opinionated Toast Component — Styled by default but customizable. There’s a live demo on the homepage – looks nice. GitHub repo.
Emil Kowalski
react-qrcode-logo: Generate QR Codes with Embedded Logos — A TypeScript-based React component for creating QR codes a little more customizable than the norm.
Giulia Corò
Try Stream’s Free Trial of SDKs for In-App Chat
Stream sponsor
React Snap Carousel: DOM-First, Headless Carousel — This solution uses native browser scrolling and CSS scroll snap points for strong performance. Try out a few different versions here.
Richard Scarrott
▶ ScrollyVideo.js: Responsive ‘Scrollable’ Videos — It’s an interesting effect and well demonstrated here. Compatible with React or just plain ole’ HTML.
Daniel Kao
fhir-react: A Component for Displaying FHIR Data — It’s pretty niche, but FHIR (Fast Healthcare Interoperability Resources) is a standard for exchanging health care data.
1upHealth
Jobs
Software Engineer (Frontend) — Join our “kick ass” team. Our software team operates from 17 countries and we’re always looking for more exceptional engineers.
Sticker Mule
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.
Hired
QUICK RELEASES:
React Native Windows
↳ Build native Windows apps with React.
React Native Reanimated 3.0
↳ React Native’s Animated library reimplemented.
Preact 10.13
↳ Fast 3KB React alternative.
ReactPy 1.0
↳ Not React, but a similar vibe for Pythonistas.
react-intersection-observer 9.4.3
↳ React implementation of the Intersection Observer API.
react-i18next 12.2
↳ Internationalization for React.
react-native-share 8.2.1
↳ Sending simple data to other apps for social sharing.
react-native-bouncy-checkbox 3.0.7