#36: Better Tailwind Components, Production Checklist, JSX Email, Testing Guide

Welcome back to Next.js Weekly's first 2024 edition 🎉. Loaded with more links than usual. Get ready, grab some delicious chocolate milk, and delve into the latest news

2023 JavaScript Rising Stars – An overview of the JavaScript projects that did the best on Github in 2023 in terms of stars. The top spot was claimed by shadcn/ui. It also seems that Next.js got a lot of attention during the last year

TWC - React + Tailwind CSS – Create reusable React components with Tailwind CSS in fewer lines of code

React Server Components: the Good, the Bad, and the Ugly – A well-written thought piece with largely valid criticism of the Next.js App Router, with a particular focus on RSCs. Also be sure to check out Lee’s response video to this article.

Common mistakes with the Next.js App Router and how to fix them – Learn how to use the Next.js App Router more effectively

28 Advanced Next.js features everyone should know – Did you know that you can have type-safe href attributes with Link components? Check out this list for more underrated Next.js features

How to get rid of hydration mismatch errors in Next.js – Eric shares five options to fix those pesky hydration mismatch errors

Next.js - Production Checklist – This new addition to the Next.js docs covers best practices that you can follow before deploying your next revolutionary to-do app to production

More:

• Create products that are resilient to slower internet connections
• Next.js file naming conventions are checked with ESLint rules
• How Lee Robinson created his Guestbook, and you can do it too
• Docs: Next.js testing guide
• Next.js 14 Intercepting Routes
• Next.js 14 Parallel Routes: A Detailed Guide
• Docs: Bundle Analyzer

shadcn/ui got even better – The latest addition includes a Drawer, Carousel, and Pagination component. Additionally, the library now features the famous toast component, Sonner

JSX email – A set of React components and helpers for building delightful and responsive email templates, compatible with modern email clients

Hydration Overlay 🕵️ – This package displays an overlay during Hydration Errors, providing an explicit diff between the server-side and client-side renders

React Aria 1.0 – This major release is the result of over a year of work. Over 40 components with built-in behavior, adaptive interactions, and top-tier accessibility

More:

• 🚀 New major release of Chakra (v3) coming soon
• 🐦 Next.js switching to Lightning CSS
• 🧵 An AI-generated clone of HN
• 🚀 Tailwind CSS v3.4: Dynamic viewport units, :has() support, balanced headlines, subgrid, and more

The Two Reacts – Dan kicked off the year 2024 by delighting us with his wisdom. This article compares the two sides of React, once on the client and once on the server

Branching in Serverless PostgreSQL – Branching gives the user a full copy of the production database that can be used for experimentation or testing without affecting the main branch

View, upload, and delete Blob files in the dashboard – You can now manage your Vercel Blob files from the dashboard using the new file browser

▶ Bringing React Server Components to React Native – It may sound strange, but the talk explains the optimization benefits that RSCs could bring to mobile apps