DEV Community

Cover image for From sketchy script to clean website
tonievalue
tonievalue

Posted on

From sketchy script to clean website

Well, I guess it isn't what you expected to find in this article. I'm writing this to share my personal experience of building my first production website that utilised Symfony framework.

Let's start with some context

Back in 2020 when the pandemic began to spread in Poland, I wanted to track the statistics and share them with my friends using our private Discord server. Nothing special, just a daily doze of information about new cases.

First and sketchy solution

To be completely honest, digging and messing around with code is something that I really enjoy, so creating my own solution was more than obvious.

I started from analysing official communication channels and figure our what they are posting and how it can be useful to me. Twitter quickly became my data provider. Everyday between 10:00 and 10:30 AM, new statistics became available publicly. Every day, the pattern of the message was the same, only the numbers were different.

So I quickly wrote very sketchy PHP script, that used Twitter API to receive the latest tweets and extract all available information from their content. My script was executed four times a day using cron job and was connecting to my MySQL database. On every execution, my script was checking if statistics for current date were present. If not, then new records were persisted and Discord webhook was executed.

Utilising database

After a short time a new idea came to my mind: why not to make use of that data?

This upgrade brought a very simple dashboard built on top of script I described in previous section. Again, nothing fancy, just a simple page created using Bootstrap 5 that was presenting history of cases in form of a chart and a simple table.

Unfortunately, this version has been lost during process of upgrading my website.

Making it as it should be

A few months before end of 2020 I decided to make Symfony my primary framework, so I wanted to start making new projects and mastering my skills.

Combining it with ongoing pandemic, rebuilding my simple website was a great choice.

I started from researching how much more information I can gather from my main data provider, and explore possibilities of utilising other sources. At that time, government launched their own website with covid statistics, but with poor user experience, fatal design and without possibility to explore historic data.

New source of data was much richer than simple information posted on Twitter. Now I got access to new cases, tests, deaths, cures and everything split between provinces. This gave me opportunity to create nice to eye design, which I did, using my favourite CSS framework - Tailwind. It was almost identical to what you can see in header of this post.

Backend this time was written using Symfony, not plain PHP like first version of the website. The method of gathering data was generally the same, using a cron job. Several times between 10:00 and 10:30 AM, a special endpoint was executed, triggering the procedure of reading public website with all statistics, gathering as much information as possible, and storing all of them in my database. Again, if statistics for specific day was already preserved in database, whole procedure of gathering data was skipped.

Having Symfony as a backend inspired me to going even further and practice few design patterns:

  • Builder - frontend contains several blocks, that are representing single statistics. Each block had small indicator showing how it changed compared to previous day. Builder was responsible to calculate that statistics.
  • Factory - used for another part of a frontend, which was building data for charts that were showing statistics from last 30 days.
  • Facade - used for creating common interface for part of code that was responsible for analysing source website, from which I was gathering statistics.

The last shot

The upgraded version of my website was up and running for more than a year before I decided to perform the last refactor in early 2022. Even though I didn't care much about my COVID statistics at this point, I found this to be a great exercise before starting to look for a new job.

Comparing this refactor to previous version of website, it didn't changed much. However, the main changes happened under the hood.

The backend script was cleaned up and organised. Some of the redundant code was extracted into separated services. The structure of most files was changed to increase readability.

Tailwind received proper implementation, utilising Symfony Encore, and many elements were moved to separate component to reduce code redundancy.

The most important things (like the scraper which was responsible for gathering everyday data) received a decent code coverage thanks to use of PHPUnit.

In the meantime, my data provider introduced information about daily vaccinations, that was presented in a few ways:

  • Overall
  • By age
  • By gender I took advantage of this and coded new widgets for my website.

In addition, I introduced ability to travel through history and preview statistics from any day in history, beginning at a day when my first script has been launched.

At the end...

Thanks for reading this long article.
I'll be very grateful to hear any feedback from you, as I'm aware that many parts of this can sound chaotic.

At this moment my website is no longer online. Has been taken down at the beginning of this year, as my data provider drastically changed some parts of his website and I didn't want to spent more time adjusting this part of my script.

Top comments (0)