/galvanize-adopt-a-classroom

A web application for tracking donation pledges and contributions. Built with Modern React, Node.js, D3.js and AWS RDS.

Primary LanguageJavaScript

Kytra presents: Donation Tracker for Adopt-a-Classroom COVID-19 Relief


Why Does This Exist?

I created this webpage for tracking pledges and fully paid donations from Galvanize employees across the US as they gave from their hearts to support Adopt-a-Classroom during the COVID-19 relief drive.


Description:

This web application is powered by React with Hooks, D3.js, Node.js (Express) and AWS RDS (mySQL).

The website uses the D3 data visualization library to depict verbal commitments vs. fully paid donations using an Arc Graph. The webpage updates in real-time as donations are added to my AWS RDS database built with mySQL. The donation tracker is dockerized and deployed to AWS EC2 using ElasticBeanstalk and can be viewed directly at: Kytra & Galvanize Donation Tracker

Kytra Donation Tracker Demo GIF

Additional Developer Thoughts:

While I will never turn down an opportunity to use React with Hooks, D3.js was easily one of my favorite parts of this project. Learning how to display the Arc Gauge with css customizations to "brand" it with the Galvanize company theming was immensely fun and I look forward to more opportunities to work with the D3.js library using real-time updated data.

Coming in a close second place is the AWS RDS platform. Working with security groups and launching my local database to the cloud was an incredibly rewarding feeling. Using mySQL workbench on my local machine, I have full control over my deployed RDS database. It feels great knowing I can allow the end user access to the web application and their submissions are updated in real-time.

Additionally, providing the proper meta tags to allow for websites and chat platforms to unfurl shared links of this project was an exciting learning exercise.

Thanks for viewing! If you pull down this repo and try to run it, you'll successfully get the client to run, but the database requires my environment variables that (for obvious reasons) I did not include in this repo. The graph will display $0 pledged vs. $0 paid and the donation list will be blank. Please keep this in mind. Again, if you'd like to see this web app in action, it is deployed and usable here: Kytra & Galvanize Donation Tracker

FEEL FREE TO POKE AROUND THE DEPLOYED SITE AND ADD YOUR OWN ENTRIES. THE DONATION DRIVE HAS CONCLUDED.