Melody Flow is a React music player application that allows users to add songs, create playlists, and play their favorite tracks. The application is styled using Tailwind CSS and includes various features such as responsive design, playlist management, and song categorization.
- Responsive Design: Adjusts to different screen sizes with dynamic truncate length for song names.
- Playlist Management: Create and manage multiple playlists.
- Song Categorization: Organize songs into Library, Liked Songs, and Playlists.
- Player Controls: Play, pause, and navigate through songs.
Visit the MelodyFlow Deployment to see it in action!
-
Clone the repository:
git clone https://github.com/thecrusader25225/melody-flow.git
-
Navigate to the project directory:
cd melody-flow -
Install the dependencies:
npm install
-
Install Tailwind CSS:
npm install -D tailwindcss
-
Install React Icons:
npm install react-icons
-
Start the development server:
npm start
-
Open your browser and navigate to:
http://localhost:3000
- Add songs by clicking the "Add songs" button and selecting audio files.
- Create playlists by clicking the add icon in the Playlists section.
- Click on songs in the Library to play them or add them to a playlist.
- Navigate between Liked Songs, and Playlists using the navigation menu.
We welcome contributions to Melody Flow Music App! If you'd like to contribute, please fork the repository and use a feature branch. Pull requests are warmly welcome.
-
Fork the repository
-
Create your feature branch:
git checkout -b feature/YourFeature
-
Commit your changes:
git commit -m 'Add some feature' -
Push to the branch:
git push origin feature/YourFeature
-
Create a new Pull Request
This project is licensed under the MIT License. See the LICENSE file for details.
For any inquiries, suggestions, or issues, please contact thecrusader.25225@gmail.com or open an issue on GitHub.
Thank you for using Melody Flow! I hope you liked it!