Daily Oats

Inspiration

As a beginner programmer, I wanted to combine aesthetic design with interactive user experience. I was inspired by clean, modern e-commerce cafes and wanted to build a warm, inviting digital storefront for an artisanal oatmeal shop.

What It Does

DAILY OATS🎀 is an interactive frontend e-commerce web application. Users can beautifully customize their bowl selections, add items to an interactive trolley/cart, and experience a smooth simulated checkout flow.

How I Built It

HTML5 & CSS3: Structured for high accessibility and styled with soft, cozy, warm-toned UI components and responsive layouts.
JavaScript (ES6+): Programmed client-side logic to handle dynamic state management for the shopping trolley, price calculations, and checkout interactions.

Challenges We Faced

Managing state and DOM manipulation for the shopping cart purely on the frontend while ensuring the user interface remained responsive and visually appealing required careful planning and clean code structuring.

What We Learned & What's Next

Mastered fundamental DOM manipulation and event handling in JavaScript.
Learned how to structure scalable frontend architecture.
Next steps: Connecting this interface to a live backend (Node.js/Express) and integrating database support for real order processing!