The Complete JavaScript Course - Beginner to Professional
4.4 (1,709 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
10,417 students enrolled

The Complete JavaScript Course - Beginner to Professional

The only course you need to become a JavaScript developer - 45 JavaScript projects, ES6, JSON, AJAX & much more!
4.4 (1,709 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
10,417 students enrolled
Last updated 5/2020
English
English [Auto-generated], Portuguese [Auto-generated]
Current price: $129.99 Original price: $199.99 Discount: 35% off
13 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 33.5 hours on-demand video
  • 177 articles
  • 21 downloadable resources
  • 2 coding exercises
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Master the #1 programming language in the world
  • Become a professional JavaScript developer
  • Build games, web apps and websites in JavaScript
  • Get web development jobs on freelancer sites
Course content
Expand all 404 lectures 34:48:19
+ Getting Started with JavaScript
10 lectures 48:32

Learn about JavaScript what it is and what it can do.  You will be introduced to the amazing world of JavaScript.

Preview 02:41

JavaScript is easy to get started with, basics of starting to program with JavaScript

JavaScript and HTML
04:48

Connect JavaScript into your webpage.  External files and on page JavaScript using the script tags.

Add JavaScript to your WebPage
09:27

Start writing JavaScript it’s easy to get started with.  You can start with just one line of code and make something happen.  

First JavaScript
09:00

Learn about the console and how you can detect errors in your code.  Pass information from your code to your browser.

Console debug
09:53

Comments in JavaScript are useful to track information within the code and note additional details within source code.

JavaScript Comments
05:28
Practice Exercise
05:14
Exercise Source Code
00:03
Source Code JavaScript File
00:12

Review of Getting Started with JavaScript lessons

Quiz Getting Started with JavaScript
4 questions
+ JavaScript Essentials
10 lectures 01:18:44

Learn about the most basic unit primitive data types Strings Numbers and Boolean

Primitive Data types
05:07

Variables allow you to contain data and then use and reuse those values also update the values as needed within your JavaScript code.

JavaScript Variables
09:28

Get familiar with the different data types and how they work

Data Type Tips
10:00

Prompt lets you create an interaction with your web users.   Connect JavaScript with web page visitors.

Exercise Prompt
11:32

Explore JavaScript Arithmetic operators + - * / % modulus

Arithmetic operators
12:44

Explore JavaScript Assignment operators = += -= *= /=

Assignment operators
04:42
Create a number variable
1 question

Explore JavaScript Comparison operators Strict equal ( === ) Not equal ( != ) Equal ( == )

Comparison operators
12:12

Explore JavaScript Logical Operators Logical AND (&&) Logical OR (||) Logical NOT (!)

Logical operators
09:51
Source Code
00:09

Test your knowledge basic foundation for writing JavaScript Code

Quiz JavaScript Essentials
5 questions
+ JavaScript Multiple Values
27 lectures 02:09:13
JavaScript Arrays
08:30
Source Code 1
00:07

Exercise create a ToDo list from scratch. Using interaction from the web user generate status of a task and information that is output in the console.

Exercise ToDo List
10:46

Find out how arrays contain default values that can be used within your application get length and select an item from an array using its index value.

Array properties
10:11
Task List Source Code
00:13
Array type
02:15

Exercise guess the index value game - minigame using prompt to guess the index value of an item in the array

Exercise guessing game
11:13
Source Code Game Source
00:08

See Arrays in action with ready to use functionality that lets you interact with your arrays.

Modify the Array
13:51
Source Code Arrays
00:18

Work with arrays and see the power of built in methods within JavaScript to manipulate and update array contents.

Exercise Update Array
04:49
Source Code array updates
00:07

Access array information and check if values are contained within an array using Index.

Array Access Methods
07:52

Exercise Array updater : Use user input to update and find items contained with the array.   Create a dynamic array updater.

Exercise remover
07:35
Source Code Array Remover
00:08

JavaScript Nested array or Multidimensional Array. Store even more information into an array use a multidimensional array and retrieve values from a multidimensional array.  

Multidimensional Array
09:12
Source Code Nested Array
00:06

Getting data from JavaScript arrays. Use a loop to retrieve all the values from an array.  Iterate through an array.

Array Loop
03:14
Source Code Looping array items
00:05

JavaScript Objects introduction on how to store lots of information in one variable.

JavaScript Objects
06:47

Get data from a JavaScript Object and use it within your code.

Retrieve Data
06:13
Source Code JavaScript Objects
00:08

JavaScript Objects see how to manipulate data and retrieve new values.

Update Objects
03:50

Learn how to retrieve JavaScript object data by looping through the contents of the object.

Loop Objects
04:13
Source Code Loop Objects
00:05

See how JavaScript Objects and JavaScript arrays can be combined for even more power with data.

Objects and Arrays
12:08

JavaScript Arrays and Objects

Quiz JavaScript Essentials
8 questions
+ Document Object Model Basics
8 lectures 40:09

Learn about the Document Object Model and what it can do.  This is where JavaScript connects to your HTML page elements.  The entire HTML page as nodes that can be manipulated using JavaScript.

Intro to the DOM
04:27

See what you can do with the DOM.  Using the DOM you can update elements without refreshing web pages and much more.

Closer Look at the DOM
06:03
Dynamic Content
09:50

See how to select elements and then update them all using JavaScript

Selecting Updating Exercise
07:03

innerHTML lets you update and change the HTML output of an element using JavaScript.

Manipulate innerHTML
05:51
Source Code
00:06
Select Element update HTML
1 question

Connect with user input and get those values back into your JavaScript code.  Getting values from input fields and then using those values within JavaScript.

Prompt and DOM
03:06

Test your knowledge of this section

JavaScript DOM
3 questions
+ JavaScript Logic Statements
16 lectures 01:26:39
Introduction JavaScript Logic Statements
04:39

Check for true or false and then do something depending on the result.  Ternary operators are a quick and short format for conditional checks and to apply logic.

Conditional Ternary Operator
13:25

Check for true or false and then do something depending on the result.  Ternary operators are a quick and short format for conditional checks and to apply logic.

Ternary Operator source code
00:12

If statements let you apply logic and execute a block of code depending on the result of that logic.

If Statement
12:32
Source Code If Statement
00:11

Get more options to your logic with Else

Else if Statement
10:42
Source Code Else
00:16

Use the JavaScript switch statement to check if a case is true and execute a block of code.  

Switch Statement
09:17

Use the JavaScript switch statement to check if a case is true and execute a block of code.  

Switch Source Code
00:08

Just like tossing a coin to check for heads or tails logic is perfect for checking to see a result and taking an action on that result.

If statement coin toss
06:17
Coin Toss Exercise source code
00:15

Exercise Magic Eight Ball : Get answer to your question with the magic eight ball. How it knows is what you are thinking is in the JavaScript.

Magic 8 Ball Switch
07:28
Magic 8 Ball Source Code
00:23
Rock Paper Scissors
10:39
Rock Paper Scissors Game
09:46
Rock Paper Scissors Source Code
00:28

Test your knowledge of Logical Statements in JavaScript

Logical Statements
5 questions
+ JavaScript Loops
19 lectures 01:26:16
Introduction to JavaScript Loops
04:22

A statement that is executed at least once and is re-executed each time the condition evaluates to true

Do Loops
13:09
Source Code Do While
00:14

While loops allow you to execute until a condition is no longer true

Exercise in code Cracking looping until you guess it

JavaScript While Loops
12:22
Source Code Code Cracking
00:12

For loops are the most popular format for loops and used the most when coding JavaScript.  Select the loop option that is best suited for your needs.

JavaScript For loops
14:19
Source Code
00:18

Nested Loops allow you to build more with looping.   A loop within a loop looping the child within each parent value.

Nested Loops
09:31
Source Code for nested loops
00:07

Stop the loop and continue with a loop allowing more control as to what gets output within the loop, applying logic and conditions.

Break and Continue
04:46
Break source code
00:10

Adding conditions to loops allows you to customize your output.

Get Multiples
05:27
Source Code for Multiples
00:13

Pairing loops with arrays is a natural way to get all the information and iterate through an array.  Power of loops is really valuable when it comes to arrays.

Loops and Arrays
08:02
Source Code for loops and arrays
00:12

Just like with arrays objects hold lots of data and loops are ideal to get access to the data by iterating through data.

Loop and Objects
05:12
Source Code Objects
00:05

Exercise build a shopping list builder to add items into an array

Shopping List Array Exercise
07:22
JavaScript Shopping list builder
00:11

Test your knowledge of JavaScript loops

JavaScript Loops
5 questions
+ JavaScript Functions
34 lectures 02:56:05
Introduction to JavaScript Functions
07:06

Functions are like mini programs allowing you to selectively execute blocks of code when needed. Learn how to declare functions and use them within your code.

Introduction to Functions
06:48

Learn how functions can be used to return values and how local and global variables are used the variable scope.

Returns and Local Variables
10:16
Function returns source code
00:09

Exercise - Create a random name generator using JavaScript Functions

Random Name Generator
07:26
Random Name Generator Source Code
00:10

Exercise - Build a JavaScript calculator where you can enter in values and either add subtract multiply or divide the user input values.

JavaScript Calculator
12:21
Source Code JS calculator
00:26

Learn how to use the latest JavaScript to pass no argument defaults values and also how to do it for older browsers

No argument options
05:12
Source Code for Function
00:06

Exercise Code Cracking game - Guess the random code see how many times it take you to guess the code.  

Code Cracking Game
14:39
Source Code for Code cracking game
00:31

Functions don’t always need to have name and functions can also be variables that change value.

Anonymous Functions
03:51

Functions can invoke themselves - recursive self-invoking functions can be used to loop code and more.

Self invoking functions
04:09
Self invoking function source
00:06

Exercise building a word guessing game using recursive functions

Recursive Function Game
07:38
Source Code Word guessing game
00:12

Exercise Improve on the Word guessing game by shuffling all the array items

Shuffle array function
07:15
Shuffle array source code
00:16

Function scope review what is global what is local?

Function scope
05:50

Exercise - extend your arrays by removing out duplicates using this code snippet.

Exercise remove Duplicates
11:16
Remove Duplicates from arrays source
00:15

Functions are really powerful and adding functions within functions can increase what can be done with your function.

Functions within functions
09:14
Functions within functions source code
00:12

Exercise building a shopping list from the user's input and adding it to the current list within the HTML page.

Exercise Shopping List
08:42
Shopping List Source Code
00:20

Using callbacks a function that is passed to another function as a parameter and the callback get executed inside that function

Function callbacks
06:25
Source Code Callbacks
00:12

Exercise Callback calculator an improvement on the previous calculator built in an earlier lesson. Coding is about making things more efficient.

Exercise Callback calculator
09:48

Exercise building a deck of cards and dealing those cards out to a selected number of players.  

Exercise Card Deck
09:49
Source Code Card Deck
00:54

Learn how to handle the deck of cards and deal out the cards from an array

Deal deck of cards
17:33
Tweak Exercise Local Scope
06:07
Source Code Exercise Tweak
00:46

Test your knowledge about JavaScript Functions

JavaScript Functions
7 questions
+ Interactive Content JavaScript DOM and More
40 lectures 03:16:34
Introduction to Interactive Content
04:17
Windows Browser Object
10:52
Windows History
04:19
Windows Object Methods
03:46
Windows Objects Source Code
00:26

Windows setTimeout Method Calls a function or executes a code snippet after specified delay.

Window SetTimeOut Method
08:00
Source Window SetTimeOut Method
00:13
Windows Navigator Object
03:19
Source Windows Navigator Object
00:04

Get information about the page visitors Location including Longitude and Latitude

Windows Location Object
08:54

Selecting Elements can also be done by traversing through the DOM from the various levels within the Tree via JavaScript

DOM traversing
09:24
Source DOM traversing
00:00
This DOM element
06:42
Source This DOM element
00:10

Create interaction with web users using Event Handlers.

Event Handler Code
07:13
Source Event Handler Code
00:10
Onload Event Handler
05:31
Source Onload Event Handler
00:11
Mouse Event Handlers
12:33
Source Mouse Event Handlers
00:08
Event Target Form Content
09:58
Source Event Target Form Content
00:16
Onchange and Onblur
05:13
Source Onchange and Onblur
00:16

Exercise building an image uri generator

Placeholder Image Generator
18:17
Source Placeholder Image Generator
00:22

Exercise building a web page image carousel

Build an Image Carousel
12:19
Source Build an Image Carousel
00:15

Exercise Learn how to have an input field only accept digits or only accept characters

Key Event Return Boolean
08:54
Source Key Event Return Boolean
00:10

Exercise Add form validation to your form

Onsubmit Form Validation
09:15
Source Onsubmit Form Validation
00:18

Exercise Drag and Drop text from one element into another

Drag and Drop Elements
10:41
Source Drag and Drop Elements
00:20
Name Game Setup
10:10
Source Name Game Setup
00:17
Create Game Play
14:27
Source Create Game Play
00:29

Exercise Build a game that shows random names that are scrambled and you need to guess which is the correct name.

Gameplay Overview
07:39
Source Gameplay Overview
00:39

Test your knowledge of the Document object model

JavaScript Dynamic Web with the DOM
3 questions
+ JavaScript Dynamic Web with the DOM
42 lectures 04:14:12
Introduction to Dynamic Web
02:40
Traversing the DOM
14:43

More options for element selection By Tag

Get Elements Id and TagName
14:10
Source Get Elements Id and TagName
00:21

More options for element selection By Class

Get Elements By ClassName
08:32
Source Get Elements By ClassName
00:23

Add click events to multiple elements

Elements Click Handler
13:00
Source Elements Click Handler
00:22
QuerySelector Element Selection
05:13
Source QuerySelector Element Selection
00:21

Make a selection of multiple elements using QuerySelectorAll Exercise : build a dynamic element selector to copy elements from selector in the input field

QuerySelectorAll Element Selector
11:46
Source QuerySelectorAll Element Selector
00:24
Manipulating Element Style
14:53
Source Element Style
00:28
Popup Modal using JavaScript
10:34

Exercise : Build a popup message modal using JavaScript

Source Popup Modal using JavaScript
00:48

Use JavaScript to select elements and manipulate classes

Adding and Removing Classes
16:42
Source Adding and Removing Classes
00:21

Exercise Build a web component to hide and show elements building an accordion style component.

Build JavaScript Accordion
12:59
Source Build JavaScript Accordion
00:29
Manipulating Attributes
19:22
Source Manipulating Attributes
00:23
Use Custom Attributes
07:24
Source Use Custom Attributes
00:26
Creating New Elements
16:08
Source Creating New Elements
00:02
Friend Vote List Builder
09:19
Source Friend Vote List Builder
00:35
JavaScript Shopping List
08:22
Source JavaScript Shopping List
00:17
Event Listeners on Elements
08:40
Source Event Listeners on Elements
00:15
Multiple Event Listeners
10:34
Source Multiple Event Listeners
00:14
DOM Event Flow
05:01
Source DOM Event Flow
00:11
Select Event Listener
07:10
Source Select Event Listener
00:11
Event Listener ListMaker
14:21
Source Event Listener ListMaker
00:25
Dynamic List Editor
14:57
Source Dynamic List Editor
00:38

Test your knowledge of the DOM and more

JavaScript DOM Interactive Content
3 questions
+ Built-in JavaScript
30 lectures 03:06:39
Introduction to Built-In JavaScript methods
02:19
New Window Open
08:49
Global JavaScript Methods
06:41
Source Global JavaScript Methods
00:10
JavaScript String Methods
10:33
Source JavaScript String Methods
00:20
String Manipulation
16:48
Source String Manipulation
00:23
String Method Replace
07:02
Source String Method Replace
00:13
Word Scramble Guessing Game
15:58
Source Word Scramble Guessing Game
00:25
JavaScript Math Object
05:59
Source JavaScript Math Object
00:05
JavaScript Date Object
11:45
Source JavaScript Date Object
00:10
Countdown Timer
17:53
Source Countdown Timer
00:26
Color Matching Game
11:37
Source Color Matching Game
00:40
Create User Interaction
14:02
Source Create User Interaction
00:40
Bug Fixes and Tweaks
16:38
Source Bug Fixes and Tweaks
00:53
Debugging Try Catch Throw
05:31
Source Debugging Try Catch Throw
00:11
Hit a Computer Game
14:35
Source Hit a Computer Game
00:25
Scoring Complete App
14:43
Source Scoring Complete App
00:42

Test your knowledge of JavaScript Methods

Built-in JavaScript
5 questions
Requirements
  • No experience required - this course will take you from beginner to paid professional
  • All you need is a text editor or download of the one suggested in the course
  • HTML and CSS experience
Description

This course has everything you need to become a professional JavaScript developer!

With over 33 hours of training, quizzes and challenges, it's the most comprehensive JavaScript course available on Udemy!

Whether you want a career in front end or back end development - it's essential that you have a solid understanding of this versatile language!

Come learn the #1 programming language in the world in this fun and exciting course with Laurence Svekis - a web developer with 18 years experience who has followed Rob Percival's "learn by doing" style to create this amazing course.

Build 45 Games, Web Apps and Websites with JavaScript

You'll go from beginner to extremely high-level and your instructor will complete each project with you step by step on screen.

Inside the course, you'll build a Magic Eight Ball game, mini calculator, a Calorie Counter app, a geo-located Google Map, a functioning online store and much much more!

You'll learn how to:

  • Use logic statements to make decisions within your code

  • Save time writing the same thing over and over again with JavaScript Loops

  • Use JavaScript Functions to build mini programs to selectively execute code 

  • Make your webpages comes to life with Interactive Content

  • Connect to HTML5 elements & newer API's

  • Make your code more efficient with Regex

  • Handle data and updating page content without page refreshes using JSON and AJAX

  • Build faster with the new ECMA6 version of JavaScript.

  • Gain a strong foundation in Javascript so you’ll be ready to move up to frameworks like Angular and Node.js

No JavaScript or web development experienced required. You'll get friendly support in the Q&A area and all the source code available for download. 

This Offer Won't Last Forever

Go ahead and hit that "take this course" button to start learning the #1 programming language in the world!

Who this course is for:
  • Anyone who wants to learn to program
  • Web developers and designers
  • Website owners
  • Anyone who wants to refresh their knowledge of JavaScript
  • Anyone who wants to create websites
  • Anyone who wants to practice JavaScript
  • Anyone who wants everything JavaScript in one place