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)

Week 10 Technical Stack Pt. 1

  • 1.
    CS 292: Beyondthe 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 fromPresentation 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 MarkupLanguage (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 therequirements 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 ofData – 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 ofData – 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 ofData – 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 ofData – 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 requiredrecoding 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 Contentdescribed 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: Madeup 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 withinElements <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 vsValid? 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 – contentXSL – 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 CS292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 24.
    Practical Application ofXML 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 descriptionsof 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 URLLength (in bytes) Type – format of media GUID PubDate Source CS 292-1: Beyond the One Way Web (beyondtheonewayweb.wordpress.com)
  • 28.
    Demo – FoxNews 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)