Membangun website dinamis menggunakan PHP dan HTML adalah fondasi penting dalam pengembangan web. PHP digunakan untuk menangani logika server dan pemrosesan data, sedangkan HTML digunakan untuk menampilkan konten ke pengguna.
Berikut panduan langkah demi langkah untuk membangun website dinamis sederhana dengan PHP dan HTML:
🔧 Langkah 1: Persiapkan Lingkungan Pengembangan
Kamu butuh server lokal untuk menjalankan file PHP:
- Install XAMPP atau Laragon (Windows)
- Atau gunakan MAMP (Mac)
Setelah terpasang, letakkan file proyek kamu di folder:
XAMPP: C:\xampp\htdocs\
Laragon: C:\laragon\www\📁 Struktur Folder Sederhana
/website/
├── index.php
├── about.php
├── contact.php
├── inc/
│ ├── header.php
│ └── footer.php
└── style.css🧱 Langkah 2: Buat File HTML dan PHP
🔹 inc/header.php
<!DOCTYPE html>
<html>
<head>
<title>Website Dinamis</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h1>Selamat Datang</h1>
<nav>
<a href="index.php">Beranda</a>
<a href="about.php">Tentang</a>
<a href="contact.php">Kontak</a>
</nav>
</header>
<main>🔹 inc/footer.php
</main>
<footer>
<p>© <?= date('Y') ?> Website Dinamis PHP</p>
</footer>
</body>
</html>🔹 index.php
<?php include 'inc/header.php'; ?>
<h2>Ini halaman beranda</h2>
<p>Selamat datang di website dinamis pertama Anda!</p>
<?php include 'inc/footer.php'; ?>🔹 about.php
<?php include 'inc/header.php'; ?>
<h2>Tentang Kami</h2>
<p>Kami adalah tim pengembang web yang berfokus pada solusi web dinamis.</p>
<?php include 'inc/footer.php'; ?>🔹 contact.php
<?php include 'inc/header.php'; ?>
<h2>Hubungi Kami</h2>
<form method="post" action="">
<input type="text" name="nama" placeholder="Nama Anda" required><br>
<input type="email" name="email" placeholder="Email Anda" required><br>
<textarea name="pesan" placeholder="Tulis pesan..." required></textarea><br>
<button type="submit">Kirim</button>
</form>
<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$nama = htmlspecialchars($_POST['nama']);
$email = htmlspecialchars($_POST['email']);
$pesan = htmlspecialchars($_POST['pesan']);
echo "<p>Terima kasih, <strong>$nama</strong>. Pesan Anda telah kami terima.</p>";
}
?>
<?php include 'inc/footer.php'; ?>🎨 Langkah 3: Tambahkan CSS (style.css)
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header, footer {
background-color: #222;
color: white;
padding: 20px;
text-align: center;
}
nav a {
color: white;
margin: 0 15px;
text-decoration: none;
}
main {
padding: 20px;
}📌 Fitur Dinamis yang Bisa Ditambahkan
- Sistem login/logout dengan PHP + MySQL
- Pengambilan data dari database (misalnya daftar artikel)
- Form kontak dengan pengiriman email
- Komentar pengguna
- Sistem manajemen konten (CMS) sederhana
🚀 Kesimpulan
Dengan PHP dan HTML, kamu bisa:
✅ Menampilkan konten yang berbeda di tiap halaman
✅ Menyimpan & mengambil data dari pengguna
✅ Menyusun halaman yang modular (menggunakan include)
✅ Membangun fondasi aplikasi web lebih besar (seperti blog, e-commerce, dsb)
