In this video I show how to create a Spotify app clone using HTML, CSS and JavaScript. Although the app looks like Spotify, it has no real functionality. This is just a demonstration of how to create a basic layout and design for a music streaming app. Feel free to use it as a starting point for your own projects and add features as you wish. If you have any suggestions or ideas on how to improve this app, please leave a comment below or copy the code to Github. Thank you for watching!
I will wait for your pull requests on Github.
I hope you like!
Twitter: https://twitter.com/gulnaroglus
Source code: https://github.com/servetgulnaroglu/spotify-desktop-app
Live a star on github, if you like!
️ Keyboard: YUNZII KEYNOVO IF98 Gateron red switches
https://bit.ly/3hPGk3A
00:00 Initializing npm
00:26 Electron.js quickstart
01:17 Electron.js test
01:39 Creating a CSS file
02:08 Viewing images and SVG files
02:28 Coding the left bar with HTML
09:10 End of left menu
09:52 Coding left playlists
11:00 End of left playlists
11:19 Coding the left song cover
12:50 End of cover of left song
1:30 p.m. Coding the playlist header
10:20 p.m. Box shadow generator
27:15 End of playlist header
28h00 Coding songs from the playlist
30:58 Gradient background generator
43:20 End of playlist songs
44:03 Bottom player coding
54:30 End of bottom player
56:10 Running as a desktop application
56:43 Top bar hidden and window maximized
57:10 Final results and comparison
Please take the opportunity to connect and share this video with your friends and family if you find it useful.
No Comments