Best of ReactNovember 2025

  1. 1
    Article
    Avatar of acxspb6hjyagkgcv84rvgAmir·21w

    Is Frontend Dead? The Evolution You Can't Ignore

    Frontend development has evolved from simple UI work into full-system engineering. Modern frameworks like Next.js blur client-server boundaries with server components, edge deployment, and integrated data fetching. Developers now handle state management, security, performance optimization, and deployment—responsibilities traditionally split between frontend and backend roles. The shift demands understanding the complete user experience stack, from rendering strategies to authentication flows. This evolution creates opportunities for those who adapt by either broadening their skills across the full stack or specializing deeply in performance and user experience.

  2. 2
    Article
    Avatar of iotechhubiO tech_hub·21w

    ChatGPT as My Coding Mentor: How I Learned React and Next.js as a Junior Developer

    A junior developer shares their experience using ChatGPT to learn React and Next.js from scratch. The key breakthrough came from learning to prompt effectively by asking for explanations 'like I'm 5' and providing context about experience level. The developer progressed from not understanding basic hooks like useState to confidently building full-stack Next.js applications in two months by having focused conversations, requesting simple analogies first, and building knowledge progressively rather than asking generic questions.

  3. 3
    Article
    Avatar of phProduct Hunt·21w

    Better Upload: Simple and easy file uploads for React, use your S3 bucket

    A lightweight React library for handling file uploads directly to S3-compatible storage services. Designed to minimize setup complexity and avoid unnecessary dependencies while providing direct-to-bucket upload functionality.

  4. 4
    Article
    Avatar of overreactedOverreacted·22w

    Hire Me in Japan — overreacted

    Dan Abramov, known for his work on React at Meta and the Bluesky app, is seeking a software engineering position in Japan with visa sponsorship. He recaps his 15+ years of professional experience, including creating React Hooks documentation, Fast Refresh, Create React App, and Redux. His recent work involved React Native development at Bluesky, focusing on performance optimization and UI quality. He's looking for roles in UI engineering and web development, preferably in Kyoto, with English as the primary work language while he learns Japanese.

  5. 5
    Article
    Avatar of storybookStorybook·23w

    Storybook 10

    Storybook 10 transitions to ESM-only, reducing install size by 29% while adding module automocking for easier testing, typesafe CSF Factories for React, tag filtering exclusion for sidebar management, and Svelte async component support. The release includes support for Next 16 and Vitest 4, plus experimental features like test syntax and React Server Component testing. The breaking change requires Node 20.16+, 22.19+, or 24+.

  6. 6
    Article
    Avatar of webcraftWebCraft·20w

    Is Frontend Dead? The Evolution You Can't Ignore

    Frontend development has evolved from simple UI work into full-system engineering. Modern frameworks like Next.js blur client-server boundaries with server components, edge deployment, and integrated data fetching. Developers now handle state management, security, performance optimization, and deployment—responsibilities traditionally split between frontend and backend roles. The shift demands understanding the complete user experience stack, from rendering strategies to authentication flows. This evolution creates opportunities for those who adapt by either broadening their skills across the full stack or specializing deeply in performance and user experience.

  7. 7
    Article
    Avatar of storybookStorybook·21w

    Storybook MCP sneak peek

    Storybook MCP is a new integration that provides AI coding agents with machine-readable component metadata from your Storybook setup. It helps agents generate higher quality code by giving them access to your existing component patterns, usage examples, and types. The system includes a self-healing loop that runs component tests and allows agents to fix their own bugs autonomously. Benchmarks show 3× faster code generation with 50% fewer tokens while maintaining quality standards. Early access begins December 2 for teams with mature React design systems.

  8. 8
    Video
    Avatar of developedbyeddevelopedbyed·20w

    Animations that should not exist on the web

    Common web animation mistakes include typewriter effects, slow fade-ins exceeding 750ms, scroll jacking, auto-playing carousels, and excessive simultaneous movements causing anti-focus. Best practices involve keeping animations subtle and under 750ms, allowing users to pause auto-animations, maintaining consistent timing, and using libraries like Motion (formerly Framer Motion) or Tailwind CSS animation plugins instead of custom implementations.

  9. 9
    Article
    Avatar of newstackThe New Stack·21w

    The React Component Pyramid Scheme: An Over-Engineering Crisis

    The pursuit of reusable React components has created over-engineered codebases filled with complex abstractions and prop-heavy components that are harder to maintain than simpler alternatives. The DRY principle, when applied dogmatically, leads to premature abstraction and components like Button.jsx that try to handle every use case with dozens of props and conditionals. Intentional code duplication is often more pragmatic than forced reuse, as it preserves clarity and allows code to evolve independently. The solution is adopting a post-reuse mindset that values simple, self-contained, context-aware components over universal abstractions, recognizing that the best component is one you can understand instantly rather than one you can use everywhere.

  10. 10
    Video
    Avatar of fireshipFireship·23w

    React and Svelte had a secret love child…

    Ripple is a new TypeScript UI framework created by Dominic Galloway, former React and Svelte core team member. It combines JSX-like syntax with compiler-driven rendering, allowing statements (if/for loops) directly in templates instead of just expressions. Features include fine-grained reactivity using track functions with @ syntax, scoped CSS styling, and full TypeScript integration with tooling support for Prettier, ESLint, and VS Code.

  11. 11
    Article
    Avatar of colkgirlCode Like A Girl·20w

    I Refactored 6,000 Lines of React Code. Then Everything Broke Again.

    A developer shares their experience migrating over 6,000 lines of React code to TypeScript, only to encounter the same bugs they had previously fixed. The piece explores the emotional challenges of large-scale refactoring work, including the isolation of working solo, the frustration of recurring issues, and the invisible effort that goes unrecognized. Despite setbacks with chart logic and D3 implementations, the experience ultimately built resilience, patience, and stronger debugging skills through persistent problem-solving.

  12. 12
    Video
    Avatar of youtubeYouTube·21w

    Why People Are Obsessed With Web Development?

    Web development has become extremely popular due to its low barrier to entry, accessible learning resources, and career potential. However, the reality involves intense competition, rapidly changing technologies, and deeper complexities beyond basic HTML/CSS. While webdev is a valuable starting point for learning programming fundamentals, it's important to recognize it as one of many paths in tech, including backend development, mobile apps, AI, and cloud engineering.

  13. 13
    Article
    Avatar of tkdodoTkDodo·21w

    Tooltip Components Should Not Exist

    Standalone tooltip components in design systems often lead to accessibility problems and inconsistent user experiences. The core issue is that low-level tooltip components allow developers to attach tooltips to non-interactive elements, breaking keyboard navigation and creating unpredictable UX patterns. Instead of exposing a generic Tooltip component, design systems should provide higher-level pattern components like IconButton with required titles, InfoIcon components, and InfoText elements that enforce accessible, consistent tooltip behavior by design. This restrictive approach ensures keyboard interactivity, visual discoverability, and proper accessibility labeling while preventing common misuse patterns.

  14. 14
    Article
    Avatar of ergq3auoeReinier·23w

    Next.js 16 E-Commerce Application - Stripe Payments, Admin Dashboard & More | ShopCart Pro Tutorial

    A comprehensive video tutorial demonstrating how to build a full-featured e-commerce platform using Next.js 16, including product catalog, shopping cart, payment integration with Stripe, user authentication via Clerk, order management, and admin dashboard. The project uses modern React patterns with Server Components, TypeScript, Tailwind CSS, Sanity CMS for content management, and Firebase Firestore for real-time data, with deployment instructions for Vercel.

  15. 15
    Article
    Avatar of infoqInfoQ·23w

    TanStack Start - A New Meta Framework Powered By React Or SolidJS

    TanStack Start v1 launches as a production-ready full-stack framework built on TanStack Router and Vite, supporting React and Solid applications. It features type-safe routing and APIs, streaming SSR with hydration, server functions, and universal deployment across platforms like Cloudflare Workers, Netlify, Vercel, and Node/Bun. Performance benchmarks show significant improvements over Next.js in bundle size and metrics. The framework allows incremental adoption for existing TanStack Router applications and includes migration guides for Next.js users, positioning itself as a compelling alternative to established meta-frameworks.

  16. 16
    Article
    Avatar of codropsCodrops·22w

    Blood Sugar Battler: Building a Real Game as a Designer using AI

    A designer shares their three-month journey building Blood Sugar Battler, a diabetes education game, using AI tools like Lovable.dev to handle coding while maintaining creative control. The article details the complete process: designing pixel art in Aseprite, implementing game mechanics (combo systems, power-ups, blood sugar tracking), solving mobile browser audio challenges, and optimizing performance with sprite sheets. Key lessons include the importance of clear AI prompts, GitHub integration from the start, mobile viewport handling, and understanding that AI translates intent into code but cannot make creative decisions or replace critical thinking.

  17. 17
    Video
    Avatar of wdsWeb Dev Simplified·20w

    Will Tanstack Start Replace Next.js?

    A comprehensive tutorial building a full-stack to-do application with TanStack Start, covering routing, server functions, database integration with Drizzle ORM, form handling, and client-server data flow. Demonstrates key differences from Next.js including file-based routing with dollar-sign parameters, server functions for both GET and POST operations, and the absence of 'use client' directives. Includes practical examples of type-safe routing, loading states, redirects, and integrating Tailwind CSS with shadcn/ui components.

  18. 18
    Article
    Avatar of colkgirlCode Like A Girl·21w

    The Night I Cried Over a Broken Build and How It Changed Me

    A personal account of experiencing burnout while balancing motherhood and a tech career. The author describes a breaking point at midnight while debugging a production issue, leading to a realization about setting boundaries and prioritizing self-care. The narrative emphasizes that taking breaks and asking for help are signs of strength, not weakness, and encourages working professionals to establish healthy boundaries without guilt.

  19. 19
    Video
    Avatar of huxnwebdevHuXn WebDev·20w

    The Hidden Truth Behind Remix: What REALLY Happened!

    Remix is a fullstack web framework created by the developers behind React Router (Ryan Florence and Michael Jackson). Initially launched as a paid product in 2020, it went open source in 2021 and was acquired by Shopify in 2022. The framework focuses on web standards, server-side rendering, parallel data loading, and progressive enhancement. In 2024, Remix merged with React Router v7, and in 2025, Remix 3 made a radical shift away from React to Preact, prioritizing minimal dependencies and native web APIs, though this breaking change divided the community.

  20. 20
    Article
    Avatar of bytesdevBytes by ui.dev·22w

    TanStack dominance intensifies

    TanStack reached 4 billion npm downloads and released DB 0.5 with Query-Driven Sync, a feature that eliminates custom endpoints by making component queries the API call. The system uses differential dataflow to compute queries incrementally and offers three sync modes (eager, on-demand, progressive) that scale from 1,000 to 100k+ rows. Additional coverage includes Meta's StyleX styling system, JavaScript source maps internals, V8 garbage collector updates, and a JavaScript semicolon gotcha that causes reference errors when array brackets follow strings without semicolons.

  21. 21
    Article
    Avatar of wordpresscoreMake WordPress Core·22w

    DataViews, DataForm, et al. in WordPress 6.9

    WordPress 6.9 introduces major updates to the DataViews framework, including expanded field types with 16 bundled edit controls (up from 5), a rule-based validation system supporting async operations, and enhanced data handling through getValue/setValue methods for nested and derived data. Filtering capabilities expanded from 6 to 22 operators with type-specific filters, while all layouts now support grouping and infinite scroll. New additions include DataViewsPicker for selection interfaces, the @wordpress/views package for state persistence, and DataForm improvements with controlled validation and the useFormValidity hook.

  22. 22
    Article
    Avatar of bytesdevBytes by ui.dev·23w

    The htmx loophole

    htmx v4 alpha introduces major changes by switching from XMLHttpRequest to the native fetch() API, enabling streaming support and view transitions. The update includes explicit attribute inheritance, improved history storage without localStorage, and simplified internals. Other highlights include Safari 26.2 beta improvements, discussions on React performance optimization with atomic state, and insights on TypeScript's evolution in the AI era.

  23. 23
    Article
    Avatar of platformaticPlatformatic·21w

    Next.js 16: Harness 'use cache' with Watt v3.18

    Watt 3.18 adds support for Next.js 16's new 'use cache' directive, enabling component-level distributed caching through Redis/Valkey integration. This solves a critical challenge for self-hosted Next.js deployments by providing shared cache across multiple application instances, eliminating cache inconsistencies that occur with default file-system caching. The update allows developers to explicitly cache individual React components and functions with surgical precision, while Watt handles the complexity of distributed cache configuration automatically. Note that enabling component caching disables traditional ISR caching due to Next.js 16 architectural limitations.

  24. 24
    Article
    Avatar of twirThis Week In React·22w

    This Week In React #258: TanStack, Next.js, ImGui, next-intl, React-Email, Ink, React Router

    Weekly React ecosystem newsletter covering TanStack DB's new query-driven sync feature, Next.js experimental transition indicators, React 19 error boundary changes, and StyleX CSS-in-JS library overview. React Native updates include Snapchat's Valdi cross-platform framework release, IntersectionObserver API support, and security vulnerability fixes. Additional coverage includes TC39 meeting agenda, Node.js 25.2 with stable type stripping, and various library releases like React Email 5.0, React Router 7.9.5, and Ink 6.5.

  25. 25
    Article
    Avatar of webcraftWebCraft·22w

    Tired of setting up Vite + React + Tailwind again and again?

    create-vrtw is a CLI tool that automates React + Vite project setup with Tailwind v4 or Bootstrap 5. It handles boilerplate removal and can optionally install React Router or Redux. The tool works with npm, bun, pnpm, and yarn package managers.