Build a Real-World Project Using JavaScript Video Course

Curriculum For This Course

• 1. Course Introduction 1 Videos 00:04:12
  • Setting up Our Tools: Brackets and Google Chrome 03:48
• 2. JavaScript Language Basics 19 Videos 03:07:30
  • Section Intro 00:49
  • Introduction to JavaScript 04:07
  • Getting Started with JavaScript 04:24
  • Variables and Data Types 08:43
  • Variable Mutation and Type Coercion 15:13
  • Operators 13:57
  • If / else Statements 08:56
  • Boolean Logic and Switch Statements 15:48
  • Coding Challenge 1 01:39
  • Coding Challenge 1: Solution 13:51
  • Functions 15:31
  • Statements and Expressions 02:44
  • Arrays 11:10
  • Objects and Properties 09:00
  • Objects and Methods 14:55
  • Loops and Iteration 19:06
  • Coding Challenge 2 02:52
  • Coding Challenge 2: Solution 13:07
  • Important Note: ES5, ES6 / ES2015 and ES2016 04:47
• 3. How JavaScript Works Behind the Scenes 8 Videos 00:54:11
  • Section Intro 01:07
  • How Our Code Is Executed: JavaScript Parsers and Engines 02:33
  • Execution Contexts and the Execution Stack 05:38
  • Execution Contexts in Detail: Creation and Execution Phases and Hoisting 04:05
  • Hoisting in Practice 12:06
  • Scoping and the Scope Chain 12:44
  • The 'this' Keyword 01:38
  • The 'this' Keyword in Practice 11:11
• 4. JavaScript in the Browser: DOM Manipulation and Events 14 Videos 02:07:33
  • Section Intro 00:40
  • The DOM and DOM Manipulation 01:47
  • 5-Minute HTML and CSS Crash Course 05:06
  • Project Setup and Details 04:08
  • First DOM Access and Manipulation 19:33
  • Events and Event Handling: Rolling the Dice 17:17
  • Updating Scores and Changing the Active Player 13:54
  • Implementing Our 'Hold' Function and the DRY Principle 17:11
  • Creating a Game Initialization Function 11:10
  • Finishing Touches: State Variables 07:30
  • Coding Challenge 3 02:12
  • Coding Challenge 3: Solution, Part 1 06:03
  • Coding Challenge 3: Solution, Part 2 08:51
  • Coding Challenge 3: Solution, Part 3 06:56
• 5. Advanced JavaScript: Objects and Functions 14 Videos 02:36:56
  • Section Intro 01:02
  • Everything Is an Object: Inheritance and the Prototype Chain 09:45
  • Creating Objects: Function Constructors 14:06
  • The Prototype Chain in the Console 08:19
  • Creating Objects: Object.create 06:26
  • Primitives vs. Objects 08:11
  • First Class Functions: Passing Functions as Arguments 14:44
  • First Class Functions: Functions Returning Functions 08:27
  • Immediately Invoked Function Expressions (IIFE) 06:19
  • Closures 16:24
  • Bind, Call and Apply 16:44
  • Coding Challenge 4 06:49
  • Coding Challenge 4: Solution, Part 1 17:47
  • Coding Challenge 4: Solution, Part 2 15:46
• 6. Putting It All Together: The Budget App Project 27 Videos 04:55:35
  • Section Intro 01:11
  • Project Setup and Details 04:26
  • Project Planning and Architecture: Step 1 05:17
  • Implementing the Module Pattern 17:12
  • Setting up the First Event Listeners 15:43
  • Reading Input Data 16:10
  • Creating an Initialization Function 05:09
  • Creating Income and Expense Function Constructors 09:21
  • Adding a New Item to Our Budget Controller 18:02
  • Adding a New Item to the UI 19:28
  • Clearing Our Input Fields 11:23
  • Updating the Budget: Controller 10:54
  • Updating the Budget: Budget Controller 20:38
  • Updating the Budget: UI Controller 11:41
  • Project Planning and Architecture: Step 2 02:16
  • Event Delegation 03:36
  • Setting up the Delete Event Listener Using Event Delegation 19:13
  • Deleting an Item from Our Budget Controller 17:09
  • Deleting an Item from the UI 07:51
  • Project Planning and Architecture: Step 3 01:46
  • Updating the Percentages: Controller 03:37
  • Updating the Percentages: Budget Controller 14:21
  • Updating the Percentages: UI Controller 11:49
  • Formatting Our Budget Numbers: String Manipulation 19:00
  • Displaying the Current Month and Year 06:48
  • Finishing Touches: Improving the UX 10:17
  • We’ve Made It! Final Considerations 01:10
• 7. Get Ready for the Future: ES6 / ES2015 17 Videos 03:38:10
  • What's new in ES6 / ES2015 04:43
  • Variable Declarations with let and const 16:17
  • Blocks and IIFEs 03:38
  • Strings in ES6 / ES2015 10:02
  • Arrow Functions: Basics 08:04
  • Arrow Functions: Lexical 'this' Keyword 19:11
  • Destructuring 07:51
  • Arrays in ES6 / ES2015 17:19
  • The Spread Operator 09:56
  • Rest Parameters 13:23
  • Default Parameters 07:48
  • Maps 19:53
  • Classes 09:47
  • Classes with Subclasses 15:47
  • Coding Challenge 5 02:46
  • Coding Challenge 5: Solution 30:58
  • How to use ES2015 / ES6 Today! 14:09
• 8. Conclusion 1 Videos 00:01:55
  • Where to Go from Here 01:45