JavaScript Master Class for 2025 with HTML and CSS

Name: JavaScript Master Class for 2025 with HTML and CSS
Rating: 4.7 (206 reviews)

Modern JavaScript from the beginning - learn fast with concise lecture, 15+ projects, & 40+ quizzes, HTML & CSS included

Created byIsaiah Harrison

Last updated 2/2025

English

What you'll learn

Build 15 real-world projects in JavaScript to prove to employers that you're ready for a job
Complete 50+ code challenges and quizzes to test your knowledge and reinforce concepts (solutions included)
Animate with JavaScript and CSS to make games and more captivating user interfaces
Learn how to pull data from online databases using APIs and Restful web services to display data to users of your application.
Pass your interview by understanding JavaScript core fundamentals: numbers, strings, variables, if/else, functions, arrays, objects, loops, etc.
Create well structured application by incorporating the object oriented programming (OOP) methodology: inheritance, encapsulation, polymorphism, abstraction
Code like a pro with modern JavaScript syntax: ES6+, arrow functions, destructuring, spread operator, etc.
Manipulating web pages (the DOM) with JavaScript in order to create dynamic user experiences
Make writing programs easier by learning to debug with the Google Chrome Developer Tools
And so much more!

Course content

22 sections • 208 lectures • 12h 10m total length

Introduction2:42
Software Setup: Visual Studio Code0:28
Navigate to https://code.visualstudio.com/ to download software

HTML introduction0:40
Quick description of the role HTML plays.
Check your understanding: HTML introduction
Writing HTML tags2:04
Setting up coding environment and tag structure.
Check your understanding: Writing tags
My Code Is Not Updating!0:21
Saving File
Parent Child relationship2:27
Using HTML div tags, parent-child relationships, best practice writing child tags
Check your understanding: Parent Child relationship
Paragraph tags1:31
Writing paragraph tags, inserting dummy text with Lorem ipsum, best practice with writing paragraph tags, opening the HTML file in the browser.
Check your understanding: Paragraph tags
My Tags Are NOT Autocompleting0:06
Check your understanding: Autocomplete
Download Chrome1:35
Downloading the Chrome browser and opening HTML file
span tags, img tags, and anchor tags6:37
span tag, img tag, self-closing tags, attributes, adding image to HTML file, archor tag, adding link to website
Check your understanding: span, img, anchor
The DOM and CSS3:56
HTML boilerplate and the DOM. Linking CSS to HTML with the link tag
My HTML Boilerplate is NOT Autocompleting0:07
Check your understanding: The DOM and CSS
Writing CSS5:43
Writing CSS to style HTML, tag selectors, CSS rules
Check your understanding: Writing CSS
Ids and Classes4:30
Selecting by id's and classes
Check your understanding: Ids and Classes
Box Model9:03
The box model, margin, padding, content, and border.
Check your understanding: Box Model
Conclusion0:45

Setting up JavaScript file3:53
Linking JavaScript and CSS files to the HTML
Check you understanding: Setting up JavaScript file
Comments2:55
Writing Single-line and Multi-line comments
Check your understanding: Comment syntax
Strings3:48
Learning about string and tradeoffs with writing single vs double quote strings.
Practice By Doing0:05
Check your understanding: Strings
Var, Let, and Const3:26
Variable syntax and the types of variables available for use.
Check your understanding: Variables
Practice By Doing0:09
Scope3:00
Scope of variables and issues with using the var keyword and deeping deeper with the declaration of a variable.
Check your understanding: Scope
Console4:24
Logging to the Console in the dev tools
Check your understanding: Console
Logging Scope2:58
Using console.log to further explain scope by logging different variable types inside and outside of code blocks.
Check your understanding: Scope
Functions3:30
Writing functions and calling them to run code.
Check your understanding: Functions
Arrow Functions4:58
Function vs Arrow functions, and passing parameters, and setting default values
Check your understanding: Arrow Functions
Practice By Doing0:06
Debugging Part 13:27
How to add a debugger and debugging in the dev tools' Source tab
Check your understanding: Debugging
Debugging Part 23:50
More on debugging in the dev tools and using the dev tools debugging tag
Check your understanding: Debugging
Null and Undefined4:35
Empty values and the Boolean object
Check your understanding: Null and Undefined

JavaScript Tools Introduction1:01
Introduction to JavaScript tools
Dev Tools1:16
Docking the dev tools and changing to dark theme
Check your understanding: Dev Tools
String Length2:21
The length property on the String Object
Check your understanding: Length
Practice By Doing0:05
Uppercase and Lowercase1:56
The toUpperCase and toLowerCase methods on the String Object
Check your understanding: Uppercase and Lowercase
Practice By Doing0:07
Trim String2:48
The trim method on the String Object
Check your understanding: Trim
Chaining1:49
Chaining String methods and properties.
Check your understanding: Chaining
Index of characters4:51
The index method on the String Object
Check your understanding: Index
Arithmetic Operators4:26
Arithmetic on Numbers
Check your understanding: Arithmetic Operators
Practice By Doing0:05
Modulus2:36
Finding even numbers
Check your understanding: Modulus
Increment Decrement2:26
Shorthand incrementing and decrementing.
Check your understanding: Increment Decrement
Fixed Decimal Places2:21
Fixing decimal places in Numbers
Check your understanding: Fixed Decimal Places
Number to String1:27
Converting Numbers to Strings
Check your understanding: Number to String
Round Up and Down2:51
Rounding Numbers up and down
Check your understanding: Round Up and Down
Practice By Doing0:05
Randomizing in JavaScript2:03
Getting random values with Math.random()
Check your understanding: Random
Practice By Doing0:05
True or False with Booleans2:01
Representing data that's "yes" and "no" in nature.
Check your understanding: Booleans
Logical with If Else2:40
Programming JavaScript to make decisions Part 1
Check your understanding: If Else
Practice By Doing0:06
Logic with Else If3:50
Programming JavaScript to make decisions Part 2
Check your understanding: Else if
Comparison Operators3:54
Comparing in JavaScript
Check your understanding: Comparison Operators
Practice By Doing0:07
Comparison Operators with If Else Statements1:38
Programming JavaScript to make decisions Part 3
Check your understanding: Comparison Operators
Logical Operators4:22
Check your understanding: Logical Operators
Return Keyword Part 13:32
The return keyword and exiting the function by stopping execution
Check your understanding: Return keyword
Return Keyword Part 26:11
The return keyword and exiting the function by stopping execution
Check your understanding: Return keyword
Practice By Doing0:05
Arrays3:43
Introduction to Arrays
Check your understanding: Arrays
Practice By Doing0:05
Array Push method2:09
Adding data to arrays
Check your understanding: Array Push method
Practice By Doing0:05
Array Includes method1:14
Checking for data within an Array
Check your understanding: Array Includes method
Array filter method4:32
Filtering an Array with given condition
Check your understanding: Array filter method
Array find method1:00
Search through an Array
Check your understanding: Array find method
Array Pop and Unshift method1:48
Remove data from an Array
Check your understanding: Pop and Unshift
Practice By Doing0:05
Objects2:35
Introduction to Objects
Check your understanding: Objects
Object Dot Notation7:23
Searching through Objects
Check your understanding: Object Dot Notation
Practice By Doing0:08
for loop4:42
Iterating over Arrays
Check your understanding: for loop
Practice By Doing0:05
for in loop2:59
Iterating over Objects
Practice By Doing0:05
Check your understanding: for in loop
forEach3:07
Iterating over Arrays short-hand
Check your understanding: forEach
map3:43
Manipulating an Array
Check your understanding: map
The DOM P13:10
Manipulating the DOM Part 1
Check your understanding: DOM manipulation
The DOM P24:49
Manipulating the DOM Part 2
Check your understanding: DOM manipulation
The DOM P34:14
Manipulating the DOM Part 3
Check your understanding: DOM manipulation

Final Project Introduction1:11
Final Project Introduction
Pre Project Material: Video Tag3:07
Learn the HTML behind the video application. No JS is needed for that one!
Pre Project Material: Connecting JS files2:36
Read between JS files
Pre Project Material: Positioning HTML4:55
Positioning your HTML elements
Pre Project Material: Cascading5:29
Cascading Priority
Pre Project Material: Animating HTML Elements3:50
Slider Animations
!important flag0:08
Portfolio Overview Part 14:08
Portfolio Overview
Portfolio Overview Part 23:40
Portfolio Overview
Portfolio Overview Part 35:36
Portfolio Overview
Opening Project Slider Part 15:54
Opening Project Slider
Opening Project Slider Part 27:18
Opening Project Slider
Opening Project Slider Part 32:53
Opening Project Slider

Pre Project Material: HTML Checkbox Properties3:47
Learn about the checkbox checked propery
Pre Project Material: Recursion6:58
Pre Project Material: Promises Part 14:38
Pre Project Material: Promises Part 23:52
Application Introduction0:46
Application Introduction
Password Generator Part 16:14
Final Project 5: Password Generator
Password Generator Part 25:28
Final Project 5: Password Generator
Password Generator Part 35:02
Final Project 5: Password Generator
Password Generator Part 44:37
Final Project 5: Password Generator
Password Generator Part 55:32
Final Project 5: Password Generator
Password Generator Part 64:34
Final Project 5: Password Generator
Password Generator Part 74:59
Final Project 5: Password Generator

Requirements

No programming experience needed. You will learn everything you need to know
A computer and internet connection

Description

We will journey through JavaScript by learning only concepts you'll see most often on the job. This allows you to cut right to the meat of programming and enable you to become job-ready faster. No more learning outdated concepts for the sake of learning them. We'll practice with the latest syntax and use best practices all the way through. I take a practical approach by teaching you the tools you'll need to build apps and websites effectively. We will start off by learning basic HTML & CSS. Then we'll jump into the JavaScript fundamentals to give you a solid foundation. Quizzes will be provided after every video to be sure you don't miss a beat. Before we jump into the projects section we'll go into the Tools section where I give you the JavaScript tools you'll need to create any app that comes your way. We'll end off by diving into 15+ projects designed to drill in all concepts learned throughout the course. I hope you're ready to finally get this programming language under your belt because you'll leave this course with a wealth of knowledge of JavaScript and 15+ projects to prove you are ready to put your skills to use in the real world. I'll see you in the course.

Who this course is for:

Completely new to coding and looking to learn by building projects
Coding bootcamp graduates looking to solidify their understanding

JavaScript Master Class for 2025 with HTML and CSS

What you'll learn

Explore related topics

Course content

Introduction and Setup2 lectures • 3min

HTML and CSS14 lectures • 39min

On to JavaScript!15 lectures • 45min

JavaScript Tools51 lectures • 1hr 55min

CSS concepts for Projects7 lectures • 19min

Final Project 1: Opening the project slider13 lectures • 51min

Final Project 2: Time App7 lectures • 28min

Final Project 3: Tip Calculator6 lectures • 21min

Final Project 4: Color Psychology4 lectures • 14min

Final Project 5: Password Generator12 lectures • 56min

Requirements

Description

Who this course is for: