Course Curriculum : Web Development

Front-End

Html/Html5
Introduction of different Web Technology
Introduction
HTML Elements
HTML Attributes
HTML Headings
HTML Paragraphs
HTML Formatting
HTML Fonts
HTML Styles
HTML Links
HTML Images
HTML Tables
HTML Lists
HTML Forms
HTML Iframe
HTML Layout
HTML Doctypes
HTML Head
HTML Meta
HTML Scripts
HTML Media
HTML Audio
HTML Object
HTML Video
HTML YouTube
HTML Media Tags

Structure of a Web Page

HTML5 DOCTYPE
Page Encoding
HTML5 Mark-up
New And Updated Elements
Structural Elements
New Attributes
Deprecated Elements And Attributes

Forms

What Are The Needs For Web Applications?

Current Solutions
New Input Types
New Attributes
Form Validation

Audio and Video

The State of Web Audio And Video Based On Plug-in

The State Of Audio And Video Codec (e.g. H.264, WebM, etc.)
Video/Audio Codec And Browser Support
New Audio/Video Mark-up
Attributes And Methods
Understanding Audio/Video Events
Customizing Audio/Video Controls

HTML5 Canvas

Overview Of Graphics In The Browser

Canvas Vs. SVG
Accessibility
Using A Canvas
Context And Coordinates
Drawing Shapes
Working With Paths
 Drawing Straight Lines
Drawing Circles Or Arcs
Drawing Text
Drawing Images
Working With Pixels
Understanding Transforms
Translation
Rotation
Scaling

CSS/CSS3

CSS Introduction
CSS Syntax
CSS Id & Class
CSS Styling
Styling Backgrounds
Styling Text
Styling Fonts
Styling Links
Styling Lists
Styling Tables
CSS Box Model
CSS Border
CSS Outline
CSS Margin
CSS Padding
CSS Display
CSS Positioning
CSS Floating
CSS Align
CSS Navigation Bar
CSS Image Opacity
CSS Media Types

CSS3

Selectors and Pseudo Classes

Attribute Selectors
The Target Pseudo-Class
UI Element States Pseudo-Classes
Negation Pseudo-Class
Structural Pseudo-Classes
Fonts and Text Effects
Fonts on the Web
Font Services
The @font-face Rule
Text Shadow
Word Wrapping
Colors, Gradients, Background Images, and Masks
Color
The Opacity Property
Backgrounds
background-origin, and background-size
Borders and Box Effects
Image Borders
Rounded Corners
Box Shadow
Transitions, Transforms, and Animations
Transitions and Transforms
Transitions
Layout: Columns and Flexible Box
Layout: Columnsand Flexible Box
Flexible Box Model
Embedding Media
Video Formats
Styling Video
Media Queries
Targeting Widths and Devices with CSS3 Media Queries
Responsive Images and the viewport Meta
 JavaScript

JavaScript Fundamentals

variables
Data types
Type Conversions
Operators
Conditional operators: if, '?'
Logical operators
Loops: while and for
The "switch" statement
Functions
Arrow functions, the basics
JavaScript specials

Data types

Strings
Arrays
Array methods
Iterables
Map and Set
Object.keys, values, entries
Destructuring assignment
Date and time
JSON methods, toJSON

classes

Class basic syntax

Class inheritance
Static properties and methods
Private and protected properties and methods
Extending built-in classes

Error handling

Error handling, "try...catch"

Custom errors, extending Error

Promises, async/await

Introduction: callbacks
Promise
Promises chaining
Error handling with promises
Promise API
Promisification
Async/await

Generators, advanced iteration

Generators
Async iterators and generators

Modules

Modules, introduction
Export and Import
Dynamic imports

Browser: Document, Events, Interfaces

Document

Browser environment, specs

DOM tree
Walking the DOM
Searching: getElement*, querySelector*
 Node properties: type, tag and contents
Attributes and properties
Modifying the document
Styles and classes
Coordinates

Events

Introduction to browser events

Bubbling and capturing
Event delegation
Browser default actions
Dispatching custom events

UI Events

Mouse events basics

Moving the mouse: mouseover/out, mouseenter/leave
Drag'n'Drop with mouse events
Keyboard: keydown and keyup
Scrolling

Forms, controls

Form properties and methods

Focusing: focus/blur
Events: change, input, cut, copy, paste
Forms: event and method submit

Document and resource loading

Page: DOMContentLoaded, load, beforeunload, unload

Scripts: async, defer
Resource loading: onload and onerror

ReactJS

Module 1

why React

Introduction

Installing and setting

Intro to JSX

Why use Captial component name

diff b/w HTML and JSX

components

What is component
types of components
class components
with es6 with and without super without es6 bind method
functional components
reusable components:
why we need

Module 2
State Management

what is state

2. State Object

setState()

state with class components

state with functional components (with Hooks)

Props

passing data from parent to child

passing data from child to parents
propTypes for type check and debug

Controlled components

Module 3

React Lifecycle

componentWillMount
componentDidMount
componentWillUpdate

Using External API

Axios and Fetch API

use of GET, POST, PATCH, PUT, DELETE
Async/Await with Axios and promise
Using Promise.all to resolve the above API data

Module 4

React-Router

Introduction

Link and its exact attributes

Nav-Link and its 'isActive' class

Browser Router

Router

Render
component

Switch

Setting 404 page

Dynamic Routes

using History and Location and Params

Module 5

Redux

Redux Method
 createStore()
action
Dispatch()
Subscribe()

Redux Advance

Reducer
combineReducer
Redux middleware
Thunk middleware

Fetching data in Redux through API

React-Redux

Installation
Using provider
connect()

Project

Individual project
Healthcare
Tvastra
Northern health
Team project
Social Media
Coub
Krazily
Blogging
Medium
E-commerce
Ozon
shop.

Back-End
Module 1

Introduction to Node JS

Introduction
What is Node JS?
Advantages of Node JS
Traditional Web Server Model
Node.js Process Model

Module 2

Setup Dev Environment

Install Node.js
Working in REPL
Node JS Console

Module 3

Node JS Modules

Functions
Buffer
Module
Module Types
Core Modules
Local Modules
Module.Exports

Module 4
 Node Package Mananger

What is NPM
Installing Packages Locally
Adding dependency in package.json
Installing packages globally
Updating packages

Module 5

Creating Web server

Creating a web server

Handling HTTP requests
Sending requests

Module 6

File System

Fs.readFile
Writing a File
Writing a file asynchronously
Opening a file
Deleting a file
Other IO Operations

Module 7

Debugging Node JS Application

Core Node JS debugger

Debugging with Visual Studio

Module 8

Events

EventEmitter class
Returning event emitter
Inhering events

Module 9

Express.JS

Configuring routes
Working with express

Module 10

Serving Static Resources

Serving static files

Working with middleware

Module 11
Database connectivity

Connection string
Configuring
Working with select command
Updating records
Deleting records

Module 12

Template Engines

Why Template Engine

EJS
Example

Module 13

Unit testing with mocha & chai

What is unit testing

Install and setup mocha and chai
Write unit tests to test API

Module 14

projects

Individual project
Healthcare
Tvastra
Northern health
Team project
Social Media
Coub
Krazily
Blogging
Medium
E-commerce
Ozon
shop.mts

Module 15

Deployment

AWS
Google Cloud