0% found this document useful (0 votes)
9 views

ReactJS Frontend Application Assignment

The assignment requires the creation of a COVID-19 dashboard using React.js that visualizes data through interactive charts, focusing on total cases, recoveries, and deaths. It involves integrating two RESTful APIs for fetching historical COVID-19 data and a list of countries, along with implementing various React components, ensuring responsiveness, and maintaining code quality. Deliverables include a public GitHub repository and optional live demo, with evaluation based on adherence to requirements and performance.

Uploaded by

pathansuhail810
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
9 views

ReactJS Frontend Application Assignment

The assignment requires the creation of a COVID-19 dashboard using React.js that visualizes data through interactive charts, focusing on total cases, recoveries, and deaths. It involves integrating two RESTful APIs for fetching historical COVID-19 data and a list of countries, along with implementing various React components, ensuring responsiveness, and maintaining code quality. Deliverables include a public GitHub repository and optional live demo, with evaluation based on adherence to requirements and performance.

Uploaded by

pathansuhail810
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Frontend React JS Developer Assignment`

Objective
Create a COVID-19 dashboard using React.js, which visualizes statistical data through
interactive charts and conveys pandemic statistics, including total cases, recoveries,
and deaths as per the provided Mockup.

Requirements

API Integration
You will be integrating two RESTful APIs to fetch necessary data for the dashboard.

​ COVID-19 Historical Data:


●​ Fetch historical COVID-19 data for a default country (USA) and allow the
user to select different countries from a dropdown menu.
●​ Use the following cURL request to understand the API endpoint:
●​ Method: GET
●​ Endpoint:
https://disease.sh/v3/covid-19/historical/{country}?lastd
ays=1500
●​ Replace {country} with the chosen country from the dropdown.
Make sure to send the ISO code of the country. Example: usa
●​ The lastdays=1100 parameter is hardcoded to fetch data for the
last 1500 days.
●​ The response will be in JSON format containing the historical case
data.
​ Country Options for Dropdown:
●​ To populate the dropdown with country options, integrate a REST API that
provides a list of countries.
●​ Suggested API endpoint:
●​ Endpoint: GET https://restcountries.com/v3.1/all
●​ This endpoint does not require any parameters.
●​ It will return a list of countries along with various details, from
which you can extract the country names and codes for the
dropdown.

Other Requirements
●​ Implement React components such as statistical cards, line chart, and pie chart.
●​ Ensure application state is managed effectively using React's state management
features.
●​ The dashboard must be responsive and work on a variety of screen sizes.
●​ Apply error handling for all API requests.
●​ Write clean, modular, and well-commented code.
●​ Style the application to match the provided mockup as closely as possible.
●​ Use Git for version control and include a README.md with project setup
instructions.

Deliverables
●​ A public GitHub repository with all source code.
●​ A live demo is optional but encouraged.
Evaluation Criteria
●​ Adherence to the provided mockup and functionality.
●​ Code quality and organization.
●​ Responsiveness and usability across devices.
●​ Performance and efficiency of the application.

You might also like