Inspiration

As we buy food on an everyday basis, we rarely stop and think about where it came from before we found it on our grocery shelves. These products are made from various ingredients sourced from all over the world, and the practices used to produce and ship them can be very detrimental on the environment. We realized that we as consumers need to be more conscious in our food choices in order to protect the environment.

What it does

Our web app allows users to easily search for product names and retrieve information about their environmental sustainability. When selecting a product, users are redirected to a product page featuring a pie chart illustrating the distribution of carbon emissions sources. Users are also presented with recommendations for similar products that share comparable eco scores. These eco scores are ratings provided by Open Food Facts, evaluating a product's environmental impact during its manufacturing process.

How we built it

We built GreenBasket using a combination of technologies to create a seamless and user-friendly experience for environmentally conscious consumers. Our tech stack includes:

MongoDB: We used MongoDB as our database to store product information and ratings, making it easy to search and retrieve data.

Vercel: Vercel served as our hosting platform, allowing us to deploy and manage the frontend of the web app.

Auth0: For user authentication and authorization, we implemented Auth0 to ensure secure access to the app's features.

Bootstrap: We leveraged Bootstrap for responsive and visually appealing web design, ensuring a great user experience across devices.

FastAPI: FastAPI powered the backend of our web app, handling requests, data processing, and communication with the Open Food Facts API.

Python Programming: We used Python for server-side logic and integrating various components of our app.

UVicorn: UVicorn was used to run our FastAPI server, ensuring high performance and reliability.

Open Food Facts API: We integrated the Open Food Facts API to gather eco scores and product information, enabling users to make informed choices.

Chart.js: To visualize data, we employed Chart.js to create interactive pie charts that display carbon emissions sources.

Challenges we ran into

We came into the hackathon with very beginner knowledge of many popular frameworks used to build a full stack webapp. This proved as a learning experience in both building stage and to generally develop our skills. We also encountered some specific issues particularly related to database filtering. Going through our dataset was both time consuming and complicated to figure out.

Accomplishments that we're proud of

We are incredibly proud of how we managed to combine our individual skills and knowledge to create a fully functional, full-stack web application. While each team member had experience with different aspects of development, this project allowed us to integrate those skills seamlessly and create something meaningful together.

What we learned

Throughout the development process, we learned a lot about each other's skills and expertise. We gained hands-on experience in full-stack development, including database management, frontend design, backend development, and API integration. This project served as a valuable learning opportunity for our team.

What's next for GreenBasket

Looking ahead, our vision for GreenBasket is to expand our database with a wider range of products and enhance filtering options. We want to provide users with even more detailed and personalized information about the environmental impact of the products they choose. We hope to enhance the cart feature to track progress over time. Overall, GreenBasket is just the beginning of our journey towards promoting sustainable choices and protecting the environment through informed consumer decisions. We're excited to continue developing and improving our app in the future.

Built With

Share this project:

Updates