egaving / gigdown

gigDown

Deployment Link

Vercel Deployment Link

Set Up Instructions:

• Git clone down this repo in terminal
• Run npm install
• Run npm start
• Will run in localhost:3000
• clone down the Server repo here
• Run npm install
• Run nodemon server.js
• Should receive a message in terminal gigDown Server is running on http://localhost:3001

Abstract

DJ's face challenges in efficiently managing their music collections on usbs drives while preparing for gigs, particularly in organizing new tracks and ensuring they have necessary music downloaded for their performances. GigDown is here to help! This application is to rectify helping DJ's ranging from all types from novice to veteran to organize their music library and have a checklist for tracks needed for future gigs.

Contributors

Gavin Garcia Ricky Tran

Wins/Challenges

• Challenge - Making this application responsive across all devices as styling for each component was a feat to overcome.
• Win - Having a working application I as the creator can use and so many of my fellow DJ's who face this problem.
• Challenge - The developement time frame for sure was a challenge as I still want to finetune this application to be its most refined.
• Win - Fully loving the styling and usage of this application.
• Challenge - Getting Deployment with fetch requests configured (continuation needed)

Future Additions

• More robust styling with responsive design.
• Feature to cross check Usb Library with Download Checklist for track presence.
• Album artwork upload ability within form.
• Getting Deployment with fetch requests configured (continuation needed)

Application Screenshot

gigdown's Issues

As a user, I want to see if my USB Library has available tracks on it, if not display a message indicating no tracks on USB

As a user, I want to be able to view detailed information about each song in my USB library, such as the title, artist, and duration.

Be deployed using Vercel, Heroku, Surge, or any other similar service

As a user, I want to be able to mark songs on my checklist as downloaded once I have them on my USB drive.

ReadMe for both Repos (gigDown, gigDown-Server)

• How to install
  -Overview of project and goals
  -Overview of technologies used, challenges, wins, and any other reflections
  -Screenshots/gifs of your app
  -List of contributors

Update server data with correct song details and album artwork

PropTypes has been implemented in all components with props

Cypress Testing for display, search, GET, POST, DELETE

As a user, I want to be able to access my checklist and USB library from any device, so that I can manage my music collection on the go.

As a user, I want to be able to view my checklist and see which songs I still need to download for my gig.

As a user, I want to be able to add songs to my checklist, including the title, artist, and any other relevant information.

As a user, I want to be able to switch from the USB homepage to my checklist and see I'm at the correct domain

Application properly uses a catch block for network request error handling (if the server is down or if a fetch call fails) and displays helpful information to the user.

As a user, I want to be able to delete a track off my checklist, so I can handle mistakes and clean up my list

As a user, I want to be able to create a checklist for my upcoming gigs so that I can keep track of the songs I need to download.

React Component: Create Homepage/Tracklist Component

As a user, I want to be able to view my list of songs on my USB library.

React Component: Create Checklist and Checklist Form Component

Create Figma Wireframe for gigDown

Figma link here

Application shows loading state

As a user, I want to be able to search for specific songs in my USB library to quickly find them.

As a user, if I navigate to a page that doesn't exist I am routed to a 'Page Not Found' message.