This web project is designed to help me level up my game in web development. Throughout the development process, I covered various technologies, tools, and skills. Here are some of the key highlights:
- Redux for State Management: I implemented Redux to manage the state of my web application, enabling efficient data flow and centralized state management.
- Component-Based Architecture: I focused on reusability by breaking down code into small, reusable components. This approach promotes modularity and makes code easier to maintain and understand.
- Effective Use of React Hooks: I utilized React hooks such as useState, useEffect, and useRef to handle different aspects of application's state and lifecycle management. This allows for efficient and optimized coding practices.
- Material UI CSS Framework: I leveraged the Material UI CSS framework to create a visually appealing and consistent user interface. This framework offers pre-built components and styling options, reducing the need for custom CSS coding.
- Responsive UI Design: I ensured that web application's user interface is responsive and adapts seamlessly to various screen resolutions and device types. This enhances the user experience and accessibility across different devices.
- Optimized API Calls: I focused on minimizing the number of API calls made from the frontend, which can improve performance and reduce unnecessary network requests. By selectively loading only the necessary data, I optimized the efficiency of application.
- Image Optimization with Cloudinary: I utilized Cloudinary, a cloud-based media management platform, to store and serve website's images. By dynamically loading images based on user requements, I optimized the loading time and bandwidth usage.
- System Design: I considered the overall architecture and design of web project. This includes designing the backend using MongoDB, Express JS, and Node.js, as well as utilizing JSON Web Token for user authentication and Bcrypt for password encryption.
- Multiple API Endpoints: I implemented various API endpoints to handle user actions such as login, sign up, search, product retrieval, order placement, order deletion, and profile updates. This allows users to interact with web application and perform different tasks as needed.
- Deployment and Hosting: I deployed the backend of application using Vercel, a cloud platform, while the frontend is hosted on Netlify, a popular hosting service. This ensures that web project is accessible to users online.