Skip to content

🎵Full Stack Spotify Clone🎧 crafted with Next.js, React, Tailwind CSS, and PostgreSQL. with users powered by Supabase auth and GitHub O-auth. (Deployed by Vercel pipeline)

Notifications You must be signed in to change notification settings

KrinsKumar/stream-music

Repository files navigation

Full Stack Spotify Clone with Next.js, React, Tailwind, Supabase, and PostgreSQL

🎵 Welcome to the Full Stack Spotify Clone! 🎧

Welcome to an in-depth exploration of our Full Stack Spotify Clone project. Developed using a blend of Next.js, React, Tailwind CSS, Supabase, and PostgreSQL, this project is a testament to the potential of modern web technologies.

Home page of the clone

Front End Dynamics 🖌️

Using the power of Next.js 13.4 and React, the user interface strikes a balance between aesthetics and functionality, drawing inspiration from the sleek design principles that Spotify embodies. Powered by the flexibility of Tailwind CSS, the UI seamlessly adapts to diverse devices and screen sizes.

Backend Foundation 🏢

Driving the data management aspect of this project is Supabase, an open-source alternative to Firebase, built atop the solid foundation of PostgreSQL. This dynamic duo equips us with robust tools to manage database operations efficiently, ensuring data integrity and real-time responsiveness.

Key Features in Focus 🌟

  • Song upload Song upload modal
  • Supabase and PostgreSQL Database handling
  • Tailwind design for sleek UI
  • Tailwind animations and transition effects
  • Full responsiveness for all devices
  • Credential authentication with Supabase
  • Github authentication integration Alt text
  • File and image upload using Supabase storage
  • Client form validation and handling using react-hook-form
  • Server error handling with react-toast
  • Play song audio
  • Favorites system
  • Playlists / Liked songs system
  • Advanced Player component
  • How to fetch data in server React components by directly accessing the database
  • Handling relations between Server and Child components in a real-time environment

About

🎵Full Stack Spotify Clone🎧 crafted with Next.js, React, Tailwind CSS, and PostgreSQL. with users powered by Supabase auth and GitHub O-auth. (Deployed by Vercel pipeline)

Topics

Resources

Stars

Watchers

Forks