Learn JavaScript Correctly - Beginner to Advance

JavaScript Cheatsheet

Download it, print it and keep it next to your desk.

• Download JavaScript Cheatsheet (PDF)
• Star JavaScript Cheatsheet on Github
• Share Cheatsheet Link: https://ilovecoding.org/blog/js-cheatsheet

Changelog:

Update #4:

Cheatsheet updated to reference concepts of var, let and const

Update #3:

Added additional topics:

• Understanding 'this' keyword
• 3 scenarios that impact the 'this' keyword
• Understanding Constructors function in JavaScript
• When and how to use custom constructors
• Using built-in constructors
• Using Prototype property (to improve performance)

Update #2:

Added additional topics:

• Clear all tasks (From To-Do List App)
• DomContentLoaded Event
• Homework on Events
• Global Scope and Avoiding Pitfalls
• IIFE: Immediately Invoked Function Expression
• Arrow Functions
• Closures
• Project: Tooltip Effect
• Template Literals
• Prototype
• Array methods: .filter() .find() .forEach() .map() .reduce()
• Date
• Math
• Promise
• Fetch
• Project: Get Population By Country

Update #1:

Launched the course with the following main topics:

• Tools and Setup
• History of JavaScript
• JavaScript Engine in Node.js and the Browser
• Types in JavaScript: Primitive and Objects
• Functions, Arrays, Methods, Variables, Expression, Statement
• Type checking
• Static vs Dynamic type languages
• Variable Hoisting & Function Hoisting 
• Scope, Scope Chain, and Lexical Environment
• Code Formatting and coding ethics
• Operators: Arithmetic, assignment, logical, comparison etc
• === vs == operator
• setTimeout, setInterval, clearTimeout, clearInterval
• Call Stack, Event Loop, and Message Queue
• "arguments" keyword
• Spread Operator "..."
• Default Parameters
• By reference vs by value
• Understanding the browser + Browser API
• Understanding the DOM
• Query, Create, Update, Delete DOM elements
• Events and Event Listeners
• Project: To-Do List App
• Homework-Solution: To-Do List App
• Event Bubbling

Full Video Transcript

Please ignore typos, it's a computer who transcribed it.

Hello and welcome to probably the best beginner to advanced course on JavaScript on planet Internet. In this course you will go from a complete newbie knowing nothing about programming or JavaScript for that matter to becoming comfortable in building real-world apps; And understanding each line of code that you actually write.

Now before I go further I want to say good job on choosing JavaScript as a programming language to learn. You may already know that JavaScript is the world's most versatile programming language - meaning you can do more things with JavaScript than any other programming language.

JavaScript is used to build web applications, website APIs, backend, front-end, user interfaces for TV's, mobile apps, websites and even airport terminal applications. In fact, I was one of the programmers who built the United Airlines airport terminal application with JavaScript. Well that's a story for another day, but the fact of the matter is you have made a wise choice to learning JavaScript. It's going to serve you well in your career now, and in the long run.

Now let's see what you will be learning in this course:

There are only three goals for this course.

Firstly, have you learn the fundamentals of JavaScript.

Secondly, have you start thinking like a software engineer.

And thirdly, have you start building real-world apps - Someone who can think logically on how to break down problems into logical chunks and build something useful piece by piece.

When learning how to code and there are a few challenges that people encounter. One of the biggest challenges is that programming has a lot of complex words like closure, lexical scope, boolean, array, function, constructor, scope, operators, coercion, public and private functions, and so much more.

Now the thing is that all of these terms look complicated, sound complicated, but if understood simply they're very basic and simple. That's where this course shines. I will not only teach you how to code but I will expose you with these words so you understand them and even start talking like a developer.

The second place where this course shines is that I explain to you things simply. I use easy to understand words and I do not make assumptions that you'll have previous knowledge of other concepts. So everything I teach in this course starts from the baseline and I build your knowledge one lesson at a time until you fully understand all the major concepts.

The third and very important reason why this course will help you better is that I always give you practical examples on when and how to apply your knowledge to build real-world solutions. Many books, blogs, bootcamps, and lectures just go on in the technical conceptual side. In this course, you will learn not just the conceptual side of things but also the practical side on everything you learn. When you tie your learning with examples and real use-cases, your knowledge will actually sink in on a deeper level and you'll be able to become a much better developer in the end.

In this course, we will focus on building a solid foundation of JavaScript. So in the future when you are learning additional technologies your learning will be much more smoother because you have a solid foundation.

In this course. You will learn:

• What is JavaScript and how it's different than other programming languages.
• What are the basic types in JavaScript and how to use them.
• How to use JavaScript to build a website interfaces and backend server-side applications with node.js.
• How to create simple and complex objects to structure your application.
• How to use functions and scope to control the flow of your application.
• How to use the new features of JavaScript like the "spread operator", "const", "let", "promise" and much more.
• We will learn the advanced concepts of "closure", the "this" keyword and really understand them at a very core level, so you are actually a good developer.
• We will learn about the DOM and how to use vanilla JavaScript to build apps.
• We will learn about events and how JavaScript is a single-threaded environment and still extremely fast and performant.
  
  There is a reason why PayPal, Uber, LinkedIn, and many other companies are using JavaScript to build their apps.
• We will learn about "arrow function", "coercion", "event loop" and so much more.
• You will learn about how to debug your applications and understand the error messages that you see on the screen.
• You see errors and bugs are common. No app is created without having errors.
  
  So most new developers think that bugs are bad, but actually, they're not. Having bugs or error messages is a normal process in a developers life.

So I will make you comfortable that when you see a bug or an error message you're very comfortable in seeing what it is recognizing it and then fixing the problem. This is just the normal flow of a developers life. 

Don't iPhone have bugs? Doesn't Microsoft products have bugs? They are the technology giants. They build technologies so it's a great realization for us to have that bugs are normal. It's our job as a developer to understand these errors and earn how to fix them. I will also show you how to use the dev tools built inside Google Chrome to troubleshoot your apps and resolve bugs.

You will learn how to connect your apps with third-party API and get information from them and use it in your apps. Now keep in mind all these complicated words that I've used so far, you will understand all of them because I will take you piece by piece and explain them all to you. I will give you a cheat sheets homework and examples along the way so you understand all of the concepts.

Along the way you will build a few apps like a "todo list app", a "clock app" a "Tap feature" so you understand things at its core and how to apply these concepts.

Just so this course does not become overly long, you will find a lot of practice projects lessons outside of this course. So in the member's area often of coding so you get a ton of practice on building things and applying your knowledge.

Imagine you finally conquering your fear of coding. Imagine you are finally thinking and building like a software engineer. Imagine your starting or enhancing your career as a software engineer. And imagine finally that your understanding JavaScript at its core and understanding what you see on the screen and building real-world stuff.

If all this excites you, let's get started.