SpotiEvent

• 

  Home Page

Inspiration

In a world where sounds and rhythms are a major factor in our day-to-day lives, from the birds chirping in the morning to the sounds of a beat putting a spring in our step, music is a part of our lives that can sway us both emotionally and mentally. For us, being able to find music that enhances our daily routines and discover related events to share our passions was what brought SpotiEvent to life, similar to what music does for us. So, what better way to find music in a song drought than to code a software to do it ourselves?

What it does

SpotiEvent gathers user data from Spotify and displays their top artists, suggested artists, and events according to their favorite genre(s).

How we built it

We built the backend using Express and Node.js, implementing the Spotify API to retrieve user data and TicketMaster Discovery API to gather event data based on the Spotify user data received. Our frontend was built using React and ChakraUI.

Challenges we ran into

By far the most challenging was setting up Spotify authentication with it being a major contributor to slowing down our development. Moreover, with some of us having never coded in JavaScript before, half of the team had extreme difficulty with implementing methods and differentiating the different syntaxes of the languages we were familiar with. Learning a programming language is difficult on its own; however, when combined with the time limitations and the scale of the project, it became an even more arduous task. Learning JavaScript whilst attempting to do difficult API requests at our level became a major challenge as newcomers.

Accomplishments that we're proud of

Despite being beginners when it comes to hackathons, and some beginners when it comes to the implemented programming languages, we are proud to have been able to work together to complete SpotiEvent. This was a learning experience for every one of us, and regardless of the numerous roadblocks we had, such as using fetch and implementing the backend with front end, we pulled through as a team, putting countless ideas together to solve each issue.

What we learned

Learning as a team, we found out how to make fetch API requests to multiple API's, including Spotify and Ticketmaster's Discovery API. With this, another major lesson was the importance of variable scoping, especially after solving an issue with infinite appends after every refresh. In terms of software and languages, this was the first time most of us had ever touched REACT, Node JS, VSCode Liveshare, Chakra UI, and more. Each and every one of these was a new learning process where we learned the basics of what they are and how to use them to implement SpotiEvent.

What's next for SpotiEvent

We aim to build a more responsive UI design as we didn't really have the time due to troubles with the Spotify API. Once that is set up, we then aim to incorporate something like Google Maps API to display to users the concerts near them.

Built With

• chakraui
• express.js
• node.js
• react