Inspiration

Noticing the increasing cases of depression and suicide as adverse effects of the COVID-19 pandemic, I thought it was essential that there exists a community-centric platform where people can start an open discussion, post uplifting content, seek help with regards to COVID-19 and most importantly stay updated with latest developments and guidelines.

What it does

My main intention to create this website was to develop an interconnected community for the people of my country to communicate on, stay updated with reliable information, and create a well-informed community in order to battle COVID-19. I designed the website such that it serves as a model for other localized communities to use.

The website is broadly divided into two tabs- "Dashboard" and "Discussion", using a user-friendly UI design.

In the Dashboard tab, users have easy access to the live data presenting the current case summary, historic case summary, charts, and reliable information from the Ministry of Health in order to address the issue of misinformation. In the Discussion tab, people can voice out their doubts, questions, or concerns regarding COVID-19 and the more important part is that they should be heard by people belonging to the same community.

Let's say someone wants to know about the testing procedure within their county and how the process works, they can just ask in the discussion page and someone who has gone through the process can brief them on it. Perhaps, a local organization is looking for volunteers or donations, they can post it on this platform for visibility. There could be a scenario where an elderly couple is in need of medicines but can't leave their home due to a high risk of infection, they can just post it on the discussion page and a good Samaritan could help them out!

Overall, such a community-based website:

  1. Citizens can stay informed about COVID-19 developments at a community level and reliable information that matter to them the most since the website only includes information about their community.
  2. People can ask for help, advice, suggestions, volunteers, donations from a community that is more likely to offer help.

How I built it

I used the create-react-app and Javascript to build the entire interface along with Bootstrap-react for the front end. The data is pulled from reliable APIs such as the disease.sh, which gets it information from the JHU dataset and WHO dataset. I also used the React Router to route between the two tabs on the webpage.

Challenges I ran into

The major task for me was to find a reliable dataset that I can use to display the stats on my website.

Accomplishments that I'm proud of

I'm proud that I was able to make my website super user-friendly using a UI that can be easily navigated and used. I'm also proud that the website is responsive to all screen sizes and adjusts automatically.

What I learned

All of my coding experience before this project was solely python and C++, but for this project, I pushed myself and learned the process of web development and how to use the React framework to easily create functional web apps that are fast and effective. I also learned how to make a website responsive to screen sizes and include accessibility features.

What's next for COVID-19 Bahrain Tracker and Discussion

Perhaps in the future, the website can collaborate with local community relief organizations and provide a direct messaging feature so that they contacted directly in case of emergency help.

Built With

Share this project:

Updates