In this app, the user can add a contact by clicking on create contact button, and a pop-up will show one form, fill that form with name, last name, and status attributes.
There is a validation of attributes like u can’t post any contact without all the attributes.
On the home page (‘/’), It is a contact page, user can add the contact, and below that the list of all the contacts available.
On this page,
- sidebar for all the routes
- create contact and all contacts -
From there, the user can view any contact data by clicking on the view button. After that user can update the contact details by clicking on the edit button and that button shows on the form, In this form the user can edit any attributes of that contact. After that there is another button which is the delete button, that button can delete the contact.
On the second page (‘/chartsandmaps’), Is a Charts and Maps page, the user can see the total number of cases on dates, and the Map can show the data of all the countries.
On this page,
- sidebar for all the routes
- Chart and Map –
The chart can show the line graph of covid 19 active cases on the dates. For this Chart.js is used
Maps can show all countries’ names and markers. Users can see the data related to that country, On clicking on that country’s marker that indicates the country name, total number of active, recovered cases, and deaths in that particular country as a pop-up. For getting this data Maptiler is used.
All the pages are responsive to three level screens like desktop, tabs, and mobiles.