---
title: "React Server Components for everyone"
publication: "React Status"
issue: 379
published_at: "2024-03-27"
canonical_url: "https://react.statuscode.com/issues/379"
---

Plus Remix goes Vite-first, a list of awesome React components, and React Router really isn't dead. |        

#​379 — March 27, 2024 

[Read on the Web](https://react.statuscode.com/issues/379)   

🐣 A quick note to say React Status is taking next Tuesday off, in celebration of Easter. **We'll be back on Wednesday, April 10 :-)**
__
_Your editor, Peter Cooper_ 

Together with [![Fusion Auth\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_512,h_127/e_make_transparent/co_white,e_outline:15/es9kzxpnghhbbctheomi.png)](https://fusionauth.io/docs/quickstarts/quickstart-javascript-react-web?utm_medium=newsletter&utm_source=reactstatus&utm_campaign=mar24_newsletter)  React Status  

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/wjdxlkfytza3rry9sn7x.jpg)](https://redwoodjs.com/blog/rsc-now-in-redwoodjs)  

[React Server Components Now in RedwoodJS](https://redwoodjs.com/blog/rsc-now-in-redwoodjs) — If you thought RSCs were a Next.js phenomenon, think again. Implementations are popping up all over, such as in [Waku](https://waku.gg/) and now RedwoodJS, a full-stack framework founded by GitHub co-founder Tom Preston-Werner that leans on React, Prisma and other technologies to provide a great DX ‘out of the box.’ This post digs deep into how RSCs are used and how they can supplant Redwood’s use of GraphQL. 

Rob Cameron   

💡 RedwoodJS's Amy Dutton has also put together [a comparison of different routers](https://redwoodjs.com/blog/whats-different-comparing-the-router-in-nextjs-app-api-nextjs-pages-api-remix-and-redwoodjs) including Next.js's app and pages approaches and what Remix and RedwoodJS offer.   [![\](https://copm.s3.amazonaws.com/037a3bc8.jpg)](https://fusionauth.io/docs/quickstarts/quickstart-javascript-react-web?utm_medium=newsletter&utm_source=reactstatus&utm_campaign=mar24_newsletter) 

[Auth, Built for Devs by Devs](https://fusionauth.io/docs/quickstarts/quickstart-javascript-react-web?utm_medium=newsletter&utm_source=reactstatus&utm_campaign=mar24_newsletter) — The best frontend language deserves the best auth service. Add MFA, SSO, biometrics and advanced threat detection with just a few clicks. Find out for yourself using our easy quickstart guide. 

FusionAuth sponsor    

[Deploying a React SPA and Python Backend Together on Azure](https://techcommunity.microsoft.com/t5/apps-on-azure-blog/deploying-react-spa-and-python-backend-together-on-the-same/ba-p/4095567) — Last week, [we saw how](https://techcommunity.microsoft.com/t5/apps-on-azure-blog/build-a-full-stack-react-application-with-azure-static-web-apps/ba-p/4090838) to roll out a full stack React app on Azure using _Azure Functions_, but what if you want something more traditional/monolithic like a Python-powered backend? _Azure App Service_ can help with that. 

Tanuja Palakurthy (Microsoft)   

**IN BRIEF:** 

- 🔥 [▶️ "React Router is on the way out"](https://www.youtube.com/watch?v=nZKlPtQqqgQ) says popular dev YouTuber Theo, but [🐦 that's not quite true](https://twitter.com/BrooksLybrand/status/1772641658137411950), clarifies Remix devrel Brooks Lybrand, though it is true React Router and Remix share a _lot_ and will continue to do so.
- Remix has gone 'Vite-first' with [their starter docs](https://remix.run/docs/en/main/start/quickstart) using it from the off.
- A husband/wife duo [rewrote their React app in Svelte](https://dusty.phillips.codes/2024/03/20/we-rewrote-our-react-app-in-svelte-in-three-weeks/) and told the tale.
- [Absolutely Awesome React Components](https://github.com/brillout/awesome-react-components) is a well-maintained, curated list of, unsurprisingly, React components. A curious feature is that for each component added, an unmaintained one _must_ be removed too.   

[How to Build a ChatGPT-a-Like with Clerk and AWS Bedrock](https://conermurphy.com/blog/how-to-build-your-own-chatgpt-clone-using-clerk-aws-bedrock) — A thorough walkthrough whose focus is on the UI rather than the LLM/AI stuff behind the scenes which is taken care of by Amazon’s [Bedrock](https://aws.amazon.com/bedrock/) service. Clerk handles the auth, while Next.js forms the base of the app. 

Coner Murphy   

[Using ReactToPrint to Generate a Printable Document](https://blog.logrocket.com/using-react-to-print-generate-printable-document/) — Use [ReactToPrint](https://github.com/MatthewHerbst/react-to-print) to add a print feature to your React app while preserving your document’s neat, consistent appearance. 

Elijah Agbonze (LogRocket)   

[Migrating a Next.js App from Vercel + PlanetScale to Fly.io](https://www.crispyscript.com/articles/13) 
Pob Ch   

[Flaky Tests in React: Detection, Prevention and Tools](https://semaphoreci.com/blog/flaky-react) 
Ayomipo and Fernandez (Semaphore)   

[How Next.js Breaks React Fundamentals](https://ondrejvelisek.github.io/how-nextjs-breaks-react-fundamentals/) 
Ondrej Velisek opinion  

🛠 Code, Tools & Libraries 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/az66ovfuccl2he6mmg4e.jpg)](https://www.npmjs.com/package/react-horizontal-scrolling-menu)  

[React Horizontal Scrolling Menu 7.0](https://www.npmjs.com/package/react-horizontal-scrolling-menu) — A customizable horizontal scrolling menu component that’s responsive and can support numerous control approaches via scrollbars, touch, mouse wheel, etc. There are [plenty of Storybook examples](https://asmyshlyaev177.github.io/react-horizontal-scrolling-menu/?path=/docs/docs--docs). 

Aleksandr Smyshliaev et al.   

[next-intl 3.10: Internationalization (i18n) for Next.js](https://next-intl-docs.vercel.app/) — If you want to internationalize your Next.js app, this is for you — you get a hooks-based, type-safe API with i18n and l10n features, internationalized routing, and [React Server Components support](https://next-intl-docs.vercel.app/docs/getting-started/app-router). Apparently the main Node.js site uses it, too. 

Jan Amann   

[react-resize-aware: A Hook That Listens to Resize Events](https://github.com/FezVrasta/react-resize-aware) — Detect resize events on elements without relying on intervals, loops, DOM manipulation detection or CSS redraws. v4.0 now supports Vite. 

Federico Zivolo      

📰 Classifieds   

Building apps on Vercel backed by a DB? Here’s a video: [how to use Neon branching to get a database for every Vercel Preview Deployment](https://www.youtube.com/watch?v=s4vIMI9rXeg&utm_source=cooperpress&utm_medium=newsletter&utm_campaign=reactstatus&utm_content=classified). 

--- 

📧 If your work extends beyond React, check out [Frontend Focus](https://frontendfoc.us/), our weekly newsletter targeting frontend developers more generally, including the latest in CSS, web performance, and Web APIs.      

[use-hot-module-reload: Trigger a Callback After Hot Module Reloading](https://github.com/rexxars/use-hot-module-reload) — A hook that triggers a callback after hot-module reloading has been performed (for any module, not just the one it was used in) – works with Webpack and Vite. 

Espen Hovlandsdal   

📺 [react-tv-space-navigation: Spatial Navigation for TV Apps](https://github.com/bamlab/react-tv-space-navigation) — _“If you want to develop a TV app for AndroidTV + tvOS + web TV devices, then this package will be helpful. The library is based on LRUD, which is a UI-agnostic lib that represents spatial navigation.”_ 

BAM   

[use-local-storage-state: Like `useState()` But for Local Storage](https://github.com/astoilkov/use-local-storage-state) — A hook that persists data in `localStorage` while having an API similar to `useState()`. 

Antonio Stoilkov   

- [Mantine 7.7](https://github.com/mantinedev/mantine/releases/tag/7.7.0) – Full featured React component suite. Now with virtual colors, a 'floating indicator' component, scatter chart component, and extra hooks.
- [Prismane 1.5](https://www.prismane.io/) – A 'have-it-all' React UI library [packed with stuff](https://www.prismane.io/docs/components/getting-started).
- [TanStack Table 8.15](https://tanstack.com/table/latest) – Headless UI for building tables and datagrids.
- [React Native Share 10.1](https://react-native-share.github.io/react-native-share/) – Share data to other (social) apps.
- 🗓 [React Native Date Picker 5.0](https://github.com/henninghall/react-native-date-picker) for Android, iOS and Expo.
- [react-paypal-js 8.2](https://github.com/paypal/react-paypal-js) – Components for the PayPal JS SDK.
- [react-strict-dom 0.0.4](https://github.com/facebook/react-strict-dom) – (Unfamiliar? An [explanation.](https://szymonrybczak.dev/blog/react-strict-dom))
- [react-three-fiber 8.16](https://docs.pmnd.rs/react-three-fiber/getting-started/introduction) – React renderer for Three.js.
- [react-native-raw-bottom-sheet 3.0](https://github.com/nysamnang/react-native-raw-bottom-sheet)         

Curated by Peter Cooper and Terence C. Gannon. 

A **[Cooperpress](https://cooperpress.com/)** publication. 

[Change your email address](https://react.statuscode.com/edit_subscription/*|UID|*) or[Stop getting this newsletter](https://react.statuscode.com/leave/*|UID|*) 

© Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom
