Best of React — April 2026

  1. 1
    Article
    Avatar of railway-blogRailway Blog·5w

    Moving Railway's Frontend Off Next.js

    Railway migrated its entire production frontend from Next.js to Vite + TanStack Router, completing the switch in just two PRs with zero downtime. The motivation was slow builds (10+ minutes, 6 of which were Next.js), heavy reliance on client-side patterns that didn't fit Next.js's server-first model, and hacky layout workarounds on the Pages Router. The migration was split into two phases: first removing all Next.js-specific APIs, then swapping the framework and generating 200+ routes from the original page tree. Nitro was added as the server layer, consolidating redirects, headers, and caching. Results include builds under 2 minutes, instant dev server startup, type-safe routing, and first-class layouts. Trade-offs include losing built-in image optimization (replaced with Fastly) and ecosystem tools like next-seo (replaced with in-house equivalents). TanStack Start's relative immaturity is acknowledged but accepted.

  2. 2
    Article
    Avatar of swizecswizec.com·2w

    AI now writes 97% of my code. Here's what I learned

    A senior engineer at a near-billion-dollar company shares that AI (via Cursor) now writes 97% of their production code, including high-stakes systems like an invoicing platform. The key workflow: use Cursor background agents via Slack, don't watch them work, provide clear context and desired outcomes in prompts, then iterate with code review just like you would with a human engineer. The author dismisses elaborate prompt engineering tricks (Agents.md, plan mode, etc.) as distractions, arguing the fundamentals — speak clearly, give context, iterate — are what actually matter. A cautionary note: long-running agents that make early mistakes can produce thousands of lines of broken code, echoing the failures of waterfall development.

  3. 3
    Article
    Avatar of freecodecampfreeCodeCamp·4w

    How to Build a Fashion App That Helps You Organize Your Wardrobe

    A developer built a full-stack fashion web app to solve wardrobe organization and outfit decision fatigue. The app uses React + Vite on the frontend, FastAPI on the backend, SQLite for storage, and Celery + Redis for background jobs. Key features include wardrobe upload with image analysis, outfit recommendations scored by color harmony and body-shape rules, shopping and discard assistants, and a feedback system for improving recommendations. The post covers architecture decisions including JWT token rotation with server-side revocation, user data isolation via ownership checks, and Docker Compose for reproducible setup. Challenges around image-heavy endpoints, session management, and multi-user data isolation are discussed with concrete solutions.

  4. 4
    Article
    Avatar of alltailwindcssAll Tailwind CSS·3w

    The Gridcn: Tron-Inspired shadcn/ui Theme

    The Gridcn is a Tron-inspired theme and component system built on top of shadcn/ui. It transforms standard React UIs into cyberpunk-style interfaces with a visual aesthetic reminiscent of the Tron universe. Created by Edu Calvo and available on All UtilityCSS.

  5. 5
    Article
    Avatar of mdnblogMDN Blog·5w

    Under the hood of MDN's new frontend

    MDN rebuilt its frontend from a React SPA (called 'yari') to a web components-based architecture using Lit, eliminating technical debt accumulated from ejected Create React App configs, entangled CSS, and the fundamental mismatch between a React wrapper and static documentation content. The new stack uses Lit web components for islands of interactivity, custom server components for static HTML templating, and Rspack (a Rust-based Webpack-compatible bundler) for builds. Key architectural wins include lazy-loading web components by name convention, shipping only the CSS needed per page, progressive enhancement via Declarative Shadow DOM, and a development environment that starts in 2 seconds instead of 2 minutes. The Baseline project guided browser compatibility decisions throughout.

  6. 6
    Article
    Avatar of lobstersLobsters·4w

    The Business Case for Vanilla JS

    A developer argues for using Vanilla JS and native browser APIs over SPA frameworks like React for production web apps. The core argument is that React's abstraction leaks heavily (hooks, hydration, component trees), browser APIs are stable and well-documented, and plain JS is simpler to maintain long-term. The author shares personal experience abandoning Preact mid-project in favor of direct DOM manipulation, finding it easier and more reliable. The post challenges the assumption that modern frameworks are necessary or superior for most use cases.

  7. 7
    Article
    Avatar of telerikTelerik·3w

    What’s Next for React in 2026

    Analysis of the State of React 2025 survey results reveals where the ecosystem is heading into 2026. React Server Components have ~45% adoption but only ~33% positive sentiment, while Suspense leads in both adoption and satisfaction. SPAs remain dominant at 84%, with newer patterns like streaming SSR and islands architecture still niche. Developer interest is growing around upcoming Canary APIs like ViewTransition and Activity. The UI component library space remains fragmented, with the top libraries sitting at 50-57% usage. AI tooling is changing how React code is written but not the fundamental architectural decisions teams must make.

  8. 8
    Article
    Avatar of vercelVercel·5w

    Summary of CVE-2026-23869

    A high-severity vulnerability (CVSS 7.5) tracked as CVE-2026-23869 affects React Server Components in Next.js 13.x through 16.x. A specially crafted HTTP request to any App Router Server Function endpoint can trigger excessive CPU usage upon deserialization, leading to Denial of Service. Vercel has deployed WAF mitigations to protect hosted projects automatically, but users must still upgrade to patched versions (15.5.15 or 16.2.3) as the WAF alone is not sufficient protection.

  9. 9
    Article
    Avatar of phProduct Hunt·4w

    React apps that render in the terminal and browser

    gridland is a React framework that enables building terminal applications capable of rendering in both the terminal and the browser. This dual-render approach lets developers demo their terminal apps in a browser without requiring users to install anything upfront. The gridland.io website itself is built with the framework, serving as a live demonstration.

  10. 10
    Article
    Avatar of tkdodoTkDodo·3w

    The Vertical Codebase

    Horizontal codebase structures that group code by type (components, hooks, utils, types) create poor cohesion and make large codebases hard to navigate. The alternative is a vertical structure that groups code by domain or feature — everything related to 'widgets' lives in src/widgets/, regardless of whether it's a component, hook, or utility. This mirrors how product teams are organized and reduces cognitive load. Shared code that spans multiple features becomes its own vertical. To enforce boundaries between verticals, tools like pnpm workspaces, Nx dependency rules, or eslint-plugin-boundaries can define public interfaces and prevent unintended coupling. The tradeoffs include difficulty choosing the right vertical and risk of duplicated implementations across teams.

  11. 11
    Video
    Avatar of codeheadCodeHead·4w

    Frontend Concepts I Bet You DIDN'T KNOW

    A quick overview of frontend concepts that many developers use but don't fully understand. Topics covered include hydration, partial hydration, islands architecture (Astro.js), streaming SSR, React Fiber and concurrent rendering, time slicing, the pitfalls of useMemo and stale closures, and the JavaScript event loop's microtask vs macrotask execution order.

  12. 12
    Article
    Avatar of bytesdevBytes by ui.dev·4w

    TanStack Start gets RSC

    TanStack Start has shipped experimental React Server Components (RSC) support with a fundamentally different philosophy from Next.js. Rather than making the server own the component tree by default, TanStack Start treats RSC as plain React Flight streams that clients fetch, cache, and render like any other async resource via TanStack Query. Key differences include client-owned trees, explicit server functions via createServerFn (avoiding recent RSC CVEs), a new Composite Components primitive, and fully opt-in adoption. On tanstack.com, migrating to RSC cut ~153KB gzipped from the client bundle and reduced Total Blocking Time from 1,200ms to 260ms on content-heavy pages. The newsletter also covers Bun v1.3.12 with native headless browser automation, a North Korean supply chain attack on the Better-Auth library, and various other frontend links.

  13. 13
    Video
    Avatar of wdsWeb Dev Simplified·5w

    You Need To Start Using This Underrated React Hook

    A practical walkthrough of React's useSyncExternalStore hook as an alternative to useEffect for syncing external browser state into React. Covers three use cases: tracking navigator.onLine status, syncing HTML dialog element open/close state (including keyboard escape handling), and building a lightweight global store similar to Zustand or Redux without Context. Explains the hook's subscribe/snapshot/server-snapshot parameters and shows how to avoid common pitfalls like stale state references.

  14. 14
    Article
    Avatar of callstack-blogCallstack Blog·4w

    Agent React DevTools: Debug React Apps with AI Agents

    Callstack has released Agent React DevTools, a CLI that gives AI agents direct access to React DevTools internals — including the component tree, state, profiling data, renders, and performance hotspots. Unlike UI tree inspection alone, this enables AI agents to understand why an app behaves a certain way, not just what it looks like. It integrates as a skill for AI agents and supports React and React Native apps. Integration with third-party plugins via Rozenite is also available, with plans to unify both into a single CLI.

  15. 15
    Article
    Avatar of codropsCodrops·5w

    Building the Maxima Therapy Website: React, GSAP, and Dabbling with AI

    A behind-the-scenes case study of building the Maxima Therapy website, a highly interactive and illustrated site for a neurodivergent support organization. The stack includes React Router, Sanity CMS, Cloudflare Pages, GSAP with ScrollTrigger, Lenis smooth scroll, Lottie animations, Matter.js physics, and Tailwind CSS. Key technical highlights include a draggable SVG carousel with Lottie animations, canvas-based composite layering for scroll-reactive backgrounds, physics-based rope interactions using Matter.js, SVG morphing with GSAP's MorphSVG plugin, and a mouse-driven water ripple effect generated with Claude Code. The post also reflects honestly on AI-assisted development: Claude Code accelerated tedious tasks like SVG optimization, TypeScript typing, and CMS block generation, but occasionally produced inconsistent results and created a sense of losing control over the codebase when used for larger features.

  16. 16
    Video
    Avatar of wdsWeb Dev Simplified·3w

    Zustand Crash Course

    A comprehensive crash course on Zustand, a lightweight state management library for React. Covers migrating from React Context to Zustand, setting up a store with TypeScript, using selectors for performance optimization, the useShallow hook to avoid infinite loops, accessing state outside React components, organizing actions separately from state, persisting state to localStorage with the persist middleware, and simplifying nested state updates with Immer.

  17. 17
    Video
    Avatar of stefanmischookStefan Mischook·3w

    Junior Devs Need to Forget React If They Want a Job

    A veteran developer with 30 years of experience argues that junior developers should stop chasing React jobs and instead focus on AI-based development skills. The core thesis is that React was never special — it was simply the high-demand technology of its era, and AI tooling has now replaced it as the entry point for junior roles. Developers who understand fundamentals and can leverage AI get a 5–10x productivity multiplier, while those without solid foundations hit an 80% wall. The post also pushes back on job-doom narratives, arguing AI creates new project categories and use cases rather than eliminating jobs.

  18. 18
    Video
    Avatar of jherrJack Herrington·4w

    React2Shell on TanStack Start?!?

    TanStack Start's new React Server Components support does not expose apps to the React2Shell CVE that affects Next.js. Three key reasons explain why: TanStack Start routes server functions to module-specific URLs (not a predictable slash endpoint), only includes server function code when explicitly defined, and uses the Seroval data format instead of React's flight data format. Flight data's object reference traversal mechanism is the root cause of React2Shell, and Seroval avoids this attack vector entirely. Past CVEs against Seroval were permanently fixed without the single-payload attack surface that flight data has.

  19. 19
    Article
    Avatar of frontendmastersFrontend Masters·3w

    The Incredible Overcomplexity of the Shadcn Radio Button – Frontend Masters Blog

    A critique of shadcn's radio button component, which expands a single HTML input element into 45 lines of code with three imports, built on top of the 215-line, 7-import-heavy RadixUI primitive. The analysis finds no accessibility improvements and no easier styling compared to the native HTML element, raising questions about the value of such abstraction layers.

  20. 20
    Article
    Avatar of twirThis Week In React·5w

    This Week In React #276: Next.js, Boneyard, MUI, React Router, Ink, shadcn, Docusaurus, Comark, Forms, Shaders

    Weekly roundup covering React and React Native ecosystem news. React highlights include Boneyard (auto-generated skeleton screens), Ink 7.0 (React CLI renderer with React 19.2 support), Material UI 9.0, Mantine 9.0, React Hook Form 7.72 with form-level validation, Docusaurus 3.10, React Router 7.14 with Vite 8 support, and a new Comark markdown parser. React Native 0.85 ships with a new Shared Animation Backend (enabling native driver for layout props), DevTools improvements for simultaneous CDP connections, and Metro TLS support. Also covered: ViewTransition support for RN Fabric (in progress), Skia Graphite pre-release, RN Windows 0.82, and the axios npm supply chain compromise. Other JS ecosystem news includes JSIR (Google's JavaScript IR proposal), esbuild 0.28, ESLint 10.2, and Ky 2.0.

  21. 21
    Article
    Avatar of bu38pdhxh4kmmx7dgvmlpMartin Poblet·2w

    Reuna Presenter - Multi-screen projection software for churches, in the browser

    Reuna Presenter is a browser-based church presentation app built as a web alternative to ProPresenter and EasyWorship. Built with Next.js 15, React 19, Supabase, and TypeScript in a Turborepo monorepo, it supports multi-screen projection with independent content per display, a stage monitor view for performers, drag-and-drop service planning, a cloud-shared song library, Bible search with offline support, mobile remote control via QR code, container-query-based templates, MIDI timeline cues, and a 2D canvas for managing physical screen layouts. The developer is offering 10 days of PRO access to church tech teams willing to test it in a live Sunday service.

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

    This Week In React #278: React Email, TSRX, ESLint plugin, Rspack RSC, TanStack, Hook Form

    Weekly React ecosystem roundup covering React Email 6.0 (consolidated package with embeddable editor), VisionCamera v5 (Nitro Modules rewrite, modular architecture), TypeScript 7.0 Beta (Go rewrite, ~10x faster), Rspack 2.0 (experimental RSC support), TanStack Store 0.11, React Hook Form 7.73, ESLint Plugin React Hooks 7.1, Expo's $45M Series B, Node.js 24.15 (require(esm) stable), Bun 1.3.13, and Hono Node.js Adapter 2.0 (2.3x faster).

  23. 23
    Article
    Avatar of freecodecampfreeCodeCamp·4w

    How to Build an Admin Dashboard Sidebar with shadcn/ui and Base UI

    Step-by-step guide to building a fully functional admin dashboard sidebar using shadcn/ui and a pre-built community block from Shadcn Space. Covers project setup with Next.js and Base UI, installing the sidebar-06 block, defining navigation data as a flat typed array, rendering section labels, leaf items, and collapsible parent menus, tracking active parent and child state, and applying floating sidebar styling with an independent scroll area and a promotional card in the footer.

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

    This Week In React #277: TanStack RSC, React2Dos, Next.js, MUI, Base UI, Aria, StyledComponents, Storm

    Weekly React and React Native newsletter covering TanStack's experimental RSC implementation, a new React DoS vulnerability (CVE-2026-23869) affecting Server Functions requiring upgrade to React 19.2.5 or Next.js 16.2.3, MUI v9 release, Styled Components 6.4 with RSC support, and Base UI 1.4. On the React Native side: Pulsar haptics library from Software Mansion, Nitro Fetch 1.0 as a fast fetch replacement with HTTP/3 support, RN 0.85.1, Metro 0.84.3, and Agent React DevTools for AI-assisted debugging. Other highlights include Chrome 148 Beta with HTML-in-Canvas, Bun 1.3.12, and Syncpack 14.0 rewritten in Rust.

  25. 25
    Article
    Avatar of frontendmastersFrontend Masters·6w

    What To Know in JavaScript (2026 Edition) – Frontend Masters Blog

    A comprehensive 2026 overview of the JavaScript ecosystem covering ECMAScript 2025 and upcoming ES2026 features (Temporal API, Iterator Helpers, Set methods, RegExp.escape, Promise.try, explicit resource management), major framework updates (React 19, Vue 3.6, Svelte 5), JavaScript runtimes (Node.js native TypeScript, Bun acquired by Anthropic, Deno v2), build tools (Vite v8 with Rolldown, Turbopack as Next.js default), TypeScript v6 and the upcoming Go-based compiler in v7, testing trends (Vitest, Playwright), meta-framework news (Next.js 16, Astro acquired by Cloudflare, Remix going React-free), and npm supply chain security incidents.

See all React archives