A SaaS tool that allows users to extract specific clips from YouTube videos by providing a URL and start/end timestamps. Clips are processed efficiently and downloaded directly to your computer. Open source for folks who can't afford it and know how code works!
- Frontend: NextJS + TailwindCSS (with Shadcn/UI)
- Backend: Node.js (Express) with Bun runtime
- Video Processing: Uses
yt-dlp
andffmpeg
for efficient, compatible video clipping - No cloud storage required: Clips are downloaded directly to your device
You must have the following installed on your system:
- Bun:
bun
(v1.2.7 or later) - Node.js:
node
(v18+ recommended) - npm: (for some tooling, v10+)
- yt-dlp: Command-line tool for downloading YouTube videos
- ffmpeg: Command-line tool for video processing
bun --version
node --version
npm --version
yt-dlp --version
ffmpeg -version
If any are missing, install them via your package manager (e.g., brew install bun yt-dlp ffmpeg
on macOS).
git clone https://github.com/retrogtx/youtube-clipper
cd youtube-clipper
cd backend
bun install
cd ../frontend
bun install
cd backend
bun run src/index.ts
- The backend will start on
http://localhost:3001
by default.
cd ../frontend
bun run dev
- The frontend will start on
http://localhost:3000
by default.
- Open the frontend in your browser (
http://localhost:3000
). - Enter a YouTube URL and the desired start/end timestamps (format:
HH:MM:SS
). - Click "Clip Video".
- The processed clip will be downloaded directly to your computer as
clip.mp4
.
- yt-dlp: Used for partial YouTube downloads.
- ffmpeg: Used for video/audio processing and re-encoding.
- bun: Used as the JavaScript/TypeScript runtime for both backend and frontend.
- node and npm: For compatibility and tooling.
youtube-clipper/
backend/
src/
uploads/
package.json
tsconfig.json
frontend/
app/
public/
components/
package.json
tsconfig.json
next.config.ts
- yt-dlp or ffmpeg not found:
Make sure both are installed and available in your system PATH. - Video fails to upload to Twitter:
The backend re-encodes all clips for Twitter compatibility. If you still have issues, ensure your ffmpeg is up to date. - Port conflicts:
Change the port in the backend or frontend config if needed.
- TypeScript is used throughout.
- Hot reload is NOT enabled.
- Linting is available via
bun run lint
in the frontend.
Enjoy clipping YouTube videos!
If you have any issues, please open an issue or PR.