UDEMY
UDEMY Logo

JavaScript - The Complete Guide (Beginner + Advanced) 

  • Offered byUDEMY

JavaScript - The Complete Guide (Beginner + Advanced)
 at 
UDEMY 
Overview

Duration

53 hours

Total fee

699

Mode of learning

Online

Difficulty level

Intermediate

Official Website

Go to Website External Link Icon

Credential

Certificate

JavaScript - The Complete Guide (Beginner + Advanced)
 at 
UDEMY 
Highlights

  • Compatible on Mobile and TV
  • Earn a Cerificate on successful completion
  • Get Full Lifetime Access
  • Learn from Academind by Maximilian Schwarzmüller
Read more
Details Icon

JavaScript - The Complete Guide (Beginner + Advanced)
 at 
UDEMY 
Course details

Who should do this course?
  • Beginner web development students who have no or only little JavaScript experience
  • Also developers who know the basics about JavaScript and want to deepen their knowledge
  • Advanced JavaScript developers who want to learn more about the nitty-gritty details and dive into advanced concepts
  • Everyone interested in learning JavaScript and all about how it works
What are the course deliverables?
  • JavaScript from scratch - beginner to advanced
  • All core features and concepts you need to know in modern JavaScript development
  • Everything you need to become a JavaScript expert and apply for JavaScript jobs
  • Project-driven learning with plenty of examples
  • All about variables, functions, objects and arrays
  • Object-oriented programming
  • Deep dives into prototypes, JavaScript engines & how it works behind the scenes
  • Manipulating web pages (= the DOM) with JavaScript
  • Event handling, asynchronous coding and Http requests
  • Meta-programming, performance optimization, memory leak busting
  • Testing, security and deployment
  • And so much more!
More about this course
  • JavaScript is THE most important programming language you need to learn as a web developer - and with this course, you make sure that you will not miss a single thing you have to know as a JavaScript developer! This is the most comprehensive and modern course you can find on JavaScript - it's based on all my JavaScript knowledge AND teaching experience . It's both a complete guide , starting with the core basics of the language, as well as an extensive reference of the JavaScript language and environment, ensuring that both newcomers as well as experienced JavaScript developers get a lot out of this course! It's a huge course because it's packed with important knowledge and helpful content. From the core basics, over advanced concepts and JavaScript specialties, all the way up to expert topics like performance optimization and testing - this course has it all. My goal was to create your go-to resource for the JavaScript language, which you can not just use for learning it but also as a resource you can come back to and look up important topics. The course is based on my experience as a long-term JavaScript developer as well as a teacher with more than 1,000,000 students on Udemy as well as on my YouTube channel Academind. It's packed with examples, demos, projects, assignments, quizzes and of course videos - all with the goal of giving you the best possible way of learning JavaScript. What's in the course? This course is obviously packed with content - I therefore strongly recommend that you check out the full course curriculum to get a clear idea of all the topics covered in the course. In general, here's what you'll find in the course: Modern JavaScript from the start: The JavaScript syntax changed over time - in this course, you'll learn the latest syntax from the start (you'll also learn about the old one though, so that you can work in ANY JS project) ALL the Basics: Variables, constants, functions, how scripts are loaded etc Arrays & Objects: We'll explore these very important data structures in great detail Control Structures: Understand how to run code conditionally and in loops A look behind the Scenes: How JavaScript engines work behind the scenes and what that means for us Deep dives into Core Concepts : ALL the special things about JavaScript function, different syntaxes Working with the DOM: How to manipulate web pages dynamically via JavaScript (including deep dives and different use-cases) Events in JavaScript: Learn how to listen to a broad variety of events (e. G. drag & drop) and execute appropriate code Classes & Object-oriented Programming : Learn how to work with classes, prototypes, the " this " keyword, constructor functions and much more Asynchronous and Synchronous Programming: We'll explore callbacks, promises, async/ await and other important tools and language features to execute code correctly Http Requests: Learn how to send Http requests via JavaScript Tooling, Optimizations & Browser Support: Code splitting, producing small code and ensuring that scripts work in all browsers - this matters and hence is covered in great detail Libraries & Frameworks: Learn about libraries like Axios or frameworks like React. Js - why they matter and how to use them Node. Js : Whilst focusing on the browser-side for the majority of the course (because the syntax is the same), we'll also have a dedicated section on Node. Js to learn all about that JS host environment Security & Performance Optimizations: Of course security matters, so does performance - no surprise that both is covered in the course! Automated Testing : Testing manually is hard work and can be unreliable - in this course you'll also get an introduction into automated testing What are the course prerequisites? NO JavaScript knowledge is required - you'll learn it from scratch! You also need NO programming experience other than basic web development knowledge (e. G. how the web works) Basic HTML and CSS knowledge is recommended but not a must-have
Read more

JavaScript - The Complete Guide (Beginner + Advanced)
 at 
UDEMY 
Curriculum

Introduction

Introduction

What is JavaScript?

JavaScript in Action!

Join our Online Learning Community

How JavaScript Is Executed

Dynamic vs Weakly Typed Languages

JavaScript Runs In A Host Environment

Course Outline - What Is In The Course?

How To Get The Most Out Of This Course

Using Course Resources

JavaScript vs Java

A Brief History Of JavaScript

Setting Up a Development Environment

Course FAQs

Basics: Variables, Data Types, Operators & Functions

Module Introduction

Setting Up the Project

More on Version Control & Git

Adding JavaScript to the Website

Introducing Variables & Constants

Declaring & Defining Variables

Working with Variables & Operators

Understanding the Starting Code

Data Types: Numbers & Strings (Text)

Using Constants

More on Strings

Introducing Functions

Adding A Custom Function

Code Styles, Conventions & Syntax

Returning Values

The (Un)Importance of Code Order

An Introduction to Global & Local Scope

"Shadowed Variables"

More about the "return" Statement

Executing Functions "Indirectly"

"Indirect" vs "Direct" Function Execution - Summary

Converting Data Types

Mixing Numbers & Strings

Splitting Code into Functions

Connecting all Buttons to Functions

Working with Code Comments

More Operators!

More Core Data Types!

Using Arrays

Creating Objects

Objects - Common Syntax Gotchas

Accessing Object Data

Adding a Re-Usable Function That Uses Objects

undefined, null & NaN

The "typeof" Operator

Importing Scripts Correctly with "defer" & "async"

Importing JavaScript - Summary

Wrap Up

Useful Resources & Links

Efficient Development & Debugging

Module Introduction

Efficient Development & Debugging - An Overview

Configuring the IDE Look & Feel

Using Shortcuts

Working with Auto-Completion & IDE Hints

Installing IDE Extensions

Tweaking Editor Settings

Utilizing Different IDE Views

Finding Help & Working with MDN

The ECMAScript Standard

How to "google" Correctly

Debugging JavaScript - An Overview

An Error Message! No Reason To Panic!

Using console.log() to look "into the Code"

Next-Level Debugging with the Chrome Devtools & Breakpoints

Testing Code Changes Directly in the Devtools

Debugging Code directly Inside VS Code

Debugging Code directly Inside VS Code

Wrap Up

Useful Resources & Links

Working with Control Structures (if Statements, Loops, Error Handling)

Module Introduction

Introducing "if" Statements & Boolean (Comparison) Operators

Using Booleans in Conditions & More on Text Comparisons

Using "if" Statements

Working with "if", "else" and "else-if"

Beware When Comparing Objects & Arrays for Equality!

The Logical AND and OR Operators

Understanding Operator Precedence

Beyond true/ false: "Truthy" and "Falsy" Values

Coercion vs Conversion

Setting Up a Bigger Example Project (The "Monster Killer")

Adding an "Attack" Function

Using "if" Statements for Checking the Win-Condition

Adding More "if" Statements & A "Strong Attack" Functionality

Time for a "Heal Player" Functionality!

Controlling the Conditional Bonus Life (Without Boolean Operators!)

Adding a "Reset Game" Functionality

Validating User Input

Utilizing Global Constants as Identifiers in Conditional Code

Adding a Conditional Battle Log

Introducing the Ternary Operator

A Bit of Theory: Statements vs Expressions

Logical Operator "Tricks" & Shorthands

Logical Operators - A Quick Summary

Working with the "switch-case" Statement

Introducing Loops

The "for" Loop

The "for-of" Loop

The "for-in" Loop

The "while" & "do-while" Loops

Controlling Loops with "break"

Controlling Iterations with "continue"

More Control with Labeled Statements

Error Handling with "try-catch" - An Introduction

Throwing Custom Errors

Working with "try-catch" to Catch & Handle Errors

Wrap Up

Useful Resources & Links

Behind the Scenes & The (Weird) Past (ES3, ES5) & Present (ES6+) of JavaScript

Module Introduction

ES5 vs ES6+ ("Next Gen JS") - Evolution of JavaScript

var vs let & const - Introducing "Block Scope"

Understanding "Hoisting"

Strict Mode & Writing Good Code

How Code is Parsed & Compiled

Inside the JavaScript Engine - How the Code Executes

[DEEP DIVE] JavaScript Language vs Browser APIs

Primitive vs Reference Values

Garbage Collection & Memory Management

Wrap Up

Useful Resources & Links

More on Functions

Module Introduction

Recapping Functions Knowledge - What We Know Thus Far

Parameters vs Arguments

Functions vs Methods

Functions are Objects!

Function Expressions: Storing Functions in Variables

Function Expressions vs Function Declarations

Anonymous Functions

Working on the Project: Adding User Choices to the Game

Implementing the Core Game Logic

Introducing Arrow Functions

Different Arrow Function Syntaxes

Outputting Messages to the User

Default Arguments in Functions

Introducing Rest Parameters ("Rest Operator")

Creating Functions Inside of Functions

Understanding Callback Functions

Working with "bind()"

Adding bind() to the Calculator Project

call() and apply()

Wrap Up

Useful Resources & Links

Working with the DOM (Browser HTML Code) in JavaScript

Module Introduction

What's the "DOM"?

Document and Window Object

Understanding the DOM and how it's created

Nodes & Elements - Querying the DOM Overview

Selecting Elements in the DOM

Summary: Node Query Methods

Exploring and Changing DOM Properties

Attributes vs Properties

Selecting Multiple Elements & Summary

Traversing the DOM - Overview

Traversing Child Nodes

Using parentNode & parentElement

Selecting Sibling Elements

DOM Traversal vs Query Methods

Styling DOM Elements

Creating Elements with JS - Overview

Adding Elements via HTML in Code

Adding Elements via createElement()

Inserting DOM Elements

Cloning DOM Nodes

Live Node Lists vs Static Node Lists

Removing Elements

Insertion & Removal Method Summary

Summary: Insert, Replace, Remove

Setting Up the Practice Project

Selecting the Modal and "Add" Button

Opening a Modal by Changing CSS Classes

Controlling the Backdrop

Fetching and Validating User Input

Creating a Movie in JavaScript & Clearing the Input

Rendering Movie Items on the Screen

Deleting Movie Elements

Showing & Hiding the "Are you sure?" Dialog

Starting with the Confirmation Logic

Finishing the App

Wrap Up

Useful Resources & Links

More on Arrays & Iterables

Module Introduction

What are "Iterables" and "Array-like Objects"?

Creating Arrays

Which Data Can You Store In Arrays?

push(), pop(), unshift(), shift() - Adding & Removing Elements

The splice() Method

Selecting Ranges & Creating Copies with slice()

Adding Arrays to Arrays with concat()

Retrieving Indexes with indexOf() /& lastIndexOf()

Finding Stuff: find() and findIndex()

Is it Included?

Alternative to for Loops: The forEach() Method

Transforming Data with map()

sort()ing and reverse()ing

Filtering Arrays with filter()

Where Arrow Functions Shine!

The Important reduce() Method

Chaining Methods in JavaScript

Arrays & Strings - split() and join()

The Spread Operator (...)

Understanding Array Destructuring

Maps & Sets - Overview

Working with Sets

Working with Maps

Maps vs Objects

Understanding WeakSet

Understanding WeakMap

Wrap Up

Useful Resources & Links

More on Objects

Module Introduction

What's an Object?

Objects & Primitive Values

Objects - Recap

Adding, Modifying & Deleting Properties

Special Key Names & Square Bracket Property Access

Property Types & Property Order

Dynamic Property Access & Setting Properties Dynamically

Demo App & Shorthand Property Syntax

Rendering Elements based on Objects

for-in Loops & Outputting Dynamic Properties

Adding the Filter Functionality

Understanding "Chaining" (Property & Method Chaining)

The Object Spread Operator (...)

Understanding Object.assign()

Object Destructuring

Checking for Property Existance

Introducing "this"

The Method Shorthand Syntax

The "this" Keyword And Its Strange Behavior

call() and apply()

What the Browser (Sometimes) Does to "this"

"this" and Arrow Functions

"this" - Summary

Getters & Setters

Wrap Up

Useful Resources & Links

Classes & Object-oriented Programming (OOP)

Module Introduction

What is "Object-oriented Programming" (OOP)?

Getting Started with OOP Code

Defining & Using a First Class

Working with Constructor Methods

Fields vs Properties

Using & "Connecting" Multiple Classes

Binding Class Methods & Working with "this"

Adding a Cart and Shop Class

Communicating Can Be Challenging!

Static Methods & Properties

First Summary & Classes vs Object Literals

Getters & Setters

Introducing Inheritance

Implementing Inheritance

Using Inheritance Everywhere

Overriding Methods and the super() Constructor

super() Constructor Execution, Order & "this"

Different Ways of Adding Methods

Private Properties

"Pseudo-Private" Properties

The "instanceof" Operator

Built-in Classes

Understanding Object Descriptors

Wrap Up

Useful Resources & Links

Deep Dive: Constructor Functions & Prototypes

Module Introduction

Introducing Constructor Functions

Constructor Functions vs Classes & Understanding "new"

Introducing Prototypes

Prototypes - Summary

Working with Prototypes

The Prototype Chain and the Global "Object"

Classes & Prototypes

Methods in Classes & In Constructors

Built-in Prototypes in JavaScript

Setting & Getting Prototypes

Wrap Up

Useful Resources & Links

Practice: OOP & Classes

Module Introduction

First Project Steps & Planning

Creating Project Lists & Parsing Element Data

Starting with the "Switch Project" Logic

Passing Method References Around

Moving DOM Elements

Adding a Tooltip

Adding Inheritance

Wrap Up

Useful Resources & Links

Back to the DOM & More Browser APIs

Module Introduction

Using "dataset" (data-* Attributes)

Getting Element Box Dimensions

Working with Element Sizes & Positions

The DOM & Prototypes

Positioning the Tooltip

Handling Scrolling

Working with