VarietyShoppingHour

Inspiration

We wanted to create a simple yet practical project to get more hands-on experience with full-stack web development. Our goal was to practice building, connecting, and deploying the pieces of a modern web app, while also experimenting with generative AI integrations.

What it does

VarietyShoppingHour is a web app where users can enter shopping items with details like name, price, image, and description. The app uses the Gemini API to validate and filter items, ensuring they match the entered criteria before saving and displaying them.

How we built it

Frontend: React for the user interface
Backend: Express/Node.js to handle API routes and item validation
Database: MongoDB to store user-submitted items
AI: Gemini API for content checking against item fields

Challenges we ran into

Setting up authentication and handling user sessions
Debugging unexpected behavior when integrating the Gemini API
Resolving merge conflicts and syncing our work across team members

Accomplishments that we're proud of

Successfully connecting all components (React, Node, MongoDB, Gemini) into one working app
Collaborating effectively to merge code and bring our different parts together

What we learned

Hands-on experience with the MERN stack
How to integrate generative AI APIs into a web workflow
The importance of teamwork, communication, and version control in development

What's next for VarietyShoppingHour

Smarter GenAI support: recognizing saved items and providing intelligent recommendations
More robust authentication and personalization features
A cleaner, more polished UI/UX for item browsing