tampilan hasil akhir aplikasi

(UKK) Ujian Kompetensi Keahlian adalah ujian praktik yang diadakan untuk siswa SMK (Sekolah Menegah Kejuruan) untuk menguji pemahaman dan keterampilan siswa dalam menguasai keahlian dalam bidang yang dipelajari, untuk jurusan (RPL) Rekayasa Perangkat Lunak untuk UKK nya sendiri yaitu adalah pemahaman tentang pembuatan aplikasi, kemampuan siswa dalam pemrograman/coding, algoritma/logika, dan user interface atau tampilan dari aplikasi itu sendiri.

Kemudian dalam artikel ini kita akan membahas tentang salah satu soal UKK RPL Paket 2 yaitu Pembuatan Aplikasi Todolist, mulai dari analisis soal, langkah-langkah pengerjaan. panduan ini diharapkan dapat membantu siswa dalam memahami konsep soal dan materi yang akan diujikan.

RINGKASAN SOAL
Kita diminta untuk membuat aplikasi To-Do List sederhana yang membantu pengguna mengatur tugas harian. Aplikasi ini harus memiliki fitur dasar untuk mengelola tugas, menggunakan struktur data sebagai penyimpanan.

IDENTIFIKASI KEBUTUHAN APLIKASI
Aplikasi harus memiliki fitur utama:
  • Menambahkan tugas baru → Pengguna bisa memasukkan nama tugas, prioritas, dan tanggal.
  • Menampilkan daftar tugas → Menampilkan semua tugas beserta statusnya (selesai/belum).
  • Mengedit tugas → Pengguna dapat mengubah nama, prioritas, atau tanggal tugas.
  • Menandai tugas sebagai selesai → Status tugas bisa diubah menjadi "selesai".
  • Menghapus tugas → Pengguna dapat menghapus tugas berdasarkan indeks atau 

DESAIN STRUKTUR DATA
Tugas akan disimpan kedalam database, dengan setiap tugas akan memiliki atribut berikut:
  • Nama tugas → varchar
  • Status → enum
  • Prioritas → enum
  • Tanggal → date/varchar

YANG HARUS DIPERSIAPKAN
  • XAMPP → WEB Server dan Database
  • Text Editor → Visual Studio Code, Sublime Text, Notepad++ 
  • Browser → Google Chrome, Microsoft Edge, Firefox

Kamu bisa memilih 1 software sesuai dengan kemauan atau yang sering kamu gunakan dalam belajar coding. 

xampp

Jangan lupa untuk menjalankan Apache dan Mysql untuk server dan database yang nantinya akan kita buat.

MEMBUAT DATABASE

struktur database

Yang pertama kita harus membuat databasenya terlebih dulu bisa kalian akses di http://localhost/phpmyadmin di browser kalian, kebetulan disini saya membuat nama databasenya ukk kemudian membuat tabel tugas dengan memiliki 5 kolom yaitu id, namatugas, prioritas, status, tanggal .

kolom database

Untuk detailnya kalian bisa lihat pada gambar diatas, set id menjadi primary key, untuk tipe data dan panjang data bisa kalian sesuaikan dengan kebutuhan, contohnya tanggal disini saya menggunakan varchar padahal bisa menggunakan date jika sudah langsung lanjut ke langkah selanjutnya.

MEMBUAT FILE PHP 

struktur folder dan file php

Bisa kalian lihat pada gambar diatas ini adalah struktur folder yang ada di file C:\xampp\htdocs\ukkpaket2 kemudian distu terdapat folder css dan js merupakan file Bootstrap yang bisa kalian download melalui LINK INI atau jika sudah ada di flashdisk atau file kalian copy dan pastekan di direktori file yang sudah kalian buat sebelumnya pada htdocs.

kemudian kalian buat file seperti yang ada pada gambar diatas kemudian file di direktori yang sama yaitu edit.php, index.php, koneksi.php, tambahtugas.php. 

Pertama Kalian buat dulu koneksi.php

koneksi.php
koneksi.php

yang selanjutnya index.php

index.php

Penjelasan Script yang ada di index.php

menghubungkan css bootstrap di projek

Pada dasarnya script yang ada di index.php adalah struktur utama tampilan dari aplikasi kita, kemudian untuk nama dan nomor peserta silahkan kalian ganti dengan nama dan nomor peserta kalian masing-masing, kemudian seperti tombol tambah tugas/tambah data kemudian tampilan tabel tugas yang nantinya akan menampilkan daftar tugas, itu semua ada di index.php silahkan kalian analisa dan pahami.

kemudian untuk fungsi kalian bisa baca komentar yang ada di script diatas seperti #Fungsi menghapus data, #Fungsi tombol selesai, <!--Fungsi Menampilkan Tugas Pada Tabel--> silahkan diketik pada text editor kalian kemudian dipahami

tambahtugas.php

tambahtugas.php

Penjelasan Script yang ada di tambahtugas.php untuk script tambah tugas sendiri kita menggunakan metode POST kemudian ada script empty pada php untuk memeriksa form sudah terisi data atau belum.

yang terakhir edit.php

edit.php

Pada dasarnya metode untuk script edit.php sama dengan tambahtugas.php yang membedakannya hanya terletak pada query SQL nya saja, dan untuk semua fungsi-fungsinya sebenarnya sudah ditandai dengan komentar yang ada pada script jadi pastikan kalian baca dan pahami dengan teliti setiap script yang ada di atas.

KESIMPULAN
Pembahasan Uji Kompetensi Keahlian (UKK) RPL Paket 2 tentang Aplikasi Todolist tahun 2025 mencakup berbagai aspek teknis dalam pengembangan aplikasi berbasis web. Dalam proyek ini, peserta diuji dalam keterampilan pemrograman menggunakan PHP, MySQL, dan Bootstrap, serta implementasi konsep CRUD (Create, Read, Update, Delete) untuk mengelola daftar tugas (todolist). diharapkan dapat membantu siswa dalam mengerjakan soal UKK Paket 2 2025.

SEMANGAT SEMOGA BERHASIL!!