# Project export: EATtoMEET
This document was generated by HackStack to give an AI agent context about a hackathon project. Sections are labeled with their provenance; content marked as truncated was cut to keep this document small.
## Project metadata
- Hackathon: TreeHacks 2024
- Tagline: You won't MEET until you EAT
- Devpost: https://devpost.com/software/eattomeet
- GitHub: https://github.com/annajyang/eattomeet
- Video: https://www.youtube.com/embed/5Exdfm_E5GA?enablejsapi=1&hl=en_US&rel=0&start=&version=3&wmode=transparent
- Team: 1 GitHub contributor(s) — Anna Yang (43 commits)
## Devpost submission (written by the team)
### Inspiration
After entering into the hectic lifestyles of higher education and employment, how often do we reconnect with our parents and grandparents? How often do we visit the place we used to call “home”? As we reach the halfway point of our freshman year in college, we realize how we neglect the responsibility to actively communicate with our family members. Over 22% of Americans 65 and older are isolated and have a lack of support from family members, leading to a life marked with disconnection and loneliness, increasing their chances of Alzheimer's, dementia, and depression. As global fertility rates decline, senior populations increase rapidly while younger generations shrink. Mental health saves lives. Yet, there is little-to-no spotlight on the declining mental health of senior citizens, who face struggles with illnesses that come with age, declining quality of life, and social isolation. Recognizing these impacts on the elderly, we were inspired to build our web application, EATtoMEET, to address this problem head-on. Our mission is to create an inclusive platform that goes beyond technology—it’s about filling empty hearts; it’s about filling empty mouths with delicious meals and thoughtful conversations; it’s about filling the responsibility of caring for the senior population. It starts with one shared meal.
### What it does
EATtoMEET simplifies the dining experience: Users input responses such as food preferences and interests for personalized restaurant recommendations. They can then explore detailed restaurant information which contains ratings, photos, and the address, which is obtained from web scraping popular restaurant review sites, including YeIp. Within the site, users can join a personalized chat room in order to meet with similarly inclined users. In these rooms, members can view profiles, chat, and coordinate meet-ups at chosen restaurants.
### How we built it
We created a detailed prototype of the web application on Figma, in which we were able to obtain features (dimensions, position, color, style of font, etc.) of objects which included buttons, photos, and text. One benefit of Figma is it exports the scale of your design, making it easier for us to implement variables when building the web application. We wrote our code in Visual Code Studio using CSS (frontend), HTML(frontend), and JavaScript (backend). With CSS and HTML, we implemented the design from Figma into code, taking advantage of the web developer feature of Figma to see the correct dimensions and positions of each element. The JavaScript was used for more advanced features in the website and smoother UI, like the slow scroll on the home page when going to "about" and transferring the data from the starting form into the profile page. Using GitHub, we were able to do version control and collaborate with each other.
### Challenges we ran into
For most of us, this was our very first hackathon and some of the team had just started learning how to code. Among the four of us, we had no web design or web development experience prior to TreeHacks. Thus, we struggled to transform our complex idea into a finalized product. However, with the help of our amazing sponsors, mentors, workshops, and the power of YouTube tutorials, we successfully navigated our obstacles to create a functioning web application that addressed our purpose for EATtoMEET. ## Accomplishments we are proud of Once the hacking period began, our meticulous brainstorming allowed us to create a solid game plan and delegate tasks which highlighted individual team members strengths. This efficient task delegation facilitated organized and successful project execution with the allotted time we were given. On the technical side, we learned a lot of new techniques to make our web app more aesthetic and functional by tinkering around with JavaScript commands we recently learned!
### What we learned
Anna and Tracy used CSS, JavaScript, and HTML for the first time and with a plethora of tutorial videos from YouTube, they navigated their way through the obstacles which ultimately made a final product of our web application. Hannah used Figma for the first time in which she designed the whole website using her research on senior friendly web app features. Vivian, in turn, honed her skills in persuasive communication, writing a script to pitch our idea and product to potential judges. She also went to multiple workshops to acquire different software applications for us to use for our product. Amidst the sleepless nights, the fast paced work environment, and sore wrists, our bond deepened as we laughed off our silly syntax errors and small little successes. At the end, it was our shared commitment to crafting an accessible platform for seniors and addressing the urgency to create support services for our elderly citizens that united us.
### What's next
To expand EATtoMEET and promote intergenerational connection, we hope that younger users are also interested in joining the service and meeting new friendly faces beyond the demographics they usually spend time with. Through partnerships with educational institutions, we aim to bridge the generational gap, creating a vibrant community where diverse age groups can share meaningful experiences through the joy of shared meals. This expansion will enrich the platform, promoting a culture of inclusivity and understanding among users of all ages. We plan to collect and integrate a larger database that is able to store factors like the answers of users (interests, location, etc.), their compatibility with previous EATtoMEET members, a better gauge of their palates based on restaurants they enjoyed. Building this database gives us the starting point to launch more complex algorithms and better group matches, which will get the elderly users of EATtoMEET excited for their next social event!
## README (from the GitHub repository)
# This is the code for EATtoMEET, our project for Treehacks24
## Detected evidence (automated analysis)
Indexed codebase: 18 recognized source files, 43 KB.
- CSS (language) — detected in the code
- HTML (language) — detected in the code
- JavaScript (language) — detected in the code
## Codebase structure (from repository index)
### Files (18 of 18)
```
chefchus.css
chefchus.html
form_scripts.js
form_styles.css
form.html
gc_scripts.js
gc.css
gc.html
index_scripts.js
index.css
index.html
johndoe.css
johndoe.html
myprofile.css
myprofile.html
README.md
restaurants.css
restaurants.html
```
### Dependencies
No dependency index available.
### Recent commits (newest first)
- about section
- fixed popup for form
- update links to about
- index.css
- merge index and index2
- Merge branch 'main' of https://github.com/annajyang/eattomeet
- copy of index
- about section
- updated site icon
- font change
- readme
- linking profile in group chat
- john doe page final
- complete myprofile page
- update profile links
- Merge branch 'main' of https://github.com/annajyang/eattomeet
- js for profile form
- back button for gc and merge resolved
- back button for gc
- gc working
## Key source files (fetched from GitHub, selected and truncated for size)
### index_scripts.js
```javascript
document.addEventListener('DOMContentLoaded', function() {
const links = document.querySelectorAll('a[href^="#"]');
links.forEach(link => {
link.addEventListener('click', function(e) {
e.preventDefault();
const targetId = this.getAttribute('href');
const targetElement = document.querySelector(targetId);
if (targetElement) {
const offset = targetElement.offsetTop;
window.scrollTo({
top: offset,
behavior: 'smooth'
});
}
});
});
});
```
### gc.html
```html
Group Chat
