#​376 — March 6, 2024

Read on the Web

Together with  Frontend Masters logo
React Status

Million Lint Now in Public BetaMillion’s mission is to make React apps faster and the new VS Code extension Million Lint takes a new approach: imagine something like ESLint, but for suggesting performance improvements. npx @million/lint@latest in any React app will get you started.

Aiden Bai

"react-strict-dom" – Why It's So Great? — Meta’s react-strict-dom is an experimental integration of React DOM and StyleX to standardize the development of styled React components, both web and native. Szymon digs into it a little here.

Szymon Rybczak

Tailwind CSS: Write Efficient, Utility-First CSS — Join Steve Kinney for this detailed video course exploring Tailwind CSS. You'll build real-world components like modals, forms, and page layouts — becoming proficient in creating stunning, responsive, and maintainable UI.

Frontend Masters sponsor

Vercel Unveils Vercel AI SDK 3.0 — You may recall that Vercel launched a tool called v0 last year that uses AI to create React components from natural language descriptions. As part of their latest suite of AI SDKs, they’ve open sourced the tech behind v0 and opened a way to integrate AI into your React apps in a streaming fashion via React Server Components.

Palmer, Ding, Leiter, et al. (Vercel)

React Unforget: An Experimental Alternative to React Compiler? — The React team teased more about the potential of the React Compiler (a.k.a. 'Forget') in their recent update, but Mohamad was really keen to get playing with the concepts ASAP: “With React Forget’s release timeline unclear, I’ve launched a community-driven version to keep innovation alive. I believe React Unforget can be to React Compiler what Preact is to React.”

Mohamad Mohebifar

▶  Expo Explained in 100 Seconds — If you’ve never quite grasped what Expo brings to the React Native table, Fireship quickly summarizes it here (in short, think of Expo as a higher layer of structure and tooling for building RN apps, along with libraries and components).

Fireship

Build a Real-Life, AI-Powered Project with Next.js and Strapi — A walkthrough of building a Next.js app that summarizes YouTube videos using AI and uses the Strapi open-source, headless CMS.

Paul Bratslavsky (Strapi)

▶  Creating Epic Web Experiences Using Remix with Kent C. Dodds — Insights from Kent as to why he believes Remix stands out as a premier framework as well as other subjects such as his process for creating his widely attended courses.

Tejas Kumar podcast

Instant Search Params with React Server Components
Sam Selikoff

Testing Next.js App Router API Routes
David Mytton

🛠  Code, Tools & Libraries

React Barcode 1.5: A Component to Render Barcodes — A React wrapper for JSBarcode, a library that can generate barcodes in numerous formats like EAN, CODE128, ITF, and MSI. GitHub repo.

Lee Sun-Hyoup

ONBOARDING_LIB: A Headless Onboarding Library — An onboarding library for React apps, to make it easier to build accessible, customizable and persisted onboarding flows. The docs site itself is an example of such a flow.

Neftic Oy

React Native SVG 15: SVG Library for React Native — There’s also a compatibility layer to let it work with regular React on the Web too. v15 notably introduces visionOS support.

Software Mansion

📰 Classifieds

🧩 Busy? Build your MVPs 8.6x faster. Pick UI templates or use React components by MUI, Tailwind, and more. Copy the clean code – and done!


❓ What’s so great about Drizzle? What is it? How does it work? Get an intro to the TypeScript ORM in: Learn Drizzle in 13 mins.

UVCanvas: Render Shaded Canvases from React — You really need to look at some of the examples to get the idea, but they range from clean and simple to things like look like macOS screensavers and lava-lamp-esque experiences.

Latent Cat

rc-tree-select: A Tree-Based Selection Component — The live demos give me retro Windows vibes.

Alipay