Mobile store project (e-commerce) created with React js and Redux with back and json-server
Project Phase 1 :
- Create Repository
- Create Project Structure And Map
- Create Project Folder Structure
- Install required libraries and packages
- Create Layouts
- Create Routes
Project Phase 2 :
- Create Header With Menu
- Create Button Component
- Create Navigation Component
- Create Login And Register Page
- Create Dashboard for User And Admin
- Create Custom Table Component From react-table
- Create API for Get Data From Json-Server
- Create API for Add newsletters
- Complate DB File Structure
- Create Managment Pages
- All Tables Has pagination, filtering and Sorting
- Route And authorization Algorithm
Project Phase 3 :
- Create Footer
- Create Home Page
- Create Category Page
- Create Product Page
- Create modal to add products with dynamic inputs (admin access only)
- Create an API to remove the product, with the question to remove
- Edit inventory and pricing (admin access only)
- Create Card Product Component
Project Phase 4 :
- Add Product To Card
- Create Basket Page And Show Card in Basket Page
- Create Checkout Form And Page
- Warnign : The payment process by going to another server
- Details Order Show By Modal For Admin
- Change the status of the order ( pending or shipped )
A complete store with home page, category page, product details page with description, feature display and comment capability. Ability to register new users and login. Use interceptors to pass requests through dedicated filters, such as checking if the user is Auth. Admin panel for regular users or admins. Ability to add a product, the ability to edit the number or price of the product on a dedicated page, the ability to delete products by displaying a message, order management and the ability to change the status of orders. Checkout page to enter details to confirm purchase. Ability to add categories or edit previous categories. ENV variables are used in the project. Redux, axios and promises have been tried to be used as optimally as possible and only used when necessary.
After cloning the project, first install the project packages with the npm i command, then use npm run concurrently to run the backend and front end of the project concurrently. Enjoy the project.