MyPlaylist Front

screenshot of MyPlaylist Front
react
vite

A simple Node.js REST API for uploading and managing songs, complete with audio duration detection. Built for use in music streaming platforms, admin dashboards, and audio CMS solutions.

Overview

The Music Upload Frontend is a sleek and user-friendly interface tailored for uploading and managing songs, perfect for music streaming projects. Designed to be simple yet effective, it works harmoniously with a custom Node.js + Express backend, allowing users to focus more on their music and less on the technicalities.

This frontend is ideal for anyone looking to streamline their music upload process without sacrificing aesthetics or functionality. With its efficient design, it makes it easy to upload tracks and manage metadata, making it a fantastic choice for developers and music enthusiasts alike.

Features

  • Upload MP3/WAV audio files: Effortlessly handle audio uploads, ensuring compatibility with the most popular formats for music files.

  • Add song metadata: Input essential information such as title, artist, and cover image to enhance your audio files' presentation.

  • Shows audio duration: Automatically extracts and displays the duration of your audio files, providing essential information at a glance.

  • Seamless backend integration: Optimized to work flawlessly with the /uploads folder from the corresponding backend, making file management simple.

  • Clean UI for quick testing: The minimalistic interface is designed to facilitate rapid testing and demonstrations, perfect for both developers and testers.

  • Technologies Used: Built with HTML5, CSS3, and Vanilla JavaScript (Fetch API), with optional Bootstrap for customization, ensuring a modern web experience.

  • No build tools required: Just launch your browser and access the frontend without any complex setup, making it accessible for users of all skill levels.

  • MIT License: Freely available for use and personalization, allowing developers to customize it to fit their specific needs.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.