Woodside Bazaar is an online grocery store that allows users to shop the freshest of ingredients! This mock application is meant to serve as a template for local mom/pop stores, and further customizations can be made based on the client's request.
Next JS, Typescript, React, Tailwind/Daisy UI, Redux Toolkit, Stripe
Here's a walkthrough of how the app functions:
-
User loads into the home page & looks at the website promo banner. Then scroll to product section and add items to cart.
-
User can toggle the quantity of their selected products in cart as well as remove them. All data is reflected in cart summary menu.
-
User can checkout after logging in. Cart automatically empties & redirected to success page.
-
All order information is stored in stripe dashboard.
Clone this repository and install npm packages.
npm installThen, to deploy this project run the following on client & server terminal:
npm run dev- Login, Register & order page current design. Will be worked on in future updates.
In future versions, I plan on implementing a variety of features:
- Adding order history to dedicated order page
- Making all product filters functional
- Adding a search bar to header
- Redirect next auth to my custom login/register page
- Connecting to a database