GeezerVisonThe World Wide Web, restored to 800 pixels of glory. |
| Home|About|Gaming cabinet|Archives|How it works|Starter sites |
GeezerVison is showing codingcat.dev — Courses & Lessons | CodingCat.dev 🧶 38 Hands-On Courses · 174 Video Lessons pick your next course.Start with our 2026 Flagship Courses on MCP, the Zero-Cold-Start Edge Stack, Sanity Content OS, and TypeScript AI Agents, or follow our modernized Odin Project path. Pick a track & dive in! ✏️ 2026 Courses Progression Diagram ✓ Good PatternVISUAL DIAGRAM [Diagram Walkthrough]Select any course below or filter by stack tag, track, or keyword to jump straight into bite-sized video lessons and production TypeScript code. AAA Contrast VerifiedShowing 38 of 38 courses (174 video lessons) ★ 2026 Flagships 26 coursesflagship production courses.Hands-on courses covering Model Context Protocol (MCP), Zero-Cold-Start Edge Stacks, Sanity Content OS, and TypeScript AI Agents. 2026 Flagship · MCP🤖 Model Context Protocol  MCP in Production: Building & Securing Model Context Protocol ServersMove beyond toy local Stdio scripts. Learn how to architect, secure, and deploy remote Model Context Protocol (MCP) servers on Cloudflare Workers with OAuth 2.1, Better-Auth, WebMCP (RFC 9727), and Sanity Context Knowledge Bases. 5 LessonsStart Course→ 2026 Flagship · Edge Stack⚡ Astro 7, Workers, D1 & Auth  The Zero-Cold-Start Edge Stack: Astro 7, Cloudflare Workers, D1 & Better-AuthShip sub-10ms full-stack TypeScript web applications at the edge using Astro 7 Server Islands, Cloudflare Workers V8 Isolates, Cloudflare D1 SQLite, and self-hosted Better-Auth. 5 LessonsStart Course→ 2026 Flagship · Content OS📚 Sanity Content OS  Sanity Content Operating System: Live Content API, Media Library & FunctionsMaster the 2026 Sanity Content Operating System: structured schemas, TypeGen + stegaClean visual editing, Organization Media Library, Sanity App SDK, and event-driven Sanity Functions with Blueprints. 5 LessonsStart Course→ 2026 Flagship · AI Agents🧠 TypeScript AI Agents  Full-Stack AI Agents in TypeScript (No Python Required)Architect deterministic tool-calling AI agents, multi-step workflows, hybrid browser-to-cloud routing, serverless GPU dispatch, and production eval guardrails in 100% TypeScript. 5 LessonsStart Course→ 2026 Flagship · Edge Agents⚡ Durable Objects & Workflows  Cloudflare Agents, Durable Objects & Stateful Workflows in TypeScriptBuild stateful, long-running AI agents and resilient multi-step workflows using the Cloudflare Agents SDK, Durable Objects with embedded SQLite, WebSockets hibernation, and Workflows. 2 LessonsStart Course→ 2026 Flagship · Full-Stack React🏖️ TanStack Start & Drizzle  TanStack Start, Router & Drizzle: End-to-End Type-Safe Full-Stack ReactBuild 100% type-safe full-stack React applications with TanStack Start, URL search-param schemas, createServerFn RPCs, Drizzle ORM, and Cloudflare Workers. 5 LessonsStart Course→ 2026 Flagship · Local-First SQL🐘 PGlite WASM Postgres  Local-First Web Apps: PGlite (WASM Postgres) & Real-Time SyncRun full Postgres inside the browser via WebAssembly with PGlite, persist to OPFS, sync state in real time with ElectricSQL Shapes, and build zero-latency offline-capable web apps. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Flagship 1: Programmatic Video with React, Remotion & Agent SkillsMaster declarative React video composition with Remotion and Remotion Skills. Learn how to teach AI coding agents to render multi-aspect-ratio 60fps product launch videos without timer drift. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Flagship 2: Agentic 3D Web Pipelines with Blender, Blender MCP & Three.jsGo behind the scenes of how we built 3D AJ the Cat on CodingCat.dev. Connect AI agents to Blender via Blender MCP, export compact glTF 2.0 (.glb) armatures, and render them in Three.js with deterministic window.seek(t) physics. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Flagship 3: Deterministic HTML Motion & Critique with HyperFrames, GSAP, Impeccable & Chrome DevTools MCPBuild framework-agnostic HTML-to-video pipelines for AI agents. Combine HyperFrames, paused GSAP timelines, Impeccable design linting, and Chrome DevTools MCP self-healing visual inspection. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Flagship 4: Local GPU Audio & Diffusion Pipelines with Chatterbox, faster-whisper & ComfyUIEliminate per-minute cloud API bills by running expressive zero-shot TTS (Chatterbox), sub-20ms word alignment (faster-whisper), and multi-view character generation (ComfyUI) on your own GPU. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Flagship 5: Automated Media Engineering & Reference Extraction with FFmpeg & yt-dlpBuild the backbone of an autonomous video studio. Use yt-dlp and FFmpeg to extract reference visual grammars, normalize audio to -14 LUFS, generate 6-across critique contact sheets, and master 1080p60 MP4s. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Remotion in Production: Building & Rendering Videos with ReactTurn React components into frame-accurate 60fps MP4 videos. Master Remotion Compositions, Sequences, spring physics, dynamic data props, and headless rendering. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Remotion Skills: Teaching AI Agents to Build Videos the Right WayInstall and customize remotion-dev/skills so Claude Code, Cursor, and Google Antigravity write deterministic, well-paced React video compositions on the first try. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Blender 5.0 for Web Developers: Headless Python (bpy) & 3D MascotsSkip months of manual 3D viewport clicking. Learn how web developers use headless Blender and Python (bpy) to build, material, rig, and export 3D AJ (.glb) from code. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Blender MCP: Letting AI Agents Build, Rig & Render Your 3D ScenesWire ahujasid/mcp-for-blender into Claude Code and Google Antigravity so your agent can inspect 3D scene hierarchies, execute Python bpy code, and verify 3D AJ renders. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Three.js & WebGPU in Production: Interactive 3D Mascots & ViewersBuild our production `<Aj3dMascotViewer />` component in Astro and Three.js. Master GLTFLoader, studio rim lighting, clamped cursor pupil tracking, and deterministic `window.seek(t)` scrubbing. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  GSAP Deterministic Timelines: UI Motion, Kinetic Type & SVG RigsUse GreenSock (GSAP) for silky-smooth UI morphs, kinetic typography, and articulated SVG mascots while keeping every frame 100% deterministic under `window.seek(t)`. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  HyperFrames: Turning HTML & Canvas into 60fps Video for AI AgentsLearn how HeyGen's open-source HyperFrames compiler turns self-contained HTML, CSS, and Canvas compositions into deterministic 1080p60 videos built by AI agents. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  faster-whisper on Local GPU: Word-Level Captions & Mascot Lip-SyncRun SYSTRAN/faster-whisper with CTranslate2 FP16/INT8 on your GPU to generate millisecond-accurate SRT captions, karaoke highlights, and AJ mouth viseme timelines. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Chatterbox TTS: Free Zero-Shot Voiceovers & Expressive Speech from CodeReplace expensive cloud voiceover subscriptions with Resemble AI's open-source Chatterbox TTS and F5-TTS. Generate studio-grade developer narration locally for $0. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  FFmpeg for AI Video Pipelines: Contact-Sheet Critics & Audio MasteringMaster the exact FFmpeg filtergraphs that turn raw agent frames and synthesized audio into broadcast-ready MP4s, including automated contact-sheet defect detection. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Chrome DevTools MCP: Self-Healing Agent Visual & Video InspectionGive your AI agent eyes inside the browser. Use Chrome DevTools MCP so your agent inspects its own rendered video frames, WebGL canvases, and DOM layouts before exporting. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  Impeccable: Automated Design Review & Polish for AI UI and MotionStop shipping generic AI slop. Integrate Paul Bakaus's Impeccable design review rules to enforce W3C tokens, typographic hierarchy, and tactile chalkboard aesthetics. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  ComfyUI in Production: 3D Mascot Turnarounds & Generate-Then-TraceRun reproducible node-based diffusion graphs on your local GPU with ComfyUI. Generate multi-angle character sheets for 3D AJ and base physics plates for generate-then-trace. 5 LessonsStart Course→ 2026 Flagship Course🧶 Hands-On Course  yt-dlp & Librosa: Reference Visual Grammar & 120 BPM Beat ExtractionNever animate in a vacuum. Learn how to pull reference clips with yt-dlp, slice 0.5s grammar frames into `style_guide.md`, and extract exact musical beats (`beats.json`) with Librosa. 5 LessonsStart Course→ 🛡️ Modernized Odin Path 8 coursesthe odin project series.Step-by-step web engineering foundations from HTML, CSS Grid, and Git internals to React 19, SQL indexing, and Hono RPC. Odin Project 1 · Foundations🌐 HTML, CSS, Flexbox & JS  The Odin Project 1: Web Development Foundations (HTML, CSS, Flexbox & JS Basics)Master the complete Odin Project Foundations path modernized for 2026: how the web works, semantic HTML5, CSS Box Model & Flexbox, and JavaScript DOM fundamentals. 4 LessonsStart Course→ Odin Project 2 · Git & GitHub🌿 Git Internals & Rebase  The Odin Project 2: Git & GitHub Engineering WorkflowsUnderstand how Git actually stores snapshots, master branching and interactive rebase, write atomic commits, and automate PR checks with GitHub Actions. 2 LessonsStart Course→ Odin Project 3 · CSS Grid & Forms📐 Grid & Subgrid  The Odin Project 3: Intermediate HTML, Modern Forms & CSS Grid ArchitectureMaster 2D CSS Grid layouts, Subgrid, CSS Custom Properties, fluid clamp() typography, container queries, and zero-JS form validation with :user-valid. 2 LessonsStart Course→ Odin Project 4 · JS Deep Dive⚙️ Event Loop, Closures & TDD  The Odin Project 4: JavaScript Deep Dive (Closures, Event Loop, Async & TDD)Master lexical closures, ES Modules, the V8 Event Loop (microtasks vs. macrotasks), Promise concurrency, and Test-Driven Development with Vitest. 2 LessonsStart Course→ Odin Project 5 · Motion & A11y♿ View Transitions & WCAG  The Odin Project 5: Advanced HTML, CSS View Transitions & WCAG AccessibilityBuild 60fps GPU-accelerated animations, multi-page Astro View Transitions, WCAG AAA focus rings, and accessible native <dialog> and Popover components. 2 LessonsStart Course→ Odin Project 6 · React 19 & TS⚛️ React 19 & Astro Islands  The Odin Project 6: Modern React 19, State Architecture & TypeScriptMaster React 19 components, strict TypeScript props, derived state vs. useEffect traps, Server Actions, and island hydration in Astro. 2 LessonsStart Course→ Odin Project 7 · SQL & Drizzle🗄️ SQL Indexing & D1  The Odin Project 7: Relational Databases, SQL Indexing & Drizzle ORMMaster relational schema normalization, Primary/Foreign keys, INNER/LEFT JOINs, B-Tree composite indexes, ACID transactions, and type-safe Drizzle ORM on Cloudflare D1. 2 LessonsStart Course→ Odin Project 8 · Backend & Career🚀 Hono RPC & Getting Hired  The Odin Project 8: Backend APIs (Hono vs. Express), Auth & Getting HiredBuild end-to-end typed backend APIs with Hono RPC and Zod, implement secure HTTP-only session cookies and OAuth, and master the 2026 engineering portfolio & system design interview. 2 LessonsStart Course→ ⚡ Frameworks & UI 4 coursesframeworks & reactive ui.Deep dives into fine-grained reactivity, component systems, CSS motion, SvelteKit, and SolidJS. 6 LessonsStart Course→ Fine-Grained Reactivity⚡ Frontend Frameworks  Intro to SolidJSIn this course, you will learn everything you need to know to build user interfaces with SolidJS. 4 LessonsStart Course→ Component Architecture🧶 Svelte Deep Dive  Learn Svelte: The Ultimate GuideMaster Svelte: The Fast, Simple, and Powerful Framework 14 LessonsStart Course→ Full-Stack Apps🚀 SvelteKit & Firebase  Learn SvelteKit and Firebase: The Ultimate GuideLearn how to use SvelteKit and Firebase to build high-performance, scalable web applications. 5 LessonsStart Course→ No matching courses found for this filter. Try clearing the tag, track, or search filter above to view all 38 courses. |
| You are visitor 01402503 — GeezerVison does not store the pages you look up. Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required. |
