Downloaded 4,886 times
Uploaded byChamnap Chhorn
Introduction to Web Architecture
The document provides an introduction to basic web architecture, including HTML, URIs, HTTP, cookies, database-driven websites, AJAX, web services, XML, and JSON. It discusses how the web is a two-tiered architecture with a web browser displaying information from a web server. Key components like HTTP requests and responses are outlined. Extension of web architecture with server-side processing using languages like PHP and client-side processing with JavaScript are also summarized.
In this document
Powered by AI
Overview of web architecture, including basics like HTML, URI, and HTTP, as well as cookies and AJAX.
Discussion on the inception of the World Wide Web by Tim Berners-Lee in 1989, including key technologies.
Introduction to standard web architecture focusing on browsers and servers, describing their roles.
Description of HTML as a markup language used for structuring web pages.
Explanation of URIs, detailing the structure and different types of URLs.
Comprehensive review of HTTP as a protocol for communication between clients and servers, including request methods and status codes.
Explains how HTTP handles session state using cookies and other methods for maintaining user information.
Overview of how CGI extends web architecture to enable dynamic back-end responses.
Describes JavaScript’s functionality in creating dynamic user interactions and utilizes cookies.
Analysis of cookies, their purpose and management, including expiration regulations.
Details how dynamic web content is generated through server-side and client-side processing.
Introduction to AJAX technologies, benefits, and limitations in modern web applications.
An outline of web services focusing on their interaction paradigms, including APIs and standards.
Definition and structure of XML, emphasizing its role in data exchange on the web.
Explanation of JSON as a lightweight data format and its relevance in modern web development.
List of resources for further exploration of web architecture and technologies.
Open floor for inquiries regarding the presentation content.
More Related Content
Similar to Introduction to Web Architecture
Introduction to Web Architecture
- 1. Introduction to WebArchitectureChhorn Chamnap
- 2. About MeBlog: http://chamnapchhorn.blogspot.com/Twitter:http://twitter.com/chamnapRails DeveloperJavaScript Developer
- 3. AgendaBasic Web ArchitectureHTMLURIHTTPWebArchitecture ExtensionCookieDatabase-driven Website ArchitectureAJAXWeb ServicesXMLJSON
- 4.
- 5. The World WideWebIn 1989, Tim Berners-Lee had suggested a way to let all users, but particularly scientists, browse each others’ papers on the Internet.He developed HTML, URLs, and HTTP.
- 6.
- 7. Basic Web ArchitectureTheweb is a two-tiered architecture.A web browser displays information content, and a web server that transfers information to the client.
- 8. Web BrowserThe primarypurpose is to bring information resources to the user. An application for retrieving, presenting, and traversing information resources.
- 9. Web ServerThe termweb server or webserver can mean one of two things:A computer program that accepts HTTP requests and return HTTP responses with optional data content. A computer that runs a computer program as described above.
- 10.
- 11. HTMLDocument layout language(not a programming language)Defines structure and appearance of Web pages
- 12.
- 13. URIURLs are locationdependent It contains four distinct parts: the protocol type, the machine name, the directory path and the file name. There are several kinds of URLs: file URLs, FTP URLs, and HTTP URLs.
- 14.
- 15. HTTPHTTP is arequest/response standard of a client and a server.Typically, an HTTP client initiates a request.Resources to be accessed by HTTP are identified using Uniform Resource Identifiers (URIs).
- 16. Request messageThe requestmessage consists of the following:Request lineHeaders (Accept-Language, Accept, ….)An empty lineAn optional message body
- 17. Request methodsHTTP defineseight methods (sometimes referred to as "verbs") indicating the desired action to be performed on the identified resource.HEADGETPOSTPUTDELETETRACEOPTIONSCONNECT
- 18. Safe methodsHEAD, GET,OPTIONS and TRACE are defined as safe (no side effects).POST, PUT and DELETE are intended for actions which may cause side effects either on the server.
- 19. Status CodesThe firstline of the HTTP response is called the status line.
- 20. The way theuser agent handles the response primarily depends on the code and secondarily on the response headers.
- 21.
- 22.
- 23.
- 24. Server-Side Error: 5xxHTTPsession stateHTTP is a stateless protocol.
- 25. Hosts do notneed to retain information about users between requests.
- 26. Statelessness is ascalability property.
- 27. For example, whena host needs to customize the content of a website for a user. Solution:
- 28.
- 29.
- 30. Hidden variables (whenthe current page is a form)
- 31. URL encoded parameters(such as /index.php?session_id=some_unique_session_code)Sample HTTP Request and ResponseClient requestServer response
- 32.
- 33. Web Architecture ExtensionCGIextends the architecture to three-tiers by adding a back-end server that provides services to the Web server.
- 34. Traditional uses ofJavaScriptJavaScript is a scripting language designed for creating dynamic, interactive Web applications that link together objects and resources on both clients and servers.Getting your Web page to respond or react directly to user interaction with form elements and hypertext linksPreprocessing data on the client before submission to a serverChanging content and styles
- 35. Cookietracking cookie, browsercookie, or HTTP cookie
- 36. CookieCookie is asmall piece of text stored on a user's computer by a web browser.
- 37. A cookie consistsof one or more name-value pairs containing bits of information such as user preferences.
- 38. A cookie canbe used for:
- 39.
- 40.
- 41. remembering specific informationabout users.Setting A Cookie
- 42. Cookie ExpirationCookies expire,and are therefore not sent by the browser to the server, under any of these conditions:At the end of the user session if the cookie is not persistent An expiration date has been specified, and has passed The expiration date of the cookie is changed to a date in the past The browser deletes the cookie by user request
- 43.
- 44.
- 45. Server-side processingIn server-sideprocessing, the Web server:Receives the dynamic Web page requestPerforms all of the processing necessary to create the dynamic Web pageSends the finished Web page to the client for display in the client’s browser
- 46. Client-side processingClient-side processingSomeprocessing needs to be “executed” by the browser, either to form the request for the dynamic Web page or to create or display the dynamic Web page.Eg. Javascript code to validate user input
- 47. Server and Clientside processingServer-side processingPHPASPASP.NETPerlJ2EEPython, e.g. DjangoRuby, e.g. Ruby on RailsColdFusionClient-side processingCSSHTMLJavaScriptAdobe FlexMicrosoft Silverlight
- 48.
- 49. Defining AjaxAjax isn’ta technology. It’s really several technologies, each flourishing in its own right, coming together in powerful new ways. Ajax incorporates:XHTML and CSS;Document Object Model; XML and XSLT; XMLHttpRequest; JavaScriptJesse James Garrett, essay infebruary 18, 2005 Ajax: A New Approach to Web Applications
- 52. Drawbacks of AJAXItbreaks browser history engine (Back button).No bookmark.The same origin policy.Ajax opens up another attack vector for malicious code that web developers might not fully test for.
- 53.
- 54. Web ServicesWeb Serviceis a software system designed to support machine-to-machine interaction over a network. Web services are frequently just Internet Application Programming Interfaces (API) that can be accessed over a network.
- 55. Web Services (cont.)WebServices are platform-independent and language-independent, since they use standard XML languages.Most Web Services use HTTP for transmitting messages (such as the service request and response).Style of UseRPCSOAPREST
- 56.
- 57. XMLXML is auniversally agreed markup meta-language primarily used for information exchange.
- 58. The two primarybuilding blocks of XML are elements and attributes.
- 59. Elements are tagsand have values.
- 60. Elements are structuredas a tree.
- 61. Alternatively, elements mayhave both attributes as well as data
- 62. Attributes help youto give more meaning and describe your element more efficiently and clearly.XML (cont.)<?xml version=\"1.0\" encoding=\"UTF-8\"?><person> <id type="integer">1111</id> <last_name>Smith</last_name> <first_name>John</first_name> <address> <city>New York</city> <street>21 2nd Street</street> <postal_code type="integer">10021</postal_code> <state>NY</state> </address></person>
- 63.
- 64. JSONJSON is alightweight computer data interchange format.
- 65. JSON is basedon a subset of the JavaScript programming language.
- 66. It is consideredto be a language-independent data format.
- 67. It serves asan alternative to the use of the XML format.Douglas Crockford is a seniorJavaScript Architect at Yahoo!He is well known for his work in introducing JavaScript Object Notation (JSON).
- 68. JSON (cont.) { "firstName": "John", "lastName": "Smith", "address": { "street": "21 2nd Street", "city": "New York", "state": "NY", "postalCode": 10021 }, "phoneNumbers": [ "212 555-1234", "646 555-4567" ] }
- 69.
- 70.
- 71.
- 72.
- 73.
- 74.
- 75.
- 76.
- 77.
- 78.
- 79.
- 80.
- 81.
- 82.
- 83.