diff --git a/api.js b/api.js
index 02a6990..67692b6 100644
--- a/api.js
+++ b/api.js
@@ -1,34 +1,20 @@
 import express from 'express';
 import cors from 'cors';
-import { sendWolPacket } from './wol.js';
+import { ping, sendWolPacket } from './wol.js';
 import targets from "./targets.json" with { type: "json" };
+import { fileURLToPath } from "node:url";
+import path from 'node:path';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
 const app = express();
 const port = 9999;
 
 app.use(cors()).use(express.json());
 
-app.get("/", (req, res) => {
-    let html = `<!DOCTYPE html><head>
-        <style>
-            body { background: #fff; color: #000; }
-            @media (prefers-color-scheme: dark) {
-                body { background: #111; color: #eee; }
-                a { color: #7295f6; }
-            }
-        </style>
-    </head>
-    <body>
-        <h2 style="margin-bottom: 5px">Targets:</h2>
-        <ul style="margin: 0; padding-left: 0; list-style-position: inside">
-            ${Object.keys(targets).map(key => `<li><a href="/wake/${key}">${key}</a></li>`).join("")}
-        </ul>
-    </body>`;
-    res.send(html);
-});
-
 app.get("/targets", (req, res) => {
-    res.json(Object.keys(targets));
+    res.json(targets);
 });
 
 app.post("/wake", (req, res) => {
@@ -62,14 +48,12 @@ app.get("/wake", (req, res) => {
 });
 
 app.get("/wake/:name", (req, res) => {
-    const name = req.params.name;
-    const mac = targets[name];
-
-    if (!mac) {
+    const target = targets[req.params.name];
+    if (!target?.mac) {
         return res.status(404).json({ status: "error", message: "Unknown target" });
     }
 
-    sendWolPacket(mac)
+    sendWolPacket(target.mac)
     .then(() => res.json({ status: "ok" }))
     .catch(err => {
         console.error(err);
@@ -77,6 +61,17 @@ app.get("/wake/:name", (req, res) => {
     });
 });
 
+app.get("/status/:name", (req, res) => {
+    const target = targets[req.params.name];
+    if (!target?.ip) {
+        return res.json({ isUp: null });
+    }
+    
+    ping(target.ip).then(isUp => res.json({ isUp }));
+});
+
+app.use(express.static(path.join(__dirname, 'public')));
+
 app.listen(port, () => {
     console.log('WOL server running on port ' + port);
 });
\ No newline at end of file
diff --git a/package.json b/package.json
index ee500ab..29cc7db 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "wol-api",
-  "version": "1.2.0",
+  "version": "2.0.0",
   "description": "Wake-on-LAN API in Node.js",
   "keywords": [
     "node",
diff --git a/public/index.html b/public/index.html
new file mode 100644
index 0000000..3bfcc47
--- /dev/null
+++ b/public/index.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8">
+        <title>WOL</title>
+        <style>
+            body {
+                background: #fff;
+                color: #000;
+            }
+            @media (prefers-color-scheme: dark) {
+                body {
+                    background: #111;
+                    color: #eee; 
+                }
+                a {
+                    color: #7295f6;
+                }
+            }
+        </style>
+    </head>
+    <body>
+        <h2>Targets</h2>
+        <table border="1" cellpadding="6">
+            <tr>
+                <th>Name</th>
+                <th>MAC</th>
+                <th>Status</th>
+                <th></th>
+            </tr>
+            <tbody id="targets"></tbody>
+    </body>
+    <script>
+        async function loadTargets() {
+            const res = await fetch("/targets");
+            const targets = await res.json();
+            const tbody = document.getElementById("targets");
+
+            for (const [name, t] of Object.entries(targets)) {
+                const tr = document.createElement("tr");
+                tr.innerHTML = `
+                    <td>${name}</td>
+                    <td>${t.mac}</td>
+                    <td id="status-${name}">checking...</td>
+                    <td><a href="#" onclick="fetch('/wake/${name}')">Send WOL</a></td>
+                `;
+
+                tbody.appendChild(tr);
+
+                const checkStatus = async () => {
+                    fetch("/status/" + name)
+                    .then(res => res.ok ? res.json() : Promise.reject())
+                    .then(json => document.getElementById("status-" + name).textContent = json.isUp ? "online" : "offline")
+                    .catch(() => document.getElementById("status-" + name).textContent = "unknown");
+                }
+
+                checkStatus();
+                setInterval(checkStatus, 5000);
+            }
+        }
+
+        loadTargets();
+    </script>
+</html>
\ No newline at end of file
diff --git a/targets.example.json b/targets.example.json
index 79e576a..1025255 100644
--- a/targets.example.json
+++ b/targets.example.json
@@ -1,4 +1,10 @@
 {
-    "pc": "00:AA:BB:CC:DD:EE",
-    "server": "01:23:45:67:89:00"
+    "pc": {
+        "mac": "00:AA:BB:CC:DD:EE",
+        "ip": "192.168.0.1"
+    },
+    "server": {
+        "mac": "01:23:45:67:89:00",
+        "ip": "192.168.0.2"
+    }
 }
\ No newline at end of file
