ICT239 Web Application Development End-of-Course Assessment 2026

ICT239 End-of-Course Assessment

(Full marks: 100)

Question 1

Explain your answer and supplement your explanation by lifting/commenting on the relevant source code in the Staycation application.

Question 1a

Explain the MVC architecture and its advantages when applied to web applications such as Staycation. Then, use ONE (1) complete user function e.g., get package details, book package, manage booking etc., and relevant code segments in the frontend and backend components to explain how the M, the V and the C components of the MVC architecture are applied to the Staycation application.

(11 marks)

Question 1b

Explain the typical purposes of GET and POST requests and evaluate whether they have been appropriately used in the Staycation application in terms of the purposes. Then, compare the security features for the two types of requests, and explain whether it is possible to make either or both of GET and POST requests more secure. If it is possible to make the request(s) more secure, explain how you would go about doing so.

(9 marks)

Question 2

For this question, you are to make modifications to the existing functions in the Staycation application.

Question 2a

Modification to Booking function

• Does the Staycation application allow users who are not authenticated to make bookings? Justify and explain using the relevant code in the Staycation application.
• Re-implement the booking function such that now admin user cannot make booking. That is, if the admin user clicks on the Book button on either the Package page or the Package Detail page, he will see the error message as shown in Figure Q2(a).

Figure Q2(a) Error message when admin attempts to make booking

(10 marks)

Question 2b

Modification to Upload function

Modify the Upload function of the Staycation application to read csv files with data in the following format:

Add a new option to allow the admin user to choose to read csv file that includes a list of hotel names, and to create bookings that run consecutively from a specified check_in_date in the csv file. Refer to Figure Q2(b) for how the Upload form should look like.

Figure Q2(b) Modified Upload form

For example, for the first data row where the check-in date is 27/9/2025, the customer is john@abc.com and there are three hotel names [“Shangri-La Singapore”,”Capella Singapore”, “W Singapore – Sentosa Cove”], create 3 bookings for john@abc.com. His first booking is for Shangri-La Singapore with check-in date 27/9/2025. His second booking is for Capella Singapore with check-in date 29/9/2025 because he checks out from Shangri-La Singapore on 29/9/2025 since the duration for the package for Shangri-La Singapore is 2 nights. His third booking is for W Singapore – Sentosa Cove with check-in date 1/10/2025 because the duration for the package for Capella Singapore also happens to be 2 nights.

Do the same for the other data rows, that is, create as many bookings as there are hotel names in the data row starting from the specified check-in date for the specified customer for that data row.

(10 marks)

Question 3

This question requires you to add new features to the Staycation application.

Question 3a

Purchase Bundle function

This function uses the Package page and allows an authenticated non-admin user to buy packages as a bundle to qualify for a discount based on the number of packages purchased. Display appropriate messages if the user is not authenticated or if the user is an admin user.

Refer to Figure Q3(a)(i) for the modified Package page. Note a new checkbox is added for each staycation package. In addition, a Purchase Bundle button is at the top of the page, below the top panel. Figure Q3(a)(ii) shows the Package page with some packages selected.

Figure Q3(a)(i) The modified Package page

Figure Q3(a)(ii) The modified Package page with some packages selected

If no package is selected and the Purchase Bundle button is clicked, flash the error message “Please select packages to buy as a bundle”. If only one package is selected and the Purchase Bundle button is clicked, there is no discount. An example flashed message is shown in Figure Q3(a)(iii).

Figure Q3(a)(iii) No discount for one package selected

If 2 or 3 packages are selected and the Purchase Bundle button is clicked, a 10% discount is given. An example flashed message is shown in Figure Q3(a)(iv). A 20% discount is given for 4 or more packages purchased in a single bundle.

Figure Q3(a)(iv) 10% discount for two packages purchased in a bundle

• Study the three mongoDB documents for three bundles purchased by two nonadmin users.

[

{

“_id”: “6832c737460e8e3d0abf0b79”,

“purchased_date”: “2024-12-30T00:00:00.000Z”,

“customer”: “682ecd38bcca884c095cce21”,

“bundledPackages”: [

{

“package”: “682ebf02d6ab51b9b08c8888”,

“utilised”: false

},

{

“package”: “682ebf02d6ab51b9b08c8889”,

“utilised”: false

}

]

},

{

“_id”: “6833170fb37081807de82cf4”,

“purchased_date”: “2024-05-25T00:00:00.000Z”,

“customer”: “683316f6b37081807de82cf3”,

“bundledPackages”: [

{

“package”: “682ebf02d6ab51b9b08c8888”,

“utilised”: false

},

{

“package”: “682ebf02d6ab51b9b08c8889”,

“utilised”: false

}

]

},

{

“_id”: “6833171db37081807de82cf5”,

“purchased_date”: “2024-05-10T00:00:00.000Z”,

“customer”: “683316f6b37081807de82cf3”,

“bundledPackages”: [

{

“package”: “682ebf02d6ab51b9b08c888a”,

“utilised”: false

}

]

}

]

Define the required document structures. Include all methods needed to support the Purchase Bundle function you will implement for Q3(a).

• Implement the Purchase Bundle function.

There is no limit to the number of bundles that can be purchased in a single day. Set the purchase date to the current date at the time of purchase. Set the “utilised” status for each purchased package to false.

(16 marks)

Question 3b

Manage Bundle function

This function allows a non-admin user to view the bundles purchased (sorted by ascending purchase date) and to make booking by selecting a check-in date and clicking on the Book button.

If a non-admin user has not purchased any bundle, show a message as shown in Figure Q3(b)(i).

Q3(b)(i) The current user has not purchased any bundle yet

Packages in a bundle must be booked within a year from the date the bundle is purchased, or the bundle and the packages in the bundle will expire. Once a package in a bundle is utilised, reflect the “utilised” status as true.

You may modify the purchase date of a bundle (e.g., after user has made a booking for a package in a bundle) so that you can show different cases:

• Utilised packages and expired packages in an expired bundle are shown in Figure Q3(b)(ii), and
• Utilised and un-utilised packages in a bundle not expired yet are shown in Figure Q3(b)(iii). Un-utilised packages in a bundle not expired yet are shown with a date selector to allow user to make a booking for them.

Note that in the figures, bundles are separated by full faint grey lines while packages bought in a single bundle are separated by partial faint grey lines.

Figure Q3(b)(ii) Utilised packages and expired packages in an expired bundle

Figure Q3(b)(iii) Utilised packages and un-utilised packages in a bundle notexpired yet (below the second full grey line)

Define the required document structures. Include all methods needed to support the Manage Bundle function you will implement for Q3(b).

(14 marks)

Question 3c

Single Page Application

Differentiate between a multi-page application and a single-page application. Reimplement Question 3b as a single-page application for the booking of packages in the Manage Bundle function. Make a copy of your solution thus far for this reimplementation.

Show the relevant code segments, before and after the changes you make, and explain what the changes achieve and why the change is required. You must indicate the name of the file where the code segment is extracted from.

Submit Question 3c as a separate flask application in the folder Q3c.

(10 marks)

Question 4

For this question, you are to add a new chart for the admin user.

• Modify the Dashboard hyperlink such that clicking on it shows a page with a dropdown menu but without any chart on the page, as shown in Figure Q4 (a).
• If the admin user selects Amount Incoming option from the dropdown menu, the original trend chart will be displayed as shown in Figure Q4 (b)(i). Figure Q4 (b) (ii) shows a line chart which includes bookings uploaded using the modified upload function should you have implemented Question 2(b).
• If the admin user selects Bookings By Month option from the dropdown menu, a bar chart will be displayed as shown in Figure Q4 (c)(i). The bar chart displays the number of bookings for each month-year for each hotel, sorted by hotel names. Figure Q4 (c) (ii) shows a bar chart which includes bookings uploaded using the modified upload function should you have implemented Question 2(b). Show a very small bar for data points with the value 0.
• If the admin user selects Choose a Type option from the dropdown menu, the same page as shown in Figure Q4 (a) is displayed.

Figure Q4 (a) Dashboard page

Figure Q4 (b)(i) Chart for Amount Incoming option without bookings fromQ2(b)

Figure Q4 (b)(ii) Chart for Amount Incoming option with bookings from Q2(b)

Figure Q4 (c)(i)Chart for Bookings By Month option without bookings fromQ2(b)

Figure Q4 (c)(ii) Chart for Bookings By Month option with bookings from Q2(b)

Show the relevant code segments, before and after the changes you make, including new code, and explain what the code achieve and why the change/addition is required. You must indicate the name of the file where the code segment is extracted from.

Question 4a

Implement all frontend components. Do not include JavaScript code here. Place your JavaScript code into part 4(c).

(4 marks)

Question 4b

Implement all backend components.

(8 marks)

Question 4c

Implement the JavaScript component.

(8 marks)

—– END OF ECA PAPER —–

The post ICT239 Web Application Development End-of-Course Assessment 2026 appeared first on Singapore Assignment Help.