Skip to content

Instantly share code, notes, and snippets.

@fariedrahmat

fariedrahmat/index.html

Created May 7, 2026 04:29
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save fariedrahmat/202cba4864218c98d76743cc6deea216 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save fariedrahmat/202cba4864218c98d76743cc6deea216 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>Data Sensor Ruangan</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container mt-4">
<h2 class="mb-4">Monitoring Sensor Ruangan</h2>
<!-- FORM INPUT -->
<div class="card mb-4">
<div class="card-header">Input Data Sensor</div>
<div class="card-body">
<form method="POST">
<div class="mb-3">
<label>Nama Ruangan</label>
<input type="text" name="ruangan" class="form-control" required>
</div>
<div class="mb-3">
<label>Suhu (°C)</label>
<input type="number" step="0.1" name="suhu" class="form-control" required>
</div>
<div class="mb-3">
<label>Kelembaban (%)</label>
<input type="number" step="0.1" name="kelembaban" class="form-control" required>
</div>
<button class="btn btn-primary">Simpan</button>
</form>
</div>
</div>
<!-- TABEL DATA -->
<div class="card">
<div class="card-header">Data Sensor</div>
<div class="card-body">
<table class="table table-bordered">
<thead>
<tr>
<th>ID</th>
<th>Ruangan</th>
<th>Suhu</th>
<th>Kelembaban</th>
<th>Waktu</th>
</tr>
</thead>
<tbody>
{% for row in data %}
<tr>
<td>{{ row[0] }}</td>
<td>{{ row[1] }}</td>
<td>{{ row[2] }} °C</td>
<td>{{ row[3] }} %</td>
<td>{{ row[4] }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment