Task Delivery

Please don't fork, branch or create a pull request with this repository.
Clone it and do your work there.
When the task is ready, Email your solution back to us (Only first submit count unless otherwise directed).

Task Description

You have a server which returns random numbers via WebSocket (socket.io) connection.

You should implement the next:

A line chart:
- x-axis: time of a received number (look at timestamp payload field)
- y-axis: number values
A bar chart:
- x-axis: range categories (e.g. -10 - 0, 0 - 10, 10 - 20 etc)
- y-axis: the amount of numbers in each category
(Optional) An input called "Alert threshold":
- a user should be able to enter a number
- if the random number received from the server is greater than the threshold - show an alert toast / snackbar with the number as the payload
Design: we appreciate your own design decisions =)

Charts should be updated in real time. Please, consider code style best practices.

P.S. Feel free to use any module bundler, charts package, UI-kit etc you want. BUT please, leave some notes about the project setup.

Install NodeJS
In the project root folder run yarn / npm install
Add .env file with the specified PORT (3000 by default) env variable (look at .env.sample file)
Run yarn start / npm start
Now you can connect to the server via socket.io-client:
- listen for data event
- the payload format is { value: <float>, timestamp: <integer> }