Community Picks·44wAnimate UI
Animate UI is an open-source component distribution system that provides fully animated React components built with TypeScript, Tailwind CSS, and Framer Motion. It complements Shadcn UI by offering motion-animated components that can be installed via CLI or copied directly into projects. The platform focuses on providing dynamic backgrounds, primitive animated components, and text effects rather than being a traditional library.
WebDev·43wI Built a Terminal-Based Portfolio You Can Access via SSH
A developer created an innovative terminal-based portfolio accessible via SSH using React Ink for the UI and a custom Go SSH server. The project combines React components with terminal interfaces, allowing users to explore a portfolio directly from their command line without needing a browser. The setup runs on a VPS and demonstrates creative ways to showcase developer work by meeting developers in their native environment.
Community Picks·42wNeodrag: One draggable to rule them all
Neodrag is a multi-framework JavaScript library that provides drag-and-drop functionality across React, Svelte, Vue, SolidJS, and vanilla JavaScript. It features a small bundle size (3.46KB), server-side rendering compatibility, TypeScript support, and consistent behavior across all supported frameworks through shared core logic.
JavaScript Mastery·45wBuild 3 Full-Stack Web Apps That Will Land You a Dev Job (12-Hour Full Course)
A comprehensive 12-hour course teaching React development through building three production-ready applications: a movie app with trending features, a serverless file management system, and an AI-powered travel admin panel. Covers React 19 fundamentals, hooks, state management, component architecture, styling with Tailwind CSS v4, and deployment strategies. Uses modern tools like Next.js 15, Appwrite for backend services, and includes practical examples of authentication, file handling, and API integration.
Telerik·45wReact Design Patterns and Best Practices for 2025
Comprehensive guide covering modern React development patterns for 2025, including function components, custom hooks, Context API, TypeScript integration, and React 19 features like useOptimistic and Server Components. Explores ecosystem tools like Next.js, Remix, Vite, and Tailwind CSS, plus enterprise UI solutions like KendoReact for building scalable, maintainable applications.
Community Picks·45wOnlook – Cursor for Designers
Onlook is an open-source desktop application that bridges the gap between design and development by allowing users to visually edit React websites while automatically writing changes back to code in real-time. The tool features AI-powered assistance for building and experimenting with frontend interfaces, a Figma-style interface that works with existing design systems, and local-first architecture that keeps all code on the user's device. It integrates with existing build processes without requiring component migration and maintains version control compatibility.
JavaScript Mastery·43wWeb Animations Full Course 2025 | Build an Awwwards Website & Master GSAP in Two Hours
A comprehensive tutorial covering GSAP (GreenSock Animation Platform) fundamentals and building an award-worthy animated website. The course teaches essential GSAP methods including to, from, fromTo, timeline, stagger, and ScrollTrigger, then applies these concepts to create a cocktail landing page with smooth animations, parallax effects, and scroll-triggered interactions. Includes practical examples of integrating GSAP with React, text animations using SplitText plugin, and professional animation techniques used by top-tier agencies.
gitconnected·44wReact 19 State Management: Context API and the New use() API Explained
React 19 introduces the new use() hook as an alternative to useContext for accessing Context API values. The Context API enables global state management across components without prop drilling, making it ideal for shared data like authentication, themes, and cart information. The use() hook simplifies syntax by eliminating the need for useContext boilerplate and works with both contexts and async resources. While useContext remains stable for current projects, use() represents React's direction toward cleaner data access patterns, especially in server-driven environments.
LogRocket·44wTop 5 Next.js alternatives for React developers
Explores five alternatives to Next.js for React developers who want different approaches to building web applications. Covers Remix for full-stack apps with web-native patterns, Astro for content-heavy sites with island architecture, TanStack Start for type-safe full-stack development, Vike for flexible SSR control, and Vite + React Router for lightweight client-side apps. Each option offers different trade-offs in complexity, performance, and developer experience compared to Next.js.
LogRocket·44wTanStack Form vs. React Hook Form
A comprehensive comparison between TanStack Form and React Hook Form for React applications. TanStack Form offers better type safety, framework-agnostic support, and advanced features for complex forms, while React Hook Form provides simpler APIs and broader community support. The choice depends on project complexity - React Hook Form for simple forms and quick setup, TanStack Form for large-scale applications requiring advanced form management capabilities.
LogRocket·44wTanStack Start vs. Next.js: Choosing the right full-stack React framework
TanStack Start and Next.js represent two different philosophies for full-stack React development. Next.js follows a server-first architecture with built-in SSR, SSG, and file-based routing, making it ideal for content-rich websites and e-commerce platforms. TanStack Start takes a client-first approach with type-safe routing, isomorphic loaders, and flexible architecture, better suited for data-intensive dashboards and interactive applications. The choice depends on project requirements: Next.js for SEO-focused, content-heavy sites with zero-config deployment, or TanStack Start for highly customizable, type-safe applications requiring granular control.
Theo - t3․gg·44wWhy Tech Companies Are Moving Off React
A detailed analysis of why some tech companies are considering moving away from React, examining the framework's evolution through hooks, concurrent mode, server components, and the React compiler. The discussion argues that React's recent developments primarily benefit large-scale applications, addressing performance issues and complexity management that big companies face. The author counters claims that React is failing at scale, demonstrating how features like hooks improved code composability, server components solve server-driven UI problems, and the compiler optimizes performance automatically.
Community Picks·41wDynaUI
DynaUI is a React component library featuring 30+ animated components built with Tailwind CSS and Framer Motion. It promises to reduce development time from weeks to hours by providing pre-built, customizable UI components for landing pages and web applications. The library has received positive feedback from developers who appreciate its time-saving potential and quality animations.
YouTube·42w3 Ways to Build Beautiful Websites Using Cursor AI
Three methods to create professional-looking websites using Cursor AI: cloning existing designs by creating JSON design systems, using customizable component libraries like Shad CN UI through Tweak CN, and integrating premium React components from libraries like React Bits. The guide emphasizes being specific with AI prompts, choosing appropriate fonts and animations, and implementing responsive layouts to achieve professional results instead of generic AI-generated designs.
ByteGrad·43wNext.js CSR vs SSR vs SSG vs ISR and now PPR!
Explains the key rendering strategies in Next.js: Client-Side Rendering (CSR) runs components in the browser, Server-Side Rendering (SSR) executes on the server, Static Site Generation (SSG) pre-renders pages at build time for optimal performance, Incremental Static Regeneration (ISR) allows updating static pages without full rebuilds, and Partial Pre-Rendering (PPR) combines static and dynamic content on the same page. The guide covers when to use each approach, how Next.js automatically chooses rendering methods, and practical implementation examples including server components, client components, and optimization techniques.
Collections·42wBuilding a Comprehensive Calendly Clone with Next.js, TypeScript, and Tailwind CSS
A comprehensive tutorial for building a Calendly-like scheduling application using Next.js 15, TypeScript, React 19, and Tailwind CSS. The project includes user authentication with Clerk, Google Calendar integration, event management, PostgreSQL database with Drizzle ORM, and real-time scheduling functionality with timezone handling. The tutorial covers both frontend and backend development, resulting in a production-ready application with public booking pages and intuitive navigation.
freeCodeCamp·43wHow to Build a Conversational AI Chatbot with Stream Chat and React
A comprehensive guide to building a conversational AI chatbot that combines Stream Chat for real-time messaging with Web Speech API for voice input. The tutorial covers backend setup with Node.js and Express, frontend implementation with React and TypeScript, and integration of speech-to-text functionality. Key features include AI agent management, real-time transcription, microphone permission handling, and seamless voice-to-text message submission.
Horde·44w🚀 8bitcn: An Open-Source Success Story! ⚔️
8bitcn is an open-source project that provides Shadcn UI components with a retro 8-bit aesthetic. In two months, it has attracted nearly 20,000 visitors and over 500 GitHub stars. The project offers complete coverage of Shadcn components styled with pixel art themes, along with a growing collection of blocks and retro design elements.
Community Picks·45wShadcn UI Blocks
A collection of pre-built UI blocks and templates using Shadcn UI components and Tailwind CSS. These ready-to-use components can be copied and pasted into any React framework project, providing developers with beautiful, consistent interface elements without building from scratch.
Community Picks·45wJust Fucking React to React
Demonstrates how simple UI patterns like modals, dark mode toggles, forms, and accordions can be implemented using native HTML elements instead of complex React components. Shows side-by-side comparisons between vanilla HTML solutions and their React equivalents, highlighting how native web APIs often provide simpler alternatives to framework-heavy implementations.
ByteGrad·44wNext.js Tutorial 2025 - Start Your Next.js Journey Here
A comprehensive Next.js tutorial covering the fundamentals of building full-stack applications. Explains the difference between server and client components, demonstrates data fetching with server components, shows how to create dynamic routes, and covers server actions for data mutations. The tutorial walks through building a blog application with database integration using Prisma, form handling, and authentication setup with Kinde. Key concepts include the app router structure, file-based routing, and the benefits of server-side rendering for performance optimization.
Horde·45wWhy is Shadcn popular?
Shadcn's popularity stems from its unique approach as a code distribution platform rather than a traditional UI library. Unlike conventional libraries, developers own the components completely, avoiding dependency management issues and breaking changes from updates. This approach offers more control and flexibility compared to building components from scratch while being significantly more time-efficient and practical for development workflows.
Community Picks·43wreactjs/react-basic: A description of the conceptual model of React without implementation burden.
A theoretical exploration of React's conceptual model that breaks down UI development into fundamental concepts like transformation, abstraction, composition, state management, memoization, and algebraic effects. The document presents React as a system for transforming data into UI representations through pure functions, emphasizing how complex interfaces can be built through composition of simpler abstractions. It covers advanced concepts like memoization for performance optimization, state management patterns, and introduces algebraic effects as a way to handle cross-cutting concerns like theming without prop drilling.
YouTube·42wBuild and Deploy a Full Stack Movie Ticket Booking App using React js | MERN Stack Project
A comprehensive tutorial for building a movie ticket booking application using the MERN stack. The project includes user authentication with multiple sign-up options (email, Google, phone), seat selection functionality, payment processing, and an admin dashboard for managing movies and bookings. Features include email notifications, seat reservation with timeout, multi-session authentication, and responsive design with Tailwind CSS. The tutorial covers project setup, component creation, routing, and deployment using Vercel.
