Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/exprays/spotify-clone

A full-stack Spotify clone using NextJS & React
https://github.com/exprays/spotify-clone

nextjs radix-ui react supabase supabase-auth tailwindcss zustand

Last synced: 21 days ago
JSON representation

A full-stack Spotify clone using NextJS & React

Awesome Lists containing this project

README

        

![spot-r](https://github.com/0rbitSoc/Spot/assets/133385746/58815aa6-eee7-4ff0-8972-b0c4880b5d0f)

This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).

Spot

A Full Stack Spotify clone to store and play your songs with ease! Its uses Supabase as authentication and postgreSQL database and next as server.

## Getting Started

First, run the development server:

```bash
npm run dev
# or
yarn dev
# or
pnpm dev
```

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.

This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.



🧐 Features

Here're some of the project's best features:

* Email & Social Authentication
* Song upload
* Playlist
* Song Player
* Favourites

🛠️ Installation Steps:

1. To develop it on your local pc clone this repo:

```
git clone https://github.com/0rbitSoc/spot.git
```

2. Install all dependencies:

```
npm install
```

3. Run the app:

```
npm run dev
```



💻 Built with

Technologies used in the project:

* Next.js
* React
* Tailwind CSS
* Typescript
* Supabase
* Zustand
* postgresSQL

🛡️ License:

This project is licensed under the MIT

## Learn More

To learn more about Next.js, take a look at the following resources:

- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.

You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!