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:

Filters

HTML Templates

Quick Tip: Create a Very Simple Parallax Effect With CSS & JavaScript

Tutorial • Intermediate

In this short tutorial, we'll learn to add a simple yet useful parallax scrolling effect to a hero image. To achieve it, we'll use some JavaScript code. Keep...

George Martsoukos • 15 Apr 2019
JavaScript for Designers

How to Build a Static Portfolio Page With CSS & JavaScript

Tutorial • Intermediate

In this tutorial we’ll use all the power of flexbox and learn to build a simple, yet attractive static HTML portfolio page.

George Martsoukos • 2 Apr 2019
HTML

New Course: Take Your Presentations to the Next Level With Reveal.js

Tutorial • Beginner

Learn all about the Reveal.js HTML presentation framework in our new short course, Take Your Presentations to the Next Level With Reveal.js.

Andrew Blackman • 2 Apr 2019
Animation

Better Data Presentation for Infographics: Practical Animation Examples

Tutorial • Beginner

Using the animation framework we created previously, in this tutorial you’ll learn how to animate three infographic examples: data counters, progress bars,...

Karen Pogosyan • 21 Mar 2019
HTML

Dropdown Navigation: How to Maintain the Selected Option on Page Load

Tutorial • Intermediate

Today we'll learn how to maintain the selected option when navigating to a new page using a element.

George Martsoukos • 19 Dec 2018
JavaScript for Designers

How to Build a SaaS Dashboard in React With Google Sheets and FusionCharts

Tutorial • Beginner

In this tutorial I’ll explain the process of creating a SaaS dashboard by fetching data from Google Sheets using the Google Sheets API. To create this...

Gagan Sikri • 18 Dec 2018
JavaScript for Designers

New Short Course: Interactive JavaScript Maps With Leaflet

Tutorial • Beginner

Leaflet is a robust JavaScript framework for creating interactive maps on the web. Learn how to use it in our quick half-hour course, Interactive JavaScript...

Andrew Blackman • 5 Dec 2018
UI Design

New Course: Essential JS Libraries for UI

Tutorial • Beginner

Learn how to use JavaScript libraries for UI design in our new course, Essential JS Libraries for User Interfaces (UI).

Andrew Blackman • 31 Oct 2018
JavaScript for Designers

Learn 3D Web Animation in Our New Three.js Course

Tutorial • Beginner

If you want to improve your 3D web animation skills but have limited time available, our new course, 3D Animation With Three.js, is for you.

Andrew Blackman • 19 Oct 2018
JavaScript for Designers

How to Create an Animated Spirit Day Presentation With fullPage.js

Tutorial • Intermediate

October 18th 2018 is Spirit Day, something we recognize each year at Tuts+, and on this day we speak out against LGBTQ bullying, especially among LGBTQ youth.

George Martsoukos • 18 Oct 2018
Animation

11 Practical Web Animation Courses

Tutorial • Beginner

Here are 11 courses that will teach you how to create beautiful animations with CSS, JavaScript, and dedicated frameworks like GreenSock and Sequence.js.

Andrew Blackman • 16 Oct 2018
JavaScript for Designers

Quick Tip: How to Manipulate the Cursor Appearance With CSS

Tutorial • Beginner

In this quick tip, we’ll learn how to customize the cursor appearance with CSS. We’ll be changing our cursor into arrows to make navigating a slideshow easier.

George Martsoukos • 8 Oct 2018