Online Shopping System Undertaken By

Kainat Zahra
Roll No: BSIT-18-34
Session: 2018-2022

Supervised By

Dr. Ahmad Kareem

A DISSERTATION SUBMITTED AS
PARTIAL FULFILLMENT OF REQUIREMENT FOR
THE DEGREE OF BACHELORS IN INFORMATION TECHNOLOGY ()

DEPARTMENT OF INFORMATION TECHNOLOGY

BAHAUDDIN ZAKARIYA UNIVERSITY MULTAN PAKISTAN

1
 DEDICATED TO

My Loving Parents And Teachers Who

Always Encouraged Me To Work Hard And
Guided Me Towards The Right Destination

2
 ACKNOWLEDGMENT

First, I would like to thank ALLAH , the gracious and most beneficent, who brought me up to this
Stage and made me able to accomplish my work with strength to face all problems in the way.
Foremost, thanks to my supervisor Dr. Ahmad Kareem , who gave me good advice during the
process of developing the system. I would like to thank my Family and Friends who helped me a
lot and encouraged me in every desperate moment and enabled me to face the challenges of this
project. I want to express my special thanks to the Department of IT BZU for providing a working
environment and all other facilities that were needed throughout the academic session. Finally, I
submit my profound gratitude, respect and love to all those who provided me with moral support
and constant encouragement throughout the entire study.

Kainat Zahra Roll No. 18-34

Session 2018-2022

3
FINAL APPROVAL

This is to certify that we have read this dissertation entitled "Online Shopping System"
submitted by Kainat Zahra and it is our Judgment that this dissertation is sufficient standard to
warrant its acceptance by Bahauddin Zakariya University Multan, for the degree of BS (IT).

Committee

1. External Examiner

2. Supervisor
Dr. Ahmad Kareem
Department of Information Technology
Bahauddin Zakariya University Multan

3. Head of Department
Dr. Maruf Pasha
Department of Information Technology
Bahauddin Zakariya University Multan

4
PROJECT BRIEF

PROJECT NAME: Online Shopping System UNDERTAKEN BY KAINAT ZAHRA

SUPERVISED BY: Dr. AHMAD KAREEM

COMPUTER USED: Intel(R) Core(TM) i5-2410M CPU @ 2.30GHz 2.30 GHz

SYSTEM MS:Windows 10 64-bit

SOURCE LANGUAGE(S): PHP(Laravel),BOOTSTRAP, HTML, CSS.

DBMS USED: MYSQL

TOOLS USED: Visual Studio Code

SERVER USED: Xampp

5
 ABSTRACT

The title of my project is Online Shopping System. It is the process whereby consumers directly

buy products from a seller in real-time and get information about products, over the Internet. An

online shopping system that permits a customer to submit online orders for items and/or services

from a store that serves both walk-in customers and online customers . The main purpose of

choosing this project is basically the ease and comfort of the users, so they can buy goods easily

online and solve their problems with the help of this web and the other reason is I want to implement

my studies and utilize them in this project. The online shopping system presents an online display

of an order cut off time and an associated delivery window for items selected by the customer. The

system accepts the customer's submission of a purchase order for the item in response to a time of

submission being before the order cut off time. The online shopping system does not settle with a

credit supplier of the customer until the item selected by the customer is picked from inventory

but before it is delivered. Therefore, the customer can go online and make changes to the order. In

addition, available service windows are presented to the customer as a function of customer

selected order and service types and further, the order picking is assigned in accordance with a

picker's preference. When ordering goods, many shopping systems provide a virtual shopping cart

for holding items selected for purchase. Successive items selected for purchase are placed into the

virtual shopping cart until a customer completes their shopping trip. Virtual shopping carts may be

examined at any time, and their contents can be edited or deleted at the option of the customer.

Once the customer decides to submit a purchase order, the customer may print the contents of the

virtual shopping basket in order to obtain a hard copy record of the transaction.

6
 TABLE OF CONTENTS
Contents No.

Chapter 1
Introduction

1.1 Project Introduction ...........................................................................................................................10

1.2 Scope of the Project ............................................................................................................... 11
1.3 Objective of Project ............................................................................................................... 11

Chapter 2

System Analysis

2.1 Introduction of the System………………….……………………………………………………….14

2.1.1 Definition of the System................................................................................................14
2.1.2 Needs of the System...................................................................................................…….14
2.2 System Analysis………………………………………………………………………………………14
2.2.1 System Planning ...................................................................................................................15
2.3 Specification Requirements……………………………….………………………………………….15
2.3.1 Hardware Requirements……………………………………………………………………………..15
2.3.2 Software Requirements…………………………………………………………………………..….16
2.4 Functional & Non-Functional Requirements…………………………………………………………16
2.4.1 Functional Requirements……………………………………………………………….………..….16
2.4.2 Non-Functional Requirements…………………………………………………………….……..17 2.5
Existing System……………………………………………………………………………………….18 2.6
Proposed System…………………………………………………..…………………………….……18 2.7
Comparison of Existing & Proposed System…………………………………………………...……..19

Chapter 3
Feasibility Study
7
3.1 Feasibility Study……………………………………………………………………………………...21
3.1.1Technical Feasibility…………………………………………………………………........................21
3.1.2 Operational Feasibility…………………………………………………………...………………….22
3.1.3 Economical Feasibility………………………………………………………..….……………….…22
3.1.4 Social Feasibility………………………………..……………………………….…………………..23

Chapter 4

System Development

4.1 Introduction to System Development…………………………………………………….…………..25

4.2 Tools / language Selection………………………………………….…………..…………………….25
4.3 Client Side Technology…………………………………………………………………….…………26
4.3.1 Boot Strap……………………………………………………………...…………………….….…..26
4.3.2 JavaScript……………………………………………..……………………………………….…...26
4.3.3 Html 5……………………………………………………..………………………………………..27
4.3.4 CSS……………………………………..………….……………………………………………….27
4.3.5 J Query…………………………………………………………………………………………..….29
4.3.6 Adobe Photoshop……………………..………..…………………………………………………...29
4.4 Server Side Technology…………………………….………………………………………….……..29
4.4.1 PHP..................................................................................................................................................30
4.4.2 MySQL................................................................................................................................. 31

Chapter 5
System Design

5.1 System Design.....................................................................................................................................33

5.2 Features of Proposed System ................................................................................................ 33
5.3 Software Design................................................................................................................................35
5.4 Data Flow Diagram(DFD)...............................................................................................................36

8 of 66
5.5 Visual Modeling Using UML .........................................................................................................39
5.5.1 Activity Diagram.............................................................................................................................39
5.5.2 Use-Case Diagram... .....................................................................................................................42
5.5.3 Sequence Diagram..........................................................................................................................44
8
 Chapter 6
Database Design

6.1 Database Design..................................................................................................................................48

6.2 Database................................................................................................................................ 48
6.2.1 Advantages of Database Design..........................................................................................48

6.2.2 Constraints........................................................................................................................................49
6.2.3Entity………………………………………………………………..…………………………...….49
6.2.4Attribute............................................................................................................................................49
6.2.5Keys…………..................................................................................................................................49
6.3 Database Tables..................................................................................................................................50

Chapter 7
User Interface

7.1 User Interface…………………………………………………………………………………………55

7.2 User Interface Front End……………………………………………………………………..55
References…………..……………………………………………………………………………56

9
 Chapter 1
INTRODUCTION
1.1 Project Introduction

The recent boom in the era of the internet has ensured that all types of services, sales and Products
can be made online. Business has become more efficient for both the business Person and the
customers. It is now fast, accessible from anywhere and anytime. The Project Online Shopping
System is the process whereby consumers directly buy products from a seller in real-time and get
information for ladies clothes,shoes & bags etc, over the Internet. It is a form of electronic
commerce. An online shop, e-shop, e-store, internet shop, web shop, web
store, online store, or virtual store evokes the physical analogy of buying products or services at a
bricks-and-mortar retailer or in a shopping center. Online shopping is the process of buying goods
and services from merchants who sell on the Internet.

Nowadays, online shopping is very popular. Online shopping allows the seller to sell their products
and services without the huge maintenance cost of the management and marketing in the real
storefront. Virtual stores exist on the Internet, which is the well-known global information network.
You can easily enter the virtual store by typing the URL in the web browser.

The application reduces a lot of work load for customers as well as the owner. By this online
shopping the product is directly delivered to the customer's home. Online customers must have
access to the Internet and can shop online using a range of different computers and devices,
including desktop computers, laptops, tablet computers and smartphones.

The central concept of the application is to allow the customer to shop virtually using the Internet
and allow customers to buy the products of their desire from the store.It is developed to improve
the services of Customers and vendors. It maintains the details of customers, addition of new
customers, products and also updating, deletion of the same. The primary features of this project
are high accuracy, design flexibility and easy availability.

10
1.2 Scope of the project
With the rapid development of the Internet, online shopping is changing the way of traditional
consumption patterns. However, how to do business on the internet? The answer is; we need a
platform for selling and buying products online.

The aim of the proposed system is to build an online shop which is easier to use, more convenient
to order products for the consumer, and better to manage the products and services information for
the administrator.

The development of this new system contains the following activities, which try to develop an on-
line application by keeping the entire process with the view of the database integration approach.

∙ The proposed system is flexible both for the administrators and the customers visiting the
website.

∙ Creating a Shopping cart so that customers can Shoppe ‘n’ no. of items and check out
finally with the entire shopping cart.

∙ The proposed system allows easy promotion of the site through emails and newsletters.

∙ The proposed system gives information about the delivery and present status of their orders.

∙ Management of data is easy.

∙ Security is provided wherever necessary.

∙ Customers should be able to mail the Shop about the items they would like to see in the
Shop.

1.3 Objectives

The purpose of the application is to automate and facilitate the whole process of shopping. This
application fixes the limitations and problems of paper based processes. The main goal is to
increase the quantity of sales by making the new technology of web design more attractive and to
search a lot of customers and companies for their location.
Several project objectives are :

11
∙ Secure registration and profile management facilities for Customers.
∙ To serve the customers without wasting their precious time.
∙ Browsing through the eMall to see the items that are there in each category of products .
∙ To represent as a compete in the e-commerce of Pakistan
∙ To make the shopping easier and comfortable
∙ Secured mechanism for checking out from the Shop (Credit card verification mechanism) ∙
Updates to customers about the Recent Items in the Shop.
∙ Uploading ‘Most Purchased’ Items in each category of products in the Shop.
∙ To reach the products to the customer’s address with great care

12
 Chapter 2
SYSTEM ANALYSIS

2.1 Introduction of the System

Analysis is the focus of system development and is the stage when system designers have to work
at two levels of definition regarding the study of situational issues and possible solutions in terms
of “what to do” and “how to do”.

2.1.1 Definition of the system

A system is an orderly grouping of independent components linked together according to a plan to

achieve a specific objective. Its main characteristics are organization, interaction, independence,
integration and the central objective a system does not necessarily mean to a computer system. It
may be a manual system or any other names.

2.1.2 Needs of the system

High level decisions and operating processes: in response to technological, socio-economic factors,
top level managers may decide to recognize operations and introduce new products. To deal with
these needs, people commonly seek new modified information to support the decision. When it
happens, then they turn to a computer system to help the information users and data processing
specialists then work together to complete a series of steps in a system study to produce output
results to satisfy information needs.

2.2 System analysis

System Analysis is a process by which we attribute processes or goals to a human activity,

determine how well those purposes are being achieved and specify the requirements of the various
tools and techniques that are to be used within the system if the system performances are to be
achieved.

13
2.2.1 System planning

Planning for information systems has a time horizon and a focus dimension. The time horizon
dimension specifies the time range of the plan, whereas the focus dimension relates whether the
primary concern is strategic, managerial, or operational. The system, i.e. The Project that we were
assigned was required to complete within 20 weeks. What we had planned is as follows:
Requirements analysis, Preliminary Investigation & Information gathering.

Preliminary investigation

The initial investigation has the objective of determining the validity of the user’s request for a
candidate system and whether a feasibility study should be conducted.

The objectives of the problem posed by the user must be understood within the framework of the
organization’s MIS plan.

Information gathering

A key part of feasibility analysis is gathering information about the present system. The analyst
must know what information to gather, where to find it, how to collect it, and what to make of it.
The proper use of tools for gathering information is the key to successful analysis. The tools are
the traditional interview, questionnaires, and on-site observation

2.3 SPECIFICATION REQUIREMENTS

2.3.1 HARDWARE REQUIREMENTS

Processor: Intel Core 2 Duo or higher

RAM: 2Gb or higher
Disk space: 130Mb
Printer: Inkjet or Laser Printer

14
Monitor: VGA enabled
Keyboard & Mouse: Multimedia
2.3.2 SOFTWARE REQUIREMENTS

Operating system: Windows 7 and higher

Browser: Any browser with NET support

2.4 Functional & Non-Functional Requirements

2.4.1 Functional Requirements

Functional requirements capture the intended behavior of the system. This behavior may be
expressed as services, tasks or functions the system is required to perform. In a nutshell, functional
requirements describe what the software / website should do (the functions). Think about the core
operations.

Because the “functions” are established before development, functional requirements should be
written in the future tense. In developing the web application for the online shopping system, some
of the functional requirements could include:

∙ The web application shall accept customer orders.

∙ The web application shall produce a receipt detailing a customers’ purchase information
and include name of customer, items purchased, cost of each item and total cost. ∙ The web
application shall be able to produce weekly, monthly and yearly reports about sales.

User Function

∙ Registered User : (Customer, Administrator)

∙ Login system (Username & Password)
∙ Fill the Form (with the required Customer Information)
15
 ∙ Start New Orders & select required product and quantity
∙ Fill Payment Details and send order
∙ Get information for services

Administrator

∙ Display Product Details and add new products.

∙ Display Category list and can add/modify theme.
∙ Create, Modify & Display the main category.
∙ Create Modify & Display payment type.
∙ Register new admin employees (Creates user ID's for the admin and Employees in order to
login).
∙ Change current user password after log in.
∙ Display customer orders.
∙ Create, Modify & Display services Information

2.4.2 Non-Functional Requirements

Non-functional requirements are usually called qualities of a system. Such as security and
backup. Non-functional requirements are not concerned with the functions of the system.
Instead, they look at the criteria to which the software or website is expected to conform to. Non
functional requirements can include things like response time and reliability. It can also be
closely tied to user satisfaction.

Some non-functional requirements for the online shopping system application could include:

∙ The web application shall be easy to use by all employees including sales representatives
and managers

16
 ∙ The web application shall be available in several languages
∙ The web application shall allow several sales to be made at the same time without
downgrading performance

2.5 Existing system

In day-to-day life, we will need to buy lots of goods or products from a shop. It may be food
items, electronic items, household items, etc. Nowadays , it is really hard to get some time to go
out and get them by ourselves due to busy lifestyles or lots of work. In order to solve this, B2C E
Commerce websites have been started. Using these websites, we can buy goods or products
online just by visiting the website and ordering the item online.

This existing system of buying goods has several disadvantages :

∙ The system is limited to a particular area as the store generally caters to the need of people
living in a particular territory.
∙ Customers have to take pain to go to the shop in case of heat, cold, rain etc.

2.6 Proposed system

In order to overcome this, we have an e-commerce solution, i.e one place where we can get all
required goods/products online. The proposed system helps in building a website to buy, sell
products or goods online using an internet connection. Purchasing goods online, users can choose
different products based on categories , online payments , delivery services .

2.7 Comparison of Existing & Proposed System

The differences between E-shopping and traditional shopping are the following:

17
Traditional shopping E-shopping
You need to carry the purchased products. You needn't carry the purchased products.

You have to go through the traffic and the You just click on a button then you deliver
parking, experiencing a lot of difficulties what you need.

You have to deal with the cashier line and that Saving time and effort and avoiding dealing
always takes time. with cashers.

18
 Chapter 3
FEASIBILITY STUDY

3.1 Feasibility Study

The term feasibility study illustrates the feasible stage of our project with the situation of the
current environment and changes that can be made to progress the business feat over the next few
years as well as the cost involved to carry out the proposed system. We can make decisions from
the feasibility study against any project. What is the profit and risk?

A feasibility study is a preliminary investigation of a project, to decide whether it will be cost –

effective, will realize the benefits that are expected and be technically feasible. A feasibility study
is essentially a mini-systems analysis with some additional systems design and investigation work.
Without feasibility study small – scale projects may be initiated but for larger projects, which
require an amount of time and money the feasibility study is required. Because it can reduce the
risk of the wastage of money.

There are some types of feasibility are :

∙ Technical Feasibility
∙ Operational Feasibility
∙ Economical Feasibility
∙ Social Feasibility

3.1.1 Technical Feasibility

Technical issues involved are the necessary technology existence, technical guarantees of
accuracy, reliability, ease of access, data security, aspects of future expansion.

∙ Technology exists to develop a system.

∙ The proposed system is capable of holding data to be used.

∙ The proposed system is capable of providing adequate response regardless of the

19
 number of users.
∙ The proposed system being modular to the administrator, if he/she wants can add more
features in the future and as well as be able to expand the system.

∙ As far as the hardware and software is concerned, the proposed system is completely
liable with proper backup and security.

Hence, we can say that the proposed system is technically feasible.

3.1.2 Operational Feasibility

If the system meets the requirements of the customers and the administrator we can say that the
system is operationally feasible.

The proposed system will be beneficial only if it can be turned into a system which will meet the
requirements of the store when it is developed and installed, and there is sufficient support from
the users.

∙ The proposed system will improve the total performance.

∙ Customers here are the most important part of the system and the proposed system will
provide them with a convenient mode of operation for them.

∙ The proposed system will be available to the customers throughout the globe. ∙

The proposed system will provide a better market for different dealers. Hence, the

proposed system is operationally feasible.

3.1.3 Economical Feasibility

Economic Feasibility is the most frequently used method for evaluating the effectiveness of the
proposed system. If the benefits of the proposed system outweighs the cost then the decision is
made to design and implement the system.

∙ The cost of hardware and software is affordable.

∙ High increase in the amount of profit earned by going global.

20
 ∙ Easy and cheap maintenance of the system is possible.

∙ Very cheap price for going global.

Hence, the proposed system is economically feasible

3.1.4 Social Feasibility

Social feasibility concentrates on the control that a proposed project may have on the social system
in the project environment. The ambient social structure may be such that certain categories of
workers may be in short supply or absent. The effect of the project on the social status of the
project participants must be assessed to ensure compatibility. It recognized that workers in certain
companies may have certain status symbols within the society.

21
 Chapter 4
SYSTEM DEVELOPMENT

4.1 Introduction to System Development

A system development methodology is a framework that can be used to structure, plan and
control the process of developing information systems. System development is the conversion of
design into its original phase. In order words, development of a system is actually a true form of
any work environment with correct functionality. In developing a system several aspects came
forward and many factors should be kept in mind. Such as, selecting suitable tools and language
for developing a system. So that the developed system is error free and provides maximum
features and functionality of the work environment. .

In the development of this project, I have analyzed that there are two side technologies to view
a system. First one is client side technology and the second one is server side technology. Both
technologies use different tools for development and implementation

4.2 Tool/Language Selection

Selection of tools and language to implement the proposed system is very critical of the project.
The selection of the tools only depends on the understanding of the system. In order to select
tools, many factors play an important role. Such as which tool will be used that is more
efficient for the development of the project. For example, reliability, functionality flexibility,
usability, security, performance and economy Keeping in view the factors and aspects, I used
following tools for the development of system :

∙ HTML5

∙ JavaScript

∙ Bootstrap

∙ CSS3

∙ J Query

∙ PHP
22
 .Laravel

∙ MySQL

∙ Adobe Photoshop

4.3 Client Side Technology

Client side scripting programs and languages that I used are:-

∙ HTML5

∙ JavaScript

∙ Bootstrap

∙ CSS

∙ J Query

∙ Adobe Photoshop

4.3.1 Bootstrap

Bootstrap is a popular web development framework used for creating websites. It was developed
by a team at Twitter and has been an open source project since 2011. The Bootstrap framework
includes CSS styles, JavaScript libraries, and HTML files. Bootstrap provides a way for developers
to easily build responsive websites rather than designing them from scratch. bootstrapping
describes a process that automatically loads and executes commands.

4.3.2 JavaScript

JavaScript is a programming language commonly used in web development. It was originally

developed by Netscape as a means to add dynamic and interactive elements to websites. While
JavaScript is influenced by Java, the syntax is more similar to C and is based on ECMAScript, a
scripting language developed by Sun Microsystems.

JavaScript is a client-side scripting language, which means the source code is processed by the
client's web browser rather than on the web server. This means JavaScript functions can run after
23
a web has loaded without communicating with the server. For example, a JavaScript function may
check a web form before it is submitted to make sure all the required fields have been filled out.
The JavaScript code can produce an error message before any information is actually transmitted
to the server.

4.3.3 HTML5 (HyperText Mark-up Language)

HyperText Mark-up Language (HTML) is a structured markup language that is used to create web
s. A mark-up language such as HTML is simply a collection of codes, called elements, that are
used to indicate structure and format of the document. A user agent, usually a web browser that
renders the document, interprets the meaning of this code to figure how to structure and display a
document. Elements consist of paired tags; a start tag and an end tag. Start and end tags are also
called opening tags and closing tags.HTML tags mostly come in pairs like <b> and </b>. While
most tags come in pairs. Some elements don't require an end tag because they don't enclose content.
These elements are referred to as empty elements. One example is a BREAK element <br>, which
indicates a line break. HTML5 is cooperation between the World Wide Web Consortium (W3C)
and the Web Hypertext Application Technology Working Group (WHATWG). WHATWG was
working with web forms and applications, and W3C was working with XHTML 2.0. In 2006, they
decided to cooperate and create a new version of HTML.

4.3.4 CSS (Cascading Style Sheet)

Basically a style sheet separates the structure of a document from its presentation. Dividing layout
and presentation has many theoretical benefits; most importantly, it can provide for flexible
documents that display equally well across many types of output devices. In general web bases
style sheets contain information that describe how documents are presented whether on a computer
monitor, in print or perhaps even pronounced by speech based system for the visually impaired.
The purpose of a style sheet is to create a presentation for a particular element or a set of elements.
Binding an element to a style specification is quite simple; it consists of an element, forward by its
associated style information within curly braces.

There are three ways of inserting a style sheet :

External Style Sheet

An external style sheet is ideal when the style is applied to many s. With an external style sheet,
you can change the look of an entire Web site by changing one file. Each must link to the style
24
sheet using the <link> tag. The <link> tag goes inside the head section:

<head>

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

</Head>

Internal Style Sheet.

An internal style sheet should be used when a single document has a unique style. You define
internal styles in the head section of an HTML , by using the <style> tag, like this: <head>

<style type-"text/css">

hr {color: sienna;}

p {margin-left:20px:}

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

</style>

</head>

Inline Styles

An inline style loses many of the advantages of style sheets by mixing content with presentation.
Use this method sparingly. To use inline styles, you use the style attribute in the relevant tag. The
style attribute can contain any CSS property.

The example shows how to change the color and the left margin of a

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

4.3.5 JQuery

Query is a library of JavaScript Functions. J Query is mostly used for a design, effects and
animation purpose. Because it gives a great look to a website. The J Query library contains the
25
following features :

∙ HTML element selections

∙ HTML element manipulation

∙ CSS manipulation

∙ HTML event functions

∙ JavaScript Effects and animations

4.3.6 Adobe Photoshop

Adobe Photoshop helps in designing and developing Images. It creates new files with different
sizes. The size of a window depends on the requirement of the production. Its visual interface
allows you to design a task. It is really a flexible tool.

With the help of Adobe Photoshop, a real image can be modified and used on websites. The most
important and best feature of Adobe Photoshop is that customers, who want to develop their system
from a programmer, show their system design and requirements on it. This design shows how the
will look after programming certain actions.

Adobe Photoshop is heavy software and has many features in it. It can be said as an optimizer of
image galleries. Any king of images and views can be developed here

4.4 Server Side Technology

Server side scripting programs and languages that I used are as follows :

∙ PHP

∙ MySQL

4.4.1 PHP

PHP (recursive acronym for "PHP: Hypertext Preprocessor") is scripting language for creating
dynamic web s. When a visitor opens a , the server processes PHP commands and then sends the
result to a visitor’s browser.
PHP language syntax is similar to the C. This might prove a barrier to people with no

26
programming experience, but if you have a background in either language then you might want
to take a look. PHP also has some object-oriented features, providing a helpful way to organize
and encapsulate your code

As I have said already, PHP (recursive acronym for "PHP: Hypertext Preprocessor") is a
widely used Open source general purpose scripting language that is especially suited for web
development and can be embedded into HTML.

Some of them are given below:

File Upload

PHP has a feature which enables people to upload both text and binary files. With
authentication you have full control over who is allowed to upload and what is to be done with
the file once it has been uploaded

Usability

PHP can be used on all major operating systems, including Linux, many UNIX

variants (Solaris and OpenBSD) , Microsoft Windows and probably others.

Support

PHP has support for most of the web server today

Easy to Learn

PHP is easy to learn and runs efficiently on the server side. At last but not least, we have many
other interesting features, but this is not enough to list all the benefits that PHP offers.

4.4.2 MySQL

MySQL is the most popular open source SQL Database Management System. On top of that, it is
very commonly used in conjunction with PHIP scripts to create dynamic and powerful server
applications.

My SQL has been criticized in the past because it does not have all the features of other

Database Management Systems . However , MySQL. Continues to improve significantly, with

each major upgrade, and has great popularity because of these improvements.
27
MySQL is very fast, reliable, and easy to use. If that is what you are looking for, you should give
it a try. MySQL also has a very practical set of features developed in very close cooperation with
our users. You can find a performance comparison of MySQL to some other database managers.
MySQL was originally developed to handle very large databases much faster than existing
solutions and has been successfully used in highly demanding production environments for
several years. Though under constant development, MySQL today offers a rich and very useful
set of functions. The connectivity, speed, and security make MySQL highly suited for accessing
databases on the Internet.

28
 Chapter 5
SYSTEM DESIGN

5.1 System design

System design is the solution for the creation of a new system. This phase focuses on the detailed
implementation of the feasible system. It emphasizes translating design Specifications to
performance specifications. System design has two phases of development

∙ Logical design

∙ Physical design

During the logical design phase the analyst describes inputs (sources), outputs(destinations), databases
(data sores) and procedures (data flows) all in a format that meets the user requirements. The
analyst also specifies the needs of the user at a level that virtually determines the information flow
in and out of the system and the data resources. Here the logical design is done through data flow
diagrams and database design. The physical design is followed by physical design or coding.
Physical design produces the working system by defining the design specifications, which specify
exactly what the candidate system must do. The programmers write the necessary programs that
accept input from the user, perform necessary processing on accepted data and produce the
required report on a hard copy or display it on the screen.

Computer output is the most important and direct source of information to the user. Output design
is a very important phase since the output needs to be in an efficient manner. Efficient and
intelligible output design improves the system relationship with the user and helps in decision
making. Allowing the user to view the sample screen is important because the user is the ultimate
judge of the quality of output. The output module of this system is the selected notifications.

5.2 FEATURES OF THE PROPOSED SYSTEM

The development of this new system contains the following activities, which try to develop
online applications by keeping the entire process in the view of a database integration approach.

∙ Secure registration and profile management facilities for Customers.

29
∙ Browsing through the online shopping system to see the items that are there in each category
of products like Apparel, shoes, hand bags etc.

∙ Creating a Shopping cart so that customers can Shoppe ‘n’ no. of items and checkout finally
with the entire shopping cart.

∙ Customers should be able to mail the Shop about the items they would like to see in the
Shop.

∙ Secured mechanism for checking out from the Shop (Credit card verification mechanism).

∙ Updates to customers about the Recent Items in the Shop.

∙ Upload ‘Most Purchased’ Items in each category.

∙ The proposed system is flexible both for the administrators and the customers visiting the
website.

∙ The proposed system provides a unique platform for different vendors to interact using the
same platform.

∙ The proposed system allows easy promotion of the site through emails and newsletters.

∙ The proposed system gives information about the delivery and present status of their orders.

∙ Management of data is easy.

∙ Allowing customers to post queries and discuss products and sell through us. ∙

Allow the businessman to manage the shop inventory.

∙ Allow the businessman to view graphs depicting previous sales etc. ∙

Allow the businessman to change the look and feel of the site with ease. ∙

The opportunity of shopping 24 hours a day

∙ Saving time and energy

∙ Having chance of comparison of prices

30
 ∙ Easy to find out variety of products, categories, and brands

∙ Chance of knowing the user reviews of each product before buying

∙ Completing tasks of shopping at home

∙ Allow the shopkeeper to view different configuration options and update them. ∙

Security is provided wherever necessary.

5.3 Software Design

Software design is both a process and a model. The design process is a sequence of steps that
enable the designer to describe all aspects of the software to be built. Software design is a process
to transform user requirements into some suitable form, which helps the programmer in software
coding and implementation. It is important to note, however, that the design process is not simply
a cookbook. Creative skill. Past experience, a sense of what makes "good" software, and an overall
commitment to quality critical success factors for a competent design. Software design is the first
step in SDLC (Software Design Life Cycle), which moves the concentration from problem domain
to solution domain. It tries to specify how to fulfill the requirements mentioned in SRS.

The design model is the equivalent of an architect's plans for a house. It begins by representing the
totality of the thing to be built (e g, a three-dimensional rendering of the house) and slowly refines
the thing to provide guidance for constructing each detail (e g, the plumbing layout), Similarly, the
design that is created for software provides a variety of different views of the computer software
.Basic design principles enable the software engineer to navigate the design process mode.

5.4 Data Flow Diagram (DFD)

A data flow diagram is a graphical view of how data is processed in a system in terms of input and
output. A Data Flow Diagram (DFD) is a structured analysis and design tool that can be used for
flowcharting. A DFD is a network that describes the flow of data and the processes that change or
transform the data throughout a system. This network is constructed by using a set of symbols that
do not imply any physical implementation. It has the purpose of clarifying system requirements
and identifying major transformations.

The Data flow diagram (DFD) contains some symbols for drawing the data flow

31
diagram. Data flow diagram symbol

Symbol Description

Data Flow – Data flow is pipelines through the packets of information flow.

Process -- A Process or task performed by the system.

Entity --Entity are objects of the system. A source or destination data of a

system. Data Store - A place where data to be stored.

Context level DFD – 0 level

The context level data flow diagram (DFD) describes the whole system. The (o) level DFD
describes all user modules who operate the system. Below data flow diagram of online shopping
A diagram of online shopping site shows the two user can operate the system
Admin and Member user.

Request for
Online Request for login
Registration
Customer shopping Admin
Response Response
system

1st Level DFD of Admin & Customer

The Admin side DFD describes the functionality of Admin, Admin is an owner of
the website. Admin can first add a category of item and then add items by category
wise. And the admin can manage order and payment details.
The customers are all people who operate or visit our website. Customers can first
select a product to buy, users must have to register in our system to purchase any
item from our website. After registering he can login to the site and buy item by
making online payment through any bank debit card or credit card.

32
2nd Level DFD of Admin

Add new product

2.1
Add
Confirmation

Update product
2.2 Store and retrieve

Update products
Admin
Confirmation

Delete product 2.3

Delete
Confirmation

2nd Level DFD of User

33
 Add new suits 5.1
To cart Add shirt to
Cart
Confirmation

Delete product 5.2

Update data
From cart Delete shirt
Customer cart
From cart
Confirmation

Final choice for

Order
5.3
Give order
Confirmation

5.5 Visual modeling using UML

• UML is a standard language for specifying, visualizing, constructing, and

documenting the artifacts of software systems.

• UML was created by the Object Management Group (OMG) and UML 1.0
specification draft was proposed to the OMG in January 1997.

• UML stands for Unified Modeling Language.

• UML is different from the other common programming languages such as C++,
Java, COBOL, etc.

34
 • UML is a pictorial language used to make software blueprints.

• UML can be described as a general purpose visual modeling language to visualize,

specify, construct, and document software systems.

• Although UML is generally used to model software systems, it is not limited

within this boundary. It is also used to model non-software systems as well. For
example, the process flow in a manufacturing unit, etc.

• UML is not a programming language but tools can be used to generate code in
various languages using UML diagrams. UML has a direct relation with object
oriented analysis and design. After some standardization, UML has become an
OMG standard.

5.5.1 Activity diagram

Activity diagram is basically a flowchart to represent the flow from one activity to another
activity. The activity can be described as an operation of the system. The control flow is drawn
from one operation to another. This flow can be sequential, branched, or concurrent. Activity
diagrams deal with all types of flow control by using different elements such as fork, join, etc.

An Activity diagram is a visual representation of any system's activities and flows of data or
decisions between activities.
• Activity diagrams provide a very broad view of a business process.

• They represent the dynamics of a system.

• They are flow charts that are used to show the workflow of a system.

• They show the flow of control from activity to activity in the system.

• They show what activities can be done in parallel, and any alternative paths through the
flow.

• Their activity being represented by other activity diagrams.

• Activity represents the performance of some behavior in the workflow.

35
 • They are typically triggered by the completion of the behavior in the originating activity.

• When modeling the workflow of a system, it is often necessary to show where the flow of
control branches based on a decision point.

• In a workflow there are typically some activities that may be done in parallel.

Activity Diagram for Admin

Admin

Login (email and password)

Authentication (database)
Invalid

Valid

Add product Add Category Manage order Manage User

Edit category Confirm/Cancel Active/inactive

Change price Edit product
Orders User

Logout

36
Activity Diagram for User

Registration

Login

Authentication Invalid

Valid

Search product Edit profile Search services

Add to cart View services

Change password My account

Make payment (P.G)

Cancel order
Contact us
Confirm order

Logout

5.5.2 Use-Case Diagram.

A use-case diagram is a graph of actors, a set of use cases enclosed by a system

boundary, communication (participation) associations between the actors and the
use cases, and generalization among the cases. The use-case concept was introduced
by Ivar Jacobson in the object-oriented software engineering (OOSE) method.

Use case diagrams show how users interact with the system. Use case diagrams
describe what a system does from the standpoint of an external observer. The
emphasis is on what a system does rather than how.

Use case diagrams are closely connected to scenarios. A Scenario is an example of what
happens when someone interacts with the system. Here is a scenario for a medical clinic.
"A patient calls the clinic to make an appointment for a yearly checkup. The receptionist
37
finds the nearest empty time slot in the appointment book and schedules the appointment
for that time slot. "
Use cases represent a sequence of interaction for a type of functionality. Used
during requirements elicitation to represent external behavior. The use case model is
the set of all use cases. It is a complete description of the functionality of the system
and its environment. Actors represent roles, that is, a type of user of the system
A use case represents a class of functionality provided by the system as an event flow.
A use case consists of:
• Unique name

• Participating actors

• Pre-conditions

• Entry conditions (triggers)

• Flow of events

• Exit conditions (success ‘guarantees’)

• The <<extend>> relationships represent exceptional or seldom invoked cases.

• The exceptional event flows are factored out of the main event flow for clarity.

• Use cases representing exceptional flows can extend more than one use case.

• The direction of a <<extend>> relationship is to the extended use case

• An <<include>> relationship represents behavior that is factored out of the use case.

38
Use-Case Diagram for Admin

Order process
Login
<< Extend>>

Manage order

Add category
Manage/View
Customer profile
<<Extend>> Delete category

<<Extend>>
Categories
Administrator

Logout
Add/Edit item
<<Extend >>
Edit item
<<Extend >>
Delete item

39
Use-Case Diagram for User

View recommended items

Registration
<< Extend >>

View item << Extend >> Search item

View categories

Login
Unregistered user
/ Visitor
Add item to cart

Remove item from cart View / Update shopping cart

<< Extend >>

Checkout
<< Extend >>
Calculate shipping taxes

Make a payment

Registered user Edit profile

Make order

View order status

5.5.3 Sequence Diagram

A Sequence diagram is an interaction diagram that shows how processes operate

with one another and in what order. It is a construct of a Message Sequence Chart.
A sequence diagram shows object interactions arranged in time sequence. It depicts
the objects and classes involved in the scenario and the sequence of messages
exchanged between the objects needed to carry out the functionality of the scenario.
The Sequence Diagram models the collaboration of objects based on a time
sequence.
A sequence diagram, in the context of UML, represents object collaboration and is
used to define event sequences between objects for a certain outcome. A sequence
diagram is an essential component used in processes related to analysis, design and
documentation.

40
UML sequence diagrams are used to represent or model the flow of messages,
events and actions between the objects or components of a system. Time is
represented in the vertical directions showing the sequence of interactions of the
header elements, which are displayed horizontally at the top of the diagram. These
diagrams are used by software developers and business professionals to understand
requirements for a new system or to document an existing process.
Sequence Diagrams are used primarily to design, document and validate the
architecture, interfaces and logic of the system by describing the sequence of
actions that need to be performed to complete a task or scenario.
Sequence Diagram of Customer Registration

Customer Application interface Database

Customer login

Check user details

Gives the details

Give access to customer

41
Sequence Diagram of Administrator

Administrator Application interface Cart system Ordering system

Login

Add product

Add category

Add user

Delete user

Change password

Delete item

Delete category

Logout

42
Sequence Diagram of Customer

Customer Application interface Cart item Order process Logout Order summary

Add product

Gets item

Product details

Add products

Shipping details/Charges

Charges

Payment details

Display the order item

Confirm

Checkout

43
 Chapter 6
DATABASE DESIGN

6.1 Database Design

The most important phase of any project is the designing of a database which involves the
designing of different normalized tables and then the relationship between those normalized tables.

For input designing, table designing is done. There are several steps involved in developing an
effective database design. The steps are such as, what data element must be stored, who will access
them, and how.

6.2 Database

A database is a collection of data, which is organized in such a way that each piece of data is
available to those who need it and with minimum duplication of data. Another definition in terms
of database may be as "A database is a collection of data organized so as to minimize redundancy
and maximize access.

6.2.1 Advantages of Database

The most common advantages of database may be as follows:

∙ Minimal data redundancy
∙ Consistency of data
∙ Data integrity
∙ Sharing of data
∙ Ease of application development
∙ Uniform security, privacy and integrity controls
∙ Reduced program maintenance

44
6.2.2 Constraints

These are the conditions that obey database

6.2.3 Entity

Any object or concept identified by an enterprise that exists independently and about which is
necessary to store data. It may be anything like a person, a place, an event, or concept or an object.

6.2.4 Attributes

These are the characteristics or properties of an entity that is of interest to the

organization. For example, Admin is an entity, its attributes mostly may be: Login name,

Password etc.

6.2.5 Keys

A key is distinct for each individual entity in an entity set. Key attributes are the attributes whose
values are uniquely identified and do not exist again.

Super Key
A super key is an attribute or a set of attributes that uniquely identifies an entity. For example,
Login name is a super key because it can be used to identify each Admin uniquely Primary
Key
The primary key is one or more columns in a table used to uniquely identify each row to the table.
Primary key values can't be null and must be unique across the column. A multicolumn primary
key is called Composite Primary Key

45
Foreign key
Foreign key represents relationships between the tables or relations. A foreign key is a column
(or a group of columns) whose values are derived from the primary/unique key of the same or
some other tables.
Composite Key
If the key consists of more than one attribute for unique identification, then it will be called a
composite key.

6.3 Database Tables

The following tables are maintained to fulfill the requirements of the proposed system. The
table name and field name with its type are also given below with the description of each.
The primary key is identified by the symbol of key with that attribute

ALL TABLES

CART TABLE

46
Migration Table

ORDERS TABLE

47
PRODUCTS TABLE

48
CATEGORY TABLE

49
USERS TABLE

50
 Chapter 7
User Interface

7.1 User Interface

The user interface (UI), in the industrial design field of human-machine interaction, is the space
where interactions between humans and machines occur. The goal of this interaction is to
allow effective operation and control of the machine from the human end, whilst the machine
simultaneously feeds back information that aids the operators' decision- making process

7.2 User Interface Front End

HOME OF PRODUCTS

LOGIN MENU

51
USER LOGGED-IN

REGISTRATION

Popular Categories:-

52
Trending Products:-

53
Cart List:-

Order Now:-

54
Check Out:-

ABOUT US:-

55
ADMIN PANEL:

Login:

Dashboard:

56
References

• www.stackoverflow.com
• https://laravel.com/
• https://www.eduonix.com/
• https://hackr.io/tutorials/learn-laravel
• www.php.net
• www.slideshare.com
• https://www.wikipedia.org
• https://www.w3schools.com
• https://www.google.com
• https://www.youtube.com
• https://www.uml-diagrams.org

57