Anatomy of an Advanced Web Application

Web Architecture and Information Management [./]
Spring 2010 — INFO 190-02 (CCN 42509)

Erik Wilde and Ryan Shaw, UC Berkeley School of Information
2010-03-15

Creative Commons License [http://creativecommons.org/licenses/by/3.0/]

This work is licensed under a CC
Attribution 3.0 Unported License [http://creativecommons.org/licenses/by/3.0/]

Contents Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

Contents

Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(2) Abstract

The widespread adoption of client-side scripting and AJAX techniques has resulted in web applications becoming easier use but harder to understand. No longer is it the case that HTML is used simply to present a document to be read. Now HTML, Javascript and CSS are used together to build dynamic applications that run in the browser. These applications often depend on APIs, resources intended for use by programs rather than people.



Getting Advanced

Outline (Getting Advanced)

  1. Getting Advanced [8]
  2. Midterm [2]
Getting Advanced Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(4) Our Favorite Color, Basic

img/basic_flow.png


Getting Advanced Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(5) Our Favorite Color, Advanced

http://waim.aeshin.org/favcolor/ [http://waim.aeshin.org/favcolor/]


Getting Advanced Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(6) Our Favorite Color, Advanced

img/ajax_flow.png


Getting Advanced Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(7) New Resources



Getting Advanced Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(8) Web Service APIs



Getting Advanced Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(9) Javascript Object Notation (JSON)



Getting Advanced Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(10) JSON Example

{ 
  'name': 'Web Architecture & Information Management',
  'semester': 'Spring 2010',
  'students': [
    { 
      'name': 'Angie Fredette',
      'year': 1 
    },
    { 
      'name': 'Philip Fall',
      'year': 4 
    },
    { 
      'name': 'Olivia Odum',
      'year': 2 
    } 
  ] 
}


Getting Advanced Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(11) Alternative Interfaces via Web APIs

img/ambient_orb.jpg


Midterm

Outline (Midterm)

  1. Getting Advanced [8]
  2. Midterm [2]
Midterm Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(13) Midterm



Midterm Erik Wilde and Ryan Shaw: Anatomy of an Advanced Web Application

(14) Review Session



2010-03-15 Web Architecture and Information Management [./]
Spring 2010 — INFO 190-02 (CCN 42509)