Preeti Gajera IU2241231347

Name of Institute: Institute of Technology and Engineering Branch: B.

Tech - Computer Science Engineering

Course code: CE0522

Course name: Web Technology

Index
No Date Experiment Title Sign

1.1 03/07/2023 Introduction to web 3.0, website, web

portal, domain name, networking
concepts. Introductionto internet, hosting
of
website, server
configurations and maintenance

1.2 10/07/2023 Create a website layout using table

structure which consist of space/locations
for Logo, Search,News, Events, Content
area, etc.

1.3 17/07/2023 Make resume with the help of Basic HTML

Tags

1.4 17/07/2023 Write HTML Code to display student

registration form.

2.1 24/07/2023 Use CSS in resume which was made using

only HTML
tags.

5CSE-E2 WT
Preeti Gajera IU2241231347

No Date Experiment Title Sign

2.2 Write the following styles in separate CSS
file and alsoshow how to link this CSS file in
HTML file.

(a) The headings should have normal

font styleand font size should be
120%.

(b) Apply a background image

“abcd.jpg”. Writea paragraph about it
and define a class arial for
paragraph which defines font family.

3.1 Write a Javascript code to build a calculator.

3.2 Write a Javascript program to

calculate area oftriangle and
rectangle.

3.3. Write a Javascript to take 2 digit number

andthen
separate this two digits then multiply
first digit byitself for second digit
times.(Exa: 23, Output: 2 ismultiply 3
times answer is: 8)

4.1 Using Angular JS, user get input value

search box andenter it in AngularJS
component using Enter key

4.2 Using Angular JS features make a

shopping list/To-do
list where you can add or remove items.

5.1 PHP based web application to understand

data retrieval on server side

5CSE-E2 WT
Preeti Gajera IU2241231347

5.2 Include, require, date functions in php.

No Date Experiment Title Sign

5.3 Develop PHP web application using session
and cookie.

5.4 Understand PHP MyAdmin.

5.5 Implement php application to store

employeerecords in MySQL database

6 Mini Project

5CSE-E2 WT
Preeti Gajera IU2241231347

PRACTICAL:1.1

AIM: Introduction to web 3.0, website, web portal, domain name, networking
concepts. Introductionto internet, hosting of website, server configurations and
maintenance

Web 3.0

Web 3.0 is the next generation of the internet, also known as the Semantic Web. It is a decentralized
web that uses blockchain technology to allow users to own their data and interact with each other in a
more secure and transparent way. Web
3.0 is still in its early stages of development, but it has the potential torevolutionize the way we use
the internet.

Websites

A website is a collection of web pages that are hosted on a server and can beaccessed by users over
the internet. Websites can be used for a variety of purposes, such as providing information, selling
products or services, or providing a platform for communication.

Web portals

A web portal is a website that provides access to a variety of other websites andresources. Web
portals often include search engines, directories, news and weather feeds, and other tools that make it
easy for users to find the informationthey need.

Domain names

A domain name is a unique identifier for a website on the internet. Domain names are made up of two
parts: the domain name and the top-level domain (TLD). The domain name is the part that users type
into their web browsers to access a website, such as www.google.com. The TLD is the part that
indicates thetype of website, such as .com, .org, or .edu.

Networking concepts

Networking concepts are the principles that govern how computers and devices communicate with each
other over a network. These concepts include things like IP addresses, subnet masks, routers, and
switches.

The internet

The internet is a global network of computers that allows users to share information and resources. The
internet is made up of a vast number of smaller networks, each of which is connected to the others
through routers.
5CSE-E2 WT
Preeti Gajera IU2241231347

Hosting of websites

When you create a website, you need to find a hosting provider to store your website's files and make
them accessible to users over the internet. There are many different hosting providers available, each
with its own set of features and pricing plans.

Server configurations and maintenance

Once your website is hosted, you need to configure your server to ensure that it is running properly.
This includes tasks such as setting up security measures, installingsoftware updates, and monitoring
performance.

5CSE-E2 WT
Preeti Gajera IU2241231347

PRACTICAL:1.2

AIM: Create a website layout using table structure which consist of space/locationsfor Logo,
Search,News, Events, Content area, etc.

<html>
<head>
<title> Preeti_347_pr1.2</title>
</head>
<body>
<table width="100%" height="100%" border="0">
<tr>
<td colspan="2"> </td>
<td align="center">
<a href="#">HOME</a>
</td>
</tr>

<tr>
<td>
&nbsp;
</td>

<td>
<table align="center" border="0">
<tr>
<td colspan="2">
<img src="logo.png" alt="Logo"/><br/><br/>
</td>
</tr>

<tr align="center">
<td colspan="2">
<input type="text" size="40" placeholder="Search..."/><br/><br/>
</td>
</tr>

<tr>
<td align="center">
<a href="#">News</a>
</td>

<td align="center">
<a href="#">Events</a>
</td>

</tr>
</table>
</td>

<td>
&nbsp;

5CSE-E2 WT
Preeti Gajera IU2241231347
</td>

</tr>

<tr>
<td align="center">
<a href="#">About Us</a>
</td>

<td>
&nbsp;
</td>

<td align="center">
<a href="#">Contact Us</a>
</td>
</tr>
</table>
</td>
<tr>
&nbsp;
</tr>
</tr>
</table>
</body>
</html>

OUTPUT:

5CSE-E2 WT
Preeti Gajera IU2241231347

PRACTICAL:1.3

AIM: Make resume with the help of Basic HTML Tags.

<html>
<head>
<title>trushil</title>
<style>
table{width="200"}
</style>
</head>
<body>
<div id="header"></div>
<h1>Resume</h1>
<img src="trushil.jpeg" alt="trushil" height="200pxl" width="200pxl"/><br/>
<p class="head">Interests</p>
<ul>
<li>Drawing</li>
<li>Design</li>
<li>Programming</li>
<li>Computer Science</li>
</ul>
<p class="head">Skills</p>
<ul>
<li>Web Design with HTML & CSS</li>
</ul>
<p class="head">Education</p>
<ul>
<a href="https://www.ox.ac.uk/">
<li>oxford</li>
</a>
<a href="https://www.frankfurt-university.de/en/">
<li>frankfurt</li>
</a>
<a href="https://deaconsfoundation.org/">
<li>deacons</li>
</ul>
</a>
<p class="head">Experience</p>
<ul>
<li>Student Technology Intern for Wilton School District</li>
</ul>
</body>
</html>

5CSE-E2 WT
Preeti Gajera IU2241231347

OUTPUT:

5CSE-E2 WT
Preeti Gajera IU2241231347
PRACTICAL:1.4

AIM: Write HTML Code to display student registration form.

<html>
<head>
<title>Student Registration Form</title>
</head>
<body>
<h2>Student Registration Form</h2>
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name" required><br><br>

<label for="email">Email:</label>
<input type="email" id="email" name="email" required><br><br>

<label for="dob">Date of Birth:</label>

<input type="date" id="dob" name="dob" required><br><br>

<label for="gender">Gender:</label>
<input type="radio" id="male" name="gender" value="male" required>
<label for="male">Male</label>
<input type="radio" id="female" name="gender" value="female" required>
<label for="female">Female</label>
<input type="radio" id="other" name="gender" value="other" required>
<label for="other">Other</label><br><br>

<label for="address">Address:</label>
<textarea id="address" name="address" rows="4" cols="30"required></textarea><br><br>

<label for="course">Course:</label>
<select id="course" name="course" required>
<option value="">Select a course</option>
<option value="math">Mathematics</option>
<option value="science">Science</option>
<option value="history">History</option>
<option value="english">English</option>
</select><br><br>

<input type="submit" value="Submit">

<input type="reset" value="Reset">
</form>
</body>
</html>

5CSE-E2 WT
Preeti Gajera IU2241231347

Output:

5CSE-E2 WT
Preeti Gajera IU2241231347
PRACTICAL:2.1

AIM: Use CSS in resume which was made using only HTMLTags.

<html>
<head>
<title>preeti</title>
<style> body {
font-family: Arial, sans-serif; margin: 0;
padding: 0;
}
h1 {
text-align: center; margin-top: 20px;
}
img {
display: block; margin: 0 auto;
border-radius: 50%; margin-top: 10px;
}
.head {
font-size: 20px; font-weight: bold; margin-top: 15px;
}
ul {
list-style-type: square; margin-left: 30px;
}
a{
text-decoration: none;

color: #007BFF;
}
</style>
</head>
<body>
<div id="header"></div>
<h1>Resume</h1>
<img src="eleven.jpg" alt="eleven" height="200px" width="200px"/><br/>

<p class="head">Interests</p>
<ul>
<li>Drawing</li>
<li>Design</li>
<li>Programming</li>
<li>Computer Science</li>
</ul>

<p class="head">Skills</p>
<ul>

<li>Web Design with HTML & CSS</li>

</ul>

<p class="head">Education</p>
<ul>

5CSE-E2 WT
Preeti Gajera IU2241231347

<li><a href="https://www.ox.ac.uk/">oxford</a></li>

<li><a href="https://www.frankfurt-university.de/en/">frankfurt</a></li>
<li><a href="https://deaconsfoundation.org/">deacons</a></li>
</ul>

<p class="head">Experience</p>
<ul>
<li>Student Technology Intern for Wilton School District</li>
</ul>
</body>
</html>

OUTPUT:

5CSE-E2 WT
Preeti Gajera IU2241231347

5CSE-E2 WT