Ditulis oleh : Muhammad Fathir Fatah

Nim : 607052430002

Kelas : D3 TT 48-02

Modul : 7

1. Membuat Halaman Utama (index.php)

<?php include 'config.php'; ?> 
<!-- Meng-include file config.php untuk koneksi database -->
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Modul 7 - Todo App</title> 
  <!-- Judul halaman -->
  <link href="<https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css>" rel="stylesheet">
  <!-- Link CDN Bootstrap supaya tampilannya rapi -->
</head>

<body class="container mt-5">
  <h1>📝 My Todo List</h1> 
  <!-- Judul utama halaman -->

  <!-- Form Tambah Data -->
  <form method="POST" action="add.php" class="mb-4">
    <!-- Formulir untuk menambah task baru, datanya dikirim ke file add.php -->
    <div class="row">
      <div class="col-8">
        <input type="text" name="title" class="form-control" placeholder="Judul task" required>
        <!-- Inputan untuk judul task -->
      </div>
      <div class="col-4">
        <button type="submit" class="btn btn-primary">➕ Tambah</button>
        <!-- Tombol untuk mengirim form -->
      </div>
    </div>
  </form>

  <!-- Tabel Data -->
  <table class="table table-striped">
    <!-- Tabel untuk menampilkan list task -->
    <thead>
      <tr>
        <th>#</th> 
        <th>Task</th> 
        <th>Deskripsi</th>
        <th>Aksi</th> 
      </tr>
    </thead>

    <tbody>
      <?php
      // Query untuk mengambil semua data dari tabel tasks, diurutkan dari yang terbaru
      $result = $mysqli->query("SELECT * FROM tasks ORDER BY created_at DESC");

      // Perulangan untuk menampilkan setiap task di tabel
      while ($row = $result->fetch_assoc()):
      ?>
      <tr>
        <td><?= $row['id'] ?></td> <!-- Menampilkan ID task -->
        <td><?= htmlspecialchars($row['title']) ?></td> <!-- Menampilkan judul task, diamankan dengan htmlspecialchars -->
        <td><?= htmlspecialchars($row['description']) ?></td> <!-- Menampilkan deskripsi task -->
        <td>
          <a href="edit.php?id=<?= $row['id'] ?>" class="btn btn-sm btn-warning">✏ Edit</a>
          <!-- Tombol untuk edit task -->

          <a href="delete.php?id=<?= $row['id'] ?>" class="btn btn-sm btn-danger">🗑 Hapus</a>
          <!-- Tombol untuk hapus task -->
        </td>
      </tr>
      <?php endwhile; ?>
    </tbody>
  </table>
</body>
</html>

2. Mengedit task yang sudah ada di data base (edit.php)

<?php
include 'config.php'; 
// Meng-include file config.php untuk koneksi database

// Ambil data yang akan diedit
$id = $_GET['id']; 
// Mengambil ID task dari parameter URL (misal edit.php?id=3)

$stmt = $mysqli->prepare("SELECT * FROM tasks WHERE id = ?");
$stmt->bind_param("i", $id); 
// Menyiapkan statement untuk mengambil task berdasarkan ID

$stmt->execute();
$result = $stmt->get_result();
$task = $result->fetch_assoc();
// Mengambil hasil query sebagai array assosiatif

// Proses update ketika form dikirim
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  $title = $mysqli->real_escape_string($_POST['title']);
  $description = $mysqli->real_escape_string($_POST['description']);
  // Mengambil dan mengamankan data yang dikirim dari form

  $updateStmt = $mysqli->prepare("UPDATE tasks SET title = ?, description = ? WHERE id = ?");
  $updateStmt->bind_param("ssi", $title, $description, $id);
  // Menyiapkan query UPDATE untuk mengubah data task

  if ($updateStmt->execute()) {
    header("Location: index.php?success=1");
    // Jika update berhasil, redirect ke halaman index dengan query success
  } else {
    echo "Error: " . $updateStmt->error;
    // Jika gagal, tampilkan pesan error
  }
}
?>

<!-- Form Edit -->
<form method="POST" action="edit.php?id=<?= $id ?>">
  <!-- Form untuk mengedit task, method POST ke file yang sama -->
  
  <input type="text" name="title" value="<?= htmlspecialchars($task['title']) ?>" required>
  <!-- Input untuk judul task, sudah terisi dengan data lama -->

  <textarea name="description"><?= htmlspecialchars($task['description']) ?></textarea>
  <!-- Textarea untuk deskripsi task, sudah terisi dengan data lama -->

  <button type="submit">💾 Simpan</button>
  <!-- Tombol untuk submit perubahan -->
</form>

3. Menambahkan task baru ke dalam database (add.php)

<?php
include 'config.php'; 
// Meng-include file config.php untuk koneksi ke database

// Mengecek apakah request yang masuk adalah POST (berarti form dikirim)
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $title = $mysqli->real_escape_string($_POST['title']);
    // Mengambil dan mengamankan input 'title' dari form

    $description = $mysqli->real_escape_string($_POST['description'] ?? '');
    // Mengambil dan mengamankan input 'description', jika kosong default jadi string kosong

    $stmt = $mysqli->prepare("INSERT INTO tasks (title, description) VALUES (?, ?)");
    $stmt->bind_param("ss", $title, $description);
    // Menyiapkan query INSERT untuk memasukkan task baru ke database

    if ($stmt->execute()) {
        header("Location: index.php?success=1");
        // Jika berhasil, redirect ke index.php dengan parameter success
       
    } else {
        echo "Error: " . $stmt->error;
        // Jika gagal, tampilkan pesan error
    }
    
    $stmt->close(); 
    // Menutup statement untuk menghemat resource
}

$mysqli->close(); 
// Menutup koneksi database
?>

4. Menghapus task dari database berdasarkan ID (delete.php)

<?php
include 'config.php'; 
// Meng-include file config.php untuk koneksi ke database

$id = $_GET['id']; 
// Mengambil ID task dari parameter URL (misal delete.php?id=3)

$stmt = $mysqli->prepare("DELETE FROM tasks WHERE id = ?");
$stmt->bind_param("i", $id);
// Menyiapkan query DELETE untuk menghapus task berdasarkan ID

if ($stmt->execute()) {
  header("Location: index.php?success=1");
  // Jika berhasil, redirect ke index.php dengan notifikasi sukses
} else {
  echo "Error: " . $stmt->error;
  // Jika gagal, tampilkan pesan error
}

$stmt->close(); 
// Menutup statement

$mysqli->close(); 
// Menutup koneksi database
?>

5. Mengatur koneksi ke database (config.php)

<?php
$host = 'localhost';
$user = 'root';
$password = '';
$database = 'todo_app';

// Membuat koneksi ke database menggunakan MySQLi
$mysqli = new mysqli($host, $user, $password, $database);

if ($mysqli->connect_errno) {
    die("Koneksi gagal: " . $mysqli->connect_error);
    // Jika koneksi gagal, hentikan program dan tampilkan error
}

// Set charset untuk menghindari masalah encoding karakter (biar support emoji, huruf spesial, dll)
$mysqli->set_charset("utf8mb4");

// Memulai sesi PHP
session_start();

// Di add.php, sesuaikan query dengan user_id
$stmt = $mysqli->prepare("INSERT INTO tasks (title, description, user_id) VALUES (?, ?, ?)");
$stmt->bind_param("ssi", $title, $description, $_SESSION['user_id']);

?>

D3 Teknologi Telekomunikasi