Web-Technology Exam preparation

Exam When: 12-4-2017 at 13.30-15.30 Where: EDUC-ALFA Retake: The exam is closed-book Closed-slides Closed-notes Closed-laptop Closed-phone Closed-neighbour You can use scratch paper, of course Neither paper nor pens/pencils will be provided

More deadlines 10/04/2017: Assignment 3 submission 19/04/2017: Assignment 3 grades are posted 21/04/2017: Deadline for Assignment 3 grades to be disputed 25/04/2017: Final Exam grades are e-mailed to you 25/04/2017: Course grades are entered into Osiris Until 31/04/2017: Come to my office if you have questions about the final exam grade

Materials for exam preparation Lecture Slides Reading page

Topics: a look back Lecture 1 Lecture 2 Lecture 3 History of the Web Web standardization Lecture 2 OIS model TCP/IP URL, URI, URN HTTP HTML Lecture 3 HTML5 CSS(3.0)

Topics – a loooong look back Lecture 4 Basics of JavaScript Objects, Prototypes and Inheritance Functions Types and type conversion DOM Events Lecture 6 BOM Event model Event propagation Cookie

Topics: keep looking back Lecture 7 Callback functions jQuery Client-server architecture Intro to Node.JS Lecture 8 Building a simple Web App with Node.JS HTTP Request/Response Serving Static Files Handling Errors Form processing File Uploads JASON

Topics: looking back a bit more Lecture 9 Connect.JS Building Web Apps using Middleware Connect’s built-in middleware Typical middleware (handling errors, serving static files, parsing cookies, etc.) AJAX Lecture 10 Stateful Web Building up state in the URL ..using hidden input fields …or cookie or local storage Sessions Web-based data bases Node.JS meet SQLite Persistent Sessions

Topics: and a bit more Lecture 11 Lecture 12 Stateful Web with AJAX AJAX with JQuery Express.JS Setting up Web Apps Routing Serving Static files Handling errors Template engines Lecture 12 Social Web History and types of social Web Apps Features of social Web Current trends in Social Web development

Topics: still not looking forward Lecture 13 Semantic Web RDF RDFS Ontologies and OWL Schema.Org Google’s Knowledge Graph Facebook’s Open Graph Lecture 14 Adaptive Web Adaptive Systems User modelling Personalized Information Access Adaptive Search Adaptive Hypermedia Adaptive Recommendation

Topics: almost there Lecture 15 Web App Security Information Leakage and Improper Error Handling (SQL) Injection Cross-Site Scripting (XSS) Insecure Direct Object Reference Missing Function Level Action Control

Types of question: Conceptual understanding Which of the following statements are not true? Select one answer. a. HttpOnly cookies can not be sent over HTTPS. b. Secure cookies can not be sent over HTTP. c. The underlying problem of XSS is a lack of input validation.

Types of questions: Code analysis Given the following JavaScript code: x = "3" + "14"; alert(x); What will be presented in the alert box?

Types of questions: Code completion The following server code is vulnerable to SQL injection. // … String query = "SELECT user_id FROM user_data WHERE " + user_name = '" + req.getParameter("user") + "' AND user_password = '" + req.getParameter("password") +"'"; Specify which input should be placed in the query string within the empty rectangle to exploit this vulnerability.  http://badwebsite.my/process?user= &password=“whatever”

Types of questions: CU + CA Put the following ways of event handlers in order of desirability, most desirable (top) to least desirable (bottom). E.g. “a, b, c”. Order of desirability:______________ a. myimg.onload = myFunc; b. <img id="myimg" onload="myFunc()" src="myimage.jpg"/> c. myimg.addEventListener("load", myFunc, false);

Types of questions: Draw a diagram Draw an RDF graph representing the following set of statement <rdf:Description rdf:about="http://en.wikipedia.org/wiki/Tony_Benn"> <dc:title>Tony Benn</dc:title> <dc:publisher>Wikipedia</dc:publisher> </rdf:Description>

Types of questions: Tricky Given the following HTML <h3>This is a header with specified margin</h3> <p>This is a paragraph with specified margin</p> And given the following CSS: h3 { margin-top: 25px; margin-bottom: 50px; } p { margin-top: 75px; margin-bottom: 75px; In the browser, this leads to a certain distance between the two HTML elements: Indicate the distance between the two HTML elements in pixels (px): _________

Grading the exam Questions will have different weights Weights are not known to you in advance The exam grade will be curved Minimal requirement Show effort The final grade: 10%+20%+40%+30% Non zero exam grade requirement