~reactstatus | Bookmarks (123)

How The New York Times Migrated from Enzyme to React Testing Library — A thorough look at the technical challenges and strategies the NYT used to perform a piecemeal upgrade of its React testing approach without disrupting either end users or other developers.

React Complex Tree: An Accessible Tree Component — An advanced tree component with multi-select, drag-and-drop, renaming, and keyboard controls.

The URL is a Great Place to Store State in React — This is a surprisingly contentious idea and certainly suits some use cases more than others but, the author argues, “Sometimes, the best place to store state is right in the URL.”

Building APIs with Next.js — A detailed, official introduction to the concepts behind using Next.js’ App Router and route handlers to build public APIs you can expose to web, mobile, and third-party clients.

A Newsletter to Help Flex Your Product Muscles — Product for Engineers is a newsletter dedicated to helping improve your product skills. Get curated advice on building great products, lessons (and mistakes) they’ve learned building PostHog, and deep dives on the strategies of top startups.

Learn How to Enrich PostHog Events with Your User Data — In this guide, you’ll learn how to associate events in PostHog directly to users of your Next.js application. User-level event data can yield insights to inform process optimization, improve user satisfaction and drive growth.

Lynx: A Fresh Alternative to React Native? — I’m taking liberties with the headline, but Lynx is a new framework for building JavaScript-powered native apps that draws inspiration from React Native but aims to be more modular and flexible (and eventually framework agnostic). It comes from, and is used by, TikTok, and comes with its own QuickJS-based JavaScript engine.

TanStack Form v1.0: Headless, Type-Safe Form State Management — A type-safe, framework agnostic (though closely associated with React), headless and isomorphic way to create and work with forms, with this v1.0 release over two years in the making. If you already use things like Formik or React Hook Form and are wondering how it differs to those, here’s a comparison table.

▶  How to Fix Your Slow React App with React Scan — React Scan is a handy tool you can easily use against your React app to detect and surface performance related issues. If you haven’t been convinced to try it so far, maybe Jack Herrington’s 8-minute tour will change your mind.

React Server Actions with Toast Feedback — Robin runs through, step-by-step, how to implement toast notifications as a way to provide real-time user feedback.

React Data Table: Response Dynamic Table Component — Simple and clean, but flexible. Includes features like column sorting and pagination out of the box. Lots of demos and code examples. GitHub repo.

Electron App Boilerplate App with Modern Dependencies — A basic template app that uses React 19, Tailwind CSS 4, shadcn/ui, Electron Vite, Biome, and includes a GitHub Actions release workflow.

🕒 react-timer-hook: A Hook to Handle Timer, Stopwatch and Time State — Provides useTimer, useStopwatch and useTime for implementing various forms of time logic/state in components.

PDFSlick 2.2: View and Interact with PDF Documents — A full-featured PDF viewer for React, Solid, Svelte and other JS apps. Built on top of PDF.js, it uses Zustand to provide a reactive store for documents. Demo.

React Native 0.78 Released — A big release for React Native as it ships React 19 support (which requires some tweaks when upgrading) and some more minor tweaks.

📊 The State of React Native 2024 — In the last issue we linked to the results of the State of React 2024 survey, now it’s React Native’s turn. It gives a good look at what React Native developers are using in modern apps, particularly if you’re not familiar with the space, and it’s interesting to see how widely popular Expo now is.

Using F# to Build React Apps: Transpiling to JS with Fable — The first in a promised series of posts on using Microsoft’s functional language F# to build React apps. Step one is to turn your JavaScript into F# by using Fable.

React Explorer: A Way to Visualize any React Powered Site — A new tool from React Scan’s creator for turning React sites into interactive visualizations representing the component tree. Highly experimental and new, so your mileage (and whether or not you even find such a visualization helpful) may vary.

Redux Toolkit 2.6: Now with RTK Query Infinite Query Support — The popular way to integrate Redux into a modern React app has added a much requested feature: support for infinite queries (the ability to keep fetching additional pages of data for a given endpoint).

Justd: A Set of Accessible React Components Styled with Tailwind — A self-described ‘chill set of React components’ built on top of Adobe’s popular (and highly accessible) React Aria Components.

React Officially Sunsetting Create React App — This move has been bubbling for a long time now, but the React team is now officially recommending CRA-powered apps migrate to a framework (like Next.js) or build tools like Vite.

React Libraries for 2025 — Each year, prolific React blogger Robin updates his post covering his opinionated list of essential React ecosystem libraries. He covers a lot of angles from project creation and package management through to state management, animation, form creation, auth, and i18n.

Build a Next.js Sign-Up Form with React Hook Form — Features progressive enhancement, dynamic validation, and secure password handling with Argon2.

React D3 Tree: Interactive Tree Graph Component — Handy for things like family trees or org charts. There are a few practical examples on display here. Uses D3 for rendering. GitHub repo.