DEV Community

Edward Pasenidis
Edward Pasenidis

Posted on

1 1

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

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay