web technology laboratory with mini project...

WEB TECHNOLOGY LABORATORY WITH MINI

PROJECT (15CSL77)

[As per Choice Based Credit System (CBCS) scheme ]

Prepared By

Chitra C & Ramya S

Assistant Professor

Maharaja Institute Of Technology Mysore

Belawadi, Srirangapatna Taluk, Mandya-571477

Department of Information Science and Engineering

2019-2020

MANUAL OF THE SUBJECT TAUGHT FOR THE YEAR 2019-2020 (ODD)

Vision of the Institute

To be recognized as a premier technical and management institution promoting extensive education

fostering research, innovation and entrepreneurial attitude.

Mission of the Institute

To empower students with indispensable knowledge through dedicated teaching and collaborative

learning.

To advance extensive research in science, engineering and management disciplines.

To facilitate entrepreneurial skills through effective institute industry collaboration and interaction

with alumni.

To instill the need to uphold ethics in every aspect.

To mould holistic individuals capable of contributing to the advancement of the society.

Vision of the department

To be recognized as the best center for technical education and research in the field of information science

and engineering.

Mission of the department

To facilitate adequate transformation in students through a proficient teaching learning process with

the guidance of mentors and all-inclusive professional activities.

To infuse students with professional, ethical and leadership attributes through industry collaboration

and alumni affiliation.

To enhance research and entrepreneurship in associated domains and to facilitate real time problem

solving.

Program Educational Objectives:

Proficiency in being an IT professional, capable of providing genuine solutions to information

science problems.

Capable of using basic concepts and skills of science and IT disciplines to pursue greater

competencies through higher education.

MAHARAJA INSTITUTE OF TECHNOLOGY MYSORE

BELAWADI, SRIRANGAPATNA TALUK, MANDYA-571477

DEPARTMENT OF INFORMATION SCIENCE AND ENGINEERING

Exhibit relevant professional skills and learned involvement to match the requirements of

technological trends.

Program Outcome

PO1. Engineering knowledge: Apply the knowledge of mathematics, science, engineering fundamentals,

and an engineering specialization to the solution of complex engineering problems.

PO2. Problem analysis: Identify, formulate, research literature, and analyze complex engineering problems

reaching substantiated conclusions using first principles of mathematics, natural sciences, and engineering

sciences.

PO3. Design/development of solutions: Design solutions for complex engineering problems and design

system components or processes that meet the specified needs with appropriate consideration for the public

health and safety, and the cultural, societal, and environmental considerations.

PO4. Conduct investigations of complex problems: Use research-based knowledge and research methods

including design of experiments, analysis and interpretation of data, and synthesis of the information to

provide valid conclusions.

PO5. Modern tool usage: Create, select, and apply appropriate techniques, resources, and modern

engineering and IT tools including prediction and modeling to complex engineering activities with an

understanding of the limitations.

PO6. The engineer and society: Apply reasoning informed by the contextual knowledge to assess societal,

health, safety, legal and cultural issues and the consequent responsibilities relevant to the professional

engineering practice.

PO7. Environment and sustainability: Understand the impact of the professional engineering solutions in

societal and environmental contexts, and demonstrate the knowledge of, and need for sustainable

development.

PO8. Ethics: Apply ethical principles and commit to professional ethics and responsibilities and norms of

the engineering practice.

PO9. Individual and team work: Function effectively as an individual, and as a member or leader in diverse

teams, and in multidisciplinary settings.

PO10. Communication: Communicate effectively on complex engineering activities with the engineering

community and with society at large, such as, being able to comprehend and write effective reports and

design documentation, make effective presentations, and give and receive clear instructions.

PO11. Project management and finance: Demonstrate knowledge and understanding of the engineering and

management principles and apply these to one’s own work, as a member and leader in a team, to manage

projects and in multidisciplinary environments.

PO12. Life-long learning: Recognize the need for, and have the preparation and ability to engage in

independent and life-long learning in the broadest context of technological change.

Program Specific Outcome:

Student will be able

PSO1: Apply the principles of theoretical foundations, data Organizations, networking concepts

and data analytical methods in the evolving technologies.

PSO2:Analyse proficient algorithms to develop software and hardware competence in both

professional and industrial areas

Course Syllabus

FACULTY NAME : CHITRA C & RAMYA S

SUBJECT: WEB TECHNOLOGY LABORATORY WITH MINI PROJECT

SUBJECT CODE: 15CSL77 ACADEMIC YEAR 2019-20(ODD)

NUMBER OF LECTURE HOURS/WEEK 03 TOTAL NUMBER OF LECTURE HOURS 40

Course Overview

The basic idea of web technology was to emerge the evolving technologies of computers, data networks

and hypertext into powerful and easy to use global information system. Tim burners-Lee, a British scientist,

invented the world wide web (www) in 1989 at CERN. The Web was originally developed to meet the

demand for automated information sharing between scientists in universities and institutes around the world,

this makes the www to emerge. Web Programming is a system of interlinked documents that are accessed

via internet. With a web browser, one can view web pages that may contain text, images, and video and

navigate between them via links. HTML is the programming language used to develop home pages on the

Internet.

This course covers the most current tools available for designing (HTML, XHTML and XML)

documents to posting pages on the World Wide Web. This course makes the students to learn client-side

Scripting that is JavaScript document for updating dynamic functionalities and it also includes Server side

scripting language for processing data at the server using PHP. Though mini-project student can develop an

application to communicate client and server using various Scripting languages.

On completion of Lab course, a student will be familiar with client server architecture and able to

develop a web application using JavaScript and Server technologies to create fully functional website/web

application.

Course Objectives

Design and develop static and dynamic web pages.

Familiarize with Client-Side Programming, Server-Side Programming & Active server Pages.

Learn Database Connectivity to web applications.

MAHARAJA INSTITUTE OF TECHNOLOGY MYSORE

BELAWADI, SRIRANGAPATNA TALUK, MANDYA-571477

DEPARTMENT OF INFORMATION SCIENCE AND ENGINEERING

Laboratory Experiments

1. Write a JavaScript to design a simple calculator to perform the following operations: sum, product,

difference and quotient.

2. Write a JavaScript that calculates the squares and cubes of the numbers from 0 to 10 and outputs HTML

text that displays the resulting values in an HTML table format.

3. Write a JavaScript code that displays text “TEXT-GROWING” with increasing font

size in the interval of 100ms in RED COLOR, when the font size reaches 50pt it displays “TEXT-

SHRINKING” in BLUE color. Then the font size decreases to 5pt.

4. Develop and demonstrate a HTML5 file that includes JavaScript script that uses functions for the

following problems:

a. Parameter: A string

b. Output: The position in the string of the left-most vowel

c. Parameter: A number

d. Output: The number with its digits in the reverse order

5. Design an XML document to store information about a student in an engineering college affiliated to

VTU. The information must include USN, Name, and Name of the College, Branch, Year of Joining, and

email id. Make up sample data for 3students. Create a CSS style sheet and use it to display the document.

6. Write a PHP program to keep track of the number of visitors visiting the web page and to display this

count of visitors, with proper headings.

7. Write a PHP program to display a digital clock which displays the current time of the server.

8. Write the PHP programs to do the following:

a. Implement simple calculator operations.

b. Find the transpose of a matrix.

c. Multiplication of two matrices.

d. Addition of two matrices.

9. Write a PHP program named states.py that declares a variable state with value "Mississippi Alabama

Texas Massachusetts Kansas". write a PHP program that does the following:

a. Search for a word in variable states that ends in xas. Store this word in element of a list named statesList.

b. Search for a word in states that begins with k and ends in s. Perform a case insensitive comparison. [Note:

Passing re.Ias a second parameter to method compile performs a case-insensitive comparison.] Store this

word in element1 of statesList.

c. Search for a word in states that begins with M and ends in s. Store this word in element 2 of the list.

d. Search for a word in states that ends in a. Store this word in element 3 of the list.

10. Write a PHP program to sort the student records which are stored in the database using selection sort.

APPROVED BY

PROF CHITRA C PROF. RAMYA S CRITERIA 3 HOD

Study Experiment / Project:

Develop a web application project using the languages and concepts learnt in the theory and exercises listed

in part A with a good look and feel effects. You can use any web technologies and frameworks and

databases.

Note:

1. In the examination each student picks one question from part A.

2. A team of two or three students must develop the mini project. However during the examination, each

student must demonstrate the project individually.

3. The team must submit a brief project report (15-20 pages) that must include the

following

a. Introduction

b. Requirement Analysis

c. Software Requirement Specification

d. Analysis and Design

e. Implementation

f. Testing

MAHARAJA INSTITUTE OF TECHNOLOGY MYSORE BELAWADI, SRIRANGAPATNA TALUK, MANDYA-571477

Department of Information Science and Engineering

Faculty Name: Chitra C & Ramya S

WEB TECHNOLOGY LABORATORY WITH MINI PROJECT Sub Code: 15CSL77 IA Marks: 20

Hours/week (L. T. P):1:0:2 Exam Hours: 3 hours Total Hours: 50 Exam Marks: 80

Semester: VII Section: A & B

Sl No Contents 1 General Lab Instructions

2 Do’s and Don’ts

3 Syllabus

4 Introduction of Web Programming Tools

5 How To Embed Php Into Html

6 How does web Work

7 Steps to execute Client Side Scripting Programs

8 Steps to execute Server Side Scripting Programs

9 Lab Set Programs (1 to 10)

10 Viva Questions

11 Viva Question with answer

1. General Lab Guidelines:

Conduct yourself in a responsible manner at all times in the laboratory. Intentional misconduct

will lead to the exclusion from the lab.

Do not wander around, or distract other students, or interfere with the laboratory experiments of

other students.

Read the handout and procedures before starting the experiments. Follow all written and verbal

instructions carefully. If you do not understand the procedures, ask the instructor or teaching

assistant.

Attendance in all the labs is mandatory, absence permitted only with prior permission from Class

teacher.

The workplace has to be tidy before, during and after the experiment.

Do not eat food, drink beverages or chew gum in the laboratory.

Every student should know the location and operating procedures of all Safety equipment

including First Aid Kit and Fire extinguisher.

2. DO’S and DON’T’s

DO’s:-

Uniform and ID card are must.

Records have to be submitted every week for evaluation.

Sign the log book when you enter/leave the laboratory.

After the lab session, shut down the computers.

Keep your belongings in designated area.

Report any problem in system (if any) to the person in-charge.

DONT’S:-

Do not insert metal objects such as clips, pins and needles into the computer casings(They may cause

fire) and should not attempt to repair, open, tamper or interfere with any of the computer, printing,

cabling, or other equipment in the laboratory.

Do not change the system settings and keyboard keys.

Do not upload, delete or alter any software/ system files on laboratory computers.

No additional material should be carried by the students during regular labs.

Do not open any irrelevant websites in labs.

Do not use a flash drive on lab computers without the consent of lab instructor.

Students are not allowed to work in Laboratory alone or without presence of the instructor/ teaching

assistant.

3. SYLLABUS

1. Write a JavaScript to design a simple calculator to perform the following operations: sum, product,

difference and quotient.

2. Write a JavaScript that calculates the squares and cubes of the numbers from 0 to 10 and outputs HTML

text that displays the resulting values in an HTML table format.

3. Write a JavaScript code that displays text “TEXT-GROWING” with increasing font

size in the interval of 100ms in RED COLOR, when the font size reaches 50pt it displays “TEXT-

SHRINKING” in BLUE color. Then the font size decreases to 5pt.

4. Develop and demonstrate a HTML5 file that includes JavaScript script that uses functions for the

following problems:






VTU. The information must include USN, Name, and Name of the College, Branch, Year of Joining, and

email id. Make up sample data for 3students. Create a CSS style sheet and use it to display the document.









9. Write a PHP program named states.py that declares a variable state with value "Mississippi Alabama


a. Search for a word in variable states that ends in xas. Store this word in element of a list named statesList.

b. Search for a word in states that begins with k and ends in s. Perform a case insensitive comparison. [Note:

Passing re.Ias a second parameter to method compile performs a case-insensitive comparison.] Store this

word in element1 of statesList.


d. Search for a word in states that ends in a. Store this word in element 3 of the list.

10. Write a PHP program to sort the student records which are stored in the database using selection sort.

Study Experiment / Project:

Develop a web application project using the languages and concepts learnt in the theory and exercises listed

in part A with a good look and feel effects. You can use any web technologies and frameworks and

databases.

Note:

1. In the examination each student picks one question from part A.

2. A team of two or three students must develop the mini project. However during the examination, each

student must demonstrate the project individually.

3. The team must submit a brief project report (15-20 pages) that must include the

following

a. Introduction

b. Requirement Analysis

c. Software Requirement Specification

d. Analysis and Design

e. Implementation

f. Testing

4. INTRODUCTION TO WEB PROGRAMMING TOOLS

This lab is intended to give the students a sound knowledge in the Web side programming. Before

going in to the details of the lab, the pre-requisites are the basic knowledge in HTML, XHTML, CSS, XML,

JavaScript, PHP and MySql. Let’s look at some of these topics in brief now.

Basics of HTML: -

Hyper Text Markup Language (HTML) is a markup language developed by the W3C people. This

can be used as an interface for working our programs. We submit all our requests in the HTML form. It is

basically a markup language which describes how the documents are to be formatted.

HTML has two basic entities, the “Tags” (Formatting commands) and the strings within the tags

called as the “Directives”. Most of the tags have the following syntax: - <something> that indicates the

beginning of the tag and a </something> that indicates the end of the tag.

NOTE:

Tags can either be in lower case or upper case, i.e. there is no difference between <html> and

<HTML>

The order in which parameters of the tag are given is not significant since each of these parameters is

named.

HTML Essentials

An HTML file should be written in the following format and should be saved with .html file

extension.

<html>

<head><title> New Page </title></head>

<body>

</body>

</html>

The “New Page” title comes on the top of the Browser Window.

Basic HTML Tags: -

To create a text box

<input type=text name=T1 size=20>

To create a Normal Button

<input type=button name=B4 value=GO>

To create a Submit Button

<input type=submit name=B1 size=20>

To create a Reset Button

<input type=reset name=T1 size=20>

To create a Radio Button

<input type=radio value=V1 checked name=R1>

To create a Check box

<input type=checkbox name=C1 value=ON >

To create a Form <form method=[GET/POST] action=[url]>

<input type=submit value=Submit name=B1>

<input type=reset value=Reset name="B2"></form>

To create a Text Area

<textarea rows=2 name=S1 cols=20></textarea>

To create a Drop down Menu <select size=1 name=D1></select>

To create a Hyper Link

<a href=http://localhost: 8080/a.htm>BACK </a>

To create a Marquee (The Marquee tag ensures that the text scrolls horizontally across the screen. It is

usually used by Advertisement sites to catch the user’s attention. Although they sound and look cool, it is

preferred to avoid using too much of these since they can be tiring and confusing to the users eye especially

if the scroll speed is set too high)

<marquee align=middle>Type your text here</marquee>

To give Background color

<body bgcolor=green>…</body>

(The basics colors can be given literally here. For a more elaborate set if colors, Hex code of the colors can

be given. Refer to the possible ranges of the Hex codes in a Text Book)

More Miscellaneous Tags: -

1) <h#>……..</h#> - where ‘#’ is a number ranging from 1-6. This is used to set the text size.

2) <pre> - Preformatted text, ensures that the text appears exactly the way it appears in the HTML code

thereby preserving the white spaces as well.

3) <br> - Inserts a “New line” character (similar to ‘\n’).

4) To Draw a Horizontal Line (Horizontal Ruler):

<hr size=4 width=”50 %”>

5) < b > - Bold, < I > - Italics

6) Tables:

<table>

<caption> Your Caption here </caption> [Optional Tag]

<tr>

<th> Row 1, Col 1 </th> [th implies Table Header]

<th> Row 2, Col 2 </th>

</tr>

<tr>

<td> Table Definition here </td>

<td> …………………….. </td>

</tr>

</table>

7) Comments:

< ! - - Your Comments here - - >

8) Background Images:

<body background = “pathname/abc.gif”>

…………………….

</body>

What is XHTML

XHTML stands for EXtensible HyperText Markup Language

XHTML is almost identical to HTML 4.01

XHTML is a stricter and cleaner version of HTML

XHTML is HTML defined as an XML application

XHTML is a W3C Recommendation

XHTML 1.0 became a W3C Recommendation January 26, 2000.

XHTML is compatible with HTML 4.01. All browsers support XHTML.

Why XHTML?

Many pages on the internet contain "bad" HTML.

The following HTML code will work just fine if you view it in a browser (even if it does

NOT follow the HTML rules):

<html> <head> <title>This is bad HTML</title>

<body> <h1>Bad HTML

</body>

XML is a markup language where everything must be marked up correctly, which results in "well-formed"

documents. XML is designed to describe data, and HTML is designed to display data.

Today's market consists of different browser technologies, some browsers run on computers, and some

browsers run on mobile phones or other small devices. The last-mentioned do not have the resources or

power to interpret a "bad" markup language.

Therefore - by combining HTML and XML, and their strengths, we got a markup language that is useful

now and in the future - XHTML.

The Most Important Differences:

XHTML elements must be properly nested

XHTML elements must always be closed

XHTML elements must be in lowercase

XHTML documents must have one root element

XHTML Elements Must Be Properly Nested

In HTML, some elements can be improperly nested within each other, like this:

<b><i>This text is bold and italic</b></i>

In XHTML, all elements must be properly nested within each other, like this:

<b><i>This text is bold and italic</i></b>

Note: A common mistake with nested lists, is to forget that the inside list must be within <li> and </li> tags.

This is wrong:

<ul> <li>Coffee</li>

<li>Tea <ul>

<li>Black tea</li>

<li>Green tea</li> </ul>

<li>Milk</li>

</ul>

This is correct:

<ul><li>Coffee</li>

<li>Tea <ul>

<li>Black tea</li>

<li>Green tea</li>

</ul> </li>

<li>Milk</li>

</ul>

Notice that we have inserted a </li> tag after the </ul> tag in the "correct" code example.

Notice that we have inserted a </li> tag after the </ul> tag in the "correct" code example.

XHTML Elements Must Always Be Closed

Non-empty elements must have a closing tag.

This is wrong:

<p>This is a paragraph <p>This is another paragraph

This is correct:

<p>This is a paragraph</p> <p>This is another paragraph</p>

Empty Elements Must Also Be Closed

Empty elements must also be closed.

This is wrong:

A break: <br> A horizontal rule:

<hr> An image: <img src="happy.gif" alt="Happy face">

This is correct:

A break: <br /> A horizontal rule:

<hr /> An image: <img src="happy.gif" alt="Happy face" />

XHTML Elements Must Be In Lower Case

Tag names and attributes must be in lower case.

This is wrong:

<BODY> <P>This is a paragraph</P> </BODY>

This is correct:

<body> <p>This is a paragraph</p> </body>

XHTML Documents Must Have One Root Element

All XHTML elements must be nested within the <html> root element. Child elements must be in pairs and

correctly nested within their parent element. The basic document structure is:

<html> <head> ... </head>

<body> ... </body>

</html>

Some More XHTML Syntax Rules

Attribute names must be in lower case

Attribute values must be quoted

Attribute minimization is forbidden

The id attribute replaces the name attribute

The XHTML DTD defines mandatory elements

The id Attribute replaces The name Attribute

HTML 4.01 defines a name attribute for the elements applet, frame, iframe, and img. In XHTML the name

attribute is deprecated. Use id instead.

This is wrong:

<img src="picture.gif" name="pic1" />

This is correct:

<img src="picture.gif" id="pic1" />

Note: To interoperate with older browsers for a while, you should use both name and id, with identical

attribute values, like this:

<img src="picture.gif" id="pic1" name="pic1" />

IMPORTANT Compatibility Note:

To make your XHTML compatible with today's browsers, you should add an extra space before the "/"

symbol.

The Lang Attribute

The lang attribute applies to almost every XHTML element. It specifies the language of the content within

an element.

If you use the lang attribute in an element, you must also add the xml:lang attribute, like this:

<div lang="no" xml:lang="no">Heia Norge!</div>

Mandatory XHTML Elements

All XHTML documents must have a DOCTYPE declaration. The html, head, title, and body elements must

be present.This is an XHTML document with a minimum of required tags:

<!DOCTYPE Doctype goes here>

<html xmlns="http://www.w3.org/1999/xhtml">

<head> <title>Title goes here</title> </head>

<body> </body>

</html>

Note: The DOCTYPE declaration is not a part of the XHTML document itself. It is not an XHTML

element. You will learn more about the XHTML DOCTYPE in the next chapter.

Note: The xmlns attribute in <html>, specifies the xml namespace for a document, and is required in

XHTML documents. However, the HTML validator at w3.org does not complain when the xmlns attribute is

missing. This is because the namespace "xmlns=http://www.w3.org/1999/xhtml" is default, and will be

added to the <html> tag even if you do not include it.

XHTML DTD (Document Type Definitions)

An XHTML document consists of three main parts:

the DOCTYPE declaration

the <head> section

the <body> section

The basic document structure is:

<!DOCTYPE ...>

<html> <head> <title>... </title> </head>

<body> ... </body>

</html>

Note: The DOCTYPE declaration is always the first line in an XHTML document!

An XHTML Example

This is a simple (minimal) XHTML document:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head> <title>simple document</title> </head>

<body> <p>a simple paragraph</p>

</body>

</html>

The DOCTYPE declaration above defines the document type. The rest of the document looks like HTML.

Document Type Definitions (DTD)

A DTD specifies the syntax of a web page in SGML

DTDs are used by SGML applications, such as HTML, to specify rules for documents of a particular

type, including a set of elements and entity declarations

An XHTML DTD describes in precise, computer-readable language, the allowed syntax of XHTML

markup

There are three XHTML DTDs:

STRICT

TRANSITIONAL

FRAMESET

XHTML 1.0 Strict

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Use the strict DOCTYPE when you want really clean markup, free of presentational clutter. Use it together

with CSS.

XHTML 1.0 Transitional

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Use the transitional DOCTYPE when you want to still use HTML's presentational features.

XHTML 1.0 Frameset

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Use the frameset DOCTYPE when you want to use HTML frames.

Empty Tags: <hr> , <br> and <img>

Empty tags are not allowed in XHTML. The <hr> and <br> tags should be replaced with <hr /> and <br />.

A general "find-and-replace" function was executed to swap the tags.

We decided not to close the <img> tags with </img>, but with /> at the end of the tag. This was done

manually.

HTML and XHTML Quick Reference:

Tag name Attribute Description Example

Anchor

<a>..</a>

href="URI"

name="text"

used as a hypertext link

or a named fragment

within the document.

<a href="filename.html"> . . .

</a> <a

href="http://server/path/file.h

tml"> . . . </a>

Bold

<b> ..</b>

Only core tag

attributes

Renders the enclosed

text in a bold font.

Turn left onto <b>Blackstone

Blvd.</b>.

Blockquote

<blockquote> .

. .

</blockquote>

Only core tag

attributes

Indicates a long

quotation. Its content is

some number of

blocklevel elements,

such as paragraphs

<blockquote

cite="http://www.example.co

m">

<h1>Fascinating

Evidence</h1>

<p>This is the beginning of a

lengthy quoted passage (text

continues . . . ) </p>

</blockquote>

Body

<body> . . .

</body>

Background=”URI”

bgcolor="#rrggbb"

or "color name"

The body of a

document contains the

document’s content.

Br

<br/>

Only core tag

attributes

Inserts a line break in

the content

Maharaja Institute of

Technology<br / >

Mysore<br />

(Comments)



Not applicable Inserts notes or scripts

into the document that

are not displayed by

the browser



<ul> . . . (markup continues)

Div

<div> . . .

</div>

Only core tag

attributes

Denotes a generic

“division” within the

flow of the document.

<div id="summary">

<h1>In Closing</h1>

<p>We can summarize as

follows...</p>

</div>

dl Only core tag Indicates a definition <dl>

<dl> . . . </dl> attributes

list. Each item in a

definition list consists

of two parts: a term (dt)

and description (dd),

which can represent

terms and definitions or

other name-value pairs.

<dt><code>em</code></dt>

<dd>Indicates emphasized

text.</dd>

</dl>

Em

<em> . . .

</em>

Indicates emphasized

text.

This is <em>exactly</em>

what you've been looking for

Font

<font> . . .

</font>

color="#RRGGBB/

color name"

face="typeface"

size="value"

An outdated method

for affecting the style

(color, typeface, and

size) of the enclosed

text

<font face="serif" size="+1"

color="red">Obsolete.</font

>

Form

<form> . . .

</form>

action="URL"

Required.

method="get|post"

name="text"

Indicates an interactive

form that contains

controls for collecting

user input and other

page content

<form action="/cgi-

bin/guestbook.pl"

method="get">

<input type="submit" />

<input type="reset"> </p>

</form>

h1, h2, h3, h4,

h5, h6

<hn > . . . </hn

>

Only core tag

attributes

Specifies a heading that

briefly describes the

section it introduces.

There are six levels of

headings, from h1

(most important)

to h6 (least important).

h1>Story Title</h1>

<p>In the beginning . . . </p>

head

<head> . . .

</head>

id="text"

profile="URLs"

Defines the head

portion of the

document that contains

information about the

document

<!DOCTYPE HTML

PUBLIC "-//W3C//DTD

HTML 4.01//EN"

“http://www.w3.org/TR/HT

ML4.01/strict.dtd">

<html>

<head>

<title>Document

Title</title>

<style type="text/css">h1

{color: #333;}</style>

</head>

</html>

hr

HTML: <hr>;

XHTML: <hr/>

or <hr />

Only core tag

attributes

Adds a horizontal rule

to the page that can be

used as a divider

between sections of

content. It is a block-

level element.

<p>These are notes from

Thursday.</p>

<hr>

<p>These are notes from

Friday.</p>

html

<html> . . .

</html>

id="text"

manifest="URL"

version="-

//W3C//DTD

HTML 4.01//EN"

xmlns="http://www.

w3.org/1999/xhtml"

This is the root element

of HTML and XHTML

documents, meaning

all other elements are

contained within it.

<html

xmlns="http://www.w3.org/1

999/xhtml" xml:lang="en"

lang="en">

<head>… </head>

<body>… </body>

</html>

I

<i> . . . </i>

Only core tag

attributes

Enclosed text is

displayed in italic.

The Western Black Widow

Spider, <i>Latrodectus

hesperus

</i>, is commonly found

img

HTML: <img>;

XHTML:

<img/> or <img

/>

align="bottom|left|

middle|right|top"

alt="text"

src="URL"

height="number"

width="number"

Places an image on the

page.

<p>Your ideal pet: <img

src="tiger.gif" alt="A

Tiger"></p>

input

HTML:

<input>;

XHTML:

<input/> or

<input />

accept="MIME

type"

align="bottom|left|

middle|right|top"

name="text"

src="URL"

size="number"

type="text|password

|checkbox|radio|sub

mit|reset|file|hidden|

image|button"

The input element is

used to create a variety

of form input controls.

<input type="button"

value="Push Me!">

li

<li> . . . </li>

type="format"

start="number"

value="number"

Defines an item in a

list. It is used within

the ol, ul, menu, and

dir list element

<ul>

<li>About</li>

<li>News</li>

</ul>

meta

HTML:

<meta>;

content="text"

name="text"

Provides additional

information about the

document. It should be

<meta name="copyright"

content="CIT gubbi">

XHTML:

<meta/> or

<meta />

placed within the head

of the document

ol

<ol> . . . </ol>

type="1|A|a|I|i"

Defines an ordered

(numbered) list that

consists of one or more

list

items (li).

<ol>

<li>Get out of bed</li>

<li>Take a shower</li>

</ol>

p

<p> . . . </p>

align="center|left|rig

ht"

Denotes a paragraph

<p> Paragraphs are the most

rudimentary elements of a

text document.</p>

pre

<pre> . . .

</pre>

width="number"

Delimits

“preformatted” text,

meaning that lines are

displayed exactly as

they are typed in,

honoring whitespace

such as multiple

character spaces and

line breaks.

<pre>

This is an example of text

with a lot of

Curious whitespace.

</pre>

script

<script> . . .

</script>

id="text"

src="URL"

type="content-type"

Places a script in the

document (usually

JavaScript for web

documents).

<script

type="text/javascript">

// <![CDATA[

. . . JavaScript code goes here

. . .

// ]]>

</script>

Table

<table> . . .

</table>

align="left|right|cent

er"

cellpadding="numb

er"

cellspacing="numbe

r"

border="number"

bgcolor="#rrggbb"

or "color name"

width="number" or

"percentage"

height="number" or

"percentage"

Indicates a table used

for displaying rows and

columns of data or

information.

<table width="70%"

cellpadding="10">

<tr> <td>cell 1</td><td>cell

2</td> </tr>


4</td> </tr>

</table>

td <td> . . .

</td>


er|justify|char"

bgcolor="#rrggbb"

or "color name"

colspan="number"

height="pixels" or

"percentage"

rowspan="number"

width="pixels" or

"percentage"

Defines a table data

cell

<table>

<tr> <td colspan="2">Cell

1</td> </tr>

<tr> <td>Cell

3</td><td>Cell 4</td> </tr>

</table >

tr

<tr> . . . </tr>


er|justify|char"

bgcolor="#rrggbb"

or "color name"

valign="top|middle|

bottom|baseline"

Defines a row of cells

within a table

<table>


2</td> </tr>


4</td> </tr>

</table>

Cascading Style Sheet:

CSS stands for Cascading Style Sheets and describes how HTML elements are to be displayed on screen,

paper, or in other media. It saves a lot of work and can control the layout of multiple web pages all at once.

Three Levels of Style sheets: Internal Level style sheet applied for single element, Document level style

sheets for single document and External style sheets are stored in CSS files separately used to apply for

more than a single document.

CSS stands for Cascading Style Sheets

Styles define how to display HTML elements

Styles are normally stored in Style Sheets

Styles were added to HTML 4.0 to solve a problem

External Style Sheets can save a lot of work

External Style Sheets are stored in CSS files

Multiple style definitions will cascade into one

Styles solved a big problem

The original HTML was never intended to contain tags for formatting a document. HTML tags were

intended to define the content of a document, like:

<p>This is a paragraph.</p>

<h1>This is a heading</h1>

When tags like <font> and color attributes were added to the HTML 3.2 specification, it started a nightmare

for web developers. Development of large web sites where fonts and color information had to be added to

every single Web page, became a long, expensive and unduly painful process.

To solve this problem, the World Wide Web Consortium (W3C) - responsible for standardizing HTML -

created CSS in addition to HTML 4.0.

With HTML 4.0, all formatting can be removed from the HTML document and stored in a separate CSS file.

All browsers support CSS today.

Styles save a lot of work

Styles sheets define HOW HTML elements are to be displayed.

Styles are normally saved in external .css files. External style sheets enable you to change the appearance

and layout of all the pages in a Web site, just by editing one single CSS document!

Multiple styles will cascade into one

Style sheets allow style information to be specified in many ways.

Styles can be specified:

inside an HTML element

inside the head section of an HTML page

in an external CSS file

Tip: Even multiple external style sheets can be referenced inside a single HTML document.

Cascading order - What style will be used when there is more than one style specified for an HTML

element?

Generally speaking we can say that all the styles will "cascade" into a new "virtual" style sheet by

the following rules, where number four has the highest priority:

1. Browser default

2. External style sheet

3. Internal style sheet (in the head section)

4. Inline style (inside an HTML element)

So, an inline style (inside an HTML element) has the highest priority, which means that it will override a

style defined inside the <head> tag, or in an external style sheet, or in a browser (a default value).

If the link to the external style sheet is placed after the internal style sheet in HTML <head>, the external

style sheet will override the internal style sheet!

Syntax

The CSS syntax is made up of three parts: a selector, a property and a value:

selector {property:value}

The selector is normally the HTML element/tag you wish to define, the property is the attribute you wish to

change, and each property can take a value. The property and value are separated by a colon, and surrounded

by curly braces:

body {color:black}

Note: If the value is multiple words, put quotes around the value:

p {font-family:"sans serif"}

To make the style definitions more readable, you can describe one property on each line, like this:

P { text-align:center; color:black; font-family:arial }

Grouping

You can group selectors. Separate each selector with a comma. In the example below we have grouped all

the header elements. All header elements will be displayed in green text color:

h1,h2,h3,h4,h5,h6 { color:green }

The class Selector

With the class selector you can define different styles for the same type of HTML element.

Say that you would like to have two types of paragraphs in your document: one right-aligned paragraph, and

one center-aligned paragraph. Here is how you can do it with styles:

p.right {text-align:right} p.center {text-align:center}

You have to use the class attribute in your HTML document:

<p class="right">This paragraph will be right-aligned.</p>

<p class="center">This paragraph will be center-aligned.</p>

Note: To apply more than one class per given element, the syntax is:

<p class="center bold">This is a paragraph.</p>

The paragraph above will be styled by the class "center" AND the class "bold".

You can also omit the tag name in the selector to define a style that will be used by all HTML elements that

have a certain class. In the example below, all HTML elements with class="center" will be center-aligned:

.center {text-align:center}

In the code below both the h1 element and the p element have class="center". This means that both elements

will follow the rules in the ".center" selector:

<h1 class="center">This heading will be center-aligned</h1>

<p class="center">This paragraph will also be center-aligned.</p>

Add Styles to Elements with Particular Attributes

You can also apply styles to HTML elements with particular attributes.

The style rule below will match all input elements that have a type attribute with a value of "text":

input[type="text"] {background-color:blue}

The id Selector

You can also define styles for HTML elements with the id selector. The id selector is defined as a #.

The style rule below will match the element that has an id attribute with a value of "green":

#green {color:green}

The style rule below will match the p element that has an id with a value of "para1":

p#para1 { text-align:center; color:red }

Do NOT start an ID name with a number! It will not work in Mozilla/Firefox.

CSS Comments

Comments are used to explain your code, and may help you when you edit the source code at a later date. A

comment will be ignored by browsers. A CSS comment begins with "/*", and ends with "*/", like this:

/*This is a comment*/

p { text-align:center; /*This is another comment*/

color:black; font-family:arial

How to Insert a Style Sheet

When a browser reads a style sheet, it will format the document according to it. There are three ways of

inserting a style sheet:

External Style Sheet

An external style sheet is ideal when the style is applied to many pages. With an external style sheet, you

can change the look of an entire Web site by changing one file. Each page must link to the style sheet using

the <link> tag. The <link> tag goes inside the head section:

<head> <link rel="stylesheet" type="text/css" href="mystyle.css" /> </head>

The browser will read the style definitions from the file mystyle.css, and format the document according to

it.

An external style sheet can be written in any text editor. The file should not contain any html tags. Your

style sheet should be saved with a .css extension. An example of a style sheet file is shown below:

hr {color:sienna} p {margin-left:20px} body {background image:url("images/back40.gif")}

Do not leave spaces between the property value and the units! "margin-left:20 px" (instead of "margin-

left:20px") will only work in IE6, but it will not work in Firefox or Opera.

Internal Style Sheet

An internal style sheet should be used when a single document has a unique style. You define internal styles

in the head section by using the <style> tag, like this:

<head> <style type="text/css"

hr {color:sienna} p {margin-left:20px}

body {background-image:url("images/back40.gif")}

</style> </head>

The browser will now read the style definitions, and format the document according to it.

Note: A browser normally ignores unknown tags. This means that an old browser that does not support

styles, will ignore the <style> tag, but the content of the <style> tag will be displayed on the page. It is

possible to prevent an old browser from displaying the content by hiding it in the HTML comment element:

<head><style type="text/css">



</style> </head>

Inline Styles

An inline style loses many of the advantages of style sheets by mixing content with presentation. Use this

method sparingly, such as when a style is to be applied to a single occurrence of an element.

To use inline styles you use the style attribute in the relevant tag. The style attribute can contain any CSS

property. The example shows how to change the color and the left margin of a paragraph:

<p style="color:sienna;margin-left:20px">This is a paragraph.</p>

Multiple Style Sheets

If some properties have been set for the same selector in different style sheets, the values will be inherited

from the more specific style sheet.

For example, an external style sheet has these properties for the h3 selector:

h3 { color:red; text-align:left; font-size:8pt }

And an internal style sheet has these properties for the h3 selector:

h3 { text-align:right; font-size:20pt }

If the page with the internal style sheet also links to the external style sheet the properties for h3 will be:

color:red; text-align:right; font-size:20pt

Basic of XML:

XML stands for eXtensible Markup Language and was designed to store and transport data. XML was

designed to be both human- and machine-readable.

<?xml version="1.0" encoding="UTF-8"?>

<note>

<to>Tove</to>

<from>Jani</from>

<heading>Reminder</heading>

<body>Don't forget me this weekend!</body>

</note>

Basics of JavaScript:

What is JavaScript?

JavaScript was designed to add interactivity to HTML pages

JavaScript is a scripting language

A scripting language is a lightweight programming language

JavaScript is usually embedded directly into HTML pages

JavaScript is an interpreted language (means that scripts execute without preliminary compilation)

Everyone can use JavaScript without purchasing a license

Are Java and JavaScript the same?

NO!

Java and JavaScript are two completely different languages in both concept and design!

Java (developed by Sun Microsystems) is a powerful and much more complex programming language - in

the same category as C and C++.

What can a JavaScript do?

JavaScript gives HTML designers a programming tool - HTML authors are normally not

programmers, but JavaScript is a scripting language with a very simple syntax! Almost anyone can

put small "snippets" of code into their HTML pages

JavaScript can put dynamic text into an HTML page - A JavaScript statement like this:

document.write("<h1>" + name + "</h1>") can write a variable text into an HTML page

JavaScript can react to events - A JavaScript can be set to execute when something happens, like

when a page has finished loading or when a user clicks on an HTML element

JavaScript can read and write HTML elements - A JavaScript can read and change the content of

an HTML element

JavaScript can be used to validate data - A JavaScript can be used to validate form data before it

is submitted to a server. This saves the server from extra processing

JavaScript can be used to detect the visitor's browser - A JavaScript can be used to detect the

visitor's browser, and - depending on the browser - load another page specifically designed for that

browser

JavaScript can be used to create cookies - A JavaScript can be used to store and retrieve

information on the visitor's computer

The Real Name is ECMAScript

JavaScript's official name is ECMAScript. ECMAScript is developed and maintained by the ECMA

organization. ECMA-262 is the official JavaScript standard. The language was invented by Brendan Eich at

Netscape (with Navigator 2.0), and has appeared in all Netscape and Microsoft browsers since 1996.

The development of ECMA-262 started in 1996, and the first edition of was adopted by the ECMA

General Assembly in June 1997.

The standard was approved as an international ISO (ISO/IEC 16262) standard in 1998.

The development of the standard is still in progress.

The HTML <script> tag is used to insert a JavaScript into an HTML page.

Put a JavaScript into an HTML page

The example below shows how to use JavaSript to write text on a web page:

<html> <body> <script type="text/javascript"> ... </script> </body> </html>

The example below shows how to add HTML tags to the JavaScript:

<html> <body> <script type="text/javascript"> document.write("<h1>Hello World!</h1>"); </script>

</body> </html>

Example Explained

To insert a JavaScript into an HTML page, we use the <script> tag. Inside the <script> tag we use the type

attribute to define the scripting language.

So, the <script type="text/javascript"> and </script> tells where the JavaScript starts and ends:

<html> <body> <script type="text/javascript"> ... </script>

</body> </html>

The document.write command is a standard JavaScript command for writing output to a page.

By entering the document.write command between the <script> and </script> tags, the browser will

recognize it as a JavaScript command and execute the code line. In this case the browser will write Hello

World! to the page:

<html> <body> <script type="text/javascript">

document.write("Hello World!"); </script> </body> </html>

Note: If we had not entered the <script> tag, the browser would have treated the document.write("Hello

World!") command as pure text, and just write the entire line on the page.

How to Handle Simple Browsers

Browsers that do not support JavaScript, will display JavaScript as page content.

To prevent them from doing this, and as a part of the JavaScript standard, the HTML comment tag should be

used to "hide" the JavaScript.

Just add an HTML comment tag  (end of comment) after

the last JavaScript statement, like this:

<html> <body> <script type="text/javascript">  </script>

</body> </html>

The two forward slashes at the end of comment line (//) is the JavaScript comment symbol. This prevents

JavaScript from executing the --> tag.

JavaScripts in the body section will be executed WHILE the page loads.

JavaScripts in the head section will be executed when CALLED.

Where to Put the JavaScript

JavaScripts in a page will be executed immediately while the page loads into the browser. This is not always

what we want. Sometimes we want to execute a script when a page loads, other times when a user triggers

an event

Scripts in <head>

Scripts to be executed when they are called, or when an event is triggered, go in the head section.

If you place a script in the head section, you will ensure that the script is loaded before anyone uses it.

<html> <head> <script type="text/javascript"> function message() { alert("This alert box was called with

the onload event");</script> </head> <body onload="message()"> </body> </html>

Scripts in <body>

Scripts to be executed when the page loads go in the body section.

If you place a script in the body section, it generates the content of a page.

<html> <head> </head> <body> <script type="text/javascript"> document.write("This message is written

by JavaScript"); </script> </body> </html>

Scripts in <head> and <body>

You can place an unlimited number of scripts in your document, so you can have scripts in both the body

and the head section.

<html> <head> <script type="text/javascript"> .... </script> </head> <body> <script type="text/javascript">

.... </script> </body>

Using an External JavaScript

If you want to run the same JavaScript on several pages, without having to write the same script on every

page, you can write a JavaScript in an external file.

Save the external JavaScript file with a .js file extension.

Note: The external script cannot contain the <script> tag!

To use the external script, point to the .js file in the "src" attribute of the <script> tag:

<html> <head> <script type="text/javascript" src="xxx.js"></script></head> <body> </body> </html>

Note: Remember to place the script exactly where you normally would write the script!

JavaScript is a sequence of statements to be executed by the browser.

JavaScript is Case Sensitive

Unlike HTML, JavaScript is case sensitive - therefore watch your capitalization closely when you write

JavaScript statements, create or call variables, objects and functions.

JavaScript Statements

A JavaScript statement is a command to a browser. The purpose of the command is to tell the browser what

to do.

This JavaScript statement tells the browser to write "Hello Dolly" to the web page:

document.write("Hello Dolly");

It is normal to add a semicolon at the end of each executable statement. Most people think this is a good

programming practice, and most often you will see this in JavaScript examples on the web.

The semicolon is optional (according to the JavaScript standard), and the browser is supposed to interpret

the end of the line as the end of the statement. Because of this you will often see examples without the

semicolon at the end.

Note: Using semicolons makes it possible to write multiple statements on one line.

JavaScript Code

JavaScript code (or just JavaScript) is a sequence of JavaScript statements.

Each statement is executed by the browser in the sequence they are written.

This example will write a heading and two paragraphs to a web page:

<script type="text/javascript">

document.write("<h1>This is a heading</h1>");

document.write("<p>This is a paragraph.</p>");

document.write("<p>This is another paragraph.</p>");

</script>

JavaScript Blocks

JavaScript statements can be grouped together in blocks. Blocks start with a left curly bracket {, and ends

with a right curly bracket }. The purpose of a block is to make the sequence of statements execute together.

This example will write a heading and two paragraphs to a web page:


{ document.write("<h1>This is a heading</h1>");

document.write("<p>This is a paragraph.</p>");

document.write("<p>This is another paragraph.</p>"); }

</script>

The example above is not very useful. It just demonstrates the use of a block. Normally a block is used to

group statements together in a function or in a condition (where a group of statements should be executed if

a condition is met).

You will learn more about functions and conditions in later chapters.

About PHP:

PHP is a server-side scripting language. The concept of php is very similar to the JavaScipts or

VBScipts. PHP server-side scripting language is similar to JavaScript in many ways, as they both allow you

to embed little programs (scripts) into the HTML of a Web page.

What is PHP?

PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose

scripting language that is especially suited for web development and can be embedded into HTML.

Nice, but what does that mean? An example:

Example #1 An introductory example

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html> <head> <title>Example</title> </head>

<body> <?php echo "Hi, I'm a PHP script!"; ?>

</body>

</html>

Instead of lots of commands to output HTML (as seen in C or Perl), PHP pages contain HTML with

embedded code that does "something" (in this case, output "Hi, I'm a PHP script!"). The PHP code is

enclosed in special start and end processing instructions <?php and ?> that allow you to jump into and out of

"PHP mode."

What distinguishes PHP from something like client-side JavaScript is that the code is executed on the server,

generating HTML which is then sent to the client. The client would receive the results of running that script,

but would not know what the underlying code was. You can even configure your web server to process all

your HTML files with PHP, and then there's really no way that users can tell what you have up your sleeve.

The best things in using PHP are that it is extremely simple for a newcomer, but offers many advanced

features for a professional programmer. Don't be afraid reading the long list of PHP's features. You can jump

in, in a short time, and start writing simple scripts in a few hours.

What can PHP do?

Anything. PHP is mainly focused on server-side scripting, so you can do anything any other CGI program

can do, such as collect form data, generate dynamic page content, or send and receive cookies. But PHP can

do much more.

There are three main areas where PHP scripts are used.

▪ Server-side scripting. This is the most traditional and main target field for PHP. You need three things to

make this work. The PHP parser (CGI or server module), a web server and a web browser. You need to run

the web server, with a connected PHP installation. You can access the PHP program output with a web

browser, viewing the PHP page through the server. All these can run on your home machine if you are just

experimenting with PHP programming. See the installation instructions section for more information.

▪ Command line scripting. You can make a PHP script to run it without any server or browser. You only

need the PHP parser to use it this way. This type of usage is ideal for scripts regularly executed using cron

(on *nix or Linux) or Task Scheduler (on Windows). These scripts can also be used for simple text

processing tasks. See the section about Command line usage of PHP for more information.

▪ Writing desktop applications. PHP is probably not the very best language to create a desktop application

with a graphical user interface, but if you know PHP very well, and would like to use some advanced PHP

features in your client-side applications you can also use PHP-GTK to write such programs. You also have

the ability to write cross-platform applications this way.

PHP can be used on all major operating systems, including Linux, many Unix variants (including HP-UX,

Solaris and OpenBSD), Microsoft Windows, Mac OS X, RISC OS, and probably others. PHP has also

support for most of the web servers today. This includes Apache, Microsoft Internet Information Server,

Personal Web Server, Netscape and iPlanet servers, Oreilly Website Pro server, Caudium, Xitami,

OmniHTTPd, and many others. For the majority of the servers, PHP has a module, for the others supporting

the CGI standard, PHP can work as a CGI processor.

The key difference between JavaScript and PHP:

The key difference between JavaScript and PHP is that, while the Web browser interprets JavaScript

once the Web page containing the script has been downloaded, server-side scripting languages like PHP are

interpreted by the Web server before the page is even sent to the browser. Once interpreted, the PHP code is

replaced in the Web page by the results of the script, so all the browser sees is a standard HTML file. The

script processed entirely by the server. Thus the designation: server-side scripting language.

Basics of MySQL: -

MySQL is an Open source Standard Query Language (SQL) database that is fast, reliable, easy to use and

suitable for applications of any size. MySQL can be integrated into Perl programs by using the Perl DBI

(Database Independent Interface) module. DBI is an API that allows Perl to connect and query a number of

SQL Databases such as MYSQL, Oracle, Sybase etc.

For some of the programs in the Lab course, the MySQL database is to be used. For that, the MySQL Server

is to be started. The following steps are to be performed in the same sequence on the Linux shell to start the

server and create the database along with the table.

To Start MySQL Server:

# mysql

mysql> create database ise;

mysql> show databases;

mysql> use ise;

mysql> create table student (

name varchar(25),

age int );

mysql> insert into employee values (“e1”,21);

mysql> insert into employee values (“e2”,22);

mysql> exit;

#.....(The MySQL server is now started and a database along with a table called “employee” is ready for

use).

5. HOW TO EMBED PHP INTO HTML:

Let’s look at the example today.php shown below.

<html>

<head><title>Today's date</title></head>

<body>

<p>Today's date (according to this web server) is

<?php

Echo( date("l, f ds y.") );

?>

</body></html>

The above program shows the PHP code embeded in the HTML. Lines between

<?php and ?> indicates the php code.

1. <?php means “begin php code”.

2. ?> means “end php code”.

The Web server is asked to interpret everything between these two delimiters

(<?php and ?>) and convert it to regular HTML code before sending the Web page to a

browser that requests it. The browser is presented with something like this:

<html><head><title>Today's date</title></head>

<body><p>today's date (according to this web server) is

Wednesday, june 7th 2000.</p>

</body></html>

Apache Http Server:

The web server we are using here is Apache Http Server. It is freely downloadable from the site

www.apache.org. Once you have downloaded the installer, double click on that and install it in to your

start to start your server. Then open an Internet explorer and type http://localhost:80/. The port number 80 is

optional in the URL. If you have successfully installed the server then you will get a screen shown below:

http://www.apache.org/

http://localhost/

6. HOW DOES THE WEB WORK?

The Web is usually accessed through a browser. When the user types in a URL say,

www.mitmysore.org in the Address Bar of the browser, the browser makes a socket (Network) connection to

the server www.mitmysore.org. This name is mapped to an IP address which is of the form 1.2.3.4 by

making use of a DNS Server. The browser connects to this server using a logical port 80, the port that the

server OS opens for internet connections. This port is standardized.

Based on the client request, the server delivers information. The type of data that the server sends back

to the client could be a simple plain text (HTML), images, Java Applets (More about Applets later!) etc. this

data can be obtained and delivered in three ways.

Serving Static Data – The server does not do any kind of the processing. It merely obtains the data

present on its local hard disk and sends it back to the client.

Serving Dynamic Data – The Server does some processing in this case like executing a program and

then outputs the result of the program back to the client as a response.

Serving Content with Embedded HTML – Here, an executable code is present with the HTML file.

It’s not quite static or dynamic.

The Client: -

The Server: -

Figure : Working of Web

Browser

Disk

abcd

Hyper links to

heythere.com

Web Server

W

The Internet

TCP Connection

http://www.mitmysore.org/

http://www.mitmysore.org/

7. STEPS TO EXECUTE CLIENT SIDE (HTML, XHTML AND

XML)PROGRAMS :

Open Notepad and edit the program.

Save the program under the extension “,html” for HTML and XHTML program.

For XML program store the program under the extension“.xml”.

Style sheets are applied for documents the store it separately under the extension “,css” for

Cascading Style sheets and “.xsl” for Extensible Transform Style sheet Language.

For executing the program just double click on the program where it is stored.

8. STEPS TO EXECUTE SERVER SIDE (PERL CGI AND PHP)PROGRAMS

Login as root & Open the terminal

Change the directory cd /var/www/html

For php programs save the files in .php extension vi filename.php

Open the Mozilla Web browser and type http://localhost/filename.html

The output of the program will be displayed.

http://localhost/filename.html

9. LAB SET PROGRAMS

1. Write a JavaScript to design a simple calculator to perform the following operations: sum,

product, difference and quotient.

Aim:

To Write a JavaScript to design a simple calculator

Algorithm/Procedure: 1. Create a webpage with the name program1.html.

2. Create table for Calculator using Html code.

3. Create html form and input field for each entry.

PROGRAM:

<!DOCTYPE HTML> <html>

<head>

<style>

table,th

{

border: 2px solid black;

width: 33%;

text-align: center;

border-spacing:10pt;

background-color: orange;

border-collapse:separate;

}

td{ padding:10pt;}

table { margin: auto; }

input { text-align:right; }

</style>


function calc(clicked_id)

{

var val1 = parseFloat(document.getElementById("value1").value);

var val2 = parseFloat(document.getElementById("value2").value);

if(isNaN(val1)||isNaN(val2))

alert("ENTER VALID NUMBER");

else if(clicked_id=="add")

document.getElementById("answer").value=val1+val2;

else if(clicked_id=="sub")

document.getElementById("answer").value=val1-val2;

else if(clicked_id=="mul")

document.getElementById("answer").value=val1*val2;

else if(clicked_id=="div")

document.getElementById("answer").value=val1/val2;

}

</script>

</head>

<body bgcolor="pink">

<form method="GET" action="">

<label><center><h1>SIMPLE CALCULATOR</h1></center></label><br/>

<fieldset>

<legend>Arithmetic Opration</legend>

<center><table>

<tr><td>Enter value1 :</td><td><input type="text" id="value1" value="0"/></td></tr>

<tr><td>Enter value2 :</td><td><input type="text" id="value2" value="0"/> </td></tr>

<tr><td><input type="button" value="Addition" id = "add" onclick="calc(this.id)"/></td>

<td><input type="button" value="Subtraction" id = "sub" onclick="calc(this.id)"/></td></tr>

<tr><td><input type="button" value="Multiplication" id = "mul" onclick="calc(this.id)"/></td>

<td><input type="button" value="Division" id ="div" onclick="calc(this.id)"/></td></tr>

<tr><td>Answer:</td><td> <input type="text" id="answer" value=""/></td>

<td colspan="2"><input type="reset" value="CLEAR ALL"/></td> </tr>

</table> </center>

</fieldset>

</form>

</body>

</html>

OUTPUT:

2. Write a JavaScript that calculates the squares and cubes of the numbers from 0 to 10 and

outputs HTML text that displays the resulting values in an HTML table format.

Aim:

To Write a JavaScript to Calculate the Squares and Cubes of numbers.

Algorithm/Procedure:

1. Create a webpage with the name program2.html

2. Create table for displaying squares and cubes using Html code.

3. Create Java script to calculate the squares and Cubes for numbers.

program2.html

<!DOCTYPE HTML> <html>

<head>

<style> table,tr, td

{

border: solid black;

width: 33%;

text-align: center;

border-collapse: collapse; background-color:lightblue;

}


</style>

<script>

document.write( "<table><tr><thcolspan='3'> NUMBERS FROM 0 TO 10 WITH THEIR SQUARES

AND CUBES </th></tr>" );

document.write( "<tr><td>Number</td><td>Square</td><td>Cube</td></tr>" );

for(var n=0; n<=10; n++)

{ document.write( "<tr><td>" + n + "</td><td>" + n*n + "</td><td>" + n*n*n + "</td></tr>" ) ;

}

document.write( "</table>" ) ;

</script>

</head>

</html>

OUTPUT:

3. Write a JavaScript code that displays text “TEXT-GROWING” with increasing font size in the

interval of 100ms in RED COLOR, when the font size reaches 50pt it displays “TEXT-SHRINKING”

in BLUE color. Then the font size decreases to 5pt.

Aim:

To write a JavaScript: Text-Growing and Text Shrinking

Program3.html

<!DOCTYPE HTML>

<html>

<head>

<style>

p {

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

}

</style>

</head>

<body>

<p id="demo"></p>

<script>

var var1 = setInterval(inTimer, 1000);

var fs = 5;

var ids = document.getElementById("demo");

function inTimer() {

ids.innerHTML = 'TEXT GROWING'; ids.setAttribute('style', "font-size: " + fs + "px; color: red"); fs += 5;

if(fs >= 50 ){

clearInterval(var1);

var2 = setInterval(deTimer, 1000);

}

}

function deTimer() {

fs -= 5;

ids.innerHTML = 'TEXT SHRINKING'; ids.setAttribute('style', "font-size: " + fs + "px; color: blue"); if(fs === 5 ){

clearInterval(var2);

}

}

</script>

</body>

</html>

OUTPUT:

4. Develop and demonstrate a HTML5 file that includes JavaScript script that uses functions for the following

problems:





Aim:

To write a JavaScript : position in the string of the left-most vowel and number with its digits in the reverse

order

Program 4.html <!DOCTYPE HTML>

<html>

<body>


var str = prompt("Enter the Input","");

if(!(isNaN(str)))

{

var num,rev=0,remainder;

num = parseInt(str);

while(num!=0) {

remainder = num%10;

num = parseInt(num/10);

rev = rev * 10 + remainder;

}

alert("Reverse of "+str+" is "+rev);

}

else

{ str = str.toUpperCase();

for(var i = 0; i < str.length; i++) {

var chr = str.charAt(i);

if(chr == 'A' || chr == 'E' || chr == 'I' || chr == 'O' || chr == 'U')break;

}

if( i < str.length )

alert("The position of the left most vowel is "+(i+1));

else

alert("No vowel found in the entered string");

}

</script>

</body> </html>

OUTPUT:


VTU. The information must include USN, Name, and Name of the College, Branch, Year of Joining,

and email id. Make up sample data for 3 students. Create a CSS style sheet and use it to display the

document.

Aim:

To design a XML document to store information about a student.

Program5.xml

<?xml-stylesheet type="text/css" href="pg5.css" ?>

<!DOCTYPE HTML>

<html>

<head>

<h1> STUDENTS DESCRIPTION </h1>

</head>

<students>

<student>

<USN>USN: 1ME15CS001</USN>

<name>NAME: SANVI</name>

<college>COLLEGE : MITM</college>

<branch>BRANCH:Computer Science and Engineering</branch>

<year>YEAR:2015</year>

<e-mail>E-Mail:[email protected]</e-mail>

</student>

<student>

<USN>USN: 1ME15IS002</USN>

<name>NAME: MANORANJAN</name>

<college>COLLEGE : MITM</college>

<branch>BRANCH: Information Science and Engineering</branch>



</student>

<student>

<USN>USN: 1ME13EC003</USN>

<name>NAME: CHANDANA</name>

<college>COLLEGE :MITM</college>

<branch>BRANCH: Electronics and Communication Engineering</branch>



</student>

</students>

</html>

Pg5.css

student{display:block; margin-top:10px; color:Navy;}

USN{display:block; margin-left:10px;font-size:14pt; color:Red;}

name{display:block; margin-left:20px;font-size:14pt; color:Blue;}

college{display:block; margin-left:20px;font-size:12pt; color:Maroon;}

branch{display:block; margin-left:20px;font-size:12pt; color:Purple;}

year{display:block; margin-left:20px;font-size:14pt; color:Green;}

e-mail{display:block; margin-left:20px;font-size:12pt; color:Blue;}

OUTPUT:



Aim: To write a PHP Program to Display the number of visitors visiting the web page.

Program6.php

<?php

$file=’count.txt’;

$count=strval(file_get_contents($file));

file_put_contents($file,$count+1);

echo (you are visitor number:”.$count);

?>

OUTPUT:

You are visitor number: 4


Aim: To Write a PHP Program to display digital clock with current time of the Server.

Program 7.php <!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="refresh" content="1"/>

<style>

p {

color:white;

font-size:90px;

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

}

body{background-color:black;}

</style>

<p> <?php echo date(" h: i : s A");?> </p> </head>

</html>

OUTPUT:






Aim:

To write a PHP program to implement the Simple Calculator and Multiplication of Matrices.

Program 8a.php

<html>

<head>

<style>

table, td, th

{


width: 35%;

text-align: center;

background-color: DarkGray;

}


input,p { text-align:right; }

</style>

</head>

<body>

<form method="post">

<table>

<caption><h2> SIMPLE CALCULATOR </h2></caption>> <tr><td>First Number:</td><td><input

type="text" name="num1" /></td>

<td rowspan="2"><input type="submit" name="submit" value="calculate"></td></tr>

<tr><td>Second Number:</td><td><input type="text"

name="num2"/></td></tr>

</form>

<?php

if(isset($_POST['submit'])) // it checks if the input submit is filled

{

$num1 = $_POST['num1'];

$num2 = $_POST['num2'];

if(is_numeric($num1) andis_numeric($num1) )

{

echo "<tr><td> Addition :</td><td><p>".($num1+$num2)."</p></td>";

echo "<tr><td> Subtraction :</td><td><p> ".($num1-$num2)."</p></td>";

echo "<tr><td> Multiplication :</td><td><p>".($num1*$num2)."</p></td>";

echo "<tr><td>Division :</td><td><p> ".($num1/$num2)."</p></td>";

echo "</table>";

}

else

{

echo"<script type='text/javascript' > alert(' ENTER VALID NUMBER');</script>";

}

}

?>

</body> </html>

OUTPUT:

Program 8b.php <?php

$a = array(array(1,2,3),array(4,5,6),array(7,8,9));

$b = array(array(7,8,9),array(4,5,6),array(1,2,3));

$m=count($a);

$n=count($a[2]);

$p=count($b);

$q=count($b[2]); echo "the first matrix :"."<br/>";

for ($row = 0; $row < $m; $row++) {

for ($col = 0; $col < $n; $col++)

echo " ".$a[$row][$col];

echo "<br/>";

}

echo "the second matrix :"."<br/>";

for ($row = 0; $row < $p; $row++) {

for ($col = 0; $col < $q; $col++)

echo " ".$b[$row][$col];

echo "<br/>";

}

echo "the transpose for the first matrix is:"."<br/>"; for ($row = 0; $row < $m; $row++) {

for ($col = 0; $col < $n; $col++)

echo " ".$a[$col][$row];

echo "<br/>";

}

if(($m===$p) and ($n===$q)) {

echo "the addition of matrices is:"."<br/>";

for ($row = 0; $row < 3; $row++) {

for ($col = 0; $col < 3; $col++)

echo " ".$a[$row][$col]+$b[$row][$col]." "; echo "<br/>";

}

}

if($n===$p){

echo " The multiplication of matrices: <br/>"; $result=array();

for ($i=0; $i < $m; $i++) {

for($j=0; $j < $q; $j++){

$result[$i][$j] = 0;

for($k=0; $k < $n; $k++)

$result[$i][$j] += $a[$i][$k] * $b[$k][$j];

}

}

for ($row = 0; $row < $m; $row++) {

for ($col = 0; $col < $q; $col++)

echo " ".$result[$row][$col];

echo "<br/>";

}

} ?>

OUTPUT:

The first matrix:

1 2 3

4 5 6

7 8 9

The second matrix:

7 8 9

4 5 6

1 2 3

The transpose of the first matrix:

1 4 7

2 5 8

3 6 9

The addition of matrices is:

8 10 12

8 10 12

8 10 12

the multiplication of matrices:

18 24 30

54 69 84

90 114 138

9. Write a PHP program named states.py that declares a variable states with value "Mississippi Alabama


a. Search for a word in variable states that ends in xas. Store this word in element 0 of a list named

statesList.

b. Search for a word in states that begins with k and ends in s. Perform a caseinsensitive comparison.

[Note: Passing re.Ias a second parameter to method compile performs a case-insensitive comparison.]

Store this word in element1 of statesList.


d. Search for a word in states that ends in a. Store this word in element 3 of the list

Aim: Write a PHP program with variable states with value “Mississippi Alabama Texas Massachusetts

Kansas" Program 9.php <?php

$states = "Mississippi Alabama Texas Massachusetts Kansas"; $statesArray = [];

$states1 = explode(' ',$states);

echo "Original Array :<br>";

foreach ( $states1 as $i => $value )

print("STATES[$i]=$value<br>");

foreach($states1 as $state) {

if(preg_match( '/xas$/', ($state)))

$statesArray[0] = ($state);

}


if(preg_match('/^k.*s$/i', ($state))) $statesArray[1] = ($state);

}


if(preg_match('/^M.*s$/', ($state)))


}

foreach($states1 as $state){

if(preg_match('/a$/', ($state)))


}

echo "<br><br>Resultant Array :<br>";

foreach ( $statesArray as $array => $value )

print("STATES[$array]=$value<br>"); ?>

OUTPUT:

10. Write a PHP program to sort the student records which are stored in the database

using selection sort.

Aim:

To write a PHP - program to sort the student records using selection sort.

Goto Mysql and then type

create database weblab;

use weblab;

create table student(usnvarchar(10),name varchar(20),address varchar(20));

program10.php

<!DOCTYPE html>

<html>

<body>

<style>

table, td, th

{


width: 33%;

text-align: center;

border-collapse:collapse;

background-color:lightblue;

}


</style>

<?php

$servername = "localhost";

$username = "root";

$password = "root";

$dbname = "weblab";

$a=[];

// Create connection // Opens a new connection to the MySQL server

$conn = mysqli_connect($servername, $username, $password, $dbname);

// Check connection and return an error description from the last connection error, if any

if ($conn->connect_error)

die("Connection failed: " . $conn->connect_error);

$sql = "SELECT * FROM student";

// performs a query against the database $result = $conn->query($sql);

echo "<br>";

echo "<center> BEFORE SORTING </center>"; echo "<table border='2'>";

echo "<tr>";

echo "<th>USN</th><th>NAME</th><th>Address</th></tr>"; if ($result->num_rows> 0)

{

// output data of each row and fetches a result row as an associative array

while($row = $result->fetch_assoc()){

echo "<tr>";

echo "<td>". $row["usn"]."</td>";

echo "<td>". $row["name"]."</td>";

echo "<td>". $row["addr"]."</td></tr>";

array_push($a,$row["usn"]);

}

}

else

echo "Table is Empty";

echo "</table>";

$n=count($a);

$b=$a;

for ( $i = 0 ; $i< ($n - 1) ; $i++ )

{ $pos= $i;

echo "<td>". $d[$i]."</td></tr>";

}

echo "</table>";

$conn->close();

?>

</body> </html>

OUTPUT:

BEFORE SORTING

10. VIVA QUESTIONS

1) Why HTML is called a “markup” language?

2) Can you name some Markup languages other than HTML?

3) How do you write comments in HTML?

4) What does the <br> and the <p> tag in HTML do?

5) How do you insert bullets in a HTML page?

6) What is the difference between Dynamic HTML and Dynamic Web Pages?

7) What are the Components of URL?

8) What do you mean by the “Shebang Line”?

9) What does ‘80’ mean in localhost: 8080?

10) What are cookies? Why do you need them?

11) What do you mean by a “Session”? Comment on its importance.

12) What do you mean by URI? Is it the same as URL?

13) What is a Query String?

14) What do you mean by “Embedded HTML”?

15) Why do you have to “use” a database that you have created in MySQL before you perform other operations?

16) What are the different data types supported by MySQL?

17) What does the “grant” command in MySQL do?

18) What do you mean by the “Path Information”?

19) What is the difference between “GET” and “POST”?

20) What do you mean by SSI? What are its uses?

21) Why is Java said to be “secure”?

22) What do you mean by “Exception Handling” in Java?

11. VIVA QUESTIONS WITH ANSWERS:

1. HTML stands for

As: Hyper Text Markup Language

2. What type of language is HTML?

As: Markup Language

3. What does an HTML document describe?

As: Web pages

4. Links in HTML are defined with what tag?

As: <a>, anchor tag

5. How many heading styles are there in HTML?

As: 6 headings, h1..h6

6. How line break is given in HTML?

As: using <br> tag

7. What is the use of attributes used in HTML?

As: They provide additional information for tags

8. For what purpose <hr> tag is used?

As: The <hr /> tag is used to create an horizontal rule (line).

9. What are the basic text formatting tags used in HTML?

As: <b> for bold, <i> for italic, <u> for underline etc.

10. What is a hyperlink?

As: In web terms, a hyperlink is a reference (an address) to a resource on the web.

11. How images are displayed on web pages in HTML?

As: In HTML, images are defined with the <img> tag.

The <img> tag is empty, which means that it contains attributes only and it has no closing tag.

To display an image on a page, you need to use the src attribute. Src stands for "source". The value of the src

attribute is the URL of the image you want to display on your page. The syntax of defining an image: <img

src=”url/”>

12. Explain <table> tag used in HTML?

As: Tables are defined with the <table> tag. A table is divided into rows (with the <tr> tag), and each row is

divided into data cells (with the <td> tag). The letters td stands for "table data," which is the content of a

data cell. A data cell can contain text, images, lists, paragraphs, forms, horizontal rules, tables, etc.

13. How many types of lists are available in HTML?

As: three types of lists are available <ul> for unordered list, <ol> for ordered list, <dl> for definition lists.

14. Explain <form> element used in HTML?

As: A form is an area that can contain form elements.

Form elements are elements that allow the user to enter information (like text fields, textarea fields, drop-

down menus, radio buttons, checkboxes, etc.) in a form.A form is defined with the <form> tag.

15. How colors are defined in HTML?

As: HTML colors are defined using a hexadecimal (hex) notation for the combination of Red, Green, and

Blue color values (RGB). The lowest value that can be given to one of the light sources is 0 (hex 00). The

highest value is 255 (hex FF). Hex values are written as 3 double digit numbers, starting with a # sign.

16. Explain about frames used in HTML?

As: With frames, you can display more than one HTML document in the same browser window. Each

HTML document is called a frame, and each frame is independent of the others.The disadvantages of using

frames are:

17. How to use styles in HTML?

As: When a browser reads a style sheet, it will format the document according to it. There are three ways of

inserting a style sheet:

External Style Sheet

An external style sheet is ideal when the style is applied to many pages. With an external style sheet, you

can change the look of an entire Web site by changing one file. Each page must link to the style sheet using

the <link> tag. The <link> tag goes inside the head section.

Internal Style Sheet

An internal style sheet should be used when a single document has a unique style. You define internal styles

in the head section with the <style> tag.

18. Expand CSS.

As: Cascading Style Sheets

19. What does styles do in Style sheets ?

As: They tell how to display various elements

20. How CSS syntax is made up of?

As: The CSS syntax is made up of three parts: a selector, a property and a value:

21. What is Javascript?

As: JavaScript is THE scripting language of the Web.JavaScript is used in millions of Web pages to add

functionality, validate forms, detect browsers, and much more.

22. What Javascript can do?

As: JavaScript gives HTML designers a programming tool

JavaScript can put dynamic text into an HTML page

JavaScript can react to events

JavaScript can read and write HTML elements –

JavaScript can be used to validate data –

JavaScript can be used to detect the visitor's browser –

JavaScript can be used to create cookies

23. What was the original name of Javascript?

As: ECMA Script (European Computers Manufacturers Association)

24. What is a Javascript statement?

As: A JavaScript statement is a command to a browser. The purpose of the command is to tell the browser

what to do.

25. Explain the importance of XML?

As: XML stands for EXtensible Markup Language.

XML was designed to transport and store data.

XML is important to know, and very easy to learn.

XML tags are not predefined, user has to define the tags

26. What is the difference between XML and HTML?

As: XML is not a replacement for HTML.

XML and HTML were designed with different goals:

HTML is about displaying information, while XML is about carrying information.

27. What is XML tree?

As: XML Documents Form a Tree Structure

XML documents must contain a root element. This element is "the parent" of all other elements.

The elements in an XML document form a document tree. The tree starts at the root and branches to the

lowest level of the tree.

All elements can have sub elements (child elements):

The terms parent, child, and sibling are used to describe the relationships between elements. Parent elements

have children. Children on the same level are called siblings (brothers or sisters).

All elements can have text content and attributes (just like in HTML).

28. What are the syntax rules for XML document?

As: All XML Elements Must Have a Closing Tag

XML Tags are Case Sensitive

XML Elements Must be Properly Nested

XML Documents Must Have a Root Element

29. What is an XML Element?

As: An XML element is everything from (including) the element's start tag to (including) the element's end

tag.

An element can contain other elements, simple text or a mixture of both. Elements can also have attributes.

<bookstore> <book

category="CHILDREN">

<title>Harry Potter</title>

<author>J K. Rowling</author>

<year>2005</year>

<price>29.99</price> </book>

<book category="WEB">

<title>Learning XML</title>

<author>Erik T. Ray</author>

<year>2003</year>

<price>39.95</price> </book>

</bookstore>

In the example above, <bookstore> and <book> have element contents, because they contain other

elements. <author> has text content because it contains text.

In the example above only <book> has an attribute (category="CHILDREN").

30. What is a well formed XML document?

As: Well Formed XML Documents

A "Well Formed" XML document has correct XML syntax.

The syntax rules were described in the previous chapters:

t

31. What is a valid XML document?

As: A "Valid" XML document is a "Well Formed" XML document, which also conforms to the rules of a

Document Type Definition (DTD):

<?xml version="1.0" encoding="ISO-8859-1"?>

<!DOCTYPE note SYSTEM "Note.dtd">

<note> <to>Tove</to> <from>Jani</from>

<heading>Reminder</heading> <body>Don't

forget me this weekend!</body> </note>

The DOCTYPE declaration in the example above, is a reference to an external DTD file. The content of the

file is shown in the paragraph below.

32. What is the purpose of XML DTD?

As: The purpose of a DTD is to define the structure of an XML document. It defines the structure with a list

of legal elements:

33. What is PHP?

As: PHP is a powerful tool for making dynamic and interactive Web pages.

PHP is the widely-used, free, and efficient alternative to competitors such as Microsoft's ASP.

PHP stands for PHP: Hypertext Preprocessor

-side scripting language, like ASP

etc.)

an open source software

34. Why PHP is popular than ASP?

As: PHP runs on different platforms (Windows, Linux, Unix, etc.)

PHP is compatible with almost all servers used today (Apache, IIS, etc.)

PHP is FREE to download from the official PHP resource: www.php.net

PHP is easy to learn and runs efficiently on the server side

35. What is basic PHP syntax?

As: A PHP scripting block always starts with <?php and ends with ?>. A PHP scripting block can be placed

anywhere in the document.On servers with shorthand support enabled you can start a scripting block with <?

and end with ?>.For maximum compatibility, we recommend that you use the standard form (<?php) rather

than the shorthand form.

36. Expand Perl?

As: Perl (Practical Extraction and Reporting Language) A scripting language for web servers. Most

often used on Unix servers

37. What is CGI script?

As: CGI scripts are executables that will execute on the server to produce dynamic and interactive web

pages. Most ISPs offer some kind of CGI capabilities. ISPs often offer preinstalled, ready to run, guest-

books, page-counters, and chat-forums solutions in CGI.CGI is most common on Unix or Linux servers.

38. Who developed PHP?

As: Rasmus Lerdorf

39. Who developed HTML and World Wide Web?

As: Tim Berners Lee

40. What is the use of HTTP protocol?

As: application-level protocol for distributed, collaborative, hypermedia information systems

-oriented

sks, such as name servers & distributed object management systems