Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Sublime Text
Webdesign

Peningkatan Visual Sederhana di Sublime Text agar Dapat Menulis Kode Lebih Baik

by
Length:ShortLanguages:

Indonesian (Bahasa Indonesia) translation by Thoriq Firdaus (you can also view the original English article)

Sublime Text menyajikan ribuan extensi dan pengaturan untuk menciptakan sebuah editor kode yang dapat terpersonalisasi bagi siapa saja. Saat ini, saya akan menunjukkan anda beberapa pengaturan, plugins, themes, dan skema warna untuk membantu membuat pengalaman menulis kode menjadi lebih menarik secara visual. Hal ini tidak akan membuat layar anda menjadi lebih cantik, alih-alih ini akan membuat anda menjadi seorang coder yang lebih baik!

Pengaturan

Sublime Text hadir dengan beberapa fitur yang terintegrasi untuk merubah pengalaman menulis kode anda secara visual, namun, beberapa pengaturannya secara default tidak diaktifkan. Berikut beberapa hal yang saya tidak dapat hidup tanpanya.

Catatan: Untuk mengedit file pengaturan Sublime Text, anda dapat membukanya dengan menuju menu Sublime Text 2 > Preferences > Settings - Default dan kemudian memilih item yang sesuai.

sublime-settings

Cari pengaturan yang ingin anda ubah, kemudian tambahkan pengaturan tersebut pada User Settings anda agar tidak terhapus ketika meng-upgrade Sublime Text.

sublime-settings-2

Selebihnya, anda dapat melihat pada Installation and Base Settings untuk mengelola pengaturan Sublime Text.

Font dan Spacing

Memilih font dan spacing yang tepat adalah salah satu cara personal untuk menyesuaikan kode anda. Pertama-tama, pilih jenis font yang cocok untuk tulisan kode, sebaiknya sebuah font monospaced. Berikut beberapa font yang dapat anda lihat:

Setelah anda memilih font, pastikan bahwa ia telah terpasang pada sistem anda, tambahkan nama dari font yang telah anda pilih pada pengaturan, dan sesuaikan ukuran serta spacing dengan opsi berikut:

“font_face”: “Inconsolata";
"font_size": 18;
"line_padding_bottom": 1,
"line_padding_top": 1,

highlight_line

Pengaturan berikut menyorot baris di mana posisi cursor berada dengan warna berbeda (tergantung dari skema warna anda). Mengetahui posisi baris terkini membantu anda fokus pada pekerjaan ketika sedang mengetik, anda dapat dengan mudah beralih dari baris ke baris, dan dengan cepat menemukan posisi anda ketika kembali dari program yang berbeda.

"highlight_line": true,

highlight_modified_tabs

Pengaturan berikut akan menyorot tab dari file yang telah dimodifikasi agar dapat memberi perhatian lebih pada file-file yang belum tersimpan.

"highlight_modified_tabs": true,

fade_fold_buttons

Apakah anda tahu Sublime Text dapat melipat dan membuka potongan kode? Saya mengetahuinya, tapi selalu lupa bahwa fitur berikut tersedia. Jika anda mengaktifkannya, ini akan membuat tanda lipat tetap terlihat alih-alih tersembunyi.

"fade_fold_buttons": false,

word_wrap

Scrolling horizontal bisa jadi menyakitkan. Dengan mengaktifkan pengaturan word wrap, teks anda akan menyesuaikan pada ukuran layar terkini dan mencegah scroll horizontal.

"word_wrap": true,

bold_folder_labels

Ada beberapa pengaturan yang tersedia untuk memberi aksentuasi lebih kuat untuk elemen-elemen visual pada side bar, ini dia:

"bold_folder_labels": true,

Menampilkan File yang Terbuka pada Side Bar

Anehnya, opsi berikut tidak tercantum dalam file pengaturan. Untuk menampilkan file-file pada bagian atas side bar anda, masuklah ke menu:

View → Side Bar → Show Open Files

Mensejajarkan Side Bar

Berikut bukanlah sebuah pengaturan, melainkan hanya sebuah tip. Seperti dalam sebuah spreadsheet, anda dapat melakukan double-click pada batasan diantara side bar dan konten untuk mengubah side bar menjadi selebar muatannya.

sublime-visual-sidebar

Plugins

Plugin sangatlah membantu dalam menghadirkan fitur-fitur tambahan di Sublime Text, saya sangat merekomendasikan anda menggunakan Package Control untuk mengatur plugin anda.

BracketHighlighter

Bracket highlighter adalah sebuah plugin yang menyorot tag serta tanda kurung. Ini adalah sebuah alat yang berguna untuk menunjukkan anda awal dan akhir dari setiap bagian kode yang anda berada di dalamnya. Tipe tanda kurung ditampilkan pada sidebar dengan sebuah ikon yang berbeda bagi setiap jenis karakter dan elemen.

sublime-visual-brackethighlighter-2

Git Gutter

Ini adalah salah satu plugin favorit saya. Git gutter adalah plugin sederhana yang menampilkan sebuah ikon pada area gutter untuk baris yang ditambahkan, telah dimodifikasi atau telah dihapus dengan perbanding dari proyek git anda.

sublime-visual-gitgutter-2

SublimeLinter

Plugin ini menampilkan lint highlighting (tanda ini muncul ketika terjadi potensi error pada kode anda). Dengan dokumentasi yang lengkap serta daftar linter yang panjang, plugin ini adalah solusi ampuh untuk memastikan bahwa kode anda bebas dari error.

sublime-visual-sublimelinter-2

Themes dan Skema Warna

Salah satu cara menyesuaikan Sublime Text agar membuatnya menjadi sepenuhnya milik anda adalah dengan theme dan skema warna. Saat ini ada ratusan pilihan lebih yang tersedia dan diperkenalkan setiap minggunya. Berikut adalah beberapa themes dan beberapa skema warna yang patut anda lihat.

Theme: Soda

Soda telah menjadi theme yang paling populer dan menjadi contoh terbaik untuk theme yang tersesuaikan di dalam komunitas Sublime Text. Banyak theme yang dibuat berdasar pada proyek ini. Soda menyajikan pengaturan tambahan, grafik yang teroptimasi untuk Retina, dan UI dengan tema gelap dan terang.

sublime-visual-soda-2

Theme: Flatland

Jika anda adalah penggemar desain flat yang sedang menjadi tren, maka Flatland adalah pilhan yang bagus. Theme ini menyederhanakan seluruh elemen-elemen visual serta memungkinkan anda menentukan beberapa opsi lain, seperti style pada tab dan sidebar.

Theme: Spacegray

Favorit saya saat ini dan sedang menjadi trending di Github, Spacegray memiliki palet warna unik dan UI hiper-minimalis.

sublime-visual-spacegray

Skema Warna: Solarized

Proyek Solarized yang sangat terkenal tersedia untuk Sublime Text. Ini adalah proyek warna yang dilabeli sebagai "warna-warna presisi untuk mesin dan manusia" dengan sebuah landasan sebuah teori warna yang unik dibaliknya.

Skema Warna: Base16

Base16 adalah skema warna lain yang juga populer dengan banyak pilihan (Saya saat ini sedang menggunakannya).

Kesimpulan

Ada banyak hal lain untuk diulas! Jangan lupa, penting untuk mengevaluasi seluruh elemen-elemen yang berbeda dari Sublime Text ketika mengubahnya menjadi milik Anda. Jangan sepenuhnya mengambil perkataan saya untuk hal ini, cari di Github atau Package Control, coba beberapa pengaturan baru dan lihat apakah hal tersebut bekerja untuk anda. Dan seringlah mengunjungi kembali setiap pengaturan anda dan lihat apakah ada hal baru yang dapat meningkatkan pengalaman menulis kode anda.

Pengaturan, font, plugin, theme, atau skema warna apa yang membuat pengalaman menulis kode anda menjadi lebih baik? Beritahu kita di komentar, dan bagikan dengan seseorang yang menurut anda membutuhkannya.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.