FULL Stack

Reading Time: 4 minutes

FullStack

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 Java script.
• 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()
• Java Script 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