Introducing New Haven’s “Apizza” Reference Website
For the final project at Yale x Flatiron School Web Development Bootcamp, we built a Single Page Application. It is a full-stack project. The frontend was built with HTML, CSS, and JavaScript. The backend was built with Ruby and Rails. Since it covers everything the course covers, it was a good opportunity to review some of the materials, particularly Rails, at the beginning of the course. Also, it was nice to see all pieces came together as one project. This blog is to provide the background of the project, why I chose to build this website, particularly regarding its features.
I chose to build a website that is called “Pizza@Yale.” It provides a list of pizzas offered in New Haven, and a user can rate or comment on these pizzas. The website already has the database of most of the restaurants and menus of the pizzas, but a user can also add to the list if he or she found a new restaurant or menu. The strength of this website is to allow its users to compare specific types of pizzas across different restaurants in the region. New Haven has been known for its unique charred pizzas. Thus, I thought it would be a good resource for the students and visitors to explore the city.
“Pizza@Yale” is different from the food delivery apps such as Uber Eats, DoorDash, Grubhub. As the name suggests, it only handles pizzas since it aims to foster the iconic pizzas in New Haven. Also, at least for now, it does not provide the option to order online. However, the strength of “Pizza@Yale” is to enable its users to compare the specific pizzas across the restaurants in the city. For instance, a user can look up the ratings and feedbacks of “white clam pizza” of all restaurants in the area by using “Pizza@Yale.” Uber Eats and DoorDash do not provide this feature since their interface is based on restaurants, not menus.
I found the traditional restaurant-based database and interface problematic for users. This data structure is not user-friendly since a user has to visit multiple restaurant pages in order to find the menu he or she likes. Moreover, the traditional structure only provides the rating and feedback of a restaurant, not the menu. It is possible an excellent restaurant provides a poor quality meal for a particular menu. A steakhouse would not be the best choice for ceviche. A Thai restaurant would not be able to provide a top-quality Chinese menu. Thus, I thought that a menu-based model would be more user-friendly.
However, the drawback of the menu-based model is that a developer has to input all possible menu across the restaurants. It is not only time-consuming but also not accurate. For instance, a developer would like to list “pad thai” as a common menu for multiple Thai restaurants. The developer would quickly discover that each restaurant has different versions of “pad thai” such as shrimp, beef, pork, spicy, etc. For the purpose of this project, I had to limit my project to pizza. I chose pizza because (1) it uniquely represents New Haven and Yale, and (2) it is relatively easy to categorize across different providers.
Moreover, I aimed to foster a sense of community at Yale and New Haven. For the students at Yale, New Haven is a small city with limited dining options. While the pizza in New Haven is well known across the country, there are only three restaurants well known to visitors and students. Therefore, I intended this project can be a reference for the people in New Haven to explore more beyond the “big three” pizza places (Frank Pepe, Sally’s, and Modern Appiza). Also, I hope that students and residents can take pride in their local heritage navigating through the website.
