Vulnerability Dashboard

A web-based application for managing remediation plans with data filtering, pagination, and user authentication. This project is designed to help teams track and manage high, medium, and low-priority tasks effectively.

Features

• Authentication: Secure login and session management using JWT (JSON Web Tokens).
• Dynamic Table: Displays remediation plans with support for pagination and sorting.
• Role-Based Access: Restricts access to certain pages based on user roles.
• Responsive Design: Optimized for both desktop and mobile devices.
• REST API: Backend API for fetching remediation plans from a database.

---

Tech Stack

Frontend

• React.js: For building the user interface.
• Axios: For API calls.
• Custom CSS: For styling and layout.

Backend

• Node.js: For the server-side logic.
• Express.js: Web framework for building the REST API.
• MySQL: Database for storing remediation plans and user data.
• JWT: For secure user authentication.

---

Steps

1. Clone the Repository

   git clone https://github.com/yourusername/remediation-dashboard.git
   cd remediation-dashboard

2. Install Dependencies Navigate to both the frontend and backend directories and install the required packages:

   cd frontend
   npm install
   
   cd ../backend
   npm install

3. Set Up the Database

   • Create a MySQL database and import the schema:

     CREATE DATABASE remediation_dashboard;

   • Update the database credentials in the backend configuration file (backend/dbConfig.js):

     const dbConfig = {
       host: 'localhost',
       user: 'your_mysql_user',
       password: 'your_mysql_password',
       database: 'remediation_dashboard',
     };
     module.exports = dbConfig;

   • Import the necessary tables:

     mysql -u your_mysql_user -p remediation_dashboard < schema.sql

4. Start the Backend

   cd backend
   node index.js

5. Start the Frontend

   cd frontend
   npm start

6. Open your browser and navigate to:

   http://localhost:3000