WantAnything?

Starting page when a new account has been created
Main Menu
Landing page

Inspiration

We’ve all been there: it’s 11 PM, you’re studying in your dorm, and you’re craving a snack. You open a delivery app, find a $4 bag of chips, but at checkout, it turns into $10 with service fees, delivery fees, and tips. Plus, the driver can’t even get past the lobby security.

We realized that at any given moment, someone else in our dorm building is already heading to the store. Why pay a stranger to drive a car when a neighbor is already walking there? We wanted to bridge that gap with a system that feels like asking a friend for a favor—but organized, reliable, and mutually beneficial.

What it does

DormFoods is a hyper-local, peer-to-peer delivery network designed exclusively for university housing.

The Live Feed: Students can view a "Flight Board" style feed of active runs happening in their specific dorm.

Runners: Can post a "Ticket" when they are heading out (e.g., "Going to Costco, 5 items max, leaving in 20 mins").

Requesters: Can claim a slot on a runner's ticket and add their items to the list.

Group Logic: The app filters activity by "Dorm Group" so you only see runs relevant to your physical location.

How we built it

We chose a "back-to-basics" approach to ensure maximum performance and cleaner code.

Frontend: We built the UI using Vanilla JavaScript and Semantic HTML5. We avoided heavy frameworks to keep the app lightweight.

Styling: We created a custom CSS design system we call the "Varsity Theme" (Navy, Cream, and Orange palette) using CSS Grid and Flexbox for the dashboard layout.

Backend: We used Google Firebase for authentication and the real-time database. This allows the "Live Feed" to update instantly without the user needing to refresh the page.

Logic: We implemented modular JavaScript files to separate the "Onboarding/Gatekeeper" logic from the main "Dashboard" logic.

Challenges we ran into

The "Auth Guard" Flow: Handling the asynchronous nature of Firebase was tricky. We had to build a robust "Gatekeeper" script that checks if a user belongs to a dorm group before showing them the dashboard, preventing a "flash of unstyled content" or unauthorized access.

State Management without Frameworks: Since we didn't use React or Vue, we had to manually manage the DOM state when users switched between "All Updates" and specific Dorm filters.

Visual Hierarchy: Designing the "Ticket" cards to hold a lot of information (Avatar, Name, Store, ETA, Capacity bar) without looking cluttered took several iterations of CSS refactoring.

Accomplishments that we're proud of

The UI Design: We are really proud of the "Ticket/Boarding Pass" aesthetic for the active runs. It feels tactile and unique compared to standard "card" designs.

Modularity: We successfully separated our code into distinct modules (home.html, order.html, account.html), making the codebase clean and easy for our team to collaborate on simultaneously.

Real-Time Sync: Getting the capacity bars on the tickets to update in real-time as users claimed slots was a huge win.

What we learned

Async/Await Patterns: We gained a much deeper understanding of JavaScript Promises and asynchronous functions while querying the Firestore database.

User Experience: We learned that "less is more." We originally had a complex navigation bar, but simplified it to a focused Sidebar to make the "Live Feed" the star of the show.