Widgets-dashboard

Widgets Dashboard Project Overview The Widgets Dashboard is a web application designed to manage and display various widgets across multiple categories. Users can add, delete, and filter widgets within each category. The dashboard provides a user-friendly interface using React and Redux for state management, along with Bootstrap and Flowbite for styling and layout.

Deployment

The Widgets Dashboard is deployed and hosted on Netlify. You can view the live application at https://main--widgetdashboard.netlify.app/

Running the Application Locally

Use the command npm install in the terminal and start the Development Server using npm run dev

This command will start the development server and open the application in your default web browser After running the development server, you can interact with the Widgets Dashboard in your web browser. You can add, delete, and filter widgets, and manage categories.

Features Dynamic Categories: Manage and display widgets across multiple categories. Widget Management: Add, delete, and filter widgets based on search criteria. Responsive Design: Optimized for both desktop and mobile devices. Interactive UI: Includes modals and drawers for a seamless user experience.

Technologies Used React: JavaScript library for building user interfaces. Redux Toolkit: State management for managing categories and widgets. React-Bootstrap: Styling and layout components. Flowbite: Additional UI components for the dashboard. React Icons: Icons for better UI/UX.

Usage

Adding Widgets Click on the "Add Widget +" button in the dashboard. Fill out the widget details and select a category. Save the widget to add it to the selected category.

Deleting Widgets Locate the widget you want to delete in the desired category. Click the delete button (represented by a close icon) associated with the widget. Confirm the deletion if prompted.

Managing Categories To delete a category, click the delete button (represented by a close icon) next to the category name. Note that deleting a category will also remove all widgets associated with that category.

Filtering Widgets Click on the "Filter Widget" button to open the filter drawer. Check or uncheck widgets to include or exclude them from the view. Confirm the changes to apply the filter.