1 Course updates Quiz later today Deadline for personal home page - PowerPoint PPT Presentation

CS 102 Human-Computer Interaction Lecture 14: Web Research and Semantic Web CS102: Monsoon 2015 1

Course updates Quiz later today Deadline for personal home page now Monday Oct 26 (not a graded assignment) Submit idea logs Monday Oct 26 Design studio class Monday Oct 26 (probably) Additional meeting times? CS102: Monsoon 2015 2

Course mid-point Re fl ections/comments so far? CS102: Monsoon 2015 3

Javascript 4 CS102: Monsoon 2015

Javascript functions Functions are fi rst-class objects: they can be passed and returned to other functions Functions can be nested Closures retain state after a function returns function a() { var x = 1; return function() { console.log (x); } } CS102: Monsoon 2015 5

Javascript debugging “use strict” In-browser inspector Object.observe() CS102: Monsoon 2015 6

JS Frameworks Backbone, Angular, Ember, … Object.observe Follow the MVC paradigm Useful for single-page apps (e.g. Gmail) CS102: Monsoon 2015 7 https://www.airpair.com/js/javascript-framework-comparison

Angular example <div ng-app=""> Enter Name : <input type="text" ng-model="username" > <br/> Hello {{username}} </div> object.username can be changed from JS and automatically updates {{username}} in the view CS102: Monsoon 2015 8

` CS102: Monsoon 2015 9

Reprogramming the Web (examples) 10 CS102: Monsoon 2015

Relations, cards & templates CS102: Monsoon 2015 11 Link to Video

Bookify http://mobisocial.stanford.edu/bookify CS102: Monsoon 2015 12 12

Chickenfoot Scripting web interaction in the browser CS102: Monsoon 2015 13 13 http://groups.csail.mit.edu/uid/chickenfoot/index.php

The semantic web 14 CS102: Monsoon 2015

The semantic web Web pages are designed for humans to read, not for computer programs to manipulate meaningfully Semantic web envisages structured information: all items are marked up semantically e.g. date, people names, addresses, … (much more) Allows powerful queries across web sites Championed by Tim Berners Lee CS102: Monsoon 2015 15 15 http://www.cs.umd.edu/~golbeck/LBSC690/SemanticWeb.html

Semantic web technologies Resource Description Framework: (RDF) Triples of the form: <Subject> <Predicate> <Object> Allows fl exible structure unlike relational databases URI: Uniform Resource Identifer (ISBN:9780465003945) SPARQL: Query language, like SQL CS102: Monsoon 2015 16 16

Semantic web challenges Consistent ontology Speed Inference CS102: Monsoon 2015 17 17

Semantic web technologies select ?studentName where { ?student studentOf ?university . ?university name “Ashoka University” . ?student name ?studentName } Each clause is of the form <Subject> <Predicate> <Object> CS102: Monsoon 2015 18 18

Semantic databases mined from DBpedia YAGO Freebase Google Knowledge Graph … CS102: Monsoon 2015 19 19

Quiz time 20 CS102: Monsoon 2015

Have a good break! 21 CS102: Monsoon 2015