Skip to content

boxplayer/breakbeat-radio

Repository files navigation

BREAKBEAT RADIO

Welcome to BREAKBEAT RADIO, a retro-themed music player that brings you a curated selection of breakbeat tracks. Immerse yourself in the music with dynamic visual backgrounds and seamless playback control.

Features

  • Curated Music Selection: Enjoy a handpicked list of breakbeat tracks.
  • Dynamic Backgrounds: Cycle through a collection of retro and cyberpunk-themed GIFs.
  • Keyboard Controls: Manage playback, volume, and visuals directly from your keyboard.
  • Seamless Playback: Music continues to play as you navigate and interact with the app.
  • Responsive Design: Enjoy the experience on both desktop and mobile devices.

Tech Stack

  • Next.js - React framework for server-rendered applications.
  • React - JavaScript library for building user interfaces.
  • Tailwind CSS - Utility-first CSS framework for rapid UI development.
  • TypeScript - Typed superset of JavaScript.
  • React Player - A versatile media player for React.
  • React Icons - A collection of popular icon libraries.

Getting Started

To get a local copy up and running, follow these simple steps.

Prerequisites

  • Node.js (v18.x or later)
  • npm or yarn

Installation

  1. Clone the repo
    git clone https://github.com/your_username/breakbeat-radio.git
  2. Install NPM packages
    npm install

Running the Application

To start the development server, run:

npm run dev

Open http://localhost:3003 to view it in the browser.

Keyboard Controls

Key Action
Space Play/Pause
ArrowUp Volume Up
ArrowDown Volume Down
ArrowLeft Previous Track
ArrowRight Next Track
R Random Track
G Cycle Background GIF
H Toggle Help Panel

About

Breakbeat Radio

Topics

Resources

Stars

Watchers

Forks