FoodBridge

FoodBridge — A community platform to share surplus food and fight hunger

Inspiration

Every day, I see food being thrown away — leftover meals, excess vegetables, unsold groceries. At the same time, millions of people go to bed hungry every night. This disconnect inspired me to build FoodBridge — a platform that connects people who have surplus food with people who need it, completely free of cost.

The UN estimates that 1/3 of all food produced globally is wasted, while 828 million people face hunger. I wanted to do something about that, even at a small community level.

What it does

FoodBridge is a community-driven web application that allows anyone to:

Post surplus food they want to give away — cooked meals, vegetables, packaged goods and more
Browse available food listings in their area
Search by food name or location to find what's nearby
Claim a listing to reserve it for pickup
Track their own posts and claimed items

How we built it

FoodBridge is built using the MERN stack:

MongoDB Atlas — cloud database to store all food listings
Express.js — REST API backend with full CRUD operations
React.js — dynamic frontend with React Router for navigation
Node.js — server runtime environment
Tailwind CSS — dark themed, responsive UI
Axios — API communication between frontend and backend
Day.js — relative time display ("Posted 2 hours ago")
React Hot Toast — clean notification system

The backend is deployed on Render and the frontend on Vercel, making it completely free to run and scale.

Challenges we ran into

-CORS issues between the deployed frontend and backend — solved by configuring explicit allowed origins in Express

Environment variables — learned the difference between Create React App and Vite's approach to env variables (process.env vs import.meta.env)
Data consistency — fixing a bug where claimed listings disappeared from the database query, causing incorrect counts
Ownership without auth — implementing a name-based identity system using localStorage to allow users to manage their own listings without a full authentication system

Accomplishments that we're proud of

What we learned

How to build and deploy a complete full stack MERN application from scratch
How to design and implement a REST API with Express and Mongoose
How to connect a React frontend to a Node.js backend using Axios
How to deploy a full stack app for free using Render and Vercel
How to use Tailwind CSS to build a clean, dark themed UI
The importance of environment variables for managing different development and production configurations