JavaScript 101
Tutorials, videos, and even a book to help you create awesomely interactive stuff using JavaScript.
The Basics
Introduction
If you have never used JavaScript before, get your feet wet with this gentle introduction.
Values and Variables
Get the scoop on how to identify and re-use values in JavaScript by using variables.
Functions
ake your code more modular (and awesome!) by learning all there is to know about functions.
Conditional Statements: If, Else, and Switch
The if, else, and switch keywords form the bulk of what helps your code make decisions as part of its running. Learn all about them!
For, While, and Do...While Loops
Be the coolest kid on the block by learning all about the for, while, and do...while loops to repeat some code.
Commenting Your Code...FTW!
Learn how to use comments to make your code easy to understand for both yourself as well as for others.
Timer Functions
Learn how to delay execution of your code to the specified (or right) time by using setTimeout, setInterval, and requestAnimationFrame.
Variable Scope
Learn the nuances of variable scoping in JavaScript by looking at various examples.
Closures in JavaScript
In very clear and simple terms, learn all about closures and how they work to do all the magical things that they do.
Where Should Your Code Live
Get a boatload of information around whether your JavaScript should live inside the HTML document, as a separate file, or as a combination of both.
Console Logging Basics
Go beyond silly alert statements and learn how to use the console to get a better view into what your code is doing
Object Oriented Programming (OOP)
Of Pizza, Types, Primitives, and Objects
Easily build complex UIs by learning how to identify and build components that rely on other components.
-
Arrays
Easily build complex UIs by learning how to identify and build components that rely on other components.
Strings
Easily build complex UIs by learning how to identify and build components that rely on other components.
When Primitives Behave Like Objects
Easily build complex UIs by learning how to identify and build components that rely on other components.
Numbers
Easily build complex UIs by learning how to identify and build components that rely on other components.
-
Getters and Setters
Easily build complex UIs by learning how to identify and build components that rely on other components.
A Deeper Look at Objects
Easily build complex UIs by learning how to identify and build components that rely on other components.
Adding and Removing Properties on an Object
Easily build complex UIs by learning how to identify and build components that rely on other components.
Extending Built-in Objects
Easily build complex UIs by learning how to identify and build components that rely on other components.
Using Classes
Easily build complex UIs by learning how to identify and build components that rely on other components.
Booleans and the Stricter === and !== Operators
Easily build complex UIs by learning how to identify and build components that rely on other components.
null and undefined
Easily build complex UIs by learning how to identify and build components that rely on other components.
All about JSON
Easily build complex UIs by learning how to identify and build components that rely on other components.
Diving Into Sets
Easily build complex UIs by learning how to identify and build components that rely on other components.
The DOM
JavaScript, the Browser, and the DOM
Easily build complex UIs by learning how to identify and build components that rely on other components.
Finding Elements In The DOM Using querySelector
Easily build complex UIs by learning how to identify and build components that rely on other components.
Modifying DOM Elements
Easily build complex UIs by learning how to identify and build components that rely on other components.
Setting CSS Styles using JavaScript
Easily build complex UIs by learning how to identify and build components that rely on other components.
Traversing the DOM
Easily build complex UIs by learning how to identify and build components that rely on other components.
Creating, Removing, and Cloning DOM Elements
Easily build complex UIs by learning how to identify and build components that rely on other components.
Dealing with Events
Introduction to Events
In this introductory tutorial, learn how to make your applications interactive by using Events.
Event Capturing and Bubbling
Get a deeper look at how events work by understanding bubbling, capturing, stopping propagation, and more!
Mouse Events
Learn all about how to work with the mouse by learning about the various events and the properties they expose.
Running Your Code at the Right Time
Run your code at the right time by making sense of DOMContentLoaded, load, async, defer, and position in the DOM!
Handling Events for Many Elements
Without bloating your code, learn how to rely on event propagation to easily and efficiently listen for events on many elements.
Keyboard Events
Learn all about how to work with the keyboard by both learning some boring stuff as well as seeing some awesome examples!
Custom Events
Don't just use events that others have created. Be courageous and learn how to create your own events!
Going Deeper
CSS Variables + JavaScript = Win!
Learn how CSS custom properties (variables) make setting complex CSS property values via JavaScript a total breeze.
Page Navigation on Click
Learn how to use JavaScript to specify a URL and navigate to a different page when you click on something.
Preloading Images
Learn how to use JavaScript to silently preload images before you need to use them.
Detecting If the User is Idle or Inactive
Make your app behave differently when users are not actively interacting with it.
Custom Data (data-*) Attributes
Learn how to embed data into your page or application by using custom data attributes in HTML5.
Storing Data Using Web (aka Local) Storage
Learn how to use local and session storage to easily store and retrieve data from your user's browser.
Making HTTP Requests in JavaScript
Learn all about the XMLHttpRequest object and how it makes sending and receiving data a breeze!
Displaying PHP Data in HTML
Easily build complex UIs by learning how to identify and build components that rely on other components.
Generating Random Numbers
Learn how to generate a range of random numbers that fall within an upper and lower range you specify.
Generating Random Colors
Give your designs some flair by using the code here to generate random colors...like a pro!
Variable and Function Hoisting
Learn about a JavaScript optimization (and its strange consequences!) that promotes your variable and function declarations to the top of their scope.
Doing More with Arrays
Arrays
Easily build complex UIs by learning how to identify and build components that rely on other components.
Mapping, Filtering, and Reducing Things in an Array
Easily build complex UIs by learning how to identify and build components that rely on other components.
Useful Array Tricks
Easily build complex UIs by learning how to identify and build components that rely on other components.
Shuffling an Array
Easily build complex UIs by learning how to identify and build components that rely on other components.
Picking a Random Item from an Array
Easily build complex UIs by learning how to identify and build components that rely on other components.
Hashtables vs. Arrays
Easily build complex UIs by learning how to identify and build components that rely on other components.
Swapping Items in an Array
Easily build complex UIs by learning how to identify and build components that rely on other components.
Filtering Items In A List
Easily build complex UIs by learning how to identify and build components that rely on other components.
Removing Duplicate Arrays from an Array of Arrays
Easily build complex UIs by learning how to identify and build components that rely on other components.
Device Stuff
Getting the Mouse Click Position
Easily build complex UIs by learning how to identify and build components that rely on other components.
Getting the Mouse Movement Direction
Easily build complex UIs by learning how to identify and build components that rely on other components.
Check If You Are On a Touch Enabled Device
Easily build complex UIs by learning how to identify and build components that rely on other components.
Accessing Your Webcam in HTML
Easily build complex UIs by learning how to identify and build components that rely on other components.
The Battery Status API
Easily build complex UIs by learning how to identify and build components that rely on other components.
Shenanigans
The Konami Code Challenge
Easily build complex UIs by learning how to identify and build components that rely on other components.
The Devowelizer
Easily build complex UIs by learning how to identify and build components that rely on other components.
Dynamically Create and Populate List Items
Easily build complex UIs by learning how to identify and build components that rely on other components.
Going from a String to a Number
Easily build complex UIs by learning how to identify and build components that rely on other components.
Checking If A File Exists
Easily build complex UIs by learning how to identify and build components that rely on other components.
Rounding Numbers
Easily build complex UIs by learning how to identify and build components that rely on other components.
Detect Whether a Font is Installed
Easily build complex UIs by learning how to identify and build components that rely on other components.
Using Emojis in HTML, CSS, and JS
Easily build complex UIs by learning how to identify and build components that rely on other components.
