21

Video Tutorial HTML & CSS 02: Pemilihan Text Editor

html-css-video-tutorialKetika menulis sebuah kode program, salah satu software yang utama adalah Text Editor. Meski dengan Notepad bisa menulis kode HTML dan CSS, tetapi fitur dan kemampuannya sangat terbatas. Oleh karena itu disini kita merlukan sebuah Text Editor, dengan kriteria gratis, ringan dan “powerfull”, pilihan jatuh pada Notepad++ disertai tips dan triknya.

Mungkin sebagian yang pernah membuat web, biasa menggunakan aplikasi kelas berat seperti Macromedia Dreamweaver (sekarang Adobe Dreamweaver). Tidak dipungkiri bahwa ini merupakan aplikasi yang powerfull untuk programming, terutama yang terbiasa koding antarmuka berbasis GUI (Graphical User Interface). Tetapi akan lebih ‘matang’ ketika koding baik HTML, CSS, PHP kita berfokus pada Text Editor saja.

adobe-dreamweaver-cs6

Lho, bukannya Dreamweaver juga bisa digunakan sebagai Text Editor? Memang benar, tetapi menggunakan dreamweaver selain berat (spesifikasi komputer harus tingggi, memakan banyak RAM dan CPU, lambat dsb), program ini berbayar dan harganya relatif mahal untuk kantong kita. Bahkan untuk koding HTML, CSS, PHP ataupun javascript kita akan lebih banyak berfokus pada text, sehingga disini Text Editor yang powerfull tetapi tetap ringan dan gratis diperlukan, dan pilihan jatuh pada Notepad++.

Sebenarnya selain Notepad++ banyak text editor gratis lainnya yang juga bisa menjadi alternatif yang juga ringan, yang pernah saya coba antara lain Programmer Notepad, Sublime Text 2, Komodo Edit, PSPad, Notepad2, yang agak ‘berat’ seperti Netbeans serta Eclipse serta terakhir yang masih versi beta seperti Bracket. Sublime Text 2 sebenarnya banyak menjadi pilihan programmer professional kelas dunia, tetapi karena ada beberapa fitur yang menurut saya sangat penting belum ada, tetapi ada di Notepad++, maka Notepad++ masih menjadi pilihan utama di Windows.

Download dan Install Notepad++

Notepad++ dapat di unduh/download dari website resminya di http://notepad-plus-plus.org. Tersedia versi installer dan portable. Fiturnya sama, hanya saja untuk installer tersedia opsi untuk menambahkan menu Open with Notepad++ di klik kanan windows (meski versi portable juga bisa menggunakan tips khusus). Di video tutorial ini saya menggunakan versi portable agar lebih mudah.

Untuk melihat kualitas video yang lebih tinggi, bisa melihat melalui Youtube dengan memilih Opsi 480p. Setelah Download Notepad++, install dan dijalankan, bisa saja kita langsung menggunakan Notepad++ untuk koding, karena memang setting bawaan sebenarnya sudah mencukupi. Tetapi agar lebih nyaman, di video tutorial ini saya memberikan beberapa tips dan trik yang sudah saya terapkan dan gunakan sehari-hari, antara lain :

  • Setting auto complete untuk mempercepat koding kata yang sering muncul
  • Style Configurator, memilih skema/tampilan yang nyaman di mata dan menyejukkan
  • Install plugins yang sangat bermanfaat, seperti XBracketLite, Notepad# dan Explorer

Selain plugins tersebut, masih banyak plugins yang bisa di install sesuai kebutuhan kita. Misalnya TagsView untuk menampilkan daftar variabel, fungsi dan prosedur yang bisa langsung di klik untuk menuju baris kodenya dan lainnya. Daftar plugins yang tersedia bisa dilihat melalui menu Plugins > Plugins Manager > Show Plugins Manager ( diperlukan koneksi internet untuk install dari Plugin Manager ini).

Video tutorial ini merupakan seri kedua, lanjutan dari video tutorial sebelumnya Video tutorial HTML dan CSS 01 : Halaman web pertama saya. Jika ada pertanyaan, masukan atau saran silahkan disampaikan melalui komentar. Semoga bermanfaat.

21 Comments

  1. Wahh..trima kasih bnyak mas Ebta, soalnya artikel lnjutan yg ini sya tnggu2 trnyata stelah 12 hari akhirnya kluar jg.>_<
    Skli lgi trima kasih, smoga msh ada lnjutannya lgi..
    Maju trs ebsoft.web.id^_^

  2. terima kasih
    selama ini saya juga pakai notepad++ tapi nggak kepikiran instal plugin
    very nice tutorial
    ditunggu lanjutannya

  3. oya mas ebta, kalau bisa tutorial berikutnya suaranya agak kenceng ya
    makasih
    #nggak sabar nunggu yg berikutnya

  4. Sebelumnya saya ucapkan terima kasih atas kemurahan hati mas ebta untuk sharing ilmunya semoga menjadi amal ibadah bagi mas ebta. saya sudah mencoba menggunakan notepad ++ di komputer saya, tapi di PC sy core i7 OS Win 7 64 bit notepad ++ tersebut sering not responding, sementara di laptop saya win 7 32 bit tidak ada masalah, mohon saran mas ebta mengenai masalah tersebut, mungkin mas ebta punya pengalaman yang kurang lebih sama dengan saya. terima kasih

  5. Biasanya notepad++ saya pake buat ngeditin blogger template yg ada kemudian diedit2 sedikit baru tempel di blogger template.
    Algoritmanya jadi gampang dimengerti klo pake notepad++ dibanding notepad biasa

  6. wah , sekarang udah jamannya CSS 3 sama HTML 5 , dulu seringnya pakai macromedia dreamweaver 🙂 kalau ngedit skrip

  7. wah terimakasih banyak atas infonya tentang HTML kebetulan saat ini saya sedang belajar membuat HTML menggunakan notepad++ terimakasih infonya sangat bermanfaat
    salam kenal

Comments are closed.