HUNGR Food Search App

Students get hungry working late nights in the computer science building. I wanted to create a site that would save students working in the CS department valuable time finding restaurants around them and instead have more time for work.

First, I identified what categories would be of the biggest concern to students. I settled on having filters based on price and food type since these are the main things people look for when deciding what to eat. I also wanted to add a feature to be able to sort the results by proximity to the CIT (our computer science building) to help students under a pressing deadline find the closest option to their preferences and save time. In addition, I wanted a search feature as well so users could find restaurants by name.

In order to implement these sort/filter functions, I chose to use React since it allow the user to interact with the website dynamically and render the information based on the filters the user chose.

Working in React, I wrote functions to filter the dataset based on the category selected and update the corresponding prop so the render function would display the augmented dataset. The sorting function was a bit more complicated because the user should be able to revert back to the unsorted dataset by clicking the sort button twice. To implement this, I created two props, one which was the current dataset to be displayed and one was the unsorted dataset. To decide whether to render the sorted or unsorted dataset, I checked whether the currently displayed data was sorted or not, and updated the currently displayed dataset to be the opposite and have the render function update the prop.

Working on this project was a great experience in working with web development tools like React that allow for interactivity and component-based user interfaces. Operating as both the designer and developer for this site, I was able to create this project from start to finish, translating the design I had in my head to a viable product. In the future, I hope to take my experience with React to create more engaging and interactive products.

Related posts:

When it comes to devices that produce “video” or “motion pictures”, leaders and companies operating in this field have a challenge to clearly communicate “a vision” without being associated with…

Is it possible to sort of guess everything the book is going to say, not be surprised by any of its figures, and still feel like you learned something? I feel like I was just told a lot of…

On their never-ending quest to draw eyeballs to products, marketers increasingly turn to live streaming. The name of the game is more business and sales.