WEB DEVELOPMENT

CHAPTER 1
COMPANY PROFILE

Leviosa Consulting Pvt.Ltd.

Specialists in sustainable business growth

1.1 ABOUT

Leviosa Consulting is a team of international, best practice consultants who provide

sustainable business growth support, consultancy and training.

Leviosa Consulting is business growth consultancy company based in Sheffield, South

Yorkshire (UK) and Bangalore (India)

The company provides value-adding, sustainable business growth and improvement solutions
using it's team of consultants with expertise which stretches the length and breadth of the
business world.

Leviosa operate from a modern 5,000sqft facility in UK, just off Junction 35A of the M1
motorway as well as a modern 2,000sqft office in JP Nagar, 7th Phase, on the outskirts of
Bangalore.

With a strong team of energetic, experienced and very talented consultants and software
developers, our business culture is entirely focused on maximizing the user experience;
efficiently presenting value-add information in a friendly and self-intuitive way.

Leviosa provides a wide range of business improvement support services, from brand and
marketing development to process improvement and people training.

Dept. of ISE, AMCEC 2018-19 Page 1

WEB DEVELOPMENT

1.2 CASE STUDY

 Lean Six Sigma Yellow Belt Training

 Does Social Media Marketing Work?
 International Brand Uplift for Indian Manufacturer
 Business Culture Alignment with UK Client
 Advert promotes Technological Competitive Edge

Lean Six Sigma Yellow Belt Training

Successfully delivering Lean Six Sigma training is all about getting the balance right between
theoretical and practical content.

At our Unit 1, approved CMI training facility in Sheffield, UK, we can provide that right
balance as we have both office and workshop environments for the candidates to work in.

Over the 2-day Yellow belt course we look at the Lean terms used and tools which can be
applied with methodologies to deliver and realise business improvements.

The best bit comes with the ’real-world’ challenge, where the candidates apply all their new
learning in a practical, workshop environment.

1.3 Does Social Media Marketing Work?

There are many skeptics who would argue that social media marketing is a waste of time and
effort.

The truth is that if you haven't developed a social media strategy including identified your
target market and detailed a posting procedure, you will most likely fail.

If your social media content is poorly compiled and in the wrong tone or if you are
communicating a poor brand/image, you will most likely fail.

1.4 International Brand Uplift for Indian Manufacturer

Standard Glass Lining Technology is a leading designer, manufacturer and installer of Glass
Lined Equipment, based in Hyderabad, India. Their products include Glass Lined Reactors,

Dept. of ISE, AMCEC 2018-19 Page 2

WEB DEVELOPMENT

Receivers and Storage Tanks used in the Pharmaceutical and Chemical Industry sectors for
processing harmful and/or highly corrosive substances.

In 2014, the Standard Glass Managing Director contacted Leviosa Consulting with a desire to
improve the company brand and image so that they could better attract both overseas and
multi-national domestic clients.

Leviosa started building the Standard Glass brand by creating the online "shop window" - a
company website. The website look, feel and functionality is sooooooo important in today's
modern world. Getting the right mix of technical and sales content, with eye catching images
its critical.

Equally critical, is the development and marketing of the companies Polices and Procedures.
Leviosa is an international consultancy company and understand very well the requirements
of the UK, European and USA market place and what such clients like to see from a
manufacturing company.

1.5 Advert promotes Technological Competitive Edge

In 2014, Leviosa Consulting was engaged to develop the company image. The key objective
was to change it from the traditional, dirty engineering image to that of a technology business
with competitive advantage.

Subsequently, Leviosa developed a series of adverts and editorials which promoted the use of
the companies automated CNC robotic machine tool, cutting a variety of complex, highly
accurate patterns such as car body panels. The patterns are used as 'templates' to make
automotive cast die tools and these are then used in the car production plant to stamp out the
car panels in high volume batches.

The result of the Leviosa marketing campaign was a company image uplift with eye catching
advertisements and supporting technical editorials, which ultimately helped the business to
tender for high-end projects/business in sectors such as the Automotive, Nuclear and Oil &
Gas.

Dept. of ISE, AMCEC 2018-19 Page 3

WEB DEVELOPMENT

1.6 'Made In the UK' Business Re-branding

Eaves Infrastructure is a UK subcontract manufacturer of high precision, CNC

components. In 2016, the CEO of the company wanted to re-brand the business so he
approached Leviosa Consulting to help.

Leviosa conducted a SWOT analysis and identified an opportunity to redesign and align the
company logo and brand with the results of a market study that showed both domestic and
international clients place a high degree of trust and assurance with UK manufacturers. They
associate a 'Made in the UK' product with high quality, on-time delivery and total conformity
of supply and material traceability.

Subsequently, Leviosa redesigned the Eaves logo from the orange design, shown to the
upper-right, to the design shown lower-right. As an expert in Intellectual Property and
Copyright law, Leviosa conducted market due diligence to prevent future IP infringement
issues and created the new Eaves logo with a hint of the Union Jack flag.

Dept. of ISE, AMCEC 2018-19 Page 4

WEB DEVELOPMENT

CHAPTER 2
INTRODUCTION
2.1 Overview
PHP was developed by Ramus Ledford. It is a freeware. It is also a weakly typed, free from
language. PHP has since evolved into a powerful server-side markup language with syntax
that resembles a mix between Perl and C. PHP is a server-side scripting language designed
specifically for the web. Within an HTML page, we can embed PHP code that will be
executed each time the page is visited.HTML generate the web page with the static text and
images. However, the need evolved for dynamic web base usage. These dynamic usages are
facilities by PHP [1].

Other tasks that PHP is especially good at are database access, disk access, networking and
text manipulation. PHP is an excellent alternative to such similar programming solutions as
Microsoft’s proprietary scripting engine ASP and Allayer’s rather expensive Cold fusion. As
mentioned before, PHP is a cross-platform language.

Finally, PHP is easy. If you know C or Perl, learning PHP is a cinch. The language is a mix
between the two, taking the best features from both. Plus, PHP adds features to solve
common problems that programmers often encounter when programming for the web.

2.2 Scope and Objectives

The objective of the web development is to handle the entire activity of a website. The
software keeps track of all the information about the entire website. The system contains
database where all the information will be stored safely.

2.2.1 To save the time and resources

The website system will take less time in entering the data, processing it and getting its
output. Fewer resources will be used as no large registers, files, ledgers, pens; correctors will
be needed or used.

Dept. of ISE, AMCEC 2018-19 Page 5

WEB DEVELOPMENT

2.2.2 To reduce the number of workers

After the system will be computerized only a single computer operator will be needed to
operate the system while now more than one workers work in the system.

2.2.3 To reduce the space being used

Every data will be stored in the computer memory whereas now it is stored in registers and
files which then stored in bookshelves or cupboards and they need a large space.

2.2.4 To reduce the work load

As the new system will be computerized, the database will be automatically updated at the
time of entry. Everything will be done automatically just by clicking few buttons. There will
be no need to maintain any files or registers.

2.2.5 To make it easy to search any record

It will be much easier to find particular record rather than opening such huge files and finding
a single record from them.

2.2.6 To edit records and update the database easily

Records will be easily edited and the database will easily be updated at the time of entering a
record.

2.2.7 To make the system user friendly

The system will be much more easy to use and the operator will feel no difficulty.

1.3 Motivation
In desktop base website creating system is easy to understand. Since I accept Internship it
seems to me I am beginner and primary level to learn web development, so it is easy and
interested to learn and create. Further this project is related of student and I am introducing to
its circumstances so it service technology is under of the understand mine. Its technology is
so interested and charming and easy to build a project by fully PHP, HTML, CSS, MYSQL.

Dept. of ISE, AMCEC 2018-19 Page 6

WEB DEVELOPMENT

CHAPTER 3
TASK PERFORMED
3.1 Training Attended
There are more attendant and requirement is need to build a project we know that, we can
mix all language like C++, C#, HTML, PHP, JavaScript, and more. The web server combines
the results of the interpreted and executed PHP code, which may be any type of data,
including images, with the generated web page. PHP code may also be executed with a
command-line interface(CLI) and can be used to implement standalone graphical
applications.
Those training I was attending in Insight Bangladesh Foundation are given below:
 HTML4, HTML5
 CSS2, CSS3
 Bootstrap
 JavaScript
 JQuery
 Ajax
 PHP
 OOP
 MySQL

3.2 Assigned Responsibilities:

Regular exposure to business stakeholders and executive management, as well as the
authority and scope to apply your expertise to many interesting technical problems.

Candidate must have a strong understanding of UI, cross-browser compatibility, general web
functions and standards. The position requires constant communication with colleagues.

Dept. of ISE, AMCEC 2018-19 Page 7

WEB DEVELOPMENT

3.3 Work Environment

Front end Developer The front end developer generally works at client side dealing with the
web page design, graphics that is accessible to the user.

Back end Developer The back end developer is a person who is responsible for the back end
development that interacts with the server. This type of web developer specializes in the
languages like PHP, ruby, ASP.Net, Java, Cold Fusion, and Perl
The job profiles for the web developer includes:
 front end web developer.
 back end web developer.
 web application developer.
 Design and layout analyst.
 Senior web analyst.
 Web marketing analyst.

3.3.1 Using Web Development Project Templates

A website template (or web template) is a pre-designed webpage, or set of HTML web pages
that anyone can use to "plug-in" their own text content and images into to create a website.
Usually built with HTML and CSS code, website templates allow anyone to setup a website
without having to hire a professional web developer or designer, although, many developers
do use website templates to create sites for their clients. This allows anyone to build a
reasonably priced personal or business website that can then be listed in search engines so
users can search for your specific product or service.

In the case of All website templates, each design we offer is a self-contained (or standalone)
downloadable complete website that you can use to "plug-in" your text and image content
with little, or no, editing of the layout or design elements.
A web design template or a website design template is a template which is in most cases used
to present some information in the Internet. A web design template is a catchall name for
several types of templates like:
– HTML templates – website design templates represented with HTML code only
– PSD templates – templates which contain only .psd files, graphics only, with no code
– Flash templates – website design templates developed with Flash

Dept. of ISE, AMCEC 2018-19 Page 8

WEB DEVELOPMENT

– Flash intro templates – templates of an intro clip, developed with Flash only, used to
represent a company or/and a project.
The list above contains the main categories of templates associated with website design
templates. There are some others, which, due to their specific usage, are not so popular:
FrontPage templates, Dreamweaver templates, etc.

3.3.2 Web framework

In general, a framework is a real or conceptual structure intended to serve as a support or
guide for the building of something that expands the structure into something useful. In
computer systems, a framework is often a layered structure indicating what kind of programs
can or should be built and how they would interrelate. Some computer system frameworks
also include actual programs, specify programming interfaces, or offer programming tools for
using the frameworks. A framework may be for a set of functions within a system and how
they interrelate; the layers of an operating system; the layers of an application subsystem;
how communication should be standardized at some level of a network; and so forth. A
framework is generally more comprehensive than a protocol and more prescriptive than a
structure .
Examples of frameworks that are currently used or offered by standards bodies or companies
include:
Resource Description Framework, a set of rules from the World Wide Web Consortium for
how to describe any Internet resource such as a Web site and its content.
 Internet Business Framework, a group of programs that form the technological basis for
my SAP product from SAP, the German company that markets an enterprise resource
management line of products
 Sender Policy Framework, a defined approach and programming for making e-mail more
secure
 Zach man framework, a logical structure intended to provide a comprehensive
representation of an information technology enterprise that is independent of the tools and
methods used in any particular IT business.

Dept. of ISE, AMCEC 2018-19 Page 9

WEB DEVELOPMENT

3.4 Performed Tasks

Project name is Design and Implementation of E-Commerce Site for Online Shopping. An
online store is a virtual store on the Internet where customers can browse the catalog and
select products of interest. The selected items may be collected in a shopping cart. At
checkout time, the items in the shopping cart will be presented as an order. At that time, more
information will be needed to complete the transaction. Usually, the customer will be asked
to fill or select a billing address, a shipping address, a shipping option, and payment
information such as credit card number. An e-mail notification is sent to the customer as soon
as the order is placed [4]. Web Pages details
 Home Page
 About Us Page
 Product Page
 Order Us Page
 Contact Us Page
 Admin Page
 Login Page
 Register Page
 Track
Home Page: Home Screen will consist of screen were one can browse through the products
which we have on our website.

Fig no 1 Main page

Dept. of ISE, AMCEC 2018-19 Page 10

WEB DEVELOPMENT

Product Page This page consists of product details. This page appears same for both visitors
and users.

Fig no 2 Product page

Order Us Page: Registered users can order desired products from here.

Fig no 3 Order Page

Dept. of ISE, AMCEC 2018-19 Page 11

WEB DEVELOPMENT

Login Page: Login page for both users and administrators

Fig no 4 Login page

Register Page: New users can register here.

Fig no 5 Register page

Dept. of ISE, AMCEC 2018-19 Page 12

WEB DEVELOPMENT

CHAPTER 4
INTERNSHIP OUTCOMES
4.1 Problems and Solutions
There are more problems web development because it contains more type markup language,
methods, objects, modifiers, and many ways to create code or project. And there are not only
problems in web development have more solution which can be easily and shortly.

4.1.1 Problems
There are more problems to create when I working with CSS. It is very easy but sometimes
it’s not matched with my expectation, and placed in appropriate place. Web designing is not
an easy task.
It takes a lot of creativity, uniqueness and brainstorming sessions to come up with a nice web
design. Only a web designer can tell about the challenges they go through on regular basis.
Web designs which are liked and appreciated by target market and clients are mostly the
result of constant development and regressive critical thinking. Website’s sync with multiple
apps along with its ability to be responsive are just a few factors which are pondered by the
web designer.
This makes web designing a challenging role. On the contrary, there are some other
challenges which are faced by web designers. These challenges are about keeping a website
responsive enough so that it can be viewed and accessed on all devices. Sometimes websites
take time to load, so in order to provide a better user experience, one of the toughest
challenges for web design is to make website load faster [9].
Clients often encounter issues with their website and turn to the designer/developer to correct
them, but when they check the site, it looks fine from their end. Sometimes, these issues are
caused by out-of-date web servers or changes made incorrectly by the customer. Time spent
detecting the source of a problem means a delay in tackling the problem itself.

4.1.2 Solutions
Really web development is so best and ultimate interested and hard for me, by the internship
training I could learn an understand many objectives with interest as if was hard after learn I
can understand web development is so interested then other language

Dept. of ISE, AMCEC 2018-19 Page 13

WEB DEVELOPMENT

I did solution of CSS and other problem in my training period. Clean code reduces
unexpected errors, which can affect page load. Automated website monitoring solutions often
allow the developers to view their clients’ websites in real time and to set alerts to notify
them when potential issues begin to arise. Not only does this allow the developers to identify
a problem before the customer does, in many cases it also gives them the chance to fix it
before the issue has any impact on the client’s business.

4.2 Learning Outcomes

4.2.1 HTML
 Basic concept (WWW& HTTP, HTTPS, Client Server Communication)
 Basic HTML (Tags, Element, Attributes, Paragraphs, Headings, Line Breaks,
Horizontal Rule, Lists, Table, Color Codes, Font, Text Linking, Email, Images,
Background, Comments, Meta, Media, Charset)
 HTML Forms (Input, Text Fields, Password, Checkbox, Combo Box, Radio, Text
Areas, Files, Buttons)
 HTML5 features

4.2.2 CSS
 Basic CSS (selector, internal, external, Inline, Class, Id, Background, font, Text,
Padding, Margin, Border, list CSS, hovering and elements)
 Advance CSS (border-radius, opacity, cursor, layers, position, display, float, gradient,
and multiple-column)
 Concept of Menus (single menu, dropdown menu)
 Template, design using CSS div.

4.2.3 Bootstrap
 Environment Setup
 Grid System
 Typography
 Tables, Forms, Buttons, Images
 Dropdown, Button group
 Navigation Element

Dept. of ISE, AMCEC 2018-19 Page 14

WEB DEVELOPMENT

 Bootstrap plug-ins (Transition, Modal, Dropdown, Tab, Tooltip, Alert, Button)

4.2.4 JavaScript
 Basic JavaScript (Syntax, Enable, Location, Operators, Variables, Events, Alert,
Confirm, Prompt, POP up, Date, print)
 JavaScript String (Strings, Length, Split, Search, Replace)
 JavaScript advanced (get Element by Id, Inner HTML, Get table, index, DOM,
manipulation, Regular Expression)
4.2.5 PHP BASIC
 Control Structures (if, else, else if, while, do-while, for, for each, break, continue,
switch)  Include (require, include, require_ once, include_ once)
 Function (User-defined Function, Function arguments, returning values, variables
function)
 Array (array declaration, merging, sorting, deleting, inserting)

4.2.6 Date & Time Function

 What is timestamp?
 Getting the current Date and Time using PHP function.
 Formatting timestamp.
 Checking date validity.
 Converting String to timestamps.
 Finding the number of Days in a month.
 Finding the number of Days or week in a year.
 Finding the day name for a date.
 Converting local time to GMT. .
 Converting Dates, Minutes to hours.

4.2.7 Number Functions

 Generating a Number Range.
 Rounding a floating point number.
 Finding the Smallest or largest number in an array.
 Formatting Numbers with commas.
 Padding Numbers with Zeroes.

Dept. of ISE, AMCEC 2018-19 Page 15

WEB DEVELOPMENT

 Converting Between Bases.

 Generating Random Numbers.

4.2.8 Forms, Session, Cookie, Rag Expression

 Generating forms.
 Processing form input.
 Validating form input.
 Validating numbers.
 Validating Alphabetic strings.
 Validating Alphanumeric String.
 Validating credit card numbers.
 Validating Telephone Number.
 Sharing Session Data Storing objects in a session.
 Protecting Data with session.
 Deleting Session data.
 Validating Email address

4.3 Challenges
There are different types of challenges have to be faces during the software develop. Most
commonly:
 Syntax error.
 Fatal error.
 Find out the problem and try to solve that.

Dept. of ISE, AMCEC 2018-19 Page 16

WEB DEVELOPMENT

CHAPTER 5
CONCLUSION AND FUTURE SCOPE
5.1 Discussion
The current work is the initial background report for the website development project. This
report aims to provide a critical review of the relevant literature in the web field and also to
describe key aspects of the methodology that will be applied throughout the project. This
report tries to examine various issues that arise while building a website.
It is important to highlight, that websites are not simple software artifacts. Mastering the
necessary software skills and tools to build a website does not guarantee its success. For this
reason, following the guidance and the advice of my supervising professor, this report
focuses on many other challenges that come up through the development process, like
performing website evaluation, conducting market research and choosing the right business
model for the website proposal.
These are the first and most crucial steps that will ensure that the final IT employment
website, will be developed according to the requirements of the market and will be tailored to
the needs of its users. Further research and more focus will be given on software tools after
these parts of the methodology are complete and will be presented in later stages of the
project.
The decisions on how the website will be build depend on the results of the problem
investigation stage, since they will play a major role into describing the specific user
requirements for the software. The decision will be based on evaluating case studies of
website development, in order to examine a vast variety of techniques and software tools that
have been applied successfully in real projects.
Furthermore, further research will be conducted to spot the strong points of various
techniques and justify the choice that will be finally made. Finally, an attempt will be made to
contact some experienced web developers and ideally some web developers who have
worked on similar projects, in order to absorb valuable knowledge from their experience.

Dept. of ISE, AMCEC 2018-19 Page 17

WEB DEVELOPMENT

5.2 Conclusion

As a conclusion, I can say that this internship was a great experience. Thanks to this project, I
acquired deeper knowledge concerning my technical skills but I also personally benefited.
Currently PHP pages are a common part of web applications, and one of the most popular
language for web development used by developers worldwide. If we surf internet we can see
millions of websites built with PHP and MYSQL.

I learn to live in a different environment from the one I am used to. Indeed, I grew more
independent in work and also in everyday life. I realized that I could do more things than I
thought like learning new things by myself. There are huge opportunities available for the
students who want to work in this field. Many private and public organizations hire web
designer for their online work and website development. With the rapid advent of online
industry, the demand of web development professionals is increasing and this has created a
huge job opportunity for the aspirants in the upcoming days.

Also an experienced person in this field can also work as a freelancer; there are many online
companies which provide online projects to the individuals.

5.3 Future Scopes

Especially if I don't have any experience. Finding work can be a real challenge. A successful
internship can help me turn an experience into a career opportunity. So as a successful
internship my future scopes will be:

 To be work IT company.
 Can work as a Software Engineer.
 Can work as a Web Designer.
 Can work as a Web Developer
 Can work as a QA Tester

Dept. of ISE, AMCEC 2018-19 Page 18

WEB DEVELOPMENT

REFERENCE
[1] www.quora.com https://www.quora.com/topic/What-Are-Benefits-of-a-Developers-How-
goodAre-Opportunities-in-the-current-market, Last Accessed on 2 April, 2018

[2] www.mage-people.com http://www.mage-people.com Last Accessed on 2 April, 2018

[3] www.onetonline.org https://www.onetonline.org/link/details/15-1134.00?redir=15-

1099.04Last Accessed on 5 April, 2018

[4] www.fashions-first.com http://www.fashions-first.com Last Accessed on 5 April, 2018

[5] www.bls.gov http://www.bls.gov/ooh/computer-and-information-

technology/webdevelopers.html Last Accessed on 5 April, 2018

[6] money.usnews.com http://money.usnews.com/careers/best-jobs/web-developer Last

Accessed 7 April, 2018

[7] www.maxproit.net http://www.maxproit.net/index.php/home_controll Last Accessed on 7

April, 2018

[8] www.sinclair.edu https://www.sinclair.edu/program/params/programCode/WEDE-S-AAS

Last Accessed on 8 April, 2018

[9] www.mindtools.com https://www.mindtools.com/pages/article/worksheetsindex.htm Last

Accessed on 8 April, 2018

Dept. of ISE, AMCEC 2018-19 Page 19

WEB DEVELOPMENT

APPENDIX
SAMPLE CODES
INDEX PAGE
<!DOCTYPE html>
<html>
<head>
<title>Lifestyle Store</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="index.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" class="navbar-brand">Lifestyle store</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><a href="signup.html"><span class="glyphicon glyphicon-
user"></span>Sign Up</a></li>
<li><a href="login.html"><span class="glyphicon glyphicon-log-
in"></span>Login</a></li>

Dept. of ISE, AMCEC 2018-19 Page 20

WEB DEVELOPMENT

</ul>
</div>
</div>
</nav>
<div id="banner_image">
<div class="container">
<div id="banner_content">
<h1>We sell lifestyle.</h1>
<p>Flat 40% OFF on premium brands</p>
<a class="btn btn-danger btn-lg active" href="products.html">Shop Now</a>
</div>
</div>
</div>
<footer>
<div class="container">
<center><p>Copyright © Lifestyle Store. All Rights Reserved | Contact Us:
+91 90000 00000</p></center>
</div>
</footer>
</body>
</html>

SIGNUP PAGE

<!DOCTYPE html>
<html>
<head>
<title>signup page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Dept. of ISE, AMCEC 2018-19 Page 21

WEB DEVELOPMENT

<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="index.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" class="navbar-brand">Lifestyle store</a>
</div>

<div class="collapse navbar-collapse" id="myNavbar">

<ul class="nav navbar-nav navbar-right">
<li><a href="signup.html"><span class="glyphicon glyphicon-
user"></span>Sign Up</a></li>
<li><a href="login.html"><span class="glyphicon glyphicon-log-
in"></span>Login</a></li>
</ul>
</div>
</div>
</nav><br>
<div class="container">
<div class="row row_style">
<div class="col-xs-4">
<h1>Sign Up Form</h1>
<form>
<input type="text" class="form classes form-group form-control"
name="name" placeholder="Name"><br>

Dept. of ISE, AMCEC 2018-19 Page 22

WEB DEVELOPMENT

<input type="email" class="form classes form-group form-control"

name="email" placeholder="Email"><br>
<input type="text" class="form classes form-group form-control"
name="password" placeholder="Password"><br>
<input type="text" class="form classes form-group form-control"
name="contact" placeholder="Contact"><br>
<input type="text" class="form classes form-group form-control"
name="city" placeholder="City"><br>
<input type="text" class="form classes form-group form-control"
name="address" placeholder="address"><br>
<input type="submit" value="Submit" class="btn and btn-primary">
</form>
</div>
</div>
</div>
<footer>
<div class="container">
<center><p>Copyright © Lifestyle Store. All Rights Reserved | Contact Us:
+91 90000 00000</p></center>
</div>
</footer>
</body>
</html>

LOGIN PAGE
<!DOCTYPE html>
<html>
<head>
<title>login </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Dept. of ISE, AMCEC 2018-19 Page 23

WEB DEVELOPMENT

<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="index.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" class="navbar-brand">Lifestyle store</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><a href="signup.html"><span class="glyphicon glyphicon-
user"></span>Sign Up</a></li>
<li><a href="products.html"><span class="glyphicon glyphicon-log-
in"></span>Login</a></li>
</ul>
</div>
</div>
</nav><br>
<div class="container">
<div class="row row_style">
<div class="col-xs-4">
<div class="panel panel-primary">
<div class="panel-heading">
<h1>Login Form</h1>
</div>
<div class="panel-body">

Dept. of ISE, AMCEC 2018-19 Page 24

WEB DEVELOPMENT

<p class="text-warning">Login to make a purchase</p>

<form method="post" >
Email: <input type="email" class="form classes form-group form-
control" name="email"><br><br>
Password: <input type="text" class="form classes form-group form-
control" name="password"><br><br>
<a class="btn btn-primary btnblock "
href="products.html">Submit</a>
</form>
</div>
<div class="panel-footer">Don't have an account? Register</div>
</div>
</div>
</div>
</div>
<footer>
<div class="container">
<center><p>Copyright © Lifestyle Store. All Rights Reserved | Contact Us: +91
90000 00000</p></center>
</div>
</footer>

</body>
</html>

Dept. of ISE, AMCEC 2018-19 Page 25