Building Interactive Web Pages Using Modern JavaScript

Grow your skills with Coursera Plus for $239/year (usually $399). Save now.

Building Interactive Web Pages Using Modern JavaScript

This course is part of Frontend Development using React Specialization

Instructor: NIIT

2,380 already enrolled

Included with

Learn more

8 modules

Gain insight into a topic and learn the fundamentals.

12 reviews

Beginner level

No prior experience required

3 weeks to complete

at 10 hours a week

Flexible schedule

Learn at your own pace

8 modules

Gain insight into a topic and learn the fundamentals.

12 reviews

Beginner level

No prior experience required

3 weeks to complete

at 10 hours a week

Flexible schedule

Learn at your own pace

What you'll learn

Build interactive, optimized, and testable web applications using JavaScript

Skills you'll gain

Tools you'll learn

Details to know

Shareable certificate

Add to your LinkedIn profile

Assessments

8 assignments

Taught in English

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 Frontend Development using React 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 8 modules in this course

Most businesses with a strong online presence wish to provide its consumers a rich interactive user experience. HTML5 and CSS3 frameworks help you build a static web page, that displays content and works on any device. However, to make a page interactive you need a programming language that can be understood by the browsers. JavaScript is one of the core technologies of the World Wide Web.

JavaScript is a versatile language to build both frontend and backend applications. In this learning sprint you will learn about dynamic typing, loops, conditional statements and functions .

What's included

13 videos2 readings1 assignment1 programming assignment

13 videos Total 41 minutes

Context Setting 2 minutes
Identify the different datatypes available in JavaScript 6 minutes
Watch and Repeat : Hello World Alert 2 minutes
Create dynamically typed variables 4 minutes
Watch and Repeat : JavaScript Datatypes 4 minutes
Use conditionals in JavaScript 3 minutes
Use the loop constructs to perform repetitive tasks 3 minutes
Watch and Repeat : Conditional Statements 3 minutes
Modularize the code by creating functions 3 minutes
Watch and Repeat : Functions 4 minutes
Practice Brief 2 minutes
Practice Debrief 3 minutes
Learning Consolidation 1 minute

2 readings Total 20 minutes

Instructions to upload the Programming Assignment Solution 10 minutes
Get Started with JavaScript Routines 10 minutes

1 assignment Total 30 minutes

Get Started with JavaScript Routines 30 minutes

1 programming assignment Total 75 minutes

Getting started with JavaScript Programs 75 minutes

Most of the data exchanged between Client and Server these days is JSON. JSON can contain arrays, objects or a combination of them. In this learning sprint you will learn to structure data using Objects and Array and also apply transformations using Array Methods.

What's included

12 videos1 reading1 assignment1 programming assignment

12 videos Total 54 minutes

Context Setting 2 minutes
Filter, transform and aggregate data using Array functions 9 minutes
Watch and Repeat : Create and Access Array Elements 7 minutes
Watch and Repeat : Perform Array Operations 5 minutes
Watch and Repeat : Using Array Functions 7 minutes
Watch and Repeat : Chaining Array Functions 5 minutes
Watch and Repeat : Create Object Using Initializer and Constructor 7 minutes
Model data using Arrays and Objects 2 minutes
Watch and Repeat : Operations on Complex Data Structures 5 minutes
Practice Brief 2 minutes
Practice Debrief 2 minutes
Learning Consolidation 1 minute

1 reading Total 10 minutes

Wrangle Data using Objects and Arrays 10 minutes

1 assignment Total 15 minutes

Wrangle Data using Objects and Arrays 15 minutes

1 programming assignment Total 75 minutes

Resolve impedance mismatch in task board renderer 75 minutes

Interactive Web Pages provide great User Experience. They just don't respond to user's interactions but also keeps them engaged and coming back for more. JavaScript is the way to build interactive Web Pages. In this learning sprint you will learn to add interactivity by understanding about DOM and DOM Events.

What's included

15 videos1 reading1 assignment2 programming assignments

15 videos Total 47 minutes

Context Setting 1 minute
Select DOM elements 4 minutes
Watch and Repeat : Understanding Document Object Model 2 minutes
Manipulate DOM to add dynamic effects 5 minutes
Watch and Repeat : Perform DOM Manipulation to Retrieve and Remove DOM Elements 4 minutes
Watch and Repeat : Perform DOM Manipulation to Modify Styles and Add New Elements 3 minutes
Create EventHandlers 2 minutes
Watch and Repeat : Handling Events 1 5 minutes
Register and Unregister EventListeners 3 minutes
Watch and Repeat : Handling Events 2 7 minutes
Practice Brief 3 minutes
Practice Debrief 2 minutes
Challenge Brief 3 minutes
Challenge Debrief 2 minutes
Learning Consolidation 1 minute

1 reading Total 10 minutes

Develop Interactive Web Pages using DOM and DOM Events 10 minutes

1 assignment Total 30 minutes

Develop Interactive Web Pages using DOM and DOM Events 30 minutes

2 programming assignments Total 240 minutes

Theme Changer 75 minutes
Develop Tic-Tac-Toe Game 165 minutes

JavaScript can help you saving lot of network bandwidth by preempting server validation and performing client side validation. In this learning sprint you will learn to validate users data using client side JavaScript.

What's included

8 videos1 reading1 assignment1 programming assignment

8 videos Total 29 minutes

Context Setting 2 minutes
Perform client-side validations 5 minutes
Communicate errors for invalid inputs 4 minutes
Watch and Repeat : Product Feedback Form 9 minutes
Watch and Repeat : Product Feedback Form Toggle Display 3 minutes
Practice Brief 2 minutes
Practice Debrief 4 minutes
Learning Consolidation 1 minute

1 reading Total 10 minutes

Validate User Data using Client Side JavaScript 10 minutes

1 assignment Total 30 minutes

Validate User Data using Client Side JavaScript 30 minutes

1 programming assignment Total 75 minutes

Develop contact form with validation 75 minutes

One of most popular protocols used for exchange of information is HTTP. Browsers and Application Servers exchange information using HTTP Protocol. In this learning sprint you will learn about HTTP, HTTP Methods and how do we exchange information with Application Servers.

What's included

8 videos1 reading1 assignment1 programming assignment

8 videos Total 32 minutes

Context Setting 1 minute
Make HTTP calls 6 minutes
Watch and Repeat : Understanding HTTP and HTTP Methods 6 minutes
Handle HTTP responses 3 minutes
Watch and Repeat : Making HTTP Calls with XHR 8 minutes
Practice Brief 3 minutes
Practice Debrief 4 minutes
Learning Consolidation 1 minute

1 reading Total 10 minutes

Interact with Application Servers using HTTP Protocol 10 minutes

1 assignment Total 30 minutes

Interact with Application Servers using HTTP Protocol 30 minutes

1 programming assignment Total 75 minutes

Implement Persistence on Contact form data 75 minutes

There are tasks which can make pages Unresponsive. Like getting data from the server can be time consuming and can hinder user from using the rest of the application, until the data is received. You will learn to build asynchronous applications using Promises and Callbacks to provide uninterrupted responsive experience to users.

What's included

11 videos1 reading1 assignment2 programming assignments

11 videos Total 42 minutes

Context Setting 3 minutes
Use callbacks for asynchronous programming 5 minutes
Watch and Repeat : Change Background Color Using Callbacks Every 3 Seconds 7 minutes
Use promises for asynchronous programming 6 minutes
Watch and Repeat : Fetch Currency Exchange Rates Using Promise 5 minutes
Watch and Repeat : Fetch Task Board Data Using Callback 6 minutes
Practice Brief 2 minutes
Practice Debrief 2 minutes
Challenge Brief 3 minutes
Challenge Debrief 3 minutes
Learning Consolidation 2 minutes

1 reading Total 10 minutes

Build Asynchronous Data Driven Applications Using Promises and Callbacks 10 minutes

1 assignment Total 30 minutes

Build Asynchronous Data Driven Applications Using Promises and Callbacks 30 minutes

2 programming assignments Total 240 minutes

Develop Promise driven HTTP Client 75 minutes
Develop UI to Fetch and Display Contact Form Data 165 minutes

Static resources like JS, CSS, images usually take large share of network bandwidth causing slow and unresponsive user experience. In this learning sprint you will learn to optimize static assets which is faster and responsive user experience.

What's included

9 videos1 reading1 assignment1 programming assignment

9 videos Total 33 minutes

Context Setting 2 minutes
Create server-side scripts for Node.js 2 minutes
Watch and Repeat : Create Node.js application 5 minutes
Write bundling logic for minification 5 minutes
Watch and Repeat : Minification 2 minutes
Watch and Repeat : Bundling using Webpack 9 minutes
Practice Brief 3 minutes
Practice Debrief 3 minutes
Learning Consolidation 1 minute

1 reading Total 10 minutes

Optimize delivery of static assets using JavaScript 10 minutes

1 assignment Total 30 minutes

Optimize delivery of static assets using JavaScript 30 minutes

1 programming assignment Total 75 minutes

Optimize static assets of contact form application 75 minutes

Producing top quality products requires rigorous testing. Web isn't an exception. In this learning sprint you will learn to think and write test cases using JavaScript Libraries to test your Web Application.

What's included

9 videos1 reading1 assignment1 programming assignment

9 videos Total 39 minutes

Context Setting 6 minutes
Apply Behavior Driven Development (BDD) approach 6 minutes
Develop test cases using Jasmine framework for testing 4 minutes
Watch and Repeat : Get started with Jasmine 3 minutes
Watch and Repeat : Test Basic Calculator Operations 7 minutes
Watch and Repeat : Test Feedback Submission 6 minutes
Practice Brief 2 minutes
Practice Debrief 4 minutes
Learning Consolidation 1 minute

1 reading Total 10 minutes

Test Web Applications Using JavaScript Testing Frameworks and Libraries 10 minutes

1 assignment Total 30 minutes

Test Web Applications Using JavaScript Testing Frameworks and Libraries 30 minutes

1 programming assignment Total 75 minutes

Develop Test Cases for Contact Form 75 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.

Instructor

Instructor ratings

(7 ratings)

NIIT

13 Courses 29,760 learners

Offered by

NIIT

Explore more from Mobile and Web Development

University of Michigan
Interactivity with JavaScript
Course
Packt
JavaScript DOM - Interactive and Dynamic Web Pages
Course
Coursera
Introduction to Javascript: The Basics
Guided Project
Packt
JavaScript for Dynamic Web Development
Course

Why people choose Coursera for their career

Felipe M.

Learner since 2018

"To be able to take courses at my own pace and rhythm has been an amazing experience. I can learn whenever it fits my schedule and mood."

Jennifer J.

Learner since 2020

"I directly applied the concepts and skills I learned from my courses to an exciting new project at work."

Larry W.

Learner since 2021

"When I need courses on topics that my university doesn't offer, Coursera is one of the best places to go."

Chaitanya A.

"Learning isn't just about being better at your job: it's so much more than that. Coursera allows me to learn without limits."

Learner reviews

5 stars
41.66%
4 stars
33.33%
3 stars
0%
2 stars
8.33%
1 star
16.66%

Showing 3 of 12

Reviewed on Jun 6, 2022

Great explanation for trainee/junior developers.

View more reviews

Open new doors with Coursera Plus

Unlimited access to 10,000+ world-class courses, hands-on projects, and job-ready certificate programs - all included in your subscription

Learn more

Advance your career with an online degree

Earn a degree from world-class universities - 100% online

Explore degrees

Join over 3,400 global companies that choose Coursera for Business

Upskill your employees to excel in the digital economy

Learn more

Frequently asked questions

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.

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.

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.