DEV Community

Cover image for Spring + Thymeleaf + Bulma + Charts = Awesome Covid Trend Tracker
Ankit Beniwal
Ankit Beniwal

Posted on

Spring + Thymeleaf + Bulma + Charts = Awesome Covid Trend Tracker

Hi Folks,

I hope you all and your families are safe.

I know I am a bit late for a corona tracker app but I think better late than never. This is not a very unique idea but I have tried to present it differently.

And this is my first attempt on java spring. Thus, I will appreciate your precious feedback.

So, When I initially thought about creating a spring application, I had no idea of what I will create. And I started surfing the web for ideas and datasets. I had to choose a not so advanced idea so that I can complete the project fast and build my confidence. Then I found this github repository where covid data is updated daily. They have hosted CSV files where data is updated automatically everyday.

After digging a bit, I came across Apache Commons CSV library which made it easy for me to use that CSV file in my project.

I decided to render a line graph for every country to make it more presentable. And that's how I found highly customizable Google Charts. Fetching Data from CSV was easy, as was using a templated google line chart. But Converting the CSV data to the format which chart needed as input was not that easy. I had to use HashMap of ArrayLists of ArrayLists.

First Level ArrayList - for day wise record of a country from january. (Each record contains three different values for Total Cases, Recovered Cases and Deaths)
Second Level ArrayList - for all countries

This was fun 🤩🤩. If you are interested to know all the nitty-gritty of the implementation. Check the source code.

For frontend I decided to use Bulma CSS due to its lightweight size and ease of use. And for templating, I think thymeleaf is obvious.

Result page looks like this:
Covid Trend Tracker by pagalprogrammer - Result Page

I am open to positive criticism, feedback, chocolates, repo stars, coffee. Check out the live version hosted at heroku

If you are willing to contribute, then create an issue and let's discuss about it or you can skim the code to tell me what I did the way I shouldn't.

GitHub logo ankitbeniwal / covid19Tracker

An Application for displaying trends of covid19 virus in a graphical manner.

Covid 19 Trend Tracker

GitHub GitHub top language GitHub repo size Build Status

An Application for displaying trends of covid19 virus in a graphical manner.

Top comments (0)