Charity Hunter

• 

  intial sketch

• 

  how the day went

Inspiration

I wanted to build an app where I could easily find legitimate charities near me and contribute towards their cause. I'm a serial procrastinator so I never got around to doing this, luckily this hackathon came out and themes aligned with my goal, was to make it easier to help people in need.

What it does

Charity hunter enables you to easily find charities and do some good. Charities can be found through your location; the one closest to you will pop up, also, specific themes/causes you want to support can also be found through the app

How we built it

-React, Material UI and plain css was used for Design and a bit of functionality -Axios was used to fetch data -Google Maps was used to render maps and also access location

• The Location details was used in tandem with GlobalGiving api to fetch charity details\

Challenges we ran into

• Actually coding the landing page design wasn't so easy, scrapped the initial two then merged it with some inspiration from dribble. Which in hindsight I spent tooo much time on -The Maps API was tedious to get working, had issues with packages not working with functional components to confusing documentation, eventually found a helpful article on dev.to -Time management was also an issue because I wasn't that used to coming up with all these on the fly so in certain things I "took my time"

Accomplishments that we're proud of

-Gained some confidence in my skillset -Got to finally play around with google maps api -Brought out something I'm better for and proud of

What we learned

• Maps API
• Faster prototyping of design to code
• A lesson in keeping it simple

What's next for Charity Hunter

• UI improvement: the donation page needs to be touched up(spent soo much on lalnding), some animations/effects to make the look better
• code refractoring: some areas where code was repeated or lazy syntax was used cos ease. Would also make it easier for people to contribute

Built With

• axios
• firebase
• globalgivingapi
• google-maps
• react