Matchify

Discover new friends with shared music tastes, explore exciting events, and connect with a vibrant community. Matchify uses music data from Spotify to connect users, recommend events, and facilitate messaging and social interactions.
Frontend Repository · Matchify Early Version · View Demo · Request Feature · Bug Report

Project Description

Key Features

Spotify User Login

Users start with a Welcome Screen introducing Matchify's features, then proceed to Sign Up by entering personal details. Next, they connect their Spotify account to personalize recommendations. Users complete their profile by adding location, a profile picture, and a bio. Finally, they receive confirmation of their account creation and are directed to the main Feed.

Home Page

A personalized feed with tailored music recommendations, friend activity, and shared playlists. Discover nearby music events and stay updated on what your friends are listening to and doing.

Profile

View/edit your profile with favorite songs, playlists, and music tastes. Share Spotify stats and feature your "Matchify playlist" for others to explore and get recommendations.

Events Page

Manage friend requests and view friend lists. Explore "Matchify Suggestions" to find and connect with recommended friends based on your music preferences.

Messaging

Stay connected with friends through group and individual chats. Share music, playlists, and event details directly in conversations, and enjoy seamless communication within the app.

Built With

Installation

This is how to set up the project locally. To get a local copy running, follow the steps below.

Prerequisites

• Node.js - For any Node.js project
• npm - For installing dependencies
• PostgreSQL - For database

Instructions

1. Clone the Repository
   Open your terminal and run the following command:

   git clone https://github.com/Sam-Wonjae-Lee/Matchify-Frontend.git

2. Navigate into project directory
   Make sure to be in the project folder that has been cloned.

3. Install dependencies with npm

   npm install

4. Create database using the database_schema.sql file
   This should contain the SQL commands to create the necessary tables to create the database locally

5. Run the project
   The project frontend needs to run as well. More information can be found here.

   npm run start

Credits

Contributors

Andy Ren (1172097) - Developer
Calvin Liew (Calvin-Liew) - UI/UX Designer
Dmitrii Vlasov (Endlesssuply) - Developer
Frank Peng (Graves451) - Developer
Richard Chen (Riixardo) - Developer
Wonjae (Samuel) Lee (Sam-Wonjae-Lee) - Developer

Contact

For more questions or information about the project, please consult:
Wonjae (Samuel) Lee - wonjaesamuel.lee@mail.utoronto.ca