How I Vibe Code Technical Videos With Claude Code and Remotion

In this video, I show how I create and edit videos with natural language using Claude Code, and Remotion. The entire video was built using the starter template linked below.

GitHub Repo: https://github.com/jhartquist/claude-remotion-kickstart
Inspired by: https://x.com/trq212/status/1947706205172068624

─────────────────────────────
THE STACK
─────────────────────────────
• Claude Code — AI coding assistant in the terminal
• Wispr Flow — voice dictation to Claude Code
• Remotion — React framework for programmatic video
• Playwright MCP — browser automation, screenshots
• Replicate MCP — Veo 3.1 video generation, Nano Banana Pro images
• ElevenLabs MCP — text-to-speech voiceovers
• Deepgram — word-level transcription for timing

─────────────────────────────
CHAPTERS
─────────────────────────────
0:00 Introduction
0:37 Why Remotion + Claude Code
1:16 MCP server integrations
2:01 Getting started with the template
2:13 Remotion Studio overview
2:38 Demo: Building slides step-by-step
3:33 Demo: Generating AI video with Veo 3
4:59 Demo: Generating images with Nano Banana
5:35 Demo: Creating voiceovers with ElevenLabs
6:34 Demo: Transcription and timing with Deepgram
7:11 Final result showcase
7:56 Closing thoughts

─────────────────────────────
CONNECT
─────────────────────────────
GitHub: https://github.com/jhartquist
X/Twitter: https://x.com/johnhartquist
Bluesky: https://bsky.app/profile/johnhartquist.com
LinkedIn: https://www.linkedin.com/in/john-hartquist/

─────────────────────────────

What kind of videos would you make with this? Let me know in the comments—if there's interest, I'll do a deeper tutorial.

#ClaudeCode #Remotion #AIVideoEditing #Veo3 #NanoBanana #ElevenLabs #WisprFlow #Deepgram #MCP #Anthropic #ReactJS #TypeScript #DeveloperTools #TextToVideo #ContentCreation #CodingTutorial #WebDev #AITools #ProgrammaticVideo #replicate

Видео How I Vibe Code Technical Videos With Claude Code and Remotion канала John Hartquist