This project was the continuation of the repository shared: Ecommerce-boilerplate web app.
What did I do?
An eCommerce application was implemented, Mostly the front-end part. The CSS and Framework used was styled using styled-components and the framework used was react.
Description of all the application functionalities
- Login
In order to be able to logged in securely. A user will have to make sure he is required to give correct username and password.
Sample Username: user1
Sample Password: pass1
- Display of products
The Landing page is a grid of products, the images and all the information are populated by the db.json provided in the boiler plate.
- Registration
There is a link in the Registration page that takes you to a registration page, where certain credentials are asked. A new user is registered
- Single Product Display
Clicking on the Title of the Product takes you to a new page where only 1 product, with description and various other info about the product is seen.
- Cart
The Cart on the right top corner side of the screen takes you to the cart. Where your products would be visible.
- Successful Payment
The closing page of the website, after payment is done, the page thanks and lets you go bck to the landing page.
- Are there any improvements I could make to my submission?
-JWT
JWT authentication is a token-based stateless authentication mechanism. Server wouldn't need to completely rely on a data store
-Redux
Redux can be used as a data store for any UI layer, Makes the wesite more functional in real time without the client server interaction.
-Auth and Perms
Permissions and Admin Permission/access, making the website more secur/safe and accessible in real world scenarios
-UI-UX and Minor Feataures
Smoother UI-Ux with animation, salient features like "Stock Left" etc can be added in this web application.
- What would you do differently if I were allocated more time?
-Functional Cart
User could add and remove products in real time, and the total amount would e generated as per the cart, and its items.
-Register
Registration would have been fully functional, ale to create new user profiles, that can be further used later.
-Payment Gateway
Would have added a dummy payment gateway, to simulate real life scenario.
-Single Product Display
Would have used the same js file to populate single Products with the same styling, It would have made the website more dynamic and user friendly.
The user of this react application should be able to view all the products. The application has this workflow
- Login/register functionality.
- Users can add the products to the cart page
- Users can see every product indiviaually
- Users can proceed to pay.
- Clone this repo
npm install- To install the dependenciesnpm run server- To start the JSON servernpm start- To start the react app