frontend
Practical resources about frontend for software engineers.
65 results
Building Fast and Accessible User Interfaces
Frontend development is more than component libraries. Performance budgets, accessibility compliance, state management, and progressive enhancement determine whether users stay or leave.
This topic covers patterns for web components, state management strategies, accessibility audits with WCAG, and performance optimization techniques. Resources include both framework-agnostic principles and specific implementations for modern stacks.
Reactive State Management with Svelte Stores
How to manage reactive state in Svelte using writable, readable, derived stores, and custom stores...
Exhaustive Type Checking with Discriminated Unions
How to use TypeScript discriminated unions for exhaustive type checking, ensuring all cases are...
Build Reusable Utility Types with Generics
How to create reusable TypeScript utility types using conditional types, mapped types, template...
Data Fetching with Vue 3 Composition API
How to fetch and manage data in Vue 3 using the Composition API with ref, computed, watch, and...
WebSockets for Real-Time Communication
Build bidirectional real-time communication with WebSockets, handling connection management,...
Enable Brotli Compression in Nginx for Static Assets
Configure Brotli compression in Nginx to shrink JavaScript, CSS, and HTML assets with better ratios...
SPA Performance: Code Splitting and Lazy Loading
Improve single-page application load times by splitting bundles at route and component level,...
Vitest Snapshot Testing for React
How to use Vitest snapshot testing to catch unintended UI changes in React components, including...
Abstract Factory for Cross-Platform UI Component Families
Create families of related objects without specifying concrete classes, enabling platform-specific...
Bridge Pattern for Decoupling UI Components from Themes
Separate an abstraction from its implementation so both can vary independently using the Bridge...
Composite Pattern for UI Component Trees in React
Use the Composite pattern to compose objects into tree structures, letting clients treat individual...
Mediator Pattern for Loose Component Coupling in
Reduce chaotic dependencies between UI components by introducing a mediator that centralizes...
MVC Pattern in Modern Frontend Applications
Apply the Model-View-Controller pattern to React and Vue applications to separate data, UI, and...
Static Content Hosting Pattern
Deploy static files to a dedicated content delivery network or object storage to offload origin...
Container-Presenter: Separate Data Logic from Rendering
How to separate data-fetching logic from rendering in React using the container-presenter pattern....
CSS Architecture: Utility-First with Component-Scoped Layers
How to organize CSS with utility-first classes and component-scoped layers. Covers Tailwind CSS,...
Custom Hook Composition
How to compose reusable logic with custom React hooks. Covers hook composition patterns, dependency...
Islands Architecture: Partial Hydration for Faster Pages
Server-render the page as static HTML and hydrate only the interactive islands. Covers Astro client...
Optimistic Update: Update UI Immediately, Reconcile on
How to update UI immediately and reconcile on server response in React. Covers rollback on error,...
Progressive Enhancement
Build a functional HTML baseline and add CSS and JavaScript layers on top. Covers feature...
No results found.