React Full Stack Developer Training Program

Introduction

• Laying out a page with HTML5

• Page Structure

• New HTML5 Structural Tags

• Page Simplification

HTML 5 - How we got here

• New Features of HTML5

• The HTML5 Semantic Element

• Current State of Browser Support

SECTIONS AND ARTICLES

• The section Tag

• The article Tag

• The header Tag

• The Footer Tag

HTML5 AUDIO AND VIDEO

• Supported Media Types

• The audio Element

• The video Element

HTML5 FORMS

• New Input Types

HTML5 NEW FORM ATTRIBUTES

• autocomplete

• novalidate

HTML5 NEW FORM FIELD ATTRIBUTES

• required

• placeholder

• autofocus

• autocomplete

• form

• pattern

Introduction of CSS

CSS Syntax

CSS Comments

CSS Types

• Inline

• Internal

• External

CSS Selector

• ID

• Class

• Attribute

• Grouping

• Universal

CSS Color

• RGB Value

• Hex Value

• Color Name

Background

• background-color

• background-repeat

• background-attachement

• background position

• background-size

• background-image

CSS Margin

• Margin-top

• Margin-bottom

• Margin-left

• Margin-Right

CSS Padding

• Padding -top

• Padding -bottom

• Padding -left

• Padding –Right

Outline

• Outline-style

• Outline-color

• Outline Width

• Outline-Offset

• Outline Shorthand Property

CSS Height and Width

CSS Display properties

CSS Position Properties

CSS Overflow

CSS Float and Clear

Pseudo Class and Element

Introduction to CSS 3

• Border

• border-radius

CSS Shadows

• Text-shadow

• Box-shadow

Transitions

• transition

• transition-delay

• transition-duration

• transition-property

2D Transforms

• transform

• matrix ()

• translate (x, y)

• scale (x, y)

• rotate(angle)

• skew (x-angle, y-angle)

Animations

• @keyframes

• animation

• animation-direction

• animation-duration

• animation-name

Selectors

• CSS combinations

• Pseudo Elements

Gradients

• Linear Gradients

• Radial Gradients

User Interface

• resize

• box-sizing

• outline-offset

CSS Filters

• Blur

• Opacity

Media Query

• What is Responsive Web Design

• Intro to the Viewport

• The Viewport Tag

• Media Queries

• Tablet Styles

• Mobile Styles

• Making a Mobile Drop-down Menu

Web Fonts

• @font-face

• font-family

• src

• font-stretch

• font-style

• font-weight

Flexbox

• flex-grow

• flex-shrink

• flex-basis

• flex

• flex-wrap

• flex-direction

• flex-flow

• justify-content

• align-items

• order

Introduction to JavaScript

• Syntax

• Statements

• Comments

Enabling in various browsers Popup Boxes

• Alert

• Confirm

• Prompt

Variables

Operators

• Arithmetic

• Assignment

• Comparison

• Logical

• Relational

• Ternary

Conditional Statements

• If else

• if...else if...else

• nested if

• Switch

• Loops

• While

• do...while

• for

• for...in Statement

• Break

• Continue

Functions

• User-defined Functions

• Function Syntax

• Function with Arguments

• Returning Values from Functions

• Built-in Functions

Events

• Introduction

• Mouse

• Events

• Keyboard Events

• Form Events

• Document/Window Events

Built-in Objects

• Number

• Strings

• Math

• Array

• Date

• Reg exp use in form validation