#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:
|
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
|
🛠 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 |
|
QUICK RELEASES:
|