#​380 — April 10, 2024

Read on the Web
Together with  Posthog
React Status

React Server Components in a Nutshell — A quick overview of RSCs that’s not focused around Next.js! Paul compares the approach taken by several frameworks before sharing his broader thoughts on the technology and why the small Waku framework is worth a look.

Paul Scanlon (The New Stack)

Introducing Waku's “Pages Router” — Waku (already mentioned above) is an interesting minimal server-side React framework and it’s now also bringing a minimal API to the modern React server components era: “Making a Waku site is now as simple as making a few files and folders in the ./src/pages directory”..

Sophia Andren

Product for Engineers: A Newsletter Helping Flex Your Product Muscle — Product for Engineers is PostHog’s newsletter helping engineers improve their product skills. Subscribe to get curated advice on building great products, lessons (and mistakes) from building PostHog, and dive into the strategies of top startups.

PostHog sponsor

Setting Up Storybook for React Components — How Dolt (love that name!) set up Storybook for their React component library including the use of Chromatic to test and review components.

Taylor Bantle

TinyBase 4.8: A Reactive Data Store for Local-First Apps — A data store (for both key/value or tabular data) that can connect together data stores and act as a reactive backend to your apps. Basically, if you want less headache with the backend of your app, this is for you — and it includes bindings to React and pre-built reactive components, too. The demos show it off well. v4.8 includes PowerSync support for syncing between Postgres and SQLite.

James Pearce

💡 If you need convincing of why something like TinyBase is useful, let Benedikt Müller sell you on the idea of TinyBase and PowerSync being the easiest way to build reactive local-first apps.

IN BRIEF:

📄 New Flow Language Features for React — "Flow is excited to announce Component Syntax, adding first-class support for React primitives such as components and hooks to the Flow language." Alex Taylor

📄 Exploring Authentication in Next.js Robin Wieruch

📄 Building an Image Editor with DALL-E and Next.js Reflow

📄 Reconsider Using Storybook: Is It Worth the Hassle? Zachary Johnson

📺 How to Debug Efficiently with the React Developer Tools – 50 minute video. Himanshu Singh

🛠  Code, Tools & Libraries

Docusaurus 3.2: React + MDX Powered Site Builder — If you’ve ever seen a smart, elegant docs site, there’s a 61% chance it’s powered by Docusaurus (citation needed) .. 😅 Maybe not quite, but if it’s good enough for React Native, Relay, Ionic, Jest, and many others, it’s good enough for us. v3.2 ups the ante with significantly faster site builds and a faster dev server.

Meta

Yet Another React Lightbox — Add a lightbox component to your projects “in minutes” – there are several examples to try, as well as a playground with lots of adjustable settings!

Igor Danchenko

📰 Classifieds

Get a .app, .dev, or .foo domain name for only $5 for the first year at Porkbun. It’s perfect for developers and all tech professionals.

📆 Troubleshooting Expo apps - Join Sentry and Expo on April 16th, to learn best practices to debug and improve Expo apps.

🗣️"Compared to our previous experiences in the security/auth space, Userfront is an order of magnitude simpler to use."

⏱ React-Clock: An Analog Clock Component — There’s a beautiful Swiss train station style example on the homepage, but you can ultimately customize the clock to your liking.

Wojciech Maj

form_props: The Power of Rails Forms Now in React Too — One for those working with React from Ruby on Rails. GitHub repo.

thoughtbot

Preview.js: Preview UI Components Instantly in Your IDE — Namely, VS Code or JetBrain IDEs, out of the box. Compatible with components built for React, Vue, Svelte and Solid.

Zenc Labs Pty