A dynamic MERN web dashboard connecting Manufacturers and Transporters. Seamlessly send and receive messages, manage orders, and track deliveries. Registration, login, and role-based access. Designed for efficient collaboration..

• Pagination: The messages list on the landing page is implemented with pagination, allowing users to navigate through multiple pages of messages.

• Redux State Management: The website utilizes Redux for state management, providing a centralized store to manage application data and facilitate communication between components.

• MVC Folder Structure: The codebase follows the Model-View-Controller (MVC) folder structure, organizing files and components into separate directories based on their respective responsibilities.

• TypeScript: The website is built using TypeScript, a statically typed superset of JavaScript. TypeScript helps in catching errors during development and provides better code documentation and editor support.

• User Registration and Login: Users can create accounts and log in as either Manufacturers or Transporters.

• Role-based Access: The system distinguishes between Manufacturers and Transporters, providing role-specific functionality and access.

• Landing Page: Separate landing pages for Manufacturers and Transporters display a list of received messages, showcasing the order ID for each message.

• Search Functionality: Users can search for messages based on order ID, "To" field, and "From" field, allowing for quick and efficient message retrieval.

• Manufacturer Input Form: Manufacturers have a form with input fields for Order ID, "To" field, "From" field, Quantity (with a dropdown menu), and an Address field (auto-populated from registration).

• Transporter Selection: Manufacturers can select a transporter from a dropdown menu when sending a message. Only one transporter can be chosen.

• Message Sending: Manufacturers can send messages to selected transporters by clicking a "Send" button.

• Transporter Order Selection: Transporters have a list box to select the order ID received from Manufacturers.

• Price Input: Transporters have an input form to enter the price (float value) for a selected order.

• @reduxjs/toolkit - Redux state management library.
• axios - Promise-based HTTP client for API requests.
• react - JavaScript library for building user interfaces.
• react-dom - Entry point for working with the DOM in React.
• react-redux - Official React bindings for Redux.
• react-router-dom - Declarative routing for React applications.
• react-toastify - Toast notifications for React.
• redux - Predictable state container for JavaScript apps.
• redux-thunk - Thunk middleware for Redux.
• @types/react - TypeScript definitions for React.
• @types/react-dom - TypeScript definitions for ReactDOM.
• @typescript-eslint/eslint-plugin - TypeScript support for ESLint.
• @typescript-eslint/parser - TypeScript parser for ESLint.
• @vitejs/plugin-react - Official React plugin for Vite.
• eslint - Pluggable JavaScript linter.
• eslint-plugin-react-hooks - ESLint plugin for enforcing React Hooks rules.
• eslint-plugin-react-refresh - ESLint plugin for React Refresh support.
• sass - CSS extension language.
• typescript - Typed superset of JavaScript.
• vite - Fast development server and build tool for modern web apps.

• bcrypt - Password hashing library.
• cors - Middleware for enabling CORS in Express apps.
• dotenv - Environment variable loader.
• express - Fast, unopinionated, minimalist web framework for Node.js.
• jsonwebtoken - JSON Web Token implementation.
• mongoose - MongoDB object modeling tool.
• nodemon - Utility for automatically restarting the server.