Overview
Vibe Check is an award-winning MERN stack web application that utilizes Spotify's web API to create a match story between two users. A match story is an Instagram like 'story' that displays musical matches and recommendations between the Spotify users, resulting in a final match percentage.
From the team
It has been a few months since the Beach Hacks 7.0 Vibe Check demo. Since then we have been under extensive development to create a polished, customizable, and user-friendly experience. After months of careful refinement, Vibe Check's alpha version is now available with even more features and an even better user interface. Please take the time to share with friends! If there is any features you'd like to see in a future update, personally reach out to either me (Justin) or Alexis.
Table of Contents
Features:
- User search functionality
- Vibe_ID customizability
- Invite a friend functionality
- Share screenshot functionality
- Preview song functionality
How to Use:
Start by clicking “Get Started” and Authorize your Spotify Account to give Vibe Check access to your top artists and top songs.
After authorizing, Vibe Check will automatically create a profile with your Spotify Data. Your Vibe Check profile is simply a Vibe_ID and a collection of all your top songs and top artists!
This is Vibe Check’s home page!
Here you can find your ID. This is customizable. Click on the edit icon to bring up our edit id module.
Let’s check our compatibility with our friend!
You can look for your friend’s username or Vibe_ID by typing it into the search bar!
Once you find it simply click on it to view each other’s match story!
Once you arrive at your match story, simply click the arrow buttons to navigate through it.
Do note:
- that Liz and my match story will be different depending on who made the request!
- A user will only show in the search results if they have used the app
If your friend hasn’t used Vibe Check before, send them a request by:
clicking Invite → copying the link → and sending it to a friend.
This link will automatically start the comparison between you and the user you invited once they click it.
Once you are done viewing your match story share it with friends by either downloading or click the share button and picking your social media!
Once you are done, click on your profile picture in the top right and either Logout or Delete your account.
If you delete your account, no other user will be able to check their compatibility with you.
Technologies:
- JavaScript
- HTML
- CSS
- MongoDB
- Express.js
- React.js
- Node.js
- Mongoose
- Spotify Web API
Future Updates:
- [ ] Improve User Interface
- [ ] More user customizability
- [ ] Implement TypeScript for stability
Developers
Justin Fisher
Backend Developer, Project Manager
Alexis Martin
Full Stack Developer, UI/UX
Top comments (0)