This repository houses the frontend code for a React-based web application designed for product and order management. Additionally, the application facilitates calendar view functionalities to visualize anticipated order delivery dates.
-
Clone the Repository: Clone this repository to your local machine using the following command:
git clone <repository-url>
-
Navigate to the Project Directory: Change your current directory to the project directory:
cd ERP-system
-
Install Dependencies: Install the required dependencies using npm or yarn:
npm install
or
yarn install
-
Run the Application: Start the development server:
npm start
or
yarn start
-
Access the Application: Once the server is running, you can access the application by opening your web browser and navigating to http://localhost:3000.
The Dashboard serves as the central hub, offering a comprehensive overview of product and order information. For further exploration, navigate to specific sections via the top navigation bar, which provides access to dedicated modules for Products and Orders.
The Products List provides a centralized view of your inventory. You can seamlessly manage your product catalog through a range of functionalities, including viewing existing products, adding new items, modifying product details, and removing products from the list.
The Products List offers a comprehensive view of your inventory, presenting each product with key details including name, category, price, and current stock levels.
To modify a product's details, locate the desired product within the Products List. Adjacent to each entry, an "Edit" button is available. Clicking this button will open a dedicated interface for editing product information. Once the necessary changes are made, utilize the "Save" button to confirm the updates.
To introduce a new product to your inventory, locate and click the designated "Add Product" button. A comprehensive form will be displayed, prompting you to enter the required product details. Once all necessary fields are complete, confirm the addition by clicking "Save".
The Orders List serves as a central location for managing your orders. This page provides functionalities to view comprehensive order details, update the order status to reflect progress, and remove orders if necessary.
The Orders List empowers you to efficiently manage your orders. To delve into the specifics of a particular order, simply click the designated "View Details" button. For orders ready for shipment, a convenient "Ship" button facilitates updating the order status accordingly.
The application leverages a calendar view for filtering orders. Clicking on a particular date within the calendar will display all orders with expected delivery on that date, providing a clear and organized view for managing deliveries.
This project demonstrates a foundational structure for a simplified Enterprise Resource Planning (ERP) system built with React. It provides basic functionalities for managing products, orders, and viewing them on a calendar.
- Implement user authentication and authorization for access control.
- Add features for managing customers, suppliers, and other aspects of an ERP system.
- Enhance the user interface with more advanced features like filtering, sorting, and search functionalities.
This project serves as a valuable starting point for understanding the core concepts of building an ERP system with React. It showcases the power of component-based development, routing, and integrating with external libraries like react-calendar. With further development, this foundation can be extended to create a comprehensive and scalable ERP application.