1. Pendahuluan

API (Application Programming Interface) adalah perantara yang memungkinkan aplikasi mobile (misalnya Flutter) atau web berkomunikasi dengan server/database.

Dalam sistem absensi berbasis aplikasi, API biasanya berfungsi untuk:

• Login user → memastikan hanya user terdaftar yang bisa masuk.
• Absensi → mencatat kehadiran siswa/pegawai.
• Aktivitas → mencatat laporan kegiatan harian.

Sebelum API dihubungkan ke aplikasi, kita perlu mengetes apakah API berjalan dengan benar. Salah satu cara mudah adalah menggunakan Thunder Client (ekstensi Visual Studio Code) atau Postman.

2. Persiapan

Software yang dibutuhkan

1. XAMPP atau Laragon → untuk menjalankan PHP dan MySQL.
2. VS Code → editor untuk menulis kode PHP.
3. Thunder Client → ekstensi VS Code untuk mengetes API.

Database & Tabel

Buat database baru:

Kemudian buat tabel:

3. Membuat File Koneksi Database (koneksi.php)

File ini akan dipakai bersama oleh login.php, absensi.php, dan aktivitas.php.

<?php
$host = "localhost";
$user = "root";
$pass = "";
$db   = "db_magang";

$conn = new mysqli($host, $user, $pass, $db);

if ($conn->connect_error) {
    die(json_encode([
        "status" => "error",
        "message" => $conn->connect_error
    ]));
}
?>

4. Membuat API Login (login.php)

Login digunakan untuk mengecek apakah user valid.

<?php
include "koneksi.php";

$username = $_POST['username'] ?? '';
$password = $_POST['password'] ?? '';

$sql = "SELECT * FROM users WHERE username='$username' AND password='$password'";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    $user = $result->fetch_assoc();
    echo json_encode([
        "status" => "success",
        "message" => "Login berhasil",
        "user" => $user
    ]);
} else {
    echo json_encode([
        "status" => "error",
        "message" => "Username atau password salah"
    ]);
}
?>

Test di Thunder Client

• Method: POST
• URL: http://localhost/api/login.php
• Body (JSON):

5. Membuat API Absensi (absensi.php)

Menyimpan data absensi ke tabel absensi.

<?php
include "koneksi.php";

$user_id = $_POST['user_id'] ?? '';
$status  = $_POST['status'] ?? 'Hadir';
$tanggal = date("Y-m-d");
$jam     = date("H:i:s");

$sql = "INSERT INTO absensi (user_id, tanggal, jam, status) VALUES ('$user_id','$tanggal','$jam','$status')";

if ($conn->query($sql) === TRUE) {
    echo json_encode([
        "status" => "success",
        "message" => "Absensi berhasil dicatat"
    ]);
} else {
    echo json_encode([
        "status" => "error",
        "message" => $conn->error
    ]);
}
?>

Test di Thunder Client

• Method: POST
• URL: http://localhost/api/absensi.php
• Body (JSON):

6. Membuat API Aktivitas (aktivitas.php)

Menyimpan deskripsi aktivitas ke tabel aktivitas.

<?php
include "koneksi.php";

$user_id   = $_POST['user_id'] ?? '';
$deskripsi = $_POST['deskripsi'] ?? '';
$tanggal   = date("Y-m-d");

$sql = "INSERT INTO aktivitas (user_id, tanggal, deskripsi) VALUES ('$user_id','$tanggal','$deskripsi')";

if ($conn->query($sql) === TRUE) {
    echo json_encode([
        "status" => "success",
        "message" => "Aktivitas berhasil dicatat"
    ]);
} else {
    echo json_encode([
        "status" => "error",
        "message" => $conn->error
    ]);
}
?>

Test di Thunder Client

• Method: POST
• URL: http://localhost/api/aktivitas.php
• Body (JSON):

7. Mengetes API dengan Thunder Client

1. Buka Thunder Client di VS Code.
2. Klik New Request.
3. Masukkan URL API (http://localhost/api/login.php, dll).
4. Pilih method POST.
5. Masukkan data (body JSON).
6. Klik Send.

Jika berhasil, akan muncul response JSON seperti ini:

8. Kesimpulan

• Kita membuat API dengan 3 file utama:
  • login.php untuk login user.
  • absensi.php untuk mencatat absensi.
  • aktivitas.php untuk mencatat aktivitas.
• Semua API sudah menghasilkan JSON response sehingga mudah diintegrasikan dengan aplikasi mobile (Flutter) maupun web.
• Dengan Thunder Client, API bisa dites lebih cepat tanpa perlu aplikasi frontend terlebih dahulu.