Best of Frontend DevelopmentNovember 2025

  1. 1
    Article
    Avatar of acxspb6hjyagkgcv84rvgAmir·24w

    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 systemdesignnewsSystem Design Newsletter·25w

    21 Frontend System Design Concepts for Software Engineers

    A comprehensive guide covering 21 frontend system design concepts organized into five categories: rendering strategies (SSG, ISR, SSR, CSR, hybrid), performance optimization (lazy loading, caching, service workers), data management (state management, API strategies, real-time updates), architecture patterns (micro frontends, component systems, CI/CD), and reliability considerations (accessibility, PWAs, security, observability). Explains how frontend engineering mirrors backend system design principles, with practical examples of when to use each approach for building fast, scalable web applications.

  3. 3
    Article
    Avatar of logrocketLogRocket·24w

    Is retro design making a comeback?

    Retro design elements from the 90s—neon colors, pixel art, maximalist layouts, and bold typography—are resurging in modern interfaces. The piece explores how nostalgic design patterns can boost user engagement and brand identity when balanced with contemporary UX principles. It examines which vintage aesthetics work today, common pitfalls to avoid, and frameworks for blending nostalgia with accessibility and usability standards.

  4. 4
    Article
    Avatar of webcraftWebCraft·23w

    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.

  5. 5
    Article
    Avatar of 0cxghgxbzdgi65myd9tbfShefali·25w

    21 Frontend System Design Concepts for Software Engineers

    A comprehensive collection of 21 essential system design concepts specifically for frontend development. Covers critical topics including performance optimization, caching strategies, API design patterns, state management, rendering techniques, security considerations, accessibility, and scalability. Each concept is explained with practical context for building robust, production-ready web applications.

  6. 6
    Article
    Avatar of newstackThe New Stack·24w

    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.

  7. 7
    Article
    Avatar of svelteSvelte Blog·27w

    What’s new in Svelte: November 2025

    Svelte 5.40-5.42 introduces typed contexts with createContext, $state.eager rune for immediate UI updates, and fork API for offscreen state changes. SvelteKit 2.44-2.48 adds event.route and event.url to remote functions, implicit form IDs, programmatic validation, AbortSignal support, and fork API integration. The official Svelte MCP server launches with documentation for AI-assisted development. Community highlights include new apps like Deep Time and Ririkku, learning resources covering remote functions and reactivity, and library updates including Skeleton v5 and TanStack Query v6 with runes support.

  8. 8
    Article
    Avatar of logrocketLogRocket·24w

    What is maximalism in 90s web design?

    Explores how 90s web design maximalism—characterized by chaotic layouts, animated GIFs, bold color palettes, and table-based structures—influenced modern UX principles. Traces the evolution from flashy, crowded aesthetics to today's minimalist standards, examining how elements like grids, micro-animations, and visual hierarchy emerged from that era's experimental approach.

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

    Why the Frontend Should Run AI Models Locally With ONNX

    Running AI models locally in the browser using ONNX Runtime Web offers significant advantages over cloud-based approaches. Local execution eliminates privacy concerns by keeping sensitive data on-device, enables offline functionality, and provides instant feedback loops. ONNX acts as a universal format for ML models, allowing models trained in PyTorch or TensorFlow to run anywhere via JavaScript. Angular's Signals feature (v16+) provides the performance isolation needed for heavy inference operations. The approach enables mixing local models for low-latency tasks with cloud calls for complex reasoning, while maintaining transparency about data handling.

  10. 10
    Article
    Avatar of 7cw1wap1zliwhbdaic8zsKristjan Retter·26w

    Placeholder Image Generator with color control

    A new tool for generating illustration placeholders with customizable color controls, useful for mockups and prototyping during web development.

  11. 11
    Article
    Avatar of nordicapisNordic APIs·26w

    10 APIs for UI Designers to Check Out

    A curated list of 10 APIs that streamline UI design workflows, covering icons (Noun Project), color management (Color API), typography (Google Fonts), gradients (UI Gradients), stock images (Unsplash), design tools (Figma, Sketch), databases (Airtable), analytics (Google Analytics), and file sharing (Dropbox). Each API helps designers access assets, automate tasks, and maintain consistency without leaving their development environment.

  12. 12
    Video
    Avatar of kevinpowellKevin Powell·25w

    Masonry layout is coming, but it's got a new name

    The CSS Working Group has officially named the masonry layout feature 'grid lanes' after over a year of community debate. All major browsers already have some implementation of the feature, with Firefox having a partial implementation for 5 years, Safari offering it in technical preview, and Chrome supporting it behind a flag. The naming decision followed extensive public polling and feedback, with the working group deliberately taking time to gather community input before finalizing the specification. Now that the display type has been named, the associated properties and values should be standardized quickly, potentially leading to rapid browser adoption.

  13. 13
    Article
    Avatar of logrocketLogRocket·26w

    A Jarvis for everyone: AI agents as new interfaces

    AI agents powered by the Model Context Protocol (MCP) are transforming user interfaces from traditional screen-based interactions to conversational, context-aware systems. This shift requires developers to rethink frontend architecture, moving from designing static components to crafting intelligent workflows that agents can interpret. The article explores how multi-channel, multi-capability frameworks enable Jarvis-like assistants to seamlessly handle tasks across platforms, the design patterns needed for agent-first interfaces, and the challenges around reliability, privacy, and user trust that teams must address when building these systems.

  14. 14
    Article
    Avatar of 6itxzon1aa0yopmettuhtJhojan·24w

    Buttony UI — Modern Button Collection

    Buttony UI is a curated collection of modern button designs featuring original creations and works from talented designers like ibelick and guhrodrrigues. The collection includes various styles ranging from glassmorphism and minimalist designs to advanced effects like 3D transforms, magnetic interactions, and animated borders. Each button style offers unique visual effects including scaling, sliding, stretching, glitch effects, and cursor-following parallax, providing developers with ready-to-use UI components for web projects.

  15. 15
    Article
    Avatar of phProduct Hunt·25w

    Sato Video Player: Build custom video players to match your UI without coding

    Sato Video Player is a no-code solution for creating customizable video players that integrate seamlessly with website designs. It offers 50+ customization options including brand colors, logos, and player component styling, along with cloud storage for video hosting. The platform provides embed-ready players as an alternative to third-party video solutions.

  16. 16
    Article
    Avatar of juniorfrontenddevsJunior Frontend Devs·25w

    21 Frontend System Design Concepts for Software Engineers

    A comprehensive collection of 21 essential system design concepts specifically for frontend development. Covers critical topics including performance optimization, caching strategies, API design patterns, state management, rendering techniques, security considerations, accessibility, and scalability. Each concept is explained with practical context for building robust, production-ready web applications.

  17. 17
    Article
    Avatar of bramBram.us·26w

    Combining Scroll-Driven Animations with @starting-style

    Explores the technical challenges of combining CSS scroll-driven animations with @starting-style for fade-in effects. The cascade, animation-fill-mode, and implicit keyframes create unexpected behavior when trying to transition opacity during page load while also animating it on scroll. The solution involves using a registered custom property as an indirection layer, transitioning it from 0 to 1 and referencing it in an explicit 'to' keyframe. Includes practical examples with view timelines and demonstrates additional techniques like using sibling-index() with min() to limit transition delays.

  18. 18
    Article
    Avatar of csharpcornerC# Corner·24w

    Advanced CSS Grid Layouts for Professional UI Design (2025 Guide)

    A comprehensive guide to CSS Grid for building professional two-dimensional layouts. Covers advanced features like grid-template-areas, minmax(), auto-fit/auto-fill, and the fr unit. Includes five real-world examples with code: admin dashboards, Pinterest-style masonry layouts, landing pages with overlapping elements, e-commerce product grids, and dual-sidebar layouts. Demonstrates responsive design techniques that minimize media queries and explains when to use Grid over Flexbox for complex UI structures.

  19. 19
    Video
    Avatar of joshtriedcodingJosh tried coding·24w

    This New Tailwind Plugin is Awesome

    The new CSS corner-shape property enables native support for squircles (square-circle hybrids) and other corner shapes that were previously difficult to implement. Currently supported in Chrome and Edge, the property works with border-radius to create smoother, more visually appealing corners. A Tailwind plugin by Brandon Mecconell provides utility classes for easy implementation, with graceful fallbacks for unsupported browsers like Firefox and Safari that default to standard border-radius styling.

  20. 20
    Article
    Avatar of css_tricksCSS-Tricks·27w

    The “Most Hated” CSS Feature: tan()

    Explores practical applications of CSS's tan() trigonometric function, demonstrating how to create polygon-shaped layouts and circular menus by calculating triangle dimensions. Shows how tan() works with right-angled triangles to determine element heights based on angles and widths, enabling dynamic sectioned lists, character pickers, and image galleries. Includes interactive examples and mathematical explanations of how tangent relates to sine and cosine in the unit circle.

  21. 21
    Article
    Avatar of freecodecampfreeCodeCamp·26w

    Learn Vue.js – JavaScript Framework Course

    A 2-hour beginner-friendly course covering Vue.js fundamentals through hands-on projects. The course starts with setup and installation (CDN and local), then progresses to core concepts including components, reactivity, template syntax, data binding, and building reusable UI elements. Learners will create multiple apps including a Vue Facts application while exploring project structure and asset management.

  22. 22
    Article
    Avatar of hnHacker News·27w

    Why Nextcloud feels slow to use

    Nextcloud's sluggish performance stems from excessive JavaScript bundle sizes, with 15-20 MB downloaded per page load. Core bundles like core-common.js (4.71 MB) and individual apps like Calendar (5.94 MB) and Notes (4.36 MB) create significant execution overhead. Even with caching, browsers must parse and execute massive amounts of code on each visit, resulting in 5-10 second load times on mobile devices. The author has begun migrating to lighter alternatives like Vikunja (1.5 MB) for tasks and Immich for photos, while acknowledging Nextcloud's convenience for other features.

  23. 23
    Article
    Avatar of fasterthanlifasterthanli.me·24w

    Does Dioxus spark joy?

    An in-depth review of Dioxus, a Rust-based full-stack web framework that promises unified codebases across mobile, web, and desktop. The author explores Dioxus's server-side rendering, hydration process, and extensive hook system while comparing it to JavaScript frameworks like React and Svelte. Despite initial frustrations with debugging, hot-patching, and developer experience, the author acknowledges significant improvements in the main branch and recognizes the team's ambitious work on WASM tooling, though concludes the framework isn't quite ready to match JavaScript-based solutions in ergonomics.

  24. 24
    Video
    Avatar of kevinpowellKevin Powell·26w

    CSS Attribute Selectors

    Explores advanced CSS attribute selectors beyond basic usage, covering operators like tilde (~=), pipe (|=), caret (^=), dollar ($=), and asterisk (*=). Demonstrates practical applications including styling links based on file types (PDFs) and external URLs using prefix/suffix matching. Addresses common performance concerns, clarifying that modern browsers handle attribute selectors efficiently.

  25. 25
    Article
    Avatar of allfrontendAll Frontend·24w

    Buttony UI — Modern Button Collection

    Buttony UI is a curated collection of modern button designs featuring original creations alongside works from notable UI designers like ibelick and guhrodrrigues. The collection includes various button styles ranging from glassmorphism and minimalist designs to advanced effects like 3D transforms, magnetic cursor interactions, and animated borders. Each collection is properly attributed to its creator with links to their official profiles.