Youtube clone
15h 41m 20s
English
Paid
Course description
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 real services such as Instagram, KakaoTalk, YouTube, Uber, etc. Are you still studying difficult theories? Even before I even start, my motivation to study would disappear!? There is no way to study as fast and effective as learning while making a real-world service with your own hands. Come to the practical programming world!
Read more about the course
Features to implement and concepts to learn
Finally, we will develop a full stack that runs the entire cycle including front + back + distribution.
- This is a fully reproduced YouTube clone coding. Users can view videos, upload videos, record their own videos, comment on each other's videos, and search videos.
- YouTube backend clones: MongoDB, NodeJS, ES6, AWS, Heroku
- YouTube frontend clone: 100% Vanilla JS! SaSS, ES6, WebPack, Pug
As a result, after this class...
- Finally, we will develop a full stack that runs the entire cycle including front + back + distribution.
- JavaScript developer! Overall JS technology is upgraded.
- See the finished look: https://polar-sea-27980.herokuapp.com/
Watch Online
Watch Online Youtube clone
0:00
/ #1: #0.1 What are we building
All Course Lessons (99)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | #0.1 What are we building Demo | 02:12 | |
| 2 | #0.2 The State of Fullstack | 05:52 | |
| 3 | #0.3 Websites vs Webapps | 04:45 | |
| 4 | #1.0 What is NodeJS | 03:18 | |
| 5 | #1.1 Use Cases for NodeJS | 08:38 | |
| 6 | #1.2 Who Uses NodeJS | 03:22 | |
| 7 | #1.3 Installing NodeJS | 02:45 | |
| 8 | #2.0 What is a Server | 02:59 | |
| 9 | #2.1 What is Express | 03:33 | |
| 10 | #2.2 Installing Express with NPM | 11:20 | |
| 11 | #2.3 Your First Express Server | 11:14 | |
| 12 | #2.4 Handling Routes with Express | 09:58 | |
| 13 | #2.5 ES6 on NodeJS using Babel | 10:40 | |
| 14 | #2.6 Express Core: Middlewares | 09:38 | |
| 15 | #2.7 Express Core: Middlewares part Two | 09:23 | |
| 16 | #2.8 Express Core: Routing | 11:23 | |
| 17 | #2.9 MVC Pattern part One | 08:03 | |
| 18 | #2.10 MVC Pattern part Two | 11:10 | |
| 19 | #2.11 MVC Pattern part Three | 08:38 | |
| 20 | #2.12 Recap | 04:24 | |
| 21 | #2.13 Installing Pug | 06:37 | |
| 22 | #2.14 Layouts with Pug | 09:37 | |
| 23 | #2.15 Partials with Pug | 09:13 | |
| 24 | #2.16 Local Variables in Pug | 09:04 | |
| 25 | #2.17 Template Variables in Pug | 04:40 | |
| 26 | #2.18 Search Controller | 10:43 | |
| 27 | #2.19 Join : Log In HTML | 11:18 | |
| 28 | #2.20 Change Profile HTML | 06:56 | |
| 29 | #2.21 Home Controller | 11:02 | |
| 30 | #2.22 Home Controller part Two | 10:55 | |
| 31 | #2.23 Join Controller | 12:09 | |
| 32 | #2.24 Log In and User Profile Controller | 10:28 | |
| 33 | #2.25 More Controlers | 10:34 | |
| 34 | #3.0 MongoDB and Mongoose | 06:33 | |
| 35 | #3.1 Connecting to MongoDB | 09:17 | |
| 36 | #3.2 Configuring Dot Env | 03:15 | |
| 37 | #3.3 Video Model | 07:18 | |
| 38 | #3.4 Comment Model | 07:50 | |
| 39 | #3.5 Home Controller Finished | 09:26 | |
| 40 | #3.6 Uploading and Creating a Video | 13:52 | |
| 41 | #3.7 Uploading and Creating a Video part Two | 08:51 | |
| 42 | #3.8 Getting Video by ID | 11:54 | |
| 43 | #3.9 Editing a Video | 14:31 | |
| 44 | #3.10 Deleting a Video | 06:56 | |
| 45 | #3.11 Installing ESLint | 14:17 | |
| 46 | #3.12 Searching Videos | 11:51 | |
| 47 | #4.0 Introduction to Webpack | 09:33 | |
| 48 | #4.1 Styles with Webpack part One | 10:31 | |
| 49 | #4.2 Styles with Webpack part Two | 11:48 | |
| 50 | #4.3 ES6 with Webpack | 10:33 | |
| 51 | #5.0 SCSS and Making the Header | 11:14 | |
| 52 | #5.1 Footer and Login / Join | 09:00 | |
| 53 | #5.2 Everything else! | 14:25 | |
| 54 | #6.0 Introduction to PassportJS | 05:04 | |
| 55 | #6.1 Local Authentication with Passport part One | 11:17 | |
| 56 | #6.2 Local Authentication with Passport part Two | 09:59 | |
| 57 | #6.3 Loggin the User In | 10:25 | |
| 58 | #6.4 Sessions on Express | 11:22 | |
| 59 | #6.5 MongoStore and Middlewares | 10:38 | |
| 60 | #6.6 Github Log In part One | 08:24 | |
| 61 | #6.7 Github Log In part Two | 13:46 | |
| 62 | #6.8 Github Log In part Three | 08:44 | |
| 63 | #6.9 Recap and User Profile | 12:34 | |
| 64 | #6.10 User Detail + Facebook Login Part One | 13:08 | |
| 65 | #6.11 Facebook Login Part Two | 13:48 | |
| 66 | #6.12 Facebook Log In part Three | 08:46 | |
| 67 | #7.0 User Profile | 08:24 | |
| 68 | #7.1 Edit User Password | 10:41 | |
| 69 | #7.2 Change Password | 10:23 | |
| 70 | #7.3 Adding Creator to Video | 10:23 | |
| 71 | #7.4 Protecting Video Routes | 08:25 | |
| 72 | #8.0 Starting the Video Player | 12:27 | |
| 73 | #8.1 Play Pause Functionallity | 11:52 | |
| 74 | #8.2 Mute Unmute | 08:22 | |
| 75 | #8.3 Enter Fullscreen Exit Fullscreen | 11:44 | |
| 76 | #8.4 Total Time and Current Time | 12:33 | |
| 77 | #8.5 Volume Bar part One | 09:26 | |
| 78 | #8.6 Volume Bar part Two | 09:51 | |
| 79 | #9.0 Getting User Media | 13:32 | |
| 80 | #9.1 Recording Video part One | 09:54 | |
| 81 | #9.2 Recording video part Two | 13:03 | |
| 82 | #10.0 API Registering a View part One | 12:25 | |
| 83 | #10.1 API Registering a View part Two | 08:39 | |
| 84 | #10.2 API Adding a Comment part One | 09:05 | |
| 85 | #10.3 API Adding a Comment part Two | 09:37 | |
| 86 | #10.4 API Adding a Comment part Three | 09:21 | |
| 87 | #10.5 Conclusions | 03:29 | |
| 88 | #11.0 Introduction to AWS S3 | 09:17 | |
| 89 | #11.1 Multer Uploads to AWS S3 | 13:28 | |
| 90 | #11.2 Blob Duration Bug | 06:43 | |
| 91 | #11.3 Migrating the DB to MongoLab | 06:24 | |
| 92 | #11.3.1 MongoLab is Dead Update | 08:00 | |
| 93 | #11.4 Building for Production | 13:01 | |
| 94 | #11.5 Deploying to Heroku part One | 10:44 | |
| 95 | #11.6 Deploying to Heroku part Two | 05:36 | |
| 96 | #11.7 Flash Messages part One | 09:51 | |
| 97 | #11.8 Flash Messages part Two | 13:02 | |
| 98 | #11.10 Intro to Prisma part One | 09:54 | |
| 99 | #11.11 Intro to Prisma part Two | 14:23 |
Unlock unlimited learning
Get instant access to all 98 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionComments
0 commentsWant to join the conversation?
Sign in to commentSimilar courses
Make a Spotify Clone from Scratch: 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 music streaming site just like Spotify? If so, you’re in the right place! This course w...
14 hours 59 minutes 31 seconds
Scalable TDD & Testing
Sources: Logic Room
The course "Scalable TDD and Testing" will help JavaScript UI engineers master an approach to scalable testing that is not dependent on a specific framework.
2 hours 56 minutes 56 seconds
MERN Stack Front To Back: Full Stack React, Redux & Node.js.
Sources: udemy, Brad Traversy
Welcome to "MERN Stack Front To Back". In this course we will build an in depth full stack social network application using Node.js, Express, React, Redux and MongoDB along with...
11 hours 52 minutes 29 seconds
100 Days Of Code: The Complete Web Development Bootcamp 2024
Sources: Academind Pro
Learn web development from A to Z in 100 days (or at your own pace) - from "basic" to "advanced", it's all included!
78 hours 51 minutes 55 seconds