The Web Development Podcast with Fexingo: Frontend, Backend, and Modern Web Stack

Episode 121 of The Web Development Podcast with Fexingo dives into CSS Subgrid, the feature that finally lets nested grids inherit their parent's track definitions. Lucas and Luna unpack a real-world example: building a consistent card layout where headers, bodies, and footers align across rows without hacky fixed heights or JavaScript. They walk through the syntax, explain why Subgrid launched late in browsers (Safari 16.4, Chrome 117), and compare it to older workarounds like display: contents and nested grid. The episode also includes a quick behind-the-scenes look at how listener support on buy me a coffee dot com slash fexingo keeps the show ad-free. Perfect for frontend developers tired of fighting uneven cards in grid layouts.

#CSS #Subgrid #Frontend #WebDev #Layout #Grid #CSSGrid #Browser #Chrome #Safari #Firefox #Technology #WebDevelopmentPodcast #Fexingo #FexingoBusiness #BusinessPodcast #CSSSubgrid #CardLayout

Keep every episode free: buymeacoffee.com/fexingo

Lucas and Luna explore the CSS light-dark() color function, a native way to support light and dark themes without JavaScript toggle logic or custom properties for every color. They walk through the syntax, browser support as of July 2026, and a concrete example from a real marketing site that cut its theme-related CSS by 40%. They also compare it to the older prefers-color-scheme media query approach and discuss when you still need JavaScript for dynamic toggles. If you're tired of maintaining two color palettes in your stylesheets, this episode offers a practical, modern solution.

#CSS #LightDarkFunction #ThemeSwitching #DarkMode #WebDevelopment #Frontend #CSSColor #PrefersColorScheme #ModernCSS #Accessibility #Performance #WebStandards #Technology #FexingoBusiness #BusinessPodcast #LucasAndLuna #CSSVariables #ColorFunction

Keep every episode free: buymeacoffee.com/fexingo

In this episode, Lucas and Luna explore the CSS @layer rule, which hit baseline browser support in 2024. They walk through a real-world example: a 40,000-line stylesheet where a third-party component library kept overriding custom button styles. Lucas explains how @layer lets developers define explicit cascade layers, so framework defaults stay below authored styles without hacks like specificity escalation or !important. They discuss the cascade hierarchy: unlayered styles always win over layered ones of equal specificity, and layers declared later win over earlier layers. The hosts also cover practical gotchas like layering @import and the order of @font-face declarations. Luna shares a story about refactoring a legacy project that cut CSS debugging time by roughly 30 percent after adopting @layer.

#CSSLayerRule #CascadeControl #SpecificityHacks #WebDevelopment #CSS #Frontend #Technology #FexingoBusiness #BusinessPodcast #CSSAtRule #Baseline2024 #StylesheetArchitecture #ThirdPartyCSS #CascadeLayers #WebStandards #ModernCSS #DeveloperTools #CodeRefactoring

Keep every episode free: buymeacoffee.com/fexingo

Lucas and Luna explore the View Transition API, a new browser feature that lets developers animate between page states with a single line of CSS. Lucas breaks down how it works under the hood—snapshotting the old visual state and cross-fading to the new one—and why it's a game-changer for multi-page apps and single-page apps alike. He shares a concrete example from his own experience: converting a slow, janky JavaScript transition on a documentation site into a smooth crossfade that takes just five lines of CSS. Luna asks about browser support, fallbacks, and common gotchas like z-index stacking and large DOMs. They also discuss how the API's promise-based model lets you control timing and customize animations with pseudo-elements like ::view-transition-old and ::view-transition-new. If you've ever struggled with JavaScript animation libraries to achieve smooth page transitions, this episode will save you hours.

#ViewTransitionAPI #CSSAnimations #WebDevelopment #Frontend #BrowserAPIs #PageTransitions #SPA #MPA #CSS #JavaScript #Chrome #Crossfade #PseudoElements #WebPerformance #DeveloperExperience #Technology #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

Lucas and Luna dive into CSS text-wrap: balance, a property that automatically adjusts line breaks in headlines so each line is roughly the same width. They explore what problems it solves, where it falls short, and how it compares to manual line-break hacks. Using real-world examples from news sites and marketing pages, they explain the algorithm's trade-offs, performance impact, and when not to use it. This episode gives web developers a concrete understanding of a browser feature that can tidy up a page in one line of code.

#CSS #TextWrap #WebDevelopment #Frontend #Typography #CSSBalancing #LineBreaking #BrowserFeatures #Performance #UI #UX #NewsSites #Headlines #RaggedLines #CSSProperty #WebTypography #FexingoTech #TechPodcast

Keep every episode free: buymeacoffee.com/fexingo

In this episode, Lucas and Luna explore CSS Container Queries, a feature that lets elements respond to their parent container's size instead of the viewport. They break down a real-world example: a dashboard with a reusable chart card that must resize independently based on its containing grid column. Lucas explains the difference between container-type inline-size and the newer size shorthand, how to avoid layout thrashing with containment, and why this finally kills the old JavaScript ResizeObserver hacks. Luna pushes back on browser support and caching gotchas. The episode drills into one specific pattern so listeners walk away with code they could write tomorrow.

#CSS #ContainerQueries #WebDevelopment #Frontend #ResponsiveDesign #Technology #FexingoBusiness #BusinessPodcast #WebDevPodcast #CSSContainment #InlineSize #ResizeObserver #DashboardDesign #ProgressiveEnhancement #BrowserSupport #Layout #Coding #ModernCSS

Keep every episode free: buymeacoffee.com/fexingo

Episode 115 of The Web Development Podcast dives into WebGPU, the browser API that gives JavaScript direct access to the GPU for general-purpose computing. Lucas and Luna explain how WebGPU differs from WebGL, why it is built for compute shaders, and how a flight-sim startup called AeroSim used it to run physics simulations client-side — slashing their server costs by 60 percent. The hosts walk through a concrete example: a fluid-dynamics demo that ran at 12 frames per second with WebGL and now hits 55 fps with WebGPU compute shaders. They also discuss browser support as of mid-2026, the implications for machine learning in the browser, and why WebGPU matters for everyday web apps. No fluff — just a focused look at one API that is changing what browsers can do.

#WebGPU #GPUCompute #ComputeShaders #BrowserAPI #WebGL #AeroSim #JavaScriptPerformance #WebDev #Graphics #MachineLearning #ONNX #WebAssembly #Chrome #Firefox #Safari #Technology #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

In this episode, Lucas and Luna explore the modern Clipboard API, explaining how it finally lets web apps read and write text and images without relying on zero-width iframes or Flash-injected textareas. They walk through its browser support history — Safari was the last holdout until 2024 — and show a concrete example: building a 'copy share link' button that actually works on mobile. Along the way they discuss the permission model, the async clipboard methods, and why the old document.execCommand('copy') is now deprecated in most browsers. Practical, specific, and immediately useful for any web developer tired of paste-event hacks.

#ClipboardAPI #AsyncClipboard #WebDevelopment #JavaScript #BrowserAPIs #CopyPaste #WebStandards #PermissionsAPI #Frontend #UserExperience #MobileWeb #Safari #Chrome #Firefox #WebDevTools #Technology #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

Episode 113 of The Web Development Podcast dives into the WebCodecs API, which lets browsers encode and decode video frames in pure JavaScript. Lucas explains how this API bypasses the old MediaRecorder's opaque pipeline, giving developers control over codecs, bitrate, and frame-level processing. He uses the example of a real-time video chat app that dropped latency from 500ms to under 100ms by using WebCodecs with WebRTC. Luna questions browser support and fallback strategies for Safari and older Chrome versions. The conversation also covers practical use cases like client-side video editing, game streaming, and compression before upload. By the end, listeners understand why WebCodecs is a game-changer for low-latency video on the web, and how to start experimenting with it today.

#WebCodecs #VideoEncoding #JavaScript #WebRTC #MediaRecorder #VideoProcessing #LowLatency #ClientSide #Chrome #Safari #Firefox #API #WebDevelopment #Technology #FexingoBusiness #BusinessPodcast #DeveloperTools #RealTimeVideo

Keep every episode free: buymeacoffee.com/fexingo

Episode 112 of The Web Development Podcast dives into the File System Access API, a browser feature that lets web apps read and write files directly on the user's device. Lucas and Luna walk through a concrete example: a text editor that opens a local file, edits it, and saves changes back to disk—no uploads, no downloads, no server round-trips. They discuss the security model behind the File Picker and the writable stream, compare it to the legacy FileReader API, and explain why this matters for progressive web apps and offline-first tools. Lucas shares a real-world case from a collaborative markdown editor that cut save time by 80 percent by using the File System Access API instead of manual uploads. The episode also covers the current browser support landscape (Chromium-based browsers only as of July 2026) and the performance considerations around large binary files. If you build web apps that handle user files, this episode shows you a simpler, faster pattern that's already shipping in modern browsers.

#FileSystemAccessAPI #WebDev #JavaScript #BrowserAPI #ProgressiveWebApps #OfflineFirst #FilePicker #WritableStream #FileReader #Chromium #Blink #TextEditor #Markdown #LocalFileAccess #WebDevelopment #Technology #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo