UNIT II

Technologies for Web Application

 WWW:

Full form of www is world wide web and it is an advanced finding information system. It is being
developed very fast. WWW is based on hypertext System.

The concept of the Web was invented at CERN (European Council for Nuclear Research) in 1992 by
Tim-Berners Lee, He is the father of the Web or Internet.

The principle of the Web is based on using hyperlinks to navigate between documents (called web
pages) with software called a Web Browser. A web page is a simple text file written in a markup
language (called HTML) that convert the layout of the document, graphical elements, and links to
other documents, all with the help of tags.

Besides the links which connect formatted documents to one another, the web uses the HTTP
protocol to link documents hosted on distant computers (called web servers). On the www,
documents are identified with a unique address, called a URL, which can be used to locate any
resource on the internet, no matter which server may be hosting it.

A URL looks something like this:

http://www.mywebsite.com/webfolder/Home.html

Which means, when the user is browsing on the www he can put up a word or expression within a
text and request for more information about it.

WWW can be started by the command www. then domain name of the website and finish with top-
level domains .com or .in etc Ex: www.mywebsite.com

Advantages: Disadvantages:
1. You can find all type of information 1. Online data not secure
2. You can purchase things online 2. Hacking
3. You can watch or listen to media 3. You can get computer virus infections
4. You can play online games 4. Online fraud. Etc…
5. You can check your online bank account
6. You can find friends, etc…
 Web Browser:

Web browser is software to provide an interface to displaying, presenting, accessing and browsing
information resources of web pages on internet and navigate between one website to another in an
easy manner. Now a day’s website becomes more popular because it is effective way of advertising
and selling products of company.

HTML is simply collection of codes, code means it is collection of some meaningful symbols which is
having some structure and format to create a web document. Those structured combination of
symbols are only recognized by special software called as web browser, web browser can read HTML
symbolic program structure and displays a suitable human readable form on display screen.

The web pages are written in HTML language in the form of code but whenever you open that HTML
web page in web browser software you don’t see html code, it displays a formatted and readable
data. Web page is a document, typically written in plain text mixed together with formatting
instructions (tags) of Hyper Text Markup Language (HTML). Web pages are accessed and transported
outside the computer in internet with a protocol called as HTTP (Hyper Text Transfer Protocol)

Protocol is tiny software which defines rules and regulations to transfer data and communicate
another computer across the internet.

Web browser supports numerous protocols such as HTTP, FTP, TELNET, etc…

Web browser perform various task as like file downloading, file uploading, email attachment, save
web page content, play videos from website, print webpage etc. It also bookmarks (saving address
of a web page in web browser) your favorite web page.

 Available Web browsers in internet:

1. Mosaic: Mosaic was older browse, it was first graphical web browser. Mosaic was developed
at the National Center for Supercomputing Applications and released the browser in 1993.
2. Netscape Navigator: It was first released in 1994. Mosaic was developed with another name
netscape navigator. This is the first most popular commercial web browser in older days
3. Microsoft Internet Explorer: Microsoft is a software company which designed and developed
a web browser for windows operating system named as Microsoft Internet Explorer. It is
present default as web browser in any newly installed windows operating system. Today this
is one of the most usable browser on internet.
 4. Mozilla Firefox: After days creator of Netscape navigator developed a new browser called
Mozilla Firefox. Firefox is rapidly gaining ground right behind internet explorer because of its
tabbed browsing, superior security features, and fast loading web page.
5. Google Chrome: Google specialized in web search engine it is a copyright product of Google.
It is a light weight and fast accessing browser.
6. Mac Safari: Macintosh (Mac) is a computer system of Apple company. Safari is a web browser
works on Macintosh OS. It has a rich graphical appearance.
7. Opera: It is popular mobile web browser and also available in desktop PC.

Following are some common basic options available on any web browser:

Title Bar, Menu Bar, Toolbar Bar, Address Bar, Display Window, Scroll Bar, Status Bar.

Fig. Internet explorer web browser.

  URL
Several HTML elements or tags may contain an attribute such as
<a href=”http://www.google.com”>, which takes a URL as value. URL stands for Uniform
Resource Locators, URL are addresses of Web documents. More generally, URLs can be used on the
Web to open website on the Web.

There are two types of URLs:

1) Absolute URL (Full URL)
2) Relative URL (Short URL)

1) Absolute URLs
The general syntax of absolute URLs is the following:
Syntax: protocol://DomainName:port/path/filename
Example: http://www.example.com:8080/WebFolder/index.html
1. Protocol:
It specifies the information system to be used to access the resource; possible values include
the following:
• http a Web document (to be accessed using Hypertext Transfer Protocol, HTTP)
• ftp a resource to be retrieved using FTP (File Transfer Protocol), usually a file in a so-
called FTP server,

2) domain name:
It is the name of the website, e.g. www.google.com.
3) Port no.:
All the information can send and receive in computer through various port numbers, some
information which is more secure such as banking transaction always go through secure port
number and some general information send and received by Port no. 8080.
4) Path:
It is a directory (folder) path within the host, where your Website, images, css, pdfs are
contain.
5) Filename:
It is a file name such as webpage.html or image within the directory or actual object which is
going to access via url.
 2) Relative URLs
What is Relative URL?
A relative URL is a short URL it points to a resource webpage to the current directory. Consider
the situation where all webpages of your website is contain in one folder and home page is a
start page of your website, so whenever user wants to open your website user just type
domain name and automatically home.html webpage will get as start page of website.

When you link another webpage with homepage and that another webpage is in same
directory where home.html page resides then the relative URL is used to mansion just name
of the webpage. As an example, if you need to create a link in your home page to a file called
ContactUs.html, which resides in the same directory as your home page, you can simply use
the file name, the below code refers link for ContactUs.html webpage which present in
Home.html as follows:

<a href=”ContactUs.html”> Contact Us </a>

Here, no need to mansion domain name in front of webpage name.

But if you want to open contact page of another college which is not a part of your website it
is a part of another website then you have to follow absolute URL to mansion domain name
as well as ContactUs.html such as <a href=”http://www.anothercollege.com/
ContactUs.html”> Contact Us </a>





 Web Server:
Web server is a combination of the High speed hardware computer and the Web server software. It
will help to serve web content (Webpage, stored media) to the user that can be accessed through
the Internet.

Web Server

Web Server as Hardware Web Server as Software

The most powerful 1) Microsoft’s IIS

server computer (Internet Information
machine which is Server) for ASP web
greater in hardware pages.
component, speed,
storing capacity and 2) WAMP/XAMP for
functionality than PHP web pages.
any client computer.
3) Apache Tomcat
for java web pages.

The most common use of web servers:

1. Hosting and publishing websites

2. Data storage
3. Running web applications
4. Handling email accounts
5. FTP data other web content sharing
6. Multiplayer Game website

Overview

• The primary function of a web server is to store, process and deliver web pages to clients.
 The communication between client and server takes place using the Hypertext Transfer
Protocol (HTTP). Pages delivered are most frequently HTML documents, which may include
images, style sheets and scripts in addition to text content.
• When a the client's web browser request a website, The web server then reads the request
and check the web page file, if it exists then sends a response to the client's web browser. The
response will describe the content of the file and contain the file itself if an error occur then
error message will transmit to saying that the file does not exist or is unavailable.

• If web server is considered as hardware web servers are not always used for serving the World
Wide Web. They can also be found embedded in devices such as printers, routers, webcams
and serving only a local area network. The web server may then be used as a part of a system
for monitoring and/or administering. This usually means that no additional software has to be
installed on the client computer; since only a web browser is required (which now is included
with most operating systems).

History: In 1989 Tim Berners-Lee proposed a new project to CERN as www, with the goal of easing
the exchange of information between scientists by using a hypertext system. WWW ran on world's
first web server, used in CERN is Next STEP.

Category of web servers:

1. HTTP Server – A web server which supply webpage to user in internet. This pages runs on the
client browser. It generally contains the static pages.
2. FTP Server – A FTP Server is file storage server where documents and media files are stored
in massive amount. This type of server used for file transfer from one machine (Computer) to
another using the internet or LAN. It uses File Transfer Protocols to transfer file from one
computer to another.
 3. Mail Server - A Mail Server store and retrieve email messages from client’s mail box.

 Web Protocols:

1) HTTP:

Hypertext Transfer Protocol (In short HTTP) is a communications protocol. It is used to send and
receive webpages and files on the internet. It was developed by Tim Berners-Lee. HTTP version 1.1
is the most common used version today. This is the foundation for data communication for the World
Wide Web (i.e. internet) since 1990.

HTTP is client/server protocol. Basically, HTTP is a TCP/IP based communication protocol, that is
used to deliver data (HTML files, image files, query results, etc.) on the World Wide Web. The default
port is TCP 80, but other ports can be used as well. It provides a standardized way for computers to
communicate with each other. HTTP specification specifies how clients' request data will be
constructed and sent to the server, and how the servers respond to these requests.

Basic Features:
There are three basic features of HTTP

• HTTP is connectionless: The HTTP client, i.e., a browser creates an HTTP request and after a
request is made, the client disconnects from the server and waits for a response. The server
processes the request and re-establishes the connection with the client to send a response
back. The server and client are aware of each other only during a current request. Afterwards,
both of them forget about each other. Due to this nature of the protocol. Browser send
request and wait for response for that there is no need to create and maintain current live
connection.
• HTTP is media independent: It means, any type of data can be sent by HTTP as long as both
the client and the server know how to handle the data content.
2) FTP Protocol:

The File Transfer Protocol (FTP) is a standard network protocol used to transfer computer files
between a client and server on a computer network. The original specification for the File
Transfer Protocol was written by Abhay Bhushan, he is the author of the File Transfer Protocol
(which he started working on while he was a student at IIT-Kanpur).
FTP is state-full connection protocol that means FTP is built on a client-server model
architecture and uses separate online live data connections between the client and the server.
FTP by default use port number 21.
The first FTP client applications were command-line programs but now it developed for newer
operating systems which had graphical user interfaces like windows, and are still worked with
most Windows, MAC, Unix, and Linux operating systems.

FTP protocol having two types

1. Login FTP: FTP login uses a normal username and password scheme for granting access. The
username is sent to the server using the USER command, and the password is sent using the
PASS command. If the information provided by the client is accepted by the server, the server
will send a response to the client and the session will established and from then secure data
transfer can be stated.
2. Anonymous FTP: Anonymous means unknown. In this type of FTP user may not enter
username and password to access FTP service. Users typically log into the service with an
'anonymous' account when prompted for user name. Although users are commonly asked to
send their email address instead of a password, no verification is actually performed on the
supplied data. Many FTP hosts whose purpose is to provide software updates will allow
anonymous logins.
 3) Telnet Protocol:

Telnet is a protocol used to log in to remote (longer distance) computer on the internet or network.
Telnet was developed in 1969. Historically, Telnet provided access to a command-line interface (Text
mode like DOS operating system) on a remote computer, but now telnet concept becomes remote
desktop login with graphical interface.

There are number of Telnet clients having user friendly interface. The following diagram shows a
person is logged in to computer A, and from there, he remote logged into computer B. now whatever
commands and task performed by user in computer A all actions actually implement in Computer B
at same time.

Telnet is connection oriented protocol that means it work on state-full principle and compulsory
needs current online live data connection. The result of this request would be an invitation to log
on with a userid and a prompt for a password. If accepted, you would be logged-in like any user who
used this computer every day. Telnet use port no 23. Telnet is most likely to be used by program
developers and anyone who has a need to use specific applications or data located at a particular
longer distance host computer.

Security: In this system security is a major issue. The number of people attempting to hack other
people’s servers, due to this security-related issues telnet becomes more secure with the help of the
Secure Shell (SSH) protocol.
  Hyperlink (Anchor) Tag & it’s all attributes,-
The HTML anchor element is used to create a link to a resource (another web page, a file, etc.) or to
a specific place within a web page.
Syntax: <a href=”path&filename.extension”> text </a>
Example: <a href=”www.mywebsite.com/home.html”> text </a>

The anchor tag alone won't do anything without an attribute and value, so let's look at the attributes
we can use.

 HREF Attribute:
Href is short for hypertext reference. To create a link, you have to know the web address url of the
file you want to link to, whether it's another web page of your own site, another website, or a link to
file such as a PDF document, sound file, image, or another type of file.

Suppose you want to link to the front page of website site.

The web address is: http://www.google.com. You'd code the link like this:
<a href="http://www.google.com">Use this link to search Google</a>
The href part, shown in dark blue text with underlined. This is the attribute that defines the address
of the file you want to link to.
The equal sign always connects an attribute to the attribute's value. So in this case, href is the
attribute, and http://www.google.com is the value. The value is always enclosed in quotation marks.

Click here to visit Google is the anchor text, or sometimes called the link text. This is the part of a link
that is clickable.

If you link to a page on another site you need to use the full web address as shown in the example
above. If you're linking to a different page on your own same site you only need to use the page
name and extension if the page is keep in the same directory.

For example, suppose you want to link to a page you've saved with the name of HomePage.html.
You'd code it like this:
<a href="HomePage.html">Home Page</a>

By linking to your own internal pages without using the full web address your pages will load faster.
If you use the full web address the browser goes back out to the Internet to find your site all over
again, which takes longer. If you don't use the full path the browser only checks on your site for the
file.

File names, which includes the name of the web page and the extension, are case sensitive. That
means you must use the same capitalization in the web address of the file that was used when the
file was saved.

 TARGET Attribute
The target attribute allows you to determine where the link will open. With a framed site, it allows
you to target a link to a specific frame. The most common use is to have off-site links open in a new
browser window or new tab in same browser window. Target attribute specifies the target window
for a hypertext source link that references frames. The information linked to target will be displayed
in the named window.
 _blank : it open clicked web url webpage in new window of web browser;
 _self : Opens the linked document in the same frame as it was clicked (this is default);

Here's how to open a link in a new window:

<a href="http://www.site.com" target="_blank">Link Text</a>
By adding the part target=”_blank” to a link, the link will open in a new window or a new tab,
depending on the browser in use and how it's configured.

 Creating Email Hyperlinks (using mail to anchor):-

Although links to and within web pages are the most common types of links you’ll create, you can
also link to other types of content on the Internet.

E-Mail Addresses
When you want to give someone easy access to your e-mail address, you can include it on your page
as a mailto link. This means instead of using http://in front of your link, you use the e-mail protocol
mailto:to preface your e-mail address.

Clicking this link in a browser causes the visitor’s email program to launch. Then it opens a new email
message and places your e-mail address in the To: box of that message.

NOTE :
- For a mailto link to work, visitors to your web site must have an offline e-mail program (such
as Microsoft Outlook or Mac Mail) set up on their computers. E-mail links like these may not
work if the visitor uses only a web-based e-mail service such as Gmail or Hotmail.

- There actually is not a separate HTML tag for creating an HTML email link.

Email Link:
- By adding a couple extra onto the email address in href you can have both the SUBJECT and
the BODY of the email automatically populated for your visitors. This is great when receiving
 emails from a website to an email account that handles more mail than just from that one link
on your site.
- By defining a uniform subject that people will automatically have when clicking the link you
will be able to tell right away whether or not an email came from the website or from another
source (as long as your visitors don't mess with the subject that you give them).
- Subject - Insert the subject of the email with the information that you provide.
- Body - Insert the body of the email with the information that you provide.

Complete email HTML Code:

<a href= "mailto: [email protected] ?subject=Regarding Something &body=Dear sir,"> Email

Us</a>

Mailto: The anchor <A> tag can also be used for enabling emailing, which helps visitors to send
feedback through your web site. This is all fine as long as the visitor has his email client configured
to send emails. However, if this is not the case, his computer will inform to him about it and the email
will not be sent till an email client is configured.
Using the mailto value along with an email address in the HREF attribute of the anchor tag will create
a link, which when clicked will open the default email client email compose window with already
filling to part then subject part and body part with above data.