ui development online training from akirait solutions
TRANSCRIPT
![Page 1: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/1.jpg)
UI Development AkiraIT Solutions
![Page 2: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/2.jpg)
Syllabus for HTML Training:
Introduction • The World Wide Web (WWW) and history of
HTML• Hypertext and Hypertext Markup Language• Why HTML• Prerequisites• Objective of this HTML course
![Page 3: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/3.jpg)
HTML Documents • Dividing the document into 2 parts.– Headers tags– Body tags
• Paragraphs• Formatting• Elements of an HTML Document – Text Elements– Tag Elements
![Page 4: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/4.jpg)
HTML Documents • Special Character elements• Image tags• HTML Table tags
• Lists – Numbered list– Non-Numbered lists– Definition lists
![Page 5: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/5.jpg)
HTML Documents • Anchor tag, Name tag etc.• Hyperlinks - FTP/HTTP/HTTPS• Links with images and buttons• Links to send email messages• Text fonts and styles• background colors/images• Marquee Behavior• Forms related tags (action,
method,name,input,submit etc)
![Page 6: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/6.jpg)
HTML Media Tags
• Inserting audio files• Inserting video files• Screen control attributes• Media control attributes• HTML Object
![Page 7: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/7.jpg)
HTML 5 :
– Introduction of different Web Technology
– HTML5 Introduction– HTML5 New Elements– HTML5 Video– HTML5 Video/DOM– HTML5 Audio– HTML5 Drag and Drop– HTML5 Canvas
![Page 8: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/8.jpg)
HTML 5 :
– HTML5 SVG– HTML5 Canvas vs. SVG– HTML5 Geolocation– HTML5 Web Storage– HTML5 App Cache– HTML5 Web Workers– HTML5 SSE
HTML5 Tags
![Page 9: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/9.jpg)
Syllabus Covered (CSS)
• 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 Box Model
![Page 10: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/10.jpg)
Syllabus Covered (CSS)
• CSS Border• CSS Outline• CSS Margin• CSS Padding• CSS Advanced• CSS Grouping/Nesting• CSS Dimension• CSS Display• CSS Positioning
![Page 11: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/11.jpg)
Syllabus Covered (CSS)
• CSS Floating• CSS Align• CSS Navigation Bar• CSS Image Gallery• CSS Image Opacity• CSS Image Sprites• CSS Media Types• CSS hacking• CSS Summary
![Page 12: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/12.jpg)
JQuery Introduction
–jQuery: An Introduction• How jQuery Works• A First Example
![Page 13: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/13.jpg)
JavaScript Basics
– Syntax Basics– Reserved Words– Operators• Basic Operators
– Operations on Numbers and Strings
![Page 14: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/14.jpg)
JavaScript Basics
– Logical Operators• Truthy and Falsy Values
– Comparison Operators– Conditional Code– Conditional Variable Assignment with
the Ternary Operator– Switch Statements
![Page 15: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/15.jpg)
JavaScript Basics
– Loops• The while loop• The do while Loop• The for Loop• The for in Loop• Breaking and Continuing
![Page 16: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/16.jpg)
JavaScript Basics
– Arrays– Objects
• Creating an Object Literal• Accessing Elements of an Object
– Functions• Using Functions• Self-Executing Anonymous Functions• Functions as Arguments
– Testing Type– Scope
![Page 17: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/17.jpg)
jQuery Basic Concepts
– Basic Flow of a jQuery Application– Using $(document)ready()– Selecting Elements
• Choosing Selectors• Does My Selection Contain Any Elements?• Saving Selections
– Operating on Selections• The $fn Methods• Refining and Filtering Selections• Chaining
![Page 18: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/18.jpg)
jQuery Basic Concepts
– Working with Selections• Getting and Setting Information About
Elements
– CSS, Styling, and Dimensions• Dimensions• Attributes• Showing and Hiding Elements• Iterating Over a Selection
– Traversing• Traversal Methods
![Page 19: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/19.jpg)
jQuery Basic Concepts
– Manipulating the DOM• Moving, Copying, and Removing
Elements• Cloning Elements• Removing Elements• Creating New Elements
![Page 20: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/20.jpg)
jQuery Core
– $ vs jQuery– $ vs $()– Closures– Utility Methods
• Checking Types• Storing and Retrieving Data Related to an
Element• DOM-Related Utilities• Feature and Browser Detection• Avoiding Conflicts with Other Libraries
![Page 21: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/21.jpg)
Events and Event Handlers
– Connecting Events to Elements• Connecting Events to Run Only Once• Removing Events Handlers• Namespacing Events• Using mouseenter/mouseleave Instead
of mouseover/mouseout
![Page 22: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/22.jpg)
Events and Event Handlers
– Inside the Event Handling Function– Triggering Event Handlers– Increasing Performance with Event
Delegation• Removing Delegated Event Handlers
– Event Helpers• $fnhover
• $fntoggle
![Page 23: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/23.jpg)
Effects
– Built-in Effects• Basic Use of a Built-in Effects• Changing the Duration of Built-in Effects• jQueryfxspeeds
![Page 24: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/24.jpg)
Effects
– Limitations on Effects– Queuing of Effects with Other Operations– Callbacks - Doing Something When an
Effect is Done• Running Code When an Effect is Complete
– Custom Effects with $fnanimate• Custom effects with $fnanimate• Easing
– Managing Effects– jQueryfxoff
![Page 25: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/25.jpg)
Ajax
– Key Concepts• GET vs POST• The Same Origin Policy• Data Types• A is for Asynchronous• Same-Origin Policy and JSONP• Ajax and Firebug
![Page 26: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/26.jpg)
Ajax
– jQuery's Ajax-Related Methods• $ajax• Convenience Methods• $fnload
– Ajax and Forms– Working with JSONP– Ajax Events
![Page 27: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/27.jpg)
Plugins
– How to Create a Basic Plugin• Testing Our Plugin
– Finding and Evaluating Plugins
![Page 28: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/28.jpg)
Best Practices
– JavaScript Best Practices• Namespacing Variables• Cache Frequently Used Values• Beware Anonymous Functions
![Page 29: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/29.jpg)
Best Practices
– jQuery Best Practices• Optimize Selectors• Use "Safe" Selectors• Use Event Delegation• Detach Elements to Work with Them• Use Stylesheets for Changing CSS on Many Elements• Use $data Instead of $fndata
– Code Organization• Key Concepts• Encapsulation
– Don't Treat jQuery as a Black Box
![Page 30: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/30.jpg)
Custom Events
– About Custom Events• Examples Without Using Custom Events• Examples Using Custom Events• Recap: $fnon, $fntrigger, and
$fntriggerHandler
– In Summary
![Page 31: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/31.jpg)
Angular JS
– Introduction to Angular JS 1.3 and Angular JS 2.0
– MVC architecture in AngularJS (views, controller, services)
– Dependency Injection– Using Directives and Data Binding– Iterating with the ng-repeat Directive– Using Filters
![Page 32: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/32.jpg)
Angular JS
– Scope and Routes– Debugging Angular JS with Batarang plug-in– Web service using AngularJS (resource, http &
promise)– Angular UI bootstrap– Ng-grid– Localisation with Angular JS– Security in Angular JS – Integration of JQuery in Directives– Best Practices of AngularJS– Unit Test case using Jasmine / Karma
![Page 33: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/33.jpg)
UI Development Online Training
AkiraIT Solutions,HNO:3-7, 4th Floor,Syndicate Bank Building,Beside Vijetha Supermarket,Opp: Padmavathi Rice Traders,Nizampet Village,500090.+91-9553406450, +91-40 4006 [email protected]
![Page 34: Ui development Online Training from AkiraIT Solutions](https://reader034.vdocuments.net/reader034/viewer/2022042706/58a76c981a28ab99238b4f55/html5/thumbnails/34.jpg)
AkiraIT SolutionsUi Development Online Training