PPT-CS3-01-How the Web Works.pdf

Introduction to Web Development Client-side Web Development Mr. Jerickson S. Chua Computer ©DianneBangloy Science 3 Targets Module 1.0 1. Briefly explain the structure of the World Wide Web. 2. Know the characteristics of...

Introduction to Web Development Client-side Web Development Mr. Jerickson S. Chua Computer ©DianneBangloy Science 3 Targets Module 1.0 1. Briefly explain the structure of the World Wide Web. 2. Know the characteristics of HTML Introduction to the Internet Life now seems to be uneventful without the Internet. Education Communication Entertainment is conducted today with the help of being online. It makes accomplishing a lot of tasks easier, from searching for information to communicating with others, tasks which would otherwise be time-consuming.  Sample home Internet Connection Home network is created by connecting the devices to a router which in turn is connected to the Internet. Data that comes from the Internet (download) and data that leaves the devices (upload) all go through the router. This resulting network The Internet is the network where is called a local area network. computers and other devices are connected to each other. A local area network (LAN) and a wide area network (WAN) can be part of the Internet. Internet Connection https://www.speedtest.net/global-index https://www.speedtest.net/global-index World Wide Web (WWW) The sharing and collection of data through LAN that is available over the Internet is called the World Wide Web. The World Wide Web was invented by Tim Berners-Lee while working at CERN in 1989. The World Wide Web is the collection of information and services that travel over the Internet. If networks were a place, World Wide Web is the people and the cars that move around Web 1.0 – Static Internet are the roads where everyone Web 2.0 – Dynamic moves about. Web 3.0 – Semantic Web (meaning)  Internet Services Information Communication World Wide Retrieval Web Services Services Web Services Services Internet Services Communication Services Information Retrieval Services Offers exchange of information Provides easier access to with individual or groups. information present on the internet. Email Database (online journals) Groups or forums - Google Scholar Instant messaging (chats) Google Drive Video conferencing (zoom and gmeet) Internet Services Web services World Wide Web Services Covers the use of application that Allows users to access web pages make access to Internet easier. over the internet. Mobile applications Webpages can contain Cloud Computing Services multimedia - Google Docs Hyperlinks – clickable objects - Canva that allow the user to go from - Youtube one page to another.  Client (browser) World Wide Web Client requests data from server via protocol (HTTP) Structure Hypertext Transfer Protocol (HTTP) Makes use of a request- response system. HTTP request (sent by the client) consists of different types of information such as the uniform resource locator (URL) of the requested data. An HTTP response is sent by the server to Basic client-server model communicate to the client. World Wide Web Server Structure Software/cloud computer that processes client request and returns the requested data Hypertext Markup Language (HTML) Can contain wide range of data, from text to images to videos Basic client-server model  Uniform Resource URL structure Locator (URL) Protocol name With so much information and Hostname (domain name) or resources over the Internet, a IP address mechanism is needed to locate and access these resources. Path of the file Syntax: protocol://hostname/filename Examples: https://www.w3schools.com/html/default.asp https://www.facebook.com/profile  Client-side Web Development Front-end applications. Deal mainly with user interface and applications that interact with the user. Server-side Web Development Heavy programming of Web Development applications that the user does not see. Creation of web pages and other Example is maintenance of cloud services to be access online. storage, email services, etc. Other services: Database Management email, cloud services, and video Deals with the maintenance of streaming. data online. It also includes creation of effective and fast Web developers – user interface ways of accessing  Browsers Browsers allow the user to view data in their intended format. It also allows the user to navigate the Internet, allowing them to go from one website to Browsers another. Allows users to Browsers do all the receive and send data communicating over the and navigate from the internet. Internet.  Features The standard language for creating web pages. (data over the Internet can be accessed in a uniform way) Platform independent - rendered in any type of device. Most important feature - support hyperlinks. Disadvantage HTML It can be used only for static web pages - click and scroll on items Hypertext Markup Language Implementing interactive web pages, HTML must be used in addition to other languages such as CSS and JavaScript.  SUMMARY Web development is the creation of resources to be made available over the Internet. The Internet is a network of devices Browsers allow users to receive and connected either wirelessly or send data and navigate the wired. They send and receive data Internet. from each other via this network. HTML is the standard language The World Wide Web is the used to create webpages. collection of information that can be accessed via the Internet. It works on a client-server model structure where the client requests for information and the server sends the information as a response.  Navigate Exercise http://bit.ly/3PdDlAb In your own words, describe the difference between the Internet and the WWW. Describe also how the client- server model structure of the WWW works. What is the most important concept that you learned today? Explain.