Sporify Clone - A music streaming platform

1. ⚙️ Tech Stack
2. 🤸 Quick Start
3. 🕸️ Config Files
4. 🚀 More

⚙️ Tech Stack

• React 18
• Redux
• Node
• Exprss
• MongoDB
• TailwindCSS
• Cloudinary

🤸 Quick Start

Follow these steps to set up the project locally on your machine.

Cloning the Repository

git clone https://github.com/SubhamSaha9/Spotify-Clone-FullStack.git
cd Spotify-Clone-FullStack

Installation

Install the project dependencies for both client and server directory separately using npm:

npm install
#or
npm i

Set Up Environment Variables

Create a new file named .env in the client of your project as well as in the server directory and add the following content:

• client

REACT_APP_BASE_URL = "http://localhost:8080/api/v1"

• server

MONGO_URL=""
CLOUD_NAME=""
CLOUD_API_KEY=
CLOUD_API_SECRET=""
FOLDER_NAME=""

Replace the values with your actual credentials from MongoDB, Cloudinary and others.

Running the Project

• server

node index.js

• client

npm run dev

Open http://localhost:5173 in your browser to visit the page.

🕸️ Config File

index.css

@tailwind base;
@tailwind components;
@tailwind utilities;

::-webkit-scrollbar {
  display: none;
}

.spinner {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: radial-gradient(farthest-side, #238c41 94%, #0000) top/9px 9px no-repeat,
    conic-gradient(#0000 30%, #238c41);
  -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 9px), #000 0);
  animation: spinner-c7wet2 1s infinite linear;
}

@keyframes spinner-c7wet2 {
  100% {
    transform: rotate(1turn);
  }
}

Make sure all file names remain same.

🚀 More

For more such projects visit my Github page.