DEV Community

Edward Pasenidis
Edward Pasenidis

Posted on

Making apps during quarantine!

Boring, huh?

Quarantine, a different perspective of "staying home as usual", only it's unusual and you can't go out if you get bored. Bad, huh? Eventually it makes you bored - that much that I created a COVID-19 tracker.
But how does it work? I mean, what's the difference of it from many others crappy trackers? Well this one is developed by two people & it contains time charts :) (https://covid-19-system.herokuapp.com/developers)

What is this tracker all about?

I mean, now you compare two time periods (e.g.: December & March)
Kinda useless? Maybe, but social media like using phrases like "COVID-19 infection rate has raised, 5% more than it was in February" and things like that. Who knows, maybe journalists will use that thing. The funny part is that the API wasn't even created by us, yeah - you heard right!
Basically, we will be utilizing a second API soon which is also not ours!
That's open-source for you, beginners! (yes, especially contributing is amazing). Back to our topic, we won't even implemented a custom API, although I may also do this later. Anyways, we will be adding more charts, country search, better mobile responsibility & much more.

Now, let's see how that thing works behind the hood...

Exploring the project

So, if you git clone the site repository you will basically download the repository. Let's start exploring it - open the src folder to get started. See? There are many files; some are for Pug, other are for browser JS, there is also one CSS, nevertheless there are many things on that repo.

But how do they talk?

Well, if you type npm start, a node express server will start. Express is responsible for the routes & some minor things inside the repo.

Then comes Pug, a HTML pre-processor, something like a library that replaces placeholders inside HTML, with real content!

Next coming up is the public directory which contains CSS files and JavaScript that runs in browser (not related to Node, it's linked by Pug),
this fetches information, from an API that you can find on the GitHub project repository as soon as this article ends. [1]

This was a brief documentation, I am not gonna dive deeper; you will be able to do that yourself when the major release will be ready!

Let's not forget to mention the developers;

  • Me, (Edward, also the writer of this post)
  • Lean, (Tasos, a cool dude who has developed from Discord bots to an Arduino-to-Discord webhook system)

Some important links

[1]. https://github.com/pasenidis/covid19-stats
[2]. https://github.com/pasenidis
[3]. https://github.com/TasosY2K

Top comments (0)