LoFi Beats - Pomodoro Timer and Music Player WebApp

Description

Marrakesh Beats is a full-stack web application designed to enhance productivity and relaxation. It combines a Pomodoro timer with a music player and task manager, creating a seamless experience for users to stay focused and entertained.

Features

1. Pomodoro Timer:

   • A 25-minute focus timer with options to:
     • Start the Pomodoro session.
     • Stop the timer.
     • Reset the timer.
     • Take a break.

2. Music Player:

   • Stream music with playback controls (play, pause, skip, repeat).
   • Display current playing song with metadata (title, artist, and album art).
   • Access a list of available tracks.

3. Task Manager:

   • Add and manage daily tasks.
   • Display a list of added tasks for better organization.

How to Use

1. Launch the Application:

   • Open the web application in your preferred browser.

2. Pomodoro Timer:

   • Use the timer controls (Start, Stop, Reset, Break) to manage your focus sessions.
   • The timer automatically starts with 25 minutes.

3. Music Player:

   • Select a song from the playlist to start playing.
   • Use the playback controls for navigating through the songs.
   • View the album art and details of the current track.

4. Task Manager:

   • Enter a task in the input field and click Add to include it in your task list.
   • View all added tasks on the right panel.

Screenshots

Pomodoro Timer

Task Manager

Music Play

Music Playlist

Technologies Used

• Frontend:
  • HTML, CSS, JavaScript
  • Bootstrap for responsive design
• Backend:
  • Node.js (if applicable for managing tasks or music playlist data)
  • Suitable JavaScript libraries for timer and music playback.

Knowledge Gained

Through this project, you can learn and apply:

• Web Development:

  • Creating interactive user interfaces with HTML, CSS, and JavaScript.
  • Integrating third-party libraries for enhanced functionality.

• Responsive Design:

  • Using Bootstrap for a mobile-friendly and responsive layout.

• State Management:

  • Managing tasks, timer states, and music player functionality.

• Event Handling:

  • Implementing button clicks and user interactions.

Contribution

Contributions are welcome! If you'd like to add more features or improve the design, feel free to fork the repository and submit a pull request.

TODOs

• Add persistent storage for tasks and playlists using a database.
• Integrate Spotify API for dynamic music streaming.
• Add notifications for Pomodoro session completion.
• Enhance the UI design for a more immersive experience.

---

Feel free to reach out if you have any questions or feedback!