Your SlideShare is downloading. ×
01 Ajax Intro
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

01 Ajax Intro

849
views

Published on

AJAX Intro

AJAX Intro

Published in: Education, Technology

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
849
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
21
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • Transcript

    • 1. AJAX A Brief Introduction to AJAX
    • 2. AJAX Defined
      • Jesse James Garrett 2/18/05
        • http://tinyurl.com/7xzse – Hype Ground 0
        • Defines AJAX:
          • “ Ajax isn’t a technology. It’s really several technologies, each flourishing in its own right, coming together in powerful new ways. Ajax incorporates:
          • standards-based presentation using XHTML and CSS;
          • dynamic display and interaction using the Document Object Model;
          • data interchange and manipulation using XML and XSLT;
          • asynchronous data retrieval using XMLHttpRequest;
          • and JavaScript binding everything together.”
    • 3. AJAX?
      • Asynchronous JavaScript and XML
        • Doesn’t have to be XML being transmitted – can be any data e.g. HTML
      • AJAX has become the new popular umbrella term that includes DHTML and Web 2.0 types of websites. Examples include:
        • Google Maps, Gmail.com, Google Suggest, Digg.com,
    • 4. Better than Flash?
      • AJAX and Flash Compared
        • http://getahead.ltd.uk/ajax/ajax-flash-compared
        • Depends on the needs of the application
    • 5. AJAX 101
      • History: “Microsoft first implemented the XMLHttpRequest object in Internet Explorer 5 for Windows as an ActiveX object. Engineers on the Mozilla project implemented a compatible native version for Mozilla 1.0 (and Netscape 7). Apple has done the same starting with Safari 1.2.”
      • AJAX is special because so many browsers support it out of the box.
    • 6. AJAX 101: XMLHttpRequest
      • XMLHttpRequest performs an HTTP GET or POST in the background (asynchronously) then calls a JavaScript function when it’s done.
      • The XMLHttpRequest is a JavaScript object that offers a convenient way for web pages to get information from servers without refreshing themselves.
    • 7. AJAX 101: XMLHttpRequest
      • The benefit to end users is that they don't have to type as much and they don't have to wait as long.
        • For example, having the user's city and state show up in a webpage automatically after the ZIP code has been typed in is a big time saver.
      • A good way to think of the XMLHttpRequest object is as you would think of the JavaScript Image object. When a mouseover is performed the next images loads without reloading the page.
    • 8. A Client/Server Computing Model Client Computer Browser Server Computer HTTP Service HTTP REQUEST HTTP RESPONSE (URL,Post,Get,..) (XHTML...) A State-less Environment
    • 9. Client Browser (state A) HTTP Server HTTP REQUEST HTTP RESPONSE New Page Default Synchronous Processing Scenario Client Browser (state B) (state A) (state A + … = state B)
    • 10. Client Browser (state D) Client Browser (state A) HTTP Server REQUEST RESPONSE – New Page Asynchronous Processing Scenario Client Browser (state C) Client Browser (state B) REQUEST/RESPONSE REQUEST/RESPONSE Using XMLHttpRequest Object
    • 11. AJAX Gotchas
      • Back Button doesn’t work “right”
      • Bookmarks do not work “right”
      • Many “solutions” are starting to come out
        • How to Handle Bookmarks and Back Buttons
        • by Brad Neuberg http://tinyurl.com/agpeg
      • JavaScript Versions and History
        • http://getahead.ltd.uk/technotes/JSVersions
    • 12. What to do next
      • Read and practice
        • Use XAMPP or buy a cheap web hosting account.
          • XAMPP is a free easily installable Web development environment for Windows, Linux & OS X http://apachefriends.org
        • Visit live AJAX demo sites:
        • http://ajaxrain.com
    • 13. Book: AJAX in Action
      • Ajax in Action
        • by Dave Crane and Eric Pascarello with Darren James
        • http://www.manning.com/books/crane/
        • Screencasts at http://tinyurl.com/bebmh
          • Four Minute Overview:
          • Twenty-two Minute walkthru:
    • 14. Blog: Ajaxian.com
      • Ajaxian.com has good podcast episode summaries online
      • Episode 11
        • Rate it up by order of magnitude – that’s ROI
        • Scriptaclous guy
        • XML and DOM manip is really slow only use if you have pre-existing XML api
        • Prototype extends object and array and this causes problems with other libraries.
    • 15. Credits
      • Professor Stephen K. Kwan
        • http://www.cob.sjsu.edu/kwan_s
      • AJAXIAN
        • http://ajaxian.com/
      • AJAX Matters
        • http://ajaxmatters.com/