Project

RangeTube

A polished A-B looper for YouTube with saved loops, shareable ranges, speed control, and focus mode.

Astro
Preact
TypeScript
Tailwind CSS
YouTube IFrame API
Cloudflare

RangeTube v2 on desktop: a YouTube video loaded above the redesigned A-B loop deck, playback speed controls, copy link, and saved loop form — rangetube.salvarecuero.dev

RangeTube v2 on desktop: focus mode with a dark background, the YouTube player, compact loop range controls, and keyboard exit hint

RangeTube loops a YouTube video between two points you pick. Paste a link, set A and B on the custom range control, and it replays that section without making you scrub the timeline again.

The v2 rewrite turned the old single-page React app into a static Astro site with a Preact looper island. The player uses a click-to-load YouTube facade, a source-agnostic loop engine, keyboard Mark-In and Mark-Out, playback speed control, saved loops, and URLs that sync to the current range.

Content pages ship as zero-JS HTML for SEO, while the interactive tool hydrates only when needed. The portfolio embed contract is preserved, so the live app can still run inside this showcase.