SpotUrVibe

Inspiration

We were inspired by our love of music and social needs during this pandemic.

What it does

SpotUrVibe allows users to add up to three favourite artists to their profile. They may choose to use their own favourted artist to match with others, or they may search a separate artist to match with others who have the searched artist favourited. Users are able to link a recommended Spotify track or a playlist to their own profiles for others to view on the matching page.

How we built it

The front-end was built with HTML, CSS, and Bootstrap, while the back-end and database are managed by Firebase, Javascript and JQuery.

Challenges we ran into

We encountered challenges regarding the skillset of our team and implementing third party APIs. Due to the difficulty we had in incorporating various APIs, we had to abandon the idea and instead tried to code everything ourselves.

Accomplishments that we're proud of

We are proud of the work we put into making working features into our app and everybody's perseverance during the 24 hours.

What we learned

Our team learned a lot, in particular writing functions to write and retrieve different data in Firebase.

What's next for SpotUrVibe

More features such as being able to match group movies and games instead of just song artists, and other social features such as news feeds.

Built With

Submitted to

nwHacks 2021

Created by

Similarly to Joshua, I contributed towards building the frontend of the site, mainly focused on the chat page. I also worked in planning and creating the messaging database in firebase and authenticating users access to certain messages.

Bryce Daynard
Similarly to the rest of the team, I contributed to building both the frontend and backend. However, my main focus was the search page and adding functions to connect the search page with the matching page.

Angela Qi
I contributed to everything just like my team mates. My largest contributions were developing the front end for the sign up/sign in page and the matching page. I also helped with building the messaging function and pushing information to Firebase.

Lawrence Liang
Like everyone else, I did a bit of everything. HTML with Bootstrap, CSS, and Javascript. My largest contribution was probably adding an authentication process and pulling values from the Firebase database.

Joshua Krauchi