The Web Developer Bootcamp 2024

10 Hours of React just added. Become a Developer With ONE course - HTML, CSS, JavaScript, React, Node, MongoDB and More!

4.68 (270899 reviews)
Udemy
platform
English
language
Web Development
category
instructor
904,423
students
74 hours
content
Mar 2024
last update
$149.99
regular price

What you will learn

The ins and outs of HTML5, CSS3, and Modern JavaScript for 2021

Make REAL web applications using cutting-edge technologies

Create responsive, accessible, and beautiful layouts

Recognize and prevent common security exploits like SQL-Injection & XSS

Continue to learn and grow as a developer, long after the course ends

Create a blog application from scratch using Node, Express, and MongoDB.

Create a complicated yelp-like application from scratch

Deploy your applications and work with cloud databases

Create static HTML and CSS portfolio sites and landing pages

Think like a developer. Become an expert at Googling code questions!

Create complex HTML forms with validations

Implement full authentication from scratch!

Use CSS Frameworks including Bootstrap 5, Semantic UI, and Bulma

Implement responsive navbars on websites

Use JavaScript variables, conditionals, loops, functions, arrays, and objects

Write Javascript functions, and understand scope and higher order functions

Master the "weird" parts of JavaScript

Create full-stack web applications from scratch

Manipulate the DOM with vanilla JS

Write JavaScript based browser games

Use Postman to monitor and test APIs

Use NodeJS to write server-side JavaScript

Write complex web apps with multiple models and data associations

Write a REAL application using everything in the course

Use Express and MongoDB to create full-stack JS applications

Use common JS data structures like Arrays and Objects

Master the command line interface

Use NPM to install all sorts of useful packages

Understand the ins and outs of HTTP requests

Create your own Node modules

Make a beautiful, responsive photographer's portfolio page

Create a beautiful, responsive landing page for a startup

Implement user authentication

Create a beautiful animated todo list application

Create single page applications with AJAX

Description

Now with over 10 hours of React content.  Just updated on May 15th, 2023.

Massive new React "expansion pack" covers: React basics, JSX, props, state, Vite, MaterialUI, hooks, useEffect, React design patterns, and more.

Hi! Welcome to the brand new version of The Web Developer Bootcamp, Udemy's most popular web development course.  This course was just completely overhauled to prepare students for the 2023 job market, with over 60 hours of brand new content. This is the only course you need to learn web development. There are a lot of options for online developer training, but this course is without a doubt the most comprehensive and effective on the market.  Here's why:

  • This is the only Udemy course taught by a professional bootcamp instructor with a track record of success.

  • 92% of my in-person bootcamp students go on to get full-time developer jobs. Most of them are complete beginners when I start working with them.

  • The previous 2 bootcamp programs that I taught cost $14,000 and $21,000.  This course is just as comprehensive but with brand new content for a fraction of the price.

  • Everything I cover is up-to-date and relevant to 2022's developer job market. This course does not cut any corners. I just spent 8 months redoing this behemoth of a course!

  • We build 13+ projects, including a gigantic production application called YelpCamp. No other course walks you through the creation of such a substantial application.

  • The course is constantly updated with new content, projects, and modules.  Think of it as a subscription to a never-ending supply of developer training.

  • You get to meet my cats and chickens!

When you're learning to program you often have to sacrifice learning the exciting and current technologies in favor of the "beginner friendly" classes.  With this course, you get the best of both worlds.  This is a course designed for the complete beginner, yet it covers some of the most exciting and relevant topics in the industry.

Throughout the brand new version of the course we cover tons of tools and technologies including:

  • HTML5

  • CSS3

  • Flexbox

  • Responsive Design

  • JavaScript (all 2022 modern syntax, ES6, ES2018, etc.)

  • Asynchronous JavaScript - Promises, async/await, etc.

  • AJAX and single page apps

  • Bootstrap 4 and 5

  • ReactJS

  • SemanticUI

  • Bulma CSS Framework

  • DOM Manipulation

  • Unix(Command Line) Commands

  • NodeJS

  • NPM

  • ExpressJS

  • Templating

  • REST

  • SQL vs. NoSQL databases

  • MongoDB

  • Database Associations

  • Schema Design

  • Mongoose

  • Authentication From Scratch

  • Cookies & Sessions

  • Authorization

  • Common Security Issues - SQL Injection, XSS, etc.

  • Developer Best Practices

  • Deploying Apps

  • Cloud Databases

  • Image Upload and Storage

  • Maps and Geocoding

This course is also unique in the way that it is structured and presented. Many online courses are just a long series of "watch as I code" videos.  This course is different. I've incorporated everything I learned in my years of teaching to make this course not only more effective but more engaging. The course includes:

  • Lectures

  • Code-Alongs

  • Projects

  • Exercises

  • Research Assignments

  • Slides

  • Downloads

  • Readings

  • Too many pictures of my dog Rusty

If you have any questions, please don't hesitate to contact me.  I got into this industry because I love working with people and helping students learn.  Sign up today and see how fun, exciting, and rewarding web development can be!

Content

Introduction to this Course

A Note On Asking For Help
Additional FREE Content
Introducing Our TA
Join the Online Community
Why This Course?
Syllabus Download
Syllabus Walkthrough
Lecture Slides

Introduction to Front End Development

Unit Objectives
Note about Setting Up Front-End Developer Environment
Setting Up Front-End Developer Environment
Note about Introduction to the Web
Introduction to the Web
The Front End Holy Trinity

Introduction to HTML

Unit Objectives
HTML Basics
Note about Introduction to MDN
Introduction to MDN
HTML Boilerplate and Comments
Basic Tags
HTML Lists
HTML Lists Assignment
HTML Lists Assignment: SOLUTION
Divs and Spans
HTML Attributes
Recreate Webpage Assignment
Recreate Webpage Assignment: SOLUTION

Intermediate HTML

Unit Objectives
HTML Tables
Tables Pokemon Exercise
Tables Pokemon Exercise: SOLUTION
Introduction to Forms
Playing with Inputs
The Form Tag
Labels
Form Validations
Dropdowns and Radio Buttons
Form Exercise
Note about the Form Exercise solution
Form Exercise: SOLUTION

Introduction to CSS

Unit Objectives
CSS Basics
Our First Stylesheet
Note about CSS Colors and Background and Border (next 2 lectures)
CSS Colors
Background and Border
Note about Selectors Basics Todo List
Selectors Basics Todo List
Introduction to Chrome Inspector
More Advanced Selectors
Note about Specificity and the Cascade
Specificity and the Cascade
Note about Selectors Practice Exercise
Selectors Practice Exercise
Selectors Practice Exercise: SOLUTION

Intermediate CSS

Unit Objectives
Text and Fonts
More Text and Fonts
Note about Google Fonts
Using Google Fonts
Introduction to the Box Model
Creating a Tic Tac Toe Board
Creating a Tic Tac Toe Board: SOLUTION
Note about Image Gallery Code Along Pt. 1
Image Gallery Code Along Pt. 1
Note about changes to Google Fonts
Image Gallery Code Along Pt. 2
CSS Blog From Scratch Exercise Intro
CSS Blog From Scratch Exercise SOLUTION Pt. 1
CSS Blog From Scratch Exercise SOLUTION Pt. 2
CSS Blog From Scratch Exercise SOLUTION Pt. 3

Bootstrap

Unit Objectives
Note about Bootstrap versions
What is Bootstrap?
Adding Bootstrap to a Project
Forms and Inputs
Nav Bars
Note about The Grid System
The Grid System
Grid System Pt. 2
Note about Bootstrap Image Gallery Pt. 1
Bootstrap Image Gallery Pt. 1
Note about Font Awesome
Bootstrap Image Gallery Pt. 2
Creating a Startup Landing Page Code Along
Creating a Startup Landing Page Code Along Pt. 2
Note about making bootstrap responsive on mobile devices

Bootstrap 4!

A History of Bootstrap 4
The Bootstrap 4 Documentation
Changes from Bootstrap 3 to 4
Bootstrap 4 Code/Solutions Download
Getting Started With Bootstrap 4
Bootstrap 4 Colors and Backgrounds
Typography
New Fancy Spacing Utilities
Responsive Breakpoints
Bootstrap4 Navbars
The New Display Utility

Bootstrap 4: Flexbox and Layout

Bootstrap 4: Flexbox and Layout
Flexbox Utilities Part 2
Navs and Flexbox
The Bootstrap 4 Grid
PATTERN PROJECT Part 1
PATTERN PROJECT Part 2
The Grid + Flexbox
Museum of Candy Project Part 1
Note about Museum of Candy Project Part 2
Museum of Candy Project Part 2
Museum of Candy Project Part 3
Museum of Candy Project Part 4
Museum of Candy Project Part 5

Introduction to JavaScript

Unit Objectives
The JavaScript Console
Primitives
Primitives Exercises
Variables
Null and Undefined
Useful Built-In Methods
Writing JavaScript in a Separate File
JS Stalker Exercise
JS Stalker Exercise: SOLUTION
Age Calculator Exercise
Age Calculator Exercise: SOLUTION

Javascript Basics: Control Flow

Unit Objectives
Boolean Logic
Note about logical operators lecture
Logical Operators
Conditionals
Conditionals Exercise SOLUTION
Guessing Game Code Along
Note about Introduction to Loops lecture
Introduction to Loops
3 While Loop Exercises
While Loops Problem Set
While Loops Problem Set: SOLUTION
Annoy-O-Matic Code Along
Note about Intro to For Loops lecture
Intro to For Loops
For Loops Quick Exercises
Loops Problem Set
Loops Problem Set: SOLUTION

Javascript Basics: Functions

Unit Objectives
Introduction to Functions
Arguments
Note about Function Declaration vs. Function Expression
The Return Keyword
Functions Quiz
Functions Problem Set
Functions Problem Set: SOLUTION
Scope Code Along
Scope Quiz
Higher Order Functions Code Along

Javascript Basics: Arrays

Unit Objectives
Introduction to Arrays
Arrays Methods
Array Quiz
Note about Todo List Code Along
Todo List Code Along Part 1
Array Iteration
Quick Array Iteration Challenge
Note about Todo List Code Along Part 2
Todo List Code Along Part 2
Array Problem Set
Array Problem Set: SOLUTION
OPTIONAL: Building Our Own ForEach

Javascript Basics: Objects

Introduction to Objects
Comparing Objects and Arrays
Nested Objects and Arrays
Objects Quiz
Movie Database Exercise
Adding Methods to Objects
The Keyword This

DOM Manipulation

IMPORTANT NOTE, PLEASE READ!!!
Introduction to the DOM
Defining the DOM
Select and Manipulate
Note about UI changes in new versions of Chrome
Important Selector Methods
Selector Exercise
Note about next lecture (Manipulating Style):
Manipulating Style
Manipulating Text and Content
Manipulating Attributes
Note about changing the Google logo in next lecture
Playing With Google Code Along

Advanced DOM Manipulation

Introduction to Events
Note about Introduction to Events
Color Toggle Exercise
Score Keeper Project Part 1
Note about Score Keeper Project Part 2
Score Keeper Project Part 2
Other Types of Events: Todo List
Note regarding counting events exercise
Counting Events Exercise

Color Game Project

Notes regarding color game
Creating the Color Game Pt. 1
Creating the Color Game Pt. 2
Creating the Color Game Pt. 3
Creating the Color Game Pt. 4
Creating the Color Game Pt. 5
Creating the Color Game Pt. 6
Creating the Color Game Pt. 7
Color Game Project Part 8
Creating the Color Game Pt. 9

Intro to jQuery

What is jQuery?
Why Use jQuery?
Including jQuery
Note about jQuery
Selecting with jQuery
Selector Exercise
Text and HTML
Attr and Val
Manipulating Classes

Advanced jQuery

jQuery Events: Click
Note about typo in the next lecture
jQuery Events: Keypress
jQuery Events: On
jQuery Effects

Todo List Projects

Note About Todo List App Fade and Slide Animations
Intro to the Todo List App
Todo List: Folder Structure
Todo List: Basic HTML
Todo List: Marking Completion
Todo List: Deleting Todos
Note about next lecture (Creating Todos):
Todo List: Creating Todos
Todo List: Styling Pt. 1
Todo List: Styling Pt. 2
Note about Font Awesome 5 and Toggling the Form
Todo List: Toggling the Form

OPTIONAL Project: Patatap Clone

IMPORTANT NOTE, PLEASE READ!!!
Project Intro
Note about Paper.js Exercise
Paper.js Intro
Paper.js Exercise
Adding Keypress Events
Paper.js Animations
Note about next lecture (Howler.js)
Adding Howler.js
Patatap Clone Refactor

Backend Basics

Introduction to Backend
Note about Postman (HTTP in Depth)
HTTP in Depth
Backend Workflow Pt. 1
Backend Workflow Pt. 2
IMPORTANT!!! Please Read! Note about Cloud9 signup
Introduction to Cloud 9
Setting Up Cloud9

The Command Line

A NOTE ON SOLUTIONS!
Introduction to the Command Line
CD and LS
Touch and Mkdir
Removing Files and Folders
Command Line Exercise

Node JS

Introduction to Node
Using Node
Node Echo Exercise
Node Average Exercise
Introduction to NPM
Note about Installing NPM Packages
Installing NPM Packages
Note about NPM Faker Exercise
NPM Faker Exercise

Server Side Frameworks

Introduction to Express
Note about Our First Express App
Our First Express App
The Package.json
How to automate server restart
Route Params
Express Basics Exercise
Express Basics Exercise: SOLUTION

Intermediate Express

Note about Templates and EJS
Templates and EJS
EJS: Conditionals and Loops
Note about Serving Custom Assets
Serving Custom Assets
Post Requests Part 1
Post Requests Pt. 2

Working With API's

Intro to API's
JSON and XML
Making API Requests with Node
Note about Sunset Time API Example
Sunset Time API Example
Note about JSON Placeholder API Example
JSON Placeholder API Example
Note about Movie API lectures
Movie API App: Introduction
Movie API App: Results Route
Movie API App: Displaying Data
Movie API App: Adding Search

YelpCamp: Basics

YelpCamp: Initial Routes
Note about YelpCamp: Layout
YelpCamp: Layout
YelpCamp: Creating Campgrounds
Note about YelpCamp: Styling Campgrounds Lecture
YelpCamp: Styling Campgrounds
YelpCamp: Styling Nav and Forms

Databases

What is a Database?
Note about installing MongoDB
Installing MongoDB
Mongo Shell Basics
Notes about Mongoose
Introduction to Mongoose Pt. 1
Introduction to Mongoose Pt. 2

YelpCamp: Data Persistence

YelpCamp: Adding Mongoose
How to Avoid Potential Issues with Mongoose
YelpCamp: Campground Show Page Part 1
Yelp Camp: Campground Show Page Part 2

RESTful Routing

Intro to REST
RESTful Blog App: INDEX
Note about Blog App: Layout
Blog App: Layout
Note about RESTful Blog App: New and Create
RESTful Blog App: NEW and CREATE
Note about RESTful Blog App: SHOW
RESTful Blog App: SHOW
RESTful Blog App: EDIT AND UPDATE
RESTful Blog App: DESTROY
Note about RESTful Blog App: Final Touches
RESTful Blog App: Final Touches

Data Associations

Introduction to Associations
Embedded Data
Note About Object References
Object References
Module.exports

YelpCamp: Comments

YelpCamp: Refactoring App.js
Note about Seeding the Database
YelpCamp: Seeding the Database
Note about comment model lecture
YelpCamp: Comment Model
Note about Comments Lecture
YelpCamp: Creating Comments Pt. 1
YelpCamp: Creating Comments Pt. 2
YelpCamp: Styling Comments Pt 1
Note about YelpCamp: Styling Comments Pt 2
YelpCamp: Styling Comments Pt 2

Authentication

Note about authentication section
Introduction to Authentication
Secret Page Code Along Pt. 1
Secret Page Code Along Pt. 2
Secret Page Code Along Pt. 3
Secret Page Code Along Pt. 4
Secret Page Code Along Pt. 5

YelpCamp: Adding Authentication

YelpCamp: Adding Auth Pt. 1
YelpCamp: Adding Auth Pt. 2
YelpCamp: Adding Auth Pt. 3
YelpCamp: Adding Auth Pt. 4
YelpCamp: Adding Auth Pt. 5

YelpCamp: Cleaning Up

YelpCamp: Refactoring Routes
YelpCamp: User Associations: Comment
YelpCamp: User Associations: Campground

YelpCamp: Update and Destroy

Intro to New YelpCamp Features
Campground Edit and Update
Campground Destroy
Notes about Campground Destroy & Campground Authorization
Campground Authorization Part 1
Campground Authorization Part 2
Comment Edit and Update
Note about Comment Destroy lecture
Comment Destroy
Comment Authorization

YelpCamp: UI Improvements

Refactoring Middleware
Flash Messages: Installation
Note about Flash Messages
Flash Messages: Adding Bootstrap
Flash Messages: Helpful Errors
Note about error handling
Landing Page Refactor - Part One
Landing Page Refactor - Part Two
Dynamic Price Feature
Note about further YelpCamp improvements

Git and Github

Intro To Git
Git Init, Add, and Commit
Git Log and Checkout
Note about Git lectures

Deploying

Intro to Deploying and Heroku
Deploying a Simple App Part 1
Note about Heroku CLI
Deploying a Simple App Part 2
Deploying YelpCamp: Basics
Note about MongoLab
Deploying YelpCamp: MongoLab
Environment Variables

JavaScript: The Tricky Stuff

Keyword This 1 - Introduction and Global
Keyword This 2 - Global With Strict
Keyword This 3 - Implicit
Keyword This 4 - Call Apply Bind
Keyword This 5 - Fixing Our Issue With Call
Keyword This 6 - Apply
Note about Keyword This 7 - Bind
Keyword This 7 - Bind
Keyword This 8 - Bind Pt. 2
Keyword This 9 - New Keyword & Recap
OOP 1 - Introduction
OOP 2 - New Keyword
OOP 3 - Multiple Constructors
OOP 4 - Recap
OOP 5 - Prototypes
OOP 6 - Prototype Chain
OOP 7 - Exercise
OOP 8 - Solution and Recap
Closures

Screenshots

The Web Developer Bootcamp 2024 - Screenshot_01The Web Developer Bootcamp 2024 - Screenshot_02The Web Developer Bootcamp 2024 - Screenshot_03The Web Developer Bootcamp 2024 - Screenshot_04

Reviews

James
October 28, 2023
As someone who has been in the software industry for 25 years as a backend developer, web development has always been somewhat of a mystery. I decided this was something I wanted to formally work on and after going through a few YouTube tutorials I finally decided to take this course. The enrollment fee is the deal of a lifetime! I can't believe how much I've learned from this single class, I've had (many) college courses that provide less benefit. Colt is a natural teacher with a great sense of humor and I feel like I can instantly apply the lessons taught here in industry. Would recommend this class in a heartbeat (and will post / share it on LinkedIn once I finish).
Karthi
October 27, 2023
Aa i use laptop to watch the course a lot and practice it, we want a desktop application through all platforms like windows, linux and mac to dowload the video contents from the course which will be benefit to us.
Alberto
October 26, 2023
Good explanations, examples, and listed resources. Lectures are easy to understand and follow, but I'd highly suggest creating your own full application as you follow along
Tarryn
October 25, 2023
I would have loved the convenience of having to do my quizzes on my mobile instead of having to open my laptop to do them
Samuel
October 25, 2023
I've only started and while i was worried at first i have begun to absorb little by little. I have high hopes that this will help me become a web developer
Brownm15
October 23, 2023
I like how he went through all the emotions you will have taking this course and reassures you that it is normal to power through.
Matt
October 23, 2023
So far I really like it. Just came from the CS50 course. I really like the way they used the codespace and setup the assignments.
Maryam
October 23, 2023
This course includes all topics I needed to learn, it is helping me greatly to grasp easily many concepts I struggled to learn before. Besides it is very detailed and very well explained. Videos are easy to follow and fun, at least I never get bored. Many thanks to the instructor for making JavaScript easy and fun to learn!
Irakli
October 22, 2023
Yes I quite like this course the starting speech motivated me and i will do my best to suck up everything from this course
Riwan
October 22, 2023
Well explained most of the stuff . I feel like i can start applying to places like start up and work my way up
Eva
October 21, 2023
So far I like how the teacher is presenting this course. I have a feeling he has a good way of keeping us entertained and learn stuff at the same time
Tomáš
October 21, 2023
The way Colt explains things just fits with me, he takes time to think of methapors so the topic is easier to understand. Another thing he does very well is keeping up with the “mental state of the student”, he addresses the situations where he suspects the student could feel overhelmed or confused and that just makes me feel better and keeps me motivated. And he doesn’t forget to keep it funny!
Cervantes
October 21, 2023
Colt is an amazing teacher. He's full of enthusiasm in teaching and his explanations are clear. There are plenty of good exercises in the course. The course covers a lot of topics. With that said, some of the contents are outdated especially when it comes to using third party tools and packages.
Alex
October 20, 2023
Well presented, but the presention speed was so fast, give me difficult moment in chasing up with the lesson
Roel
October 20, 2023
I was able to learn a lot from this course. Seeing the apps take shape is a great way to learn. There is a lot of material to cover in this course but it is worth it. Having Colt's videos and the code you put together through out the course, is great to refer back to.

Coupons

DateDiscountStatus
6/29/202192% OFF
expired
9/13/202289% OFF
expired
2/21/202389% OFF
expired

Charts

Price

The Web Developer Bootcamp 2024 - Price chart

Rating

The Web Developer Bootcamp 2024 - Ratings chart

Enrollment distribution

The Web Developer Bootcamp 2024 - Distribution chart

Related Topics

625204
udemy ID
9/28/2015
course created date
5/14/2019
course indexed date
Bot
course submited by