COMP 7100: Computers in the Information society

1
COMP 7100 Computers in the Information society

• World Wide Web
• Hongjun SongComputer ScienceThe University of
  Memphis

2
World Wide Web History

• 1980-91 Development of the WWW
• On August 6, 1991, Berners-Lee posted a short
  summary of the World Wide Web project on the
  alt.hypertext newsgroup
• 1992-1995 Growth of the WWW
• There was still no graphical browser available.
  This gap was filled in May 1992 by ViolaWWW,
  created by Pei-Yuan Wei, which included advanced
  features.
• 1996-1998 Commercialization of the WWW
• 1999-2001 "Dot-com" boom and bust
• 2002-Present The Web becomes ubiquitous

3
WWW-World Wide Web

• The World Wide Web ("WWW" or simply the "Web") is
  a global, read-write information space.
• Text documents, images, multimedia and many other
  items can be found and accessed easily
• WWW is a combination of 4 ideas.

Markup Language
Uniform Resource Identifiers
Hypertext
Client server
4
The W3Consortium

• (W3C) is an international consortium where Member
  organizations, a full-time staff, and the public
  work together to develop Web standards.
• Mission To lead the World Wide Web to its full
  potential by developing protocols and guidelines
  that ensure long-term growth for the Web.
• W3C Is an International Consortium. Operations
  are jointly administered by
• MIT Computer Science and Artificial Intelligence
  Laboratory (CSAIL)
• European Research Consortium for Informatics and
  Mathematics (ERCIM) (France)
• Keio University (Japan)

5
Hypertext

• A format of information which allows the user to
  jump from one part of a document to another using
  a so-called "hyperlink."

6
Uniform Resource Identifiers

• URI is a compact string of characters used to
  identify or name a resource
• Syntax
• URI syntax is essentially a name like "http",
  "ftp", "mailto", "urn", "mms", "rtsp", etc.,
  followed by a colon character, and then a
  scheme-specific part.
• Example
• http//www.google.com
• ftp//www.cs.memphis.edu
• mailtohjsong_at_memphis.edu
• telnet//java.cs.memphis.edu
• newscomp.infosystems.www.servers.unix

7
How does the web work?
Send me the history of computers?
HTTP
The client sends an HTTP message to a computer
running a web server program and asks for a
document.
History Of Computers HTML
The web server sends the hypermedia document to
the client . Your browser shows you the document
on your screen.
All Web clients must have the right software that
sends, receives, And displays the hypermedia
documents (e.g., HTML)
8
How does the web work?
9
Website

• A website is a location on the WWW.
• Each website contains a homepage.
• Can we design our own page?
• YES!
• By using languages like PHP and RDBMSs like
  MySQL.
• Types of website
• Commerce site, Database site, Employment website,
  Search engine site, Web portal site etc.

10
Web server

• A computer capable of accepting requests from
  clients, which are known as Web browsers, and
  serving them Web pages using HTTP.
• Examples
• Apache HTTP server, Internet Information
  Services, Sun Java System, etc

user at a specific IP address requests a file
retrieves that file and returns it to the user.
11
What is a Web Browser?

• Software that sends, receives, and displays
  hypermedia documents (e.g., HTML).
• Browser software interprets the HTML codes in web
  pages so we can view them in a standard format.

12
Markup Language

• A markup language combines text and metatext
  (extra information about text.)
• Best known examples
• HTML (Hypertext Markup Language)
• GenCode, Tex, SGML, XML, XHTML, OWL

13
HTML-Hypertext Markup Language

• a markup language designed for the creation of
  web pages with hypertext and other information to
  be displayed in a web browser.
• An HTML file is a text file containing small
  markup tags
• The markup tags tell the Web browser how to
  display the page
• An HTML file must have an htm or html file
  extension to be understood by the browser
• An HTML file can be created using a simple text
  editor, or other more sophisticated tools.

14
HTML-Do You Want to Try it?

• If you are running Windows, start Notepad.
• Type in the following text

lthtmlgt ltheadgt lttitlegtTitle of pagelt/titlegt
lt/headgt ltbodygt This is my first homepage.
ltbgtThis text is boldlt/bgt lt/bodygt lt/htmlgt
Save the file as mypage.html
ClickHere to see the output.
15
(No Transcript)
16
HTML Elements

• The purpose of the ltbgtlt/bgt tag is to define an
  HTML element that should be displayed as bold.
• The purpose of the ltbodygt lt/bodygt tag is to
  define the HTML element that contains the body of
  the HTML document.
• Tag Attributes provides additional information
  about the HTML elements on your page.
• ltbodygt tag with an added bgcolorred attribute
  tells the browser that background color of the
  page should be red.

17
HTML Form and Input Example

• lthtmlgt
• ltbodygt
• ltform name"input"
• action"html_form_action.php
• method"get"gt
• ltbgtType your first namelt/bgt
• ltinput type"text" name"FirstName"
  value"Mickey" size"20"gt
• ltbrgtltbgtType your last namelt/bgt
• ltinput type"text" name"LastName" value"Mouse"
  size"20"gt
• ltbrgt
• ltinput type"submit" value"Submit"gt
• lt/formgt
• ltpgtIf you click the "Submit" button, you will
  send your input to a newpage called
  html_form_action.asp.
• lt/pgt
• lt/bodygt
• lt/htmlgt
• ClickHere to see the output

18
(No Transcript)
19
Multimedia Elements

• The img element embeds an image in the current
  document at the location of the element's
  definition.
• lthtmlgt
• ltheadgt
• lttitlegtTitle of pagelt/titlegt
• lt/headgt
• ltbodygt lth1gtThis is my first homepage.lt/h1gt
• ltbrgtltbrgtltcentergt
• ltIMG src"http//www.queenanne.com/1-800-227-3970/
  home_page/welcome.gif" lt/centergt
• lt/bodygt
• lt/htmlgt

List of HTML elements can be found
at http//www.w3.org/TR/html4/index/elements.html
20
(No Transcript)
21
Scripting Language

• A scripting language is a simple programming
  language in which you can write scripts.
• A script is a list of commands that can be
  executed without user interaction.
• Types of scripting languages
• JSP, PHP, PERL, Python, VBScript etc.
• Remember the previous HTML form example.
• What happens when the user clicks submit?
• You can write an action for the submit button
  by using a SCRIPTING LANGUAGE.

22
PHP-Hypertext Preprocessor

• PHP is an open source, reflective programming
  language designed as a high level scripting
  language for producing dynamic Web pages.
• PHP is used mainly in server-side application
  software .
• Latest release 5.1.6 / August 24, 2006
  4.4.4 / August 17, 2006
• PHP was originally designed as a small set of
  Perl scripts, followed by a rewritten set of CGI
  binaries written in the C programming language.

23
PHP-Usage

• PHP generally runs on a web server, taking PHP
  code as its input and displaying Web pages as
  output.
• PHP can be used with a large number of relational
  database management systems.
• PHP also provides a command line interface.

24
PHP-Syntax

• Hello World Example
• lt?php echo 'Hello, World!' ?gt
• PHP only parses code within its delimiters, such
  as lt?php ?gt.
• The primary use of this is to allow PHP
  statements to be embedded within HTML documents.
• PHP has three types of comment syntax / /, //,
  
• Variables in PHP are represented by a followed
  by the name of the variable sum20 sub_total
  _4salenull2pay

25
PHP/MySQL

• MySQL is an open source relational database
  management system that uses Structured Query
  Language (SQL).
• Main reason for learning a scripting language
  like PHP is to access information on databases
  (DB) dynamically so that a browser can display
  most recent information on the DB.
• Testing for PHP and MySQL
• lt? phpinfo() ?gt
• If you have PHP installed, you will see a huge
  page with all the details of your PHP and MySQL
  installation on it.

Saveas test.php
26
(No Transcript)
27
Sample Project

• Goal The Demo site.
• Requirements
• PHP script.
• MySQL Relational Database Management system.
• Apache HTTP web server where you have to copy
  your files.
• http//thedemosite.co.uk/login.php