This is a basic frontend E-Commerce Frontend for Ada Developers Academy's AWS curriculum.
The following three microservices repos will be necessary for it to run effectively:
- Products Microservice (https://github.com/Ada-Activities/Ada-E-Commerce-Product-Service)
- Users Microservice (https://github.com/Ada-Activities/Ada-E-Commerce-User-Service)
- Orders Microservice (https://github.com/Ada-Activities/Ada-E-Commerce-Orders-Service)
You will also need a pre-signed url lambda function running in AWS. This solution currently works with the pre-signed url solution from the Storage lab. If your lambda has different response bodies or query parameters, you may need to tweak the lambda request in ProductForm.tsx
For local testing, the microservices were run on the following ports:
- Users Microservice -
localhost:5000(VITE_USER_URL) - Orders Microservice -
localhost:8000(VITE_ORDER_URL) - Products Microservice -
localhost:8080(VITE_PRODUCT_URL)
- Fork and Clone this repository.
- Run the command
npm installto install the necessary dependencies. - Create a
.envfile with the following variables:- VITE_USER_URL (Users Microservice Endpoint)
- VITE_ORDER_URL (Orders Microservice Endpoint)
- VITE_PRODUCT_URL (Products Microservice Endpoint)
- VITE_LAMBDA_URL (Pre-signed URL Lambda Endpoint)
- Run the command
npm run devto test that the application is working.
The following functionality should be currently available:
- Login Page
- You will be able to create a new user with a first name, last name, email and the ability to select whether or not the user is an admin.
- Once a User has been created, their email can be used to login.
- Home Page
- Admin Users
- Admin users will be able to see a list of every product.
- Admin users will be able to update the stock of each product.
- Admin users will be able to delete any product.
- Admin users will have a form at the bottom where they will be able to add a product.
- Non-admin Users
- Non-admin users will be able to see a list of every produc.
- Non-admin users will be able to change the quantity they would like and add that item to their cart.
- Admin Users
- Orders Page
- Admin users will be able to see all orders from all users.
- Non-admin users will be able to see only their past orders.
- Cart Page
- Admin users will see an empty cart as they currently do not have cart functionality.
- Non-Admin users will see a list of items they currently have in their cart. They will be able to update quantities directly from the cart.
- Account Page
- All Users will be able to see and update their account information.
- Users can more pieces of a product than are available.
- Admin users can see a cart page but have no cart functionality
- Login is based off email only
- EDA is not currently implemented when a cart is submitted
- Styling and testing are limited.
Note: Some elements (including the styling) of this repository were generated using AI.