Learn JavaScript for Designers

Bring your websites to life with interactive elements using JavaScript. These tutorials are tailored to web designers and are full of practical examples and tips.

All JavaScript for Designers tutorials:

  1. The Command Line for Web Design: Automation With Grunt

    The Command Line for Web Design: Automation With Grunt

    Tutorial Beginner

    In this tutorial you’ll be learning how to setup task runners and, in the process, you’ll also see an example of bringing in scripts from Bower packages for...

  2. How to Display Update Notifications in the Browser Tab

    How to Display Update Notifications in the Browser Tab

    Tutorial Intermediate

    In this tutorial, we are going to build a form of user feedback, making use of the browser tab as a medium for notifying users of updates. Let’s see how it’s...

  3. How to Install NPM and Bower

    How to Install NPM and Bower

    Tutorial Beginner

    In this tutorial you’ll learn how to make handling third party packages a matter of just typing a handful of two to five word commands.

  4. Mura CMS: Template Variables

    Mura CMS: Template Variables

    Tutorial Intermediate

    When building your themes you will want to bring in dynamic content from your Mura site to display meta information, titles, body and so on. This tutorial...

  5. The Command Line for Web Design: Grasping the Basics

    The Command Line for Web Design: Grasping the Basics

    Tutorial Beginner

    In this tutorial you’ll learn all the essentials of working with a terminal or command prompt including how to open it, how to run commands, how to repeat...

  6. The Command Line for Web Design: Introduction

    The Command Line for Web Design: Introduction

    Tutorial Beginner

    This is a series specifically for web designers, showing you how to utilize command line tools that are incredibly useful specifically for web design projects.

  7. Bootstrap 3 Succinctly: Changed JavaScript Features

    Bootstrap 3 Succinctly: Changed JavaScript Features

    Tutorial Intermediate

    We'll continue our series on the new features in Bootstrap 3 by looking at what's changed with the JavaScript features.

  8. CSS Feature Detection: Modernizr or Feature Queries?

    CSS Feature Detection: Modernizr or Feature Queries?

    Tutorial Intermediate

    In this tutorial, I’ll go over two approaches for detecting whether a browser supports certain CSS features or not. The first one takes advantage of...

  9. TimelineMax: A Primer

    TimelineMax: A Primer

    Tutorial Intermediate

    What is TimelineMax? What makes it different from other Green Sock Animation Platform (GSAP) libraries? Why would I need TimelineMax over TimelineLite? How...

  10. How to Use jQuery with ZingChart

    How to Use jQuery with ZingChart

    Tutorial Intermediate

    Web charts built with JavaScript are a great way to add interactivity to your apps and sites, but if you prefer working in jQuery, your options can be...

  11. Web Audio and 3D Soundscapes: Introduction

    Web Audio and 3D Soundscapes: Introduction

    Tutorial Intermediate

    In this tutorial we will be taking a close look at the fundamental Web Audio elements that are used to construct 3D soundscapes for immersive interactive...

  12. Introducing the HTML5 “Menu” and “Menuitem” Elements

    Introducing the HTML5 “Menu” and “Menuitem” Elements

    Tutorial Beginner

    Today I’m going to introduce you to two elements: and , part of the Interactive Elements specification. The web has evolved into something more than just...