Because of the recent times I wanted to contribute to something about COVID-19, I found a website that seemingly needed help. An Indian student at NIT Jamshedpur (National Institute of Technology, Jamshedpur)
The repo that I contributed to is https://github.com/Mustafiz04/Covid-19-website
Or: https://covid-19-website.herokuapp.com
The first thing that I noticed while browsing the website looking for something that I could fix or create was that when on a page that isn't the home page, clicking on the links 'about', 'symptoms', and 'prevention' didn't route correctly. Issue: https://github.com/Mustafiz04/Covid-19-website/issues/2
Looking through the code I quickly realized that the href for the links was using '#' which wouldn't actually route back to the home page. The fix was simple, just adding '/' in front of it so it would go back to the root of the website.
But considering that this only took me about ~10 minutes of my time finding and fixing the bug I thought there must be something else that I can do.
Obviously the website creator presumably speaks Indian as a first language as I could see some spelling mistakes and grammatical errors on the home page. I decided that I was going to fix them for him. This took a lot longer then I thought it was going to...
https://github.com/Mustafiz04/Covid-19-website/issues/6
In addition to this I found another bug on the 'donation' route which made the footer not attached to the bottom, seeing that I have had this issue sometimes before you can easily just do
position: absolute,
bottom: 0
But the issue is that he was using a general css file, so next you may ask "Well why not just add an inline css property" that's what I thought as well until I came across the reason as to why I chose to go through with this pull request as apart of my assignment. The original developer was using something called EJS (https://ejs.co/). I have never worked with EJS but it seemed sorta like a template system almost like handlebars.js.
Originally I was just going to look for a fix for that specific EJS issue but it actually turned out to me pretty much learning basic EJS.
After looking through docs for I don't know how long and learning EJS I found out that I still cannot add special properties so instead I increase the .donation class on the page which pushed down the footer to the bottom of the viewport. The fix is for any monitor <2160 which basically means it fixes anything 4k and below. (Not many monitors are above 8k right now anyways)
My two pull: https://github.com/Mustafiz04/Covid-19-website/pull/5, https://github.com/Mustafiz04/Covid-19-website/pull/7
TLDR; I got to contribute to a Covid-19 app and learnt about EJS
Top comments (0)