Reena Budhathoki and Mohan adhikari

E-COMMERCE WEBSITE DEVELOPMENT FOR ELECTRONICS STORE

Thesis
CENTRIA UNIVERSITY OF APPLIED SCIENCES
Information Technology
June 2020
ABSTRACT

Centria University Date Author

of Applied Sciences June 2020 Reena Budhathoki & Mohan adhi-
kari
Degree programme
Information Technology
Name of thesis
E-COMMERCE WEBSITE DEVELOPMENT FOR ELECTRONICS STORE
Instructor Pages
Kauko Kolehmainen 52
Supervisor

Kauko Kolehmainen

The aim of this thesis is to build an E-commerce website for virtual electronic store called “Electronics”.
Website plays a major role in growth and development of any business. It is the most effective way to
reach wide number of audiences in no time. Website makes it easy for the businesses to analyze about
user’s persona.
This thesis focuses mainly on two things, first being the front-end development and second back-end
development. The front-end side can sometimes also be refereed as the client side which gives user a
visible user interface. Back end development can also be termed as behind the scene of functionality of
a website. It helps users to communicate with the servers through web browsers. PHP programming
language is used for making the website accessible in server side.

Key words
HTML, CSS, PHP, JavaScript, XAMPP, MySQL, jQuery, CMS
CONCEPT DEFINITIONS

HTML Hypertext Markup Language

CSS Cascading Style Sheet
CMS Content Management System
WWW World Wide Web
XAMPP Cross-Platform(X), Apache (A), MySQL (M), PHP (p), Perl (P)
ABSTRACT
CONCEPT DEFINITIONS

CONTENTS

1 INTRODUCTION................................................................................................................................1

2 INTERNET AND E-COMMERCE ...................................................................................................2

3 WEB TOOLS AND TECHNIQUES ..................................................................................................4

3.1 Open source software (OSS) .........................................................................................................4
3.2 Frontend and backend web development ....................................................................................4
3.3 HTML..............................................................................................................................................5
3.4 CSS (Cascading style sheets) .........................................................................................................6
3.5 JavaScript .......................................................................................................................................7
3.6 Bootstrap .........................................................................................................................................8
3.7 JSON................................................................................................................................................9
3.8 PHP ..................................................................................................................................................9
3.9 SQL and NONSQL databases .....................................................................................................10

4 CONTENT MANAGEMENT SYSTEM (CMS).............................................................................15

4.1 JOOMLA ......................................................................................................................................15
4.2 WordPress .....................................................................................................................................16

5 WEBSITE DEVELOPMENT PROCESS .......................................................................................20

5.1 User requirement .........................................................................................................................20
5.2 Design ............................................................................................................................................20
5.3 Implementation ............................................................................................................................21
5.4 User experience.............................................................................................................................22
5.5 Website testing ..............................................................................................................................22
5.6 Publishing......................................................................................................................................22
5.6.1 Website promoting .............................................................................................................23

6 OUR WEBSITE PROJECT..............................................................................................................24

6.1 User Requirements .......................................................................................................................24
6.2 Design phase .................................................................................................................................26
6.2.1 Database design ..................................................................................................................29
6.2.2 User interface design ..........................................................................................................33
6.3 Dynamic content ...........................................................................................................................35
6.4 Shopping cart................................................................................................................................38
6.5 User Registration ..........................................................................................................................39
6.6 Login and user interface ..............................................................................................................40
6.7 Publishing......................................................................................................................................42

7 CONCLUSION ..................................................................................................................................45

REFERENCES ...................................................................................................................................... 41
FIGURES

FIGURE 1 Front-end and back-end development……………………….………………………………5

FIGURE 2 Autocomplete structure if HTML……………………………………………………………6
FIGURE 3 CSS syntax (w3schools, 2020) ………………………………………………………………7
FIGURE 4 XAMPP control panel………………………………………………………………………13
FIGURE 5 Usage statistics of CMS……………………………………………………………………17
FIGURE 6 structured web-diagram…………………………………………………………………….21
FIGURE 7 Use case ……………………………………………………………………………………26
FIGURE 8 Establishing connection with database …………………………………………….………27
FIGURE 9 Database ER diagram …………………………….……………………………………..…28
FIGURE 10 Front page design…………………………………………………………………………29
FIGURE 11 Brand table in phpMyAdmin………….………………………………………………….30
FIGURE 12 Cart table in phpMyAdmin…………………….…………………………………………30
FIGURE 13 Categories table in phpMyAdmin…………………………………………………………31
FIGURE 14 Product table in phpMyAdmin……………………………………………………………32
FIGURE 15 Users table in phpMyAdmin……………………………………………………………...32
FIGURE 16 User interface design…………..……………………………………………………….…33
FIGURE 17 Navigation bar………………………………………………………………………….…34
FIGURE 18 Side bar…………………………………………………………………………...…….…35
FIGURE 19 Insert Product page………………………………….…………………………...…….….36
FIGURE 20 phpMyAdmin panel………………………………....………………………………….…37
FIGURE 21 All product page……………………………………………………………………….….38
FIGURE 22 Shopping cart……………………………..……………………………………………….39
FIGURE 23 Registration Form…………………………………………………………………………40
FIGURE 24 Login page……………………………………………………………………………….. 41
FIGURE 25 Edit profile…………………………………………………………………………….......42
FIGURE 26 Webhost site (000webhost.com) ………………………………………………………….43
FIGURE 27 Go daddy webhost (www.godaddy.com). ………………………………………..………44
 1

1 INTRODUCTION

Technology has always evolved with time. With the help of innovation in every sector of working life,
life has become much easier. With evolving technology, it has become very easy to find everything
needed remotely with the help of few clicks and browsing through stable internet connection. Unlike
every sector, commercial sector has also been evolved alongside the growing technology. People no
longer need to leave their house in order to gather information happening outside or even to get products
they need.

The purpose of making this website is to make shopping fast, convenient and easily accessible to every-
one from anywhere with the help of working internet connection. Anyone who is in need of electronic
devices offered by the company is provided with not only in store visit but also through online shopping.
In this website, user either can surf through products without registering their account or by putting in
their details which enables them to visit back whenever convenient and continue from where they left.
User must create a user account providing all the data required in order to place an order which is then
delivered to them after making correct payment.
 2

2 INTERNET AND E-COMMERCE

Advance development of technology has changed day to day life of everyone in this world. Internet has
become important part of human life. From children to older people everyone is using internet for spe-
cific purpose. Internet is used for free communication, business transactions, learning, shopping, storing
data, sharing news worldwide, research and development. Internet travel through mass of cables, routers,
satellites and Wi-Fi tower. Internet helps to design to shuttle a short message between two terminals. To
share content quickly, effectively and in real time social media is used. Social media helps to reach a
large audience in business. There will be direct connection with audience through social media. Many
students have study and learn skills from social media sites and technology as well as some of people
have damaged their career with bad addiction on entertainment aspect of internet sites. Productive use
of internet will lead to successful path. People share anything including material in social media that
may not be accurate and some time they are unverified or false information. Social media sites are the
important aspect of digital marketing which provide high benefits and it also help to reach millions of
customers.

E-commerce refers to buying and selling of goods or services via the internet, and the transfer of money
and data to complete the sales. E-commerce also encompasses activities like online auctions, internet
banking, payment gateways and online ticketing. Business transaction in E-commerce can be completed
in six ways: Consumer to Consumer, Consumer to Business, Business to Business and Business to Con-
sumer, Business to Administration, and Consumer to Administration. (Fernandes 2014.)

E-commerce is a popular term also known as electronic commerce or even internet commerce provides
the most efficient and convenient way to perform transactions involved in this trade. E-commerce sub-
stantially lowers the transaction cost. E-commerce helps to save time, effort and energy for both buyers
and sellers. E-commerce has developed into large company which helps to make huge amount of profit.
Traditional companies are forced to change their business techniques and to develop their own websites
as well. All over the world more than 75% of people use internet every day for business and private
purposes. With e-commerce platforms, retailers build online stores where they showcase their products
and services. Digital marketing uses search engine optimization (SEO) is main tool to promote the prod-
ucts and services in E-commerce website. (Fernandes, 2014.)

E-commerce concept is rapidly growing as it has brought new ideas and opportunities in the field of
business. E-commerce attracts consumers by providing services 24 hour with wide variety of product.
 3

Technical issue is one of the risk factors of E-commerce website as it is based on technical system and
sometimes it may lead to failure of whole E-commerce site. E-commerce attracts consumers and retailers
despite of having low business expenses.

Website plays an important role in development of any sort of business bet it small scale of large scale.
In today’s convenience-based society, people tend to remotely shop rather than going to local stores for
buying items. Website helps on broadening the service by taking your brand form traditional brick to a
well-managed and loved brand. Online store makes it possible for customers to shop or visit your store
at any time of the day which makes it convenient for both buyers and sellers. Reach is the other advantage
that one can get from having a well-made website. Internet has made it possible to browse the website
from across the globe at any given point of time. There is no comparison between the number of people
physically visiting the store and traffic coming through the website. (Fernandes, 2014.)

Website is a good place for users to gather information about the products they are interested in or in the
overall business they are interested in. Credibility is another major factor that shapes up having a proper
looking website. It does not only give credibility but also provides an impression that the business is
much superior and more successful than it might actually be.
 4

3 WEB TOOLS AND TECHNIQUES

Rapid development of web tools and technologies bring more conveniences in our daily life. Millions
of data can be transmitted easily from one place to another with the help of internet. In one-way tech-
nology development has not only simplified our daily lives but also has reduced cost and time in general.
Online business has changed traditional method of buying and selling products. People save time and
effort with wide variety of products available 24/7. E-commerce website should be attractive and always
updated with all new techniques for better profit. For Our NF electronics E-commerce website, we have
used various tools and technologies such as Notepad++ for programming, chrome, HTML, CSS, Ja-
vaScript, jQuery, SQL database which are described below.

3.1 Open source software (OSS)

The source code within the software which anyone can inspect, enhance and modify is called open source
software. LAMP is one of the most popular result of open source development model. LAMP stands for
Linux, Apache, MySQL and PHP. Linux is immensely popular project in the world of open source op-
erating systems. Likewise, MySQL is an open source database management system which is used by
many websites and applications. The Mozilla Firefox and Android mobile operating systems are other
two significant examples of successful open source software. (Redhat, 2018)

3.2 Frontend and backend web development

Front end refers to anything that a user sees first in their application or a webpage such as form fonts,
colors, side bar and dropdown menu. The look and feel of a site are the main responsibilities of front-
end developers. Front end web development is also known as client side of development. HMTL, CSS
and JavaScript are Front end developing languages whereas PHP, Java, Python and .NET are Back end
web development. Backend development makes server, database and application communicate with
each other with the help of server-side languages such as PHP, Ruby, Python and Java. (Duckett, 2014)

The illustration of Front end and Back end web developing is shown in the following diagrams.
 5

Figure 1. Front-end and Back-end development (Technical FUNS, 2018)

3.3 HTML

HTML describes the structure of web page. It stands for Hyper Text Markup language. In 1989, HTML
was created by Tim Berners-Lee, Robert Calliau and others.HTML2.0 was published in late 1999.
HTML5 is the latest version of HTML. HTML is one of the most widely used languages over web to
display documents. HTML is the basic block whereas other technologies besides HTML such as CSS
are for decoration of page and JavaScript is for more functionality and behavior of web page .When
users save file name with HTML extension and views through browser such as Internet explorer, browser
reads files and translates code into visible form and displays designed web page. (Duckett, 2014)
 6

Figure 2. Autocomplete structure of HTML. (stuyhsdesign, 2019)

DOCTYPE declaration must be in the first line of web document which tells browser that codes are
written in HTML5. HTML tag is container for whole HTML document and tells browser in which lan-
guage document is written. Head tag especially works behind the scene and contains information about
documents. Only few elements inside head tag are displayed in web pages. Charset attribute specifies
character encoding for HTML document. UTF-8 can support almost all the character and symbol inside
HTML document. Title tag are displayed on search engine of browser and defines title of document.
Body tag is visible part and define the document body. Body element is the actual content of document.
It contains different text images, videos, links and other. HTML element contains start tag and end tag
and contents are written in between. (w3schools,2020)
Example:
<Tag name> content goes here </tag name>
<h1> Heading 1 </h1> (heading tag)

3.4 CSS (Cascading style sheets)

Cascading style sheets is a mechanism for adding styles such as font spacing, colours to web documents
written in HTML. CSS reduce work and save time .CSS can change layout of multiple web pages just
by changing styling one page. CSS is a prominent technology of the worldwide web styles for different
rendering method like onscreen, in print, by voice and Braille based tactile devices. CSS also has rules
for alternate formatting for the content accessed on mobile devices. In 1994 October 10, Hakon Wium
 7

Lie introduces CSS. There are three ways of inserting CSS on web page: Inline CSS, External CSS, and
Internal CSS. (w3schools, 2018)

In Inline style sheet CSS code is written in same line for single element as shown below in example:
<p style = “font-size: 25px; colour: red; text-align: centre ;”> this is example of Inline CSS</p>
In External style sheet, the code is written in another file and saved with CSS extension as shown below.
<! DOCTYPE HTML>
<HTML>
<head>
<link rel =” stylesheet” type = “text/css” href = “external style file.css”>
</head>

Figure 3. CSS syntax (w3schools, 2019)

3.5 JavaScript

JavaScript (JS) is a dynamic, weakly typed programming language which is compiled at run time. Ja-
vaScript is one the most popular programming languages. Enormous companies like Netflix, Walmart
and PayPal build entire application with JavaScript. It can be executed as a part of web page in browser.
Java script was invented to make webpage more dynamic and to change the content on page directly
from inside the browser. Real time networking applications like chats and video streaming services com-
mand-line tools and game can be built with JavaScript. In 1995 Netscape introduced Live Script but due
to the popularity of Java it was renamed as JavaScript. However, it is totally independent from Java and
has nothing in common with Java. JavaScript was mainly used for a spamming, annoying overlays and
 8

pop-ups but another problem was writing different scripts for different browsers. In late 1996 people
noticed fragmentation could be a problem and JavaScript language was submitted to ECMA committee
to start standardization. New features are being added and it is getting better and better programming
languages. It is interpreted language which means it is compiled before it runs and not compiled during
development. JavaScript was originally designed to run only in browser.

Every browser has JavaScript engine to executed JavaScript code. JavaScript engine reads and under-
stands JavaScript code then compile it to machine code because machine code executes faster and exe-
cute machine codes. Google’s JavaScript was extracted to run JavaScript anywhere and many non-
browser environments such as Node.js, Adobe Acrobat use JavaScript. JavaScript can manipulate the
HTML code, CSS, send background Http requests. In HTML, JavaScript code must be between
<script>and</script> tag. (Power,Shelly.2006)
<HTML>
<body >
<script>
alert(“Hello JavaScript”)
< /script>
<p> Introduction to JavaScript </p>
</body >
</HTML>

3.6 Bootstrap

Bootstrap is defined as a collection of HTML, CSS and Java script tools for creating and building web
pages and web applications. Bootstrap is flexible and easy to work. Bootstrap is also known as a front-
end development framework that enables developers and designers to build fully responsive websites
quickly. Bootstrap can be used with any IDE or editor and any server-side technology and language from
ASP.NET to PHP to Ruby on Rails. (w3schools, 2020)

Bootstrap is a responsive grid so there will be no more spending hours coding your own grid. Bootstrap
comes with a whole barrel full of components that can easily tack into webpages including: navigation
 9

bars, dropdowns, progress bars, thumbnails and more. Every piece of code is described and explained in
explicit detail on their website. As with so many open source projects bootstrap has a large community
of designer and developers behind it. Being hosted on GitHub makes it easy developers to modify and
contribute to bootstrap codebase. Automatic resizing images based on the current screen size is possible
with Bootstrap.

Dozens of custom jQuery plugins are available in bootstrap. One of the main critiques when it comes to
frame works such as bootstrap is their size the weight, they throw around can really slowdown your
application upon first load. Bootstrap is as popular among developer as they have started to create tem-
plate based on bootstrap to accelerate the web development process even further. Precompiled version
and source code version are the forms of bootstrap. The source code version comes with styles source
code written in LESS, all the JavaScript and accompanying documentation. If the people are not familiar
with LESS, or they are just not interested in changing the source code at that time they can use the
precompiled vanilla CSS. (w3schools,2020)

3.7 JSON

JSON is a standardized format which is used to transfer data in form of text that can be sent over a
network. In simple way, it is a used to store information in an organized, easy to access manner. The
data must be in the form of a text when exchanging between the browser and a server. JSON is light
weight and easy to use when compared to other open data interchange option. JSON has a more compact
style as compared to XML. This means it is more readable. JSON uses fewer data which reduces the
cost and increases the parsing speed. The structure of JSON is straight forward and easily readable.
JSON uses a map data structure. JSON is text, we can convert any JavaScript object into JSON and send
JSON to the server. We can also include the same basic data types inside JSON as we can in a standard
JavaScript. JSON is purely a data format it contains only properties no method. The JSON format is
often used to transmit structured data with the help of network connection. (w3schools,2020)

3.8 PHP

PHP is widely used, popular server scripting language. PHP stand for “PHP: Hypertext Preprocessor “.
In 1995, Rasmus Lerdorf developed CGI script toolset which was called personal home page (PHP).
 10

PHP can be used for collecting form data, encrypt data, sending and receiving cookies, creating dynamic
page content quickly. PHP can easily modify database by adding and deleting data. PHP files can be
combination of text, HTML, JS, CSS and PHP. Basic knowledge in HTML, CSS, and JS is required for
PHP code .PHP files must have .php extension. PHP is case sensitive for variable names, but function
names are not case sensitive. PHP is suitable for almost all server and PHP runs on various operating
system such as windows, Linux, Mac. PHP is free to download and use. PHP code is executed on server
side. Web server is needed on PC to execute PHP and MySQL. (w3schools, 2020)

3.9 SQL and NONSQL databases

SQL stands for Structured Query language. It is used to access and manipulate relational database man-
agement systems (RDBM) such as MySQL, MS SQL Server, Oracle, Microsoft Access, etc. The data in
such databases are organized in the form of table that consist of columns and rows. The columns are the
vertical fields whereas the rows are the horizontal records. To perform any kind of action on a database,
SQL statements are needed. We need to use following SQL statement to get all the records of a Student
table.
SELECT * FROM Student;
So the basic syntax is: SELECT column_name FROM table_name; to select particular column
If we want to select all the columns then we use *. SQL queries can be categorized into following four
categories. DDL (Data Definition Language) is used to perform various operations on the structure of
table, schema and modify it. Some of the DDL queries are CREATE, DROP, ALTER and DELETE.
DML (Data Manipulation Language) is used to manipulate data in the database such as SELECT, IN-
SERT, DELETE, UPDATE. DCL stands for Data Control Language and some of DCL examples are
REVOKE and GRANT. These are used basically to deal with access rights and permissions. TCL
(Transaction Control Language) are transaction-based queries like COMMIT, ROLLBACK and SET
TRANSCATION.

SQL is a declarative language and is very easy to use. With SQL, we can create database, store data,
access database and can be used in integration with other programming language for web development.
We can use phpMyAdmin, a free and open source software tool for managing the MySQL over the web.
To create a database using SQL, following codes are needed.
CREATE DATABASE mydb;
 11

CREATE TABLE table_name(

column_name1 dataType,
column_name2 dataType

CREATE TABLE Customer (

Id int,
Name varchar (255),
Address varchar(255));
Basic SQL for CRUD Operations
To insert data: (CREATE)
INSERT into Customer (Name, Address)
Values (‘Reena’, ‘Nepal’);

To Read data: (READ)

Select * FROM Customer
WHERE Name =’Reena’;

To Update data: (UPDATE)

Update Customer
SET name=’Mohan’ WHERE Id =1;

To Delete record: (DELETE)

Delete Customer
WHERE Id = 1;

NONSQL database are built for specific data models that have flexible schemas for building modern
application. NoSQL database are widely recognized for the ease of development, functionality and per-
formance at scale. NoSQL database use variety of data models for accessing and managing data. Modern
applications such as mobile, gaming and web requires flexible, scalable, high performance and high
functional database use NoSQL database which provide great user experience. NoSQL database gener-
ally provide flexible schemas for more iterative development and to enable faster for these applications.
NoSQL database is generally designed to scale out by using distributed cluster of hardware instead of
scaling up by adding expensive and robust servers. NoSQL database are optimized for specific data
 12

models and access pattern that enables higher. Key value, Document Graph, in memory and search are
types NoSQL database. NoSQL database stores and manages data in such a way that allows for high
operational speed and great flexibility for developers. (w3schools, 2020)

3.10 XAMPP

XAMPP stands for cross-platform (X), Apache (A), MySQL (M), PHP (P) and Perl (P). It was created
by Apache friends. XAMPP helps in creating a local web server for developers which enables them to
perform test runs. Languages such as Apache, PHP and MySQL are needed to build web servers which
are all later accumulated together in a simple XAMPP file. Since it is cross platform product, XAMPP
works equally good on mac, windows and Linux. (Mening, 2018.)

XAMPP consists of four important components which are Apache, MySQL, PHP and Perl. Apache helps
in delivering web contents to a computer which is also the most used web server application. More than
half of the websites are using Apache as their web server which makes it very popular among the cate-
gories. (Mening, 2018.)

MySQL is simply a database which is then needed to collect data in order to make website operate
properly. It helps a lot in making or altering data by providing options such as add, remove and modify
data in a web server. PHP is a server scripting language which is used to develop static or dynamic
websites or applications. Perl is a dynamic programming language which is used in network program-
ming and system admin. The fully configured XAMPP control panel before starting to run is displayed
the figure below. (Mening, 2018.)
 13

Figure 4. XAMPP control panel.

3.10 REST

Rest is an architectural style for web developing. It is popular among developers due to its simplicity
and the fact that it builds upon existing systems and features of the internet HTTP in order to achieve its
purposes as opposed to create new frameworks and technology. In the REST architecture clients send
request to retrieve or modify resources and servers send responses to these requests. Some of the con-
straints of rest are client server, stateless, cacheable, layered, optional code on demand, uniform inter-
face. REST uses a standardized set of request methods including: GET, POST, PUT, DELETE and other
existing HTTP capabilities. REST is based on standard HTTP .REST architecture allows developers to
quickly implement the data validation because of the performance, security, flexibility, extensively and
ease of use.

3.11 Node,js

Node.js is free open source server environment which uses asynchronous programming to build and
run web applications. Ryan Dahl introduced Node.js in 2009. We can run Node.js on various platform
such as Linux, Windows, Mac OS and so on. Node.js can be easily downloaded to user Pc from
nodejs.org. Users can easily create, read, write and close files on server and also easily delete add and
 14

modify data in database. Node.js is light-weighted as this uses event-driven architecture. Everything
done within Node.js, every call is chain of asynchronous callbacks. Node.js uses non-blocking I/O
models. Node.js has built-in modules is a set of functions which can be easily used while developing
application without any further installation. Many cloud-based servers support hosting of Node.js.
Node js application can use different object database such as MongoDB, traditional SQL database.
Node.js plays a critical role in the technology stack of many high-profile companies who depend on its
unique benefits of Node.js.
 15

4 CONTENT MANAGEMENT SYSTEM (CMS)

A content management system is for creating, managing, and optimizing the customers digital experi-
ence. CMS is a software application that allows users to collaborate in the creation, editing, and produc-
tion of digital content, web pages and blog posts. A content management system or CMS is a software
that allows creating, editing, organizing, and publishing content. WordPress is a Content Management
System that allows to create and publish content on the internet. (Patel, Rathod & Prajapati, 2011)

WordPress allows clients to have full control over the files, documents, as well as the design and display
of the content. One does not have to know about coding to publish content using WordPress. CMS is all
about allowing any users to create and manage their content without any technical knowledge. User can
enjoy plenty of web design templates which make easier to custom design without writing code and
learning programming. CMS is cost effective and affordable. Users can change content and design more
efficiently. CMS provide Optimized SEO with help of many plugins. Developer can either use existing
plugin or can build their own theme from scratch CMS provide framework which mean user can focus
on development and improve functionality rather than spending time for building database. Developers
team can easily collaborate for project work. CMS comes with plenty of plugins and theme so that user
can install them and use as per necessity. (Patel, Rathod & Prajapati, 2011.)

Drupal and Joomla are content management system platform which are difficult to use and learn, have
more flexibility and comes with more built-in features in comparison of WordPress. Although, Word-
Press in more popular among people with its ease of use, plenty of plugin and theme and huge global
community. (Patel, Rathod & Prajapati, 2011.)

4.1 JOOMLA

JOOMLA is the award-winning content management system which is a free open source to publish
content got the World Wide Web. Object oriented programming (OOP) and PHP language are used to
create JOOMLA. It is getting popular among blogs, e- commerce sites, and small, large-scale companies
as it is free, flexible and easy to install. It helps users on editing Meta information directly on the Front
end of the page and incorporates the automatic mode for data engendered. (Mening, 2019.)
 16

4.2 WordPress

WordPress is a free and open-source content management system based on PHP and MySQL which
includes the plugin and templates. It was released by Matt Mullenweg and Mike Little in May 2003.
WordPress is the most popular web management system because of ease of use and reliability. Word-
Press is also called “the dominating force” and is among the best of all the content management system.
It also needs third party to work which means CMS works only when installed on a web server. Word-
Press is OSS that is licensed under the GNU General public license (GPL) which means it is not owned
by a single company or entity. WordPress is defined as an open source content management system in
which we can create our own website or blog in a popular way. There is an open source community
which helps to make WordPress even better. WordPress supports all media types so that user can use
any combination of text, images and videos on your website. Some of the popular website are business
websites-commerce stores, blogs, social network and pretty much anything else you can dream up. It is
one of the open source software. So, nowadays it is made by a huge community of contributors. Word-
Press is mainly used by individuals, big business and everyone in between. Nowadays, WordPress is
growing community of developers, designers and bloggers. Several developers and users come together
to keep the spirit of open source software, meaning constant improvement, accountability and free usage
for everyone. Any desired kind of websites such as blogs, e-commerce websites, business websites,
portfolio websites, forum websites and e-learning websites can be made without having a knowledge of
any coding. It powers both the Front end and Back end of the websites which makes it most in today’s
world. Even as a beginner, WordPress allows anyone to publish and build content in the simplest manner
with minimal cost, ease of use and flexibility. According to usage statistics of CMS, it shows that about
36% of all the websites on the internet is powered by WordPress. The detailed chart is shown in the
figure 5 below. (Mening, 2019.)
 17

Figure 5. Usage statistics of CMS (W3Techs, 2020)

WordPress is extremely cost effective. Thanks to WordPress, gone are the days when creating a website
will cost us an arm and a leg. WordPress designing and development is extremely cost effective. Also,
the upkeep and maintenance expense are relatively cheap as we can do it our self instead of hiring a
designer every time we need to update the content of our site. If we decide to develop WordPress theme
website, we can make changes to our site anywhere we are as long as we have access to the Internet.
WordPress is SEO friendly. Websites built using WordPress have simple codes which makes them per-
fect for Google indexing. SEO components for each page can also be personalized giving us full control
on which pages we want to rank high in search engines This is a highly efficient way to earn arriving
links to our site. (Mening, 2019.)

With mobile traffic surpassing normal desktop traffic day by day, responsive web design is no longer an
option but a must. When we use a WordPress website design, we automatically get the advantage of
responsive web technology without the need to develop discrete websites for different devices. Adding
new features and functionalities can be extremely weighty for traditional websites, especially those that
are created using cultured platforms. This is the exact opposite for WordPress-based sites. There are
plugins that we can easily install which takes just few steps. Further, the WordPress community is very
lively and almost every best practice is documented. So, if new features to a website is needed, chances
are, there are other WordPress users out there that have documented what should be done. In an era of
online marketing when fresh content is of extreme importance, a WordPress theme website has an edge
 18

over the traditional ones in many ways. It takes only seconds to update our site’s content and we can do
so as much as frequent we want without needing to go through several complicated process. We can also
update our site’s design in a breeze making it an ideal platform for tactical campaigns (i.e. Holiday
promotions, etc.). Additionally, being able to update our content frequently will help us and our organi-
zation build credibility in our niche. (Mening, 2019.)

Another benefit of opting to develop WordPress theme website is the smooth integration with social
networks. We do not need to login to our social accounts such as LinkedIn, Twitter, Facebook or
Google+ accounts one by one as WordPress automatically lets our social networking community know
that we have fresh content out there. One of the main blames against WordPress designing and develop-
ment when it was first considered was poor security. This myth has been discredited. As long as we have
good WordPress web designers and developers, we can strengthen our site’s security and make it ex-
tremely safe and secure. The same cannot be said for traditional sites. Unless we are really loyal to our
web designer or design firm, chances are, there will be several designers or firms that will work on our
site. Before, this is extremely difficult because each designer or firm has its own preferred platform.
WordPress designing operates on a universal open source platform which makes transition from one
designer to another less complex. (Patel, Rathod & Prajapati 2011.)

To develop a webstore with WordPress one should follow the steps. Firstly WordPress website platform
is needed to create a webstore.. It is open source and it is also free to use. WordPress is fast, optimized
and secure to develop webstore. Second step is to develop webstore is to pick a name for the website
and buy a domain and hosting. After buying domain name now it is time to get familiar with the Word-
Press user interface. In this step user should get permalinks and make site public so that the public can
find users site. After that user should pick a theme/design for the website. Next step is to get plugins to
extend the website abilities. Plugins extend the standard functionality of website by adding some much-
needed features. Next step involves creating basic pages for webstore such as adding some detail about
store, contact details and other privacy policy. The final step is adjusting site navigation and making it
overall easier to consume for the visitors. (Patel, Rathod & Prajapati 2011.)

WordPress helps to build e-shop in different way. While using WordPress there will be the less cost if
we compare with any website build from scratch. Developers are easily available in WordPress. Word-
Press is easy to update. Without paying developers users can simply login to a WordPress site. User gets
full control over the website. There are lots of theme and plugins in WordPress which are available for
 19

free of cost. WordPress is an open source platform. User need to host their own site and install plugins
like woo-commerce for e-commerce tools. WordPress is self-hosted software and is for more technically
advanced. User can create just about any types of website with WordPress including online stores. One
of the best open source E-commerce platforms of WordPress is woo commerce. Woo commerce help to
build e-shop. To install woo commerce user should first get a domain name and web hosting after that
user can install WordPress. After installing WordPress user should install woo commerce plugin. User
should add first products and choose a theme for online store after completing the installation of plugin.
Then at last user should extend woo commerce. (Patel, Rathod & Prajapati 2011.)

While building e-shop from scratch there will be difficulty of development. Startup will be very hard as
developer have to plan for everything such as design, layout, contents, banner and much more things to
make successful website. This process of making website with coding take a lot of time. In process of
creating our E-commerce website we spend a lot of time on planning for how website design. When we
started to code we face many errors at the time of coding and fixing the error was hard and time taking.
One should be pro in writing code and web design to make successful responsive design easily with
coding. It requires serious expertise, skills and Human Resources. In WordPress one should not have to
struggle for own theme design and content as responsive readymade themes are available on library.
There will be high cost to build e-shop from scratch while WordPress have a low cost compared to doing
all the technical part from scratch. (Patel, Rathod & Prajapati 2011.)
 20

5 WEBSITE DEVELOPMENT PROCESS

Building a well-functioning website is an integral part of a successful business. Developing a website

can be hectic and lengthy if ignored the basic process involved. Some of the basic process involved are
information gathering, design, content writing and assembly, planning, coding, testing, review and
launch. Here in this thesis we are going briefly about the topics such as user requirement, design, imple-
mentation and publishing.

5.1 User requirement

Requirements are needed to complete the project as well as for visualizing the project. Web programing
languages or tools for making the websites are the requirements for the construction of the website.
There are various tools and technologies that can help to create the website. Choosing of the tools or
technologies must be proper because higher level technologies gives the better website. More require-
ments will give more focus and help with the website. Website requirements tells not only the functions
and capabilities that the website must have but also what it allows the user to do. Before even explaining
what the requirements are, one needs to specify the stakeholders. (Welling & Thomson, 2003.)

There are various types of requirements which comes together during the process. Business require-
ments, functional requirements and user requirements are the categories of website requirements. Busi-
ness requirements in the website are often the objectives that the clients are looking forward to solving
problem with. Functional requirements are all about what is needed for the development of the website
and how the website should operate. Likewise, user requirements in the website development specify
the user expectations and their interaction with the website. Website requirements tell what the website
should have and how they allow the users to interact with the site. (Welling & Thomson, 2003.)

5.2 Design

Design of web structure diagram is needed during planning of website development to understand pur-
pose and navigation. Website structured diagram will give clear vision of website from which developer
and customer can discuss whether adding or removing some features are necessary or not. Well structure
diagram and discussion give focus and main idea to develop good website.
 21

Figure 6. Structured web-diagram

Database designing helps in producing database systems that meets the user requirement along with
high performance. In terms of storage space, well designed database helps in easy maintenance, con-
sistency in data improvement and making it cost effective

5.3 Implementation

The process of putting a plan into effect is Implementation. In order to make the website ready to be
published, all the steps mentioned above were executed and followed with care. Implementation involves
all the practical work done during creating process such as creating webpages, posts, creating navigation
bar, side menu and placing the contents. Technologies such as HTML, CSS, JavaScript and PHP are
used as per the requirement of a website. This part also includes testing, testing of website is done time
to time to conform it is running smoothly and in correct form. The website becomes ready to be published
once all the steps described above are executed for the development of a website. (Welling & Thomson,
2003.)
 22

5.4 User experience

User experience measures how easy or difficult the product is to use. In other words, it is also called as
usability. Usability can be best described as the degree to which a website can be used by visiting users
with efficiency, ease and satisfaction to achieve the desired goal. In order to maintain high user experi-
ence, web developer should develop website in such a way which is easier to find upon searching and
surf through without any complexion. Many open source website usability software are available easily
on the internet with few having free trial period as well, which makes the process inexpensive and less
time consuming. Usability plays an important role as it is all about customer service. Usability is an
essential condition for survival on the web world. People do not tend to wait around if the homepage of
a website fails to display what the company or an organization is offering.

5.5 Website testing

Web testing ensures a site is working for users by testing functionality, reliability and performance. The
various questions such as: is the website responding well regardless of the user’s model of device, oper-
ating system, does the website perform securely, without leaking any information or losing any data,
does the website performs good under fairly low internet connection with consistency, Should all be
answered while testing website. A fully tested website helps in increasing user confidence, improving
search engine ranking, drawing more inbound links and driving enquiries and interactions. Having a
website out there on internet is not only enough. To be effective, a website must run properly and the
only way to ensure that is by testing the website before publishing it online for users. Based on require-
ments, there are many types of testing performed such as usability testing, interface testing, security
testing, database testing, functionality testing and compatibility testing. Webload, test IO, testcraft,
lambdatest and experitest are some of the most popular website testing tools available.

5.6 Publishing

Publishing of the website needs domain names so that anyone can get access to the website from their
own place which is possible using web server. Domain name can be brought online which is later used
to publish the website. Publishing might differ from the nature of a website. Microsoft IIS and Apache
are the best tools for static websites whereas for more dynamic, database should also be connected with
it. The web server runs the website which also configures the domain name and IP address. Publishing
is the process of making your website visible and usable to outer world by posting the content on the
 23

internet. The website is only published when it is completed, tested and approved by clients. The pub-
lisher can publish the website with the help of internet connection, domain name and a web server to
host.

5.6.1 Website promoting

With the rapid increase of internet users, website is one of the most important marketing tools there is
in todays world. With the increasing popularity of internet,a huge online consumer marketing has been
already created. Optimizing the content for search engines or better known as search engine optimization
(SEO) helps in making a website visible to public. Page titles, image descriptions, URLs and natural
keywoards are some of the most common search engine optimization targets. Social media could be
another important tool for website marketing or any marketing in general. The best way to promote a
website is by interacting with users through various social media platforms. Reciprocal linking can also
be another fascinating tool which is in fashion these days. Reciprocal linking basically means sharing
each other contents on a website. It involves creating a link or a logo on the website and when clicked
on a embeeded link, the use is then directed towards the companys website. (Wilson, 2011 )
 24

6 OUR WEBSITE PROJECT

This project is the making of an E-commercial website for a virtual electronic company called “NF-
Electronics”. In this project, the website is created where users can easily access any electronic devices
offered by the company and make purchase if needed. Website can be updated at any given point of time
if products must be added or reduced as per the user requirement. After the website is published online,
anyone can get access to it by simply having a stable internet connection and correct web address.

After the connection is established, user can surf through the website, choose products, add them to cart
and register their details before making payments. User registration was taken very seriously in this
project as it brings a lot of convenience and ease for regular customers who often visit the site. For
example, if a user registers their account once in the database, they can simply log in with their user id
and password for the next visit. The website consists of a side bar where all the brands and products are
listed, upper navigation bar and product page. Whereas the navigation bar consists of home page, all
products, my account, shopping cart, contact us and logout.

6.1 User Requirements

NF electronics E-commerce website was developed considering User Requirements. New users are able
to register themselves, search products, add to cart, deselecting product from cart ,login, logout, user
account setting .Also from administration data manager can view the users and able to delete users .New
product can be added to E-commerce website at any time. XAMPP is very important for a web developer
which contains bundles of web application, database and scripting language which helps to create local
web server for testing and deployment. First step was installation of XAMPP server to developer com-
puter for testing website from starting of project. Apache and MySQL should be started to run local web
server. Developer need to click start button of right side of apache and MySQL which is shown in fig 3.
After testing the user requirements from XAMPP server following diagram show how user going to
interact with system. User requirement were tested from XAMPP server. Use case named Login and
Register are described in table of description below in table 1 and table 2.
 25

Use Case ID: 001

Use Case Name: Login
Created By: Reena Budhathoki Last Updated By: 31/05/2020
Date Created: 30/05/2020 Last Revision
Date:
Actors: Admin, Registered customer
Description: Actors can login with their credentials to use the system
Trigger:
Pre-conditions: User has already created an account and can access it using email and
password
Normal Flow: User is already registered and can access services provided by the system
Alternative Flows: User does not have an account and has to register
Frequency of Use: Every time user has to access more advanced system functionality

Table 1. Table of description

Use Case ID: 002

Use Case Name: Register
Created By: Reena Budhathoki Last Updated By: 31/05/2020
Date Created: 30/05/2020 Last Revision
Date:
Actors: New user
Description: New user can register with their personal information to use the system
Trigger:
Pre-conditions: User want to check out or buy products.
Normal Flow: User should have real registering detail.
Frequency of Use: User wants to buy products

Table 2. Table of description.

 26

Figure 7. Use Case diagram

6.2 Design phase

XAMPP offers MySQL database server, apache web server, PHP and Perl in one package. MySQL
database server is used in this project to create database. To run XAMPP Server developer need to start
Apache and MySQL from control panel and browse localhost/phpMyAdmin/. This will lead to
phpMyAdmin page database can be created in easy way. To create a database design, developer needs
to click on database and type name of database, click create and new database is ready to use. In this
 27

project, database named E-commerce_cms_electronics was created. Inside database, different table with
table name and columns can be added to store data. The figure 8 and 9 shows php script to connect server
and proposed database design respectively.

Figure 8. Establishing connection with database.

Proper Connection to MySQL server was made from php script. Database host, username, password and
database name is needed. In our case database host is local host, username, password is root for XAMPP
users and database name is E-commerce_cms_electronics.
 28

Figure 9. Database ER diagram.

Designing was by far the trickiest part of the website project. After gathering all the requirements, next
step in a website development is to determine what type of design should be implemented in the website.
It is one of the most important steps in a website development process. Designing in website develop-
ment is almost like making a blueprint for the website. The initial phase of the designing involves steps
such as navigation structure and planning a site structure.

Creating a wireframe and a layout of a website is the final and the most important phase in web devel-
opment which can also be called as a skeletal structure of the website which clients have been waiting
for. Designing is something that must be done not only in website development but also in almost every
software development. A website is the collection of well-structure webpages which involves different
phases like database design, server design and webpage design. To run the website in real-time, there
must be the server installed. The website design and database design can be designed after designing the
server. In order to store the information, database is needed which further helps in storing every single
 29

detail provided by user while signing up. Figure 13 illustrates the main page design and figure 14 shows
the coding of the index page.

Figure 10. Front page design.

6.2.1 Database design

Database designing produces logical and physical designs model of the given database system. Brand
table was created to store brand name with unique brand_id. There are 2 columns, one is for brand_id
and another is for brand name. In this project, brand names which is termed as brand title HP, Samsung,
LG, Apple Lenovo, Canon, Sony, OnePlus, Huawei with brand_id 1,2,3,4,5,6,7,8 respectively. Admin
can edit and delete brand name from this table.
 30

Figure 11. Brand table in phpMyAdmin.

Cart table is used to store cart products which are selected by users. When user visit our electronics
website, they will select products they want to buy and add it to cart. In fig 8, one user added two items
iPhone XR and Huawei P30 on cart and these items were stored on cart table. If user removes iPhone
XR from cart, then only one item will be stored on cart table.

Figure 12. Cart table in phpMyAdmin.

Categories table is to store the category of products with unique id. There are five types of category of
electronics product in our project. There are two columns of table one is cat-id which is id of product
 31

category and cat-title which means category of products such as laptop, cameras, mobiles. Admin can
edit and delete category of products from database.

Figure 13. Categories table in phpMyAdmin.

Product table is to store all products of our E-commerce website. More than 30 products with product
information are stored in products table. There are 8 columns in this table. Product_id is id number of
product and it is unique for each product. In Product_cat columns cat-id of categories table can be seen.
Product_brand of products is also same as brand_id of brand table. Product_title is name of product and
Product_price was stored as per market value. Admin can add edit and delete product from database as
per necessity.
 32

Figure 14. Products table in phpMyAdmin.

User table is last table of E-commerce_cms_electronics database. Users should fill registration form
with all personal detail such as name, email, password, address, contact and image. All this infor-
mation will be saved on this user table with unique id. Admin can edit and delete user information if
needed.

Figure 15. Users table in phpMyAdmin.

 33

6.2.2 User interface design

The user interface design is also often called a website wireframe which specifies the size and parameter
on the elements on the page. Layouts are often very simple without any color grading, logo or any con-
tents really. Layout is very important part in website development process because it acts as sketch or
blueprint for designing a website. The homepage of the website has a navigation section, left side bar
section, product section, login and register button, cart, navigation and finally the footer section. Navi-
gation is always a top priority for any websites as it makes surfing menus easy and effective.

The simple and easiest way to create a layout is with the help of pen, pencil or paper. There are several
other tools that can be used to sketch a wireframe such as Flair builder, Microsoft Visio, Axure for PC
and Smart Draw. The coding of fig shows the styling of NFelectronics with CSS. Design layout can be
changed anytime by using CSS style. The Layout for the project is created as shown in figure below.

Logo Search engine cart login registration

Navigation Bar

Side bar Products

Footer
g

Figure 16. User interface design.

 34

Navigation is always a top priority for any websites as it makes surfing menus easy and effective. For
this project the navigation bar is placed at the topmost section horizontally. There are many advantages
of having a simple horizontal navigation bar and saving a lot of content are space is one of them. For
this website, following menus were created in the navigation bar as per the user requirement: home, all
products, my account, shopping cart, contact and logout as shown in figure below.

Figure 17. Navigation Bar.

The search bar is also created in the navigation panel to find desired product easily available in a single
search and click instead of browsing through all the products. For this website, the side bar is created at
the far left hand side of the page leaving space on the right hand side to view all the element of contents
from home page. The side bar is simple and smooth to navigate through which contains categories and
brand names. The categories tab contains items such as Laptops, cameras, mobiles and desktops.
Whereas, the brand name shows the same items by sorting it out with brand names.
 35

Figure 18. Side Bar.

6.3 Dynamic content

In the context of World Wide Web and HTML dynamic content refers to the content that is delivered to
user depending on user interactions, timing, needs and various other parameters. Each individual is al-
ways looking for different products while surfing on the internet. Thus, the content differs from users to
users. In other word it is also known as adaptive content. It is very customizable and each response can
be made based on the request made by the user. Dynamic content provides result to the users and allows
the user to submit their request or information which makes it very interactive. In this project, we have
tried to give our client a very dynamically responsive website by putting contents such as insert product
page, database table for insert record, displaying dynamic content by user ID on homepage, detail page,
all products age and search engine.

Since this is online store, it is very vital for clients to add and remove their products from their online
store. Thus, the insert product page was created where clients can easily modify their products as per
their needs. The product page contains table which gives them option to choose product title, product
category, product brand and product images, product price, description and keywords about each indi-
vidual product as shown in figure below.
 36

Figure 19. Insert product page.

When the products are modified in their website it is essential to make changes in the database as well.
PhpMyAdmin is used to store and modify data as per the need of client. After the product is added
from insert product page, it is automatically stored in the database and it also can be modified directly
from database table itself.
 37

Figure 20. phpMyAdmin panel

After adding or removing products from insert product page or database table the result should be shown
directly on the home page as the homepage should be displaying all the dynamic content. For example,
if a client adds a product named ‘Lenovo laptop’ in their database then the home page shows the respec-
tive product automatically on it gathering all the requests and information given on the insert product
page.

In case of user wanting to look at all the available products offered by the store, they can do so by going
to ‘All products’ menu which is available on the navigation bar on the topmost part of the website.
Similarly, in case of only wanting to look at one particular product, that can also be done by just going
on to ‘search product’ menu which is made available for the convenience of users. For example, if a user
wants to look a product called ‘Desktop dell’, he/she can go on to the search bar and type in the keyword
and result only shows a product called desktop dell.
 38

Figure 21. All product pages.

6.4 Shopping cart

Shopping cart in internet is not much different then shopping cart in real world. It is a function that
enables users to make a purchase of products or services. Having a well-made shopping cart is extremely
important as it acts as the bridge between shopping and buying.

In this project, users can add and remove products from cart as per their need. There are four columns
which consists of remove option, product name, and quantity of products and price of a product as shown
in figure below. User can add product from main page by clicking on add to cart button .The products
which are selected to add in cart can be seen in shopping cart page .User can remove product by click
on remove box which is on left side of each selected product after that user have to update cart .
Continue shopping page will redirect customer to main page where user can search for more products.
Checkout button will redirect user to payment page where user can make purchase of their choices.
 39

Figure 22. Shopping cart

6.5 User Registration

Registering user into system is always a smart and systematic approach to database. For a website to be
user friendly it must have user friendly registration system which is simple and clear to user’s visiting.
In this project, the registration form is very simple which contains Name of a user, E-mail address,
password, user Image, country, city, contact number and lastly user address. Users are compulsory re-
quired to fill in their Name, e-mail address, matching passwords, country and address, whereas images
and city are optional. User cannot have two accounts from one email id. If email is already registered
and exist in system database the error message saying “Sorry, email is already taken, please try again
with another email” will be displayed on screen. When all the required fields are filled out, the registra-
tion will successful and the record will be saved on database unless the user personally wants to edit or
delete their user account. The registration form is as follows.
 40

Figure 23. Registration form.

6.6 Login and user interface

After the user completes successful registration of their details on the website, they can login on the
website with correct email address and password given while registering. Upon entering incorrect email
address or a password the error message saying “password or email is incorrect, please try again” will
be displayed in screen. Forgot password option is made available if in case any user finds it hard to
remember. The password recover message is send via link to users email address where they can create
new password for further use.
 41

Figure 24. Login page.

User interface can simply be put as a connection between human and a computer on a webpage, appli-
cations or in any devices. The user interface should be efficient, simple, easy and user friendly in order
to be successful. After a user is logged into a system, it is very essential to give them their freedom of
changing their own details provided to website. Since the goal of this project was to create a very user-
friendly website for e-commerce store, we have provided users that opportunity to tweak and edit their
account details later on even after registering an account. In this edit account interface, users can edit
their name, password, e-mail address, profile image and contact address.

The edit account page consists of a side menu on a right-hand side of a webpage with options: Edit
account, change password, delete account and logout as shown in figure below.
 42

Figure 25. Edit profile.

6.7 Publishing

Website is made visible to everyone once it is made fully functional and published online. Publishing a
website out there in the internet was the last step of our project. Firstly, before publishing a website a
domain name and host is needed. The domain name is also known as website address or a web address.
The domain name for this project is ‘nfelectronics.com’. Domain name can be purchased from various
hosting companies like Go Daddy, Domain.com, 000webhost.com and many more.
 43

Figure 26. 000webhost site(000webhost.com)

 44

Figure 27. Godaddy webhost(www.godaddy.com)

 45

7 CONCLUSION

E-commerce business has replaced traditional shop of buying and selling product. Development of
technology made rapid growth of online business in modern society. Demand of online purchasing is
rapidly increasing. Form business point of view E-commerce had created a lot of opportunity to fresh
starter as they can startup business with low cost no need of physical store they just need to have one
online website where they showcase their products and services. E-commerce business need modern
attractive web design, effective marketing with quality product and good customer service to be suc-
cessful.

The main purpose of thesis project was learning development of E-commerce website with CMS in
PHP and MySQL. Planning for making website was hardest part. Development of E-commerce web-
site is often hard if one does not have proper knowledge where to start. Planning give more focus and
clear path to create website Developer has used different web tools and technology to create website.
With proper plan and implementation developer create E-commerce website names NF electronics
which online store of electronics products where customer convenience. Customers can create account,
easy access 24/7, choose variety of electronics products, compare prices, and finally order product.
This will help to save time and effort of customers. Project will be modified in future with adding
PayPal payment system and other new technologies as per necessity.

In conclusion, thesis was about the development of E-commerce electronics website. We get good
knowledge of E-commerce website, web tools and technologies which will be very useful in further
study and working life.
 46

REFERENCES

Dose M & Lilja H. 2015 page :4-6. A schematic for comparing web backend application frameworks.
Available: http://publications.lib.chalmers.se/records/fulltext/219826/219826.pdf . Accessed 3 January
2020.

Fernandes, J. 2014. Types of e-commerce. URL: http://bloomidea.com/en/blog/types-E-commerce.

Accessed: 3 January 2020.

W3schools. 2020. Available: https://www.w3schools.com. Accessed 15 January 2020.

Duckett J. 2014. JavaScript and jQuery: Interactive Front-End Web Development 1st. Accessed 02 Feb-
ruary 2020.

Powers, Shelly. 2006. Learning JavaScript. Accessed 02 February 2020.

Murugesan S, Deshpande Y, Hansen S & Ginige A, 2016. Web Engineering: A New Discipline for
Development of Web-Based System. Accessed 05 February 2020.

Shelly, B. 2012. Web Design Introductory, p69: Planning a successful Web Site: Part1. Accessed 09
February 2020.

Stout.2016.5steps to planning a successful website. Available: https://www.creativebloq.com/fea-

tures/5-steps-to-planning-a-successful-website .Accessed 05 February 2020.

W3Techs, 2019, Usage of content management systems. Available : https://w3techs.com/technolo-

gies/overview/content_management. Accessed 07 February 2020

Biglione K.2017. WordPress Themes and Templates Explained. Available: https://wpappren-

tice.com/blog/WordPress-theme-vs-template/ .Accessed: 10 February 2020

Sabin-Wilson, L. 2010. WordPress for Dummies 3 rd., p204: Finding out what plugins are. Accessed 14
February 2020

Murugesan S, Deshpande Y, Hansen S & Ginige A, 2016. Web Engineering: A New Discipline for
Development of Web-Based System. Accessed 18 February 2020.
 47

Shelly, B, 2012. Web Design Introductory, p. 27. Web templates and other Technologies. Accessed 24
February 2020

Shelly, B. 2012. Web Design Introductory, p. 69. Planning a successful Web Site: Part1. Accessed 26
February 2020

Brown, B. 2011. How to use the internet to advertise, promote, and market your business or website.
2nd edition. Florida: Atlantic Publishing Group, Inc.