When will I have access to the lectures and assignments?

To access the course materials, assignments and to earn a Certificate, you will need to purchase the Certificate experience when you enroll in a course. You can try a Free Trial instead, or apply for Financial Aid. The course may offer 'Full Course, No Certificate' instead. This option lets you see all course materials, submit required assessments, and get a final grade. This also means that you will not be able to purchase a Certificate experience.

What will I get if I subscribe to this Specialization?

When you enroll in the course, you get access to all of the courses in the Specialization, and you earn a certificate when you complete the work. Your electronic Certificate will be added to your Accomplishments page - from there, you can print your Certificate or add it to your LinkedIn profile.

Is financial aid available?

Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.

Interactivity with JavaScript

Interactivity with JavaScript

This course is part of Web Design for Everybody: Basics of Web Development & Coding Specialization

Instructors: Colleen van Lent, Ph.D.

230,101 already enrolled

Included with

Learn more

4 modules

Gain insight into a topic and learn the fundamentals.

7,374 reviews

Beginner level

No prior experience required

Flexible schedule

1 week at 10 hours a week

Learn at your own pace

98%

Most learners liked this course

4 modules

Gain insight into a topic and learn the fundamentals.

7,374 reviews

Beginner level

No prior experience required

Flexible schedule

1 week at 10 hours a week

Learn at your own pace

98%

Most learners liked this course

What you'll learn

Understand how JavaScript is used to react to user events.
Write your own JavaScript code to let a person interact with your page.
Discuss how JavaScript can introduce accessibility issues.

Skills you'll gain

Tools you'll learn

Details to know

Shareable certificate

Add to your LinkedIn profile

Assessments

3 assignments

Taught in English

91%

of learners achieved a positive career outcome

See how employees at top companies are mastering in-demand skills

Learn more about Coursera for Business

logos of Petrobras, TATA, Danone, Capgemini, P&G and L'Oreal

Build your subject-matter expertise

This course is part of the Web Design for Everybody: Basics of Web Development & Coding Specialization

When you enroll in this course, you'll also be enrolled in this Specialization.

Learn new concepts from industry experts
Gain a foundational understanding of a subject or tool
Develop job-relevant skills with hands-on projects
Earn a shareable career certificate

There are 4 modules in this course

If you want to take your website to the next level, the ability to incorporate interactivity is a must. But adding some of these types of capabilities requires a stronger programming language than HTML5 or CSS3, and JavaScript can provide just what you need. With just a basic understanding of the language, you can create a page that will react to common events such as page loads, mouse clicks and movements, and even keyboard input.

This course will introduce you to the basics of the JavaScript language. We will cover concepts such as variables, looping, functions, and even a little bit about debugging tools. You will understand how the Document Object Model (DOM) is used by JavaScript to identify and modify specific parts of your page. After the course, learners will be able to react to DOM Events and dynamically alter the contents and style of their page. The class will culminate in a final project - the creation of an interactive HTML5 form that accepts and verifies input. This can be completed as the third or fourth course in the Web Design For Everybody specialization.

Module details

If you haven't use a traditional programming language before, this first week is key. Before we begin with the how, we will talk about the why, mainly why we want to use JavaScript. The main reason is that it is very easy for JavaScript to work with the DOM. And easy is always a great way to start. Speaking of starting out, it is also always more fun when our code actually does something we can see, so we will jump quickly into different ways we can generate output. It won't be flashy yet, but it will be a great way to get your feet wet with traditional programming. After that we go back to the basics of how a computer uses data. We begin with variables, expressions, and operators.

What's included

12 videos9 readings1 assignment1 discussion prompt

12 videosTotal 80 minutes

Introduction to JavaScript4 minutes
DOM Review with Object Oriented Programming7 minutes
Newer DOM Methods5 minutes
Output13 minutes
Variables9 minutes
Data Types8 minutes
Operators and Expressions8 minutes
Getting Started with Github5 minutes
Downloading and Uploading Code with VSCode and Github4 minutes
Copying Code with GitHub Codespaces4 minutes
Uploading to GitHub Pages8 minutes
Review: Publishing Your Site5 minutes

9 readingsTotal 42 minutes

Course Syllabus10 minutes
Pre-Course Survey5 minutes
Course Resources4 minutes
"What are these deadlines?"3 minutes
Resources2 minutes
The Document Object Model (DOM)5 minutes
Accessing the DOM Methods10 minutes
Semicolons1 minute
Trying to Create and Debug Your Own Output2 minutes

1 assignmentTotal 40 minutes

Week One Quiz40 minutes

1 discussion promptTotal 10 minutes

Share Your Tips10 minutes

If you have written HTML code in the past, hopefully you have fallen into the great habit of validating your code -- making sure that you close all of your open tags. There are other rules that you may or may not have been following as well, for instance the importance of using each id attribute only once per page. This is called writing "clean" code. The reasoning and importance of following these rules becomes clear as we begin to manipulate the different components of your webpage based on the the actions of the person interacting with your page. In particular you will learn about the JavaScript Mouse Events and Touch Events. This week's materials will end with a photo gallery example that you can create along with me.

What's included

7 videos7 readings1 assignment1 peer review1 app item

7 videosTotal 53 minutes

Functions7 minutes
Code Placement7 minutes
Folder Structure / Organizing Your Code6 minutes
Events10 minutes
Code With Me: Events8 minutes
"this"10 minutes
Homework: JavaScript Interactive Photo Gallery6 minutes

7 readingsTotal 36 minutes

Resources2 minutes
Functions3 minutes
Organizing Your Code3 minutes
Mastering Events and Functions10 minutes
Just a little note before the next video3 minutes
Homework Time!!5 minutes
Introduction to the Gamut Gallery10 minutes

1 assignmentTotal 30 minutes

Week Two Quiz30 minutes

1 peer reviewTotal 45 minutes

JavaScript Interactive Photo Gallery45 minutes

1 app itemTotal 10 minutes

Homework: Optional Submission Gallery10 minutes

This week we will delve into more complex programming concepts: arrays and looping. Arrays allow you to represent groups of related information. Looping provides efficiency and flexibility to your programs. Using both we will expand upon the photo gallery example.

What's included

2 videos5 readings1 assignment

This week is all about putting concepts together to do "cool" things. And we even stop for a second to talk about the the trade-off between cool things and accessibility. The final project this week will be a new version of your coding project in Week 2. You will make an interactive photo gallery from your own images and will add the functionality of keyboard accessibility to it.

What's included

5 videos6 readings1 peer review1 app item

5 videosTotal 33 minutes

Code With Me: Randomizing Your Images Using Arrays8 minutes
Code With Me: Using Lightbox10 minutes
Code With Me: Looping through Images8 minutes
Final Project Description3 minutes
Conclusion3 minutes

6 readingsTotal 35 minutes

Resources5 minutes
Writing loops in JavaScript5 minutes
Advanced Coding Techniques2 minutes
"Cool Stuff" - Friend or Foe?3 minutes
Final Project Description10 minutes
Post-Course Survey10 minutes

1 peer reviewTotal 120 minutes

Final Project: Your Own Accessible Photo Gallery120 minutes

1 app itemTotal 10 minutes

Final Project: Optional Submission Gallery10 minutes

Earn a career certificate

Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.

Instructors

Instructor ratings

(640 ratings)

Colleen van Lent, Ph.D.

University of Michigan

11 Courses734,058 learners

Offered by

University of Michigan

Learner reviews

5 stars
75.71%
4 stars
18.89%
3 stars
4.17%
2 stars
0.77%
1 star
0.44%

Showing 3 of 7374

Reviewed on Sep 1, 2020

A really wonderful course to understand the basics and technicalities of JS. This course is explained in the way as simple and easy as possible. Its a good choice to enroll in this course

Reviewed on Jul 27, 2017

It's a great course to begin understand JavaScript. It gives you needed basics of JS. And Colleen van Lent is excellent teacher, she helps you in this journey called "coding with JS".

Reviewed on Feb 7, 2018

Well explained, I learned some interactivity with HTML by learning native JavaScript (was using jQuery always)... Perhaps I expected some more advanced stuff than this (like audio, video, canvas).

View more reviews