Days
Hours
Minutes
Seconds

Promo Grand Opening

15% OFF

Khusus Pelanggan Baru

Tutorial Sublime Text #4: Mengoptimalkan Ruang Kerja dengan Multi-Layout

 

Dalam proyek pengembangan web atau perangkat lunak, kita sering kali perlu membuka dan mengedit beberapa file sekaligus. Misalnya, Anda mungkin perlu mengedit file HTML, CSS, dan JavaScript secara bersamaan. Sublime Text menyediakan fitur multi-layout yang sangat powerful untuk mengatur tampilan editor Anda agar bisa melihat dan mengedit beberapa file sekaligus tanpa harus bolak-balik antar tab.


 

Apa Itu Multi-Layout?

 

Multi-layout adalah fitur yang memungkinkan Anda membagi jendela editor menjadi beberapa panel. Setiap panel dapat menampilkan file yang berbeda, memberikan Anda gambaran yang lebih baik tentang keseluruhan proyek. Ini sangat berguna untuk:

  • Front-end development: Mengubah HTML dan melihat pengaruhnya pada CSS atau JavaScript secara langsung.
  • Debuging: Membandingkan dua versi kode atau melihat file log sambil mengedit kode sumber.
  • Refactoring: Memindahkan kode dari satu file ke file lain dengan lebih mudah.

 

Mengubah Tampilan Layout

 

Ada beberapa cara untuk mengubah tata letak editor di Sublime Text. Cara termudah adalah melalui menu utama.

  1. Buka menu View di bagian atas.
  2. Pilih Layout.

Anda akan melihat beberapa opsi tata letak yang sudah tersedia, seperti:

  • Single: Tampilan standar dengan satu panel.
  • Columns: 2: Membagi layar menjadi dua kolom vertikal.
  • Columns: 3: Membagi layar menjadi tiga kolom vertikal.
  • Rows: 2: Membagi layar menjadi dua baris horizontal.
  • Grid: Membagi layar menjadi panel-panel dalam bentuk grid.

Cobalah beberapa opsi untuk menemukan tata letak yang paling sesuai dengan alur kerja Anda.


 

Menggunakan Keyboard Shortcuts untuk Tata Letak

 

Jika Anda ingin bekerja lebih cepat, gunakan keyboard shortcut. Sublime Text menyediakan kombinasi tombol yang sangat mudah diingat.

  • Alt+Shift+1: Mengatur tata letak menjadi Single Column.
  • Alt+Shift+2: Mengatur tata letak menjadi 2 Columns.
  • Alt+Shift+3: Mengatur tata letak menjadi 3 Columns.
  • Alt+Shift+4: Mengatur tata letak menjadi 4 Columns.

Untuk membagi layar secara horizontal, Anda bisa menggunakan Alt+Shift+8 untuk 2 baris atau Alt+Shift+9 untuk 3 baris.


 

Memindahkan File ke Panel Lain

 

Setelah Anda membagi layar menjadi beberapa panel, langkah selanjutnya adalah memindahkan file dari satu panel ke panel lain.

  1. Klik pada tab file yang ingin Anda pindahkan.
  2. Tahan dan tarik tab tersebut ke panel lain yang Anda inginkan.

Cara lain yang lebih cepat adalah dengan menggunakan keyboard shortcut:

  • Ctrl+K, Ctrl+Alt+2: Memindahkan file saat ini ke panel kedua.
  • Ctrl+K, Ctrl+Alt+3: Memindahkan file saat ini ke panel ketiga.

Sublime Text akan otomatis membuat panel baru jika Anda memindahkan file ke area yang belum ada panelnya.


 

Mempercepat Alur Kerja dengan Split Editing

 

Memanfaatkan multi-layout secara efektif dapat menghemat waktu Anda. Sebagai contoh, bayangkan Anda sedang mengerjakan file JavaScript dan CSS.

  1. Bagi layar menjadi dua kolom (Alt+Shift+2).
  2. Buka file JavaScript di panel kiri.
  3. Buka file CSS di panel kanan.
  4. Sekarang, Anda bisa langsung melihat dan mengedit kedua file tersebut secara berdampingan.

Dengan fitur ini, Anda tidak perlu lagi beralih antar tab secara manual.


 

Kesimpulan

 

Menguasai fitur multi-layout adalah langkah penting untuk meningkatkan efisiensi dan produktivitas Anda saat menggunakan Sublime Text. Ini memungkinkan Anda untuk melihat gambaran yang lebih besar dari proyek Anda dan membuat proses coding menjadi lebih lancar.

Pada tutorial selanjutnya, kita akan membahas salah satu fitur paling penting di Sublime Text, yaitu Package Control dan bagaimana menginstal plugin-plugin hebat untuk semakin memperkaya fungsionalitasnya.

Wawasan Terbaru

Gemini_Generated_Image_wfw5uwwfw5uwwfw5
Mengenal Dunia Grafis: Dari Piksel Hingga Vektor, Kekuatan Visual di Era Digital
Gemini_Generated_Image_b6dimfb6dimfb6di
Mengenal Foundation: Kerangka Kerja Front-End Profesional untuk Web Responsif
Gemini_Generated_Image_sx3ztpsx3ztpsx3z
CSS
Mempercantik Website dengan CSS: Seniman di Balik Tampilan Web 🎨
Gemini_Generated_Image_e013qke013qke013
Mengenal HTML: Fondasi dari Setiap Halaman Website 🌐
Gemini_Generated_Image_ldki4nldki4nldki
Menyelami Dunia Coding: Seni Berbicara dengan Komputer
Gemini_Generated_Image_dpvliydpvliydpvl
Menguasai GIT: Fondasi Penting dalam Dunia Pengembangan Perangkat Lunak
Gemini_Generated_Image_sqcib9sqcib9sqci
Tutorial Python #12: Mengenal Jenis-jenis Operator dalam Python
Gemini_Generated_Image_o1bw3do1bw3do1bw
Memahami Tipe Data Dictionary dalam Python
Gemini_Generated_Image_ko4ixfko4ixfko4i
Mengenal Tipe Data Set dalam Python
Gemini_Generated_Image_1xop7m1xop7m1xop
Tuple dalam Python: Pengenalan dan Tutorial

Wawasan Serupa

Gemini_Generated_Image_2wj4fi2wj4fi2wj4
Gemini_Generated_Image_qhxj1yqhxj1yqhxj

Ceritakan Detail Proyekmu

Mulai dari 30K aja, solusi IT kamu langsung jalan tanpa drama.

Kata Mereka Tentang Solusi Coding

Dipercaya oleh lebih dari 200++ client untuk menyelesaikan proyeknya dengan total 250++ proyek dari berbagai jenis proyek