React Newsletter #372

Deep dive into React security, Tremor v3.0, and Panda CSS


This issue is sponsored by Nylas -- ✉️ Email, 📅 Calendar, and 🧑‍🤝‍🧑 Contacts in your app

200,000+ developers use simple Nylas APIs in React to seamlessly integrate emails, calendars, and contacts.

Nylas lets you sync data and automate tasks based on your users’ inboxes, calendars, and address books. It supports nearly every provider you can think of (Apple, Google, MSFT). It’s maintenance-free. And yes, there’s a free-forever tier.


News

Library authors' frustration with RSC

A discussion led by Mark Erikson (lead Redux maintainer) and other library authors about their frustrations with trying to make their projects compatible with RSC. "From my perspective, there is a huge amount of churn going on with React right now..."


Articles

Building a full-stack, fully type-safe pnpm monorepo with NestJS, NextJS & tRPC

In this tutorial, Tom Ray walks through how to start from scratch and build a full-stack, end-to-end type-safe pnpm monorepo with NestJS, Next.js 13 (including the new /app directory) and tRPC. This stack (and others similar to it) is becoming increasingly popular, so it's an interesting read.

Why do Client Components get SSR'd to HTML?

A quick visual article by Dan Abramov comparing the mental models of React in a pre and post-RSC world.

Adding real-time full-text search to a Next.js app with Tigris

Tigris is an open-source alternative to MongoDB and DynamoDB, and this tutorial by Ekekenta Clinton gives a great demo of how you can use Tigris to add a real-time, full-text search to a Next.js app. [sponsored]

Hydration is a tree, Resumability is a map

In this article, Manu Mtz.-Almeida breaks down what hydration actually is, and compares the React/Vue/Svelte paradigm of hydration to Qwik's paradigm of resumability.


Projects

Panda CSS

A new CSS-in-JS engine that's RSC compatible and comes with build time generated styles, multi-variant support, and great DX.

rewind-ui

A fully customizable React + Tailwind component library focused on accessibility and easy customization.

Boytacean 0.9.6

A Game Boy emulator built using React and Rust that runs inside the browser, thanks to WebAssembly. Here's the source code.

Tremor v3.0

This new release of the popular chart and dashboard library includes comprehensive global theming via tailwind.config.js, an out-of-the-box darkmode experience, a new Tremor CLI, and more.


Videos

Architecting Fortresses: A Deep Dive into Advanced Security Measures for ReactJS Apps

This interesting, 54-minute conference talk by Jim Manico dives into various advanced defense techniques and recommendations to transform your approach to React application security.

Concurrent React made easy

In this 15-minute talk at Real World React Conf, Henrique Inonhe explores Concurrent React and discusses what problems it solves, how it works, and how to leverage it through the use of concurrent features.

made with ❤️ by ui.dev