Module 1: Introduction – i

• UI Developer roles and responsibilities
• UX designer roles
• Technologies needed
• Power of UI
• Current market requirements on UI
• Basic Technologies needed
• Difference between Front end and Backend

Introduction – ii

• Sample webpages
• Crawling and Meta tags.
• Basics

Module 2: Basics – HTML

• Exploring existing pages
• Browsers & Editors
• DOM
• Structure of HTML Page
• Mandatory tags in html page (html, head, body)
• Heading tags (H1…H6), Tags and attributes (Class, Id, style…etc.)
• Inline and block level elements

Module 3: CSS

• What is CSS
• Different ways of applying CSS for elements, and priority chain of CSS
• CSS Properties (color, font, size, border…etc.)

CSS – ii

• Box model
• Margin & Padding
• Positioning Elements
• Floating Elements

Module 4: More HTML Tags

• Including external page links in a page using anchor tags and its properties
• Working with row and column data using table tags
• Hiding and un-hiding elements using display property
• img tag, p tag, ul and ol tags, li, nobr, hr, bretc
• Layouts, forms, buttons
• Input fields (textbox, radio button, checkbox, dropdown, text area etc.)
• Debugging HTML & CSS (Firebug, IE and Chrome developer tool)
• Creating Tabs and menu lists

Module 5: More CSS Properties

• Adding borders, font, Pseudo classes and Pseudo Elements
• positioning elements (absolute, relative, fixed and static)
• Image spriting
• Box model (margins, padding)
• Floating elements (float left, right etc.)
• Including external resources
• Absolute and Relative paths
• Including external resources like CSS, images etc.
• Display Property(inline, block, inline block etc)
• Display none and hidden elements.

Module 6: Form Elements

• Get & Post Communication
• Validating input values in a form.
• Form action and type

Module 7: JavaScript

• Data types and data structures in Js
• Control structures, if, if-else, while, for, switch case statements

Module 8: DHTML

• Dynamic creation and manipulation of DOM elements using Javascript.
• Adding multiple events dynamically using event listeners.
• Event capturing and event bubbling
• Exploring Event Object.
• Validations using key char codes

Module 9: JavaScript Supported Data Structures

• Arrays and Predefined methods.
• Working on logical programs using Arrays.
• Predefined methods in arrays
• Strings and predefined methods
• Objects
• JSON
• Iterating through Dynamic JSON Object.
• Exploring Predefined Date object.

Module 10: Adv. JavaScript

• Inheriting Static Object using proto.
• Inheritance using Object.create()
• JavaScript Classes
• Prototyping
• Inheritance using prototyping.
• Global and local variables
• Securing Data using Closures
• Exception Handling
• Handling Predefined and user defined exceptions
• Exploring try, catch, finally and throws.

Module 11: jQuery

• History and version explore
• Difference between Minified and non-minified JS files.
• On load and on ready difference
• Jquery selectors
• Multiple ways of referring DOM elements using jQuery selectors
• Jquery methods
• Adding dynamic properties for DOM elements
• Toggling elements
• Creating dynamic elements using jQuery

Module 12: jQuery Traversing methods

• Traversing Siblings
• Traversing Children’s
• Traversing Parent Elements.
• Traversing Ancestors.
• Finding elements using jQuery techniques
• Filtering elements

Module 13: Events using jQuery

• Binding events
• Dynamic binding
• List of events been supported in jQuery (blur, change, click, dbclick….etc.)s

Module 14: AJAX

• Advantages with AJAX and its limitations
• Samples working with AJAX
• Different data formats used in AJAX (string, xml, JSON, etc.)
• XML and JSON difference
• Cross domain interactions using JSONP
• Jquery Promises
• Handling Multiple AJAX Calls using Jquery Promises.

Module 15: Jquery Animations

• Animation Effects using
• Hide, Show
• Sliding up and down
• Fading
• Animate Method.

Module 16: jQuery Templating

• Loading DOM dynamically using Jquery templates
• loading templates using AJAX

Module 17: HTML 5

• Difference between HTML5 and HTML 4
• List of Browsers support HTML5
• Doc type
• Semantic Tags
• Multithreading Using Web Workers.
• Media Support (audio and video tags)
• Graphics using Canvas tag and SVG Tags.
• Drag and Drop features
• Offline Application using Application Cache
• Exploring Navigator Object
• Working on locations lat and lng using Geolocation
• Storing user preferences using Local storage & Session Storage

Module 18: CSS 3

• Difference between CSS 2 and CSS 3
• Adding borders and backgrounds
• Advanced text effects(shadow)
• 2D and 3D Transformations
• Adding Transitions to elements
• Adding animations to text and elements

Module 19: Responsive Design

• Difference between multiple devices, making a page to work on multiple devices
• Media queries
• Introduction to Bootstrap CSS API

Module 20: Angular JS

• Introduction and History
• What is MVC
• Features and Advantages of Angular Js
• Angular Expressions
• Predefined Directives
• Dependency Injection
• AJAX communication in Angular using $http
• Handling Multiple AJAX requests using $http promises.
• Working on multiple controllers with in single application
• Communication between controllers using broadcast and $rootScope
• Difference between $scope and $rootScope

Module 21: SPA

• What is Single Page Application
• Exploring routeProvider service
• Working on $location service
• Angular configuration

Module 22: Filters

• Angular predefined Filters
• Accessing Filters in controllers
• Creating Custom Filters

Module 23: Angular Forms

• Form Validations
• Angular predefined Form validation classes
• Exploring ng-valid, ng-invalid, ng-pristine, ng-dirty, ng-touched etc

Module 24: Predefined Methods

• Angular predefined methods
• Bootstrap, copy, equals, forEach, extend, toJSON etc.

Module 25: Handling Events

• Adding events in angular js</
• ng-click, ng-dbclick,ng-

Module 26: Controller directives

• ng-if
• ng-switch
• ng-include

Module 27: NgResource

• Handling REST calls using $resource
• Performing get, post, put, query, remove an delete calls using $resource

Module 28: Custom Directives

• Creating Custom User defined directives in Angular
• Exploring template, templateUrl, scope, link and restrict properties
• Manipulating DOM element using Directives

Module 29: Angular services

• Constants
• Value
• Factory
• Services
• Providers

Module 30: Angular Scope Functions

• $watch
• $apply
• $digest

NODE JS
Module 1: Introduction to NodeJS

• Introduction and History
• Latest version details

Module 2: Installation and Environment Setup

• Setting up the Node environment
• Node and npm Installation

Module 3: REPL Terminal

• Exploring REPL Terminal
• Walkthrough commands on terminal

Module 4: Digging into NODE

• Server side Javascript
• Introduction to NPM
• Creating simple http server
• Exploring package.json

Module 5: Event Loop

• What is Event Loop
• Exploring Event driven programming
• Emitting events
• Setting Callback methods

Module 6: Web Module

• Creating simple webservices
• Creating web clients using node.

Module 7: Express js

• Exploring Express module
• Setting up express environment
• Creating http server using express
• Reading data from GET/POST requests

Module 8: Templates

• Creating templates using PUG
• Generating Dynamic html pages from server
• Responding a template for a client request

Module 9: File system

• Exploring File system
• Reading and writing to files

Module 10: REST API

• Introduction to REST API
• REST Architecture

Module 11: Clustering

• Creating and handling multiple clusters in Node js

Module 12: Db Connection

• Connecting to Mongo DB
• Connecting to SQL

Module 13: WebService with DB interactions

• Creating web services which communicate with Database

MONGO DB
Module 1: Overview

• History and over view of MONGO DB
• Advantages
• How it differs from other DB

Module 2: Environment Setup

• Setting up the environment and installation of Mongo DB

Module 3: Data modeling

• Exploring Data modeling
• Creating and Dropping DB

Module 4: Creating DB in Mongo

• Droping an existing DB

Module 5: Datatypes and collections

• Datatypes
• Creating and dropping collections

Module 6: Documents

• Creating Documents
• Updating and Dleting Documents
• Query Documents

Module 7: Backup support

• Creating Backup for database