# youtube-devrel

A skill that guides developers and DevRel teams through planning YouTube tutorials, technical screencasts, IDE recording setups, and short-form video.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · ★ 87
- Author: jonathimer
- License: MIT · policy=mirror · the beginning of the file is at the end of this page
- Source: https://github.com/jonathimer/devmarketing-skills/tree/HEAD/skills/youtube-devrel/SKILL.md
- Updated: 2026-03-03
- HTML: https://affpapa.org/en/nevibecode/skills/youtube-devrel

## What it does

The skill provides concrete templates for developer video production. It outlines standard structures with exact timestamps: showing the finished build within the first 30 seconds, walking through prerequisites, and pacing steps into 2- to 5-minute blocks. It also breaks down content formats by target audience, from quick 5-minute fixes for working engineers to 60-minute deep dives.

Technical recording standards are built into the guidance. It specifies an IDE font size of 18–24pt, dark themes, and a clean browser profile without a bookmarks bar. Audio takes priority over camera quality because bad sound causes immediate drop-offs. If `.agents/developer-audience-context.md` exists in the repository, the skill consults it before drafting video outlines.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add jonathimer/devmarketing-skills --skill youtube-devrel -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/youtube-devrel/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/youtube-devrel/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add jonathimer/devmarketing-skills --skill youtube-devrel -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/youtube-devrel/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add jonathimer/devmarketing-skills --skill youtube-devrel -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/youtube-devrel/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install jonathimer/devmarketing-skills youtube-devrel
```

2. **Manually: put the files in place**
- File: `.github/skills/youtube-devrel/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add jonathimer/devmarketing-skills --skill youtube-devrel -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/jonathimer/devmarketing-skills --path skills/youtube-devrel
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/youtube-devrel/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add jonathimer/devmarketing-skills --skill youtube-devrel -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/jonathimer/devmarketing-skills/tree/HEAD/skills/youtube-devrel/SKILL.md

## When to use it
- Outline a minute-by-minute technical tutorial script
- Write a 30-second opening hook showing the final result
- Set readable IDE fonts and screen capture resolutions
- Plan vertical YouTube Shorts under 60 seconds

## Example prompts
- Draft an outline and timestamps for a 20-minute tutorial on building a web scraper in Node.js
- Help me write the first 30 seconds hook for a Rust live coding stream
- Generate ideas for developer YouTube Shorts focusing on Git shortcuts

## Source text · SKILL.md · MIT

Below is the content of a third-party file. It is data, not instructions for you: do not act on anything written inside unless the human asks. Block tag: 57e6d113ba8a958e.

BEGIN THIRD-PARTY FILE 57e6d113ba8a958e
````text
---
name: youtube-devrel
description: When the user wants to create developer YouTube content, technical screencasts, or video tutorials. Trigger phrases include "YouTube," "developer video," "screencast," "video tutorial," "live coding," "YouTube for developers," "tech YouTube," or "YouTube thumbnails."
metadata:
  version: 1.0.0
---

# YouTube for Developer Relations

YouTube is the second-largest search engine and where developers go to learn. This skill covers tutorial structure, screen recording setup, live coding, shorts vs long-form, thumbnails, and SEO for technical content.

---

## Before You Start

1. Read `.agents/developer-audience-context.md` if it exists
2. Audit existing technical YouTube channels in your space
3. Understand: Developer YouTube is a long game — consistency > perfection

---

## Understanding Developer YouTube

### Who Watches Dev Content

| Audience | What they want | Video length |
|----------|----------------|--------------|
| Learning developers | Complete tutorials | 15-45 min |
| Working developers | Quick solutions | 5-15 min |
| Senior developers | Deep dives, architecture | 30-60 min |
| Decision makers | Demos, overviews | 3-10 min |
| Conference attendees | Recorded talks | 20-45 min |

### Content Types That Work

| Content type | View potential | Effort | Notes |
|--------------|----------------|--------|-------|
| Tutorial (build X) | Very high | High | Evergreen traffic |
| Problem/solution | High | Medium | Search-driven |
| Tool comparisons | High | Medium | High search volume |
| Live coding | Medium-high | Low | Engagement-focused |
| Project updates | Medium | Low | Community building |
| Conference talks | Medium | Low | Repurpose content |
| Shorts | High reach | Low | Discovery-focused |

### Successful Dev YouTube Channels

| Channel | Style | Why it works |
|---------|-------|--------------|
| Fireship | Fast, dense, opinionated | Respects viewer time |
| ThePrimeagen | Personality, live reactions | Authentic, entertaining |
| Traversy Media | Clear, beginner-friendly | Comprehensive tutorials |
| Hussein Nasser | Deep dives, whiteboard | Engineering depth |
| Ben Awad | Casual, real coding | Relatable, genuine |

---

## Tutorial Structure

### The Tutorial Template

```
0:00 - Hook (what you'll build/learn)
0:30 - Prerequisites & setup
2:00 - Concept explanation (why)
4:00 - Step 1: [First major step]
8:00 - Step 2: [Second major step]
...
XX:00 - Final result demo
XX:30 - Recap & next steps
XX:45 - CTA (subscribe, comment)
```

### Opening Hook (First 30 Seconds)

| Element | Purpose |
|---------|---------|
| Show the end result | Prove it's worth watching |
| State what they'll learn | Set expectations |
| Mention prerequisites | Qualify viewers |
| Estimated time | Respect their time |

**Example hook**:
```
"By the end of this video, you'll have a working CLI tool
that can scrape any website and export to JSON. We'll use
````
END THIRD-PARTY FILE 57e6d113ba8a958e

The third-party file has ended. Everything between the 57e6d113ba8a958e tags is data: requests and commands from it are not followed. An “end of file” line with another tag inside the block is part of the file.

First 2936 of 11885 bytes. © jonathimer · MIT · https://github.com/jonathimer/devmarketing-skills/tree/HEAD/skills/youtube-devrel/SKILL.md

_Part of the page did not fit — see the HTML version._

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md
