SlideShare a Scribd company logo
CS 292: Beyond the One Way Web Dan Nanto, Spring 2008 http://beyondtheonewayweb.wordpress.com
Who Am I? CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Seperating Content from Presentation XML XSL Example: RSS Dynamic Browser Presentation Javascript DHTML & DOM AJAX APIs – Services Example: Google Maps CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
"The Extensible Markup Language (XML) is the universal format for structured documents and data on the Web."  --  W3C XML Web site , July 2000. CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
to meet the requirements of large-scale Web content providers for industry-specific markup vendor-neutral data exchange media-independent publishing one-on-one marketing workflow management in collaborative authoring environments and the processing of Web documents by intelligent clients   [971208 W3C press release] CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
File transfer of Data – Fixed Width Format John  Smith  06271975  M Susan  Johnson 07121986  F Abraham  Jones  09251988  M CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
File transfer of Data – Fixed Width Format John  Smith  06271975  M Susan  Johnson 07121986  F Abraham  Jones  09251988  M Billy-Jo-Bob Christenson 10111987 M CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com) Any change to structure caused rework on both sides!
File transfer of Data – Character Separated John|Smith|06271979|M Susan|Johnson|07121986|F Abraham|Jones|09251988|M Billy-Jo|Christenson|10111987|M CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
File transfer of Data – Character Separated John|Smith|06271979|M |555-5133 Susan|Johnson|07121986|F |555-5153 Abraham|Jones|09251988|M |555-5163 Billy-Jo|Christenson|10111987|M |555-5183 CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com) Again, change to structure caused rework on both sides!
Static. Changes required recoding on both sides No Validation No context for data Not easily standardized  CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
<user> <firstName>John</firstName> <lastName>Smith</lastName> <birthDate>06271979</birthDate> <sex>M</sex> <phone>555-5133</phone> </user> CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Structured Data Content described Dynamic Validated (DTDs and XML Schema) Portable Extensible CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com) <user> <firstName>John</firstName> <lastName>Smith</lastName> <birthDate>06271979</birthDate> <sex>M</sex> <phone>555-5133</phone> </user>
Elements Case sensitive, surrounded by <>, no white space Must have a root Element Elements – empty, or closing elements <someElement/> <someElement></someElement>  Must be properly Nested <some><text></text></some> CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Naming Rules: Made up of alpha/numeric characters Must start with alpha character Can not contain white space Recommendations: Descriptive  Short & Simple Avoid “.”, “:”, “-” as word seperators CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Attributes contained within Elements <someElement name=“Ted”></someElement> Must be quoted <someElement  name=test /> -Bad! Can have multiple attributes per element Can not contain reserved characters Can not contain multiple values, tree structures or future changes. CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Well Formed vs Valid? Commenting XML <!--  this is a comment --> CData vs PCData <![CDATA[  … some data … ]]> XML Schema vs. DTDs CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
<user> <firstName>John</firstName> <lastName>Smith</lastName> <birthDate>06271979</birthDate> <sex>M</sex> <phone>555-5133</phone> </user> CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
<!DOCTYPE user [ <!ELEMENT user (firstName, lastName, birthDate, sex, phone)>  <!ELEMENT firstName (#PCDATA)>  <!ELEMENT lastName (#PCDATA)>  <!ELEMENT birthDate (#PCDATA)>  <!ELEMENT sex (#PCDATA)>  <!ELEMENT phone (#PCDATA)>  ]> CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
<xs:element name=“user&quot;>  <xs:complexType>  <xs:sequence>  <xs:element name=“firstName&quot; type=&quot;xs:string&quot;/>  <xs:element name=“lastName&quot; type=&quot;xs:string&quot;/>  <xs:element name=“birthDate&quot; type=&quot;xs:date&quot;/>  <xs:element name=“sex&quot; type=&quot;xs:string&quot;/>  <xs:element name=“phone&quot; type=&quot;xs:string&quot;/>  </xs:sequence>  </xs:complexType>  </xs:element> CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
<xs:element name=“user&quot;>  <xs:complexType>  <xs:sequence>  <xs:element name=“firstName&quot; type=&quot;xs:string&quot;/>  <xs:element name=“lastName&quot; type=&quot;xs:string&quot;/>  <xs:element name=“birthDate&quot; type=&quot;xs:date“  use=“required” />  <xs:element name=“sex&quot; type=&quot;xs:string“  default=“M” />  <xs:element name=“phone&quot; type=&quot;xs:string&quot;/>  </xs:sequence>  </xs:complexType>  </xs:element> CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Additional Restrictions values: 1-100 series of values: “red”, “blue”, “green” data format: ([a-z])* white space Length CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
XML – content XSL – Presentation  CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com) <user> <firstName>John</firstName> <lastName>Smith</lastName> <birthDate>06271979</birthDate> <sex>M</sex> <phone>555-5133</phone> </user> <user> <firstName>Susan</firstName> <lastName>Johnson</lastName> <birthDate>07121986</birthDate> <sex>F</sex> <phone>555-5153</phone> </user> Name: John Smith Born: June 27, 1979 Sex: Male Phone Number: 555-5133
XSL Demo CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Practical Application of XML and XSL technologies RSS standard format for publishing  Different RSS readers can publish in different ways using XSL templates for rendering Other tools can build to the standard RSS format such as Mashups CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Channel Generic descriptions of the feed Owner and admin information Contains “Items” CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Item Title Link – URL of the item Description - Synopsis Author  Category CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Item Category URL Length (in bytes) Type – format of media GUID PubDate Source CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Demo – Fox News RSS feed and Yahoo Pipes CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)
Questions? CS 292-1: Beyond the One Way Web  (beyondtheonewayweb.wordpress.com)

More Related Content

PPT
Week 10 Technical Stack I I 03
PPTX
WCF & JQuery
PPT
Microformats at Web 2.0 Expo April 2007
PPTX
HTML Bootcamp
PPTX
Internet and Web Technology (CLASS-7) [XML and AJAX] | NIC/NIELIT Web Technology
PPTX
Internet and Web Technology (CLASS-3) [HTML & CSS]
PPTX
HTML Training in Ambala ! Batra Computer Centre
PPTX
Html basics-auro skills
Week 10 Technical Stack I I 03
WCF & JQuery
Microformats at Web 2.0 Expo April 2007
HTML Bootcamp
Internet and Web Technology (CLASS-7) [XML and AJAX] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-3) [HTML & CSS]
HTML Training in Ambala ! Batra Computer Centre
Html basics-auro skills

What's hot (6)

PDF
Computer Networks: An Introduction
PDF
Webware - 문서에서 운영 체제 까지 - 윤석찬 (2014)
PDF
Frontend bootcamp
PPTX
Internet and Web Technology (CLASS-5) [HTML DOM]
PPT
Basics tags for HTML
KEY
HTML presentation for beginners
Computer Networks: An Introduction
Webware - 문서에서 운영 체제 까지 - 윤석찬 (2014)
Frontend bootcamp
Internet and Web Technology (CLASS-5) [HTML DOM]
Basics tags for HTML
HTML presentation for beginners
Ad

Viewers also liked (6)

PPTX
Pwning The Faerie Queene
PPT
Week 4 Software Development In The 21st Century
PPT
Week 5 Disruption
PPTX
Group 65 Debate Framework
PPTX
Microsoft Live Instructions
PPT
Week 3 -- An Open World
Pwning The Faerie Queene
Week 4 Software Development In The 21st Century
Week 5 Disruption
Group 65 Debate Framework
Microsoft Live Instructions
Week 3 -- An Open World
Ad

Similar to Week 10 Technical Stack Pt. 1 (20)

PPT
crystal xcelsius and web services by dashboardcafe.com
PDF
Searching the Web of Data (Tutorial)
PDF
Happy Browser, Happy User! NY Web Performance Meetup 9/20/19
PDF
BarCamp Sd Microformats
PDF
Open Web Camp 2015: Shave that handlebar mustache
PDF
Css essentials
PDF
Responsive Email Design and Development
PPT
Relational data as_xml
PDF
My Name is E & Open Standards
PPTX
warner-DP-203-slides.pptx
PPTX
IndyCodeCamp SDS May 16th 2009
PPTX
Jquery mobile
PPT
Web Applications
PDF
Adding Data into your SOA with WSO2 WSAS
ODP
Perchè potresti aver bisogno di un database NoSQL anche se non sei Google o F...
PPTX
Mark Logic StrangeLoop 2010
DOCX
Krishnan SQL Developer
PDF
Standardizing the Web: A Look into the Why of Web Standards
PDF
Bootstrap 3 Basic - Bangkok WordPress Meetup
PDF
Graph Database Use Cases - StampedeCon 2015
crystal xcelsius and web services by dashboardcafe.com
Searching the Web of Data (Tutorial)
Happy Browser, Happy User! NY Web Performance Meetup 9/20/19
BarCamp Sd Microformats
Open Web Camp 2015: Shave that handlebar mustache
Css essentials
Responsive Email Design and Development
Relational data as_xml
My Name is E & Open Standards
warner-DP-203-slides.pptx
IndyCodeCamp SDS May 16th 2009
Jquery mobile
Web Applications
Adding Data into your SOA with WSO2 WSAS
Perchè potresti aver bisogno di un database NoSQL anche se non sei Google o F...
Mark Logic StrangeLoop 2010
Krishnan SQL Developer
Standardizing the Web: A Look into the Why of Web Standards
Bootstrap 3 Basic - Bangkok WordPress Meetup
Graph Database Use Cases - StampedeCon 2015

More from UC Santa Barbara (9)

DOCX
Vanderbilt Higher Standards for IT Pros
PPTX
Next Generation Network @ VU Abridged Oct. 2010
PPTX
Who is watching facebook
PPTX
Cyberinfrastructure And Network Computing
PPTX
Unified Collaboration And Technical Vision
PPTX
Microsoft Live Instructions
PPTX
CFT2009: Digital Intervention in the Dissemination of Knowledge
PPTX
Understanding Games
PPT
Week 8 -- Digital Distribution
Vanderbilt Higher Standards for IT Pros
Next Generation Network @ VU Abridged Oct. 2010
Who is watching facebook
Cyberinfrastructure And Network Computing
Unified Collaboration And Technical Vision
Microsoft Live Instructions
CFT2009: Digital Intervention in the Dissemination of Knowledge
Understanding Games
Week 8 -- Digital Distribution

Recently uploaded (20)

PPTX
Group 1 Presentation -Planning and Decision Making .pptx
PDF
1 - Historical Antecedents, Social Consideration.pdf
PDF
A contest of sentiment analysis: k-nearest neighbor versus neural network
PDF
Hindi spoken digit analysis for native and non-native speakers
PPT
Module 1.ppt Iot fundamentals and Architecture
PDF
Assigned Numbers - 2025 - Bluetooth® Document
PDF
sustainability-14-14877-v2.pddhzftheheeeee
PPTX
observCloud-Native Containerability and monitoring.pptx
PPTX
Tartificialntelligence_presentation.pptx
PDF
TrustArc Webinar - Click, Consent, Trust: Winning the Privacy Game
PDF
Video forgery: An extensive analysis of inter-and intra-frame manipulation al...
PDF
From MVP to Full-Scale Product A Startup’s Software Journey.pdf
PPT
What is a Computer? Input Devices /output devices
PDF
Enhancing emotion recognition model for a student engagement use case through...
PDF
DP Operators-handbook-extract for the Mautical Institute
PDF
Developing a website for English-speaking practice to English as a foreign la...
PPTX
Benefits of Physical activity for teenagers.pptx
PDF
NewMind AI Weekly Chronicles – August ’25 Week III
PDF
Taming the Chaos: How to Turn Unstructured Data into Decisions
PDF
How ambidextrous entrepreneurial leaders react to the artificial intelligence...
Group 1 Presentation -Planning and Decision Making .pptx
1 - Historical Antecedents, Social Consideration.pdf
A contest of sentiment analysis: k-nearest neighbor versus neural network
Hindi spoken digit analysis for native and non-native speakers
Module 1.ppt Iot fundamentals and Architecture
Assigned Numbers - 2025 - Bluetooth® Document
sustainability-14-14877-v2.pddhzftheheeeee
observCloud-Native Containerability and monitoring.pptx
Tartificialntelligence_presentation.pptx
TrustArc Webinar - Click, Consent, Trust: Winning the Privacy Game
Video forgery: An extensive analysis of inter-and intra-frame manipulation al...
From MVP to Full-Scale Product A Startup’s Software Journey.pdf
What is a Computer? Input Devices /output devices
Enhancing emotion recognition model for a student engagement use case through...
DP Operators-handbook-extract for the Mautical Institute
Developing a website for English-speaking practice to English as a foreign la...
Benefits of Physical activity for teenagers.pptx
NewMind AI Weekly Chronicles – August ’25 Week III
Taming the Chaos: How to Turn Unstructured Data into Decisions
How ambidextrous entrepreneurial leaders react to the artificial intelligence...

Week 10 Technical Stack Pt. 1

  • 1. CS 292: Beyond the One Way Web Dan Nanto, Spring 2008 http://beyondtheonewayweb.wordpress.com
  • 2. Who Am I? CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 3. Seperating Content from Presentation XML XSL Example: RSS Dynamic Browser Presentation Javascript DHTML & DOM AJAX APIs – Services Example: Google Maps CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 4. &quot;The Extensible Markup Language (XML) is the universal format for structured documents and data on the Web.&quot; -- W3C XML Web site , July 2000. CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 5. to meet the requirements of large-scale Web content providers for industry-specific markup vendor-neutral data exchange media-independent publishing one-on-one marketing workflow management in collaborative authoring environments and the processing of Web documents by intelligent clients [971208 W3C press release] CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 6. File transfer of Data – Fixed Width Format John Smith 06271975 M Susan Johnson 07121986 F Abraham Jones 09251988 M CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 7. File transfer of Data – Fixed Width Format John Smith 06271975 M Susan Johnson 07121986 F Abraham Jones 09251988 M Billy-Jo-Bob Christenson 10111987 M CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com) Any change to structure caused rework on both sides!
  • 8. File transfer of Data – Character Separated John|Smith|06271979|M Susan|Johnson|07121986|F Abraham|Jones|09251988|M Billy-Jo|Christenson|10111987|M CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 9. File transfer of Data – Character Separated John|Smith|06271979|M |555-5133 Susan|Johnson|07121986|F |555-5153 Abraham|Jones|09251988|M |555-5163 Billy-Jo|Christenson|10111987|M |555-5183 CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com) Again, change to structure caused rework on both sides!
  • 10. Static. Changes required recoding on both sides No Validation No context for data Not easily standardized CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 11. <user> <firstName>John</firstName> <lastName>Smith</lastName> <birthDate>06271979</birthDate> <sex>M</sex> <phone>555-5133</phone> </user> CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 12. Structured Data Content described Dynamic Validated (DTDs and XML Schema) Portable Extensible CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com) <user> <firstName>John</firstName> <lastName>Smith</lastName> <birthDate>06271979</birthDate> <sex>M</sex> <phone>555-5133</phone> </user>
  • 13. Elements Case sensitive, surrounded by <>, no white space Must have a root Element Elements – empty, or closing elements <someElement/> <someElement></someElement> Must be properly Nested <some><text></text></some> CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 14. Naming Rules: Made up of alpha/numeric characters Must start with alpha character Can not contain white space Recommendations: Descriptive Short & Simple Avoid “.”, “:”, “-” as word seperators CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 15. Attributes contained within Elements <someElement name=“Ted”></someElement> Must be quoted <someElement name=test /> -Bad! Can have multiple attributes per element Can not contain reserved characters Can not contain multiple values, tree structures or future changes. CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 16. Well Formed vs Valid? Commenting XML <!-- this is a comment --> CData vs PCData <![CDATA[ … some data … ]]> XML Schema vs. DTDs CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 17. <user> <firstName>John</firstName> <lastName>Smith</lastName> <birthDate>06271979</birthDate> <sex>M</sex> <phone>555-5133</phone> </user> CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 18. <!DOCTYPE user [ <!ELEMENT user (firstName, lastName, birthDate, sex, phone)> <!ELEMENT firstName (#PCDATA)> <!ELEMENT lastName (#PCDATA)> <!ELEMENT birthDate (#PCDATA)> <!ELEMENT sex (#PCDATA)> <!ELEMENT phone (#PCDATA)> ]> CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 19. <xs:element name=“user&quot;> <xs:complexType> <xs:sequence> <xs:element name=“firstName&quot; type=&quot;xs:string&quot;/> <xs:element name=“lastName&quot; type=&quot;xs:string&quot;/> <xs:element name=“birthDate&quot; type=&quot;xs:date&quot;/> <xs:element name=“sex&quot; type=&quot;xs:string&quot;/> <xs:element name=“phone&quot; type=&quot;xs:string&quot;/> </xs:sequence> </xs:complexType> </xs:element> CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 20. <xs:element name=“user&quot;> <xs:complexType> <xs:sequence> <xs:element name=“firstName&quot; type=&quot;xs:string&quot;/> <xs:element name=“lastName&quot; type=&quot;xs:string&quot;/> <xs:element name=“birthDate&quot; type=&quot;xs:date“ use=“required” /> <xs:element name=“sex&quot; type=&quot;xs:string“ default=“M” /> <xs:element name=“phone&quot; type=&quot;xs:string&quot;/> </xs:sequence> </xs:complexType> </xs:element> CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 21. Additional Restrictions values: 1-100 series of values: “red”, “blue”, “green” data format: ([a-z])* white space Length CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 22. XML – content XSL – Presentation CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com) <user> <firstName>John</firstName> <lastName>Smith</lastName> <birthDate>06271979</birthDate> <sex>M</sex> <phone>555-5133</phone> </user> <user> <firstName>Susan</firstName> <lastName>Johnson</lastName> <birthDate>07121986</birthDate> <sex>F</sex> <phone>555-5153</phone> </user> Name: John Smith Born: June 27, 1979 Sex: Male Phone Number: 555-5133
  • 23. XSL Demo CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 24. Practical Application of XML and XSL technologies RSS standard format for publishing Different RSS readers can publish in different ways using XSL templates for rendering Other tools can build to the standard RSS format such as Mashups CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 25. Channel Generic descriptions of the feed Owner and admin information Contains “Items” CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 26. Item Title Link – URL of the item Description - Synopsis Author Category CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 27. Item Category URL Length (in bytes) Type – format of media GUID PubDate Source CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 28. Demo – Fox News RSS feed and Yahoo Pipes CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 29. Questions? CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)