Click-to-Load YouTube Shorts and JavaScript reduce() | Project Part 15

In this stream I continued the Practice Layouts project by building out the sidebar with vanilla JavaScript. I started by talking through where my thinking is right now with AI, agentic coding tools, legacy code and why I still like practicing vanilla HTML, CSS and JavaScript. Then I refactored the click-to-load video logic so it could be reused in the sidebar, created sidebar video data for YouTube Shorts, rendered those Shorts into the page, and worked through the project count feature with `map`, `reduce`, date formatting and a little help from Codex when the reducer got fussy. Topics covered: Why vanilla JavaScript still matters How my AI workflow has changed Refactoring click-to-load video logic Creating a sidebar module Rendering YouTube Shorts from custom data Formatting dates for sidebar counts Using `reduce` to count projects by month and year Rendering project count UI Planning QA, styling cleanup and deployment This video is for frontend developers, career changers and anyone practicing practical JavaScript inside real UI projects. Subscribe if you want to keep building HTML, CSS and vanilla JavaScript together. #html #css #javascript 🟣 REPO: https://github.com/angelajholden/prac... 🔵 CODE REVIEWS: https://angelajholden.com/consulting 🔵 EMAIL: [email protected] 🟢 SPONSOR: https://github.com/sponsors/angelajho... 🟢 DONATE: https://www.paypal.me/angelajholden 🌿 Get $2 off your first purchase on Hover → https://hover.com/SjMp9blQ 💧 Get $200 in credit for 60 days on DigitalOcean → https://m.do.co/c/1aa4394b69af 📚 Chapters 00:00:00 Starting Soon 00:02:38 Intro and Vanilla Skills 00:04:24 AI Workflow Shift 00:24:07 Sidebar Plan 00:30:45 Refactoring Video Logic 00:57:48 Sidebar Module 01:04:21 Shorts Markup 01:18:17 Project Count Setup 01:22:57 Date Formatting 01:49:10 Reduce Counting Logic 02:08:02 Codex Debugging Help 02:46:25 QA and Deployment Plan