Halo sobat koding! π Kamu lagi belajar PHP native dan pengen bikin website dari template HTML gratis yang keren? Tenang, di artikel ini kita bakal bahas *step-by-step* gimana caranya mengubah template HTML menjadi website PHP native yang dinamis, rapi, dan bisa di-*routing* tanpa ribet!
### π₯ Langkah 1: Download Template HTML-nya Dulu
Pertama, tentu kita butuh **template HTML**. Di sini aku pakai template gratis dan keren dari GitHub:
π [RuangAdmin – Free Bootstrap Admin Template](https://github.com/indrijunanda/RuangAdmin)
Kamu bisa klik tombol βCodeβ β lalu βDownload ZIPβ. Setelah itu, ekstrak dan buka di editor favorit kamu (misalnya VS Code/Cursor).
Template ini keren banget karena udah pakai Bootstrap, punya banyak komponen siap pakai, dan cocok buat dashboard admin.
### π§ Langkah 2: Kenapa Harus Dimodifikasi?
Nah, template HTML biasanya bersifat **statik**. Artinya:
- Setiap file HTML berdiri sendiri
- Tidak bisa saling “include”
- Tidak bisa dipanggil dinamis dari URL
- Gak cocok kalau nanti mau nyambungin ke database
Makanya, kita perlu modifikasi supaya jadi:
- Modular (bisa potong jadi header, sidebar, footer, dll)
- Dinamis (tiap halaman bisa dipanggil dari 1 file aja)
- Mudah dikembangkan (kayak pakai framework, tapi masih PHP native)
### βοΈ Langkah 3: Potong Template Jadi Bagian-bagian Modular
Biasanya, kita pisahkan template jadi beberapa bagian:
header.phpβ bagian atas, isi tag <head>, navbar, dllsidebar.php(opsional)footer.phpβ bagian bawah, script JS, penutup HTML- Halaman-halaman isi β misal
home.php,form.php, dst.
Potong dengan rapi dari file HTML asli, lalu simpan di folder project kalian.
### π£οΈ Langkah 4: Bikin Router Manual di PHP
Setelah struktur rapi, kita bikin file utama index.php yang jadi pintu masuk website. Di dalamnya, kita ambil parameter hal dari URL untuk menentukan halaman mana yang ditampilkan.
<?php
// Ambil parameter hal dari URL (hal = halaman)
$hal = isset($_GET['hal']) ? $_GET['hal'] : 'home';
// Daftar halaman yang diizinkan (whitelist)
$allowed_pages = [
'home' => 'home.php',
'form' => 'form_basics.php'
];
// Tampilkan halaman jika ada di whitelist, kalau tidak arahkan ke 404
if (array_key_exists($hal, $allowed_pages)) {
include $allowed_pages[$hal];
} else {
include '404.php';
}
?>
Dengan begini, cukup 1 file saja (index.php) yang dipanggil di browser:
index.php?hal=homeβ menampilkan halamanhome.phpindex.php?hal=formβ menampilkanform_basics.phpindex.php?hal=xyzβ tampilkan404.php
### π§ Teknik yang Dipakai
| Teknik | Penjelasan |
|---|---|
| Modularisasi File | Memecah template HTML menjadi beberapa file agar lebih reusable (header, footer, dsb) |
| Routing Manual | Menentukan halaman yang ditampilkan berdasarkan parameter di URL (?hal=...) |
| Validasi Halaman | Menangani jika halaman tidak dikenal, diarahkan ke 404.php |
| Include File | Menggunakan include di PHP untuk memanggil bagian-bagian layout dan konten |
| PHP Native | Tidak menggunakan framework seperti Laravel, hanya murni PHP |
### π‘ Tips Tambahan
- Gunakan folder seperti
pages/untuk menyimpan file konten agar lebih rapi - Tambahkan whitelist halaman agar lebih aman
- Nanti bisa dikembangkan ke penggunaan
session,login, dan koneksi database
### β¨ Penutup
Dengan sedikit usaha, kita bisa sulap template HTML statik menjadi website dinamis berbasis PHP native! Gak perlu .htaccess, gak perlu framework berat, tapi tetap rapi dan bisa dipakai buat project beneran.
Ini langkah awal yang bagus buat kamu yang baru belajar backend development atau bikin project mini.
Semoga tutorial ini bermanfaat! Kalau kamu suka gaya artikel ini, boleh banget dibagikan ke teman-teman atau dipakai buat tugas kuliah π




Tinggalkan Balasan