STES’s

SINHGAD INSTITUTE OF TECHNOLOGY & SCIENCE

Narhe-411041, Pune
Department of Computer Engineering

LABORATORY MANUAL
2021-2022

WEB TECHNOLOGY LABORATORY

TE-COMPUTER ENGINEERING
(2019 Course)

SEMESTER-II
Subject Code: 310257

TEACHING SCHEME EXAMINATION SCHEME

Lectures: 4 Hrs. /Week Practical: 25 Marks

Practical: 2 Hrs. /Week Term Work: 25 Marks

-: Name of Faculty:-

Mrs. Vidya M. Shinde

Sinhgad Institute of Technology and Science, Narhe
 INDEX

Page
Sr. No Title Number
1 CASE STUDY ASSIGNMENT
Implement a web page index.htm for any client website (e.g., a
restaurant website project) using following:
2
a. HTML syntax: heading tags, basic tags and attributes, frames,
tables, images, lists, links for text and images, forms etc.
b. Use of Internal CSS, Inline CSS, External CSS

Design the XML document to store the information of the

employees of any business organization and demonstrate the use of:
3
a) DTD
b) XML Schema
And display the content in (e.g., tabular format) by using
CSS/XSL.
Implement an application in Java Script using following:
a) Design UI of application using HTML, CSS etc.
4 b) Include Java script validation
c) Use of prompt and alert window using Java Script

5
Implement the sample program demonstrating the use of Servlet.

6
Implement the program demonstrating the use of JSP.

Build a dynamic web application using PHP and MySQL

7

Design a login page with entries for name, mobile number email id
8 and login button. Use struts and perform following validations

Design an application using Angular JS.

9

Design and implement a business interface with necessary business

10 logic for any web application using EJB.

Mini-Project
11
 ASSIGNMENT NO 1
Title: CASE Study Assignment

Problem Statement: Students should visit different websites (Min. 5) for the different client
projects and note down the evaluation results for these websites, either good website or bad website.

Prerequisites: Web Technology

Objectives: Students should learn and conclude different website design issues.
Theory:
Web Application:

A web application runs over the Internet. Ex. eBay, Amazon, Google, Facebook etc.

A Web App contains five components:

1. HTTP Server: Examples are- Google Web Server, Apache HTTP Server, Apache Tomcat
Server, Microsoft Internet Information Server (IIS) etc.
2. HTTP Client (Web Browser): Examples are- Internet Explorer, Firefox, Google Chrome,Safari etc.

3. Database: Examples are- MySQL, Apache Derby, MS SQL Server, SQLite, PostgreSQL.

4. Client-Side Programs: It can be written in HTML Form, VBScript, JavaScript, Flash etc.

5. Server-Side Programs: could be written in Java Servlet/JSP, ASP, PHP, Perl, Python, and CGI.

How to Evaluate Websites: How to evaluate websites using below criteria

 CURRENCY: The timeliness of the information.

 RELEVANCE: The importance of the information for your needs.
 AUTHORITY: The source of the information.
 ACCURACY: The reliability, truthfulness, and correctness of the content.
 PURPOSE : The reason the information exists.

Based on above criteria you have to evaluate website either good website or bad website
 ASSIGNMENT NO 2
Title: Implement a web page index.html for any client website

Problem Statement: Write a program to design a website using HTML and CSS

Prerequisites: Web Technology

Objectives: Students should learn and Understand about basic concepts of HTML and CSS

Theory:
HTML: HTML is the standard markup language for creating Web pages.

HTML stands for Hyper Text Markup Language

HTML describes the structure of Web pages using markup

HTML elements are the building blocks of HTML pages

HTML elements are represented by tags

HTML tags label pieces of content such as "heading", "paragraph", "table", and so on

Browsers do not display the HTML tags, but use them to render the content of the page

HTML Versions:

HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML 5 2014
Table.1: HTML Versions

CSS:

CSS stands for Cascading Style Sheet. It is nothing, but design language intended to
simplify the process of making web pages presentable.CSS handles the feel and look part of
a web page. By using CSS, one can control the color of text, style of fonts, spacing between
paragraphs, layout designs.

CSS is easy to learn, easy to understand and it provides powerful control on presentation of an
HTML document.
Advantages of CSS:
It saves the time, Pages load faster, Easy maintenance, Superior styles to HTML, Multiple
Device Compatibility, Global web standards, Offline Browsing, Platform Independence.

CSS3 Modules:
CSS3 Modules are having old CSS specifications as well as extension features.

 Box Model
 Selectors
 Background
 Border
 Image Values and Replaced Content
 Text Effects
 Animations
 2D/3D Transformations
 Multiple Column Layout
 User Interface

Types of CSS

Inline - by using the style attribute in HTML elements. An inline CSS is used to apply a unique
style to a single HTML element.
Ex. <h1 style="color: blue ;"> This is a Blue Heading</h1>

Internal - by using a <style> element in the <head> section. An internal CSS is used to define
a style for a single HTML page. An internal CSS is defined in the <head> section of an HTML
page, within a <style> element.
Example:

<Style>
body {background-color: yellow ;}
h1 {color: blue ;}
p {color: red;}
</style>

External - by using an external CSS file. An external style sheet is used to define the style for
many HTML pages. With an external style sheet, you can change the look of an entire web
site, by changing one file! To use an external style sheet, add a link to it in the
<head> section of the HTML page.
Example:
<link ref ="stylesheet" href="styles.css">
 Use the HTML <head> element to store <style> and <link> elements
Use the CSS color property for text colors
Use the CSS font-family property for text fonts
Use the CSS font-size property for text sizes
Use the CSS border property for borders
Use the CSS padding property for space inside the border
Use the CSS margin property for space outside the border


Conclusion

 Hence, we have designed static web pages using HTML and CSS.

Questions:
1. What is the difference between HTML and HTML5?
2. What is the difference between html elements and tags?
3. What is marquee?
4. What is the use of span tag? Give an example?
5. What is the use of ‘required ’attribute in HTML5?
6. What is External stylesheet? What are the advantages and disadvantages?
7. What is CSS selector?
8. What are the components of CSS style?
9. What are browser safe color?


 ASSIGNMENT NO 3

Title: Design the XML document to store the information of the employees of any business organization

Problem Statement: Write a program to design a XML document using DTD and XML Schema

Prerequisites: Web Technology

Objectives: Students should learn and Understand about basic concepts of XML,
DTD and XML Schema

Theory:
XML stands for Extensible Markup Language. It is nothing but the text-based markup language
which is derived from Standard Generalized Markup Language (SGML).

XML tags identify the data and are used to store and organize the data, rather than specifying how

to display it like HTML tags, which are used to display the data. XML is not going to replace HTML

in the near future, but it introduces new possibilities by adopting many successful features of HTML.

There are three important characteristics of XML that make it useful in a variety of systems and

solutions−

1. XML is extensible − XML allows you to create your own self-descriptive tags, or language,

that suits your application.

2. XML carries the data, does not present it − XML allows you to store the data irrespective

of how it will be presented.

3. XML is a public standard − XML was developed by an organization called the World Wide

Web Consortium (W3C) and is available as an open standard.

Technology/TOOL

The XML documents have an XML declaration, but it is optional, and it is written as−

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

Where version is nothing but the version of an XML document and UTF specifies the character-

encoding used in the document.

Each XML-element needs to be closed either with start or with end elements as shown below −

<element>………</element>
An XML document can have only one root element.
<root>

<x>...</x>

<y>...</y>

</root>

XML Attributes:

Using a name/value pair, an attribute specifies a single property for an element. An XML- element can
have one or more attributes. For example −

<a href = "http://www.google.com/">XMLTutorial</a>

Here href is the attribute name and http://www.google.com/ is attribute value.

DTD (Document Type Definition)

A DTD is a Document Type Definition.

With a DTD, independent groups of people can agree on a standard DTD for

interchanging data. An application can use a DTD to verify that XML data is valid.

Types of DTD

Internal DTD:

If the DTD is declared inside the XML file, it must be wrapped inside the

<! DOCTYPE> definition

External DTD

If the DTD is declared in an external file, the <! DOCTYPE> definition must contain a reference to the
DTD file

Syntax
<!ELEMENT note(to,from,heading,body)>
<!ELEMENT to(#PCDATA)>
<!ELEMENT from(#PCDATA)>
<!ELEMENT heading(#PCDATA)>
<!ELEMENT body (#PCDATA)>

Conclusion
Hence, we have designed a XML document using DTD and XML Schema.
 ASSIGNMENT NO 4

Title: Design calculator and perform JavaScript validation

Problem Statement: Write a program to design calculator by using HTML, CSS & Java Script
and perform JavaScript validations.

Objectives: Students should learn

1. Understand about basic concepts of JavaScript.
2. Use JavaScript for validation of data.

Theory:
JavaScript is a programming language of HTML as well web. It is preferred for
creating network-centric applications. It is integrated and complimentary with Java. As JavaScript
is integrated with HTML it is very easy to implement. It is open as well as cross-platform.

Advantages:
The advantages of using JavaScript are −
It requires less server interaction
Immediate feedback to the visitors
Increased interactivity
Richer interfaces

Validation:

When client enters the all necessary data and press the submit button form validation is done
at server side If data entered by a client is incorrect or missing, the server needs to send all data back
to the client and request for resubmission of form with correct information.

So, JavaScript provides a way to validate form's data on the client's side itself before sending it to
the web server.
JavaScript can be implemented using JavaScript statements that are placed within the <script>.

You can place the <script> tags, containing your JavaScript, anywhere within your web page,
but it is normally recommended that you should keep it within the <head> tags.

The script tag takes two important attributes:

Language − This attribute specifies what scripting language you are using. Typically, its
value will be JavaScript. Although recent versions of HTML (and XHTML, its successor)
have phased out the use of this attribute.

Type − This attribute is what is now recommended to indicate the scripting language in
use and its value should be set to "text/JavaScript".
Conclusion:
Hence, we have designed calculator by using HTML, CSS & Java Script and perform JavaScript
validations
 ASSIGNMENT NO 5

Title: Servlet and MySQL (Backend)

Problem Statement: Design and Build E-bookshop web application using Servlet and MySQL.
.
Objectives: Students should learn
1. Understand about basic concepts of html, CSS

2. Understand the basic functionalities of Servlet

3. Having the knowledge of SQL query to create the database

SOFTWARE & HARDWARE REQUIREMENT

 Any Operating System
 JDK 7or later
 Editors: NetBeans /Eclipse/Vscode
 Web browser
 Tomcat 7 or later

Theory:
Servlet:
A Servlet is a server side program and written in Java. Servlet is a web component
that is deployed on the server for creating the dynamic web pages. A Java servlet is a Java
program that extends the capabilities of a server. Although servlets can respond to any
types of requests, they most commonly execute applications hosted on Web servers.

Servlet Architecture
TECHNOLOGY/TOOL IN BRIEF

1. Servlets
2. IDE: NetBeans 7.0 or Later
3. Databases: MySQL
4. Editor: Notepad++ /Vscode

NetBeans: NetBeans is an IDE, used for quickly and easily developing java desktop, mobile, and
web applications, as well as HTML5 applications with HTML, JavaScript, and CSS. Also provides
a huge set of tools for PHP and C/C++ developers. It is free and open source tool and has a great
community of users and developers around the world.

MySQL: MySQL is a freely available open source Relational Database Management System
(RDBMS). It uses the Structured Query Language (SQL).

SQL is the most popular language for adding, accessing and managing data in a database. It is
most noted for its quick processing, proven reliability, ease and flexibility of use. MySQL is an
essential part of almost every open source PHP application. Good examples for PHP & MySQL-
based scripts are WordPress, Joomla, Magneto and Drupal.

Vscode:
Visual Studio Code is a streamlined code editor with support for development operations like
debugging, task running, and version control. It aims to provide just the tools a developer needs for
a quick code-build-debug cycle and leaves more complex workflows to fuller featured IDEs, such
as Visual Studio IDE.

Conclusion:

Hence, we have designed Design and Build E-bookshop web application using Servlet and MySQL
 ASSIGNMENT NO 6

Title: JSP and MySQL (Backend)

Problem Statement: Design and Build Student database application using JSP and MySQL.
.
Objectives: Students should learn
1. Understand about basic concepts of html, CSS
2. Understand the basic functionalities of JSP
3. Having the knowledge of SQL query to create the database

SOFTWARE & HARDWARE REQUIREMENT

 Any Operating System
 JDK 7or later
 Editors: NetBeans /Eclipse/Vscode
 Web browser
 Tomcat 7 or later

Theory:
JSP:
Java Server Pages (JSP): It is a server side programming technology that is used to create
dynamic web-based applications. JSP have right to use the complete Java APIs, including the
JDBC API to access the databases.

It is a technology that helps software developers to create dynamic web pages based on HTML,
XML and other document types. It was released in 1999 by Sun Microsystems. It is just like a
PHP and ASP, but it uses the Java programming language.

A JSP element is a type of java servlet that is designed to accomplish the role of a user interface
for a java web application. Web developers write JSPs as text files that combine HTML or
XHTML code, XML elements, and rooted JSP actions and commands.

Using JSP, you can collect input from users through webpage forms, current records from a
database or another source and create web pages dynamically.

JSP tags can be used for different purposes, such as retrieving information from a database or
registering user preferences, accessing JavaBeans components, passing control between pages,
and sharing information between requests, pages etc.

Why we need JSP?

JSP is used for the design of dynamic web page and servlet is used to code the logic that is present
i.e. in the MVC (Model-View-Controller) architecture, the servlet is the controller and the JSP is

the view.
Architecture of JSP

1. The request / response part of a JSP is defined in below architecture

2. The client initiated request for a JSP file using browser

3. Webs server (i.e, JSP Engine) invokes the JSP file and interpret the JSP file produce a java
code. The created java code will be a Servlet.

4. Once Servlet is created, JSP engine compiles the servlet. Compilation errors will be
detected in this phase.

5. Now servlet class is loaded by the container and executes it.

6. Engine sends the response back to the client.

Java Server Page Architecture

JSP Syntax:
JSP declarations is used to declare variables and methods as shown below
<% Code %>
Following is the simple and first example for JSP:
//Hello.jsp
<html>
<head>
<title> JSP File</title>
</head>
<body>
<% out.println("Welcome to JSP Class"); %>
</body>
</html>

Output:
Welcome to JSP Class
TECHNOLOGY/TOOL IN BRIEF

NetBeans: NetBeans is an IDE, used for quickly and easily developing java desktop, mobile, and
web applications, as well as HTML5 applications with HTML, JavaScript, and CSS. Also provides
a huge set of tools for PHP and C/C++ developers. It is free and open source tool and has a great
community of users and developers around the world.

MySQL: MySQL is a freely available open source Relational Database Management System
(RDBMS). It uses the Structured Query Language (SQL).

SQL is the most popular language for adding, accessing and managing data in a database. It is
most noted for its quick processing, proven reliability, ease and flexibility of use. MySQL is an
essential part of almost every open source PHP application. Good examples for PHP & MySQL-
based scripts are WordPress, Joomla, Magneto and Drupal.

Vscode:
Visual Studio Code is a streamlined code editor with support for development operations like
debugging, task running, and version control. It aims to provide just the tools a developer needs for
a quick code-build-debug cycle and leaves more complex workflows to fuller featured IDEs, such
as Visual Studio IDE.

Conclusion:

Hence, we have designed Design and Build Student database application using Servlet and MySQL
 ASSIGNMENT NO 7

Title: PHP and MySQL (Backend)

Problem Statement: Design and develop dynamic web application using PHP and MySQL
as a back-end for employee data with insert, delete, view and update operations.

Objectives: Students should learn

1. Develop web based application using suitable client side and server side web
technologies.
2. Develop solution to complex problems using appropriate method,
technologies, frameworks, web services and content management.

Software & Hardware Requirement

Software (Minimum Requirement :):
1. Ubuntu 64 bit / Windows XP.
2. XAMPP Server
Hardware (Minimum Requirement :):
Intel p4 Machine with 1GB ARM and 32GB HDD.

Theory:

1. PHP:
The PHP Hypertext Preprocessor (PHP) began as a little open source venture that advanced as an
ever increasing number of individuals discovered how valuable it was. Rasmus Lerdorf released
the principal form of PHP route in 1994. PHP is a recursive acronym for "PHP: Hypertext
Preprocessor".

PHP is a server side scripting dialect that is installed in HTML. It is utilized to oversee dynamic
substance, databases, session following, even form whole internet business locales. It is
incorporated with various prevalent databases, including MySQL, PostgreSQL, Oracle, Sybase,
Informix, and Microsoft SQL Server.

PHP is pleasingly zippy in its execution, particularly when gathered as an Apache module on the
Unix side. The MySQL server, once began, executes even extremely complex questions with
colossal outcome sets in record-setting time.

PHP performs framework capacities, i.e. from documents on a framework it can make, open, read,
compose, and close them. PHP can deal with frames, i.e. accumulate information from records,
spare information to a document; through email you can send information, return information to
the client.
You include, erase, and adjust components inside your database through PHP. Access treats
factors and set treats. Utilizing PHP, you can confine clients to get to a few pages of your site. It
can encode information.

Example:

"Hello World" Script in PHP

To get a feel for PHP, first start with simple PHP scripts. Since "Hello, World!" is an essential
example, first we will create a friendly little "Hello, World!" script.

As mentioned earlier, PHP is embedded in HTML. That means that in amongst your normal
HTML (or XHTML if you're cutting-edge) you'll have PHP statements like this –

<html>
<head>

<title> Hello World</title>

</head>
<body>

<?php echo (“Hello Php”); ?>

</body>
</html>

To create and run PHP Web pages three fundamental parts should be introduced on your PC
framework.

Web Server − PHP will work with for all intents and purposes all Web Server programming,
including Microsoft's Internet Information Server (IIS) however then regularly utilized is
unreservedly accessible Apache Server. Download Apache for nothing here −
https://httpd.apache.org/download.cgi

Database − PHP will work with for all intents and purposes all database programming, including
Oracle and Sybase yet most regularly utilized is uninhibitedly accessible MySQL database.
Download MySQL for nothing here − https://www.mysql.com/downloads/

PHP Parser − keeping in mind the end goal to process PHP content directions a parser must be
introduced to create HTML yield that can be sent to the Web Browser. This instructional exercise
will manage you how to introduce PHP parser on your PC.
2. MySQL:

MySQL is the most famous Open Source Relational SQL Database Management System.
MySQL is outstanding amongst other RDBMS being utilized for creating different online
programming applications. MySQL is created, advertised and upheld by MySQL AB, which is a
Swedish organization. This instructional exercise will give you a fast begin to MySQL and make
you OK with MySQL programming.

What is a Database?

A database is a different application that stores a gathering of information. Every database has at
least one unmistakable APIs for making, getting to, overseeing, seeking and recreating the
information it holds.

Different sorts of information stores can likewise be utilized, for example, records on the
document framework or vast hash tables in memory yet information getting and composing
would not be so quick and simple with those kind of frameworks.

These days, we utilize social database administration frameworks (RDBMS) to store and oversee
tremendous volume of information. This is called social database since every one of the
information is put away into various tables and relations are set up utilizing essential keys or
different keys known as Foreign Keys.

A Relational Database Management System (RDBMS) is a product that:

 Empowers you to execute a database with tables, segments and records.

 Ensures the Referential Integrity between columns of different tables.
 Updates the lists naturally.
 Deciphers a SQL inquiry and consolidates data from different tables.

MySQL Database

MySQL is a quick, simple to-utilize RDBMS being utilized for some little and huge
organizations. MySQL is produced, showcased and upheld by MySQL AB, which is a Swedish
organization. MySQL is winding up so famous as a result of numerous great reasons:

 MySQL is discharged under an open-source permit. So you don't have anything to pay to
utilize it.
 MySQL is a capable program in its own particular right. It handles a huge subset of the
usefulness of the most costly and intense database bundles.
 MySQL utilizes a standard type of the outstanding SQL information dialect.
 MySQL takes a shot at many working frameworks and with numerous dialects including
PHP, PERL, C, C++, JAVA, and so forth.
 MySQL works rapidly and functions admirably even with extensive informational indexes.
  MySQL is amicable to PHP, the most refreshing dialect for web advancement.
 MySQL underpins huge databases, up to 50 million lines or more in a table. The default
document measure restrain for a table is 4GB, yet you can expand this (if your working
framework can deal with it) to a hypothetical utmost of 8 million terabytes (TB).
 MySQL is adaptable. The open-source GPL permit enables developers to alter the MySQL
programming to fit their own particular surroundings.

TECHNOLOGY/TOOL IN BRIEF
1. Technology is to be used is PHP (PHP Hypertext Preprocessor) and tool XAMPP server is
to be used to execute PHP web application.
2. XAMPP server embeds the PHP, MySQL and phpmyadmin, these three tools must be
required to run php web application.

DESIGN/EXECUTION STEPS

For the design purpose html and CSS is to be used. For this design part contains the GUI of web
applications, how its looks like? When users going to use the web application.
Steps to install XAMPP and configure the PHP, MYSQL server.
1. Download the XAMPP using following link (download latest version as per your Operating
system Windows/ Linux). Here we are using Linux Ubuntu Systems. Copy and paste
downloaded XAMPP into home location. https://www.apachefriends.org/download.html

2. Install XAMPP

3. After successful completion of installation. It will ask to run XAMPP and here say to run.
After run the MySQL and Apache web server should be in running state.

4. Now open browser and type “localhost” in URL with quotes.

5. Open phpmyadmin to create MySQL database

6. Type in browser URL “localhost/phpmyadmin”

Conclusion:

Hence, we have studied how to design and develop small web application using PHP script,
XAMPP server with apache server and MySQL as backend.
 ASSIGNMENT NO 8
Title: Design and develop any web application using Struts framework.

Problem Statement: Design and Create a login module for the web application using struts
framework.

Objectives: Students should learn

1. To impart the efficient and available client side and server side technologies.
2. To implement the communication between computing nodes using client
side and server side technologies.
3. To design and implement the web services with content management.

Software & Hardware Requirement

Software’s: Editor like notepad or np++, Java 1.7 or Higher, Apache Tomcat 7 or higher,
Struts API’s, Eclipse IDE.

Theory:

STRUTS
The frameworks plays a vital role in industries for manageable and well-designed application
development as well as enterprise application development. The core of the Struts framework is a
flexible control layer based on standard technologies like Java Servlets, JavaBeans, Resource
Bundles, and XML, as well as various Jakarta Commons packages. Struts encourages application
architectures based on the Model 2 approach, a variation of the classic Model-View-Controller
(MVC)
Struts gives its own particular Controller segment and incorporates with different advancements to
give the Model and the View. For the Model, Struts can collaborate with standard information get
to advances, as JDBC and EJB, and also most any outsider bundles, as Hibernate, iBATIS, or
Object Relational Bridge. For the View, Struts functions admirably with Java Server Pages,
including JSTL and JSF, and in addition Velocity Templates, XSLT, and
other introduction frameworks.

The Struts system gives the undetectable underpinnings each expert web application needs to
survive. Struts causes you make an extensible advancement condition for your application, in view
of distributed guidelines and demonstrated outline designs.

ORM remains for Object/Relational mapping. It is the customized and translucent constancy of
items in a Java application in to the tables of a social database utilizing the metadata that portrays
the mapping between the articles and the database. It works by changing the information starting
with one portrayal then onto the next.
The Model-View-Controller Architecture

"Model-View-Controller" is a way to build applications that promotes complete separation

between business logic and presentation. It is not specific to web applications, or Java, or J2EE (it
predates all of these by many years), but it can be applied to building J2EE web applications.

Figure. : Basic MVC Architecture.

The "view" is the user interface, the screens that the end user of the application actually sees and
interacts with. In a J2EE web application, views are JSP files. For collecting user input, you will
have a JSP that generates an HTML page that contains one or more HTML forms. For displaying
output (like a report), you will have a JSP generates an HTML page that probably contains one or
more HTML tables. Each of these is a view: a way for the end user to interact with the system,
putting data in, and getting data out.

What is Struts?

Struts is a framework that advances the utilization of the Model-View-Controller engineering for
planning substantial scale applications. The structure incorporates an arrangement of custom label
libraries and their related Java classes, alongside different utility classes. The most intense part of
the Struts system is its help for making and preparing electronic structures. We will perceive how
this functions later in this section.
 Struts Tags
Common Attributes
Almost all tags provided by the Struts framework use the following attributes:

Attribute Used for

Id the name of a bean for temporary use by the tag
name the name of a pre-existing bean for use with the tag
property the property of the bean named in the name attribute for use with the tag
scope the scope to search for the bean named in the name attribute

DESIGN/EXECUTION STEPS
Step 1) Create the directory structure as

Step 2) Create input page as below.

Step 3) Provide the entry of Controller in (web.xml) file as given above

Step 4) Create the action class (LoginAction.java)

Step 5) Map the request in (struts-config.xml) file and define the view components.

Step 6) Load the jar files

Step 7) start server and deploy the project or create .war file paste it in webapp folder and run

from manager-app.

Conclusion:
Hence, we have successfully tested the Struts framework and tested the results.
 ASSIGNMENT NO 9
Title: Design and develop an application using Angular JS.

Problem Statement: Design and Create registration form (first name, last name, username, and
password) and login page using Angular JS.

Objectives: Students should learn

1. Understand the design of single-page applications and how AngularJS
facilitates their development
2. Properly separate the model, view, and controller layers of your application
and implement them using AngularJS
Software & Hardware Requirement
1) editor like notepad or np++, AngularJS library
2) Operating system –Windows operating system/ open source Linux.
3) Internet browser eg. Internet Explorer, Mozilla, Chrome etc.

Theory:

ANGULARJS
AngularJS is an open-source web application framework. It was initially created in 2009 by Misko Hevery
and Adam Abrons. It is presently kept up by Google. Its most recent adaptation is 1.2.21. "AngularJS is an
auxiliary system for dynamic web applications. It gives you a chance to utilize HTML as your layout dialect
and gives you a chance to stretch out HTML's linguistic structure to express your application parts plainly and
compactly. Its information official and reliance infusion take out a significant part of the code you as of now
need to compose. Also, everything occurs inside the program, making it a perfect band together with any
server innovation".

General Features

AngularJS is a productive system that can make Rich Internet Applications (RIA).
AngularJS gives designers a choices to compose customer side applications utilizing JavaScript in a spotless
Model View Controller (MVC) way.
Applications written in AngularJS are cross-program agreeable. AngularJS consequently handles JavaScript
code reasonable for every program.

AngularJS is a MVC based structure.

An AngularJS application comprises of following three essential parts –

ng-app − This directive defines and links an AngularJS application to HTML.

ng-model − This directive binds the values of AngularJS application data to HTML input controls.

ng-bind − This directive binds the AngularJS Application data to HTML tags.
Example:
Now let us write a simple example using AngularJS library. Let us create an HTML
file myfirstexample.html as below –

<!doctype html>
<html>
<head>
<scriptsrc="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.2/angular.min.js"></script>
</head>
<body ng-app="myapp">
<div ng-controller="HelloController">
<h2>Welcome {{helloTo.title}} to the AngularJS Application! </h2>
</div>

<script>
angular.module("myapp",[])
.controller("HelloController",function($scope){
$scope.helloTo={};
$scope.helloTo.title="AngularJS";
});
</script>
</body>
</html>

Following sections describe the above code in detail:

1. Include AngularJS

We have included the AngularJS JavaScript file in the HTML page so we can use AngularJS −
<head>
<scriptsrc="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>

2. Point to AngularJS app

Next we tell what part of the HTML contains the AngularJS app. This done by adding the ngapp attribute to
the root HTML element of the AngularJS app.
You can either add it to html element or body element as shown below –

<bodyng-app="myapp">
</body>
3. View
The view is this part −
<div ng-controller="HelloController">
<h2>Welcome {{helloTo.title}} to the AngularJS Application! h2>
</div>

ng-controller tells AngularJS what controller to use with this view. helloTo.title tells AngularJS to write the
"model" value named helloTo.title to the HTML at this location.
4. Controller
The controller part is −
<script>
angular.module("myapp",[])
.controller("HelloController",function($scope){
$scope.helloTo={};
$scope.helloTo.title="AngularJS";
});
</script>

This code registers a controller function named HelloController in the angular module
named myapp. The controller function is registered in angular via the
angular.module(...).controller(...) function call.

The $scope parameter passed to the controller function is the model. The controller function adds a helloTo
JavaScript object, and in that object it adds a title field.

How AngularJS integrates with HTML

-app directive indicates the start of AngularJS application.

-model directive then creates a model variable named "name" which can be used with the html page and
the div having ng-app directive.
-bind then uses the name model to be displayed in the html span tag whenever user input something in the
text box.

AngularJS directives are used to extend HTML. These are special attributes starting with ng prefix.

We're going to discuss following directives −

ng-app −This directive starts an AngularJS Application.
ng-init −This directive initializes application data.
ng-model −This directive binds the values of AngularJS application data to HTML input controls.
ng-repeat − This directive repeats html elements for each item in a collection.

Conclusion:
Hence, with the help of this assignment it is helpful to understand features of AngularJS. MVC model
structure and its use in advanced web programming is studied.
 ASSIGNMENT NO 10
Title: Design and implement a business interface with necessary business logic for any web application
using EJB.

Problem Statement: Design and implement the web application logic for deposit and withdraw
amount transactions using EJB.

Objectives: Students should learn

1. Understand about basic concepts of java beans.
2. Understand the basic functionalities of JSP, HTML.
3. Having the knowledge of JBOSS server to deploy web application.

Software & Hardware Requirement

1) Ubuntu 64 bit / Windows 7.

2) JDK 7 (Java SE 7)
3) EJB 3.0 (stateless session bean)
4) Eclipse
5) JBoss Application Server (AS) 7.1.1

Theory:
Java Beans:
J2EE application container contains the components that can be used by the clients for
executing the business logic .These components are known as Enterprise Java Beans (EJB).
J2EE platform has component based architecture to provide multi-tiered, distributed and
highly transactional features to enterprise level applications.
EJB mainly contains the business logic & business data. EJB component is an EJB class. It is
a java class written by EJB developer & this class implements business logic.
It is used for developing very much scalable and robust enterprise level
applications to be deployed Application Server such as JBOSS, Web Logic etc.
EJB 3.0 is being a large shift from EJB 2.0 and makes development of EJB based applications
relatively easy.

Features of EJBs:
Some of the features of an application server include the following:
• Client Communication: The client, which is often a user interface, must be able to
call the methods of objects on the application server via agreed-upon protocols.
• State Management: You'll recall our discussions on this topic in the context of
JSP (Java Server Pages) and servlet development back in Chapter 6.
• Transaction Management: Some operations, for example, when updating data,
must occur as a unit of work. If one update fails, they all should fail.
• Database Connection Management: An application server must connect to a
database, often using pools of database connections for optimizing resources.
 • User Authentication and Role-Based Authorization: Users of an application
must often log in for security purposes. The functionality of an application to
which a user is allowed access is often based on the role associated with a user
ID.
• Asynchronous Messaging: Applications often need to communicate with other
systems in an asynchronous manner; that is, without waiting for the other system
to respond. This requires an underlying messaging system that provides
guaranteed delivery of these asynchronous messages.
• Application Server Administration: Application servers must be administered.
For example, they need to be monitored and tuned.

Types of Enterprise Java Beans (EJB):

There are three types of Enterprise Java Beans namely:

1. Session Beans
2. Entity Beans
3. Message driven beans

Session Beans
• Session beans are intended to allow the application author to easily implement
portions of application code in middleware and to simplify access to this code.
• Represents a single client inside the server
• The client calls the session bean to invoke methods of an application on the server
• Perform works for its client, hiding the complexity of interaction with other objects
in the server
• Is not shared
• Is not persistent
When the client stops the session, the bean can be assigned to another client from the
server Session beans are divided into two types:
1. Stateless Session Bean:
Stateless Session Bean is intended to be simple and “light weight” components. The
client, thereby making the server highly scalable, if required, maintains any state. Since
no state is maintained in this bean type, stateless session beans are not tied to any specific
client, hence any available instance of a stateless session bean can be used to service a
client.
• values only for the duration of the single invocation
• Except during method invocation, all instances of
stateless session bean are equivalent

2. Stateful Session Bean:

Stateful Session Bean provides easy and transparent state management on the server
side. Because state is maintained in this bean type, the application server manages
client/bean pairs.

Stateful session beans can access persistent resources on behalf of the client, but unlike
entity beans, they do not actually represent the data.
Difference Between Stateless and State Full EJB

Are as Follows Stateless:

1. Normally data members are not put in stateless session bean
2. Stateless beans are pooled
3. No effort for keeping client specific data
4. No Activation/Passivation in stateless session bean

Stateful:
1. Data members that represent state are present in stateful session bean
2. Stateful beans are cached
3. Setting the tag idle-timeout-seconds determines how long data is maintained in
stateful session bean
4. Activation – Passivation used

An Entity Bean
• An entity bean is an object representation of persistent data maintained in a
permanent data store such as a database. A primary key identifies each instance of an
entity bean. Entity beans are transactional and are recoverable in the event of a
system crash.
• Entity beans are representations of explicit data or collections of data, such as a row
in a relational database. Entity bean methods provide procedures for acting on the
data representation of the bean. An entity bean is persistent and survives if its data
remains in the database.
• An entity bean can implement either bean-managed or container-managed
persistence. In the case of bean-managed persistence, the implementer of an entity
bean stores and retrieves the information managed by the bean through direct
database calls. The bean may utilize either Java Database Connectivity (JDBC) or
SQL-Java (SQLJ) for this method.
• In the case of container-managed persistence, the container provider may implement
access to the database using standard APIs. The container provider can offer tools to
map instance variables of an entity bean to calls to an underlying database. The
container saves the data. There is no code in the bean for access the database. The
container handles all database access required for the bean which create links
between beans are created using a structure called abstract schema.

Enterprise Java Beans (EJB) Architecture

EJB server
EJB container

EJB home
interface
Client EJB
bean
EJB remote
interface
The EJB architecture is an extension of Web architecture. It has an additional tier. The
clients of an enterprise bean can be a traditional java application lie, applet, JSP or
Servlet.
Like in a web application, client browser has to go all the way to web container to use a
servlet or JSP, the communication between beans and clients is performed by the EJB
container.

The following are the flows of the EJB architecture.

 The client is working on a web browser.

 There is a database server that hosts a database, like MySQL /Oracle
 The J2EE server machine is running on an application server
 The client interface is provided with JSP/Servlet. The enterprise beans reside in
the business tier providing to the client tier.
 The Application Server manages the relationships between the client and
database machines.

• In a diagram, an enterprise bean is a non-visual component of a distributed,

transaction- oriented enterprise application. Enterprise beans are typically deployed
in EJB containers and run on EJB servers.

There are three types through which two or more activities may interfere:
1. Dirty read
2. Non-Repeatable read
3. Phantom read
 Clustering and Load-Balancing: Clustering is the process of combining the
multiple peripherals, computers and other resources into a single unit.
 A clustered system then works as load balanced system. In a distributed system
when a request is send to the server, an algorithm running on the server decides
which server has less load and sends the request to that server. EJB container
encapsulates these features to provide smooth and efficient service.
 Deployment Descriptor: A deployment descriptor is an XML file packaged with
the enterprise beans in an EJB JAR file or an EAR file. It contains metadata
describing the contents and structure of the enterprise beans, and runtime
transaction and security information for the EJB container.

EJB Server: An EJB server is a high-level process or application that provides a run-
time environment to support the execution of server applications that use enterprise
beans. An EJB server provides a JNDI-accessible naming service. It manages and
coordinates the allocation of resources to client applications, provides access to system
resources and provides a transaction service

Conclusion:
Hence, we have created a simple EJB 3 stateless session bean and a local Java application.