HTML Editors


Bab 1: Menulis HTML Itu di Mana?

Banyak pemula bertanya: "Saya sudah siap ngoding, tapi nulis kodenya di mana? Apa harus install aplikasi berat? Atau bisa pakai Microsoft Word?"

Jawabannya sederhana: Anda bisa menulis HTML di mana saja, bahkan di aplikasi paling sederhana sekalipun. File HTML pada dasarnya hanyalah sebuah file teks biasa (Plain Text) yang berekstensi .html.

⛔ Peringatan Keras:

Jangan pernah menggunakan Microsoft Word, Google Docs, atau Wordpad untuk menulis kode HTML!

Aplikasi-aplikasi tersebut menambahkan "kode tersembunyi" (formatting) yang tidak terlihat mata, tetapi bisa merusak kode HTML Anda saat dibaca oleh browser.

Bab 2: Memilih Senjata (Text Editor)

Untuk menulis kode dengan nyaman dan cepat, para developer profesional menggunakan software khusus yang disebut Code Editor atau Text Editor. Berikut adalah beberapa pilihan terbaik (dan gratis!):

1. VS Code (Rekomendasi Utama)

Visual Studio Code buatan Microsoft adalah raja editor saat ini. Ringan, gratis, dan punya ribuan plugin. Bisa mewarnai kode (Syntax Highlighting) dan melengkapi kode otomatis (IntelliSense).

Download VS Code →

2. Sublime Text

Sangat-sangat ringan dan cepat. Cocok untuk laptop dengan spesifikasi rendah. Versi gratisnya sudah sangat cukup untuk belajar, meskipun sesekali akan muncul popup minta donasi.

3. Notepad++ (Windows Only)

Editor legendaris untuk pengguna Windows. Tampilannya jadul (seperti Windows 98), tapi sangat powerful dan tidak membebani komputer sama sekali.

Di CODIVAY, kami sangat menyarankan Anda untuk menginstall Visual Studio Code (VS Code) karena fiturnya yang sangat membantu pemula.


Bab 3: Langkah Membuat File HTML Pertama

Mari kita praktek langsung. Kita akan mencoba membuat halaman website pertama Anda menggunakan aplikasi bawaan Windows/Mac terlebih dahulu, agar Anda paham konsep dasarnya.

Langkah 1: Buka Notepad (PC) atau TextEdit (Mac)

Pengguna Windows: Tekan tombol Windows, ketik Notepad, lalu buka.

Pengguna Mac: Buka TextEdit. (Penting: Masuk ke Preferences > Format dan pilih "Make Plain Text").

Langkah 2: Tulis Kode HTML

Ketik kode berikut ke dalam Notepad/TextEdit kosong tersebut:

<!DOCTYPE html>
<html>
<body>

<h1>Website Pertamaku</h1>
<p>Halo dunia, saya sedang belajar di CODIVAY!</p>

</body>
</html>

Langkah 3: Simpan Sebagai HTML

Ini langkah paling krusial! Jangan simpan sebagai .txt.

  • Klik File > Save As.
  • Pada nama file, ketik: index.html
  • Pada "Save as type" (Windows), pilih All Files (*.*).
  • Pilih "Encoding" menjadi UTF-8 (agar huruf/simbol aneh terbaca).
  • Klik Save.

Langkah 4: Buka di Browser

Cari file index.html yang baru saja Anda simpan. Ikonnya pasti berubah menjadi logo browser (Chrome/Edge). Klik dua kali file tersebut.

✨ Selamat! Website pertamamu sudah jadi dan berjalan di browser!


Bab 4: Eksperimen Tanpa Install

Jika Anda sedang menggunakan HP atau malas membuka Notepad, Anda selalu bisa menggunakan fitur "Coba Sendiri" di CODIVAY. Ini adalah editor virtual yang berjalan di browser.

Coba Edit Teks Ini:

<!DOCTYPE html>
<html>
<body>

<h1>Judul Halaman</h1>
<p>Ubah teks ini sesuka hatimu!</p>

</body>
</html>

Bab 5: ⚡ Proyek Kilat - Simulasi Editor

Mari kita simulasikan proses pembuatan file HTML yang benar. Tugas Anda adalah menulis kode lengkap sebuah halaman web sederhana di bawah ini.

🎯 Misi Editor:

  • ✅ Tulis struktur dasar: <!DOCTYPE html>, <html>, dan <body>.
  • ✅ Di dalam body, buat Judul <h1> dengan teks: Hello Editor
  • ✅ Di bawahnya, buat Paragraf <p> dengan teks: Saya siap ngoding

Pusat Dokumentasi Developer

Tidak perlu hafalkan kodenya, cukup pahami logikanya. Kalau kamu butuh jawaban cepat saat lagi ngoding, kamu bisa intip dokumentasi teknis di bawah ini:

Langkah Selanjutnya

Kamu sudah punya editor, kamu sudah paham strukturnya. Sekarang, saatnya mempelajari elemen paling dasar di HTML.

Lanjut ke HTML Basic »