hands-on lab

Web Development Fundamentals - JavaScript

Get guided in a real environmentPractice with a step-by-step scenario in a real, provisioned environment.
Learn and validateUse validations to check your solutions every step of the way.
See resultsTrack your knowledge and monitor your progress.
Lab description

This laboratory is contributed and maintained independently by a third-party (QA).  It may contain imperfections in the instructions due to the passage of time.

This lab builds the basic skills of web development in JavaScript. This lab, using the latest version of JavaScript and developer tools to allow this, starts with the basics needed to write simple scripts and builds on this to prepare you for using modern JavaScript frameworks and libraries such as React and Angular.

Lab Objectives

Upon completion of this lab you will be able to:

  • Set up a development environment for programming in modern JavaScript
  • Manage and use JavaScript types and data structures effectively
  • Control the flow of programs using loops and conditional code
  • Use JavaScript alongside HTML, manipulating and changing the DOM
  • React to events to make web pages respond to user interaction, including form handling
  • Produce and use basic Object-Oriented JavaScript
  • Work with asynchronous data using JavaScript

Intended Audience

This lab is intended for:

  • Anyone who wants to learn web development and perhaps progress into using modern JavaScript libraries and frameworks
  • Those who are relatively new to programming or experienced developers skilled in other languages who need to learn the nuances of JavaScript


You should be familiar with:

  • HTML and CSS
  • Computer programming concepts

Completion of the Web Development Fundamentals - HTML and CSS lab is recommended to fulfill the HTML and CSS prerequisite.


November 3rd, 2020 - Updated the lab exercise guide to replace out-dated commands in quick lab 1

October 12th, 2020 - Added a replacement command for quick lab 1 instruction 4 to install version 3 of webpack-cli in order for the webpack development server to run

October 8th, 2020 - Updated quick lab 1 to include the empty src folder and index.html skeleton

October 5th, 2020 - Updated index.html file used in quick lab 12 to include missing HTML

May 11th, 2020 - Added instructions to review delegate guides to learn about the topics applied in the quick labs

May 6th, 2020 - Added Exercise Guide Supplemental Instructions section to help clarify instructions in the quick lab guides

July 9th, 2020 - Enabled direct browser RDP connection for a streamlined experience

About the author
Ed Wright, opens in a new tab
Senior Learning Consultant
Learning paths

Ed is an Outstanding Trainer in Software Development, with a passion for technology and its uses and holding more than 10 years’ experience.

Previous roles have included being a Delivery Manager, Trainer, ICT teacher, and Head of Department. Ed continues to develop existing and new courses, primarily in web design using: PHP, JavaScript, HTML, CSS, SQL, and OOP (Java), Programming Foundations (Python), and DevOps (Git, CI/CD, etc). Ed describes himself as practically minded, a quick learner, and a problem solver who pays great attention to detail. 

Ed’s specialist area is training in Emerging Technologies, within Web Development. Ed mainly delivers courses in JavaScript covering vanilla JS, ES2015+, TypeScript, Angular, and React (the latter is authored by Ed) and has delivered on behalf of Google for PWAs. Ed has also developed a new suite of PHP courses and has extensive experience with HTML/CSS and MySQL. 

Ed is responsible for delivering QA’s Programming Foundations course using the Eclipse IDE. His skillset extends into the DevOps sphere, where he is able to deliver courses based around Agile/Scrum practices, version control, and CI/CD.

Covered topics
Lab steps
Starting the Web Development Fundamentals - JavaScript Exercises