Build a Netflix Clone: Full Stack Web Dev Tutorial (PHP, MySQL, JavaScript)

Veröffentlicht am: 19 April 2023
auf dem Kanal: ModeDev Academy

11,831

224

🍿 Learn Full Stack Development by building a Netflix Clone from scratch!

In this massive Full Course, we are going to build a fully functional video streaming service completely from the ground up. This isn't just a UI clone—we are building the backend, the database, and the interactive frontend.

Course Materials Part 01 : bit.ly/netflixpart01
Course Materials Part 02 : bit.ly/NetflixPart02

⭐⭐⭐⭐🕑 TIME STAMP 📋⭐⭐⭐⭐⭐
👉 Introduction
🕑 0:00:00 Introduction video
🕑 0:01:36 Installing Xampp - Mac/Linux
🕑 00:06:44 Installing Xampp Windows
🕑 0:12:20 Installing a text editor
🕑 00:14:53 Creating our index page

👉 Register/Login Page - Front-End
🕑 00:18:50 Creating the users table
🕑 00:25:26 Creating the register page
🕑 00:31:16 Styling our form column
🕑 00:38:27 Creating the input fields
🕑 00:44:31 Quick preview of handling the form submission
🕑 00:48:20 Styling the input fields
🕑 00:54:48 Creating the title section
🕑 01:04:21 Adding a site logo
🕑 01:10:16 Styling the login link
🕑 01:15:45 Creating the login page

👉 Register/Login Page - Back-End
🕑 01:17:45 Sanitising the user's first name
🕑 0:00:00 Form sanitizer class
🕑 0:00:00 Sanitation methods
🕑 0:00:00 Config file
🕑 0:00:00 Connecting to the database
🕑 0:00:00 Creating the Account class
🕑 0:00:00 Validating the first name
🕑 0:00:00 Displaying errors to the user
🕑 0:00:00 Using constants for our error messages
🕑 0:00:00 Validating the last name
🕑 0:00:00 Validating the username
🕑 0:00:00 Validating the email
🕑 0:00:00 Validating the passwords
🕑 0:00:00 Styling the error messages
🕑 0:00:00 Inserting the users details to the table
🕑 0:00:00 Let's try the insert query out!
🕑 0:00:00 How to debug MySQL queries
🕑 0:00:00 Writing the login function
🕑 0:00:00 Let's try the login function out!
🕑 0:00:00 Storing the session
🕑 0:00:00 Remembering the last entered values
🕑 0:00:00 Remembering the values entered on the register page

👉 Create the preview video
🕑 0:00:00 Setting up our tables
🕑 0:00:00 Adding sample video files and images
🕑 0:00:00 Explanation of the tables
🕑 0:00:00 Creating the preview provider class
🕑 0:00:00 Getting a random entity from the table
🕑 0:00:00 Creating the entity class
🕑 0:00:00 Entity 'getter' functions
🕑 0:00:00 Showing the preview video
🕑 0:00:00 Splitting code into a header file
🕑 0:00:00 Creating the preview overlay
🕑 0:00:00 Preview details element
🕑 0:00:00 Styling of the buttons
🕑 0:00:00 Font Awesome icons
🕑 0:00:00 Button hover state
🕑 0:00:00 Muting and unmuting the preview video
🕑 0:00:00 Changing the icon to mute/unmute
🕑 0:00:00 Showing the image when the preview has ended

👉 Display Movies and TV shows
🕑 0:00:00 Adding some style to the page background
🕑 0:00:00 Creating the category container class
🕑 0:00:00 Showing all categories
🕑 0:00:00 Creating the Entity provider class
🕑 0:00:00 Looping over each entity
🕑 0:00:00 Outputting the HTML for each entity
🕑 0:00:00 Styling of the entity previews
🕑 0:00:00 Styling of the category sections

👉 Creating the entity of the page
🕑 0:00:00 Creating the entity page
🕑 0:00:00 Error message class
🕑 0:00:00 Creating the season provider
🕑 0:00:00 Getting the seasons
🕑 0:00:00 Creating the video class
🕑 0:00:00 Creating the season class
🕑 0:00:00 Outputting the season numbers
🕑 0:00:00 Getting the video properties
🕑 0:00:00 Outputting the episodes
🕑 0:00:00 Styling the episodes
🕑 0:00:00 Showing 'you might also like' section

👉 Creating the "Watch" video page
🕑 0:00:00 Incrementing the video views
🕑 0:00:00 Displaying the video
🕑 0:00:00 Creating the back button
🕑 0:00:00 Back button functionality
🕑 0:00:00 Hiding the video controls after 2 seconds
🕑 0:00:00 Video progress table
🕑 0:00:00 Initialising the video
🕑 0:00:00 Making an Ajax call
🕑 0:00:00 Passing data in our Ajax call
🕑 0:00:00 Inserting the initial video progress into the table
🕑 0:00:00 Creating the video progress timer
🕑 0:00:00 Updating the video progress as the video plays
🕑 0:00:00 Marking the video as 'seen'
🕑 0:00:00 Resume playing where we left off

👉 The "Up next" overlay
🕑 0:00:00 Getting the 'up next' video
🕑 0:00:00 'Up next' video when there's no more episodes
🕑 0:00:00 'Up next' title
🕑 0:00:00 Displaying the season and episode number
🕑 0:00:00 The 'play next video' button
🕑 0:00:00 Styling the up next controls
🕑 0:00:00 Restart video button
🕑 0:00:00 Play button functionality
🕑 0:00:00 Showing the overlay when the video ends
🕑 0:00:00 Getting the entity ID for a video
🕑 0:00:00 Getting the next video for that entity
🕑 0:00:00 Hooking up the play button on the video preview
🕑 0:00:00 Subtitle of the video preview
🕑 0:00:00 Play button text
🕑 0:00:00 Displaying a check mark on 'seen' videos

👉 Navigation bar
🕑 0:00:00 Navigation bar HTML
🕑 0:00:00 Styling of the navigation bar
🕑 0:00:00 Changing the background colour on scroll
🕑 0:00:00 Hiding the navigation on the watch page

👉 TV Shows, Movies and category page
👉 Search page
👉 Account Page
👉 PayPal payment subscription integration

Auf dieser Seite können Sie das Online-Video Build a Netflix Clone: Full Stack Web Dev Tutorial (PHP, MySQL, JavaScript) mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer ModeDev Academy 19 April 2023 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 11,831 Mal angesehen und es wurde von 224 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!

54,509