• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
WA1503 Mastering AJAX Training and Courseware
 

WA1503 Mastering AJAX Training and Courseware

on

  • 422 views

 

Statistics

Views

Total Views
422
Views on SlideShare
422
Embed Views
0

Actions

Likes
0
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft Word

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    WA1503 Mastering AJAX Training and Courseware WA1503 Mastering AJAX Training and Courseware Document Transcript

    • WA1503 Comprehensive AJAX Training and Courseware (J2EE Edition) This training course teaches AJAX and all of its foundational technologies. XHTML and CSS2 are covered in details. Students will also learn the HTML Document Object Model (DOM) and how to manipulate a page dynamically in the client side using JavaScript. The AJAX API is covered in details. Students will also learn how to build their own AJAX based framework which will help them write complex applications quickly. How does this course differ from so many other AJAX training courses offered by the competition? • We cover XHTML and CSS2 in details. Students will be able to write rich AJAX applications. • Students learn how to develop an AJAX framework. • We teach popular third party AJAX frameworks - such as Dojo. • We cover the RPC mechanism - such as - XML and JSON. Topics • XHTML. • CSS2. • HTML Document Object Model (DOM) and the JavaScript API. • AJAX API. • Client Server RPC mechanisms such as Web Service and JSON. • Building an Object Oriented AJAX framework. • Third party AJAX frameworks such as DOJO. • Best practices and anti-patterns. What you will learn After completing this AJAX training course, the student should be able to: • Understand what is AJAX and when to use AJAX. • Plan the architecture of an application that will use AJAX. • Manipulate look and feel and content of a page dynamically and in the client side using JavaScript. Because they learn CSS2 and HTML DOM, they will be able to create impressive visual effects and rich customer experience. • Make an AJAX application interact with the server using an RPC mechanism. • Know how to build the server side code to support an AJAX client. • Use a third party AJAX framework. Audience • Web based application developers. The class is designed mainly for the J2EE developers. • Web site designers with good knowledge of Java Scripting can also take this class. Prerequisites J2EE based web application development. Basic knowledge of JavaScript and HTML. Duration 5 days.
    • WA1503 Comprehensive AJAX Training and Courseware Course Outline 0. Course Overview • Prerequisites • Course Objectives • Agenda Day 1 • Agenda Day 2 • Agenda Day 3 • Student Introductions 1. Introduction to AJAX • Objectives • What is AJAX? • A Simple Example • The Old Way • The AJAX Way • Two Key Aspects of AJAX • What are the Advantages of the AJAX Approach? • AJAX Technologies • The Basic AJAX API • Creating the XMLHttpRequest Object • The XMLHttpRequest Object Basics • Complete Example • The Timeline • Review Questions • Review Answers 2. XHTML • What is XHTML? • The DTD and MIME Type • The Basic Syntax • Embedding XHTML in a XML Document • Differences With HTML 4 • Embedding Scripts and Styles • The Standard Attributes • The <div> Element • The <span> Element • Review Questions • Review Answers 3. JavaScript DOM API • What is DOM? • Element Hierarchy • DOM Standardization
    • • The Document Object • The document Object • Nodes and Elements • The Element Object • Element Event Handlers • The window Object • The Frame Object • The History Object • Review Questions • Review Answers 4. AJAX API Details • The Request Object • Creating the Request Object • The Request Object • Simple GET Example • Making a POST Request • Making Concurrent Requests • Memory Leak With Inner Function • A POST Utility Function • Mozilla XmlHttpRequest Extensions • IE Microsoft.XMLHTTP Extensions • Ajax Caching • Control Cache Duration • Advanced Cache Control • Review Questions • Review Answers 5. CSS2 • Objectives • Introduction • New in CSS2 • Basic Syntax • Creating a Style Sheet • Value Types • Selectors • More on Selectors • Grouping Elements • The Box Model • Box Model Example • Box Properties • The Visual Formatting Model • Types of Boxes • Display Property • Positioning Schemes • The Position Property • Relative Positioning • The Float Property • The Clear Property • Absolute Positioning
    • • Layered Presentation • Color Property • Background Properties • Font Properties • Summary 6. Advanced DOM • The Event Object • Event Bubbling • Creating and Initializing an Event • Dispatching an Event • Example • Handling Events • Register Using HTML Markup • Register Using Element Property • Register Using DOM API • Best Practice • Canceling Default Action • Working With Styles • Example • The Style Object • Setting Style of an Element • Working With Style Sheets • DOM HTML API • Table DOM Objects • The HTMLTableElement Object • The HTMLTableRowElement Object • The HTMLTableCellElement Object • Example of Table DOM API • The Form Element Objects • The HTMLFormElement Object • The HTMLInputElement Object • The HTMLSelectElement Object • The HTMLOptionElement Element • Review Questions • Review Answers 7. Communication With Server - Basic • Introduction • Application Layer Protocol • Plain HTML Snippet • XML Document • XML Document Server Side • Example: Build DOM Document in Java • Example: Write DOM Document in HTTP Reply • Example: The Servlet • C#: Create a XML DOM Document • C#: Output XML in HTTP Reply • XML Document - Client Side • DOM API Summary
    • • DOM API The Document Object • DOM API The Element Object • Body Text of an Element • Setting Body Text • Displaying Body Text • Using XML As Request Data • Creating a New DOM Document • Serializing DOM Document as Text • Posting an XML Document • Processing the Posted XML From a Servlet • Review Questions • Review Answers 8. Communication With Server - JSON • Introduction • JavaScript Object Notation (JSON) • JSON Syntax • How Does JSON Based Communication Work? • How JSON Based Communication Work? • JSON: Server Side • JSON: Client Side • Working With Arrays • Advanced JSONObject Methods • Advanced JSONArray Methods • Summary • Review Questions • Review Answers 9. Direct Web Remoting (DWR) • Introduction • How DWR Works • DWR: The Server Side • Configuring the Server Side • The dwr.xml File • DWR: The Client Side • Unit Testing • Accessing Servlet API Objects • Error Handling • Review Questions • Review Answers 10. The Dojo Toolkit • Objectives • Introduction • Simple Example Tab Widget • How Does DOJO Work? • Importing Packages • Widget Basics
    • • Widget Layout Example • The Two byId() Methods • Widget Properties • Widget Events • Common Features of Widgets • Form Input Widgets • The Button Widget • The Checkbox Widget • The ComboBox Widget • The FilteringSelect Widget • The DateTextBox Widget • Layout Widgets • Other Common GUI Widgets • Creating Widget Instances Programmatically • Creating Widgets Programmatically • Summary • Review Questions • Review Answers 11. Dojo Event System • Objectives • Introduction • Difference from DOM Event Handling • JavaScript Function Call Event • Writing a JavaScript Class • Writing an Event Handler Class • Attaching the Event Handler • Handling Widget Event • More on Handler Attachment • The Dojo Event Object • Window Load/Unload Event • Publish Subscribe System • Writing a Publisher • Writing a Subscriber • Publishing the Message • Summary • Review Questions • Review Answers 12. Debugging Dojo Applications • Objectives • Logging in Dojo • Using Debug • Log Severities • Mozilla Debugging Tools • IE Debugging Tools • Other Tools • Summary • Review Questions • Review Answers
    • 13. Advanced JavaScript • Objectives • Basic Objects • Constructor Function Object • Object Properties • Constructor and Instance Objects • Constructor Level Properties • Namespace • Prototype • Prototype Property Hierarchy • Prototype Chain • Inheritance Using Prototype • Extending Inherited Behavior • Enhancing Constructors • Improving Constructor Performance • Event Handling Problem • Array • Traversing an Array • Appending to an Array • Deleting Elements • Inserting Elements • Other Array Methods • Summary 14. Ajax Security • Objectives • The Same Origin Policy • SOP Example • Exemption from SOP • Bypassing SOP • Using Dynamic Script Tag • The Main Page • The Included Script (test.js) • Code in Dynamic Script Element • Using an Ajax Proxy • Common Attacks for Ajax Applications • Cross Site Scripting (XSS) • XSS Example • Preventing XSS • JavaScript Worms • Cross-site Request Forgery (CSRF) • Preventing CSRF • JavaScript or JSON Hijacking • Hijacking Example • Exploiting JSON Hijacking • Preventing JSON Hijacking • Denial of Service (DoS) Attack • XML Bomb Attack • Ajax Proxy Vulnerability • Summary
    • 15. Security Guidelines • Objectives • Obfuscate JavaScript Code • Do Not Expose Privileged Functions • Do Not Expose Database Schema • Validate Input on Server Side • Password Protect Sensitive Operations • Careful of State Information • Use White List in Ajax Proxy • Do Not Consume Distrusted Content • Use eval() Carefully • Summary 16. JavaScript Performance Tuning • Objectives • Why Tune JavaScript Performance? • What to Tune? • Optimize Asset Download • Optimize Content Rendering • Optimize Code JavaScript Scope • Scope Example • Optimize Code Prototype • Optimize Code - Prototype • Optimize Code Avoid eval() • Optimize Code String Concatenation • Optimize Code Event Handling • Ajax Tuning Immediate Update • Ajax Tuning - Multiplexing • Ajax Tuning Use Push • Useful Tools • Summary 17. Mashups • Objectives • Introduction • Example ChicagoCrime.org • Mashup Genres • Key Components • Key Component Details • Retrieving Data • Data Assembly Details • Data Format Options • Data Format Options (cont d) • Instructor Demo • Enterprise 2.0 Mashups • Summary