Freshcart-online grocery store

About FreshCart

Inspiration

FreshCart was created to make online grocery shopping simple, convenient, and user-friendly. Traditional grocery shopping can take time, and customers may find it difficult to compare products, identify discounts, and manage their shopping lists. Our goal was to bring essential grocery shopping features together in one website.

What it does

FreshCart is an interactive online grocery store built using HTML, CSS, and JavaScript. It allows users to explore grocery products, search for items, filter products by category, and add products to their shopping cart.

Key features include:

• Product Browsing: Explore different grocery products and categories.
• Search and Filter: Find products quickly using search and category filters.
• Shopping Cart: Add products to the cart and manage selected items.
• Discounts and Coupons: View discounted prices and apply the SAVE10 coupon.
• Wishlist: Save favorite products for later.
• Order Tracking: View the progress of an order.
• User Profile: Access account information and order details.
• Admin Dashboard: Manage product information and view customer orders.

How we built it

We developed FreshCart using three core web technologies:

• HTML to structure the website and its different sections.
• CSS to create the layout, styling, product cards, and responsive interface.
• JavaScript to implement interactive features such as searching, filtering, cart management, discount calculations, wishlist functionality, and order tracking.

We also used browser localStorage to retain selected information, including cart items, wishlist products, and orders, between page refreshes.

Challenges we faced

One of the main challenges was connecting different features while keeping the website functional. We worked on product filtering, updating cart quantities, calculating discounted prices, checking stock availability, and storing data in localStorage. We also focused on making navigation between the shopping interface, user profile, and admin dashboard easier to understand.

What we learned

Building FreshCart helped us improve our practical knowledge of HTML, CSS, and JavaScript. We learned how to manage application data, handle user interactions, organize website components, debug errors, and connect multiple features into a single web application.

Future improvements

In the future, we would like to integrate a backend database, secure user authentication, online payment functionality, real product images, and live order updates to make FreshCart more complete.

Conclusion

FreshCart represents our effort to create a simple and accessible grocery shopping experience through web development. It helped us apply our frontend development knowledge to a practical, real-world use case.

Built With

• css
• development
• e-commerce
• frontend
• html
• javascript
• localstorage
• responsive
• web