A

Minor Project Report

ON

E-commerce Mobile Website

For the partial fulfilment of the award of

Degree of Bachelor of Technology

Computer Science & Engineering

Under the Guidance of :Submitted By:

Mrs.Seema Sharma
(Assistant Professor) Swastik Goyal
(16BCON128)
Pankaj Sharma
(16BCON532)
Kapil Jain
(16BCON627)

Department of Computer Science & Engineering

JECRC UNIVERSITY, JAIPUR -2019

 CANDIDATE’S DECLARATION

We hereby declare that the project work, which is being presented in the Project
Report, entitled, E-Commerce Site, in partial fulfilment for the award of Degree
of Bachelor of Technology in Computer Science, JECRC University, is a record
of our own investigations carried under the Guidance of Mrs.Seema Sharma.We
have not submitted the matter presented in this Project Report anywhere for the
award of any other Degree.

Name of Candidates: Pankaj Sharma(16BCON532)

Swastik Goyal(16BCON128)
Kapil Jain(16BCON627)

Signature:

Name of Supervisor/Guide:

Mrs. Seema Sharma

Countersigned By:
HoD-IT&CS
 INDEX

S.No. Topic Pg.No.

1 Introduction
2 System Analysis
a. Working
b.Requirement
c.Feasibility study
d.Methodology
e.Future purpose
3 System design
a.Flow diagram
b.Source code
c.Processed output
4 Testing & Implementation
5 Application of the project
6 Advantages & Disadvantages
7 Conclusion
8 Bibliography
 ACKNOWLEDGEMENT

First of all, I would like to express my gratitude towards JECRC UNIVERSITY, jaipur, for
providing me a platform to present my seminar at such an esteemed institute.

I would like to thank (Prof.) Dr. Naveen Hemrajani, HOD, Computer Science & Engineer-
ing Department , JECRC University, jaipur, for their constant support.

I am also thankful to all the staff members of the department for their full cooperation
and help.

Candidate’s Name : Swastik Goyal

Enrolment Number:
16BCON128
 INTRODUCTION

An eCommerce website is an information technology method in which trader,

businesses/distributor/marketers can sell products/services and the customer can
purchase on that website electronically by using internet on the mobile and com-
puter. It means an e-commerce website is an online shop. e means electronic.
Commerce mean business. Website means the group of HTML web pages and
that is created to market/sell information/product/services.

In a bigger perspective, every website on the internet is the eCommerce Website.

It can be the platform, it can be a marketplace, it can be portal, it can be apps, it
can be an entertainment website, shopping website, online courses website and
online degree college.

Examples of Ecommerce Website and business:

 When you purchase a mobile phone /shoes/software/ flowers on any web-
site such as Amazon, Flipkart etc. and pay through credit/debit card and
then seller deliver the product through courier or post mail on your loca-
tion then it’s called e-commerce. In this case, Flipkart is an online store
website or an e-commerce website.

 When you subscribe to watch a cricket match, movies, and shows on any
website such as hotstar through debit card and credit card it is called e-
commerce. And in this way, hotstar is a digital and mobile entertainment
e-commerce website.

 When you rent or buy movies on YouTube and pay to watch by using the
mobile/computer and internet it’s called e-commerce. In this method, you
have used computer/mobile and internet through electricity and visited
 youtube website to watch/buy/rent the movie and paid through debit
card/credit card/ net banking/payment wallet etc. It means youtube is an
eCommerce website in which you can buy/watch/rent the latest movies
and shows.
 When you use Google Ads or Facebook Advertising etc. to promote and
advertise your products/services online and pay Google and Facebook to
use the services and platforms then it’s e-commerce. In this case Google /
Facebook etc. are e-commerce companies that provide you platform and
tools to advertise and promote your business/products/services online.
 When you launch your apps on the Google Play store, you pay Google to
use their platform to connect with your customers/target audience then it’s
e-commerce and google play store is an eCommerce platform in which
apps developer or apps launcher or owners have to pay Google. And all
these transactions are online. It’s e-commerce.
 When you recharge your mobile phone/dish tv/internet data pack by using

the internet and the website such as paytm, mobiwiki, JIO etc. and pay
through debit/credit card, wallet, and net banking then it’s e-commerce and
PayTM, Mobiwiki, Jio apps or websites are e-commerce websites. In
which they are doing customers recharge online and getting paid directly
to their bank account.

 When you purchase software as a service, platform as a service, infrastruc-

ture as service for your business from cloud computing service providers
such as Alibaba, Amazon web service, Microsoft, google cloud etc. on
their website then these are the e-commerce websites.
 When you use internet banking then it is e-commerce. You pay bills, trans-
fer money, open RD/FD account, pay installments online, pay for offline
products from payment wallets etc. are e-commerce.
 When political parties, government or non-government organizations re-
ceived funds or donations online then it is e-commerce.

Examples of e-commerce website:

 While there are every website is an e-commerce website and platform.

But following are well known or those are considered e-commerce
websites.
 Amazon
 Flipkart
 Shopclues
  ajio.com

Etc. For me, every website is an e-commerce website and platform on the
Internet. And even the rise of the internet is only because of e-
commerce. It’s impossible to imagine the internet without e-commerce. E-
Commerce is the main source of wealth for internet companies and online
business. If there is no commerce then there is no internet.

How E-commerce Websites Works:

Almost all E-Commerce website works similarly. Following is the process of e-
commerce website/eCommerce business/online transactions.
Internet – Connecting the people through computers/mobiles and internet.

User – Searching on Google and other search engines for products/services and
daily life solutions.

Website – After search or research user visits the website that is in top 10 search
results.

Products / Services – User (customer) find the product and select it and add it to
cart.

Purchased – Now user purchases it through debit and credit card by using third-
party payment gateway such as ccavenue, payubiz etc.

Payment Gateway – (Payment Gateway, Merchant Accounts, and Online

Credit Card Processing Service provider) – Received the payment and trans-
fer it into website owner or sellers accounts after 1 week or later.

Bank Account – Customer can pay using the debit/credit card and net bank-
ing/merchant receive money in the bank account from payment gateway service
provider.
 Delivery – on spot, While many deliver the product within 8 days after receiv-
ing the payment. Some only receive cash on the delivery.
The above are general explanations of the e-commerce website and online store.
If you want technical part then please comment. I will cover it in the next article.
Here you can learn more technical parts:

Economic benefits:
 Banks earning the money due to the increased use of debit/credit cards.
 The government can use that money for the development of own machinery or
citizens development.
Business benefits:
 Less costly to sell products and services.
 Wide variety of customers on the internet than offline store/shop.
 No credits or Udhar
 Easy to manage transactions
 Easy to market/sell
Consumer Benefits:
 Getting product/service at door.
 Saves time
 Less costly than offline
 To showcase modernism
Who can start ecommerce store: Anyone can start or build an ecommerce web-
site. Shopkeepers, handmade items manufactures, small and medium domestic
product manufacturers etc.
Business Scope: Unlimited. More than half of the population on the earth is on
the Internet intentionally and unintentionally. People are looking for the best
quality and organic products, they want to feel vow at less cost without wasting
time on offline shopping. So if someone think that they can sell online or have
any thing that people needs then they can start.
Job scope: E Commerce created and increasing the Information Technology re-
lated jobs scopes worldwide. More and more people trying to build and run an
online store and due to that there is a demand for the following experts:
 Ecommerce or online store builder or ecommerce website designer
 Content writer to write product description and website content.
 Search Engine Optimizer to rank the website higher on the google.
 Graphics Designer to create high quality images.
 Digital Marketer who handle or manage from search engine marketing, social
media marketing and video marketing etc.
 Data analyst who can help ecommerce store owner to make a decision based on
customer behaviour and data analytics. Such as what kind of products they can
sell more, which page on the ecommerce website need to update, what customers
are looking for and which landing page is working better than other.

Types :-
Types of E-Commerce
Divulging the types of e-commerce requires throwing some light on the narrow
line of distinction between e-commerce and e-business on the first hand. While e-
commerce uses ICT in making inter-business, inter-organizational and business-
to-consumer transactions, e-business is a broader term and uses technology in
enhancing one’s business. It concentrates on adding customer value by using dig-
ital media.
E-Commerce can be classified into the following categories:

 B2B e-commerce - B2B or business-to-business is the type of e-commerce

in which the trading takes place between two businesses or organiza-
tions/companies without the involvement of consumer. The product may
then be sold to the consumer by any of the organization under its brand
name. For example, a car manufacturer may purchase some of its accesso-
ries from another company and then sell the finished product to its cus-
tomers. Another, direct specimen is HP and Intel. HP computers are inte-
grated with processors made by Intel. A majority of such deals occurs over
the internet. A lot of revenue in e-commerce is garnered from B2B type of
internet commerce.

 B2C e-commerce - In recent times, B2C or business-to-consumer e-

commerce has grown into the most popular and prolific form of online
trade. It is commerce between businesses and consumers. It is more com-
monly known as online retailing and involves customers purchasing goods
and services online. Amazon.com, Dell computers, Drugstore.com, Trave-
locity, etc are some of the flourishing examples of B2C e-commerce. B2C
e-commerce has facilitated a click and drag online store in place of the
conventional brick and mortar retailing stores. It has reduced transaction
costs by increasing consumers’ access to information thereby easing the
whole procedure of buying and selling goods and services. Consumers can
now easily compare various features offered by different brands over the
same product and add genuineness to their decision. In addition to this, we
also have some good online reviewers like rotten tomatoes, top10reviews,
etc, that provides online reviews for various products and services and
helps consumers in making a best buy both online as well as offline.
  B2G e-commerce - B2G stands for business-to-government e-commerce.
When the commerce takes place between companies and some govern-
ment organization, it is called as business-to-government commerce. These
types of transactions are usually undertaken in public interest in order to
make the system more transparent and fidel.

 C2C e-commerce - Consumer-to-consumer commerce is the trade be-

tween two consumers or private individuals. C2C transactions bear an
analogy with the traditional trading methods corresponding to classified
ads, auctions and other vertical industries. Popular websites facilitating
C2C e-commerce are eBay, BaZee.com, Napster, etc. The consumer com-
merce over online bazaar helps buyers to negotiate and buy at a selective
price.

 M-commerce - M-commerce or mobile commerce is the budding area of

digital commerce which uses wireless technology for online trading. Cellu-
lar telephones, tablets, personal digital assistants and other handheld de-
vices are used for m-commerce. This imminent source of electronic com-
merce facilitates a faster, cheaper, easily accessible and more secure meth-
od for exchange of goods and services. Mobile commerce has stimulated
other useful applications such as mobile/SMS banking, e-recharge, appli-
cation development and many more.

 Framework
 Conceptual Framework
 Internet economy is a broader term which includes both e-commerce and
e-business. There are various elements governing the process of online
trading of goods and services. These elements are classified as different
layers as per the framework given by Center for Research and Electronic
Commerce (CREC) at the University of Texas in the following manner:

 Layer1- Internet and Network Infrastructure

 This layer is facilitated by the companies that provide enabling hardware,

software and networking devices for the internet, internet service providers
(ISPs), fiber optic cable makers, PC manufacturers, etc. Examples for such
providers include CISCO, AT&T, AOL, etc. This layer also deals with the
network framework which establishes an effective connection between the
buyer and the supplier. The network lattice on which the internet works
today is based on packet switching technique. In this technique, the mes-
sage is broken down into small packets. Every packet bears the address of
its source and destination. This way the message enjoys a flexible and
faster medium of communication. These packets are then assembled in or-
 der at the destination computer for ultimate delivery. The internet infra-
structure works under the governance of certain protocols. These set of
rules and regulations are collectively termed as TCP/IP protocol. Here
TCP stands for Transmission Control protocol and IP signify Internet pro-
tocol.

 Layer2- Internet Applications Infrastructure

 This layer is facilitated by companies that design software products for

buyer’s web- interface with the seller. Integrity at this layer enables a se-
cure online transaction. Such companies comprise IBM, Adobe, Oracle,
TCS, etc. These companies provide web development design and consul-
tancy services to various online businesses. It is at this layer where the
type of e-commerce is determined.

 Layer3- Internet Intermediaries

 This layer facilitates the real scenario of e-commerce. It includes compa-

nies that establish links between the buyers and the sellers by creating the
virtual market where the online trading takes place. It interfaces the appli-
cation layer to the users. Interactive catalogs and directory support services
are examples of this layer. While the interactive catalog deals with people,
the directory catalog deal interacts directly with software applications.
Online travel agents like Travelocity; Content Aggregators like Yahoo!
and Google, etc are examples of such intermediaries.

 Layer4- Internet Commerce

 This layer is facilitated by companies that sell products or services directly to

consumers and businesses. These companies include the online retailers or the
E-tailers like Amazon, Dell, eBay, etc.

 Application
 Applications of e-commerce
The development in e-commerce industry has fuelled growth in many other
industries as well in parallel.

 E-banking - E-banking or internet banking is a sophisticated form of

banking which facilitates consumers to make monetary transactions online
using their existing bank accounts, credit cards, debit cards, ATM cards or
stored-value cards. One can view his/her account details, transfer funds,
make payments, and take mini statements for account history. The Elec-
 tronic Payment System (EPS) via e-banking completes the loop of e-
commerce by making payment thereby assuring sellers of the buyers and
vice versa. It facilitates a secure and swift payment gateway for any online
transaction. The huge input and public response for e-commerce has
prompted almost every public and private bank to be visibly active in the
online market also.

 Shipping industry - If there is one industry which stands to gain with the
growing spirit of electronic commerce, its shipping and courier industry
for sure. E-commerce had instigated the establishment and growth of in-
ternational and national shipping firms. FedEx (FDS) and United Parcel
Service (UPS) are two of the major shipping companies responsible for
shipping a large sector of online purchase.

 Electronic Media - Visibly present as newspapers and news channels

round the globe since years, the print media has steadily but beautifully
occupied the digital world with the growth of internet users and internet
economy hence, in recent times. In comparison to the on-paper news, elec-
tronic newspaper can give latest/current news readily available at a click.

 Electronic Auctions - The brick and mortar trading stores have witnessed
an innovative approach for making goods available at a market-negotiated
price; called auction. The internet has added a new dimension to this area
as in E-Auction where buyers and sellers can bid online and trade in a
wide range of products. eBay.com, Olx, and AuctionIndia.com are some of
the popular e-auction websites.
 HTML

Hypertext Markup Language, commonly referred to as HTML, is the

standard markup language used to create web pages. Along with CSS,
and JavaScript, HTML is a cornerstone technology used to create web
pages, as well as to create user interfaces for mobile and web applica-
tions.

Web browsers can read HTML files and render them into visible or audi-
ble web pages. HTML describes the structure of a website semantically
along with cues for presentation, making it a markup language, rather
than programming.

HTML elements form the building blocks of HTML pages. HTML allows
images and other objects to be embedded and it can be used to create interac-
tive forms. It provides a means to create structured documents by denoting
structural semantics for text such as headings, paragraphs, lists, links, quotes
and other items.

HTML elements are delineated by tags, written using angle brackets. Tags
such as <img /> and <input /> introduce content into the page directly. Oth-
ers such as <p>...</p> surround and provide information about document
text and may include other tags as sub-elements. Browsers do not display the
HTML tags but use them to interpret the content of the page.
 CSS

Cascading Style Sheets (CSS) is a style sheet language used for describ-
ing the presentation of a document written in a markup language.

Although most often used to set the visual style of web pages and user
interfaces written in HTML and XHTML, the language can be applied to
any XML document, including plain XML, SVG, and XUL, and is appli-
cable to rendering in speech, or on other media. Along with HTML and
JavaScript, CSS is a cornerstone technology used by most websites to
create visually engaging webpages, user interfaces for web applications,
and user interfaces for many mobile applications.

CSS is designed primarily to enable the separation of document content

from document presentation, including aspects such as the layout, colors,
and fonts. This separation can improve content accessibility, provide
more flexibility and control in the specification of presentation character-
istics, enable multiple HTML pages to share formatting by specifying the
relevant CSS in a separate .css file and reduce complexity and repetition
in the structural content.
 JavaScript

JavaScript is a very powerful client-side scripting language. JavaScript is used

mainly for enhancing the interaction of a user with the webpage. In other words,
you can make your webpage more lively and interactive, with the help of JavaS-
cript. JavaScript is also being used widely in game development
and Mobile application development.

Being a scripting language, JavaScript cannot run on its own. In fact, the browser
is responsible for running JavaScript code. When a user requests an HTML page
with JavaScript in it, the script is sent to the browser and it is up to the browser to
execute it. The main advantage of JavaScript is that all modern web browsers
supportJavaScript. So, you do not have to worry about whether your site visitor
uses Internet Explorer, Google Chrome, Firefox or any other browser. JavaScript
will be supported. Also, JavaScript runs on any operating system including Win-
dows, Linux or Mac. Thus, JavaScript overcomes the main disadvantages
of VBScript (Now deprecated) which is limited to just IE and Windows.

You should place all your JavaScript code within <script> tags (<script> and
</script>) if you are keeping your JavaScript code within the HTML document
itself. This helps your browser distinguish your JavaScript code from the rest of
the code. As there are other client-side scripting languages (Example: VBScript),
it is highly recommended that you specify the scripting language you use.
 USER CHARACTERISTICS

End Users

All specific knowledge or skills are required from the feeder.

Educational level: Users should be comfortable with the English language.

Experience: Users should have prior information regarding online examinations.

Skills: Users should have basic knowledge and should be comfortable

Administrator

The administrator must be capable to manage user rights.

This system will not take care of any virus problem, which might occur either on
the Client or the server system. Avoiding the use of pirated software and ensur-
ing that floppies and other removable media are scanned for viruses before use
could minimize the possibility of viral infection.

Constraints

 The Information of all users, subjects, and allocations must be stored in a

database that is accessible by every connected system.
 MySQL used for the database.
 Users may access from any system connected to the online database. Us-
ers must have their correct usernames and passwords to enter into their
accounts.
Product Functions

The website will allow access only to authorized users with specific roles (Ad-
ministrator- maintains the website, Institutes-Register the students, Students-
Fills the details).

Following are the System Functions:

Student role
On the examination form, the student should enter all their detail such as their
name, numbers, Email, and contact number, subjects, semester, etc.

Administration role
The system administrator must be able to: deactivate and reactivate student ac-
count login, update, insert and delete details.

Assumptions and Dependencies

 Software needs the following third-party products-

 Sublime text editor for the development of the project.
 WAMP for database connectivity.
 Although basic password authentication and role-based security mecha-
nisms will be used to protect OPMS from unauthorized access; function-
ality such as email notifications are assumed to be sufficiently protected
under the existing security policies applied by the University network
team. Redundant Database is set up as the role of backup Database Server
when the primary database is a failure.
 SOFTWARE REQUIREMENT SPECIFICATIONS

This section provides software requirements to a level of detail sufficient to en-

able designers to design the system and testers to test the system.

This section contains all of the functional and quality requirements of the sys-
tem. It gives a detailed description of the system and all its features.

Requirement Specification (SRS)

The following subsections of the SRS document provide an overview of the En-
tire SRS.

Purpose: The purpose of the project is to provide online student registration.

Scope: The website display student information of registered students

Benefits: This website reduces manual work, maintaining accuracy, increasing

External Interface Requirements:

This section provides a detailed description of all inputs into and outputs from
the system. It also gives a description of the hardware, software and communi-
cation interfaces and provides basic prototypes of the user interface. User Inter-
faces:
Functional Requirements

 It deals with the functionalities required from the system which are as fol-
lows:
 The website will help the colleges/organizations/companies to conduct their
student registration
 Only authorized person can access related details.
 The administrator will be responsible for updating the site.

Performance Requirements

This subsection specifies numerical requirements placed on the software or on

the human interaction with the software, as a whole. Numerical requirements will
include:
only text information will be supported(HTTP)
 CODING PHASE

Home.html

<!DOCTYPE html>
<html>
<head>
<title>HelloMobile</title>
</head>
<link href="style.css" rel="stylesheet" type="text/css">

<body>
<div class="menu">
<nav>
<table>
<tr>
<td><a href=""><img class="image" src="logo2.png" height="50px"
width="50px"></a></td>
<td><a href="">Home</a></td>
<td><a href="file:///G:/HelloMobile/Details.html">Special</a></td>
<td><a href="online.html" id="marketalert">Market</a></td>
<td><a href="contact.html">Contact </a></td>

<style>
input[type=text] {
float:right;
width: 300px;
box-sizing: border-box;
border: 2px solid #ccc;
border-radius: 4px;
font-size: 16px;
background-color: white;
background-position: 10px 10px;
background-repeat: no-repeat;
padding: 12px 20px 16px 40px;
-webkit-transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
}
input[type=text]:focus {
width: 40%;
}
*{
box-sizing: border-box;
}

.column {
float: left;
padding: 22px;
}

/* Clearfix (clear floats) */

.row::after {
content: "";
clear: both;
display: table;
}
img
{
color:inherit;
border:0px;
vertical-align:middle;
}

</style>
<form>
<input type="text" name="search" placeholder="Search..">
</form>
</tr>
</table>
</div>
</nav>
<table width="100%" border="0" border-color="white" cellspacing="0" cellpad-
ding="0">

<tr>

<td width="280" height="40" align="left"><font color="black"

size="5"><span id="date" ></span><span id="greets"></span></font></td>

<td width="605" height="40" align="center" ><span class="style7"><a

href="hello.html"><font-color="green"
size="5">HelloMobile</font></a></span></td>

<td width="20" height="40" align="right" ><span class="login"><a

href="login.html><font-color="orange"
size="5">Login</font></a></span></td>
 <td width="20" height="40" align="right" border-color="black" border-
radius="4" border-sizing="border-box"><span class="login"><a
href="signup.html"><font color="orange"
size="5">Signup</font></a></span></td>
</tr>
</table>
<div class="content">
<img id="slide" src="phone/i7coverfjpg" height="350px" width="100%"
align="center" />
</div>
<div class="text"><h3 id="text">Iphone 7+</h3>
</div>
<div class="row" bgcolor="#cdecf1">
<div class="column">
<a href="Mi Mix 2.html">
<img src="phone/mi a21.jpg" width="400px" height="200px"
align="center">
<center><p>Xiaomi Mi Mix 2</p></center>
<center><p>Coming Soon</p></a></center>
</div>
<div class="column">
<a href="Mi A2.html">
<img src="phone/mi a26.jpg" width="400px" height="200px">
<center><p>Xiaomi Mi A2</p></center>
<center><p> Up to 10% Off</p></a></center>
</div>
<div class="column">
<a href="Note 5 pro.html">
<img src="phone/note 5 pro.jpg" width="400px" height="200px">
<center><p>Xiaomi Redmi Note 5 pro</p></center>
<center><p> Up to 10% Off</p></a></center>
</div>
<div class="column">
<a href="online.html">
<h1 align="center">Best offer</h1>
<img src="phone/mi.jpg" width="400px" height="200px"
align="center"></a>
</div>
<div class="column">
<a href="file:///G:/HelloMobile/apple%20xs.html">
<h1 align="center">Apple Xs</h1>
<img src="phone/apple xs.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href="homepod.html">
<h1 align="center">Redmi Note 5 Pro</h1>
<img src="phone/pro 5.jpg" width="400px" height="200px" align="center">
</div></a>
<div class="column">
<a href="Oneplus6.html">
<h1 align="center">Oneplus 6</h1>
<img src="phone/123.jpg" height="200px" width="400">
</div></a>
<div class="column">
<a href="pixel.html">
<h1 align="center">Google Pixel 2XL</h1>
<img src="phone/P1.jpG" width="400px" height="200px">
</div></a>
<div class="column">
<a href="file:///G:/HelloMobile/Samsung%20Galaxy%20j8.html">
<h1 align="center">Samsung Galaxy j8</h1>
<img src="phone/j8.jpg" width="400px" height="200px">
</div> </a>
<div class="column">
<a href="file:///G:/HelloMobile/samsung%20galaxy%20j6.html">
<h1 align="center">Samsung Galaxy j6</h1>
<img src="phone/j6.jpeg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Nokia 6.1 Plus</h1>
<img src="phone/nokia 6.1.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Nokia 6.1</h1>
<img src="phone/nokia 6.1.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Galaxy Note9</h1>
<img src="phone/galaxy note9.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Galaxy S8+</h1>
<img src="phone/galaxy s8+.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Galaxy S9+</h1>
<img src="phone/galaxy s9+.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href="file:///G:/HelloMobile/oppo%20f9%20pro.html">
<h1 align="center">OPPO F9 Pro</h1>
<img src="phone/oppo f9 pro.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">OPPO A3s</h1>
<img src="phone/oppo a3s.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">OPPO A5</h1>
<img src="phone/oppo a5.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Honor Play</h1>
<img src="phone/ honor play.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Honor 9N</h1>
<img src="phone/honor 9n.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Galaxy Note9</h1>
<img src="phone/galaxy note9.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Vivo NEX</h1>
<img src="phone/vivo nex.jpg" width="400px" height="200px">
</div></a>
<div class="column">
<a href=" ">
<h1 align="center">Galaxy Note9</h1>
<img src="phone/galaxy note9.jpg" width="400px" height="200px">
</div></a>

<hr class="fix">
<div class="footer">
<a href="https://www.facebook.com/" target="_blank"><img
src="logo/fblogo.png" width="50px" height="50px"></img></a>
<a href="https://www.twitter.com/" target="_blank"><img src="logo/tw.png"
width="50px" height="50px"></img></a>
<a href="https://www.instagram.com/" target="_blank"><img
src="logo/inlogo.ico" width="50px" height="50px"></img></a>

<a href="https://www.youtube.com/" target="_blank"><img

src="logo/yulogo.png" width="50px" height="50px"></img></a>
<footer align="center">
<p id="footer1"></p>
<p id="footer2"></p>
<script>
document.getElementById("footer1").innerHTML="Copyrigth @ 2018";
document.getElementById("footer2").innerHTML="HelloMobile";

</script>
</footer>
</div>
</body>
<script src="scripts/validation.js"></script>
<script src="scripts/date.js"></script>
</html>
Buy.js

function checkFormEntry()
{
document.getElementById("errorMessage").innerHTML="";

document.getElementById("successMessage").innerHTML="";

var errors="";
if(document.getElementById("fname").value.length<3)
{
errors +="First name must have 3 Character.<br>";
}

if(document.getElementById("lname").value.length<5)
{
errors +="Last Name must have 5 character <br>";
}

if(document.getElementById("model").value=="")
{
errors +="Please Select a Phone Model.<br>";
}
if(document.getElementById("color").value=="")
{
errors +="Please Choose a Phone Color.<br>";
}
if(document.getElementById("storage").value=="")
{
errors +="Please Select your Phone Storage.<br>";
}
if(document.getElementById("gadgets").value=="")
{
errors +="Please Select a Gadget.<br>";
}
if(document.getElementById("address").value.length<5)
{
errors +="Address must be 5 character.<br>";
}
if(document.getElementById("phone").value.length<10)
{
errors +="Phone Number must contain 10 digit.<br>";
}
if(document.getElementById("amount").value.length<3)
{
 errors +="Amount must be Rs100 to Rs.999.<br>";
}
if(document.getElementById("card").value.length<4)
{
errors +="Please Enter Your 5 Digit Valid Card Number.<br>";
}

if(errors!="")
{
document.getElementById("errorMessage").innerHTML=errors;
}
else{
//document.getElementById("successMessage").innerHTML="You
have successfully signed up Man";
window.location.href="Success.html";
alert("Congratulation You have Buy Our Product. Your Product
Will be Deliver soon!")

}
return false;
}

document.getElementById("form").onsubmit=checkFormEntry;
Signup.js

function checkFormEntry()
{
document.getElementById("errorMessage").innerHTML="";

document.getElementById("successMessage").innerHTML="";

var errors="";
if(document.getElementById("username").value.length<5)
{
errors="The username must be at least 5 Character.<br />";
}

if(document.getElementById("password").value.length<8)
{
alert("Please Type Correct 8 digit Password");
}
if(document.getElementById("password").value.length<8)
{
alert("Please Type Correct 8 digit Password");
 }
if(document.getElementById("phone").value.length<10)
{
alert("Please Provide Your 10 digit Phone number");
}

if(errors!="")
{
document.getElementById("errorMessage").innerHTML=errors;
}
else{
window.location.href="signupsuccess.html";
alert("You have Signup to HelloMobile")
}
return false;
}
document.getElementById("form1").onsubmit=checkFormEntry;
Login.js

var maximum= 3;
function validate(){
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
var err=document.getElementById("error").innerHTML;
//empty field validation
if(username==""){alert("User Name Field is empty");}
if(password==""){alert("Password field is empty");}
//if name and password match
if ( username == "hello" && password == "mobile"){
document.getElementById("error").innerHTML="Log in sucessfull";
window.location = "hello.html";
alert("You have Logged into the Website");
return false;
}
//code for try upto 3 chance then disable username and password field
else{
maximum--;
document.getElementById("error").innerHTML="<br>Invalid
username and password"+"<br>Now You have remaining
"+maximum+" attempt.";
if(maximum== 0){
document.getElementById("username").disabled = true;
document.getElementById("password").disabled = true;
document.getElementById("submit").disabled = true;
return false;}}}
Date.js

var today=new Date();

var ele-
ment=document.getElementById("date").innerHTML=today.toDateString();

var hour=today.getHours();
var greet;
if(hour>=18)
{
greet=" Good Evening";
}
else if(hour>=12)
{
greet=" Good Afternoon";
}
else{
greet=" Good Morning";
}

document.getElementById("greets").innerHTML=greet;
/*
var a=0;
var image-
file=["s8cover.jpg","1+3cover.jpg",'i7cover.jpg','micover.jpg','nokia6cover1.jpg','
xperia.jpg','apple xs.jpg'];
setInterval(imageslider,2000);

function imageslider(){
document.getElementById("slide").src="phone/"+ imagefile[a];
a++;
if (a>5)
{
a=0;
}

var b=0;
var c="Galaxy S8 Infinity Display";
var d="One + Three";
var e="Iphone 7 Plus";
var f=" Xaomi Mi Mix";
var g=" Nokia 6";
var h="Sony Xperia ";
var i="Apple xs";
setInterval(textslider,2000);
var texts=[c,d,e,f,g,h,i];
function textslider(){

document.getElementById("text").innerHTML= texts[b];
b++;
if (b>5)
{
b=0;
}

}
*/
var z=0;
var phone1={
name:"Sony Xperia",
imgfile:"xperia.jpg"
};

var phone2={
name:"Galaxy S8 Infinity Display",
imgfile:"s8cover.jpg"
};
var phone3={
name:"One + Three",
imgfile:"1+3cover.jpg"
};
var phone4={
name:"Iphone 7 Plus",
imgfile:"i7cover.jpg"
};
var phone5={
name:"Nokia 6",
imgfile:"nokia6cover1.jpg"
};
var phone6={
name:"Xaomi MI Mix",
imgfile:"mi a26.jpg"
};
var phone7={
name:"Apple xs",
imgfile:"apple xs.jpg"
};
var phones=[phone1,phone2,phone3,phone4,phone5,phone6,phone7];

setInterval(slider,2000);
function slider(){
document.getElementById("slide").src="phone/" +phones[z].imgfile;
document.getElementById("text").innerHTML=phones[z].name;
z++;
if (z>5)
{
z=0;
}

Market.js

var today=new Date();

var ele-
ment=document.getElementById("date").innerHTML=today.toDateStr
ing();

var hour=today.getHours();
var greet;
if(hour>=18)
{
greet=" Good Evening";
}
else if(hour>=12)
{
greet=" Good Afternoon";
}
else{
greet=" Good Morning";
}

document.getElementById("greets").innerHTML=greet;
/*
var a=0;
var image-
file=["s8cover.jpg","1+3cover.jpg",'i7cover.jpg','micover.jpg','nokia6c
over1.jpg','xperia.jpg','apple xs.jpg'];
setInterval(imageslider,2000);

function imageslider(){
document.getElementById("slide").src="phone/"+ imagefile[a];
a++;
if (a>5)
{
a=0;
}

var b=0;
var c="Galaxy S8 Infinity Display";
var d="One + Three";
var e="Iphone 7 Plus";
var f=" Xaomi Mi Mix";
var g=" Nokia 6";
var h="Sony Xperia ";
var i="Apple xs";
setInterval(textslider,2000);
var texts=[c,d,e,f,g,h,i];
function textslider(){
 document.getElementById("text").innerHTML= texts[b];
b++;
if (b>5)
{
b=0;
}

}
*/
var z=0;
var phone1={
name:"Sony Xperia",
imgfile:"xperia.jpg"
};

var phone2={
name:"Galaxy S8 Infinity Display",
imgfile:"s8cover.jpg"
};
var phone3={
name:"One + Three",
imgfile:"1+3cover.jpg"
};
var phone4={
name:"Iphone 7 Plus",
imgfile:"i7cover.jpg"
};
var phone5={
name:"Nokia 6",
imgfile:"nokia6cover1.jpg"
};
var phone6={
name:"Xaomi MI Mix",
 imgfile:"mi a26.jpg"
};
var phone7={
name:"Apple xs",
imgfile:"apple xs.jpg"
};

var phones=[phone1,phone2,phone3,phone4,phone5,phone6,phone7];

setInterval(slider,2000);
function slider(){
document.getElementById("slide").src="phone/"
+phones[z].imgfile;
document.getElementById("text").innerHTML=phones[z].name;
z++;
if (z>5)
{
z=0;
}

}
Form Design
HOME PAGE
This is the basic layout of how to form will look.