Inspiration
We realized that the data available online for Nations isn't as visually available and not compiled in a way that would make it easier for the user to use and view, and so we thought about making a website where people can look at some of the information in a more readable manner
What it does
Our decision was to concentrate on a method that not only facilitates the user to access the most up-to-date data from certain countries but also enables them to compare the data of two distinct countries and offer links to charitable organizations where the user can contribute to provide assistance. To ensure consistency in our data, we exclusively collected it from the World Bank to present to the user.
How we built it
We built the project using React.js as our main framework and using World Bank to get all our data for the countries. We implemented different JavaScript Libraries to help build the website and make it what it is.
Challenges we ran into
Collecting the Data: Finding which data was relevant and then cleaning and aggregating it into a form that could be used in our code Representing the Data: Figuring out how we could actually represent the data in a way that is clear and shows all relevant information Making the Project Interactive: Figuring out how to allow the user to dynamically change the data they wanted to see Documentation: The data from the API did not match the format we needed which made it hard for us to use
Accomplishments that we're proud of
We take pride in developing an interactive map that shows data for the selected country, creating a chart that compares data from two user-selected countries using an auto-fill search bar, and utilizing modals to present data in a neat and concise manner.
What we learned
While working on this project, we had to utilize unfamiliar libraries, such as ReactJS, Simple-react-map, Chart.js, and gather data from World Bank . This forced us to learn how to quicky navigate documentation and adapt to new syntax. Since this type of project was new to us, we had to learn to work with a growth mindset, remembering that failures were overlookable and that with enough effort, we could make it to the finish line.
Built With
- chart.js
- javascript
- node.js
- react
- simple-react-map
Log in or sign up for Devpost to join the conversation.