Department Vrije beatsigner.com Universiteit of Computer Brussel Science Department of Computer Science Vrije Universiteit Brussel beatsigner.com 2 December 2005
Tim O'Reilly at the Web 2.0 conference in 2004 to describe a new generation of web apps user-generated content ▪ data as a driving force ▪ [https://en.wikipedia.org/wiki/File:Web_2.0_Map.svg] - infoware (data management) rather than simply software collective intelligence via social resource and knowledge sharing ▪ Web as a platform for software applications ▪ ▪ Not a new technology but a change in how developers and users build applications on the Web ▪ user-generated content already existed earlier (e.g. Amazon) November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 2
a participant and content creator (prosumer) ▪ democracy ▪ ▪ Rich Internet Applications (RIAs) bring the desktop to the browser ▪ highly interactive applications (e.g. with drag and drop) ▪ based on AJAX etc. ▪ ▪ Service Oriented Architectures (SOAs) enable the sharing of information and services between different Web 2.0 applications ▪ Web Services, RSS, mashups, etc. ▪ November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 3
participation reading reading and writing (participatory Web) content management systems wikis personal homepages blogs simple request /response interaction Rich Internet Application (RIA) screen scraping (extract data from HTML) service-oriented architectures taxonomies (classification) folksonomies (tagging) companies communities single user social networks bookmarking collaborative tagging / social bookmarking ... November 10, 2026 ... Beat Signer - Department of Computer Science - [email protected] 5
tail has 21.10.jpg been introduced by Chris Anderson in 2004 ▪ article about Amazon etc. Joe Simpson, 1988 Jon Krakauer, 1997 - 'Touching the Void' and 'Into Thin Air' example ▪ Main observations the tail is longer than expected and now economically within reach ▪ the niches form a significant market when aggregated ▪ new economic model: combine infinite shelf space with shared real-time public opinions and buying trends ▪ ▪ Major part of web content made up by small sites ▪ provide tools to address the long tail and not just the head November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 6
1995 Ward Cunningham ▪ inspired by HyperCard ▪ ▪ Any user can create new wiki pages or edit existing pages ▪ no special software required on the client side (only a browser) ▪ Democracy-based control of the content ▪ revision history, discussion, ... ▪ Various wiki software ▪ MediaWiki, DokuWiki, ... November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 9
contribute ▪ some users (editors) have special rights ▪ ▪ Each article has a history page showing all of its changes ▪ a discussion page ▪ ▪ Issues reliability never guaranteed since no central authority ▪ vandalism ▪ ... ▪ November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 10
of information personal diary ▪ specific subjects ▪ - e.g. celebrities ▪ Tool for delivering news and getting in touch with a large community of users nowadays often used as a powerful channel in politics ▪ much harder to control than print or broadcasting media ▪ ▪ Popular blogs often generate revenue by advertising ▪ access to content is often free November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 11
that is often used by bloggers ▪ Managing images single photostream ▪ collaborative tagging ▪ [https://www.flickr.com/photos/vrije_universiteit_brussel/] - user-generated taxonomy (folksonomy) - one of the first websites that implemented tag clouds ▪ grouping in albums and collections - note that an image may be added to multiple albums ▪ Offers a powerful Web Service API November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 12
▪ Social tagging collaboratively creating and managing tags ▪ bottom-up approach ▪ - no fixed terminology ▪ Applications Annotea: shared Web annotations and bookmarks ▪ Instagram: tagging of photos and videos ▪ ▪ Tag cloud visualisation November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 13
share information post messages on a user's public wall ▪ send individual messages ▪ share photos ▪ ▪ Easy to add individual applications (one platform) ▪ Copyright issues ▪ what happens with content that has been uploaded to Facebook? ▪ Privacy issues November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 14
can be posted to a user profile ▪ reach millions of users from any place around the world within seconds (Twitter/X) - used in protests and politics, emergencies, ... ▪ Can we get too connected? November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 15
and 'telegram' ▪ Simple digital filters can be applied ▪ Uses hashtags to discover photos ▪ Users can like and comment on photos as well as follow other users ▪ Instagram influencers November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 16
▪ special client software ▪ User represented by an avatar ▪ Linden dollar (L$) as a currency ▪ buy land, buy and sell goods and services to other users ▪ Applications ▪ education, business meetings, arts, ... ▪ What about the metaverse? November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 17
rating of resources ▪ research papers, conference presentations, CVs, etc. ▪ Find researchers with similar research interests ▪ Other professional social networking websites ▪ LinkedIn, Xing, ... November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 18
spreadsheet application, ... ▪ Mobile access via mobile phone ▪ Software as a service (SaaS) ▪ Data safety and privacy issues November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 19
advertisements ▪ shows advertisements delivered via Google Ads ▪ New models for payment ▪ pay-per-click in addition to pay-per-impression ▪ Any website owner can enrol to AdSense ▪ sometimes very complementary information - e.g. blog with reviews about specific products together with Google advertisements for these products ▪ Google (Alphabet) advertising revenues ▪ 2025: USD 294.7 billion (total revenues USD 402.8 billion) November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 20
issues ▪ Collective intelligence (wisdom of crowds) ▪ Shift of power from controlled media to collaborative communities ▪ New models for crediting an individual's content that is accessed by other users or composed in mashup applications ▪ Everybody has a (big) voice ▪ e.g. reach millions of users within seconds via Twitter November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 22
have some common underlying patterns service oriented architectures (SOAs) ▪ software as a service ▪ asynchronous partial updates ▪ self-organising communities ▪ collaborative tagging ▪ viral marketing ▪ ... ▪ November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 23
encoded in XML ▪ Potential alternative data formats JavaScript Object Notation (JSON) ▪ plain text ▪ HTML ▪ binary formats ▪ November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 24
browser ▪ Highly responsive (good performance) ▪ asynchronous and partial content updates ▪ Rich Graphical User Interface (GUI) ▪ various RIA toolkits and environments introduced in the past - Microsoft Silverlight - Sun JavaFX - JavaServer Faces (JSF) - ... ▪ nowadays often based on HTML5 and Open Web Platform APIs - Drag and Drop - Canvas 2D - … November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 25
updating an entire resource (e.g. webpage), we can asynchronously update parts of a resource ▪ Updates initiated by the client (or the server) based on user interaction, state change, timeout, … November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 26
the server if HTTP is used! ▪ have to use polling or long polling (e.g. Comet model) ▪ AJAX is one possibility how the partial update of resources can be realised over the Web November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 27
a technology by itself but a group of existing technologies (term coined in 2005) HTML and CSS for the visualisation ▪ JavaScript in combination with DOM to dynamically change the presented information and process messages on the client side ▪ method to asynchronously exchange data between the client (browser) and the server ▪ - often via the XMLHttpRequest (XHR) JavaScript object - data can be in different formats including XML, plain text, JavaScript Object Notation (JSON), ... ▪ client-side AJAX engine deals with asynchronous message handling November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 28
properties ▪ onreadystatechange - registers a JavaScript function that will handle the response from the server ▪ readyState - represents a response status from the server • 0 (unititialised): object has been created but is uninitialised • 1 (open): object has been created but send method not yet called • 2 (sent): send method has been called and the HTTP response headers have been received • 3 (receiving): some data (body) has been received but response not yet available • 4 (loaded): all data has been received and the response is available - a function registered via onreadystatechage is executed each time readyState changes ▪ responseText, responseBody and responseXML - contains the server's response in different formats November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 29
API fetch(“https://example.com/time.php”) .then((response) => response.json()) .then((data) => console.log(data)); ▪ For more advanced AJAX examples see ▪ https://www.w3schools.com/js/js_ajax_intro.asp November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 31
application state can be maintained across multiple pages since the main container page is not reloaded ▪ ▪ Disadvantages not possible to bookmark any particular state of an application ▪ content may not be crawled by certain search engines since they do not execute JavaScript code ▪ cannot be used in browsers with disabled JavaScript functionality ▪ ▪ WebSocket API might also be used for asynchronous updates November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 33
services loose coupling of services ▪ service encapsulation ▪ interoperability between different operating systems and programming languages ▪ mashup of services ▪ ... ▪ ▪ Software as a service (SaaS) ▪ software is offered as a service and may itself be a composition of third-party services November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 34
for distributed hypermedia systems requiring the following constraints separation of concerns between client and server (1) − client and server can be developed and replaced independently uniform interface (2) − − − − identification of resources (e.g. URIs on the Web) manipulation of resources on the server via representation on the client side self-describing messages (e.g. MIME type on the Web) hypermedia for application state change (e.g. hypertext links to related resources) stateless (3) − no client state is stored on the server side cacheability (4) − November 10, 2026 responses must explicitly or implicitly define whether they are cacheable Beat Signer - Department of Computer Science - [email protected] 35
(proxies) can be transparently added between the client and the server code on demand (optional) (6) − the server can send application logic (code) to the client (e.g. Java Applets) ▪ A service that conforms at least to the first five constraints is called a RESTful service ▪ The Web is an implementation of a system conforming to the REST architectural style ▪ however, RESTful services can also be implemented over protocols other than HTTP November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 36
main types of Web Services ▪ Big Web Services - Universal Description, Discovery and Integration (UDDI) - Web Services Description Language (WSDL) - Simple Object Access Protocol (SOAP) ▪ RESTful Web Services - better integrated with HTTP and web browsers - makes use of GET, POST, PUT and DELETE HTTP methods November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 37
(UDDI) yellow pages for WSDL ▪ "global" registry describing available business services ▪ very complex ▪ Microsoft and IBM shut down their public UDDI registries in 2006 ▪ ▪ Web Service Description Language (WSDL) XML application to describe a Web Service's functionality ▪ complex ▪ ▪ Simple Object Access Protocol (SOAP) ▪ defines an envelope for transporting XML messages ▪ The Web Service Stack contains many other protocols ▪ BPEL, WS-Security, WS-Reliability, WS-Transaction, ... November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 39
1998 as Simple Object Access Protocol Dave Winer, Don Box, Bob Atkinson and Mohsen Al-Ghosein ▪ since version 1.2 the name is no longer treated as an acronym ▪ ▪ XML-based communication protocol ▪ A SOAP message consists of an <Envelope> element which contains an optional <Header> element ▪ a <Body> element ▪ - remote procedure call or response information ▪ SOAP requests are often sent via HTTP POST requests November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 40
<t:username xmlns:t="http://wise.vub.ac.be/transaction/" soap:mustUnderstand="1">pellens</t:username> </soap:Header> <soap:Body xmlns:c="http://wise.vub.ac.be/courses/"> <c:getCourseInfo> <c:courseID>4011474FNR</c:courseID> </c:getCourseInfo> </soap:Body> </soap:Envelope> ▪ predefined SOAP attributes - encodingStyle: defines the used data types - mustUnderstand: if set to 1 then the server has to understand the header November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 41
<c:getCourseInfoResponse xmlns:c="http://wise.vub.ac.be/courses"> <c:title>Web Information Systems</c:title> <c:description>The goal of this course is to teach students the concepts and technologies for realising Web Information Systems (WIS). This ranges from basic network technologies and protocols to high level frameworks for the design and ... </c:description> </c:getCourseInfoResponse> </soap:Body> </soap:Envelope> note that also a response message can have a <Header> element ▪ the body contains a <Fault> element if something went wrong on the server side ▪ November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 42
over HTTP results in less problems with proxies and firewalls than other remote procedure call solutions (e.g. CORBA) ▪ there exist a lot of tools and language bindings that automatically create the required client and server-side functionality ▪ - e.g. Java API for XML Web Services (JAX-WS) ▪ Disadvantages slower than non-verbose protocols (e.g. CORBA) ▪ Big Web Services are not simple ▪ HTTP is reduced to a simple transport protocol for a large amount of XML metadata payload ▪ - does not make use of the rich functionality offered for HTTP envelopes ▪ no mechanism for the caching of results November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 43
Web API) is a simple web service implemented using HTTP ▪ The definition of a RESTful web service includes ▪ the URI of the web service (e.g. http://wise.vub.be/course/) - different resources identified by unique URIs ▪ the type (MIME) of data supported by the service - e.g. application/json, application/xml, ... ▪ supported set of operations via HTTP methods - e.g. GET, POST, PUT, DELETE ▪ One-to-one mapping between create, read, update, and delete (CRUD) operations and HTTP methods ▪ POST (create), GET (read), PUT (update) and DELETE (delete) November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 44
used to read and write frequently updated information on the Web e.g. blog entries ▪ specific channels on news sites ▪ ... ▪ ▪ Special RSS readers or aggregators November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 46
Home Page</title> <link>http://www.w3schools.com</link> <description>Free web building tutorials</description> <item> <title>RSS Tutorial</title> <link>http://www.w3schools.com/rss</link> <description>New RSS tutorial on W3Schools</description> </item> <item> <title>XML Tutorial</title> <link>http://www.w3schools.com/xml</link> <description>New XML tutorial on W3Schools</description> </item> ... </channel> ... </rss> ▪ many other elements ▪ <language>, <copyright>, <pubDate>, ... November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 47
Media, May 2009 ▪ Chris Anderson, The Long Tail, Wired 12(10), 2004 ▪ https://www.wired.com/2004/10/tail/ ▪ Michael Wesch, The Machine is Us/ing Us ▪ https://www.youtube.com/watch?v=NLlGopyXT_g ▪ Jonathan Zittrain, The Kindness of Strangers, TEDGlobal 2009, Oxford, UK, July 2009 ▪ https://www.ted.com/talks/jonathan_zittrain_the_web_as_random _acts_of_kindness ▪ James Surowiecki, The Wisdom of Crowds, Anchor, August 2005 November 10, 2026 Beat Signer - Department of Computer Science - [email protected] 49
signer
ainischool
bvr7352
minorun365
kentaroy47
akiraasano
hiola
baltimoreniso
pawan_pharm
drpoonamkc
juanmartin2026
gmoriki
marktimemedia
tapps
thirion
mza
tenderlove
jonrohan
lfama
bryan
marcelosomers
ks91
scottboms
aleyda
