A Rube Goldberg Machine and New Web Technology
summary
A working Rube Goldberg page assembles CSS Grid, Web Animations API and Web Components with Custom CSS Properties driving timing and layout. Async/await waits on animation.finished promises to chain domino steps, getComputedStyle reads CSS variables for easing and duration, prefers-reduced-motion toggles durations to zero. The demo and slide deck run in modern browsers (Firefox 60 mentioned), polyfills exist for wider support, and the source is published on Twitter so the code actually builds and animates.
AI-written summary · about
chapters (8)
- 0:00Introduction
- 1:28Overview
- 5:07Grid
- 7:34Web animations
- 11:30Web components
- 16:23CSS custom properties
- 20:38CSS grid and web components
- 22:19Custom properties
