🎬 React Video Player - vdo-player

A fully customizable, mobile-friendly React video player inspired by YouTube. Supports custom controls, playback speed, quality selection, fullscreen, and picture-in-picture. Built with React, Tailwind CSS, and Lucide Icons.

📦 Package: vdo-player

🚀 Features

• ✅ Play/Pause, Volume, Mute, Seek
• ⚡ Skip forward/backward
• 🎛 Speed and Quality dropdowns
• 📺 Fullscreen + Picture-in-Picture (PiP)
• 🎯 Tailwind CSS styling
• 💠 Lucide Icons (lightweight + modern)
• 📱 Mobile responsive design

📦 Installation

npm install vdo-player

or 
yarn add vdo-player

🧩 Usage

import { VideoPlayer } from "vdo-player";

function App() {
  return (
    <div className="p-4">
      <VideoPlayer src="https://www.example.com/video.mp4" />
    </div>
  );
}

📱 Mobile Friendly

Automatically scales down icons on small screens.

• Touch events supported (tap to show/hide controls).

• Custom slider styling for mobile.

🛠 Development

Clone the repo and run:

npm install
npm run dev 

To build the package:

npm run build

License

MIT © Raja Naveed

Links

• 📦 NPM Package
• 📦 Github Repo

Powered By

• React
• Vite
• Tailwind CSS

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Let me know if you'd like:

• GitHub Actions for automated builds
• Badges (e.g., version, downloads)
• A live demo via CodeSandbox or Vercel

Happy publishing! 🚀