YT Looper

YT Looper is a small YouTube practice tool for musicians who need to repeat difficult sections, slow them down, and gradually bring them up to speed.

Live demo: yt-looper-two.vercel.app

Why I Use It

When learning an instrument, the useful workflow is often:

1. Find the exact phrase in a song or lesson.
2. Mark the start and end.
3. Loop it until it feels clean.
4. Slow it down.
5. Gradually increase speed.
6. Save or share the loop for later.

This app is built around that practice loop instead of general video watching.

Features

• Paste a YouTube URL or video ID
• Mark A/B loop points with buttons or keyboard shortcuts
• Switch between two loop ranges
• Nudge markers by 0.01s or 0.1s for precise phrasing
• Frame-step around the current timestamp
• Change playback speed from 0.25x to 2x
• Auto-ramp speed every N loop repetitions
• Save named loop presets in local storage
• Copy shareable URLs with loop points and speed encoded in the query string
• Touch-friendly controls for phone or tablet practice

Keyboard Shortcuts

• s / e - mark Loop A start and end
• S / E - mark Loop B start and end
• a / b - switch active loop
• l - toggle looping
• j - jump to active loop start
• [ / ] - decrease or increase speed
• , / . - frame-step backward or forward

Tech Stack

• React
• Vite
• Tailwind CSS
• react-youtube
• Browser local storage for presets

Running Locally

Install dependencies:

npm install

Run the app:

npm run dev

Build for production:

npm run build

Run linting:

npm run lint

Status

Personal utility, actively useful for instrument practice. This is intentionally small: it is worth keeping public as a practical tool, but it is not a major pinned portfolio project unless the UI gets a richer loaded-video demo screenshot and a little more product polish.