π Top Posts
Quick Intro to the Payment Request API
In this post you'll see the basic usage for collecting payment information through the Payment Request API.
Introduction to Sets in JavaScript
Sets allow the creation of collections of unique values. See how they are used in this quick intro.
JSON.parse() and JSON.stringify()
A quick reference for the parse and stringify methods of the JSON object.
Educative.io: Learn by Coding ⤵
Go from scratch to building apps. Check out βThe Complete JS CourseβUsing JavaScript Mixins
A quick peek at JavaScript mixins and how to use them with classes.
Read JavaScript Source Code, Using an AST
A quick guide to automate extracting information from your JavaScript code with abstract syntax trees (AST).
JavaScript Regular Expressions for Regular People
Overcome your fear of regular expressions (regex) with this gentle introduction to regular expressions in JavaScript.
The JavaScript Prototypal Inheritance Pattern
A quick introduction to understand how prototype-based inheritance works in JavaScript.
JavaScript Object Oriented Patterns: Factory Pattern
A brief look at the factory pattern, what's its used for and its implementation in JavaScript.
Objects, Prototypes and Classes in JavaScript
This is a short summary on how prototypes are essential for Object Oriented programming (OOP) in JavaScript with a brief look at ES6 classes.
Tricks with JavaScript Destructuring
Object and array tricks for the veteran and beginner alike, centered around pulling things apart using destructuring.
Custom-Styled JavaScript Console Logging
A fun project you can do in just 10 minutes that will help you learn more about the JavaScript console API's styling options as well as ES6 classes and modules.
Don't Be Afraid of the JavaScript Stack Trace
A beginner-friendly overview of the JavaScript stack trace and tips on how to use it.
Flatten Arrays in Vanilla JavaScript with flat() and flatMap()
An overview of two new methods available on the Array prototype in JavaScript: flat and flatMap.
A Look at the Channel Messaging API
The Channel Messaging API allows the main JavaScript thread to communicate with workers like Service Workers. This post will show you how it's done.
First Steps with the Cache API
The Cache API is a relatively new JavaScript API that allows to create performant browsing experiences by giving developers control over the caching of assets.
Getting Started with Service Workers
Service Workers are at the core of Progressive Web Apps, a set of technologies that makes mobile apps possible with the Web stack.
Using JavaScript's sort Method for Sorting Arrays of Strings
In this post we're digging into the array sort method for sorting strings, especially when it comes to strings with mixed cases.
Error Handling in JavaScript Using try...catch
Learn how to properly handle errors in your JavaScript apps using the try/catch/finally construct as well as the throw statement.
Using JavaScript's sort Method for Sorting Arrays of Numbers
It can be tricky at first to understand the rules for the array sort method in JavaScript. This post should help with that!
Scheduling Tasks in JavaScript Using setTimeout & setInterval
Learn how to use the global setTimeout and setInterval methods in JavaScript to set timers for task execution.
A Look at the JavaScript Console API
Learn some tips and tricks to debug your JavaScript code using some powerful methods available on the console.
Accessing the Clipboard in JavaScript Using the Async Clipboard API
Exploring a new JavaScript clipboard API that makes it easy to read or write text to the clipboard from a web page or a web app.
A Look at the Resize Observer JavaScript API
In this post we'll see how we can use the new ResizeObserver API to react to an element's size changing.
Accessing Rails APIs in JavaScript Clients Using Rails Ranger
Want to create a frontend client on that talks to a Ruby on Rails backend API? Rails Ranger can help with that!
Class Composition in JavaScript
Understand an alternative way to use JavaScript classes for composition instead of inheritance.
A Quick Reference for the This Keyword in JavaScript
Want to quickly know what the this keyword points to? This reference post should help you out.
Your First Steps with the Web Audio API
After this short introduction, you'll be making noise with your browser using the Web Audio API.
Exploring the JavaScript Date Object
Getting familiar with the date object is very useful iff you want to deal with dates using vanilla JavaScript.
substring vs substr in JavaScript
A brief look at the difference between the substring and substr string methods in JavaScript.
Using the Geolocation API
Learn about the JavaScript Geolocation API to get a device's current coordinates using the getCurrentPosition and watchPosition methods.
Exploring Async/Await Functions in JavaScript
In this post we're quickly going over the ins and outs of async/await functions; introduced with ES2017 to help write synchronous-looking code.
A Fetch API Primer
In this quick post we'll go over using the Fetch API to GET or POST some JSON data to an external resource. We'll also go over proper error handling.
Dealing With Objects in JavaScript With Object.assign, Object.keys and hasOwnProperty
A short post to help you quickly grasp how to use a few very useful methods available to work with objects in JavaScript.
The Web Share API
Learn how to use the Web Share API for a simple way to integrate your device's native sharing capabilities into your website or web app.
Detect Network Status With navigator.onLine
Learn how to easily detect if the browser has access to the Internet with navigator.onLine or the online and offline window events.
Using the Intersection Observer API to Trigger Animations and Transitions
Learn about IntersectionObserver and how it can be used to easily trigger CSS animations or transitions when elements come into view.
Copying to Clipboard Using Vanilla JavaScript
You're a dozen lines of code away from implementing a copy to clipboard functionality using 0 libraries.
slice vs splice in JavaScript
A quick rundown of the differences between the slice and splice array methods in JavaScript.
JavaScript String Replace
Just a quick reference on using JavaScript's string replace method for easy text replacements.
Object.values and Object.entries in JavaScript
Extract arrays of values or of key-value pairs using the new Object.values and Object.methods available with ES2017 (ES8).
Adding, Removing & Toggling Classes With classList in JavaScript
The classList object makes it easy to add, remove, toggle or check for the presence of classes on elements without having to do string operations.
Introduction to Maps in JavaScript
Maps were introduced with ES6/ES2015, and they are similar to objects. Here's an overview of using maps and the benefits over objects.
for...of vs for...in Loops in JavaScript
Forget about traditional for loops, use for...of and/or for...in to iterate over arrays, strings and objects.
Speed Up Scroll Events with Passive Event Listeners
Improve your site's scrolling and touch performance by using passive event listeners for events.
Default Parameters in JavaScript with ES6 / ES2015
See how you can now easily specify default function parameter values in JavaScript.
padStart and padEnd String Methods in JavaScript
padStart and padEnd a two new string methods in JavaScript that make it easy to add character padding to the beginning or end of strings.
Tagged Template Literals With ES6 / ES2015
Tagged template literals allow you to pass a function to be executed on the literal before it gets evaluated.
Introduction to localStorage and sessionStorage
Learn how to use localStorage and sessionStorage in your web apps.
Lazy Loading Scripts
An easy way to lazily load scripts on certain DOM events. In this example, we load the search script only on the user focus in a search input.
Service Workers: Using SW-Toolbox to Serve an Offline Page
Use Service Workers with SW-Toolbox to not only serve assets from the cache, but also to serve a custom offline page.
A Page Progress Bar with JavaScript and CSS Variables
An easy way to implement a page scroll progress indicator with JavaScript and CSS custom properties.
Object and Array Destructuring in JavaScript with ES6
Destructuring for objects and arrays is a nice new set of syntactic shortcuts that we can now use in our JavaScript code.
ES6 Modules
ES2015 (ES6) gives us native support for modules. Learn their simple syntax here.
A Simple Page Fade-In With JavaScript
Implement a very simple page fade-in effect for your site with some minimal JavaScript and a touch of CSS.
Accessing Elements With querySelector and querySelectorAll
Easily select Elements in Pure JavaScript with querySelector and querySelectorAll.
Pop, Push, Shift and Unshift Array Methods in JavaScript
Four useful methods to add or remove to the end or beginning of arrays in JavaScript.
A Quick Introduction to the Yarn Package Manager
Yarn is a new package manager for JavaScript that aims to be a faster and safer alternative to npm. Learn the basic commands to get you up and running.
Let and Const in JavaScript with ES6 / ES2015
ES6 / ES2015 gives us two new keywords to declare variables: let and const. Learn how to use them and the difference with var.
Introduction to Progressive Web Apps: Service Worker and Web App Manifest
Progressive web apps allow you to create web apps that feel native by allowing access while offline & installing on the home screen. Get a big picture here.
Object Property Value Shorthand in JavaScript with ES6
New with ES6 / ES2015, property shorthands allow you to save time with object definition in JavaScript.
Generator Functions in JavaScript with ES6 / ES2015
New with ES6 / ES2015, generator functions allow to easily define functions that can return multiple values.
Rest Parameters in JavaScript with ES6 / ES2015
New with ES6 / ES2015, rest parameters allow you to more easily work with functions with an arbitrary number of arguments passed-in.
Promises in JavaScript with ES6 / ES2015
Promises allow you to more easily write asynchronous code in JavaScript. Learn their syntax in this quick post.
Using DOMParser to Parse HTML Strings
DOMParser can be used to create a DOM object from an HTML or XML string. See here how it's used.
Template Literals in ES6 / ES2015
Quick post on how to use template literals, also known as template strings, in the latest version of JavaScript for multiline strings or string interpolation.
console.time() & console.timeEnd() in JavaScript
Use console.time() and console.timeEnd() to see how your code performs.
console.table() in JavaScript
Display data in tables in the console with the table() method.
Arrow Functions in JavaScript
Get familiar with the new JavaScript syntax for arrow functions in ES6.
charCodeAt() String Method in JavaScript
Get the unicode value of a character at a specific position in a string with the charCodeAt method.
charAt() String Method in JavaScript
Get a character at a specific position in a string with the charAt method.
toLowerCase() and toUpperCase String Methods in JavaScript
Convert a string's characters to lower or upper case with toLowerCase() or toUpperCase.
includes() String Method in JavaScript
Check if a string contains another string in just one line of code in JavaScript with the includes method.
Ternary Operator in JavaScript
Simplify the syntax of simple if statements with the ternary operator. Here's how to use it.
reduce() Array Method in JavaScript
Use reduce() on an array in JavaScript to apply a function on the array and reduce it to a single value
JavaScript Reserved Keywords
A list of reserved keywords in JavaScript.
Holmes: Fast Page Searching
Holmes is a small JavaScript library that makes it easy to filter content in a list. The obvious use case is for filtering and searching content on a page.
split() String Method in JavaScript
Use split() on a string to split it into an array using a separator of your choice.
concat() Array Method in JavaScript
Use concat() on an array to concatenate with another array.
Share Button: Simple & Stylish Share Button
A simple, compact and beautiful share button for your website.
clipboard.js: Copy Text to the Clipboard
Easily copy text to clipboard in the browser with clipboard.js
Comments in JavaScript
Reference snippet on using comments in JavaScript.
For Loops in JavaScript
A quick snippet with the syntax of for loops in JavaScript.
push() Array Method in JavaScript
Use push() on arrays to add new items to an array.
filter() Array Method in JavaScript
Use filter() on arrays to go through an array and return a new array with the elements that pass the filtering rules.
map() Array Method in JavaScript
Use map() on arrays to return a new array with its items having passed through a function. Here's a quick snippet.
Immediately-invoked function expressions
Protect your code and avoid polluting with immediately-invoked function expressions (IIFE).