#354 — September 13, 2023 |
|
Making Sense of React Server Components — React Server Components have attracted a lot of attention this year, with Dan Abramov even creating a somewhat technical ‘let’s reimplement RSCs from scratch’ guide to hammer the concepts home. This post, however, demystifies what RSCs are, why they matter, and the opportunities they’re opening up, in an easy to follow way. Josh W Comeau |
How to Pass a Component as a Prop in React — Some different ways to pass a component as a prop in a type-safe manner: passing JSX, using Matt Pocock |
Find Your Perfect Course or Learning Path with Frontend Masters — The Exploration Sale is live! Get access to over 200 courses, all with revamped learning paths. There's a slew of new workshops and courses on the way too, covering TailwindCSS, TypeScript, accessibility, algorithms, Angular, JavaScript and much more. Frontend Masters sponsor |
React Suspense in Three Different Architectures — Suspense provides a way to make components more asynchronous and able to wait for some condition (such as loading content from the server) before they render without affecting the rest of the page. This article shows how Suspense can work alongside client-side rendering, server-side rendering, and server components. Elan Medoff |
Server-Side Rendering (SSR) with Bun and React — Bun 1.0, a performance oriented alternative server-side JS runtime, has finally been released. To better understand how it can be employed with React, this case study walks through an example. Alex Kates |
IN BRIEF:
|
What I Learnt Building a React Toast Component — Emil is the creator of Sonner, a popular toast notifications component. Emil Kowalski |
An Alternative to Using State for React Forms — Making the case for using Nirmal Kumar |
Well, Crud … The Person Who Can Do That Is Gone! — And yet you still need to get stuff done and ship features. We can help you figure it out and keep it that way. Let’s go! Test Double sponsor |
A Guide to React Portals — Portals let you render some children into a different part of the DOM / outside the current hierarchy. Temitope Oyedele |
A Walkthrough of Creating and Deploying a Next.js 13 App on Azure — How to create a Next.js app with Prettier, ESLint, Husky, Jest, and deploy it on Azure. Drag13 |
Challenging Established Norms: Making Component Fetching the Exception
|
🛠 Code and Tools |
Next.Nav: VS Code Extension to Work with Next.js App Routes — Provides an interesting way to look at and navigate around the routes available in a Next.js app. OSLabs Beta |
ReacType 17.0: React Apps Without the Dev Time? — ReacType—a prototyping tool we have covered periodically in the past—has just released a brand new version with new features including a “collaboration-focused component marketplace”. Victor Martins |
|
React Tag Autocomplete 7.1 — A flexible and accessible tagging component that makes it easy to guide users when choosing tags. See it in action in the demo. Matt Hinchliffe |
React Plock: A 1KB Masonry Grid Component — TypeScript-ready and it’s easy to customize the grid columns and rows for responsive layouts in the style of Unsplash, say. Renato Pozzi |
|