Remote Audio Player

A full-stack application for managing and playing audio files remotely with real-time synchronization between users.

Tech Stack

• Backend: NestJS, TypeScript, Socket.IO for WebSockets
• Frontend: React, TypeScript, Socket.IO client

Features

Backend

• Media file management with metadata extraction
• Audio file playback
• YouTube download via yt-dl
• WebSocket communication for real-time updates
• Frontend hosting

Frontend

• Real-time synchronization between users
• Media library tree view with metadata display
• File/folder organization and tagging
• Search functionality
• Playlist management with drag-and-drop reordering
• Playback control options (looping, sequential playback, etc.)
• File upload and YouTube download interface

Prerequisites

• Node.js (v14 or later)
• npm (v6 or later)
• YouTube-DL (for YouTube downloads)

Setup

Quick Start

# Install dependencies for both backend and frontend
npm install

# Start both backend and frontend in development mode
npm start

Manual Setup

Backend

# Install dependencies
cd backend
npm install

# Start in development mode
npm run start:dev

Frontend

# Install dependencies
cd frontend
npm install

# Start in development mode
npm start

The application will be available at http://localhost:3000

Project Structure

remote-audio-player/
├── backend/               # NestJS backend
│   ├── src/
│   │   ├── media/         # Media file management
│   │   ├── playlist/      # Playlist management
│   │   ├── download/      # YouTube download
│   │   ├── websocket/     # WebSocket communication
│   │   └── app.module.ts  # Main application module
├── frontend/              # React frontend
│   ├── src/
│   │   ├── components/    # React components
│   │   ├── context/       # React context providers
│   │   ├── services/      # API and WebSocket services
│   │   ├── types/         # TypeScript interfaces
│   │   └── App.tsx        # Main React component
└── media/                 # Media files storage directory

Usage

1. Start the application using npm start
2. Access the web interface at http://localhost:3000
3. Upload audio files or provide YouTube URLs for download
4. Create playlists and organize your media library
5. Enjoy synchronized playback across multiple devices