
Jika belum mengikuti pembahasan sebelumnya silahkan baca disini : http://bit.ly/HTMLdasar_helloworld
HomeSweetHome - Halo sobat Hits. Masih di HTML Dasar. Kali ini kita akan bahas sedikit soal Code Editor. Okeh langsung aja ya!
Code Editor itu apa?
Code Editor : Software yang digunakan oleh para developer atau programmer untuk membangun aplikasi nya entah itu Web, Desktop atau Mobile yang penggunaannya yaitu menuliskan kode kode program sesuai dengan aplikasi yang mereka develop, karna kita saat ini sedang belajar aplikasi Web, jadi kode kode yang dituliskan di dalamnya berupa HTML, CSS, Javascript dan lain-lain.
Nah, sebelumnya kan kita pake Notepad ya. Sekarang kita beralih ke Sublime Text, biar lebih advanced dalam pengkodeannya.
Yang belum punya Sublime Text nya bisa didownload di http://bit.ly/sublimetext_3
Kalau kalian udah download, langsung install aja ya, gampang kok install nya, cuma Next Next Install Finish.
SublimeText? - Sublime Text adalah Code Editor yang saat ini lagi populer dikalangan kawan kawan programmer, khususnya Web. Nah, di Sublime Text ini ngga cuma sebagai Editor HTML CSS atau aplikasi Web, tapi bisa juga C, C++, Phyton, Java, ASP dan banyak lagi.
Sekarang kami anggap sobat Hits udah install Sublime Text nya, sebelum sobat jalankan Sublime Text nya, silahkan kalian buat dulu folder di tempat yang sama seperti bahasan sebelumnya(http://bit.ly/HTMLdasar_helloworld) dan beri nama folder nya "latihan2" setelah itu silahkan sobat buka Sublime Text nya.
Terlihat seperti inilah tampilan awal Sublime Text

Nah, langsung saja bikin file baru dengan klik File > New File
Dari sini, sobat sudah bisa menuliskan kode kode program nya. Tapi biasakan sebelum memulai pengkodean sobat save dulu file nya sebagai ".html" kah, ".css" kah ataupun yang lainnya, agar si Sublime Text ini tau, kita mau membuat file apa. Silahkan sobat save dan tempatkan di folder "latihan2" tadi dan beri nama "halaman1.html".

Setelah sobat save, coba lihat di bagian kanan bawah pasti ada "HTML", itu tandanya file kita sekarang ini akan dibuat sebagai file HTML, jika belum disave sebagai file HTML file ini hanya terbaca sebagai Plain Text atau Text biasa. Coba sobat klik tulisan HTML nya, akan muncul semua jenis kode program yang bisa di Edit di Sublime Text ini. Sebelumnya, jika sobat belum save file nya dan ketika sobat menuliskan kode HTML didalamnya pasti warna text nya putih semua, tapi ketika sudah disave akan muncul warna pada tiap kode kode programnya, dan itu yang biasa disebut syntax highlighting.
Nah, dalam HTML, Sublime Text memberikan fitur yang keren salah satunya yaitu ketika ingin memulai koding, coba sobat ketik html lalu tekan tombol tab pada keyboard sobat. Otomatis, Sublime Text akan menampilkan struktur dasar atau struktur utama pada HTML.

Nah, salah satu fitur yang memudahkan lagi, coba deh sobat tulis tag apa aja, misalnya <body>, trus untuk nulis tag penutupnya sobat cukup ketik </ otomatis si Sublime Text akan langsung nutup tag body tanpa kita yang tulis.
Selain cara itu, ada lagi yaitu sama kaya yang diatas tadi. Sobat cukup ketik body tanpa siku, lalu kalian tekan tombol tab di keyboard kalian, otomatis si Sublime Text membuatkan tag pembuka dan penutup dari tag body, dan juga misalnya kalian mau membungkus konten dengan paragraf, kalian cukup ketik p trus tekan tab , tadaaaa, kalian udah langsung isi aja kontennya.

Nah, kalau kalian merasa ukuran teks dari si Sublime ini terlalu kecil kalian bisa memperbesarnya di Preferences > Font > Larger atau kalau mau di perkecil pilih Smaller, bisa juga menggunakan Hotkey atau Shortcut yaitu dengan menekan Ctrl + = untuk memperbesar dan Ctrl + Shift + + untuk memperkecil.

Sekarang, kalau sobat merasa skema warna Sublime Text nya ini kurang cocok atau kurang menarik, sobat bias mengubah nya di Preferences > Color Schemes lalu pilih skema warna nya.

Dan lagi kan file sobat itu ada di dalam folder yang tadi, nah tapi bagaimana jika sobat punya banyak file di dalam folder tadi? kalau file nya hanya satu bisa saja di Open File tapi jika banyak akan merepotkan. Nah sobat bisa memunculkan Side Bar Folder yang akan memunculkan file file atau folder di tempat yang kita pilih dengan klik File > Open Folder , sobat pilih folder html yang jadi folder dalam pembahasan HTML Dasar ini

Nah akan terbuka Sublime Text yang baru, yang sebelumnya close saja. Lalu di Sublime Text yang baru, sobat pilih View > Side Bar > Show Side Bar atau dengan Shortcut Ctrl + K + B(gantian K dan B jangan bersamaan). Maka akan muncul folder nya disebelah kiri trus sobat buka deh file tadi yang ada di folder latihan2.


Dan jika ingin menambahkan file baru, sobat tinggal klik kanan pada folder yang diinginkan lalu New File, lalu Save dan beri nama.


Kalau sobat ingin menghilangkan Side Bar nya, sobat tinggal ke View > Side Bar > Hide Side Bar atau dengan Shortcut yang tadi yaitu Ctrl + K + B.
Nah, di pembahasannya sebelumnya kan jika kita mau liat file HTML nya di browser itu kita buka file tersebut dengan mendouble klik file tersebut, nah sekarang dengan mudah kita tinggal klik kanan dimana saja di dalam Sublime Text nya lalu pilih Open in Browser

Yap, segitu untuk pengantar Sublime Text nya. Silahkan sobat eksplorasi untuk penggunaannya yang lebih advanced lagi atau sobat bisa melihat lengkapnya di websitenya langsung Sublime Text lalu ke bagian Support, tinggal pilih ke bagian Documentationnya Sublime Text 3.

Jangan lupa di subscribe biar ngga ketinggalan update dan share ke
temen- temennya yang juga lagi berjuang di Web Programming. Sampai
ketemu di Postingan berikutnya. Sekian. Terimakasih.
_Salam Hits_

















