HMW
Emerging Technologies XXXXXXXXXXCOMP-308
Mid-Term TEST – Week 7
Student: ______________________
Be sure to read the following general instructions carefully:
· This lab test must be completed individually by all the students.
· Implement the solution for Exercise #1 if your first name starts with a letter from A-N, otherwise, implement the solution for Exercise #2.
· You must submit the solution to eCentennial when you finish the test. You VS Code project name should be named “YourFullName_MidTermTest_001_2022” and should be zipped in a file “YourFullName_MidTermTest_001_2022.zip”.
Exercise #1 – For students whose first name starts with a letter from A-N
Create an Express.js backend that allows users to book vaccine appointments. You will have to design an MVC structure. Create a model that describes an appointment document. Each document has the following properties:
cardNumber - String
vaccineSite – String
priorityArea – String (validate using an enum list that contains ['80+', 'healthcare', 'essential']
dateTime - Date
cancelled - Boolean
Create a controller that implements: add appointment, list appointments, delete an appointment from the database and refresh the view. In development.js file, name the MongoDB database: YourFullName-appointment-db.
Write a React UI to allow the user to book vaccine appointements:
· A React form will be used to add appointment information (as shown above)
· A React form will be used to display a list of appointments as shown below.
· The same React form used to display the list, can be also used to delete an appointment as shown below.
You may use the code from Week 5 examples or SampleTest in Week 6 to implement your solution. Make sure to use proper naming for controller, model, routes, and functions. Use only functional components in React UI.
(100 marks)
Evaluation:
MongoDB database (config files, model, validation)
15%
Express Rest API: Add
List
Delete
15%
15%
15%
React UI:
Add appointment: React form as shown above
List appointments: React form as shown above and also delete.
10%
20%
Friendliness (using css to align the HTML elements, etc.)
10%
Total:
100%
Exercise #2 – For students whose first name starts with a letter from O-Z
Create an Express.js app that allows users to create game surveys. You will have to design an MVC structure. Create a model that describes a game survey document. Each document contains the following properties:
surveyId - String
gameGenre – String (validate using an enum list that contains ['Action', 'Adventure', 'Strategy', 'Sports']
daysPerYear – Number (validate using min, max validators for days number)
age - Numbe
Create a controller that implements: add survey, list surveys, update a survey from the database and refresh the view. In development.js file, name the MongoDB database: YourFullName-survey-db.
Create the necessary React forms to allow the user to use the application:
· A React form will be used to add survey information (as shown above)
· A React form will be used to display a list of surveys as shown below.
· The same React form used to display the list, can be also used to update a survey as shown below.
You may use the code from Week 5 examples or SampleTest to implement your solution. However, make sure to use proper naming for controller, model, routes, and functions. Use only functional components in React UI.
(100 marks)
Evaluation:
MongoDB database (config files, model, validation)
15%
Express Rest API: Add
List
Update
15%
15%
15%
React UI:
Add appointment: React form as shown above
Update appointments: React form as shown above and also delete.
10%
20%
Friendliness (using css to align the HTML elements, etc.)
10%
Total:
100%
Lab Test XXXXXXXXXXPage 1 of 1