Web Application | The Motueka Bed & Breakfast

Project Background

This project involved completing the development of a web application based on a design brief for a fictitious business, The Motueka Bed & Breakfast.

Discovery

Functional and non-functional requirements were identified from the design brief and additional requirements were suggested with reasons why they were important.

Rooms, room availability and making bookings needed to be available to customers. Administrators also needed this functionality together with being able to manage rooms, customers and bookings.

Partially completed source code were provided for the rooms and customer PHP web pages, whereas booking and login pages still needed to be developed. Paper-based web page views containing mock data were supplied for all web pages depicting basic functional requirements. The source code provided needed additional updates to allow for authentication, authorisation, session management, log-out functionality and security measures that would protect parts of the web application.

A SQL database, which excluded a booking table, was also provided. It needed to be integrated into the web application after designing and adding the booking table. However, some adjustments needed to be made to the customer table to store customer login details.

A privacy statement needed to be created and added on its own page within the web application.

A workflow document was needed for both technical staff and end users that explains how they should work with the completed system.

Design

The graphical user interface (GUI) for the web application would be designed by another team and did not form part of this project. Adding information about the Bed & Breakfast was also excluded from the project.

Development

The web application was developed and written with HTML5, PHP and JavaScript programming languages.

PHP web pages were first developed as HTML5 web pages before converting them to PHP and adding PHP code. HTML5 date and time picker was first implemented before replacing it with a JavaScript date and time picker. The index or home page was created and integrated into the web application's navigational menus for testing purposes. This would be replaced once the proper page is developed by another development team.

JavaScript technologies and libraries implemented include:

• jQuery UI library with a date picker widget for when the user makes or updates a booking.
• JavaScript Object Notation (JSON) to search for room availability before making a booking and when administrators search for customers.
• AJAX to help content load asynchronously without waiting for the whole web page to reload.

The SQL database was updated to add the booking table with sample data and amend the customer table to add login functionality to the web application. Passwords that needed to be stored directly in the database, such as an administrator password, were encrypted before being stored. SQL statements were coded and added to the booking and log-in pages to communicate with the database.

Security measures implemented include:

• HTML5 data validation for user input fields to prevent users from entering incorrect information and control the type of data sent to the database.
• Parameterised prepared SQL statements to prevent the efficacy of SQL injection attacks.
• Filtering and encoding data to mitigate Cross-site Scripting (XSS) attacks.
• Encrypting passwords before sending them to the database.
• Verifying passwords entered during log-in and comparing them against encrypted passwords stored in the database to authenticate users.

Authentication, authorisation, session management and log-out functionality were implemented. A default username and password of ‘root’ was added to the database to test pages viewed by administrators. For security reasons, this would need to be updated within the database before going live to allow for a private administrator username and password.

The privacy statement was created with the Privacy Statement Generator after identifying the type of private identifiable information (PII) that would be collected by the web application.

A workflow document was created for technical staff to explain configuration and maintenance procedures and for end users to explain how the booking pages work.

Testing

A test plan was created and executed to test the functionality and usability of the web application after deployment on multiple platforms.

Deployment

A list of things to check before and after publishing to a hosting provider was created and followed before deployment.

Hosting was not included in the design brief. Consequently, free hosting providers were considered based on bandwidth, storage, processing power and memory, customer service and support, free subdomain or domain, scalability and cost criteria. AwardSpace was found to be the most suitable for this project and was used to host and publish this web application.

Evaluation

An SSL certificate would encrypt communications with the server and could further protect sensitive data, such as passwords. Unfortunately, at the time of development, the hosting provider did not offer a free SSL certificate with their free plan unless it was upgraded to a paid plan. However, the client could organise this with their hosting provider when purchasing their hosting plan and domain.

The web application does not allow customers to reset their passwords. Further enhancements could involve updating the Account Details View page instead with customer contact details and e-mail preferences and adding a password reset button for customers to reset their passwords via an e-mail link.

Cross-Origin Resource Sharing (CORS) headers could be implemented to mitigate Cross-Site Request Forgery (CSRF) attacks.