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
Become a WordPress Developer: Unlocking Power With Code
Sources: udemy
Learn PHP, JavaScript, WordPress theming & the WP REST API to Create Custom & Interactive WordPress Websites. Unlock the full power of WordPress and go beyond "just a blog platf...
41 hours 45 minutes 55 seconds
The Complete Developers Guide to MongoDB
Sources: udemy, Stephen Grider
Master MongoDB and Mongoose design with a test-driven approach. MongoDB is the hottest database solution in the tech world right now, able to power anything from your growing pe...
13 hours 32 minutes 42 seconds
Fullstack Node.js: The Complete Guide to Building Production Apps with Node.js
Sources: fullstack.io
The Fullstack Node.js book is the complete guide to building fast, production-ready Node.js apps
Mastering Node.js Streams with Erick Wendel
Sources: Erick Wendel
Learn the Node.js' most powerful feature for processing data on-demand, the Node.js Streams.A practical guide for you to learn how to process large loads of dat
11 hours 39 minutes 5 seconds