Topics covered:

  • Web Sites and Web Applications
  • Web 1.0, 2.0, 3.0
  • Web Browsers
  • Hardware Servers
  • Web Servers
  • Client-Server Architecture
  • 3-Tier / Multi-Tier Architectures
  • Service-Oriented Architecture (SOA)

Video (in Bulgarian)

Presentation Content

Web Page

  • Document or information resource that is suitable for the World Wide Web
  • Can be accessed through a web browser and displayed on a monitor or mobile device
  • This information is usually in HTML or XHTML format, and may provide navigation to other web pages via hypertext links
  • Web pages frequently refer to other resources such as style sheets (CSS), scripts (JavaScript) and images into their final presentation

Web Site

  • Collection of related web pages containing web resources (web pages, images, videos, CSS files, JS files or other digital assets)
  • Common navigation between web pages
  • A website is hosted on at least one web server
  • Accessible via a network (such as the Internet)
  • All publicly accessible websites collectively constitute the World Wide Web

Web Application

  • Next level web sites
  • High interactivity
  • High accessibility (Cloud)
  • AJAX, Silverlight, Flash, Flex, etc.
  • Applications are usually broken into logical chunks called “tiers”, where every tier is assigned a role
  • Desktop-like application in the web browser
  • Web applications on desktop (Windows 8)

Web Browsers

  • Program designed to enable users to access, _retrieve and view documents _ and other resources from the Web
  • Main responsibilities:
    • Bring information resources to the user (issuing requests to the web server and handling any results generated by the request)
    • Presenting web content (render HTML, CSS, JS)
    • Capable of executing applications within the same context as the document on view (Flash)

Layout Engines

  • Software component that displays the formatted content on the screen combining:
    • Marked up content (such as HTML, XML, image files, etc.)
    • Formatting information (such as CSS, XSL, etc.)
  • It “paints” on the content area of a window, which is displayed on a monitor or a printer
  • Typically embedded in web browsers, e-mail clients, on-line help systems or other applications that require the displaying (and editing) of web content
  • How Browsers Work

Layout Engines and Web Browsers

  • Trident-based
    • Internet Explorer, Netscape, Maxthon, etc.
  • Gecko-based
    • Firefox, Netscape, SeaMonkey, etc.
  • Blink-based
    • Chrome, Opera
  • WebKit-based
    • Safari, iOS, Maxthon, Chrome (up to v27), etc.
  • EdgeHTML (fork of Trident)
    • Spartan (the new IE)
    • Windows 10 and Windows 10 (Mobile)

User Agent Strings

  • Identify web browsers and their version
    • History of (in)compatibility attempts [link]
  • Can have some additional information like layout engine, user’s operating system, etc.
    • Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.118 Safari/537.36
      • Mozilla/5.0 – a generic term which most modern browsers use (originally indicated Netscape)
      • _Windows NT _ 6.3 – Windows 8.1
      • WOW64 – Windows-On-Windows 64-bit
      • AppleWebKit /537.36Blink is a fork of WebKit
        • KHTML is the previous name of WebKit
      • Chrome/41.0.2272.118 – real browser version
      • Safari/537.36 – artifact against scripts sniffing

Hardware Servers

  • Physical computer (a hardware system) dedicated to running one or more such services
  • Servers are placed in collocation centers
    • Colocation facilities provide space, power, cooling, and physical security for the server
  • The server may be:
    • Database server
    • File server
    • Mail server
    • Print server
    • VPS servers

What Do the Web Servers Do?

  • All physical servers have hardware
  • The hardware is controlled by the operating system
  • Web servers are software products that use the operating system to handle web requests
    • Web servers serve Web content
  • These requests are redirected to other software products (ASP.NET, PHP, etc.), depending on the web server settings

Web Servers Market Share March 2015

  • Market share of the top million busiest sites
    • Apache
      • 49.35% (493,463)
    • nginx
      • 21.22% (212,151)
    • IIS (by Microsoft)
      • 12.21% (122,069)
    • GWS (by Google)
      • 2.44% (24,434)
  • Source

Client-Server Architecture

  • The client-server model consists of:
    • Server – a single machine or cluster of machines that provides web applications (or services) to multiple clients
      • Examples:
        • Web server running PHP scripts or ASP.NET pages
        • IIS based Web server
        • WCF based service
        • Services in the cloud
  • The client-server model consists of:
    • Clients – software applications that provide UI (front-end) to access the services at the server
      • Examples:
        • Web browsers
        • WPF applications
        • HTML5 applications
        • Silverlight applications
        • ASP.NET consuming services

Client-Server Model – Examples

  • Web server (Apache, IIS) – Web browser
  • FTP server (ftpd) – FTP client (FileZilla)
  • EMail server (qmail) – email client (Outlook)
  • SQL Server – SQL Server Management Studio
  • BitTorrent Tracker – Torrent client (μTorrent)
  • DNS server (bind) – DNS client (resolver)
  • DHCP server (wireless router firmware) – DHCP client (mobile phone /Android DHCP client/)
  • SMB server (Windows) – SMB client (Windows)

The 3-Tier Architecture

  • The 3-tier architecture consists of the following tiers (layers):
    • Front-end (client layer)
      • Client software – provides the UI of the system
    • Middle tier (business layer)
      • Server software – provides the core system logic
      • Implements the business processes / services
    • Back-end (data layer)
      • Manages the data of the system (database / cloud)

The 3-Tier Architecture Model

  • Data Tier (Back-End)
  • Middle Tier (Business Tier)
  • Client Tier (Front-End)

What is a Service?

  • In the real world a " service " is:
    • A piece of work performed by a service provider
    • Provides the client (consumer) some desired result by some input parameters
      • The requirements and the result are known
    • Easy to use
    • Always available
    • Has quality characteristics (price, execution time, constraints, etc.)

What is “Cloud”?

  • Cloud ≈ multiple hardware machines combine their computing power and resources
    • Share them between multiple applications
    • To save costs and use resources more efficiently
  • Public clouds
    • Provide computing resources on demand
      • Publicly in Internet
      • Paid or free of charge (to some limit)
    • Amazon AWS, Google App Engine, Microsoft Azure, Rackspace, PHPFog, Heroku, AppHarbor

Cloud Computing Models

  • Infrastructure as a Service (IaaS)
    • Virtual machines in the cloud on demand
    • Users install the OS and software they need
  • Platform as a Service (PaaS)
    • Platform, services and APIs for developers
    • E.g. Java + JBoss + JSF + JPA + MongoDB or JavaScript + Node.js + MongoDB + RabbitMQ
  • Software as a Service (SaaS)
    • Hosted application on demand (e.g. WordPress)