---

Device Connection Surveillance App

Note

Status: 🚧 Ongoing Project Due to my increasingly busy schedule and school commitments, progress might be slower than before or even put to a halt.
⚠️ Further down there’s a tutorial, and at the very end of the README you can find my future plans!

---

Releases v1

⚠️ Note: No Docker setup included yet.

---

📝 Short Description

A fullstack project for monitoring network devices. It automatically or manually checks whether devices are reachable (online/offline) and visualizes the status on a nicely designed website.

---

👀 Preview

🔧 Tech-Stack

• Frontend:

• Backend:

• Database:

• Features: (Host Reachability Check)

📋 Features

• Add, edit, and delete devices
• Automatic reachability check (e.g., every 30 seconds)
• Display of current status (🟢 online / 🔴 offline)
• Logging of status changes in the database
• Frontend with table view / card view and live status

---

🚀 Tutorial: Start DCS-App

1️⃣ Create Database

Before running the application, the database must be created. Make sure not to use a dash - in the name, as MySQL has issues with it. Example:

CREATE DATABASE dcs_app;

---

2️⃣ Configure Backend

1. Go to the backend directory.
2. Create the file:

src/main/resources/application.properties

3. Adjust the database credentials found in application.properties.example:

spring.application.name=backend

# Database Configuration
spring.datasource.url=jdbc:mysql://localhost:3306/dcs_app
spring.datasource.username=YOUR_DB_USERNAME
spring.datasource.password=YOUR_DB_PASSWORD
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver

# JPA Configuration
spring.jpa.hibernate.ddl-auto=update
spring.jpa.show-sql=true
spring.jpa.properties.hibernate.format_sql=true
spring.jpa.properties.hibernate.dialect=org.hibernate.dialect.MySQLDialect

# CORS and Redirect Configuration
frontend.url=http://localhost:3000

Note: spring.jpa.hibernate.ddl-auto=update ensures that tables are automatically created if they do not yet exist.

---

3️⃣ Start Backend

In the backend folder:

./mvnw spring-boot:run

Or, if Maven is installed globally:

mvn spring-boot:run

The backend will run on:

http://localhost:8080

---

4️⃣ Start Frontend

1. Go to the frontend directory.
2. Install dependencies:

npm install --force

3. Start the development environment:

npm run dev

The frontend will run on:

http://localhost:3000

---

5️⃣ Test

• Open the frontend in your browser: http://localhost:3000
• Add a device, check its status, and watch the logs.
• All changes are automatically saved in the dcs_app database.

---

🛠️ API Endpoints (final)

GET     /api/devices                           → List all devices  
POST    /api/devices                           → Add a new device  
GET     /api/devices/{id}                      → Device details  
PUT     /api/devices/{id}                      → Edit device  
DELETE  /api/devices/{id}                      → Delete device

GET     /api/devices/scan/{id}                 → Scan device via nmap

GET     /api/status_logs                       → List all logs
GET     /api/status_logs/{deviceId}            → List all logs of a device
GET     /api/status_logs/latest/{deviceId}     → Latest log entry of a device         
POST    /api/status_logs                       → Add new log entry  
DELETE  /api/status_log/{id}                   → Delete log entry

---

🔮 Future Vision

Planned Features

1. CIDR Block Support Currently, only individual IPs can be checked (via nmap -sn on specific addresses). In the future, it will be possible to scan entire CIDR ranges (e.g., 192.168.0.0/24):

   • Automatic resolution of the range into individual IPs
   • Detection of all active hosts within a subnet

2. Docker Setup Full Docker deployment for easy and portable setup.

3. Advanced Status Reports

   • Historical uptime statistics
   • Export options (CSV, JSON)
   • Notifications on status changes

4. Professional Speed Tests

   • Measure download/upload speed and latency per device
   • Integration of standardized test methods (e.g., via speedtest-cli or similar APIs)
   • Display results in clear graphs and tables on the frontend
   • Optional automatic periodic testing for continuous monitoring data

---

Made with ☕ + 💻 by AnonNanoo

Copyright © 2025 AnonNanoo. All Rights Reserved.

---