Jonahjohnzon / CJ-Mixify

MIT License
0 stars 0 forks source link

Mini Spotify Project: “CJ-Mixify”

CJ-Mixify png 4

Introduction

Welcome to CJ-Mixify, a lightweight Spotify player that enhances your music experience! CJ-Mixify provides a minimalistic interface, beautiful visualizations, and seamless integration with the Spotify app.

Features

Authors

Linkedin Blog Posts :newspaper:

For a comprehensive understanding of CJ-Mixify, including insights into its tech stack and development process, we’ve authored an article on LinkedIn. You can access it through the following links; Unleashing Melody: The journey of CJ-Mixify 1

Installation

  1. Clone this repository:

git clone
https://github.com/Jonahjohnzon/CJ-Mixify.git
  1. Install dependencies:

    
    npm install or
    yarn install

3. ### Build the project:

**Front-End**
- Setting up our Environment:
   - We verify that node.js and npm are installed on our computer, and then proceed to create a React project using vite.
- Spotify Developer Account:
The session below was executed on CJ-Mixify;
   - Sign up for a Spotify developer account if you haven’t already.
- React + Vite Integration:
    - This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
      Currently, two official plugins are available:

    - [@vitejs/plugin-react uses](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) `Babel` for Fast Refresh.
    - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses `SWC` for Fast Refresh.
    - Talwind CSS for styling.

**Back-end**
- API Development with Node.js and Express:
  - We kickstarted our project by creating a Node.js application (using npm init) and incorporating Express (via npm install express) to handle HTTP requests and construct our API endpoints. Within this framework, we meticulously defined routes for user authentication, playlist retrieval, track searches, and user data management.

- Database Integration:
  - We opted for MongoDB as our database system to manage user profiles, playlists, and track details.

# `Usage`
1. To run CJ-Mixify locally you'll need:
   - yarn OR NPM
   - node.js
2. Enjoy your favorite Spotify tracks with a delightful visual twist!
![7](https://github.com/Jonahjohnzon/CJ-Mixify/assets/129039388/f3700b54-24a7-4aa8-a577-58f3c039000a)

# `Contributing`
<p> Discovered a bug? Have a feature idea? We wholeheartedly encourage contributions! Feel free to create an issue or submit a pull request. Connect with fellow contributors on our Discord server. And, if you find SpotiVibes useful, don’t forget to star ⭐️ the repository or fork it!</p>

# `Related Projects`
- [lofi](https://github.com/dvx/lofi): A tiny Spotify player with WebGL visualizations.
- Spotify-Clone: A Swift-based Spotify clone using UIKit and Spotify WebAPI.

# `Licence`
This project is licensed under the MIT License. See the LICENSE file for details.
![img](https://www.alxethiopia.com/wp-content/uploads/2023/01/7_Do-hard-things-100.jpg)
### NOTE 20-3-2024

We collaborated to develop CJ-Mixify for our final project at ALX SE-FOUNDATIONS. The master [branch](https://github.com/Jonahjohnzon/CJ-Mixify/tree/main/cj-mixify) showcases the work my partner and I deployed during our presentation.

--  Peace