GraphCheaprEat

Inspiration

Coming into this hackathon I knew that I wanted to do something with React and GraphQL. It just happens so that CheaprEat is offering their APIs in GraphQL and so I thought why not have a crack at this.

What it does

GraphCheaprEat is an web-app that allows a user to select a country and will render a google map that plots all the vendors associated with CheaprEat

How I built it

I used GraphQL to make all the queries and mutations to get all the information that I need (e.g: a list of vendors). The frontend was built with React along with Google MAP APIs

Challenges I ran into

Since I have no prior knowledge of how to use React or GraphQL and so trying to learn two frameworks in the span of 36 hours was definitely the biggest challenge. In addition, I've also had some trouble with rendering the Google Map using the Google Map API with React and on top of all these, building this project by myself was definitely not an easy task.

Accomplishments that I'm proud of

This was the first time using React, Node.js and GraphQL. I'm proud of what I've put together in the past 36 hours.

What I learned

I now know how to create a simple React app as well as making GraphQL query and mutation calls

Next step for GraphCheaprEat

Exhance UI/UX; Increase the country list pool or allow user to manually input a country; Narrow the list of country to the list of cities, if the queries become large enough.