Our inspiration behind Eco-Eats was the realization of how prevalent food waste is in all of our lives and the alarming effects food waste has on our environment and health. Food waste makes up the majority of landfills and generates methane, a type of greenhouse gas, which is 86 times more powerful than carbon dioxide. Although a majority of environmental issues in our society today are in the hands of a very few powerful and rich people, we believed that we could create a website to welcome more people into the journey towards a healthier environment.

What it does

Eco-Eats is a website that utilizes interactive elements and educational resources regarding food waste to raise awareness and assist people to make smarter choices in their daily grocery shopping trips. Our website includes a grocery guide, which informs users about the shelf lives of common foods and how to retain them for longer, a fact generator, a video gallery, and an abundance of other resources for our users.

How we built it

We started out by researching our cause to be able to provide users with accurate information and helpful resources. Then we started building a wireframe on Figma, on which we designed the layout of every page of our website. We also used Coolors to come up with a color palette that fit the theme of our website. After finalizing our designs, we utilized HTML, CSS, and JavaScript to build the actual website itself on Replit.

Challenges we ran into

We faced a multitude of technical issues with Javascript and debugging when building our Grocery Guide and interactive form. However, through these issues, our team members learned to rely on each other and focus on communication within the team. Lastly, we had to learn how to work with the time constraint and condense our ideas to be able to build our project within the given timeframe.

Accomplishments that we're proud of

As a whole, we are extremely proud of the outcome of our website. We believe that our website successfully conveys our goals and incorporates all of the elements we initially planned out. But more importantly, we take pride in our ability to communicate and work effectively with each other despite differences in time zones. Thanks to our teamwork, we were able to bring our website to life.

What we learned

Through this project, we all explored web development and challenged ourselves to expand our skillsets. We learned how to use different digital platforms to work collaboratively on each step of the process. Beyond the technological aspect, we also educated ourselves on the issue surrounding food waste while researching for our website. We learned about composting and other ways to change our lifestyles, and are excited to start combating this issue ourselves. Working on this website deepened our understanding of food waste, and we believe a solid understanding of an issue is crucial to be able to educate others on it.

What's next for Eco-Eats

We aspire to expand the amount of resources on our website, and add a wider range of products to our grocery guide to further amplify our cause and goals. We would also like to program our website to be responsive for all screens, including mobile screens, since modern technology is experiencing a change towards greater use of mobile devices. Overall, we would like to increase the accessibility and impact of our website.

Built With

Share this project: