README
next-video
Next video is a react component for adding video to your next.js application. It extends both the <video> element and your Next app with features for automatic video optimization.
- Smart storage: Store large video files outside of your git repo
- Auto optimized: Optimize video files and deliver via CDN for better playback performance and quality
- Customizable UI: Choose from themes or build your own player controls
- Posters & Previews: Zero-config placeholder images and timeline hover thumbnails
- Wider compatibility: Use videos that aren’t supported natively by all browsers
- Analytics built-in (optional): See how often videos get watched and track video performance
- AI-powered: Add auto-generated captions to your videos and use transcripts
import Video from 'next-video';
import getStarted from '/videos/get-started.mp4';
export default function Page() {
return <Video src={getStarted} />;
}
Setup
Automatic Setup
In the root of your Next.js project, run: