Web Application Development Project: TechPro E-commerce Website

Desklib provides past papers and solved assignments for students. This project details the development of a web application for TechPro.

Web Application
Development

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 and make recommendations for security improvements................7
LO2 Be able to design web applications.........................................................................................9
2.1 Design a web application to meet the given requirement......................................................9
2.2 Synthesize client-side and server-side functionality in a web application..........................12
2.3 Apply a database design for use in a web application.........................................................13
2.4 Evaluate alternative designs and solutions to meet a given requirement............................14
LO3 Be able to implement web applications.................................................................................16
3.1 implement a web application to a prepared design using client -side and server-side
scripting languages....................................................................................................................16
3.2 implement a web-enabled database management system to store, retrieve and manipulate
data in a web application...........................................................................................................21
3.3 Identify and implement opportunities for error handling and reporting..............................23
Lo4 Be able to test web applications.............................................................................................26
4.1 Critically review and test a web application using a web enabled......................................26
database management system....................................................................................................26
4.2 Analyse actual test results against expected results to identify discrepancies.....................27
4.3 Critically evaluate independent feedback on a developed web application and make
recommendations for improvements.........................................................................................28
4.4 Create user documentation for a developed web application..............................................29

Conclusion.....................................................................................................................................32
References:....................................................................................................................................33

List of figures
Figure 1: Homepage of TechPro website......................................................................................11
Figure 2: Registration page............................................................................................................12
Figure 3: Login page......................................................................................................................12
Figure 4: Product page...................................................................................................................13
Figure 5: Basic functioning of client-side and server-side............................................................14
Figure 6: Database design of the TechPro website........................................................................15
Figure 7: TechPro Index 1.............................................................................................................17
Figure 8: TechPro Index 2.............................................................................................................18
Figure 9: PHP coding for Home page............................................................................................18
Figure 10: TechPro login page......................................................................................................19
Figure 11: PHP coding for login page...........................................................................................20
Figure 12: TechPro user registration page.....................................................................................20
Figure 13: PHP coding for registration page.................................................................................21
Figure 14: TechPro product page..................................................................................................21
Figure 15: PHP coding for product page.......................................................................................22
Figure 16: Database design for the TechPro..................................................................................23
Figure 17: User database...............................................................................................................23
Figure 18: Product database...........................................................................................................24
Figure 19: Error handling 1...........................................................................................................25
Figure 20: Error handling 2...........................................................................................................26
Figure 21: Product web page.........................................................................................................30
Figure 22: New user registration page...........................................................................................31
Figure 23: Homepage highlighting new products.........................................................................32
Figure 24: The TechPro website with logo on the web page........................................................32
List of tables
Table 1: Difference between PHP, JSP and ASP............................................................................6
Table 2: Comparison of actual results with expected results........................................................28
Table 3: Feedback from users........................................................................................................29

Introduction:
With the expansion of web technology, the web applications has taken an important role in every
sector ranging from domestic to industrial due uncountable number of functions and features.
The different functions performed by the web applications are discussed with its respective
advantages. Due to its working on the remote web server it can be accessible everywhere at any
time in 24 hours and 365 days. Different client side and sever side scripting languages are
differentiated on different parameters. Due to wide use of web applications in almost every
sector, it need to be prevented from many security pitfalls, therefore some preventive measures is
also listed along with the security issues.

LO1. Understand the concepts of web application development
1.1 – Critically evaluate the functions and advantages of web applications
The web app or computer program that is preserved on a web server and which perform its
functions on web browser or web page by making use of browser interface is called Web
application. Web application exists in different forms on a web server; some of the web
applications are simple while some applications have complex structure. The simple form of web
applications include contact forms and message boards, on the other hand gaming apps having
multiple interfaces and word processor are examples of complex web applications.
Advantages of web applications:
With the rapid advancement in web technology, the web applications have end number of
advantages in current technological era and are far better than the desktop apps. One of the
primary advantages of web applications is its convenience. It is accessible to the user at any time
and at any place in the world. The only basic requirement the user need to have is the internet
access and then user can easily get his/her data as per the need in their phones and computers or
any other device without confined to the four walls of office. Secondly, all the major platforms
and web browser support web applications. They can be easily used on different web browser
ranging from Mozilla Firefox to google chrome and different operating system. Also, web
applications need not to be installed unlike desktop applications. Therefore the tedious task of
installing apps is eliminated which saves user time. As web applications works and stored on
internet servers, so it does not consume any space in the user’s device local storage and infinite
storage is available to the user in the form of cloud storage. Web applications are always updated
as every user is accessing it through the same URL.
Functions of web applications: Now a day, Web applications are serving in every sector.
Therefore, it performs different functions in different sector. Web applications now a day used
for online shopping. Many are present from where the food can be ordered online. Many web
applications provide online education where online tutorials can be watched to learn different
topics. Also web applications are available as social networking platforms. Online payments can
be done using different web applications. Cabs can be booked online for easier convenience.

1.2 – Critically compare different types of server-side and client-side scripting
languages.
Server side Scripting language: The sever side scripting language is executed in the web
server. The script is implemented directly on the web server so as a dynamic HTML pages are
generated to complete the user’s request. The HTML page generated is sent to the browser of the
client. This scripting language aims in creating a interactive website which interacts with
different databases and be able to store data and information on the server. Some of the server
side scripting languages is:
 PHP
 JSP
 ASP
Table 1: Difference between PHP, JSP and ASP
PHP JSP ASP
PHP is mostly used as web
development language. It has very
low barrier for entry.
JSP have high barrier in
comparison to the PHP.
ASP has the lowest barrier to
entry.
PHP is very cheap. JSP is free. Less costly than PHP.
Acronym of PHP is personal home
page.
Java sever page Active server page
More robust than ASP More robust than PHP Least robust.
Supported by Apache server. Supported by Apache Tomcat or
JBoss or WebSphere, WebLogic
Supported by Microsoft IIS
server.
Client- side scripting language: The client side scripting language is implemented in the web
browsers. The processing of the information is done in the computer of the end user. The source

code is directly executed on the browser as the transfer of code take place from web server to the
user’s computer. The difference between different client sides scripting language is discussed
below:
VBScript:
 It is active scripting language.
 Executed both on server side and client side.
 Supported by internet explorer
 It is not vase sensitive
 Developed by Microsoft
 Use to validate server side
 It is light weight
 The syntax of this language is derived from basic language
 File extension is .vba or .vbs
JavaScript:
 Widely used on web browsers
 Developed by Netscape
 Executed only at client side
 Supported by all the browsers
 Use to validate client side
 JavaScript is a case sensitive language
 Syntax is derived from C language
 File extension is .js
JQuery:
 It is fast and short JavaScript library.
 It is not a programming language.
 It is a JavaScript library.
 It is compatible with every browser
 Designed to solve many browser compatibility issues

 It is rich in features.
1.3 – Examine web security and make recommendations for security improvements.
With wide use of web services, there are many security pitfalls are found while deploying any
web applications. So, to improve the software security some preventive actions need to be taken
as discussed below:
Injection flaws: Injection failure generally occurs when the unauthorized input is not filtered.
The untrusted and unfiltered data input when passed to the various servers like LDAP sever
(LDAP injection) SQL servers (SQL injection), browser (XSS), etc. The major problem in
injection flaws is that data input and other commands are automatically injected in the SQL
server, browse server and LDAP server which results in loss of client data and the hijacking of
web browser.
Preventive measures for injection flaws: The data received from the unauthorized and
untrusted users need to be filtered. Filtering all the data received is very tedious task, so the
framework’s filtering function need to be used.
Broken Authentication: Broken authentication is one the most common security issue that
occur in the web based applications and the there is no single reason responsible for occurrence
of broken authentication as it is caused due to number of reasons as discussed below:
 Due to session fixation
 Due to unencrypted password in transit or storage
 Due to session hijacking
 Presence of session id in the URL and its leakage in the header of referrer
 Absence of SSL security
 Not implementation of time outs
 Usage of HTTP
Preventive measures for Broken Authentication: The easiest solution to prevent from the
broken authentication is to use framework. This is the most convenient solution and should be
executed rightly. Also, one can use the programming code generated.

Exposure of sensitive data: The major function of the security prevention is to crypt data and to
protect the resource. All the sensitive information need to be encrypted. The data should also be
protected and not be kept unencrypted even in the transit. The passwords and other sensitive
information like details of credit cards and debit cards should be encrypted and must be hashed.
The algorithm used to crypt data and hashing passwords should be strong as per the web
standards and recommended guidelines.
Preventive measures for sensitive data exposure:
 Never store the sensitive information like bank details, credit card information in the
storage. As if no sensitive data is stored in the storage, so no possibility of stole data.
Always use the sign up processor while e banking and processing payments online such
as Stripe or Braintree to avoid PCI complaint.
 Encrypt the sensitive information and store it in the encrypted condition in the storage.
 All the passwords must be hashed. One can use bcrypt for hashing the passwords.
Rainbow tables and salting is also recommended as a substitute to the bcrypt.
 Appropriate certificates should be used in HTTPS.

LO2 Be able to design web applications.
In this section, all the basic requirements for the designing of a website or web page has been
discussed.
2.1 Design a web application to meet the given requirement.
For better designing of a website, proper planning must be done in order to create a website with
all the required details of the business or industry or organization for which it has been designed.
Designing must be done to show the main objective of the website for which it has been
designed including documents, images, contact details, etc. coded in a particular language. All
the components of the website must be defined in a proper format on the webpage in order to
provide easy access and navigation for the user. The main components of any website are given
below (Baylor, 2013).
 Home page.
 Website navigation.
 The name and logo of the website.
 Search option on the website.
 Image of the business or organization or product if any applicable.
 Map of the office or workplace of which website has been designed.
 Feedback section.
 Details of the website or organization (About Us).
 Contact us section.
Home page: The home page designing for the TechPro webpage has been shown below. It has a
logo of the TechPro, a section for new products, office address, email address and phone
number. It has different buttons such as About Us, Categories, Information and Service.

Figure 1: Homepage of TechPro website
Registration page: The registration page for the user on the TechPro website has been shown
below.