Introduction to JavaScript | Modern JavaScript Essentials

JumpStart JavaScript Essentials, Responsive Design, Debugging, Classes, Functions, Security, ES6 / TypeScript Intro & More

TT4110

Introductory

3 Days

Course Overview

Introduction to Modern JavaScript | JavaScript Essentials is a hands-on geared for web developers who need to learn basic JavaScript to use with today's systems and architectures to build sophisticated web interfaces.  The training will guide students through a balanced mixture of theory and practical labs to gain core JavaScript development skills and have them explore its related technologies through to the use of tools and libraries to ease the development of advanced web applications.  Course attendees will be able to hit the ground running right after class, applying essential JavaScript to projects at both an architectural as well as a line by line coding level. 

What You'll Learn

Throughout the course, students will explore the practical use of the umbrella of technologies that work in conjunction with JavaScript as well as some of the tools, toolkits, and frameworks that can be used in conjunction with web development and deployment. The course begins with an initial look at JavaScript and how it is used within the context of web applications, walking students through the different technologies that are used with JavaScript and exploring core aspects of JavaScript in terms of web applications, security, tools, and frameworks. 

Working within in an engaging, hands-on learning environment, guided by our expert team, attendees will learn to:

  • Understand what JavaScript is and how it is used within the context of web applications
  • Work with the different technologies that are the foundation for web applications.
  • Understand and work with the fundamental aspects of JavaScript in terms of web applications, security, tools, and frameworks
  • Learn to how to effectively work with the newest advances in JavaScript such as ES6 and TypeScript
  • Develop code using conventions and optimal constructs for performance

Course Objectives

Throughout the course, students will explore the practical use of the umbrella of technologies that work in conjunction with JavaScript as well as some of the tools, toolkits, and frameworks that can be used in conjunction with web development and deployment. The course begins with an initial look at JavaScript and how it is used within the context of web applications, walking students through the different technologies that are used with JavaScript and exploring core aspects of JavaScript in terms of web applications, security, tools, and frameworks. 

Working within in an engaging, hands-on learning environment, guided by our expert team, attendees will learn to:

  • Understand what JavaScript is and how it is used within the context of web applications
  • Work with the different technologies that are the foundation for web applications.
  • Understand and work with the fundamental aspects of JavaScript in terms of web applications, security, tools, and frameworks
  • Learn to how to effectively work with the newest advances in JavaScript such as ES6 and TypeScript
  • Develop code using conventions and optimal constructs for performance

Course Prerequisites

This is an introductory level course for experienced software developers seeking to enhance and extend their core web development skillset leveraging JavaScript. Attendees should have practical experience developing basic software applications. This course provides an excellent foundation for continued learning to gain in-demand skills in in-demand skills and technologies such as NodeJS, Angular, React, Redux and more.  This course can also be tailored for less experienced or non-developers as needed.

Please see the Related Courses tab for specific Pre-Requisite courses, Related Courses that offer similar skills or topics, and next-step Follow-On Courses and Learning Path recommendations.

Course Agenda

Please note that this list of topics is based on our standard course offering, evolved from typical industry uses and trends. We’ll work with you to tune this course and level of coverage to target the skills you need most.

Session: HTML Refresher (optional)

Lesson: HTML

  • Define HTML and review its history
  • Look at XHTML and its relationship to HTML
  • Identify HTML limitations and improvements
  • Lab: Working with HTML

Lesson: HTML5

  • HTML5 Overview
  • HTML5 Semantic Structure
  • HTML5 Forms
  • HTML5 Media Delivery
  • Exercise: Writing a Valid HTML5 Document
  • Exercise: Writing HTML5 Forms

Session: CSS Refresher (optional)

Lesson: CSS

  • Learn the basics of CSS
  • Meaning of cascading in CSS
  • Declaring CSS within your HTML page
  • Creating styles in an external CSS file
  • Control how to display and position HTML elements
  • Overriding standard tag behavior
  • Adding new classes
  • Using custom classes in your page
  • Lab: Working with CSS

Lesson: CSS3 Overview

  • What is new in CSS3
  • The Advantages of CSS3
  • Browser Support for CSS3
  • Lab: Working with CSS3

Session: Introduction to JavaScript

Lesson: JavaScript Basics

  • JavaScript Defined
  • Variables and Operators
  • Flow Control and Conditionals
  • Lab: JavaScript Basics

Lesson: Debugging Tools

  • Using the strict mode and setting breakpoints
  • Browser debugging tools
  • Monitoring resource usage and performance
  • Emulating devices Exceptions in JavaScript
  • Lab: JavaScript Debugging

Lesson: JavaScript Functions

  • Functions in JavaScript
  • Invoking Functions
  • Function Constructor
  • Function Scope and Closures

Lesson: JavaScript Arrays, Math and Date

  • JavaScript Literals
  • JavaScript Arrays
  • Working with Numbers and Dates
  • Lab: JavaScript Built-in Objects

Lesson: JavaScript Event Handling and the DOM

  • Events and Event Handling
  • HTML Document Object Model
  • Accessing the DOM
  • Dynamically Working with the DOM
  • DOM Challenges
  • Lab: Using Events and the DOM

Lesson: Object-Oriented JavaScript

  • JavaScript “Objects” and “Classes”
  • Constructors and Prototypes
  • Prototypes
  • Extending Classes with Prototype
  • Reusable, Flexible Classes
  • Lab: Working with Classes

Session: Advanced JavaScript Topics

Lesson: ES6: The Next Step

  • ES6 Defined
  • ES6 Default and Rest Parameters
  • IIFE and Closures
  • ES6 Importing/Exporting Modules
  • Arrays, ES6 Maps, and ES6 Sets
  • Working Arrays with ES6
  • Working Strings with ES6 Strings
  • ES6 Constructs and Inheritance
  • ES6: Getters and Setters
  • Lab: Working with ES6

Lesson: TypeScript

  • Strong Data Typing
  • Compiling TypeScript to JavaScript
  • TypeScript Datatypes
  • TypeScript Classes and Interfaces

Lesson: Introduction to JSON and Ajax

  • JavaScript Object Notation
  • AJAX: Load Once and Change Data
  • XMLRequestObject is at the Center
  • Calling the Service
  • The Callback
  • Lab: Implementing JSON

Lesson: JavaScript Best Practices

  • Code Conventions for the Lifecycle
  • Resolving Shared Resources
  • Constructs to Use
  • Constructs to Avoid
  • Memory Considerations

Lesson: JavaScript Scheduling, Execution, and Security

  • Timers and Scheduling
  • Execution Contexts
  • Same Origin Policy and JavaScript
  • Security Considerations

Lesson: HTML5 JavaScript API

  • Cross-Domain Messaging
  • Working with Web Storage
  • Offline with Application Cache
  • Geolocation: What, Why, and How
  • Lab: Using the Web Storage API
  • Lab: Using the ApplicationCache API

Session: Working with XML (Optional)

Lesson: XML DOM Mechanics

  • HTML vs XML DOM
  • Building an XML DOM
  • Integrating XML into HTML
  • XML Response Processing
  • Lab: Loading XML Data into an HTML Page

Lesson: XSLT Applied

  • XSLT in the Browser
  • XSLT in Specific Browsers
  • Sarissa Assistance
  • XSLT Pluses and Minuses
  • Lab: XSLT Transformations with Sarissa

Course Materials

Student Materials: Each participant will receive a digital Student Guide and/or Course Notes, code samples, software tutorials, step-by-step written lab instructions (as applicable), diagrams and related reference materials and resource links. Students will also receive the project files (or code, if applicable) and solutions required for the hands-on work.

Hands-On Setup Made Simple! Our dedicated tech team will work with you to ensure our ‘easy-access’ cloud-based course environment, or local installation, is accessible, fully-tested and verified as ready to go well in advance of the course start date, ensuring a smooth start to class and effective learning experience for all participants. In some cases we can also help you install this course locally if preferred. Please inquire for details and options.

Every-Course Extras = High-Value & Long-Term Learning Support! All Public Schedule courses include our unique EveryCourse Extras package (Course Recordings, Live Instructor Follow-on Support, Free *Live* Course Refresh Re-Takes, early access to Special Offers, Free Courses & more). Please inquire for details.

Raise the bar for advancing technology skills

Attend a Class!

Live scheduled classes are listed below or browse our full course catalog anytime

Special Offers

We regulary offer discounts for individuals, groups and corporate teams. Contact us

Custom Team Training

Check out custom training solutions planned around your unique needs and skills.

EveryCourse Extras

Exclusive materials, ongoing support and a free live course refresh with every class.

Attend a Course

Please see the current upcoming available open enrollment course dates posted below. Please feel free to Register Online below, or call 844-475-4559 toll free to connect with our Registrar for assistance. If you need additional date options, please contact us for scheduling.

Course Title Days Date Time Price
Introduction to JavaScript | Modern JavaScript Essentials 3 Days Dec 9 to Dec 11 10:00 AM to 06:00 PM EST $1,595.00 Enroll

Mix, Match & Master!
2FOR1: Two Courses, One Price!

Enroll in *any* two public courses (for 2023 *OR* 2024 dates!) by December 31, for one price!  Learn something new, or share the promo!

Click for Details & Additional Offers

Learn. Explore. Advance!

Extend your training investment! Recorded sessions, free re-sits and after course support included with Every Course
Trivera MiniCamps
Gain the skills you need with less time in the classroom with our short course, live-online hands-on events
Trivera QuickSkills: Free Courses and Webinars
Training on us! Keep your skills current with free live events, courses & webinars
Trivera AfterCourse: Coaching and Support
Expert level after-training support to help organizations put new training skills into practice on the job

The voices of our customers speak volumes

Special Offers
Limited Offer for most courses.

SAVE 50%

Learn More