CoviDonate

Home Page
Login Page
Reverse Geocoding to track User location
Donate Page
Sorting Algorithm
MongoDB database usage

Inspiration

Communities need to connect and help each other now more than ever with the events going on in today's world

What it does

Shows you local projects and foundations that you can donate to, in your area or generally, and allows you to send money to help the charitable cause to fight COVID-19.

How I built it

We used React on the front-end and Flask on the back-end. We used google cloud api to do reverse geolocation and used MongoDB to store and query our data. Our site is hosted from our free domain from domain.com!

Challenges I ran into

Unable to properly send data back and forth between our custom api from the back-end but we eventually managed to fix these issues in time for the deadline, they're functional now!

Accomplishments that I'm proud of

Managed to figure out how to send data from Mongo to Flask, and from Flask to React simply, without too much overhead. The application looks pretty good for how it was constructed.

What I learned

Learned about sending back status codes and errors back from Flask, and how to update state in react.

What's next for CoviDonate

Some parts of the code may not be using the defacto react way to do certain things since we learned on the fly, so that will be updated as we learn more about Flask and React. If this ends up becoming a big project, we will probably refactor this so that its easier for other members of the open-source community to contribute. The community can take this web app from there.

Notes

Since SSL isn't enabled for covidonate.online, some features may not be fully functional. If you use the heroku app one, it should function fine.

Built With

Submitted to

RookieHacks
- Winner 1st Overall Beginner

Created by

I worked on the front-end and the back-end. I built the flask app for the backend, setup app structure on the front-end, did bug fixing on pages, and coded logic for most of the components. I've never worked with React or Flask before but this was definitely a great learning experience.

Devam Sisodraker
I worked on the front-end for the Maps page for the Google Maps API integration. I also worked on the front-end for the Home page. I learned to use python flask to create API endpoints. It was a great learning opportunity to learn a new language (Python Flask for the back-end) and also contributing to the front end.

Vishal Desh
Computer Science - Roboticist - University of British Columbia
I helped build the front end on React and connect it to the mongoDB with a Pythonic API. Using my creativity, I created and styled the Project Page and Donate page. I look forward to furthering functionalities of this project in the future.

Noah Caleanu
I worked on React-based front-end development across the project, with major contributions to the Login and Home pages. Coming from an Angular background, this was an exciting opportunity to add React to my portfolio.

ThomasJFR Richmond