E-commerce Web App Development: Design & Implementation

Desklib provides past papers and solved assignments for students. This project details e-commerce web app development.

Web Application Development

Table of Contents
Introduction....................................................................................................................................................3
LO1 Understand the concepts of web application development...................................................................4
1.1 Critically evaluate the functions and advantages of web applications..........................................4
1.2 Critically compare different types of server-side and client-side scripting languages..................5
1.3 Examine web security concerns and make recommendations for security improvements............6
LO2 Be able to design web applications........................................................................................................7
2.1 Design a web application to meet a given requirement.......................................................................7
2.2 Synthesize client-side and server-side functionality in a web application........................................10
2.3 Apply a database design for use in a web application.......................................................................12
2.4 Evaluate alternative designs and solutions to meet given requirements............................................12
LO3 Be able to implement a web application..............................................................................................13
3.1 Implement a web application to a prepared design using client-side and server-side scripting
languages..................................................................................................................................................13
3.2 Implement a web-enabled database management system to store, retrieve and manipulate data in a
web application........................................................................................................................................16
3.3 Identify and implement opportunities for error handling and reporting............................................18
LO4 Be able to test web applications..........................................................................................................19
4.1 Critically review and test a web application using a web-enabled database management system....19
4.2 Analyze actual test results against excepted results to identify discrepancies...................................20
4.3 Critically evaluate independent feedback on a developed web application and make
recommendations for improvements........................................................................................................21
Conclusion...................................................................................................................................................21
References....................................................................................................................................................21
Figure 1: Server and Client-side scripting.....................................................................................................6
Figure 2: Home page wireframe....................................................................................................................9

Figure 3: Contact Us wireframe.....................................................................................................................9
Figure 4: Login page wireframe..................................................................................................................10
Figure 5: Laptop product wireframe............................................................................................................10
Figure 6: Tablets product wireframe............................................................................................................11
Figure 7: Desktop PC product wireframe....................................................................................................11
Figure 8: ERD Diagram...............................................................................................................................13
Figure 9: Home page....................................................................................................................................14
Figure 10: Login Page..................................................................................................................................15
Figure 11: Contact Us page..........................................................................................................................15
Figure 12: Laptop product page...................................................................................................................16
Figure 13: PC product page.........................................................................................................................16
Figure 14: Tablet product page....................................................................................................................17
Figure 15: Database file...............................................................................................................................17
Figure 16: Database.....................................................................................................................................18
Figure 17: Database code.............................................................................................................................18
Figure 18: Database next line code..............................................................................................................19
Figure 19: Complete Database.....................................................................................................................19
Figure 1: Server and Client side scripting......................................................................................................5

Introduction
This assignment basically depends on the development process of a web application. The task of
this assignment is to create and develop a web application. In this task, I am going to create an e-
commerce based web application. This is basically a web application so I am going to use
HTML, CSS, and PHP to create this web application. There are multiple design process and
implementation process available to create a web application and in this documentation, I am
going to explain each and every aspect of developing a web application. The basic aim of this
assignment is to enhance the knowledge of basic scripting language and web application also.

LO1 Understand the concepts of web application development
1.1 Critically evaluate the functions and advantages of web applications.
The web application is the process to create and develop a web application. The basic aim to
create a web application is to increase business schemes and basic policies also. In today’s
world, the development process of the web application is the most important scenario. Most of
the business in now days are developing a web-based application for their business to grow.
Most of the e-commerce website like Flipkart, Amazon, Alibaba, and others are using web-based
application for their business. This is the most important and widely used process in today’s
world. To develop basic web-based application there are two development process is to be used
first one is basic knowledge of website development process and the second one is the
knowledge of one scripting language. In the knowledge of basic website development language,
there are HTML and CSS is the main thing and for the knowledge of scripting language, there is
PHP which is very useful to create and develop a web-based application. There is multiple
business owner is using this web-based application like Google, Flipkart, Amazon, Yahoo, and
others. In the process of development of a web-based application each and, every page of the
website should be created properly with each other. This is the most important which every web
developer need to remember. The length of code should be less so that the website can be host
easily if the website will be heavy size at that time the hosting process will take more time.
Advantages of a web application:
There are multiple advantages of the web application. Some of basic and the most important
advantages are given below:
 Multiple Platform Compatibility
 Effective Manageable
 Highly Deployable
 The functionality of Live Data Security
 Cost reducible functionality.
 Less time took the process
 Multiple browser compatibility
 Secure server functionality

Functions of a web application:
There are multiple functions of web application available and some of basic and the most
important functions are given below:
 Implementation of scripting language
 Compatibility of both server side and client side technology.
 There are data integrity process is available in the process of web application
development.
 Implementation of highly user interface capability.
 Web application supports user side and client side registration process.
 Database connectivity process is available in the process of web application development.
1.2 Critically compare different types of server-side and client-side scripting languages.
In the process of web application development process, there are two languages which are most
important thing to remember. These languages are the most important aspect to create and
develop a web-based application. Server side and the client side scripting languages are that most
important languages which used in the process of web-based application. The good knowledge of
these both languages are important thing for any web developer.
In the process of web application development, the script can be written in two-phase which is
server side (back end) and client side (server end). The basic difference between both the
languages is that the server side language directly connects with the server and the client side
language directly connects with the browsers.

Figure 1: Server and Client-side scripting
Server-Side Scripting:
Server-side scripting is the process or a technique which can run software on the servers. The
language or script which can easily run on the server is called the process of server-side
scripting. The server-side scripting language work in the back end and this work could not be
visible at the client side. In the process of server-side scripting language process, there is one
thing which is most important and that is server interaction. This server interaction process
allows the server to connect with multiple servers at single time. The server-side scripting
language can connect more than one server at a time. This is the most important aspect of server-
side scripting. The server-side scripting language is the most secure language in the process of
web application development. There are multiple languages which use server-side scripting,
which is:
 PHP
 Python
 RUBY
In this assignment, I am using PHP scripting language to create and develop a web-based
application. PHP is the most widely used server-side scripting language in the process of web-
based application. The PHP language is associated with SQL, it means while using PHP server-
side scripting language we need to use SQL to create database for the web-based application.

There is multiple websites which are using PHP scripting languages like Facebook, WordPress,
and Wikipedia.
Client-Side Scripting:
The client-side scripting language is used to develop that type of code which can run only the
client side’s browser. The client-side scripting language is the most important language is the
process of web-based application. There is no need of server-side scripting language in the
process of client-side scripting language. The client-side scripting supports multiple browser
compatibility functionalities. The client-side scripting work at the front end and the script of the
client side are visible among all the users. The client-side scripting language is used to reduce the
load of the server. The one drawback of this scripting language is that this language is insecure.
There are multiple languages which use a client-side scripting language, which is:
 HTML
 CSS
 JavaScript
In this assignment, I am using each and every language given above. This is the basic language
to create and develop a web application. The user interface which I am going to create in this
assignment is going to be done by all of this language.
1.3 Examine web security concerns and make recommendations for security
improvements.
The web-based application needs high security and trusted the secure server. The web-based
application has sensitive and private information and all that information should be secure so that
web-based application needs a high-security layer to secure their website from any kinds of bugs
and virus. This is the most important concern is nowadays how we can secure our website. There
is multiple web security concern available which is given below:
 Code Injection: Most of the hackers find unique way to insert malicious codes into the
website’s endpoint.

 Broken Authentication: This occurs when compromising the identification of the users.
In this process, the password might not be encrypted and the identification id of the user
might be predictable.
 Cross-site scripting (XSS): This of type security error is same as code injection but in
code injection, there is malicious code which is inserted into the website’s endpoint but in
cross-site scripting, there is a malicious script which is inserted into the website’s
endpoint. This cross-site scripting is known as XSS.
 Security Misconfiguration: This occurs when the password of the admin panel leaves as
default and this security misconfiguration happens only at the admin end.
 Complex Data Coverage: This happens when the security is not in the encrypted form
and the shield of the security can be a break at that time. This is the most important thing
which developer need to remember.
 Weak security access control: This is the biggest error when the developer or the
network administrator leaves the security lever in a very weak form. The hackers can
easily hack the weak network system.
LO2 Be able to design web applications
2.1 Design a web application to meet a given requirement
In this task, I am going to create and develop an e-commerce based web-based application. This
application I am going to create with the help of website development languages like HTML,
CSS, and JavaScript and with the help of scripting language like PHP. In this website, there is
multiple functionalities like user registration, order item, and others. This is the most important
thing which every web developer should implement while creating and developing a web-based
application and especially an online e-commerce website. To create a good web-based
application there are some requirements which website should meet:
 The user interface of the website should be attractive.
 There should be a proper menu, header and the footer available on the website.
 The website pages should be connected with each other.
 There should be less code to create and develop a web-based application.

 There should be proper user registration form in the website.
 The database connectivity should be correct.
 The image on the website placed accordingly.
 There should be proper login and registration page on the website.
 There should be an order form on the website if needed.
 The website should be platform compatible.
 The website should be run in different browser.
 There should be some security option on the website so that the data of the website will
be safe and secure.
 There should be feedback and the user review form for the user so that they can give their
review.
 The navigation or the MAP integrity should be there in the website.
The wireframes are given below:
Figure 2: Home page wireframe

Figure 3: Contact Us wireframe
Figure 4: Login page wireframe

Figure 5: Laptop product wireframe
Figure 6: Tablets product wireframe