Javascript Tutorial and Projects Course
4.6 (1,061 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.
12,038 students enrolled

Javascript Tutorial and Projects Course

Basic Introduction to Javascript by Building Many Interesting Projects
4.6 (1,061 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.
12,038 students enrolled
Created by John Smilga
Last updated 7/2020
English
English [Auto]
Current price: $11.99 Original price: $19.99 Discount: 40% off
2 days left at this price!
30-Day Money-Back Guarantee
This course includes
  • 51.5 hours on-demand video
  • 3 articles
  • 158 downloadable resources
  • 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
  • students will know what is Javascript
  • students will know how to add Javascript to their projects
  • students will know the basics of working with Javascript
  • students will build few simple projects using Javascript
Course content
Expand all 343 lectures 51:25:13
+ Introduction
5 lectures 08:42
Goals
01:43
Structure
02:16
Video Blur Fix
01:37
Course Review
00:32
+ Visual Studio Code and Course Setup
4 lectures 19:38
Dev Setup Intro
01:00
VS-Code and Chrome
03:26
Extensions
11:35
Emmet
03:37
+ Javascript Basics
32 lectures 03:42:43
Basics Intro
00:17
Basic Project
03:10
Inline Javascript
03:15
Internal Javascript
07:51
External Javascript
10:01
Cleanup Workspace
01:08
Helper Methods
10:06
Statements and Comments
12:02
Variables
08:47
Assign Variable Value Later
04:22
Variable Naming Rules
06:04
const, let, var
05:14
Quotation Marks
05:51
String Concatenation
05:25
Numbers Basics
08:21
Numbers - Additional Features
08:24
Implicit Type Conversion
12:00
Data Types
08:13
Arrays
11:14
Functions - Declare, Invoke
06:26
Functions - Parameters, Arguments
12:56
Functions - Return
13:21
Function Expressions
07:43
Objects
08:23
Conditional Statements - Basics
05:57
Conditional Statements Continued
07:02
Equality
04:24
Logical Operators
04:24
Switch Statement
07:27
while Loops
05:55
do while loops
02:57
for loop
04:03
+ Javascript Tutorial Continued
22 lectures 02:56:06
Connecting The Dots
00:24
String Properties and Methods
16:34
Template Literals
06:10
Array Properties and Methods
11:50
Exercise - Full Name
10:13
Exercise - Calculate Total
14:40
Value vs Reference
05:51
Null and Undefined
02:15
Truthy and Falsy
04:34
Ternary Operator
04:16
Global Scope
07:25
Local Scope
07:02
Variable Lookup
06:52
Callback Functions, Higher Order Functions
15:07
Array Iterators
02:22
forEach
09:44
map
10:43
filter
03:55
find
08:30
reduce
09:48
Math Object
08:33
Date Object
09:18
+ DOM
33 lectures 03:14:42
DOM - General Concepts
08:40
Window and Document Overview
04:15
Get Element By ID
06:51
Get Elements By Tag Name
08:31
Get Element By Class Name
02:33
Query Selector and Query Selector ALL
06:45
Navigate the DOM - Children
04:54
Navigate the DOM - parentElement
03:06
Navigate the DOM - nextSibling, previousSibling
04:28
Navigate the DOM - nextElementSibling, previousElementSibling
01:15
textContent nodeValue
02:57
getAttribute() setAttribute()
08:09
classList and className
09:28
createElement - createTextNode - appendChild
08:09
insertBefore
03:43
replaceChild
02:23
prepend innerText
03:10
remove removeChild
04:52
innerHTML and textContent
08:24
Change CSS with style property
05:07
Events Overview
01:53
Click Event
07:23
Function Reference
04:51
Mouse Events
05:17
Key Events
04:13
Event Object
10:48
CurrentTarget vs Target
07:33
Event Propogation - Bubbling- Capturing
10:39
Event Propogation Example
07:31
Forms
05:48
Local Storage
09:22
Local Storage With Multiple Values
09:05
+ DOM Projects
75 lectures 08:21:52
Intro
01:17
Setup
04:11
Color Flipper - Simple HTML
04:10
Color Flipper - Simple Javascript
08:58
Color Flipper - Hex
10:16
Counter HTML
02:25
Counter JS
11:14
Reviews HTML
04:45
Reviews JS
22:40
Navbar HTML
02:48
Navbar General Concepts
04:08
Navbar JS
07:56
Sidebar HTML
03:44
Sidebar Manual Setup
03:07
Sidebar JS
05:51
Modal HTML
03:39
Modal Challange
02:42
Modal JS
03:02
Questions HTML
07:14
Questions General Concept
02:54
Questions JS - Traversing the DOM
07:32
Questions JS - Using Selectors Inside the Element
10:19
Menu HTML
06:56
Display Items When Page Loads
14:39
Refactor
03:12
Filter Buttons HTML
01:57
Filter Buttons JS
11:42
Dynamic Filter Buttons
04:01
Unique Categories
07:29
Dynamic Filter Buttons Complete
09:40
Video Intro
01:12
Video HTML
02:44
Video Overlay Setup
02:42
Video JS
04:59
Video Preloader
04:51
Scroll Intro
03:31
Scroll HTML
10:37
Scroll - Setup Date
02:11
Scroll - Toggle Simple Setup
06:16
Scroll - Toggle Dynamic
10:44
Scroll - Fixed Navbar
08:50
Smooth Scroll Setup
10:23
Smooth Scroll Complete
10:53
Tabs HTML
11:42
Tabs JS
10:56
Countdown HTML
05:53
Set Date
19:51
Calculate Remaining Time
27:47
Time From Now
04:10
Lorem Ipsum HTML
04:26
Lorem Ipsum JS
17:20
GroceryBud - Intro
03:22
GroceryBud - HTML
05:09
GroceryBud - Select Elements
03:13
GroceryBud - addItem Setup
07:26
GroceryBud - truthy shortcut
03:32
GroceryBud - display alert
05:29
GroceryBud - addItem
08:49
GroceryBud - setBackToDefault
02:34
GroceryBud - clear items
06:54
GroceryBud - select edit and delete buttons
07:23
GroceryBud - delete item
07:18
GroceryBud - edit item
11:16
GroceryBud - localStorage info
04:25
GroceryBud - addToLocalStorage
08:38
GroceryBud - removeFromLocalStorage
05:39
GroceryBud - editLocalStorage
04:46
GroceryBud - load items from localStorage
06:49
Slider Intro
01:29
Slider HTML
03:34
Slider General Concepts
05:14
Slider JS Setup
03:27
Slider JS - Slides Approach
06:06
Slider JS - Button Approach
02:48
+ Objects
11 lectures 01:21:53
Intro
00:53
Object Basics
06:13
Nested Objects, Bracket Notation
11:59
'this' - Keyword Basics
08:20
"this" - Keyword Advanced
07:10
Factory Functions
06:42
Constructor Functions
07:48
Constructor Property
04:51
Prototype Property
09:58
Property Lookup
05:45
ES6 Class Syntax
12:14
+ Object Projects With Bootstrap 4 - ONLY JS
6 lectures 03:56:32
Course Form Project - Intro
02:36
Course Form Project - Main
01:07:14
Flashcard Project - Intro
02:34
Flashcard Project - Main
01:12:50
Budget Application Project - Intro
03:56
Budget Application Project - Main
01:27:22
+ Coffee Shop Project - Object Project HTML and CSS Included
27 lectures 04:55:53
Coffee Shop Project - Setup
09:03
Coffee Shop Project - Header HTML
04:56
Coffee Shop Project - Header CSS
25:30
Coffee Shop Project - Video HTML
03:39
Coffee Shop Project - Video CSS
05:32
Coffee Shop Project - Navigation Button
09:13
Coffee Shop Project - Navbar HTML
04:35
Coffee Shop Project - Navbar CSS
10:19
Coffee Shop Project - Switch Button
12:37
Coffee Shop Project - Preloader HTML and CSS
04:44
Coffee Shop Project - Preloader JS
05:28
Coffee Shop Project - Navbar JS
07:44
Coffee Shop Project - Refactor Javascript
05:54
Coffee Shop Project - Video Play Pause
10:59
Coffee Shop Project - About HTML
06:25
Coffee Shop Project - About CSS
18:08
Coffee Shop Project - Drink HTML
07:22
Coffee Shop Project - Drink CSS
20:13
Coffee Shop Project - Drink Javascript First
21:34
Coffee Shop Project - Drink Javascript Second
18:00
Coffee Shop Project - Work HTML
08:49
Coffee Shop Project - Work CSS
22:37
Coffee Shop Project - Work Modal HTML and CSS
11:40
Coffee Shop Project - Work Modal JS
18:02
Coffee Shop Project - Contact HTML
08:56
Coffee Shop Project - Contact CSS
09:27
+ Functions
6 lectures 36:56
Intro
00:18
IFFE
08:59
Hoisting
06:26
Closure
08:28
Closure - Basic Example
03:53
Closure - Complete Example
08:52
Requirements
  • Basic knowledge of HTML, CSS
  • Computer
  • Text Editor
  • Web Browser
Description

Three fundamental languages of the web are HTML, CSS and Javascript.

Html is used for structure, CSS is used for styling and Javascript is used for functionality.

 Reasons to learn Javascript

Number One - Javascript is the most popular programming language in the world.

Number Two - Javascript is de facto language of the web

Number Three - Javascript is Easy to learn

Number Four - Knowing Javascript provides great opportunity to get a job

Number Five - Javascript is Everywhere.Javascript is not web-exclusive anymore. Its on the servers (NODE.JS), cross-platform desktop-apps etc...

This step by step course is intended for everyone who wants to start working with Javascript. 

We will cover what is Javascript, how to add Javascript to our projects, how to start working with Javascript and at the end we will make few simple projects. A basic knowledge of HTML, CSS would be preferred.

Who this course is for:
  • Anyone who wants to start working with Javascript