- React Digest
- Posts
- What are React Portals?
What are React Portals?
A powerful feature that allows rendering components outside their parent component's DOM hierarchy
Jakub Chodounsky
November 25, 2024
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.
how did you like this issue? |