Episode 135 explores the CSS individual transform properties: translate, rotate, and scale. These allow you to animate each transform independently, eliminating the need to manage the entire transform string and enabling smoother, more flexible animations. Lucas and Luna discuss concrete use cases like hover effects and load animations, compare browser support (now above 94%), and share performance tips. They also explain why this approach is easier to read and maintain than the traditional transform property. If you've ever struggled with overriding transforms in CSS animations, this episode shows a cleaner path.

#CSS #WebDevelopment #Frontend #Animations #Transform #Translate #Rotate #Scale #CSSProperties #WebDev #FexingoWebDev #TechnologyPodcast #Fexingo #CSSSyntax #BrowserSupport #Performance #HoverEffects #CodingTips

Keep every episode free: buymeacoffee.com/fexingo

In this episode, Lucas and Luna explore the new CSS trigonometric functions — sin(), cos(), and tan() — that shipped in all major browsers by early 2026. They walk through concrete examples: creating circular motion without JavaScript, building a waving flag effect with cos(), and animating a clock hand entirely in CSS. They discuss performance implications, the required @property rule, and how these functions blur the line between CSS and JavaScript. Perfect for front-end developers looking to write fewer JS animation libraries and leverage pure CSS for complex, performant motion.

#CSS #CSSAnimations #TrigonometricFunctions #SinCosTan #WebDevelopment #Frontend #CSS@property #NoJavaScript #CircularMotionCSS #CSSMathFunctions #Performance #Animation #BrowserSupport #Chrome #Firefox #Safari #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

CSS Scroll Snap lets you build silky-smooth horizontal galleries with just two properties and zero JavaScript. In this episode, Lucas and Luna break down scroll-snap-type, scroll-snap-align, scroll-snap-stop, and scroll-padding—the CSS features that retire brittle carousel scripts. They walk through a real product gallery example, discuss browser support (all modern browsers since 2019), and highlight accessibility wins. Perfect for frontend developers tired of hacking scroll listeners. Plus, a practical tip for using proximity vs mandatory snapping. No frameworks, no libraries—just native CSS.

#CSSScrollSnap #WebDevelopment #Frontend #Carousel #JavaScript #WebPerformance #CSSTips #BrowserAPIs #WebStandards #Accessibility #NoJavaScript #CSSProperties #ScrollSnapType #ScrollSnapAlign #TechnologyPodcast #FexingoBusiness #WebDevPodcast #CSSLayout

Keep every episode free: buymeacoffee.com/fexingo

On this episode of The Web Development Podcast, Lucas and Luna dive into the ResizeObserver API and why it's a game-changer for responsive component design. They compare it to the old window-resize event pattern, walk through a concrete example using a dashboard widget that adapts to its container's width, and discuss performance gains and caveats. No more polling or hacky debounce—ResizeObserver gives you pixel-perfect callbacks when an element's size changes. Perfect for frontend developers building modular, adaptive UIs. Also: how listener support keeps the show ad-free.

#ResizeObserver #WebAPI #JavaScript #Frontend #ResponsiveDesign #Performance #BrowserAPI #WebDevelopment #CSS #Layout #WidgetDesign #ComponentBased #DeveloperTools #ModernWeb #Fexingo #FexingoTech #TechPodcast #WebDevPodcast

Keep every episode free: buymeacoffee.com/fexingo

The Popover API is a native browser feature that lets you create tooltips, dropdown menus, and modal overlays using only HTML attributes — no JavaScript required. In this episode, Lucas walks through the practical setup: the `popover` attribute, `popovertarget` linking, and the built-in `::backdrop` styling. He explains why the API automatically handles focus management, escape-key dismissal, and accessibility roles, saving developers from common custom-popover bugs. Luna asks about the difference between `popover` and the HTML `

#PopoverAPI #WebDevelopment #HTML #CSS #JavaScript #Frontend #Accessibility #BrowserAPI #Tooltips #Modals #NativeWebFeatures #WebStandards #FexingoBusiness #BusinessPodcast #WebDev #Technology #DeveloperTools #UX

Keep every episode free: buymeacoffee.com/fexingo

Lucas and Luna explore the Web Serial API, a browser technology that lets web apps communicate with serial port devices like Arduino boards, 3D printers, and barcode scanners. They walk through a real example: a developer building a browser-based firmware flashing tool for an ESP32 microcontroller in a smart greenhouse project. Lucas explains the security model—how the API requires a user gesture and device chooser dialog to prevent drive-by attacks—and compares it to older approaches like Chrome Apps or native software. Luna asks about the messy reality of USB-to-serial adapters and driver support across Windows, macOS, and Linux. The hosts also touch on the rough edges: limited browser support (Chromium-only as of mid-2026), the lack of a built-in terminal UI, and why the API doesn't support Bluetooth serial. They close by asking whether the Web Serial API will ever go cross-browser, or if it's destined to remain a Chrome superpower for hardware hackers.

#WebSerialAPI #BrowserAPIs #HardwareHacking #IoT #Arduino #ESP32 #SerialCommunication #FirmwareFlashing #ProgressiveWebApps #Chromium #WebDevelopment #JavaScript #USB #SmartGreenhouse #DeveloperTools #Technology #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

Episode 129 of The Web Development Podcast with Fexingo dives into the CSS scroll-driven animations API - a native browser feature shipping in Chrome 115 that lets you animate elements based on scroll position without a single line of JavaScript. Lucas walks through a real-world case: a landing page progress bar that fills as the user scrolls, using only CSS. Luna questions browser support and progressive enhancement. They compare the old way (scroll listeners + requestAnimationFrame) to the new declarative approach, discuss performance gains by moving work off the main thread, and share a practical code example using animation-timeline: scroll(). If you've ever built a parallax section, a reading progress bar, or a scroll-triggered reveal, this API could kill hundreds of lines of JavaScript in your next project. The episode also touches on the animation-range property and how to pair scroll-driven animations with @media (prefers-reduced-motion). No libraries, no polyfills - just the platform catching up to what developers have hacked together for a decade.

#CSS #ScrollDrivenAnimations #WebDevelopment #Frontend #AnimationTimeline #NoJavaScript #Chrome115 #Performance #ProgressiveEnhancement #CSSAnimations #Parallax #ReadingProgress #WebPlatform #BrowserFeature #Technology #FexingoBusiness #BusinessPodcast #WebDevPodcast

Keep every episode free: buymeacoffee.com/fexingo

Episode 128 of The Web Development Podcast dives into CSS animation-timeline, a spec that lets developers drive animations based on a scroll container's progress without a single line of JavaScript. Lucas and Luna walk through the practical case of a scroll-driven progress bar on a blog page — something that used to require Intersection Observer, a scroll listener, or a library like GSAP. They compare the old approach (roughly 30 lines of JS plus debouncing) against the new one: a single CSS property tied to the scroll-driven @keyframes. The conversation covers browser support (Chrome 115+ enabled it behind a flag; shipping in 2026), performance gains from offloading scroll work to the compositor thread, and real-world gotchas like scroll-timeline naming collisions and the difference between scroll and view timelines. By the end, listeners understand why this spec can eliminate thousands of lines of scroll-listener code across a typical web app. Filmed July 23, 2026.

#CSSAnimationTimeline #ScrollDrivenAnimations #WebDevelopment #Frontend #Performance #CSS #JavaScript #WebPerformance #Chrome #CompositorThread #ScrollListener #IntersectionObserver #GSAP #ViewTimeline #ScrollTimeline #ProgressiveEnhancement #FexingoTech #TechnologyPodcast

Keep every episode free: buymeacoffee.com/fexingo

In Episode 127 of The Web Development Podcast, Lucas and Luna dive into the CSS :has() selector, often called 'the parent selector.' They explain how it works with concrete examples: styling a form group when its input is invalid, adding a drop shadow to a card when it contains an image, and building a theme-switching toggle without JavaScript. The discussion highlights real-world use cases from the Airbnb design system and a GitHub PR that uses :has() to style list items containing a particular label. Lucas and Luna also address performance myths and browser support, showing that :has() is safe to use today with progressive enhancement. By the end, you'll understand why this CSS pseudo-class reduces the need for JavaScript state classes and simplifies component logic.

#CSS #HasSelector #ParentSelector #WebDevelopment #Frontend #StateDetection #CSSPseudoClass #ProgressiveEnhancement #BrowserSupport #AirbnbDesignSystem #ComponentLogic #JavaScript #Performance #Cascade #ModernCSS #Technology #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

Lucas and Luna dive into the Web Authentication API (WebAuthn) and how it's finally making passwordless login practical. They break down the difference between passkeys and passwords, walk through a real example of how Apple and Google have baked in support, and explain why the era of 'correct horse battery staple' is ending. This isn't theoretical — over 70 percent of FIDO2 registrations now happen on mobile devices, and major sites like GitHub and PayPal already let you log in with a fingerprint instead of a typed password. They also touch on the security model: how public-key cryptography means your biometric data never leaves your device. By the end, you'll understand why WebAuthn is arguably the most important browser API most developers haven't yet implemented.

#WebAuthn #Passkeys #WebAuthentication #FIDO2 #Passwordless #Cybersecurity #WebSecurity #APIs #Frontend #BrowserAPIs #PublicKeyCryptography #Apple #Google #GitHub #PayPal #Technology #FexingoTechnology #TechPodcast

Keep every episode free: buymeacoffee.com/fexingo