The Complete Web Developer In 2022: Zero To Mastery (updated 10/2022)

The Complete Web Developer In 2022: Zero To Mastery
Last updated 10/2022
MP4 | Video: h264, 1280×720 | Audio: AAC, 44.1 KHz

Learn to code and become a Web Developer in 2022 with HTML, CSS, Javascript, React, Node.js, Machine Learning & more!

What you’ll learn
Skills that will allow you to apply for jobs like: Web Developer, Software Developer, Front End Developer, Javascript Developer, and Full Stack Developer
Learn modern technologies that are ACTUALLY being used behind tech companies in 2022
Build 10+ real world Web Development projects you can show off
Build a professional Portfolio Website
Learn best practices to write clean, performant, and bug free code
Master modern Web Development fundamentals as well as advanced topics
Work as a freelance Web Developer
Master beginner and advanced JavaScript topics
Learn React + Redux to build rich front end applications
Build your own full stack websites and applications
Build a complex image recognition app using everything we learn in the course
Become a professional Web Developer and get hired
Use NodeJS to write server-side JavaScript
Learn to implement user authentication
Use Express, SQL and PostgreSQL to create fullstack applications that scale
Master fundamental concepts in Web Development
Requirements
A computer (Windows/Mac/Linux). That’s it!
No previous coding experience is needed
All tools and software used in this course will be free
Prepare to learn real life skills and build real web apps that will get you hired!
Description
Taught by:

Overview

Section 1: Introduction

Lecture 1 Course Outline

Lecture 2 Join Our Online Classroom!

Lecture 3 Exercise: Meet Your Classmates and Instructor

Lecture 4 Join Our Open Source Projects!

Section 2: How The Internet Works

Lecture 5 Browsing the Web

Lecture 6 Breaking Google

Lecture 7 Exercise: Break Google Yourself

Lecture 8 The Internet Backbone

Lecture 9 Traceroute

Lecture 10 Exercise: Running traceroute

Lecture 11 DEVELOPER FUNDAMENTALS: I

Lecture 12 What Does A Developer Do?

Lecture 14 Web Developer Monthly

Section 3: History Of The Web

Lecture 15 WWW vs Internet

Lecture 16 HTML, CSS, Javascript

Lecture 17 DEVELOPER FUNDAMENTALS: II

Lecture 18 Monthly Coding Challenges, Free Resources and Guides

Lecture 19 Developer History

Lecture 20 Exercise: Adding CSS and JavaScript to Tim’s website

Lecture 21 Optional Resource: More About the History of the Web

Section 4: HTML 5

Lecture 22 Build Your First Website

Lecture 23 Resources: Your Text Editor

Lecture 24 DEVELOPER FUNDAMENTALS: III

Lecture 25 Quick Note About w3schools

Lecture 26 How To Ask Questions

Lecture 27 HTML Tags

Lecture 28 HTML Tags 2

Lecture 29 Self Closing HTML Tags

Lecture 30 Anchor Tag

Lecture 31 Q&A: index.html

Lecture 32 Q&A: Relative vs Absolute Path

Section 5: Advanced HTML 5

Lecture 33 HTML Forms

Lecture 34 HTML Forms 2

Lecture 35 Submitting A Form

Lecture 36 HTML Tags 3

Lecture 37 HTML vs HTML 5

Lecture 38 Copy A Website

Lecture 39 HTML Challenge

Lecture 40 HTML Lesson Files

Lecture 41 Exercise: HTML Quiz

Lecture 42 Optional Exercise: More HTML

Section 6: CSS

Lecture 43 Exercise Files: Code-Along

Lecture 44 Your First CSS

Lecture 45 CSS Properties

Lecture 46 CSS Selectors

Lecture 47 Optional Exercise: CSS Selectors

Lecture 48 Text and Font

Lecture 49 Images In CSS

Lecture 50 Box Model

Lecture 51 px vs em vs rem

Lecture 52 Optional: PX, EM, REM, %, VW, and VH

Lecture 53 Exercise: CSS Quiz

Section 7: Advanced CSS

Lecture 54 Critical Render Path

Lecture 55 Exercise File: Code-Along Images

Lecture 56 Flexbox

Lecture 57 Optional Exercise: Flexbox Froggy

Lecture 58 CSS 3

Lecture 59 Optional Exercise: Mastering Transitions and Transforms

Lecture 60 Responsive UI

Lecture 61 Image Gallery Files

Lecture 62 Exercise: Robot Animation

Lecture 64 Solution: Robot Animation

Lecture 65 Optional Exercise: CSS

Lecture 66 Evolving Technology

Lecture 67 Bootstrap Introduction

Lecture 68 Bootstrap

Lecture 69 Bootstrap 5 Update

Lecture 70 Exercise: Changing Versions

Lecture 71 Bootstrap Grid

Lecture 72 Free Resources For Our Project

Lecture 76 Quick Note: The hr tag

Lecture 79 Quick Note: Mailchimp

Lecture 80 Exercise: Adding Email Subscribe Form With MailChimp

Lecture 81 Quick Note: Upcoming Videos

Lecture 82 Exercise: Putting Your Website Online

Lecture 83 Exercise: Putting Your Website Online 2

Lecture 84 Quick Note: Upcoming Video

Lecture 85 DEVELOPER FUNDAMENTALS: IV

Lecture 86 Using Templates

Lecture 87 Resources for FREE Templates

Section 9: CSS Grid + CSS Layout

Lecture 89 Section Overview

Lecture 90 CSS Grid vs Flexbox vs Bootstrap

Lecture 91 Quick Note: grid-gap to gap

Lecture 92 CSS Grid 1

Lecture 93 CSS Grid 2

Lecture 94 CSS Grid 3

Lecture 95 CSS Grid 4

Lecture 96 CSS Grid 5

Lecture 97 Optional Exercise: CSS Grid

Lecture 98 Exercise: CSS Layout

Lecture 99 Solution: Navigation Bar

Lecture 100 Solution: Navigation Bar 2

Lecture 101 Solution: Cover

Lecture 102 Solution: Project Grid + Footer

Lecture 103 Quick Note: Upcoming Video

Lecture 104 Solution: Prettify

Lecture 105 Resources: CSS Guide

Lecture 106 The Truth About CSS

Section 10: Career Of A Web Developer

Lecture 107 Career Of A Web Developer

Lecture 108 2023 Updated Statistics

Lecture 109 Web Developer Roadmap

Lecture 110 Quick Note: Upcoming Video

Lecture 111 What If I Don’t Have Enough Experience?

Lecture 112 Endorsements On LinkedIN

Lecture 113 New: DEVELOPER FUNDAMENTALS

Lecture 114 Learning Guideline

Section 11: Javascript

Lecture 115 Introduction To Javascript

Lecture 116 What Is Javascript?

Lecture 117 Your First Javascript

Lecture 118 Exercise: Number, String, Boolean, Comparisons

Lecture 121 Exercise: Make A Calculator

Lecture 122 Control Flow

Lecture 123 Exercise: Make A Keyless Car

Lecture 124 Javascript On Our Webpage

Lecture 125 Functions

Lecture 126 Exercise: Make A Keyless Car Even Better

Lecture 127 Data Structures: Arrays

Lecture 128 Exercise: Arrays

Lecture 129 Data Structures: Objects

Lecture 130 Exercise: Objects And Arrays For Facebook App

Lecture 131 Exercise: Build Facebook

Lecture 132 Javascript Terminology

Lecture 133 Loops

Lecture 134 Exercise: Build Facebook 2

Lecture 135 Javascript Keywords

Lecture 136 Section Outline Document

Section 12: DOM Manipulation

Lecture 137 Document Object Model

Lecture 138 DOM Selectors

Lecture 139 Exercise: DOM Selectors

Lecture 140 DOM Events

Lecture 141 Note: Callback Functions

Lecture 142 Exercise: DOM Events

Lecture 143 Solution: DOM Events

Lecture 144 Exercise: Background Generator

Lecture 145 Background Generator Files

Lecture 146 jQuery

Lecture 147 DEVELOPER FUNDAMENTALS: V

Section 13: Advanced Javascript

Lecture 148 Scope

Lecture 149 Exercise: Scope

Lecture 150 Advanced Control Flow

Lecture 151 Exercise: Advanced Control Flow

Lecture 152 ES5 and ES6

Lecture 153 Exercise: ES5 and ES6

Lecture 154 Advanced Functions

Lecture 155 Exercise: Advanced Functions

Lecture 156 Advanced Arrays

Lecture 157 Exercise: Advanced Arrays

Lecture 158 Advanced Objects

Lecture 159 Quick Note: Upcoming Videos

Lecture 160 Pass By Value vs Pass By Reference

Lecture 161 Type Coercion

Lecture 162 Exercise: Advanced Objects

Lecture 163 ES7 (ES2016)

Lecture 164 Exercise: ES7

Lecture 165 ES8 (ES2017)

Lecture 166 Exercise: ES8

Lecture 167 Note: ES9 + ES8 Async Await

Lecture 168 ES10 (ES2019)

Lecture 169 Exercise: ES10

Lecture 170 Advanced Loops

Lecture 171 Exercise: Advanced Loops

Lecture 175 Exercise: ES2020

Lecture 176 ES2021

Lecture 177 ES2022

Lecture 178 Debugging

Lecture 179 How Javascript Works

Lecture 180 Modules

Lecture 181 More Modules To Come

Lecture 182 Exercise: Imposter Syndrome

Lecture 183 Extra Javascript Practice

Lecture 184 Optional Exercise: Javascript Logic

Section 14: Command Line

Lecture 185 For WINDOWS Users ONLY
Lecture 186 Quick Note: For Windows Users
Lecture 187 Using The Terminal

Lecture 188 Exercise: Practice Using The Terminal

Section 15: Developer Environment

Lecture 189 Sublime Text

Lecture 190 Resources: Customizing Sublime Text

Lecture 191 VS Code

Lecture 192 Resources: Customizing VS Code

Lecture 193 Terminal

Lecture 194 Resources: Customizing Terminal

Lecture 195 For Windows: Customizing Git Bash
Section 16: Git + Github + Open Source Projects

Lecture 196 Installing Git

Lecture 198 Github Update: Master -> Main

Lecture 200 My Terminal Setup

Lecture 201 Contributing To Open Source

Lecture 202 Contributing To Open Source 2

Lecture 203 Exercise: Contribute To Our Open Source

Lecture 204 Keeping Your Fork Up To Date

Lecture 205 Portfolio Website for Recruiters

Lecture 206 Student Generated Top Resources

Section 17: A Day In The Life Of A Developer

Lecture 207 A Typical Day

Lecture 208 Exercise: Helping A Developer

Lecture 209 A Developer’s Morning Routine

Section 18: NPM + NPM Scripts

Lecture 210 Introduction To NPM

Lecture 211 Setting Up NPM and package.json

Lecture 212 Update: Latest Node.js and NPM

Lecture 213 Troubleshoot: Installing NPM and Node.js

Lecture 214 Installing And Using Packages

Lecture 215 Why Update Packages?

Lecture 216 Quick Note About Packages

Lecture 217 Exercise: Create A Portfolio

Section 19: React.js, React Hooks, Redux (Hooks and Redux videos moved to end of course!)

Lecture 218 Introduction To React.js

Lecture 219 Create React App

Lecture 220 React App Folder Structure

Lecture 221 React 18 Update

Lecture 222 React Fundamentals

Lecture 223 React Fundamentals 2

Lecture 224 Class vs Functional App.js

Lecture 225 Hooks vs Classes

Lecture 226 Quick Note: Service Worker File

Lecture 227 Your First React Component

Lecture 228 Building A React App 1

Lecture 229 React.Fragment and Semantic HTML

Lecture 230 Exercise: Learn to Read the Docs

Lecture 231 Building A React App 2

Lecture 232 Building A React App 3

Lecture 233 Styling Your React App

Lecture 234 Quick Note: JSON Placeholder

Lecture 235 Building A React App 4

Lecture 236 Building A React App 5

Lecture 237 Building A React App 6

Lecture 238 Project Files

Lecture 239 Keeping Your Projects Up To Date

Lecture 240 Exercise: React 18

Lecture 241 Solution: Try Upgrading to React 18

Lecture 242 React Review

Lecture 243 Error Boundary In React

Lecture 244 Deploying Our React App

Lecture 245 React Hooks + Redux (Saved For End Of The Course)

Lecture 246 HTTP/HTTPS

Lecture 247 JSON

Lecture 248 JSON vs Form Data

Lecture 249 AJAX

Lecture 250 Quick Note: Upcoming Video

Lecture 251 Promises

Lecture 252 Exercise: Promises

Lecture 253 ES8 – Async Await

Lecture 254 Exercise: ES8 – Async Await

Lecture 255 ES9 (ES2018)

Lecture 256 ES9 (ES2018) – Async

Lecture 257 ES2020: allSettled()

Lecture 258 ES2021: any()

Lecture 259 Reviewing ES6, ES7, ES8, ES9, ES10, ES11 Features

Section 21: Backend Introduction

Lecture 260 Backend Basics

Section 22: APIs

Lecture 261 Getting Ready For This Section

Lecture 262 Introduction to APIs

Lecture 263 Exercise: Web App APIs

Lecture 264 Optional Exercise: Speech Recognition

Lecture 265 Resources: Public APIs

Section 23: Leveling Up: The Power of Problem Solving

Lecture 266 Snapshot Model of Learning

Lecture 267 LTL: Deliberate Practice

Lecture 268 Exercise: Deliberate Practice

Lecture 269 What We Are Building

Lecture 270 DEVELOPER FUNDAMENTALS: Maintain Your Codebase

Lecture 272 Building Our Components

Lecture 273 Create React App v5 Changes

Lecture 275 Exercise: Reading the Docs

Lecture 276 Image Recognition API

Lecture 277 Clarifai API Updates, Models and Troubleshooting

Lecture 278 Resource: Clarifai API Docs

Lecture 279 Face Detection Box

Lecture 280 Sign In Form And Routing

Lecture 281 Project Files: Github

Section 25: Node.js + Express.js

Lecture 282 Introduction To Node.js

Lecture 283 fetch() in Node

Lecture 284 Latest Version of Node.js

Lecture 285 For Windows Users
Lecture 286 Running script.js In Node

Lecture 287 ES2020: globalThis

Lecture 288 Modules In Node

Lecture 289 ES6 Modules??

Lecture 290 ES6 Modules In Node

Lecture 291 ES2022: Top Level Await

Lecture 292 Exercise: ES2022 Top Level Await

Lecture 293 ES2022: Await Import

Lecture 294 Types of Modules

Lecture 295 Building a Server

Lecture 296 Introduction to Express.js

Lecture 297 Express Middleware

Lecture 298 Express Version Update

Lecture 299 Postman

Lecture 300 Quick Note: req.header

Lecture 301 RESTful APIs

Lecture 302 Node File System Module

Lecture 303 Exercise: Santa’s Node Helper

Lecture 304 Exercise Resources: Santa’s Node Helper

Lecture 305 Solution: Santa’s Node Helper

Lecture 306 Setting Up Our Server

Lecture 307 /signin and /register

Lecture 308 /profile/:id and /image

Lecture 309 Quick Note: Bcrypt

Lecture 310 Storing User Passwords

Lecture 311 Resource: Storing User Passwords Securely

Lecture 312 Connecting To Our Front-End

Lecture 313 Resource: CORS

Lecture 314 Registering Users

Lecture 315 Exercise: Load User Feature

Lecture 316 User Profile Update

Lecture 317 Project Files: Github

Section 27: Databases

Lecture 318 Introduction To Databases

Lecture 319 Installing PostgreSQL

Lecture 320 For Windows Users
Lecture 321 Resources: Installing PostgreSQL

Lecture 322 SQL: Create Table

Lecture 323 SQL: Insert Into + Select

Lecture 324 SQL: Alter Table + Update

Lecture 325 SQL: Conditional Selections

Lecture 326 SQL: Functions

Lecture 329 SQL: Delete From + Drop Table

Lecture 330 Exercises: SQL Commands

Lecture 331 Setting Up Your Database

Lecture 332 Connecting To The Database

Lecture 333 Troubleshooting: Connecting Knex

Lecture 336 Getting User Profiles

Lecture 337 Quick Note: Knex.js Breaking Changes

Lecture 338 Updating Entries

Lecture 339 Quick Note: Knex.js Breaking Changes 2

Lecture 340 Sign In

Lecture 342 Putting It All Together

Lecture 343 Optional: Using gRPC API

Lecture 344 What’s Next?

Section 29: Production + Deployment

Lecture 345 Deploying Our Files

Lecture 346 Code Review

Lecture 347 Quick Note: Clarifai API

Lecture 348 Security Review

Lecture 349 Quick Note: Cleaning Up

Lecture 351 Exercise: Deploying To Production

Lecture 352 Deploying On Heroku

Lecture 353 Quick Note: Troubleshooting Next Video

Lecture 356 Npm Serve

Lecture 358 Project Files: Github

Section 30: Where To Go From Here?

Lecture 359 Thank You!

Lecture 360 Become an Alumni

Lecture 361 Resource: Interviewing

Lecture 362 My Advice On Interviewing

Lecture 363 My Advice On Getting Hired

Lecture 364 My Advice On Resume/Portfolio/LinkedIn

Lecture 365 My Advice On Being a Junior Developer

Lecture 366 My Advice On How To Become A Senior Developer

Section 31: Extra Bits

Lecture 368 Ask Me Anything – 1,000 Students

Lecture 369 AMA – 100,000 Students!!

Lecture 370 Coding Challenges

Section 32: Extra Learning: React Hooks

Lecture 371 React Hooks

Lecture 372 React Hooks 2

Lecture 373 React Hooks 3

Lecture 374 React Hooks 4

Lecture 375 React Hooks 5

Lecture 376 React Hooks 6

Lecture 377 React Hooks 7

Lecture 378 React Hooks 8

Lecture 379 Project Files – Hooks

Lecture 380 React Hooks 9

Section 33: Optional Extra Learning: Redux

Lecture 381 Quick Note About Redux

Lecture 382 State management

Lecture 383 Why Redux?

Lecture 384 Installing Redux

Lecture 385 Redux Toolkit

Lecture 386 Redux Actions and Reducers
Lecture 387 Redux Store and Provider

Lecture 388 Redux connect()

Lecture 389 Redux Middleware

Lecture 390 Redux Async Actions
Lecture 391 Redux Project Structures

Lecture 392 Popular Tools For React + Redux

Lecture 393 Project Files – Redux

Section 34: Extra: For Windows Users
Lecture 394 Introduction From Wolfgang

Lecture 395 Git for Windows
Lecture 396 Install NodeJS for Windows
Lecture 397 Install PostgreSQL for Windows
Lecture 398 Using PSQL and PGADMIN

Section 35: BONUS SECTION

Lecture 399 Special Bonus Lecture