Inspiration
In our first weeks at Purdue, dining was a big part of our lives where we would be able to meet up with friends. Having been very involved with the menu options and dining locations, we quickly realized some of the shortcomings of Purdue Menus. Every weekend we would be left with unused meal swipes which we would look to donate, for which we would have to go to a dining court in-person and only during weekdays. Also, the long lines at Purdue On-The-Gos seemed to defeat the purpose of being 'on the go'. We found ourselves waiting for an hour while being anxious about missing our next class. Thus, we decided to create Purdue Munch in order to address these shortcomings using our skills, and in our own unique way.
What it does
Our website, Purdue Munch, is a website created by us from scratch, to incorporate all features a Purdue Dining website would need, including menus, a login button, and include a variety of new features, like: 1) Online Swipe Out Starvation, 2) Placing On The Go orders online, 3)Adding polls to get student feedback on food
How we built it
We built this from scratch using basic web development tools such as HTML, CSS, and JavaScript. We started off by brainstorming on a Figma Document, and designated tasks to each team member. Over the 24 hours that we coded the website, we followed a modular step-by-step process of creating each element of the website while debugging each, and combined it into several webpages using GitHub.
Challenges we ran into
We tried to use myServlet to implement the login process, using Java to code the backend, however that did not work as per our expectations.
Accomplishments that we're proud of
In the beginning, many of us had little to no javascript experience and limited html and css experience as well. Throughout the coding process we ran into many challenges. For example, there were countless instances where we were baffled that our css code did not translate onto the java web page, however, as we progressed, we became acquainted with css specificity and were able to promptly resolve any such issues. Additionally, we were able to implement counters for food, communication between html pages, multi-selecting buttons which were displayed in another webpage, a poll counter for liking food, all using JavaScript; this was incredibly fulfilling since most of us were of very low proficiency in JavaScript as mentioned before. In general, the way in which we overcame problems, the general cooperative spirit and resourcefulness of our group was instrumental in accomplishing these and was in a way, an accomplishment of its own.
What we learned
We learnt about CSS specificity and why certain CSS code doesn’t get implemented in our HTML pages, due to it being overridden by another inbuilt style. We also learnt about implementing actionListeners and using DOM in javascript which were essential for numerous functionalities that we implemented. Lastly, we learnt how to use localStorage to store variables that are common across the project, which is useful for interclass communication. Lastly, we became much more proficient with grid, flexbox, and bootstrap; this was especially crucial for our login, forms, and page layouts.
What's next for Purdue Munch
-Comments sections for the dining courts every day for users to comment specifically about their opinions on the food. -ML scraping to search for keywords and display them as comments on the side. -Search bars to traverse all the dining court menus every day to find specific menu items that users are looking for. -Using Google Maps API to give directions to the user's nearest/selected dining location. -Updating real time traffic at each dining location using data inputted by the users. -Images of each food item.
Log in or sign up for Devpost to join the conversation.