Make a Spotify Clone from Scratch: JavaScript PHP and MySQL

Name: Make a Spotify Clone from Scratch: JavaScript PHP and MySQL
Price: 9 USD
Availability: InStock

14h 59m 31s

English

Paid

April 25, 2024

Course description

Do you want to become an expert in JavaScript, PHP and MySQL? Do you want to build a real music streaming site just like Spotify? If so, you’re in the right place! This course will guide you step by step in creating your own Spotify clone COMPLETELY from scratch. We’re talking the kind of website that will amaze anybody that sees it. The kind of website that will get you hired in no time!

Watch Online

Watch Online Make a Spotify Clone from Scratch: JavaScript PHP and MySQL

0:00

#1: Setting up your local server

All Course Lessons (168)

#	Lesson Title	Duration
1	Setting up your local server Demo	08:34
2	Creating the login form	09:29
3	Creating the register form	04:54
4	Intro to PHP - Handling form submission	04:11
5	Form sanitation - Cleaning the input	10:58
6	Separating our code	04:41
7	Preparing our validation functions	03:40
8	Creating the Account class	07:20
9	Validating the username	06:52
10	Validating the name and emails	04:45
11	Validating the passwords	03:58
12	Checking if the sign up was successful	03:08
13	Outputting error messages	08:59
14	Creating our Constants class	08:59
15	Remembering form values	05:49
16	Creating the users table	04:59
17	Connecting to our database from PHP	04:47
18	Inserting user details	09:11
19	Testing out the sign up process!	03:33
20	Query not working? Watch this video	04:36
21	Last remaining validation checks	04:45
22	Login handler	06:08
23	Sessions	05:35
24	Adding a background image	06:56
25	Styling the login container	08:34
26	Styling our text boxes	06:55
27	Input placeholder color	03:22
28	Styling the submit buttons	03:57
29	Buttons to switch between forms	03:25
30	Showing and hiding the forms on press	07:56
31	Showing only the relevant form when data is submitted	06:57
32	Show/hide button - mouse pointer	01:16
33	Right section content	04:31
34	Applying style to the right section content	05:11
35	56,800+ icons FOR FREE - Icons8	08:17
36	Styling the error messages	02:47
37	Remembering the username after failed log in attempt	01:10
38	Quick overview of the index page	01:18
39	Now playing bar container	05:19
40	Creating the now playing bar element	03:53
41	Left, center and middle sections of the bar	05:00
42	All the icons for our site	02:31
43	Adding our player buttons	10:32
44	Making the play and pause buttons larger	02:33
45	Progress bar parent elements	04:56
46	The progress bar	05:59
47	Album artwork	05:24
48	Track info labels	06:58
49	Volume bar	05:36
50	Page containers	03:37
51	Creating our navigation bar container	02:56
52	Navigation bar site logo	05:34
53	Navigation items	05:38
54	Navigation search icon	06:12
55	Navigation links color change on hover	01:52
56	Overview of our MySQL table structure	05:57
57	Creating our database tables	05:13
58	Inserting data into the artists, genres and albums tables	06:14
59	Inserting data into the songs table + FREE music files	04:42
60	Shortcut to inserting data into the songs table	00:59
61	Organisational trick	03:55
62	Main view containers	06:23
63	Header and footer files	02:46
64	Getting albums from the database	05:21
65	Outputting the album artwork images	05:45
66	Styling the album artwork images	05:26
67	Styling the album title	02:59
68	Making the albums clickable links	04:39
69	Getting album id from url	05:23
70	Getting the artist of the album	03:17
71	Creating the Artist class	05:58
72	Creating the Album class	07:46
73	Album header section	05:00
74	Styling the header section	06:19
75	Displaying the number of songs in the album	04:37
76	Creating the Song class	07:29
77	Getting the songs on an album	06:57
78	Outputting the track count	05:59
79	Outputting the track name and artist name	02:44
80	Outputting the track duration	02:19
81	Styling the track list rows	03:44
82	Styling the track count	04:04
83	Track style finishing touches	05:45
84	Introduction to HTML5 Audio	07:40
85	Creating our initial playlist of 10 random songs	06:25
86	Including JQuery	01:59
87	Set track function setup	05:47
88	Set track function	04:58
89	Playing and pausing the song via buttons	06:41
90	Introduction to Ajax calls	05:57
91	Getting a song via ajax	07:21
92	Getting the artist via ajax	06:27
93	Getting the album via Ajax	04:37
94	Updating the plays count when a song is played	09:22
95	Displaying the time remaining label	03:38
96	Formatting the time remaining	05:43
97	Updating the progress bar as the song plays	07:12
98	Dragging the progress bar on click	11:46
99	Controlling the volume	04:06
100	Updating the volume progress bar	04:38
101	Preventing controls from highlighting on mouse drag	03:44
102	Skipping to the next song	05:53
103	Song repeat mode	02:59
104	Repeat button	03:58
105	Playing the next song when current song ends	01:43
106	Previous song button	04:08
107	Mute button	03:31
108	Shuffle button	03:27
109	Shuffle - Part 1	06:20
110	Shuffle - Part 2	10:23
111	Playing songs by clicking on the song's play button	08:43
112	Fixing the song's play button bug	04:29
113	UserLoggedIn JavaScript variable	02:19
114	Changing pages dynamically	07:51
115	Knowing if a page was loaded from ajax or not	09:07
116	Replacing all links with our dynamic links	07:59
117	Small play button bug	01:03
118	Changing the URL when we load a new page	02:33
119	Browse page	02:31
120	Artist info section	05:31
121	Styling the artist info section	04:34
122	Songs section	05:33
123	Albums section	03:30
124	Artist page play button	01:49
125	Now playing bar links	07:11
126	Creating our search input section	06:34
127	Styling the search input	04:28
128	Searching when the user stops typing	07:42
129	Searching for songs	06:56
130	Searching for artists	08:05
131	Styling the artists search results section	02:39
132	Fixing the artist name bug	02:53
133	Searching for albums	04:58
134	Invalidating the search timer	01:53
135	Creating our playlist MySql tables	02:38
136	Creating the playlist page	05:58
137	The createPlaylist function	07:05
138	Create playlist file	08:00
139	Creating the User class	06:43
140	Outputting the user's playlists	05:31
141	Creating the Playlist class	04:30
142	Playlist links	02:32
143	Styling the playlists	01:25
144	Creating the header section of the page	08:22
145	Displaying the playlist's songs	05:13
146	Delete playlist function	02:55
147	Delete playlist ajax	04:43
148	Creating the options menu	07:25
149	Showing the options menu	07:08
150	Hiding the options menu	04:51
151	Add to playlist dropdown menu	04:38
152	Populating the dropdown with playlists	04:13
153	Styling the dropdown menu	03:08
154	When the dropdown menu is changed	09:19
155	Saving songs to a playlist	13:19
156	Copying options menu to other pages	03:46
157	Remove song from playlist function	02:34
158	Removing song ajax code	05:54
159	Settings page setup	07:13
160	Logout button	05:22
161	Settings link on the navigation menu	05:10
162	User details forms	06:34
163	Styling the user details forms	05:52
164	Update email function	04:11
165	Update email ajax code	09:38
166	Update password function	03:34
167	Update password ajax code	12:10
168	You made it! Congratulations!	02:10

Unlock unlimited learning

Get instant access to all 167 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Similar courses

Advanced JavaScript

Sources: ui.dev (ex. Tyler McGinnis)

I'm not good at writing sales copy, just trust me that if you use JavaScript in any capacity, there's probably not another resource that will benefit you more than this. This co...

3 hours 5 minutes 51 seconds

Youtube clone

Sources: Nomad Coders

What is "clone coding"? Services that actually exist. Sweat. Sweat. Practical 100% educational method to learn while creating Clone coding is a way of learning while creating re...

15 hours 41 minutes 20 seconds

Make a Google search engine clone: JavaScript PHP and MySQL

Sources: udemy

Do you want to become an expert in JavaScript, PHP and MySQL?Do you want to build a real search engine just like Google? If so, you’re in the right place!

5 hours 47 minutes 11 seconds

Writing Readable PHP

Sources: spatie.be

Learn how to write code that’s a joy to read for you, your co-workers, and future self. View high-quality videos on both clean coding and static analysis.

2 hours 40 minutes 32 seconds

JavaScript Basics for Beginners

Sources: codewithmosh (Mosh Hamedani)

JavaScript is one of the most popular programming languages in the world. Companies like Walmart, Netflix, and PayPal run big internal applications around JavaS

6 hours 39 minutes 44 seconds