Code Monkey home page Code Monkey logo

finbit-hiring's Introduction

Finbit react developer hiring test

In this test, you are required to consume an API that returns a JSON data of COVID cases for countries and visualize part of it. The API endpoint is http://my-json-server.typicode.com/yisehak-awm/finbit-hiring/result The API returns an array of objects each representing data for a single country. Each object has the following structure

{
  country: "China",
  records: [
    {
      day: 1,
      new: 23,
      death: 5,
      recovered: 14
    },
    {
      day: 2,
      new: 12,
      death: 4,
      recovered: 7
    },
    ...
  ]
}

The records is an array of daily reports of COVID cases for 30 days. Each object contains the daily number of new cases, deaths and recoveries.

Getting started

  1. Fork this repository
  2. Clone your fork on your computer
  3. Switch to the starter branch
  4. Create a new branch named develop.
  5. You will see that we have already implemented a LineChart and PieChart components in the core directory. You are not expected to make changes to those components. Simply import and use them in your code. Both chart components expect a single data property. The line chart takes an array of objects each having country name as ID and an array of points with day as field x and number of new cases as y.
[
 {
    "id": "China",   
    "data": [
      {
        "x": 1,
        "y": 13
      },
      {
        "x": 2,
        "y": 9
      },
      ...
]

The pie chart takes an array of 3 objects as following

[
  {
    "id": "new",
    "label": "New Case",
    "value": 43,   
  },
  {
    "id": "death",
    "label": "Deaths",
    "value": 26,
  },
  {
    "id": "recovery",
    "label": "Recoveries",
    "value": 12,
  } 

You will prepare a form that lets the user filter the data by selecting countries and specifying start and end days. Make sure the form will work if more countries are added to the data.

The pie chart at the bottom shows data for the most affected county. The most affected country is defined as the one with the largest difference between total cases and recoveries within the defined duration.

  1. When you are done, send a pull request to the develop branch of this repository.

Good luck!

finbit-hiring's People

Contributors

yisehak-awm avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.