Description

Web Development – Exam 1 (first chance) Student number: ______________
Surname/Name: _______________

Case description and the link:
Download the application from: https://github.com/hogeschool/development-web/21-22/chance-1

The provided application for the exam is a simple zoo preview application, where a user is able to check the animals present in a zoo and stored in the database (see below figure). In this application we have three entities: zoo, animal, and specie. A zoo has a 1-to-Many relationship with animal, i.e. a zoo hosts many animals and an animal lives only in one zoo. Same goes for specie, which is in a 1-to-Many relationship with Animal. In our database an animal belongs to one specie.

Description of the view:
The layout of this application (see image above) contains a home-button. In home you can see the animals grouped by zoo stored in the database. For each zoo the list of its animals is displayed underneath it. You can also filter the animals by specie. This is possible via the filter buttons displayed on top of the list. Note, to surround an element with a box (like in the figure above) you will need to add a styling to the container div. Example, <div style={{border:”solid”}}>..</div> will display a solid border around the elements contained in the div. You do not need to implement the exact above styling to score points. We will only score the functionalities.

We provide you an exam application, which is missing a series of code blocks. Each code block is mapped to specific points. To get the points for a specific block you need to fill it with valid/correct code. To pass the exam you need to acquire at least 5.5 points. The missing code blocks are marked in the exam application by a TODO comment . In a TODO item you will also find the associated points. Note each TODO has a specific number necessary later for the submission (see submission rules in the following page). TODOs are distributed in the exam application as follows:
➢ Models o 3 TODOs 2.5 points ➢ Controllers: o 3 TODOs 2.5 points
➢ Views:
o 5 TODO 5 points

Submission form and rules
As you can see below (and in the application) each TODO is identified with a unique number. To accept your solution, you must write below the code you implemented in your exam application in the respective TODO slot. For example, if you wrote some code for TODO 5 in the exam application then you must copy it below in the TODO 5 slot. For this exam you do not need to upload the solution on N@tschool, but give these papers back to the attendant present in the room.
NB. Unreadable text in a TODO slot will give you 0 points for that specific TODO.

TODO 1 (0.5pt):

TODO 2 (1.5pt):

TODO 3 (0.5pt):

TODO 4 (0.5pt):

TODO 5 (0.5pt):

TODO 6 (1.5pt):

TODO 7 (1pt):

TODO 8 (1pt):

TODO 9 (2.0pt):

TODO 10 (0.5pt):

TODO 11 (0.5pt):