Sentinel is a security dashboard application designed to monitor and visualize web attacks in real-time. It helps security administrators identify, analyze, and respond to potential security threats targeting web applications.
- Security Dashboard: Comprehensive overview of security metrics and threat statistics
- Attack Visualization: Multiple chart types (Pie, Bar, Line) to visualize attack distributions
- Real-time Monitoring: View recent malicious activities with detailed information
- Detailed Attack Logs: Comprehensive logs with filtering by attack type, IP address, and time range
- Threat Analysis: Detailed view of attack payloads with sensitive information redaction
- Responsive Design: Works across desktop and mobile devices
-
Frontend:
- Next.js 14
- React 18
- Tailwind CSS
- Chart.js with react-chartjs-2
- Lucide React (icons)
- TypeScript
-
Backend:
- Next.js API Routes
- Prisma ORM
- MySQL Database
- Node.js (v16 or higher)
- MySQL database
-
Clone the repository
git clone <repository-url> cd sentinel
-
Install dependencies
npm install
-
Configure environment variables Create a
.envfile in the root directory with the following variables:DATABASE_URL="mysql://username:password@localhost:3306/sentinel" -
Set up the database
npx prisma migrate dev
-
Run the development server
npm run dev
-
Open http://localhost:3000 to access the dashboard
/src/app: Next.js app router components and API routes/src/components: Reusable UI components/src/lib: Utility functions and shared libraries/src/utils: Helper utilities and type definitions/prisma: Database schema and migrations
- Login: Use the login page with default credentials (username: admin, password: admin123)
- Dashboard: View security metrics, attack distributions, and recent activities
- Security Threats: Browse detailed logs of detected attacks with filtering options
The dashboard uses a simple token-based authentication system. In a production environment, consider implementing a more robust authentication solution.
npm run buildnpm start