Web Application Development: Design, Implementation and Testing

This report provides a comprehensive overview of web application development, covering key aspects from initial design to final testing. It begins by evaluating the functions and advantages of web applications, comparing different client-side and server-side scripting languages, and examining web security with recommendations for improvements. The report then details the design of a web application based on a given case study, synthesizing client-side and server-side functionalities, and applying a suitable database design. The implementation phase is thoroughly discussed, focusing on utilizing client-side and server-side scripting languages according to the prepared design, and identifying and implementing error handling and reporting mechanisms. Finally, the report delves into testing the web application using a web-enabled database management system, analyzing test results to identify discrepancies, evaluating independent feedback for potential improvements, and creating user documentation. This detailed exploration aims to provide a thorough understanding of the entire web application development process.

Web Application
Development

Contents
Introduction......................................................................................................................................3
LO1. Understand the concepts of web application development....................................................4
P1.1 Critically evaluate the functions and advantages of web applications................................4
P1.2 Comparison of different types of server-side and client-side scripting languages..............6
P1.3 Examine web security and make recommendations for security improvements................8
LO2. Be able to design web applications........................................................................................9
P2.1 Designs a web application to meet requirements given in the case study...........................9
P2.2 Synthesise client-side and server-side functionality in a web application........................12
P2.3 Apply a database design for the given scenario................................................................19
LO3. Be able to implement web applications................................................................................20
P3.1 Implement a web application to a prepared design using client-side and server-side
scripting languages....................................................................................................................20
P3.3 Identify and implement opportunities for error handling and reporting............................26
LO4. Be able to test web applications...........................................................................................27
P4.1 Critically review and test a web application using a web-enabled database management
system........................................................................................................................................27
P4.2 Analyse actual test results against expected results to identify discrepancies..................29
P4.3 Critically evaluates independent feedback on a developed web application and make
recommendations for improvements.........................................................................................30
P4.4 Create a user documentation for a developed web application.........................................32
Conclusions................................................................................................................................33
References......................................................................................................................................34
1

List of Figures
Figure 1: Server-side Scripting........................................................................................................6
Figure 2: Homepage........................................................................................................................9
Figure 3: Entry page......................................................................................................................10
Figure 4: Manage estates...............................................................................................................11
Figure 5: Login page......................................................................................................................13
Figure 6: Add estate page..............................................................................................................13
Figure 7: Edit estate page code......................................................................................................14
Figure 8: Index page code..............................................................................................................14
Figure 9: Index page 2...................................................................................................................15
Figure 10: Estate Details page.......................................................................................................15
Figure 11: Configuration page.......................................................................................................16
Figure 12: Function page...............................................................................................................16
Figure 13: Function 2 page............................................................................................................17
Figure 14: Function 3 page............................................................................................................17
Figure 15: Index 1 Page.................................................................................................................18
Figure 16: Index 2 Page.................................................................................................................18
Figure 17: Login page code...........................................................................................................20
Figure 18: Admin add estate code.................................................................................................21
Figure 19: Estate details code........................................................................................................21
Figure 20: Homepage....................................................................................................................22
Figure 21: Admin login page.........................................................................................................22
Figure 22: Admin home page........................................................................................................23
Figure 23: Add estate page............................................................................................................23
Figure 24: Edit estate page............................................................................................................24
Figure 25: Estate details page........................................................................................................24
Figure 26: Estate delete page.........................................................................................................25
Figure 27: Manage estate page......................................................................................................25
2

Introduction
A website is intended to provide information to its users. By visiting a specific website, a user
can gain information related to his or her concern. An e-commerce website is getting much
advantage on the internet these days. Using the e-commerce websites, the business can be
increased in a specific field and the profits are enhanced. Users can navigate through the website
and get the required product of their choice.
Hence, website development is divided into four sections. The discussion in the first part
includes the web functionalities. In the second section, the functionality and implementation and
of database are explained. Third section explains, website implementation. And in the last
section, the website test is implemented. This report can make the users understand the concept
of website designing.
3

LO1. Understand the concepts of web application development.
P1.1 Critically evaluate the functions and advantages of web applications
Web Application:
A web application refers to any client-server-computer program which is run by the client using
a web browser. Well, known web applications are instant messaging services, online auctions,
webmail etc.
A web application uses some certain website as its interface. A web application can be easily
accessed through a computer connected to the internet (SearchCloudApplications, 2012).
 Compatible with multiple platforms: Web-based applications are compatible with many
platforms, which was not really possible with traditional software. Web applications can be
run on any operating systems whether it is Linux, Windows, Mac OS etc.
 Manageable: The web applications only need to be connected on the server which allocates
nominal on the user’s workplace requirements. The clients can use the updates easily via
web.
 Greatly Deployable: due to the high rate of manageability and compatibility of cross-
platform, the employability of the web application to the user is easier. In the instances
where the deploy ability is high, the user can be simply dispatched to any address of a
website to log in and they can be provided with internet access.
 Flexibility: web applications enable users to access the internet and do their work from
anywhere. They do not need to keep sitting in their offices and be glued to the desk and chair.
They can o their work from anywhere and on any device which is internet enabled.
 High rate of usage: Web applications are easy to use, so the rate of usage is growing day by
day. People do not need to browse much and just open the app, log in and start using. So the
rate of web-based applications is growing rapidly.
 Cost reduction: Web-based applications can decrease their prices intensely because of lesser
maintenance and support. They lower the end user system requirements and the architecture
is simplified. The prices of the company are reduced. Additional savings can be made
frequently based on the company’s web application.
4

 Centralization of data: In web applications, the data are centrally stored and also acts as the
backup if any information is lost from the client’s system.
 Availability: A web application is available 24/7 and can be accessed from anywhere at any
time.
 Directly accessible: A web application is can be accessed directly to the latest information by
any employees located anywhere in the world (Magic Web Solutions, 2017)
Disadvantages of web application development:
 The malicious users keep seeking for the information present on web pages and can access it
through the web application easily.
 Web applications suffer through the problem of internet connection very often.
 Web application may not always be compatible with all the web browsers.
 Even if the application has the internet connection, it might require high internet speed,
which is not always available.
 Sometimes the web applications are unable to function according to their own functionality
and have to behave according to the browser being used (Fox, 2014).
5

P1.2 Comparison of different types of server-side and client-side scripting languages
Client-side scripting:
A code which exists in the HTML page of a client can be called as client-side scripting.
In the browser is generally attached in such a language which is compatible with it. For client-
side scripting, JavaScript is used. JavaScript can run on any of the browsers. A browser
downloads this script for a temporary period of time and can process the script without a server.
Whenever any extra information is required other than the downloaded information, a request is
sent to the server for the same.
Use of client-side scripting reduces the work of server as it is growing faster nowadays and most
of the work is done by the client itself.
Server-side scripting:
The scripting performed at the back-end of the website is called server-side-scripting.
The view of the happenings here is not allowed to the user. A path is created by the server-side
scripting to the database for the website and all its behind the work scenes by which the website
is run and organized. The responses to the server-side scripting can be customized according to
the needs of the user (Yourwebskills, 2016).
6

Figure 1: Server-side Scripting
Difference between client side and server side scripting:
1. In clients scripting the browser runs such a script which is already there on the client’s
computer, whereas in server-side scripting the request needs to be sent to the server to run a
particular script.
2. Client-side scripting can take place only when all the codes are possessed by the browser and
this is later changed according to the input provided by the user, but in server-side scripting,
the work is initiated when a request is generated by a user’s browser, after which based on
several conditions creation of dynamic pages take place.
3. For client scripting JavaScript, VB Script etc. are used whereas Server Scripting works on
PHP, ASP, Ruby etc.
4. Server-side scripting is generally good for loading of dynamic data but client-server is best
for cases such as user interaction.
5. Client-side scripting can be performed by the browser as soon as it receives the page from the
server, but a server cannot perform client-side scripting (HostBlitz, 2018).
7

P1.3 Examine web security and make recommendations for security improvements
Web security is the process of protecting the computer from internet-based attacks which are also
known as cyber-attacks. Basically, web security is trying to prevent the computer from people
who try to exploit the weakness of any software or computer for their personal gain. Web
security is generally required on a computer which is connected to the internet.
Web security provides blockage of harmful and unwanted content from arriving the sub-network.
It also provides security of data from unauthorized access. SQL injection, HTTP floods, or
overflow of buffer exploits are the techniques used by hackers to exploit the vulnerable sites and
provoke users to make some activities on those phishing sites (InformationAge, 2018).
Improvements in web securities:
 Keep changing your passwords regularly in short intervals of time in order to keep your
account secure.
 Switch from a standard HTTP to an encrypted website. This makes ensure the security of any
data put up on your website by any client as input. The hacker is then unable to access the
information on your website.
8

LO2. Be able to design web applications
P2.1 Designs a web application to meet requirements given in the case study
Web application is developed by taking the help of different mock-up pages. All these mock-ups
are designed through the assistance of Balsamiq tool. These mock-up pages are displayed
through the aid of diverse screenshots which are presented below:
(a) Homepage:
9

Figure 2: Homepage
(b) Entry page
10

Figure 3: Entry page
11