Create a Spotify clone with Spring boot 3, Angular 17, Bootstrap 5, PostgreSQL (2024)
In this video, we dive into creating a Spotify clone using Spring Boot 3 for the backend, Angular 17 for the frontend, Bootstrap 5 for the design, PostgreSQL for the database, and Auth0 for authentication. Whether you're a beginner or experienced, this step-by-step guide will provide you with the knowledge and skills needed to build a robust and modern full-stack application.
Key Features:
🔐 Secured with Auth0 (OAuth2)
🎶➕ Music Upload
🎧 Audio Streaming
🔍 Search Function
❤️ User Favorites
📱💻 Responsive UI with Bootstrap
🅰️ Latest Angular features: Signal, Standalone component, New Control flow syntax
Source code Frontend (Angular):
https://github.com/C0de-cake/spotify-...
Source code Backend (Spring Boot):
https://github.com/C0de-cake/spotify-...
Each commit corresponds to a chapter.
Chapters:
00:00 Introduction
00:54 Creating the frontend project
15:58 Creating the backend project
39:00 Configuring Auth0 (Backend)
57:09 Configuring Auth0 (Frontend)
01:16:39 Adding music (Frontend)
01:44:31 Adding music (Backend)
01:57:48 Displaying music (Backend)
01:59:54 Displaying music (Frontend)
02:14:39 Displaying music library (Frontend)
02:19:34 Music player (Backend)
02:22:15 Music player (Frontend)
02:53:54 Music search (Backend)
02:56:53 Music search (Frontend)
03:10:06 Managing favorites (Backend)
03:23:28 Managing favorites (Frontend)
03:39:06 Conclusion
Resources:
Link to the Spring Boot starter (backend):
https://start.spring.io/#!type=maven-...
Useful Files:
Bootstrap configuration:
https://github.com/C0de-cake/spotify-...
DB Schema (liquibase):
https://github.com/C0de-cake/spotify-...
https://github.com/C0de-cake/spotify-...
application.yml (Spring Boot configuration):
https://github.com/C0de-cake/spotify-...
Frontend State object:
https://github.com/C0de-cake/spotify-...
Backend State object:
https://github.com/C0de-cake/spotify-...
On this page of the site you can watch the video online Create a Spotify clone with Spring boot 3, Angular 17, Bootstrap 5, PostgreSQL (2024) with a duration of hours minute second in good quality, which was uploaded by the user Cyril from CodeCake 16 March 2024, share the link with friends and acquaintances, this video has already been watched 18,205 times on youtube and it was liked by 384 viewers. Enjoy your viewing!
