Spectrum

Hack@Brown 2018 Facebook Prize Winner

A news aggregator that shows users politically diverse news sources.

Context

Given the current political climate in the US, people often saw people across the aisle as the "far-right" or "far-left". In reality however, there was a political spectrum ranging with many people towards the middle. We created Spectrum as a means to start a conversation and foster mutual understanding between different parties.

Process
ReactJS, NodeJS, Google Cloud SQL

For this project, I designed and built the front end using ReactJS and CSS. I chose ReactJS for its responsiveness and dynamic rendering capabilities, which would create a much smoother user experience. This would also help us achieve Google's Sub One Second Rule.

Our database was hosted on Google Cloud SQL, which we populated using a Python script we wrote that sends batch requests to our API, NEWS API. Saving our data on the cloud meant that we could reduce our pings to the API, and vastly reduce the time it takesfor new results to be fetched and displayed.

To connect our frontend and backend (ReactJS and SQL can't communicate directly), we wrote a nodeJS script to handle HTTP requests from our React frontend, and send the appropriate request to the SQL backend. This nodeJS script would manage the flow of data between the frontend and backend, converting data types and strucutres so that it was readable on both ends.

Challenges

One challenge we had was that none of us really knew ReactJS. We relied heavily on online documentation and examples to create what we needed for a functional website. We also faced the issue of deciding which technologies to use. Typically for hackathons, teams tend to use what's easiest to complete a working website within the 24 hour time limit. However, our team prioritized scalability and long term efficiency, which is why we chose to hose a database as opposed to pinging the API directly from ReactJS.

Result
Mappable Requests Diagram
Conclusion

Our team was extremely happy to have completed a working website with a clean and easy-to-use interface. Feedback that we received during the hack presentations reflected peoples appreciation for our product, and we were extremely happy to win the Facebook Prize for our work. Thank you to the mentors who helped us throughout the hackathon!

More Projects