Web 2.0 & Ajax - Speaker Deck

Slide 1

Slide 1 text

Web 2.0 & Ajax ৷ਃࣸ

Slide 2

Slide 2 text

ІҢʧୗ • ৷ਃࣸothree • http://blog.othree.net • ˂ɽήɽ̨߅ɽ • ጳሳjɽ௅΅ঐ͜ᓭᚎኜකٙ؇Г • OpenVanilla Bookmarkletو

Slide 3

Slide 3 text

Outline • Web 2.0 beta • Ajax

Slide 4

Slide 4 text

ᅰЗࣛ˾ 15ʱᙒพᏑWeb 2.0

Slide 5

Slide 5 text

• 15ʱᙒ ‎ Web 2.0 • 20ʱᙒ ‎ Web 2.0 & Ajax

Slide 6

Slide 6 text

ʡჿ݊ Web 2.0 k

Slide 7

Slide 7 text

ࠅᐝ༆ Web 2.0

Slide 8

Slide 8 text

Ңࡁცࠅ΋ᐝ༆

Slide 9

Slide 9 text

Web 8.0

Slide 10

Slide 10 text

Web 8.0 Resurgence of The Web • A new and improved Web emerges and it looks almost exactly like the one that was predicted at the 1st Annual Web 8.0 Conference, which was held in 2007 http://www.webeightpointoh.com/

Slide 11

Slide 11 text

Web 2.0 ݊ʡჿk • อҦஔk • БቖΤ൚k • Ajaxk • Blogk • RSSk • Wikik

Slide 12

Slide 12 text

http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html

Slide 13

Slide 13 text

Web 2.0 ٙ20΁ԫ • ɓ΁ԫᑺɓʱᙒ࡝࡝λ http://www.ithome.com.tw/plog/index.php?op=ViewArticle&articleId=3868&blogId=410

Slide 14

Slide 14 text

ɓԊᗭး

Slide 15

Slide 15 text

Web 2.0 ݊ • WebԴ͜˙όٙҷᜊ • Webਠุᅼόٙҷᜊ

Slide 16

Slide 16 text

WebԴ͜˙όٙҷᜊ • Reader to writer • blog • Web OS • Google Docs • Store data on Web • Gmail

Slide 17

Slide 17 text

Webਠุᅼόٙҷᜊ • ڗ҈ଣሞ • Google • C2C • ebay • Open API • Դ͜٫౤Զʫ࢙

Slide 18

Slide 18 text

Դ͜٫౤Զʫ࢙ • del.icio.us • ﬂickr • Դ͜٫↑ ‎ ʫ࢙↑

Slide 19

Slide 19 text

ה˸ Web 2.0 ݊

Slide 20

Slide 20 text

ה˸ Web 2.0 ݊ • ၣ༩Бމᅼόٙҷᜊ • ၾҦஔೌᗫ

Slide 21

Slide 21 text

ה˸ Web 2.0 ݊ • ၣ༩Бމᅼόٙҷᜊ • ၾҦஔೌᗫ • ਠุɹ໮

Slide 22

Slide 22 text

Tim Berners-Lee on Web 2.0 http://arstechnica.com/news.ars/post/20060901-7650.html nobody even knows what it means

Slide 23

Slide 23 text

ԈɛႭɛ༑ Ԉ৺Ⴍ৺༑

Slide 24

Slide 24 text

Ajax Asynchronous Javascript + XML

Slide 25

Slide 25 text

http://www.adaptivepath.com/publications/essays/archives/000385.php

Slide 26

Slide 26 text

No content

Slide 27

Slide 27 text

No content

Slide 28

Slide 28 text

Ajax ݊ ... • Web Application Model • XHTML & CSS • DOM • XML & XSLT • XMLHttpRequest • JavaScript

Slide 29

Slide 29 text

XMLHttpRequest

Slide 30

Slide 30 text

XMLHttpRequest • Microsoft Internet Explorer 5 @ 2000 • An AcriveX object • var req = new ActiveXObject(Microsoft.XMLHTTP); • var req = new ActiveXObject(Msxml2.XMLHTTP); http://en.wikipedia.org/wiki/Xmlhttprequest http://www.xml.com/pub/a/2005/02/09/xml-http-request.html

Slide 31

Slide 31 text

XMLHttpRequest • Firefox, Safari, Opera ...etc after 2002 • req = new XMLHttpRequest(); • W3C Working Draft @ 2006 http://en.wikipedia.org/wiki/Xmlhttprequest http://www.xml.com/pub/a/2005/02/09/xml-http-request.html http://www.w3.org/TR/XMLHttpRequest/

Slide 32

Slide 32 text

Ajax Showcase

Slide 33

Slide 33 text

No content

Slide 34

Slide 34 text

No content

Slide 35

Slide 35 text

No content

Slide 36

Slide 36 text

No content

Slide 37

Slide 37 text

No content

Slide 38

Slide 38 text

Ajax Technologies ࡡ֐˙ࣩ ಁ˾˙ࣩ XML JSON HTML XMLHttpRequest hidden iframe JavaScript VBScript

Slide 39

Slide 39 text

Ѣᗭ • ᓭᚎኜ኷ن • More and more codes • Ajax Frameworks • ၣ१ፋձɢ

Slide 40

Slide 40 text

Ajax Frameworks • ڢ੬ε....

Slide 41

Slide 41 text

For PHP http://ajaxpatterns.org/PHP_Ajax_Frameworks

Slide 42

Slide 42 text

For PHP • ॆٙܘε • My-BIC • ௰ଉ @ digg.com • FirefoxeIEeOperaeSafari • Debugʧࠦ http://phpshot.org/blog/archives/2006/10/phpajax_1.html http://www.litfuel.net/mybic/

Slide 43

Slide 43 text

For ASP.NET • Ajax ASP.NET • ฆழ̈ۜ http://ajax.asp.net/

Slide 44

Slide 44 text

For ...... • JavaScript • C++, C#, ColdFusion, Eiffel, .Net, Java, Lisp, Lotus, Perl, Python, Ruby, Smalltalk http://ajaxpatterns.org/Framework

Slide 45

Slide 45 text

ၣ१ፋձɢ • ɪɓࠫeɨɓࠫeࣣᜀ • Screen ReaderʔึءจՑၣࠫٙһҷ

Slide 46

Slide 46 text

ɪɓࠫɨɓࠫၾࣣᜀ • windows.location • # (fragment identiﬁer) • http://mail.othree.net/#inbox • http://mail.othree.net/#sent • Really Simple History framework (RSH) http://www.onjava.com/pub/a/onjava/2005/10/26/ajax-handling-bookmarks-and-back-button.html http://dev2dev.bea.com/pub/a/2006/01/ajax-back-button.html

Slide 47

Slide 47 text

Screen Reader • ᜫԴ͜٫ٝ༸ၣࠫһอə • alert • location • focus • .... http://www.sitepoint.com/article/ajax-screenreaders-work

Slide 48

Slide 48 text

Ajaxٙ͊Ը • OpenAjax Alliance • JSONRequest

Slide 49

Slide 49 text

OpenAjax Alliance • AppleeMozillaeGoogle...ഃ63࢕ʮ̡ • ӚϞMicrosoft • Atlas http://ajax.asp.net/

Slide 50

Slide 50 text

JSONRequest • XML • ልᕏe༟ࣘඎɽe࿔ • JSON (JavaScript Object Notation) • ᔊఊe༟ࣘඎʃeҞ • ٜટԴ͜JSONЪމ༟ࣘෂ፩ࣸό http://www.json.org/JSONRequest.html