North South University

Department of Electrical & Computer Engineering

Course Name: CSE 299

Group members: Sonia Tasmin Sneha 1811608042

NM Rifat Rahman 1812817042

Introduction: The purpose of this course is to give a general idea of how to establish
an idea, how to visualize it, and turn it into reality. This course also focuses on problem-
solving skills and the importance of teamwork. The topic of our project is the ongoing
covid-19 situation. Covid-19 has made our lives harder. We focused on how to visualize
the whole pandemic situation in one place to make our daily life easier. 

Design steps: The features we planned are a homepage containing the overall

statistics of the covid-19 situation using API. The homepage consists of a navigation bar
where anyone can browse through our final product. We have a donation page where
people can donate, search Blood according to their blood group and location. There is
also a portfolio section of available blood donors. A hospital appointment page where
anyone can appoint to their desired hospital. It also shows general hospitals in a
particular area. 
The tasks were divided into half-half. Unlike the previous projects we have done so far,
the ongoing situation restricted our interactions. As a result, we could not contribute to
each section of our project; instead, we divided the whole project in half and did our
parts. 
For our website, we used HTML, CSS, Javascript, bootstrap, PHP, xampp. Html, CSS is
the skeleton of a website. A website built only on HTML, CSS can be responsive, but it
doesn’t appeal to the users. So, we used Javascript and bootstrap to beautify our
website at the user level. For the server-side application, we used PHP. It can collect
and send data from database to website. We used xampp as a local web server on our
devices.

  
Implementation: Here is a portion of code from hospital appointments where we used
PHP. Php is used to fetch and store information from a specific table from the database.
It’s a portion of code from search hospital. Search hospital is a feature where users can
use the search bar to put an address, and all the available hospitals will in that area be
shown.

Here is a portion of the code to register as a donor from the Blood donation section of
our project. It accepts the values from the website and stores them in the database.
 Here is the code of portfolio section of the blood donors

There is a search blood feature where users can search donors using Blood Group or
location. According to the user's request, available donors will pop up. 
Main challenges we faced during our works on backend development. Storing data to a
database, fetching it, and using it to our needs was the biggest challenge. To visualize
the real-time covid-19 statistics using API, we faced a challenging situation as it was our
first time working with API. Also, there was some misbehavior on UI. We solved all of
the problems through thorough research. 

UI presentation: UI of the Donate Blood homepage.

UI of the Hospital Appointment homepage
UI of the find hospital section
We did a photo slider to decorate our website.

Desktop 2021.05.25 - 13.36.39.02.mp4

Conclusion: Our goal was to create a platform for the ongoing pandemic where anyone
can get all the info and help in one place. We achieved our goal to put all the things in
one place. With the limitation of time and knowledge, we did a decent job presenting our
website. But there is always room to make things better. If we get an excellent response
to our project, we will be encouraged to add more features, pieces of information and
make our website more beautiful and interactive.