ew, update, delete on administration dashboard and insert child review booking date in
teacher side.
To create CRUD functionality, the first step was to create migration with the following
command:
php artisan migrate:make create_bookings_table –table=bookings –create
This created booking migration file in app/database/migrations. After adding the
database bookings columns in migration file, php artisan migrate command created
database table and create Model for our database. The model booking enables
controllers to access booking table record after instantiating the booking class.
5.7. Laravel controller
To create BookingController to handle the booking methods, resource controller was
used. This artisan command provides pre-defined set of functionality that helps the
developer code less and concentrate on the coding logic.
php artisan make:controller BookingController –resource
This command generated a controller at
app/Http/Controllers/BookingController.php. Next a route was registered in
routes/web.php as
Route::resource(‘events’,’BookingController’);
Using artisan command for BookingController resource, generating index(), create(),
store(), show($id), edit($id), update($id), destroy($id) functions automatically. These
functions are plain therefore they need to be implemented according to the logic of the
system requirements for booking.
The index() method directs the user to allEveCalendar.blade.php. The store(Request,
$request) method stores new booking into booking table which includes form validation
and check for duplicate record in booking table. If there is no record exists, the new record
40
will be inserted into booking table otherwise back() method redirect the user to the same
page for displaying error message. To enable Http request and response the class needs
to include the following class:
use IlluminateHttpRequest;
5.8. Create
Inside store() method another funciton is_duplicate($title,$start,$end) was deployed to
check the input against the database record; if the count() is 0 the function returns true
otherwise it returns false. This helps to decouple the store() function into smaller unit and
segregate the tasks of the logic.
The create() method directs the user to display a form created by insertEvent.blade.php.
To view a unique record of a booking, the user clicks on display booking button.
Figure 5
41
5.9. Read
As shown in the URL carries the record index number which will be passed to show($id)
as argument to find the specific resources in the booking database table. Eventually,
show($is) will display individual records on display booking submission.
Figure 6
To generate the URL call show($id) method on action, the following route was created:
Route::get(‘/events/{id}/show’,’[email protected]’)->name(‘show’);
This changes the current URL to /events/47/show without being coupled to its previous
URL. The name route show is a shortcut call to direct the request to show($id)method at
BookingController class. This routing process is similar in the whole application; all
routes are stored in routes/web.php.
5.10. Update
To update any record by administrator; initially, the records are displayed. On request,
the edit event button directs the user to edit($id) function in BookingController class.
42
Figure 7
This method finds the id in booking table and passes the record information to
edit.balde.php. The form holds the current information of the booking in a form format.
The administrator could change the record to request updating. Next, the request will be
passed to update($id) to validate the form and update the record through finding the
records by its id and update them with save() method. In final step, the update method
redirects the admin back to the same page with displaying success message on top of
the page.
43
Figure 8
5.11. Delete
In previous stage of viewing the record, clicking on delete button sends a delete request
to destroy($id) method on BookingController. Destroy method simply deletes the record
found by its id in booking table and direct the admin user back to the same page with
successful message declaration on top of the page.
5.12. Security
Security is one of the most important of Laravel features. Jakeman project has deployed
some essential security functionality which was designed to prevent unauthorized access
to the application.
44
5.12.1. Route groups
The welcome.blade.php is the only page that accessible by any user which is the point of
entry to the system. Otherwise, all three user groups’ (Parent, Admin, and Teacher)
dashboards need to be authenticated via login interface. Moreover, the access to the URL
was filtered to prevent hacking via URL injection by third party. This was achieved
wrapping the all the routes, except route for welcome page, with the following function:
Route: group(‘middleware’=>’auth’,function(){ Insert all routes need to be filtered;}
This function assigns middleware to all the routes need to be filtered from unauthorized
access.
5.12.2. Password encryption
Laravel provides encryption API facilities to ensure secure and update encryption method.
An example of encryption method is bcrpt() that encrypts the registration password in,
auth/RegisterController, before inserting into database table. The application uses
application key which is stored in config/app.php to encrypt values securely.
protected function create(array $data)
{
return User::create(
‘name’ => $data’name’,
’email’ => $data’email’,
‘password’ => bcrypt($data’password’),
);
}
45
5.12.3. CSRF protection
To protect the application from cross-site request forgery, Laravel generates automatic
CSRF token for each active session created by the application on behalf of the user. This
token verifies the authenticated user and evaluates whether the request made by the
actual user and not by a third-party application. This was achieved by defining a hidden
CSRF token field on each form, using csrf_filed.

{{ csrf_field() }}

5.13. Generate PDF format
The application implements laravel-dompdf plugin to create PDF downloadable files. The
system provides two forms for both Parent and Admin users to download and view in PDF
format. The following steps were taken to enable this feature:
Step 1: Downloading barryvdh/laravel-dompdf plugin via composer.
Step 2: Opening config/app.php file and adding the providers and the aliases.
‘providers’ =>
BarryvdhDomPDFServiceProvider::class,
,
‘aliases’ =>
‘PDF’ => BarryvdhDomPDFFacade::class,
,
Step 3: Creating route for generating the view to return the response which is
downloadable PDF file. Therefore, we need two routes, separately, point to the blades
required to be downloaded (Anon, 2017).
46
Route::get(‘registerationForm’,array(‘as’=>’registerationForm’,’uses’=>’ItemC
[email protected]’));
Route::get(‘pdfview’,array(‘as’=>’pdfview’,’uses’=>’[email protected]’);
6. Project Management
Project management is based on agile methodology. This approach is one the latest
techniques in managing software developing projects which is brought into attention in
more details. Then, the project strategies and the sequence of behaviors have been
demonstrated in a Gantt chart for defining the tasks within a period of time.
6.1. Agile methodology
To manage the project, Agile methodology was preferred than waterfall model because
Agile method allows planning occurs through the project lifecycle. Moreover, in waterfall
model early planning does not allow changes happening as project processes to the next
phase. Therefore, it is time consuming to return to the previous cycles and amend or add
new requirements while in Agile practice the decision making could be reactive, and
iteration could help to add or edit requirements (www.tutorialspoint.com, 2017).
The project plan was shaped generically so that changing requirements after
implementation did not need to affect the overall process. This approach made the project
compatible to modification, enabling expanding functionality by adding or editing the
requirement analysis. Furthermore, the agile method made it possible to iterate form
implementation, to the requirement analysis and the design any time.
As a result of business requirement modification, the project faced some amendment
during implementation phase such as adding a timeslot to booking which did not exist in
the requirements. This feature was demanded by the stakeholder and added to the
project in later stage of the project where the CRUD functionality was implemented
successfully. The loose design of the application allowed adding this new feature to the
system without changing dependencies to UserController.blade.php.
47
Agile methodology was an efficient way to deliver the system. The communication was
essential to deliver the write requirements, adding new features and deleting unwanted
components. The requirements were evolving gradually as stakeholders demanded
changes in some points; therefor, the project needed to consider new adjustment.
Although changing the product features was frustrating, the outcome of the final project
was based on the current software engineering methodologies.
In reality, clients need to have their software ready as soon as possible and they might
change their idea towards their requirements during the process of software lifecycle.
Nobody desires to get disappointed as a customer; thus, the client satisfaction is pivotal
to the success of any businesses including web development. Therefore, the agile
methodology was deployed to manage this project.
6.2. Project plan
Gantt chart was used to schedule and to demonstrate project plan. Project tasks were
created to illustrate the project needs with time estimation dedicated to deal with each
phase. The plan starts with client meeting and interviewing stakeholders to gather as
much relevant requirements as possible.
One week was devoted to reviewing the notes and organizing them into realistic system
requirements. This included omitting redundant and irrelevant collected data, from
stakeholders, in order to serve the project as presentable requirements of the system and
to assist designing the whole system.
The next step was to find hosting server which is PHP- Mysql enabled to start
implementing the first phase of the project, which according to the plan, was Login and
Register of the system plus database set up to be able to manipulate Mysql tables.
Then, the Parent features of the application was planned to be accomplished alongside
the interface design. This phase was time-consuming as it shaped the fundamental part
of the system functionality; as a result, it exceeded the time plan. In this phase user
calendar API was integrated into the system for the first time.
48
Create Administration panel and CRUD functionality was the next stage. In this section,
time plan was sufficient as the calendar was already implemented, and some interfaces
were executed in Parent side. The idea was clearer than the first phase of the application.
In this part the client added a new feature in calendar; the change of events based on
event type was a new non-functional feature which added to the project.
Create Booking event was a vague idea about bookable events, therefore this feature
which was part of the plan changed to time slot method of booking. In this stage, the plan
was also to implement staff panel which changed to teacher panel. Later, as a part of the
requirement amendment, the teacher actor was responsible for inserting his own child
review event booking. Therefore, this change was implemented into the system.
Next, creating test plan and the process of testing was the next phase to ensure that the
product satisfied the requirements. And the final stage was the report to reflect the
outcome of the research and end product and to describe and evaluate the system
academically.
7. Evaluation
To evaluate the system, test plan was designed to assess all aspects of the requirement
analysis. Test plan aim was to determine the functional and non-functional features of the
system.
7.1. Unit testing
Prior to testing non-functional requirements, unit testing was executed on each method
within Laravel application to ensure each function serves the desired functionality. The
initial point of unit testing was to evaluate the view of the application because this is where
the client request initiates. In this application view is called from controller classes;
therefore, the corresponding method was tested first. This test was carried out by simple
echoing of a text to view in client side. Then, the view() method was tried to see if it would
be directed to the actual view. Next, the view elements were built up to ensure nonfunctional
requirements were achieved.
49
Step 1: public function showUser($id){ echo “insertSchoolClubBooking working”;
}
Step 2: public function showUser($id){ return view(“insertSchoolClubBooking”;);
}
Step 3: public function showUser($id) {dd($booking = Booking::find($id))}
Step 4: public function showUser($id){
$booking = Booking::find($id);
$bookingId = $booking->id;
$event_type = $booking->event_type;
return View::make(‘insertSchoolClubBooking’)->with(‘booking’,
$booking);
}
Referring to the steps being taken to view insertSchoolClubBooking.blade.php, the
controller UserController.php function needed to be tested to provide a bug free method,
extracting the date from Booking model.
At first, echo a text displayed the route directing the request to UserController. Then,
view() helper was deployed to view the actual response which was redirected to
insertSchoolClubBooking.blade.php. Next, dd() helper function test the model data in a
raw array. At this step, all data were tested and retrieved to make sure that the variable
$booking contains the model records. Finally, the whole unit was tested together to see
the result in the browser.
Unit testing was a good practice to find all the bugs within a standalone function and to
determine the correctness of data retrieved from the models. The aim was to find, analyze
and fix any deficiencies. Unit testing helped to discover and to decouple the solutions in
smaller units. An example of decoupling was storeTimeslot() method which needed to be
decoupled into three methods. The other two methods were ifEmailExists($email,$date)
and is_timeslot_taken($time). The first method checks if the user picks a timeslot in the
50
same booking event return false. The next method returns false if another user booked
the same time slot before submitting the button.
Non-functional testing also performed in similar steps to find bugs and form a solution for
debugging. Due to the distributed nature of the project and the number of front end
development technologies integrated into the project, such as Bootstrap, Css, Jquery,
HTMl, the application also required a debugger to make front end debugging more
convenient. For this purpose, Firebug which is an-add on tool to Firefox browser was
chosen. Firebug enables debugging, pointing to specific DOM elements or classes,
finding Javascript errors, displaying each section of the page with its components and
provides other helpful gadgets.
After downloading Firebug add-on, on a right click and point to Inspect Element menu,
the tool would be appeared on the browser. Firebug displays all necessary information
about web page components, monitoring front end performance of technologies such as
HTML, Css and Javascript. After enabling Firebug, an arrow on top left-hand side of the
menu, which if clicked, would direct the user to explore the components. When a
component is chosen, the HTML blocks on the left pane and the Ccc elements and the
classes would be presented on the right side of the panel. The elements and classes are
editable, and the result could be viewed on the browser. Nevertheless, to change the Css
components, the actual file needs to be updated or new components should be added.
51
Figure 9
In the home page the arrow clicked on header. The Css component is div.row.nav-row
with the width of 1170 pixel and the height of 211 pixel. The left pane displays the HTML
blocks of code including Css elements and classes and the right pane illustrates the actual
Css values and properties. Editing is possible on the right pane and the result would be
dynamically displayed on the browser to save time on developing any Bootstrap or Css
components.
7.2. Compatibility testing
Nowadays, mobile and tablet users are increasingly accessing internet coverage and
prefer working with devices on the move. Therefore, it is necessary to implement
technologies that make the components accessible to all devices.
To provide browser compatibility, Bootstrap components were integrated into the frontend
development. Test plan includes browser compatibility for four main devices such as
normal PC, laptop, tablet and mobiles.
52
The result was slightly different in mobile than other devices. Therefore, changes made
to squeeze the components inside the mobile screen as much as possible. Nevertheless,
to make a fully mobile friendly application, a mobile development framework needed to
be implemented. Show in Figure 10 below.
Figure 10
7.3. Security testing
Considering protecting user data from unauthorized user, security testing was crucial to
the application. The login and register were the first security examination to be applied.
The login had to be tested to ensure that the users would be directed to their own panel.
Another concern was filtering the URL to prevent unauthorized user accessing specific
URLs without permission. To achieve that, various URL were typed into the browser.
Consequently, as the result of filtering, all unauthorized URLs were filtered successfully.
53
To protect user data, the application was thoroughly inspected to ensure user data is
relevant and the integrity of data is assured. This included data entry to the database
tables, retrieved data from database tables and the data viewed on user screen by all
user types such as parents, administrators and teachers. The main test plan is included
in Appendix 6.
7.4. Customer evaluation
The final product must be approved by the client. The stakeholders who deploy the
system are not aware of the complexity of the application from developing point of view.
Therefore, the evaluation attention focuses on usability aspects of the product.
The system was delivered and hosted to conduct the final assessment on user interfaces,
product features for verifying the system approval and find any usability issues. Because
of incremental design process of the application, such as adding or replacing features
through the project lifecycle, customer evaluation was achieved progressively. During this
phase false assumptions about the system behavior, specifically the usability, were
detected. The system was tested by the administrators and teacher to finalize the system
installation. This evaluation was an extension, intending to verify the usability
requirements and to complete the testing process (Citeseerx.ist.psu.edu, 2017).
The clients were satisfied with the user interfaces, expressing their pleasant user
experiences with the navigations, the booking calendar view and the database
manipulation look and feel. They also loved the page layout and coloring plus the font
sizes and easy registration and login processes.
8. Conclusion
The project aim was to develop an online system to solve Jakeman nursery problems.
The system was designed and developed according to the requirements and
implemented using Laravel 5.5 framework.
The research was involved in drafting a design solution to be compatible with Object
Oriented Programming. The use case, swim lane and database diagrams were illustrated
54
system functionality, behaviors and data management. Based on literature review, the
choice of technology was Laravel because it helped to explore and implement a true OOP
programming in PHP language. The user interfaces are the reflection of the requirement
analysis and the product of communication with the stakeholders. The system test
approved the overall functional and non-functional features of the system including
security, user interface features on client side and data integrity.
Due to the agile structure of the application, the development was based on trial and
experimentation of some features which I believe could be organized in more efficient
manner in design phase. Although the communication helped to improve the
requirements, the later changes of some structure of the application made the
development more tedious and time-consuming. The automated testing could boost a
faster and more reliable testing of the application across multiple browsers; hence, such
tools were not available freely to assist test process. Here the URL link of the web
application for after school club booking system:
http://jacknursery.co.uk/NurseryEvents/
9. Future work
To add more quality to the system as possible future project expansion, there some ideas
which could enhance the system capabilities on top of the existing application. Due to the
rapid application development, these ideas could be easily implemented.
The first area, is to accept payments through the online booking system. This would allow
the hosts of the system to directly charge their user’s deposits or full payments directly
through the online booking system. This feature could quite easily be implemented, for
instance companies like PayPal provide support for most of the used languages.
Another idea for future work was the ability to add reservation lists to the bookings. This
would mean that if the intended event was fully booked a set amount of people would be
able to add themselves to the reservation list. If someone who was booked in to the event
cancelled, the users on the reservation list would be notified and given the opportunity to
book in to the event.
55
Another feature that could be implemented is the upload of a ‘profile picture’ to the user’s
profile. This would add to the original scope of the after school childcare system as the
parents would be able to upload a picture of the child for better recognition.
Moreover, the system could be expanded with integrating new functionality such as live
parental chat system or blogging to provide communication between parents and staff.
The system could also be designed and implemented on mobile framework