Best of React — March 2025
- 1
- 2
Community Picks·1y
Introducing the Supabase UI Library
Supabase has released an official UI Library consisting of ready-to-use components built on shadcn/ui, compatible with various React frameworks. The library includes components for password-based authentication, file uploads, real-time cursor sharing, user avatars, and chat functionalities. These components are fully customizable with Tailwind CSS and designed to simplify the integration of complex features in your projects. Additionally, Supabase provides AI code editor rules to enhance development with Supabase and Postgres.
- 3
HuXn WebDev·1y
THE BIGGEST NEXT.JS COURSE ON THE INTERNET ( PART 1 )
This post introduces the largest Next.js course available online, detailing the comprehensive curriculum which includes Next.js, Prisma, Drizzle, AJ, Clerk, Motion, GraphQL, Stripe, TRPC, testing frameworks, and design systems. The course aims to make participants proficient in Next.js by building over 50 projects and completing 100 challenges with 98% of the code written in TypeScript. Additionally, prerequisites include familiarity with React.js.
- 4
Javascript developers·1y
Frontend Clean Architecture - (Reactjs, Nextjs)
Simple React project structure based on Atomic Design and Clean Architecture principles, aimed at organizing folders for scalable projects. No error handling, authentication, or logic included, just a clean setup to start faster.
- 5
- 6
Web Dev Cody·1y
This is the software engineering mindset you need
In software engineering, developing a mindset to break down large, complex problems into smaller, manageable parts is crucial. Gaining experience in solving various smaller tasks helps build confidence and skills, making it easier to tackle larger projects over time. The key to growth is continuous practice and learning from solving small, distinct problems, which eventually enables solving bigger challenges more efficiently.
- 7
developedbyed·1y
Build your own UI Library - a simple guide
Learn how to set up a component library and design system similar to popular frameworks using Tailwind CSS, React, and Panstack. The guide covers the creation of UI components like buttons, the use of Tailwind merge libraries, and the importance of type safety for CSS class names and variants.
- 8
- 9
Web Dev Simplified·1y
Make Your React Site 100% Faster With This Amazing FREE Tool
React Scan is a new library designed to help developers identify and resolve performance issues in their React applications. It provides a visual representation of component rendering, which makes it easy to spot and understand render issues. The tool can be easily added to any project by pasting a script tag, and it offers detailed insights into render counts and history. Additionally, React Scan includes useful features like FPS drop notifications and an upcoming browser extension, enhancing its utility for performance debugging.
- 10
The React Community·1y
8 Components to become React master
Discusses important concepts such as controlled vs. uncontrolled components, higher-order components (HOCs), render props, and hooks like useState and useEffect. Also covers context for state management and error boundaries. Highlights the importance of component structuring for clean, reusable, and maintainable code.
- 11
Announcing TanStack Form v1
TanStack Form v1 has been released and is ready for production use. It supports React, Vue, Angular, Solid, and Lit frameworks, with numerous features for each. The form library emphasizes type safety and comes with built-in support for runtime usage, type-checking, field-based validation, and async validation. It also offers compatibility with SSR solutions like Next.js and TanStack Start. Future feature additions are planned now that the stable version is released.
- 12
Reacts Big 2025 Comeback!
Explore the new full-stack React framework called TanStack Start, which presents an alternative to Next.js. The post delves into the framework's setup and its integration with Cloudflare services such as durable objects and KV storage. It highlights TanStack Start's support for server-side rendering, streaming, and caching while maintaining ease of use and type safety. The tutorial also covers adding Tailwind CSS and a database, showcasing a complete project setup.
- 13
YouTube·1y
Build an Enterprise Nextjs Rental App | AWS, EC2, Cognito, Shadcn, RDS, S3, Node, React
This guide walks you through building a scalable, enterprise-grade rental application using Nextjs for the frontend and Node.js for the backend, fully deployed on AWS. The application features user authentication with AWS Cognito, property search with Mapbox integration, and comprehensive dashboards for both tenants and managers. Key technologies include Redux Toolkit, Tailwind CSS, Shadcn, and AWS services like EC2, S3, RDS, and API Gateway. Detailed instructions and code samples are provided for each step to help you understand and implement the entire setup.
- 14
ByteGrad·1y
This React Form Builder Is Amazing!
Building and managing forms on a web page can be complex, involving spam filtering, data validation, and email notifications. Basin offers a solution by providing an endpoint for form submissions, handling spam, and notifying via email. You can easily create, embed forms, and use AI to enhance user experience. Basin's features include form builder, spam protection, email notifications, integration with third-party services, and lead scoring.
- 15
Robin Wieruch·1y
Authorization in Next.js
Learn how to implement authorization in Next.js applications using React Server Components, Server Actions, and the App Router. This guide explains the importance of enforcing authorization close to the data source, discusses different layers of authorization, and provides code examples for ensuring only authorized users can access and modify data. Additionally, it covers the use of middleware and layouts for route-based authorization and user experience enhancements.
- 16
Lobsters·1yWhy we ditched Next.js and never looked back
Northflank encountered significant performance and scalability issues with Next.js, leading them to develop a custom server-side rendering solution using React and Express. They observed substantially faster page loads, improved SEO rankings, and reduced crashes after the switch. The team criticizes Next.js for being bloated, slow, and overly complex, especially when used at scale.
- 17
Noted·1y
FileDrop: Self Hosted WebRTC File Transfer with Chat
FileDrop is a self-hosted, end-to-end encrypted, peer-to-peer file transfer platform built on React and Node.js. It supports both file and text transfers and features a minimalist user interface. The post provides a Docker Compose configuration for easy setup and explains that files are relayed directly between devices without being stored on the server. Coturn is used as the TURN server for relaying data when direct peer-to-peer connection is not possible.
- 18
DEV·1y
Why the Latest JavaScript Frameworks Are a Waste of Time
Constantly switching between the latest JavaScript frameworks is often unproductive and disruptive to long-term development goals. Although innovation in frameworks is attractive, consistently relearning new systems can distract from actually building projects. Core programming skills, understanding JavaScript deeply, system design, and writing maintainable code are more valuable for becoming a better developer. Companies prioritize stability and maintainability, which is why frameworks like React and Angular remain dominant in the job market.
- 19
- 20
Optimizing Next.js Applications: A Concise Guide
Next.js has become a popular framework for building fast and SEO-friendly React applications, but as apps grow, they can become slow and inefficient. This guide covers strategies for optimizing performance, including reducing JavaScript bundle size, optimizing images, improving data fetching patterns, and preventing unnecessary re-renders. Additionally, advanced techniques like using incremental static regeneration, SWR for smart caching, and deploying to CDNs are discussed.
- 21
New React Animation API Is Insane
Next.js 14.2 introduces page transitions in server components using the new view transitions API. This allows smooth fade and crossfade animations on page navigation and element state changes. The API supports official React packages and enables easy customization through CSS or JavaScript. It simplifies animation between states, including deletion and position transitions, enhancing the user experience with minimal code effort.
- 22
- 23
Headless Site Directory - List of high-performance headless websites
Explore a curated list of high-performance headless websites that excel in speed, design, and innovation. Discover leading projects in eCommerce, React JS, and portfolio sites. Stay updated with the latest trends and best practices in the industry.
- 24
LogRocket·1y
A complete guide to TanStack Table (formerly React Table)
TanStack Table, previously known as React Table, is a headless UI library for building tables and datagrids across multiple JavaScript frameworks. Rewritten in TypeScript for better performance and support for additional frameworks, it replaces the now-deprecated react-table package. The post guides users on migrating to TanStack Table v8, setting up basic tables, and implementing features like sorting, filtering, and styling. Comparison with other table libraries like Material UI Table is also provided.
- 25
freeCodeCamp·1y
How to Create a Send Email Function using Nodemailer and OAuth2
Learn how to implement a Send Email function in your web application using Nodemailer with OAuth2 for authentication. The guide covers setting up your development environment with Node.js, React, and Chakra UI, and then walks you through both frontend and backend setup. The process includes installing the required libraries, setting up a contact form, handling form submission and validation, and configuring OAuth2 authentication in Google Cloud to secure email sending via an SMTP service.
