Minggu, 23 April 2017

Tutorial Sublime Text 3 – #14 Sidebar Enhancements & Alignment

      Assalamualaikum Wr. Wb . Selamat pagi sahabat lupacode semuanya dimanapun kalian berada. Pad pagi hari yang cerah ini saya ingin melanjutkan pembahasan tutorial pada seri sublime text 3 yang akan membuat sahabat lupacode semuanya lebih cepat lagi dalam ngoding nya. Masih bersama saya selaku admin dari blog Lupacode – Tutorial Pemrograman yang senantiasa berbagi apa saya ketahui mengenai pemrograman, saya berbagi bukan karena saya master atau jago tapi saya disini ingin belajar bersama sama dengan sahabat lupacode semuanya dalam hal pemrograman.

Sidebar Enhancements & Alignment - Lupacode

            Pada pembahasan materi sebelumnya kita telah belajar mengenai salah satu plugin yang dapat membantu agar lebih cepat coding kita yaitu mengenai Tutorial Sublime Text 3 – #13Color silahkan bagi sahabat lupacode semua bagi yang kelewat pada materi kemarin dapat langsung megunjungi halaman Daftar Isi pada blog ini, karna dari pembahasan yang pertama sampai pembahasan yang sekarang ini sangatlah bermanfaat dan penting menurut saya untuk kita sebagai web developer.
        Saya ingin dengan saya berbagi tutorial mengenai sublime text ini ide nya adalah agar kita dapat lebih cepat lagi dalam ngoding kita dengan menggunakan editor sublime text 3 ini, maka dari itu saya sangat menyarankan kepada teman – teman semua agar mengikuti pembahasan materi sublime text ini dari materi yang pertama sampai dengan materi yang terakhir agar teman – teman dapat lebih memahami lagi apa yang saya sampaikan pada pembahasan sublime text ini.

       Pada kesempatan kali ini kita masih akan membahas mengenai plugin. Ada dua plugin yang akan kita bahas pada materi atau pada artikel kali ini yang digunakan untuk mempercepat kerja kita kuhusnya. Yang pertama dalam hal pembuatan file dan folder contohnya adalah seperti ini,
   Saya mempunyai sebuah folder dan saya beri nama folder itu “latihan” kemudian saya masukan atau saya drag ke dalam sublime text. Ketika saya ingin membuat sebuah file, yang harus saya lakukan adalah klik kanan pada folder latihan tersebut, kemudian saya pilih New file lalu saya save dulu file tersebut dan kemudian saya beri nama index.html  nah untuk membuat sebuah file baru didalam folder latihan tersebut kita membutuhkan beberapa langkah yah, nah disini saya bisa membuat sebuah file baru didalam folder latihan tersebut dengan sangat cepat, yaitu dengan menggunakan plugin yang namanya Siderbar Enhancements kita langsung saja mencobanya agar kalian tidak bingung
     Hal pertama yang saya lakukan adalah menginstal terlebih dahulu plugin tersebut, seperti biasa kita panggil terlebih dahulu Package Control kita, dengan masuk ke dalam menu Preferences -> Package Control atau seperti biasa kita gunakan shortcut nya yaitu dengan menekan CTRL + SHIFT + P lalu kita tulis dalam pencarian nya yang pertama Instal Package nya dulu, kemudian kita tekan enter lalu kita tulis nama plugin nya yaitu Sidebar Enhancements kemudian kita pilih yang paling atas seperti pada gambar dibawah ini

Sidebar Enhancements & Alignment 1 - Lupacode

        Kemudian kita tunggu untuk proses penginstalannya dan ini tergantng koneksi internet yang kita pakai yah. Oke kalau sudah selesai biasakan untuk selalu merestart terlebih dahulu sublime text nya dengan cara meng close terlebih dahulu sublime text nya kemudian kita buka lagi, walaupun ada beberapa plugin yang tidak harus merestart dulu sublime text nya. Sekarang kalian bisa lihat kalau saya klik kanan pada folder latihan yang tadi maka sekarang menu yang keluar akan menjadi banyak

Sidebar Enhancements & Alignment 2 - Lupacode

           Tapi yang saya sering gunakan adalah yang New File misalnya begini, kita kan coba membuat sebuah file baru didalam folder tersebut, saya klik kanan kemudian pilih New file dan kalian bisa lihat sekarang langsung muncul kolom dibawah untuk memberi nama file teresebut

Sidebar Enhancements & Alignment 3 - Lupacode

     Jadi ini sangat memudahkan, saya tinggal tulis nama file nya contoh saya tulis index.php kemudian saya tekan enter, maka akan langsung dibuatkan sebuah file index.php didalam folder latihan tersebut

Sidebar Enhancements & Alignment 4- Lupacode

          Jadi kita menskip beberapa langkah yah dan pengerjaan pun akan menjadi lebih cepat nantinya. kemudian kelebihan yang lain yang dimiliki oleh plugin Siderbar Enhancements ini ialah jika saya ingin membuat sebuah folder didalam folder latihan tersebut, kemudian didalam folder nya saya ingin membuat sebuah file. Contoh nya pada folder latihan saya ingin membuat sebuah folder css dan didalam folder css itu saya ingin membuat file index.css
      Kalian bisa saja dengan klik kanan kemudian New folder lalu New file tapi saya bisa membuat itu dengan hanya 1 langkah dengan menggunakan bantuan plugin Siderbar Enhancements ini, cara nya begini
      Saya klik kanan kemudian saya pilih New file walaupun saya akan buat folder yah, kemudian saya tulis css/style.css jadi si sidebar enhancement ini akan mengecek folder css sudah ada belum, kalau sudah ada buat file css dan simpan didalamnya, tapi kalau folder css nya tidak ada, maka dia dibuatkan langsung

Sidebar Enhancements & Alignment 5- Lupacode

        Kalian bisa lihat folder nya dibuatkan dan isinya langsung ada. Sama juga ketika saya mau bikin folder Javascript dan di dalamnya ada sebuah file lagi misalkan script.js, maka saya hanya perlu lakukan klik kanan kemudian pilih New file lalu saya tuliskan nama folder nya js kemudian saya kasih garis miring / kemudian nama file nya script.js lalu saya tekan enter maka akan langsung dibuatkan.

Sidebar Enhancements & Alignment 6- Lupacode

   Jadi itu sangat memudahkan sekali khususnya buat saya ketika saya membuat file dengan cepat, jadi sangat membantu yah.
      Plugin ke-dua yang akan kita bahas adalah sebuah plugin yang sangat sederhana sekali tapi cukup membantu untuk merapihkan barisan kode yang saya miliki. Contohnya begini, saya mempunyai sebuah script php seperti pada gambar dibawah ini

Sidebar Enhancements & Alignment 7- Lupacode

     Jadi ceritanya saya punya variable yang di isi dengan data dari variable global post, tapi yang ingin saya rapihkan adalah tanda sama dengan diatas, kalian bisa lihat bahwa tanda sama dengan di atas tidak sejajar yah. Nah biasanya saya mensejajarkan tanda sama dengan diatas dengan cara memberikan tab tambahan agar tanda sama dengan itu sejajar, jadikan saya lakukan manual seperti itu, paham yah maksud saya.
    Plugin yang akan kita gunakan sekarang yaitu untuk mempermudah hal tersebut, jadi hanya dengan satu kali klik maka semuanya akan diperbaiki atau dirapihkan code nya. Plugin nya namanya alignment kemudian seperti biasa kita instal terlebih dahulu plugin alignment tersebut.
       Seperti yang biasa kita lakukan untuk menginstal sebuah plugin kita panggil dulu package control nya atau supaya cepat kita bisa menekan CTRL + SHIFT + P kemudian kita tulis install package kemudia tekan enter, lalu kita tulis nama plugin nya yaitu aligntment kita pilih yang paling atas lalu klik atau enter

Sidebar Enhancements & Alignment 8- Lupacode

      Kita tunggu sampai terinstal, kalau sudah seperti biasa kita restart terlebih dahulu sublime text nya dengan cara menutup dulu sublime text nya kemudian kita buka lagi. Oke kalau sudah caranya untuk mensejajarkan code diatas atau pada sama dengan diatas itu cukup mudah. Kita hanya tinggal blok script yang ingin di sejajarkan kemudian tekan short cut nya alignment yaitu CTRL  + ALT + A dan kalian bisa lihat sekarang maka otomatis akan langsung sejajar.

Sidebar Enhancements & Alignment 9- Lupacode

           Memang sangat sederhana sekali tapi ini cukup membantu agar si code nya terlihat lebih rapih. Selain untuk script PHP dia juga support untuk css, contohnya saya mempunyai sebuah script css sederhana dan saya ingin merapihkan script css nya, maka saya tinggal blok script yang ingin dirapihkan kemudian saya tekan shortcut nya yaitu CTRL + SHIFT + P Maka secara otomatis titik dua nya pun menjadi sejajar.

Sidebar Enhancements & Alignment 10- Lupacode

        Jadi plugin alignment ini support php, css dan bahasa pemrograman yang lainnya.
Jadi itu saja mungkin dua plugin sederhana yang sudah kita coba pada materi kali ini, yang pertama tadi ada Siderbar Enhancements lalu kemudian yang ke-dua ada aligntment. Mudah – mudahan kedua plugin ini dapat membantu temen – temen untuk mempercepat coding nya.
    Baiklah sampa disini dulu untuk pembahasan mengenai plugin Sidebar Enhancements & Alignment silahkan jika ada yang mau menambahkan atau ada yang mau ditanyakan dapat temen – temen tuliskan di kolom komentar dibawah dan insya allah saya akan cepat membalas setiap pertanyaan nya.
  Baiklah selanjutnya kita masih dalam seri sublime text dan untuk pembahasan materi berikutnya yang akan kita bahas adalah Tutorial Sublime Text 3 - #15 Coding Modes
Saya admin dari blog lupacode undur diri, sampai bertemu dalam pembahasan tutorial selanjutnya

Wassalamualaikum Wr. Wb

Silahkan berkomentar yang baik dan menarik sesuai dengan isi konten.
Komentar yang tidak diperbolehkan :

1. Berbau penghinaan SARA & PXXN
2. Komentar dengan Link hidup ( akan dianggap spam )
3. Komentar tidak nyambung dengan isi postingan
EmoticonEmoticon