React Digest - RD#602 What are React Portals?

What are React Portals?
9 minutes by Dave Bitter

Dave explains React Portals, a powerful feature that allows rendering components outside their parent component's DOM hierarchy. This functionality is particularly useful for creating elements like modals, notifications, and overlays that need to appear above other content without being constrained by their parent components' structure.

Tests are dead. Meticulous AI is here.
sponsored by Meticulous

Meticulous AI is a tool which automatically creates and maintains a continuously evolving e2e UI test suite that covers every corner of your application – with no developer intervention required whatsoever. Backed by CTO of GitHub, Guillermo Rauch (next.js author), yc and others, it's built from the Chromium level up with a deterministic scheduling engine – making it the only testing tool that eliminates flakes.

Uncontrolled or controlled: A matter of perspective
3 minutes by Sam Selikoff

Sam explains the concepts of controlled and uncontrolled components in React, using examples of both input elements and a Counter component. It demonstrates that a component's classification as controlled or uncontrolled depends on perspective: if it manages its own internal state, it's uncontrolled, but if it receives its state via props from a parent component, it's controlled.

Building React Forms with Ease Using React Hook Form, Zod and Shadcn
6 minutes by Boris Martinović

Forms are something every developer encounters, whether as a user or on the developer side. They’re essential on most websites, but their complexity can vary wildly—from simple 3-field contact forms to giga-monster-t-rex, multi-page forms with 150 fields, dynamic validation, and asynchronous checks.

Build a Pomodoro app
45 minutes by Corina Udrescu

Build a React app that allows users to track a Pomodoro cycle. You set a timer for 25 minutes, work until it's up, then take a five-minute break—and repeat the whole process three more times. After that, you take a 15- to 30-minute break, depending on how you feel. And that's one full Pomodoro cycle. There are many Pomodoro apps out there (PomoFocus, Forest, Tomito, Pomodor, ZenTimer), and they all have a

Be careful with useSyncExternalStore
5 minutes by Nico Prananta

Learn how to avoid infinite render loops when using useSyncExternalStore with non-primitive values in React, and discover a robust solution for storing objects in localStorage with proper type safety.

✂️ Cut your QA cycles down from hours to minutes with automated testing
sponsored by QA Wolf

If slow QA processes bottleneck your software engineering team and you’re releasing slower because of it, you must check out QA Wolf. They get you to 80% automated end-to-end test coverage and help ship 5x faster by reducing QA cycles from hours to minutes. With over 100 5-star reviews on G2 and customer testimonials from Salesloft, Drata, Autotrader, and many more — you’re in good hands.

newsletters

Would you like to become a sponsor and advertise in one of the issues? Check out our media kit and get in touch.