55320 Programming with HTML, CSS, and JavaScript

Price
$2,975.00 USD

Duration
5 Days

Delivery Methods
Virtual Instructor Led
Private Group

Request More Information

Download Course Details

Course Details Only
Course Details & Schedule

Skip to Class Dates

Course Overview

Programming with HTML, CSS, and JavaScript Community Courseware version of 20480CC Programming in HTML5 with JavaScript and CSS3. This five-day instructor-led is intended for IT professionals interested in becoming client-side web developers. who need to get a jump start on all three technologies. The course includes more than 30 exercises, providing a rapid hands-on introduction to the three major client-side languages: HTML, CSS, and JavaScript. Students should be prepared to cover a lot of ground quickly. Like that course, this course focuses on using HTML, CSS, and JavaScript to develop web pages, implement programming logic, define and use variables, perform looping and branching, capture and validate user input, store data, and create well-structured applications. However, this course does not cover the HTML5 APIs covered in 20480. Students can take this course on any computer with a web browser. Although it’s not required, we recommend Visual Studio Code as the editor.

Course Objectives

Describe the technologies involved in web development.

Create HTML pages with links and images.

Explain the benefits of CSS.

Style HTML pages with CSS.

Explain the concepts of objects, methods, and properties.

Work with JavaScript variables.

Create their own custom functions in JavaScript.

Write flow control logic in JavaScript.

Write JavaScript code that listens for and handles events, such as mouse clicks and page loads.

Create forms with HTML and validate them with JavaScript.

Use regular expressions in JavaScript for advanced form validation.

Who Should Attend?

This course is intended for students new to computer programming or experienced programmers who are new to client-side web development.

Top-rated instructors: Our crew of subject matter experts have an average instructor rating of 4.8 out of 5 across thousands of reviews.
Authorized content: We maintain more than 35 Authorized Training Partnerships with the top players in tech, ensuring your course materials contain the most relevant and up-to date information.
Interactive classroom participation: Our virtual training includes live lectures, demonstrations and virtual labs that allow you to participate in discussions with your instructor and fellow classmates to get real-time feedback.
Post Class Resources: Review your class content, catch up on any material you may have missed or perfect your new skills with access to resources after your course is complete.
Private Group Training: Let our world-class instructors deliver exclusive training courses just for your employees. Our private group training is designed to promote your team’s shared growth and skill development.
Tailored Training Solutions: Our subject matter experts can customize the class to specifically address the unique goals of your team.

Learning Credits: Learning Credits can be purchased well in advance of your training date to avoid having to commit to specific courses or dates. Learning Credits allow you to secure your training budget for an entire year while eliminating the administrative headache of paying for individual classes. They can also be redeemed for a full year from the date of purchase. If you have previously purchased a Learning Credit agreement with New Horizons, you may use a portion of your agreement to pay for this class.

If you have questions about Learning Credits, please contact your Account Manager.

Course Prerequisites

There are no prerequisites for this course.

Agenda

1 - A Quick Overview of Web Development

HTML is Part of a Team
Client-side Programming
Server-side Programming
Web Development Technologies

2 - Introduction to HTML

Exercise: A Simple HTML Document
Getting Started with a Simple HTML Document
HTML Elements, Attributes, and Comments
The HTML Skeleton
Viewing the Page Source
Special Characters
HTML Elements and Special Characters
History of HTML
The lang Attribute

3 - Paragraphs, Headings, and Text

Paragraphs
Heading Levels
Breaks and Horizontal Rules
Exercise: Paragraphs, Headings, and Text
The div Tag
Creating an HTML Page
Quoted Text
Preformatted Text
Inline Semantic Elements
Exercise: Adding Inline Elements

5 - HTML Images

Inserting Images
Image Links
Adding Images to the Document
Exercise: Adding Images to the Page
Providing Alternative Images

6 - HTML Lists

Unordered Lists
Ordered Lists
Definition Lists
Exercise: Creating Lists

7 - Crash Course in CSS

Benefits of Cascading Style Sheets
CSS Rules
Selectors
Combinators
Precedence of Selectors
How Browsers Style Pages
CSS Resets
CSS Normalizers
External Stylesheets, Embedded Stylesheets, and Inline Styles
Exercise: Creating an External Stylesheet
Exercise: Creating an Embedded Stylesheet
Exercise: Adding Inline Styles
div and span
Exercise: Styling div and span
Media Types
Units of Measurement
Inheritance

8 - CSS Fonts

font-family
@font-face
font-size
font-style
font-variant
font-weight
line-height
font shorthand
Exercise: Styling Fonts

9 - Color and Opacity

About Color and Opacity
Color and Opacity Values
color
opacity
Exercise: Adding Color and Opacity to Text

10 - CSS Text

letter-spacing
text-align
text-decoration
text-indent
text-shadow
text-transform
white-space
word-break
word-spacing
Exercise: Text Properties

11 - JavaScript Basics

JavaScript vs. EcmaScript
The HTML DOM
JavaScript Syntax
Accessing Elements
Where Is JavaScript Code Written?
JavaScript Objects, Methods, and Properties
Exercise: Alerts, Writing, and Changing Background Color

12 - Variables, Arrays, and Operators

JavaScript Variables
A Loosely Typed Language
Google Chrome DevTools
Storing User-Entered Data
Exercise: Using Variables
Constants
Arrays
Exercise: Working with Arrays
Associative Arrays
Playing with Array Methods
JavaScript Operators
The Modulus Operator
Playing with Operators
The Default Operator
Exercise: Working with Operators

13 - JavaScript Functions

Global Objects and Functions
Exercise: Working with Global Functions
User-defined Functions
Exercise: Writing a JavaScript Function
Returning Values from Functions

14 - Built-In JavaScript Objects

Strings
Math
Date
Helper Functions
Exercise: Returning the Day of the Week as a String

15 - Conditionals and Loops

Conditionals
Short-circuiting
Switch / Case
Ternary Operator
Truthy and Falsy
Exercise: Conditional Processing
Loops
while and do…while Loops
for Loops
break and continue
Exercise: Working with Loops
Array: forEach()

16 - Event Handlers and Listeners

On-event Handlers
Exercise: Using On-event Handlers
The addEventListener() Method
Anonymous Functions
Capturing Key Events
Exercise: Adding Event Listeners
Benefits of Event Listeners
Timers
Typing Test

17 - The HTML Document Object Model

CSS Selectors
The innerHTML Property
Nodes, NodeLists, and HTMLCollections
Accessing Element Nodes
Exercise: Accessing Elements
Dot Notation and Square Bracket Notation
Accessing Elements Hierarchically
Exercise: Working with Hierarchical Elements
Accessing Attributes
Creating New Nodes
Focusing on a Field
Shopping List Application
Exercise: Logging
Exercise: Adding EventListeners
Exercise: Adding Items to the List
Exercise: Dynamically Adding Remove Buttons to the List Items
Exercise: Removing List Items
Exercise: Preventing Duplicates and Zero-length Product Names
Manipulating Tables

18 - HTML Forms

How HTML Forms Work
The form Element
Form Elements
Buttons
Exercise: Creating a Registration Form
Checkboxes
Radio Buttons
Exercise: Adding Checkboxes and Radio Buttons
Fieldsets
Select Menus
Textareas
Exercise: Adding a Select Menu and a Textarea
HTML Forms and CSS

19 - JavaScript Form Validation

Server-side Form Validation
HTML Form Validation
Accessing Form Data
Form Validation with JavaScript
Exercise: Checking the Validity of the Email and URL Fields
Checking Validity on Input and Submit Events
Adding Error Messages
Validating Textareas
Validating Checkboxes
Validating Radio Buttons
Validating Select Menus
Exercise: Validating the Ice Cream Order Form
Giving the User a Chance

20 - Regular Expressions

Getting Started
Regular Expression Syntax
Backreferences
Form Validation with Regular Expressions
Cleaning Up Form Entries
Exercise: Cleaning Up Form Entries
A Slightly More Complex Example

Get in touch to schedule training for your team
We can enroll multiple students in an upcoming class or schedule a dedicated private training event designed to meet your organization’s needs.