Inspiration

The inspiration behind covid 19 tracker wat to provide a smooth , minimal and bug free web app for people to conveniently check and analyse covid 19 data of any country and even worldwide !

What it does

The covid 19 tracker web application can display covid 19 data including total cases , total deaths and total recovered cases of any country or worldwide , it can also display present date cases updated live , using a web API provided by disease.sh . It also displays data in form a graphs and maps which can update dynamically while interacting with the website . The dark theme of the website makes it look very minimal and attractive also . It's a single page web app which can provide its users with covid related data which they would generally need daily .

How we built it

Our team had a brainstorming session in order to choose a suitable project to work on , we finally arrived on this idea .Firstly we searched around the internet for covid 19 trackers which were in use . We say each site and gained inspiration from them , simultaneously planning the ui and functionalities of our own app . Then we decided the framework to work on which was react as majority of our team members were familiar with javascript . We then made the basic framework of our app . We searched for good graphical libraries for react js . We found react charts js really useful for creating charts , and also found leaflet which we used to implement the map functionality . We used semantic ui for other elements in our web app . We found a web api provided by diseases.sh which provided us with covid-19 data which was updated readily . We then decided the final touches ,like the color scheme of our web site and fonts and the overall UI .

Challenges we ran into

One of the hardest challenge for us was definitely to manage our time during the whole event , since we are all full time students with our online semester in progress , it was difficult for us to meet and interact at a fixed time .Finding and implementing the map functionality in our project was also a difficult task ,as it's a thing which was new to all of us , the documentation was not very clear , and anytime we tried something , other thing would go wrong . Finally a lot of online documentation and youtube videos came to our rescue . The other difficult task was to change the graph stye and colour dynamically , in order to make it more interactive , it involved a long time with CSS code , but we finally did it .

Accomplishments that we're proud of

This was the first of its kind project for most of us. We were unsure how we could build something in such a short time, but we did manage to stick by. The map and graph we implemented, took a lot of time, and effort to figure out. We almost came to a point, where we thought about dropping it as a whole, but we worked on it the whole night and came up with a solution and we are really proud of that. Moreover, our team is up and running and we aren't going to stop anytime soon.

What we learned

Deploying a site using github-pages , fixing bugs, learning some new css and react tools such as flex box and react hooks . All in all, it was a great learning experience .

What's next for Covid 19 tracker

We will build a ML model, to predict the future cases upto a month, or so and even try to predict the time by which the covid-19 would be evicted. Once that is done, we will try and get inside a particular country and do the same analysis, for a particular region

Share this project:

Updates