Module 1: A Quick Overview of Web Development

This module gives an overview of the client-side and server-side technologies used in web development.

Lessons

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

Lab 1: None

None

After completing this module, students will be able to:

Distinguish between client-side and server-side technologies.
Identify the major client-side technologies.
Identify the major server-side technologies.

Module 2: Introduction to HTML

This module explains the syntax and structure of HTML documents and provides a short history of HTML.

Lessons

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

Lab 1: Getting Started

A Simple HTML Document

After completing this module, students will be able to:

Create a simple HTML page.
Understand HTML elements and attributes.
Understand how whitespace is treated in HTML.
Add special characters to HTML pages.
Explain the general history of HTML.

Module 3: Paragraphs, Headings, and Text

This module explains how to add paragraphs, headings, and inline text to HTML pages.

Lessons

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

Lab 1: Exercises included throughout lesson

Creating an HTML Page
Adding Inline Elements

After completing this module, students will be able to:

Add paragraphs to HTML pages.
Add headings to HTML pages.
Add breaks and horizontal rules.
Add quoted text.
Add preformatted text.
Add phrase elements to call out or identify textual elements on the page.
Understand the meaning of semantic content.

Module 4: HTML Links

This module explains the difference between absolute and relative paths and shows how to add links to external HTML pages and to locations within a page. It also shows how to create email links.

Lessons

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

Lab 1: Exercises included throughout lesson

Adding Links

After completing this module, students will be able to:

Add basic text links.
Understand the difference between absolute and relative paths.
Add links that open in new tabs or windows.
Add links that open up an email client.
Add links to specific locations on the page.

Module 5: HTML Images

This module explains how to add images to a page, how to make those images accessible, and how to create image links.

Lessons

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

Lab 1: Exercises included throughout lesson

Adding Images to the Page

After completing this module, students will be able to:

Add images to an HTML page.
Create image links.
Make images accessible.

Module 6: HTML Lists

This module explains how to add ordered, unordered, and definition lists to HTML pages.

Lessons

Unordered Lists
Ordered Lists
Definition Lists
Exercise: Creating Lists

Lab 1: Exercises included throughout lesson

Creating Lists

After completing this module, students will be able to:

Create unordered (bulleted) lists.
Create ordered (numbered) lists.
Create definition lists.

Module 7: Crash Course in CSS

This module provides a rapid introduction to CSS, explaining the benefits of using CSS to style HTML pages and describing the different ways to add CSS styles to HTML pages and elements.

Lessons

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

Lab 1: Exercises included throughout lesson

Creating an External Stylesheet
Creating an Embedded Stylesheet
Adding Inline Styles
Styling div and span Elements

After completing this module, students will be able to:

Understand the benefits of CSS.
Redefine how elements are formatted.
Create and use CSS selectors.
Create and use CSS combinators.
Understand the CSS cascade.
Understand the role of CSS resets and normalizers.
Create and use external and embedded stylesheets.
Add inline styles to HTML elements.
Use the div and span elements.
Understand media types.
Understand and use the viewport tag.
Understand and select proper units of measurement.
Understand inheritance in CSS.

Module 8: CSS Fonts

This module explains how to make text bold and italic and how to control other font attributes with CSS.

Lessons

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

Lab 1: Exercises included throughout lesson

Styling Fonts

After completing this module, students will be able to:

Use the font-family property.
Use the font-size property.
Use the font-style property.
Use the font-variant property.
Use the font-weight property.
Use the line-height property.
Use shorthand properties, such as font.

Module 9: Color and Opacity

This module explains how to control the color and opacity of elements on an HTML page.

Lessons

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

Lab 1: Exercises included throughout lesson

Adding Color and Opacity to the Text

After completing this module, students will be able to:

Use the color property.
Use the opacity property.

Module 10: CSS Text

This module explains how to align, underline, cross out, and space letters and words, how to indent text, how to control whitespace, and how to add shadows to text.

Lessons

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

Lab 1: Exercises included throughout lesson

Text Properties

After completing this module, students will be able to:

Use the letter-spacing property.
Use the text-align property.
Use the text-decoration property.
Use the text-indent property.
Use the text-shadow property.
Use the text-transform property.
Use the white-space property.
Use the word-break property.
Use the word-spacing property.

Module 11: JavaScript Basics

This module provides an introduction to the HTML Document Object Model and to JavaScript, its purpose, its syntax, and its structure.

Lessons

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

Lab 1: Exercises included throughout lesson

Alerts, Writing, and Changing Background Color

After completing this module, students will be able to:

Understand the HTML Document Object Model
Understand the JavaScript syntax rules.
Write inline JavaScript.
Write JavaScript within script blocks.
Create external JavaScript files.
Work with JavaScript objects, methods, and properties.
Reference HTML elements with JavaScript.

Module 12: Variables, Arrays, and Operators

This module explains how to create and use JavaScript variables and arrays, and introduces JavaScript operators.

Lessons

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

Lab 1: Exercises included throughout lesson

Working with Arrays
Working with Operators

After completing this module, students will be able to:

Create, read, and modify variables in JavaScript.
Create JavaScript arrays.
Use JavaScript operators.

Module 13: JavaScript Functions

This module explains how to use built-in JavaScript functions and how to write your own user-defined functions.

Lessons

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

Lab 1: Exercises included throughout lesson

Working with Global Functions
Writing a JavaScript Function

After completing this module, students will be able to:

Understand JavaScripts global functions and objects.
Create custom JavaScript functions.
Return values from functions.

Module 14: Built-In JavaScript Objects

This module covers the built-in JavaScript objects and shows how to create helper functions to provide additional functionality.

Lessons

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

Lab 1: Exercises included throughout lesson

Returning the Day of the Week as a String

After completing this module, students will be able to:

Work with JavaScript’s built-in String object.
Work with JavaScript’s built-in Math object.
Work with JavaScript’s built-in Date object.

Module 15: Conditionals and Loops

This module explains flow control. It covers the different types of conditionals and loops in JavaScript.

Lessons

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()

Lab 1: Exercises included throughout lesson

Conditional Processing
Working with Loops

After completing this module, students will be able to:

Write if / else if / else conditions.
Write switch / case statements.
Create for and while loops.

Module 16: Event Handlers and Listeners

This module explains how to capture and respond to events such as mouse clicks and keyboard actions. It also explains how to create timers in JavaScript.

Lessons

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

Lab 1: Exercises included throughout lesson

Using On-event Handlers
Adding Event Listeners
Creating a Typing Test

After completing this module, students will be able to:

Understand on-event handlers.
Identify and use commonly-used on-event handlers.
Create eventListeners.

Module 17: The HTML Document Object Model

This module dives deep into the HTML Document Object Model, explaining the many ways of accessing elements on the page and showing how to dynamically add and remove elements with JavaScript.

Lessons

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

Lab 1: Exercises included throughout lesson

Accessing Elements
Working with Hierarchical Elements
Logging
Adding EventListerners
Adding Items to the List
Dynamically Adding Remove Buttons to the List Items
Removing List Items
Preventing Duplicates and Zero-length Product Names

After completing this module, students will be able to:

Access specific nodes within the HTML DOM.
Identify nodes by tag name, class name, and CSS selector.
Access nodes hierarchically.
Create and remove nodes.
Dynamically create an HTML page with JavaScript.

Module 18: HTML Forms

This module explains how to create HTML forms.

Lessons

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

Lab 1: Exercises included throughout lesson

Creating a Registration Form
Adding Checkboxes and Radio Buttons
Adding a Select Menu and a Textarea

After completing this module, students will be able to:

Understand how HTML forms work.
Understand the difference between the get and post methods.
Add various types of form elements.
Use labels to identify form elements

Module 19: JavaScript Form Validation

This module explains how to validate HTML forms with HTML attributes and with JavaScript.

Lessons

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

Lab 1: Exercises included throughout lesson

Checking the Validity of the Email and URL Fields
Validating the Ice Cream Order Form

After completing this module, students will be able to:

Access data entered by users in forms.
Validate text fields, textareas, radio buttons, checkboxes, and select menus.
Write clean, reusable validation functions.

Module 20: Regular Expressions

This module covers regular expressions and explains how to use them for advanced HTML form validation and to clean up form entries.

Lessons

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

Lab 1: Exercises included throughout lesson

Cleaning up Form Entries

After completing this module, students will be able to:

Use regular expressions for advanced form validation.
Use backreferences to clean up form entries.

Odpowiednikiem tego szkolenia jest szkolenie Szkolenie 20480 "Programming in HTML5 with JavaScript and CSS3"

O tym kursie

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.

This course covers the same technologies as the retired Course 20480-C: Programming in HTML5 with JavaScript and CSS3. 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.

Profil odbiorcy

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

Czego się nauczysz?

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.

Basic computer and typing skills.

W cenę szkolenia wliczony jest:

Certyfikat Microsoft
Autoryzowane materiały szkoleniowe w formie elektronicznej (Skillpipe)
Gwarancja jakości szkolenia
Materiały szkoleniowe, notatnik, długopis
Kontakt z trenerem po szkoleniu
Kawa, herbata, słodki poczęstunek
Obiad

Firma jest Autoryzowanym Ośrodkiem Szkoleniowym MICROSOFT Silver Learning
Możesz u nas podejść do egzaminu Pearson VUE
Spółka posiada wpis do ewidencji placówek niepublicznych Nr ew. ES.VIII.4320-6/p.n./2003 wydany z upoważnienia Prezydenta Miasta Łodzi

Zachęcamy firmy do uzyskania możliwości dofinansowania na szkolenia oferowane przez naszą firmę. W obecnej chwili istnieją dwa sposoby dzięki którym możesz uzyskać dofinansowanie.

Szkolenia dofinansowane do 80% z funduszy europejskich - Baza Usług Rozwojowych (BUR). Dofinansowanie dostępne jest dla wszystkich firm zatrudniających średniorocznie do 250 pracowników (maksymalnie średnie przedsiębiorstwo)
Szkolenia dofinansowane z Krajowego Funduszu Szkoleniowego - dofinansowanie do 100%. Niezależnie od wielkości przedsiębiorstwa oraz kapitału.

Nasi pracownicy pomogą uzyskać dla Twojej firmy dofinansowanie. To naprawdę nie jest trudne. Jeżeli masz pytania napisz lub zadzwoń do nas.

Zapraszamy!

Opinie

Brak dodanych opinii

Dodaj opinie

Cena netto	3900.00 zł
Czas trwania (dni / godziny dydaktyczne):	5 d,40 h
Poziom trudności
Język	Polski,
Język materiałów	Angielski,
Prowadzący	Certyfikowany trener Microsoft, Wieloletni trener Microsoft,
Możliwe opcje szkolenia