Mpus Gabut

Langkah Mudah Menginstal Editor HTML dan Localhost XAMPP untuk Pemula

HyperText Markup Language

Untuk memulai menggunakan HTML memerlukan 2 hal:

  1. Text Editor, seperti Notepad, Notepad++, Visual Studio Code, dan banyak lainnya.
  2. Localhost, seperti XAMPP, wampServer, LAMPP, yang mana ini memungkinkan pengguna untuk mengatur server lokal di komputer mereka sendiri. Ini sangat berguna untuk pengembangan web dan pengujian sebelum aplikasi atau situs web diunggah ke server live.

Ada banyak text editor dan kompiler yang dapat dipilih. Dalam artikel ini, akan menggunakan Visual Studio Code sebagai Text Editor dan XAMPP sebagai localhost.

Install Text Editor Visual Studio Code

Langkah pertama kita download terlebih dahulu Visual Studio Code, klik di sini untuk download atau kunjungi ke https://code.visualstudio.com/download. Kemudian kalian bisa pilih Operating System yang kalian pakai. Karena di sini saya menggunakan Operating System Windows maka saya klik Windows, dan tunggu hingga proses download selesai.

Website Download Visual Studio Code

Jika proses download telah selesai, akan muncul seperti gambar di bawah. Lalu kalian klik saja Visual Studio Code yang telah kalian download.

Atau bisa ke folder download seperti di bawah ini. Kalian klik kiri 2x pada mouse kalian atau bisa juga dengan klik kanan pada mouse lalu klik Open.

Jika sudah, maka akan muncul tampilan seperti ini. Kalian klik Run.

Kemudian pilih I accept the agreement dan klik tombol Next.

Di sini kalian bisa memilih tempat atau lokasi penyimpanan Visual Studio Code kalian. Jika kalian ingin lokasi default dari Visual Studio Code kalian, kalian bisa langsung klik tombol Next.

Di sini kalian tinggal klik tombol Next.

Klik tombol Next.

Kemudian kita klik tombol Install.

Jika proses instalasi Visual Studio Code telah selesai kalain klik tombol Finish.

Dan selamat! Visual Studio Code kalian sukses terinstall.

Install XAMPP

Langkah pertama kita download terlebih dahulu XAMPP, klik di sini untuk download atau kunjungi ke https://www.apachefriends.org/download.html. Kemudian kalian bisa klik tombol download yang kalian pakai. Karena di sini saya menggunakan Operating System Windows maka saya klik Windows, dan tunggu hingga proses download selesai.

Jika proses download telah selesai, akan muncul seperti gambar di bawah. Lalu kalian klik saja XAMPP yang telah kalian download.

Jika sudah, maka akan muncul tampilan seperti ini. Kalian klik Run.

Klik tombol Next.

Di sini kalian bisa memindahkan folder xampp sesuai keinginan kaliian, atau kalian bisa meletakkannya secara default, kemudian klik tombol Next.

Pilih bahasa yang kalian inginkan, kemudian klik tombol Next.

Tunggu hingga proses install selesai.

Jika proses install telah selesai, kemudian klik finish.

Klik start pada Apache dan MySQL.

Mencoba HTML

Sekarang kita coba memprogram HTML sederhana dengan Visual Studio Code. Buka Visual Studio Code, kemudian klik CTRL + N secara bersamaan, dan klik secara bersamaan CTRL + S dan simpan di folder C:\xampp\htdocs, berikan nama sesusai yang kalian inginkan dan jangan lupa untuk memberi extensi .html dibelakang nama yang kalian berikan.

Kemudian kita masukkan kode berikut.

<!DOCTYPE html>
<head>
    <title>Document</title>
</head>
<body>
    <p>Selamat Datang Di Halaman Website Pertama Saya</p>
</body>
</html>

Tidak perlu khawatir jika belum memahaminya, sekarang kita buka browser dan ketikkan localhost (jangan dicopy) dan klik enter. Selamat code HTML pertama kita telah kita buat.

Masih bingung? Bisa perhatikan video di bawah ini.

Cara Install Visual Studio Code
Cara Install XAMPP

Tinggalkan Komentar

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Scroll to Top