QKart is your one-stop solution for buying the latest trending items with India's fastest delivery to your doorstep. It's a traditional brick-and-mortar supermarket chain with stores in over 30 cities throughout India, presented as a Flipkart-like web platform with all the necessary functionalities.
- Website URL : https://qkart-frontend-v2-rho.vercel.app/
Welcome to QKart’s frontend! The QKart frontend is built using React.js and MaterialUI primarily. This project features:
- Authentication
- Dynamic product listing
- Search
- Shopping cart
- Checkout process
During the development journey, I have learned and applied these skills in React:
- State manipulation and Props
- Components - Stateless and Stateful
- React lifecycle methods
- Routing
- Data binding
- Debouncing
- Conditional rendering
QKart allows its customers to register and login.
- Users can register on the QKart website by visiting the Register page.
- They can then log in to the website by entering the username and password set during the registration.
- Only logged-in users can buy products.
All the products are displayed here.
- Users are provided with details like the product price and category.
- It also has a search feature.
Users will be taken to the checkout page by clicking on the “Checkout” button on the Product page.
- The Checkout page shows an overview of the cart items, the total cost, and the wallet balance for the user.
- Users can add or choose an existing delivery address and place the order from here.
Users are taken to this page when they successfully place their orders. It displays the tentative delivery date and the user’s wallet balance.
I had provided a minimal backend with APIs exposed for use. I'll be making calls to these APIs to perform actions like authenticating users, fetching product details, etc.