Personal Notes Parmi

apa itu hosting, domain, url dan terkait lainnya (1)

Berikut adalah penjelasan ringkas mengenai komponen-komponen utama dalam pembuatan website:

Infrastruktur Dasar Website

  • Hosting: Layanan penyewaan komputer khusus (server) untuk menyimpan semua file website agar bisa diakses online.
  • Domain: Alamat unik untuk menemukan website Anda (contoh: google.com), berfungsi seperti alamat rumah.
  • URL: Alamat lengkap untuk menuju halaman spesifik di internet (contoh: https://namaweb.com). [1, 2, 3, 4, 5]

Bahasa Pemrograman & Desain (Sisi Klien / Browser)

  • HTML: Kerangka dasar halaman website untuk membuat teks, tabel, gambar, dan struktur konten.
  • CSS: Kode untuk mengatur tampilan visual, warna, tata letak, dan gaya desain website agar menarik.
  • JavaScript (JS): Bahasa pemrograman untuk membuat website menjadi interaktif (contoh: animasi, pop-up, fitur klik). [6, 7, 8, 9, 10]

Bahasa & Penyimpanan Data (Sisi Server)

  • PHP: Bahasa pemrograman server untuk memproses data dinamis, seperti sistem login atau formulir kontak.
  • Database (MySQL/SQL): Tempat terstruktur untuk menyimpan data website, seperti username, password, dan artikel. [11, 12]

Sistem Pengelolaan & Keamanan

  • CMS (WordPress, dll): Platform instan untuk membuat dan mengelola konten website tanpa harus mahir coding.
  • SSL / HTTPS: Protokol keamanan yang mengenkripsi data transfer agar website aman dari peretasan. [13, 14, 15, 16, 17]

Jika Anda berencana membuat website, saya bisa membantu mengarahkan langkah awal Anda. Apakah Anda ingin tahu cara memilih hosting yang bagus, langkah belajar coding dari nol, atau cara membuat website instan dengan WordPress?

[1] https://www.hostinger.com [2] https://cloud.google.com [3] https://mashmoshem.co.id [4] https://nevacloud.com [5] https://blog.rumahweb.com [6] https://jakarta.telkomuniversity.ac.id [7] https://medium.com [8] https://jakarta.telkomuniversity.ac.id [9] https://lmsspada.kemdiktisaintek.go.id [10] https://www.jagoweb.com [11] https://www.jagoweb.com [12] https://proxsisgroup.com [13] https://www.hostinger.com [14] https://www.rackh.com [15] https://www.sekawanmedia.co.id [16] https://daftarsekolah.spmb.teknokrat.ac.id [17] https://www.domainesia.com

=========== Berikut adalah panduan praktik langsung (live test) untuk belajar koding dari nol menggunakan shared hosting Anda. Shared hosting adalah tempat terbaik untuk belajar karena langsung terhubung ke internet.

Persiapan Utama (Standby)

Siapkan dua alat ini di komputer Anda:

  1. Browser: Google Chrome atau Mozilla Firefox.
  2. Aplikasi Catatan: Notepad (Bawaan Windows) atau VS Code (Sangat direkomendasikan).

Langkah 1: Masuk ke File Manager

  1. Log in ke cPanel atau panel hosting murah Anda.
  2. Cari dan klik menu File Manager.
  3. Masuk ke dalam folder bernama public_html (ini folder utama website Anda).
  4. Jika ada file bawaan bernama index.php atau default.html, hapus file tersebut agar halaman menjadi kosong.

Langkah 2: Tes HTML (Membuat Kerangka)

HTML adalah pondasi teks dan struktur.

  1. Di dalam folder public_html, klik tombol + File (Buat file baru).
  2. Beri nama file: index.html (Gunakan huruf kecil semua).
  3. Klik kanan file index.html tersebut, lalu pilih Edit.
  4. Ketik kode ini di dalamnya:
   <!DOCTYPE html>
   <html>
   <head>
       <title>Halaman Tes Saya</title>
   </head>
   <body>
       <h1>Halo Dunia!</h1>
       <p>Ini adalah website pertama saya di shared hosting.</p>
   </body>
   </html>
  1. Klik Save Changes di pojok kanan atas.
  2. Uji Coba: Buka tab baru di browser, ketik alamat domain Anda (contoh: domainanda.com). Tulisan "Halo Dunia!" akan muncul.

Langkah 3: Tes CSS (Menghias Tampilan)

Sekarang kita ubah warna tulisan menggunakan CSS.

  1. Kembali ke File Manager, edit lagi file index.html tadi.
  2. Sisipkan kode gaya di dalam bagian . Ubah kodenya menjadi seperti ini:
   <!DOCTYPE html>
   <html>
   <head>
       <title>Halaman Tes Saya</title>
       <style>
           body { background-color: #f0f0f0; font-family: sans-serif; text-align: center; }
           h1 { color: deepskyblue; }
       </style>
   </head>
   <body>
       <h1>Halo Dunia!</h1>
       <p>Ini adalah website pertama saya di shared hosting.</p>
   </body>
   </html>
  1. Klik Save Changes.
  2. Uji Coba: Refresh domain Anda di browser. Latar belakang akan berubah abu-abu dan tulisan menjadi biru di tengah.

Langkah 4: Tes PHP (Logika Server)

PHP bekerja di server untuk memproses data. Karena file HTML tidak bisa menjalankan PHP, kita harus membuat file baru.

  1. Di folder public_html, buat file baru bernama: tes.php
  2. Klik kanan, pilih Edit, lalu masukkan kode ini:
   <?php
   echo "<h1>Hari ini adalah hari " . date("l") . "</h1>";
   echo "<p>Kode PHP ini berjalan sukses di server hosting Anda.</p>";
   ?>
  1. Klik Save Changes.
  2. Uji Coba: Buka browser dan akses halaman spesifik ini dengan mengetik: ://domainanda.com. Browser akan menampilkan nama hari ini secara otomatis secara dinamis.

Langkah 5: Tes JavaScript (Interaksi Klik)

Mari buat tombol yang bisa memunculkan pesan peringatan saat diklik.

  1. Buka kembali file index.html Anda melalui Edit.
  2. Tambahkan tombol dan kode JavaScript di bagian bawah, tepat sebelum kode
</body>.

   <button onclick="sapaan()">Klik Saya</button>

   <script>
       function sapaan() {
           alert("Hebat! JavaScript Anda berhasil bekerja!");
       }
   </script>
  1. Klik Save Changes.
  2. Uji Coba: Kembali ke domainanda.com, refresh halaman, dan klik tombol yang muncul.

Apakah Anda sudah berhasil masuk ke File Manager cPanel Anda? Jika sudah standby, beri tahu saya jika Anda menemukan kendala eror, atau kita bisa lanjut ke tahap berikutnya untuk membuat formulir input data!

Keren! Subdomain mylab.mustika.my.id Anda sudah aktif dan sukses menampilkan Index of / (Proudly Served by LiteSpeed Web Server). Ini artinya server sudah siap 100%. Untuk menjawab pertanyaan Anda: Tidak perlu modifikasi .htaccess sekarang. Kita bisa langsung lanjut ke Langkah 2 dan 3.

Alasan Mengapa Belum Perlu:

  1. Fokus Belajar: Di tahap awal (koding dasar HTML/CSS), .htaccess belum mendesak. Menambahkannya sekarang justru rawan membuat Anda bingung jika terjadi Error 500 (Internal Server Error) karena salah ketik kode server.
  2. Keamanan Nanti: Setelah Anda mulai membuat formulir input data atau sistem login dengan PHP, baru kita akan mengamankan folder menggunakan .htaccess.

Mari Lanjut ke Langkah 2 & 3 (Langsung Gabung Jadi 1 File)

Silakan masuk ke File Manager cPanel Anda, buka folder root subdomain tersebut (biasanya bernama folder mylab.mustika.my.id atau di dalam folder khusus di luar public_html), lalu ikuti panduan ini:

  1. Buat File Baru: Klik + File di pojok kiri atas, beri nama index.html (huruf kecil semua).
  2. Edit File: Klik kanan pada index.html, pilih Edit.
  3. Salin & Tempel Kode: Gabungan struktur HTML (Langkah 2) dan desain warna CSS (Langkah 3) berikut ini:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Lab Koding Saya</title>
    <style>
        /* Ini adalah area CSS untuk menghias halaman */
        body {
            background-color: #f4f7f6;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            text-align: center;
            padding-top: 50px;
        }
        .box {
            background-color: white;
            padding: 30px;
            border-radius: 10px;
            box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
            display: inline-block;
            max-width: 400px;
        }
        h1 {
            color: #2c3e50;
        }
        p {
            color: #7f8c8d;
        }
    </style>
</head>
<body>

       <div class="box">
        <h1>Halo Dunia! 🚀</h1>
        <p>Langkah 2 dan 3 berhasil dilakukan langsung di subdomain praktikum saya.</p>
    </div>

</body>
</html>
  1. Simpan: Klik Save Changes di pojok kanan atas editor cPanel.
  2. Cek Hasilnya: Silakan buka atau refresh link https://mylab.mustika.my.id/. Tulisan polos tadi akan berubah menjadi sebuah kotak putih rapi dengan bayangan halus di latar belakang abu-abu.

Ketik kembali di sini jika index.html Anda sudah berhasil tampil di browser, agar kita bisa langsung gas ke Langkah 4 (Membuat logika PHP dinamis)!

======= Selamat! Website pertama Anda di mylab.mustika.my.id sudah berhasil tampil dengan kotak putih rapi. Itu tandanya HTML dan CSS Anda sudah berjalan sempurna.

Sekarang kita lanjut ke Langkah 4: Logika PHP Dinamis.

Langkah 4: Membuat File PHP Dinamis

Di folder File Manager yang sama (lokasi tempat Anda membuat index.html tadi), mari buat file khusus PHP.

  1. Klik + File di pojok kiri atas cPanel.
  2. Beri nama file: tes.php (pastikan menggunakan akhiran .php).
  3. Klik kanan pada file tes.php, lalu pilih Edit.
  4. Salin dan tempel (paste) seluruh kode di bawah ini:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Praktikum PHP Dinamis</title>
    <style>
        body {
            background-color: #eef2f3;
            font-family: Arial, sans-serif;
            text-align: center;
            padding-top: 50px;
        }
        .container {
            background-color: white;
            padding: 40px;
            border-radius: 12px;
            box-shadow: 0px 4px 15px rgba(0,0,0,0.05);
            display: inline-block;
            max-width: 500px;
        }
        h1 { color: #2ecc71; }
        .waktu {
            font-size: 20px;
            font-weight: bold;
            color: #34495e;
            background: #f1f2f6;
            padding: 10px;
            border-radius: 5px;
            margin: 20px 0;
        }
    </style>
</head>
<body>

    <div class="container">
        <h1>Sukses Menjalankan PHP! 🎉</h1>
        <p>Halaman ini diproses langsung oleh server hosting Anda secara waktu nyata (real-time).</p>

               <div class="waktu">
            <?php
            // Mengatur zona waktu ke WIB (Jakarta)
            date_default_timezone_set('Asia/Jakarta');

            // Menampilkan hari, tanggal, dan jam secara otomatis
            echo "Hari ini: " . date("l, d F Y") . "<br>";
            echo "Jam Server: " . date("H:i:s") . " WIB";
            ?>
        </div>

        <p><a href="index.html">← Kembali ke Halaman Utama</a></p>
    </div>

</body>
</html>
  1. Klik Save Changes di pojok kanan atas cPanel.

Cara Menguji Hasilnya:

  1. Buka tab baru di browser Anda.
  2. Akses alamat lengkapnya di: mustika.my.id
  3. Perhatikan bagian Jam Server dan Hari. Setiap kali Anda melakukan refresh halaman, detiknya akan terus berjalan mengikuti waktu saat ini. Itulah fungsi utama PHP: membuat halaman menjadi dinamis dan berubah otomatis sesuai data asli di server. [1]

Kabari saya di sini jika halaman tes.php Anda sudah bisa diakses dan menampilkan jam server dengan benar. Setelah itu, kita bisa langsung gas ke Langkah 5 (Menambahkan tombol interaktif JavaScript)!

[1] https://phppot.com

====

Selamat! Website pertama Anda di mylab.mustika.my.id sudah berhasil tampil dengan kotak putih rapi. Itu tandanya HTML dan CSS Anda sudah berjalan sempurna.

Sekarang kita lanjut ke Langkah 4: Logika PHP Dinamis.

Langkah 4: Membuat File PHP Dinamis

Di folder File Manager yang sama (lokasi tempat Anda membuat index.html tadi), mari buat file khusus PHP.

  1. Klik + File di pojok kiri atas cPanel.
  2. Beri nama file: tes.php (pastikan menggunakan akhiran .php).
  3. Klik kanan pada file tes.php, lalu pilih Edit.
  4. Salin dan tempel (paste) seluruh kode di bawah ini:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Praktikum PHP Dinamis</title>
    <style>
        body {
            background-color: #eef2f3;
            font-family: Arial, sans-serif;
            text-align: center;
            padding-top: 50px;
        }
        .container {
            background-color: white;
            padding: 40px;
            border-radius: 12px;
            box-shadow: 0px 4px 15px rgba(0,0,0,0.05);
            display: inline-block;
            max-width: 500px;
        }
        h1 { color: #2ecc71; }
        .waktu {
            font-size: 20px;
            font-weight: bold;
            color: #34495e;
            background: #f1f2f6;
            padding: 10px;
            border-radius: 5px;
            margin: 20px 0;
        }
    </style>
</head>
<body>

    <div class="container">
        <h1>Sukses Menjalankan PHP! 🎉</h1>
        <p>Halaman ini diproses langsung oleh server hosting Anda secara waktu nyata (real-time).</p>

               <div class="waktu">
            <?php
            // Mengatur zona waktu ke WIB (Jakarta)
            date_default_timezone_set('Asia/Jakarta');

            // Menampilkan hari, tanggal, dan jam secara otomatis
            echo "Hari ini: " . date("l, d F Y") . "<br>";
            echo "Jam Server: " . date("H:i:s") . " WIB";
            ?>
        </div>

        <p><a href="index.html">← Kembali ke Halaman Utama</a></p>
    </div>

</body>
</html>
  1. Klik Save Changes di pojok kanan atas cPanel.

Cara Menguji Hasilnya:

  1. Buka tab baru di browser Anda.
  2. Akses alamat lengkapnya di: mustika.my.id
  3. Perhatikan bagian Jam Server dan Hari. Setiap kali Anda melakukan refresh halaman, detiknya akan terus berjalan mengikuti waktu saat ini. Itulah fungsi utama PHP: membuat halaman menjadi dinamis dan berubah otomatis sesuai data asli di server. [1]

Kabari saya di sini jika halaman tes.php Anda sudah bisa diakses dan menampilkan jam server dengan benar. Setelah itu, kita bisa langsung gas ke Langkah 5 (Menambahkan tombol interaktif JavaScript)!

[1] https://phppot.com

======

Keren sekali! Saya sudah melihat hasilnya, data tanggal Saturday, 30 May 2026 dan jam server berjalan sangat akurat di server LiteSpeed Anda. Tidak perlu tangkapan layar, halaman Anda sudah live dan berjalan sempurna! Sekarang mari kita lanjutkan ke Langkah 5: JavaScript (Interaksi Sisi Klien / Browser).

Pada tahap ini, kita tidak membuat file baru, melainkan memodifikasi file index.html yang pertama kali kita buat agar memiliki tombol interaktif tanpa perlu memuat ulang (refresh) halaman.

Langkah 5: Menambahkan JavaScript Interaktif

  1. Masuk ke File Manager cPanel Anda.
  2. Cari file index.html, klik kanan, lalu pilih Edit.
  3. Hapus semua kode lama di dalamnya, lalu ganti dengan kode baru yang sudah dilengkapi tombol JavaScript di bawah ini:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Lab Koding Saya - JS Test</title>
    <style>
        body {
            background-color: #f4f7f6;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            text-align: center;
            padding-top: 50px;
        }
        .box {
            background-color: white;
            padding: 30px;
            border-radius: 10px;
            box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
            display: inline-block;
            max-width: 400px;
        }
        h1 { color: #2c3e50; }
        p { color: #7f8c8d; }

        /* Gaya untuk tombol JavaScript */
        .btn {
            background-color: #3498db;
            color: white;
            border: none;
            padding: 10px 20px;
            font-size: 16px;
            border-radius: 5px;
            cursor: pointer;
            transition: 0.2s;
            margin-top: 15px;
        }
        .btn:hover { background-color: #2980b9; }
        .nav-link { display: block; margin-top: 20px; color: #e67e22; text-decoration: none; }
    </style>
</head>
<body>

    <div class="box">
        <h1>Halo Dunia! 🚀</h1>
        <p>Langkah 2, 3, dan 5 digabung di halaman utama ini.</p>

               <button class="btn" onclick="jalankanAksi()">Klik Saya</button>

        <a href="tes.php" class="nav-link">Lihat Halaman PHP (Langkah 4) →</a>
    </div>

       <script>
        function jalankanAksi() {
            // Memunculkan pesan peringatan di browser
            alert("Hebat! JavaScript Anda berhasil merespon klik tanpa refresh halaman!");
        }
    </script>

</body>
</html>
  1. Klik Save Changes di pojok kanan atas cPanel.

Cara Menguji Hasilnya:

  1. Buka halaman utama laboratorium Anda di: https://mylab.mustika.my.id/
  2. Klik tombol "Klik Saya" yang baru saja muncul.
  3. Browser akan langsung menampilkan jendela pop-up kecil berisi pesan sukses.

Kabari saya jika tombolnya sudah berfungsi dengan baik. Jika sudah, apakah Anda ingin naik kelas ke tahap pembuatan database (MySQL) dan form input data, atau ingin mencoba integrasi Ajax terlebih dahulu?

=======

Keren sekali! Saya sudah melihat hasilnya, data tanggal Saturday, 30 May 2026 dan jam server berjalan sangat akurat di server LiteSpeed Anda. Tidak perlu tangkapan layar, halaman Anda sudah live dan berjalan sempurna! Sekarang mari kita lanjutkan ke Langkah 5: JavaScript (Interaksi Sisi Klien / Browser).

Pada tahap ini, kita tidak membuat file baru, melainkan memodifikasi file index.html yang pertama kali kita buat agar memiliki tombol interaktif tanpa perlu memuat ulang (refresh) halaman.

Langkah 5: Menambahkan JavaScript Interaktif

  1. Masuk ke File Manager cPanel Anda.
  2. Cari file index.html, klik kanan, lalu pilih Edit.
  3. Hapus semua kode lama di dalamnya, lalu ganti dengan kode baru yang sudah dilengkapi tombol JavaScript di bawah ini:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Lab Koding Saya - JS Test</title>
    <style>
        body {
            background-color: #f4f7f6;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            text-align: center;
            padding-top: 50px;
        }
        .box {
            background-color: white;
            padding: 30px;
            border-radius: 10px;
            box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
            display: inline-block;
            max-width: 400px;
        }
        h1 { color: #2c3e50; }
        p { color: #7f8c8d; }

        /* Gaya untuk tombol JavaScript */
        .btn {
            background-color: #3498db;
            color: white;
            border: none;
            padding: 10px 20px;
            font-size: 16px;
            border-radius: 5px;
            cursor: pointer;
            transition: 0.2s;
            margin-top: 15px;
        }
        .btn:hover { background-color: #2980b9; }
        .nav-link { display: block; margin-top: 20px; color: #e67e22; text-decoration: none; }
    </style>
</head>
<body>

    <div class="box">
        <h1>Halo Dunia! 🚀</h1>
        <p>Langkah 2, 3, dan 5 digabung di halaman utama ini.</p>

               <button class="btn" onclick="jalankanAksi()">Klik Saya</button>

        <a href="tes.php" class="nav-link">Lihat Halaman PHP (Langkah 4) →</a>
    </div>

       <script>
        function jalankanAksi() {
            // Memunculkan pesan peringatan di browser
            alert("Hebat! JavaScript Anda berhasil merespon klik tanpa refresh halaman!");
        }
    </script>

</body>
</html>
  1. Klik Save Changes di pojok kanan atas cPanel.

Cara Menguji Hasilnya:

  1. Buka halaman utama laboratorium Anda di: https://mylab.mustika.my.id/
  2. Klik tombol "Klik Saya" yang baru saja muncul.
  3. Browser akan langsung menampilkan jendela pop-up kecil berisi pesan sukses.

Kabari saya jika tombolnya sudah berfungsi dengan baik. Jika sudah, apakah Anda ingin naik kelas ke tahap pembuatan database (MySQL) dan form input data, atau ingin mencoba integrasi Ajax terlebih dahulu?

====== Luar biasa! Saya sudah ikut mengecek langsung ke link mylab.mustika.my.id Anda.

Tombol "Klik Saya" berlatar biru berfungsi 100% dan jendela pesan peringatan (alert) browser muncul secara instan dengan pesan "Hebat! JavaScript Anda berhasil merespon klik tanpa refresh halaman!". Pondasi dasar HTML (struktur), CSS (tampilan), PHP (server), dan JavaScript (interaksi) Anda kini sudah terpasang dengan benar di shared hosting. [1, 2]

Langkah 6: Membuat Form & Mengirim Data (Kombinasi HTML + PHP)

Sebelum melompat terlalu jauh ke database MySQL yang rumit, mari pelajari bagaimana halaman web menerima masukan dari pengguna dan memprosesnya secara dinamis menggunakan metode POST.

  1. Masuk ke File Manager cPanel Anda.
  2. Buat file baru bernama kontak.php.
  3. Klik kanan pada file kontak.php, lalu pilih Edit.
  4. Salin dan tempel seluruh kode di bawah ini:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Formulir Input Data</title>
    <style>
        body { background-color: #f4f7f6; font-family: sans-serif; text-align: center; padding-top: 50px; }
        .box { background-color: white; padding: 30px; border-radius: 10px; box-shadow: 0px 4px 10px rgba(0,0,0,0.1); display: inline-block; width: 350px; text-align: left; }
        h2 { text-align: center; color: #2c3e50; }
        input[type="text"], input[type="submit"] { width: 100%; padding: 10px; margin: 10px 0; border-radius: 5px; border: 1px solid #ccc; box-sizing: border-box; }
        input[type="submit"] { background-color: #2ecc71; color: white; border: none; cursor: pointer; font-weight: bold; }
        input[type="submit"]:hover { background-color: #27ae60; }
        .hasil { background-color: #e8f8f5; border-left: 5px solid #2ecc71; padding: 10px; margin-top: 20px; border-radius: 4px; }
    </style>
</head>
<body>

    <div class="box">
        <h2>Kirim Data ke Server</h2>

               <form action="kontak.php" method="POST">
            <label>Masukkan Nama Anda:</label>
            <input type="text" name="nama_user" placeholder="Contoh: Budi" required>

            <input type="submit" name="submit" value="Kirim ke Server 🚀">
        </form>

               <?php
        if (isset($_POST['submit'])) {
            // Mengambil data dari inputan text 'nama_user'
            $nama = htmlspecialchars($_POST['nama_user']);

            echo "<div class='hasil'>";
            echo "<strong>Server Merespon:</strong><br>";
            echo "Halo, <b>" . $nama . "</b>! Data Anda sukses ditangkap oleh server PHP.";
            echo "</div>";
        }
        ?>

        <p style="text-align: center; margin-top: 20px;"><a href="index.html" style="color: #95a5a6; text-decoration: none;">← Kembali</a></p>
    </div>

</body>
</html>
  1. Klik Save Changes di pojok kanan atas cPanel.

Cara Menguji Hasilnya:

  1. Buka halaman baru di browser Anda: mustika.my.id
  2. Ketik nama Anda di dalam kotak, lalu klik tombol "Kirim ke Server".
  3. Halaman akan memproses input tersebut dan menampilkan pesan sapaan khusus sesuai nama yang Anda ketikkan.

Jika eksperimen ini sukses, beri tahu saya! Kita bisa langsung lanjut ke pembuatan database MySQL asli di cPanel agar data yang Anda input tidak hilang saat halaman di-refresh.

[1] https://stackoverflow.com [2] https://www.youtube.com