Penggunaan Sublime Text untuk HTML

Jul 30, 2024

Catatan Kuliah: Penggunaan Sublime Text untuk HTML

Pengenalan Kode Editor

  • Sebelum belajar HTML, perlu mendownload kode editor.
  • Rekomendasi: Sublime Text.
  • Tidak menggunakan Notepad untuk coding lagi.

Langkah-langkah Mengunduh Sublime Text

  1. Kunjungi Website: sublimetext.com
  2. Menu Download:
    • Pilih versi stabil: Sublime Text 2 atau versi beta: Sublime Text 3.
    • Download sesuai dengan sistem operasi:
      • Windows 32 bit
      • Windows 64 bit
      • OSX
  3. Instalasi:
    • Setelah terdownload, lakukan instalasi biasa.
    • Simpan shortcut ke Taskbar untuk kemudahan akses.
  4. Buat Folder Baru:
    • Contoh: buat folder bernama latihan 2.

Memulai Dengan Sublime Text

  • Membuat File HTML:
    • Klik File > New untuk membuat file baru.
    • Segera simpan file dengan klik Save (misal: halaman1.html).
  • Syntax Highlighting:
    • Sublime Text secara otomatis mengenali format file dan memberikan warna sesuai sintaks.
    • Contoh: Setelah menyimpan, sintaks HTML akan berwarna sesuai.

Menulis HTML di Sublime Text

  1. Ketik doctype untuk inisialisasi HTML.
  2. Gunakan shortcut untuk membuat tag lebih cepat:
    • Contoh: Tulis html kemudian tekan Tab untuk otomatis menulis struktur HTML standar.
  3. Menambahkan konten:
    • Judul di dalam tag title.
    • Paragraf dibungkus dengan tag p (tekan Tab untuk mempermudah).

Kustomisasi Sublime Text

  • Mengubah Ukuran Font:
    • Menu: Preferences > Font untuk menyesuaikan ukuran.
    • Shortcut: Ctrl + + (memperbesar) atau Ctrl + - (memperkecil).
  • Mengubah Skema Warna:
    • Menu: Preferences > Color Scheme, pilih skema yang diinginkan.

Mengelola File dan Folder

  • Untuk membuka folder:
    • Pilih Open Folder untuk menampilkan struktur direktori.
    • Menambahkan file baru: Klik kanan di sidebar dan pilih New File.
  • Menampilkan/Menyembunyikan Sidebar:
    • Shortcut: Ctrl + K, Ctrl + B.

Menjalankan HTML di Browser

  • Untuk melihat hasil karya:
    • Klik kanan pada area whitespace file di Sublime Text, pilih Open in Browser.

Referensi dan Dokumentasi

Catatan ini memberikan gambaran penggunaan Sublime Text untuk pemrograman HTML, cara mengunduh, menginstal, menulis, dan menjalankan file HTML dengan efisien.

šŸŒ