MyStore is Angular application that allows users to view a list of available products to purchase, add them to a shopping cart, and ultimately complete the checkout process.
This project can be viewed at https://buy4him.netlify.app
Run ng serve
for a dev server. Navigate to http://localhost:4200/
. The application will automatically reload if you change any of the source files.
Run ng build
to build the project. The build artifacts will be stored in the dist/
directory.
This application reflects the same user experience as that of a real-world e-commerce website, including a(n):
-
Products page: Which displays the available products for the user to choose and add to their cart (in various quantities).
-
Product details page: Which displays more information about any particular product.
-
Shopping cart: Which includes the products that the user has added to their cart.
-
Checkout form: Which collects information about the user (e.g., name, address, payment details, etc.)
-
Order confirmation page: Which shows the outcome after the user completes the checkout process (i.e., submits the checkout form)
-
Navbar: Shows the Products and Cart links.
- path: "" - Products page
- path: "product/:id" - Product Details page
- path: "cart" - Cart and Checkout page
- path: "congrats" - Order Confirmation page
- path: "**" - Wild card (Page Not found)
Some Models used includes:
- Product
- Form
- Dict
- User
- cart
- cart-item
- confirmation
- congrats
- nav-bar
- not-found
- product-details
- product-item
- products
- cartService
- productsService
- userService