Arich Infotech

UI / UX Programming

UI / UX Programming

Duration in Hours (4 Hours session) : 60

Duration in Days: 15

UI/UX Course

Course Code: UIUX43

40 Hours of Theory

20 Hours of Lab

  1. UI Developer roles and Responsibilities
  2. UX designer roles
  3. Technologies needed
  4. Power of UI
  5. Current market requirements on UI
  1. DOM
  2. Structure of HTML Page
  3. Including external page links in a page using anchor tags and its properties
  4. Working with row and column data using table tags
  5. Hiding and unhiding elements using display property
  6. img tag, p tag, ul and ol tags, li, nobr, hr, bretc
  7. Layouts, forms, buttons
  8. Input fields (textbox, radiobutton, checkbox, dropdown, textareaetc)
  1. Difference between HTML5 and HTML 4
  2. List of Browsers support HTML5
  3. Doctype
  4. Media tags (audio and video tags)
  5. Graphics using Canvas tag
  6. Drag and Drop features
  7. Working on locations lat and lng using Geolocation
  8. Storing userpreferences using Localstorage.
  1. Difference between CSS2 and CSS3
  2. Adding borders and backgrounds
  3. Advanced text effects(shadow)
  4. 2D and 3D Transformations
  5. Adding Transitions to elements
  6. Adding animations to text and elements Responsive Designs
  7. Difference between multiple devices, making a page to work on multiple devices
  8. Media queries
  9. Introduction to Bootstrap CSS API
  1. Mandatory tags in html page (html, head, body)
  2. What is CSS
  3. Different ways of applying css for elements, and priority chain of css
  4. Heading tags(H1…H6), Tags and attributes(Class, Id, style..etc)
  5. Inline and blocklevel elements
  6. Adding borders, font, pseudo classes,
  7. Positioning elements (absolute, relative, fixed and static)
  8. Image spriting
  9. Boxmodel (margins, padding)
  10. Floating elements (float left, right etc.)
  11. Including external resources
  12. Absolute and Relative paths
  13. Including external resources like css, images etc
  1. Get & Post
  2. Validating input values in a form.
  3. Form action and type.
  1. Introduction
  2. Data types and data structures in Js
  3. Control structures, if, ifelse, while, for, switch case statements
  4. Dynamic creation and maniplation of dom elements using js
  5. Adding dynamic event listerners to dom elements
  6. Event capturing and event bubbling
  7. Validations using key charcodes
  8. Arrays
  9. Predefined methods in arrays
  10. Strings and predefined methods
  11. Objects
  12. JSON
  1. Prototyping in JavaScript
  2. Closures in JavaScript
  3. Inheritance in JavaScript
  4. Adding methods for an object
  1. Onload and onreadydiffrence
  2. jQuery selectors
  3. Multiple ways of referingdom elements using jQuery selectors
  4. jQuery methods
  5. Adding dynamic properties for dom elements
  6. Toggleing elements
  7. Creating dynamic elements using jQuery
  8. Finding elements using jQuery techniques
  9. Filtering elements
  10. Binding events
  11. Dynamic binding
  12. List of events been supported in jQuery(blur, change, click, dbclick….etc)
  1. Advantages with Ajax and its limitations
  2. Samples working with Ajax
  3. Different data formats used in Ajax (string, xml, Json, etc)
  4. XML and JSON difference
  5. Crossdomain interactions using JSONP
  1. Introduction
  2. Power of ngjs
  3. Controllers and modules in ngs with sample program
  4. Data binding with sample program
  5. What is filter and adding filters to dom elements with sample code.
  6. Loading multiple page content into a single page using ng-routing – Working example.
  7. Developer Tools Addons:
  8. Firebug, chrome and IE Developer tools.
  1. Node.js Environment setup
  2. First application,REPL terminal
  3. Package Manager
  4. Callbacks concept
  5. Event loop and Emitter
  6. Buffers
  7. Streams
  8. FileSystem
  9. Global objects
  10. Utility modules
  11. Web module
  12. Express framework
  13. RESTful API
  14. Packaging
  1. Virtual DOM
  2. React without JSX
  3. Npm Tools
  4. Gulp vs Grunt
  5. Gulp basic
  6. Gulp build react
  7. ES5 vs ES6
  8. Babel trans-compiler
  9. Babel options (.babelrc)
  10. React using ES6 syntax
  11. Key differences
  12. Stateless vs Stateful components
  13. Parent – Child components
  14. Smart Parent
  15. Lifecycle of Components
  16. Forcing component rendering
  17. Reusable Components Controlled Components
  18. Server Side Communication
  19. Promises using Fetch
  20. CORS
  21. Get vs POST
  22. Other REST methods
  23. Routing and SPA
  24. Configuration based routing
  25. Passing parameters
  26. React Architecture with Flux / Redux
  27. State container
  28. Reducers
  29. Principles
  30. Store
  31. Actions
  32. Dispatcher
  33. Routing
  34. Unit Testing
  35. Cucumber
  36. Enzyme
  37. Jasmine TestFramework