This course 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. This material updates and replaces course Microsoft course 20480 which was previously published under the title Programming in HTML5 with JavaScript and CSS3.

starstarstarstarstar_half

* Actual course outline may vary depending on offering center. Contact your sales representative for more information.

Learning Objectives

After completing this course, you will be able to:
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.

1
  • Module 1: A Quick Overview of Web Development

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

2
  • Module 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
  • Module 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

4
  • Module 4: HTML Links

  • Links Introduction
    Text Links
    Absolute vs. Relative Paths
    Targeting New Tabs
    Email Links
    Exercise: Adding Links
    Lorem Ipsum
    The title Attribute
    Linking to a Specific Location on the Page
    Targeting a Specific Location on the Page

5
  • Module 5: HTML Images

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

6
  • Module 6: HTML Lists

  • Unordered Lists
    Ordered Lists
    Definition Lists
    Exercise: Creating Lists

7
  • Module 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
  • Module 8: CSS Fonts

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

9
  • Module 9: Color and Opacity

  • About Color and Opacity
    Color and Opacity Values
    Color
    Opacity
    Exercise: Adding Color and Opacity to Text

10
  • Module 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
  • Module 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
  • Module 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
  • Module 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
  • Module 14: Built-In JavaScript Objects

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

15
  • Module 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
  • Module 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
  • Module 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
  • Module 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
  • Module 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
  • Module 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

Audience

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

Language

English

Prerequisites

Basic computer and typing skills.

$3,275

Length: 5.0 days (40 hours)

Level:

Not Your Location? Change

Course Schedule:

To request a custom delivery, please chat with an expert.

Loading...