Penjelasan lebih detail dan jelas tentang Shortcut Keyboard di VSCode yang Mempercepat Workflow, disusun berdasarkan kategori dan disertai contoh nyata agar lebih mudah dipahami dan langsung bisa dipraktikkan.
1. Navigasi File & Tab — Buka & Pindah File dengan Cepat
Ctrl + P (Windows/Linux) / Cmd + P (Mac)
Fungsi: Mencari dan membuka file dengan cepat tanpa harus klik manual di sidebar.
Contoh:
Kamu ingin membuka file Navbar.jsx, cukup tekan Ctrl + P, ketik navbar, tekan Enter, file langsung terbuka.
Ctrl + Tab dan Ctrl + Shift + Tab
Fungsi: Berpindah antar tab file yang sedang dibuka, maju atau mundur seperti di browser.
Tips:
Saat kamu membuka banyak file, ini sangat berguna untuk bolak-balik file tanpa mouse.
2. Multi-Cursor & Edit Banyak Baris — Edit Banyak Tempat Sekaligus
Alt + Click (Windows) / Option + Click (Mac)
Fungsi: Tambah kursor di beberapa baris atau tempat untuk mengetik secara bersamaan.
Contoh:
Edit nama variabel title jadi heading di beberapa tempat sekaligus tanpa scroll-scroll.
Ctrl + D
Fungsi: Pilih kata yang sama berikutnya. Bisa digunakan untuk rename cepat banyak kata.
Contoh:
Ketik kursor di kata status, tekan Ctrl + D beberapa kali untuk memilih semua status, lalu ketik misalnya state.
Ctrl + Shift + L
Fungsi: Pilih semua kata yang sama di seluruh file.
Tips: Gunakan ini jika ingin mengubah semua instance nama fungsi, class, atau variabel secara langsung.
3. Cut, Copy, Pindah Baris — Manipulasi Baris Lebih Cepat
Alt + ↑ / ↓
Fungsi: Pindahkan baris kode ke atas atau ke bawah.
Contoh:
Kamu ingin memindahkan console.log() dari baris 10 ke baris 8? Cukup Alt + ↑ dua kali.
Shift + Alt + ↑ / ↓
Fungsi: Menyalin baris kode ke atas atau bawah (duplikat cepat).
Contoh:
Ingin menduplikasi sebuah baris function call tanpa copy-paste manual? Gunakan shortcut ini.
Ctrl + X pada baris kosong
Fungsi: Menghapus 1 baris langsung tanpa perlu blok atau highlight.
Tips:
Cepat untuk bersih-bersih kode.
4. Cari dan Ganti — Search Cepat dan Replace Massal
Ctrl + F
Fungsi: Cari teks dalam file aktif.
Contoh:
Cari kata return dalam file App.js.
Ctrl + H
Fungsi: Cari dan ganti kata dalam file aktif.
Contoh:
Ganti semua var menjadi let dalam satu file.
Ctrl + Shift + F
Fungsi: Cari teks dalam seluruh folder/project.
Ctrl + Shift + H
Fungsi: Cari dan ganti kata dalam semua file proyek. Hati-hati, karena bisa mengganti banyak hal sekaligus.
5. Panel & Terminal — Akses Terminal & Panel Tanpa Klik
Ctrl + (tombol backtick/di atas Tab)
Fungsi: Membuka atau menyembunyikan terminal.
Contoh:
Menjalankan npm run dev tanpa harus membuka terminal lewat menu.
Ctrl + B
Fungsi: Menyembunyikan/memunculkan sidebar explorer.
Ctrl + J
Fungsi: Membuka atau menyembunyikan panel bawah (output, terminal, debug console).
6. Coding Lebih Pintar — Optimalkan Editor untuk Tulis Kode
Ctrl + Space
Fungsi: Menampilkan auto-complete manual (IntelliSense).
Shift + Alt + F
Fungsi: Format kode secara otomatis sesuai konfigurasi Prettier/Formatter.
F12
Fungsi: Langsung lompat ke definisi variabel/fungsi/class.
Tips: Ini sangat membantu saat membaca kode orang lain atau proyek besar.
Ctrl + K, Ctrl + C → Comment
Ctrl + K, Ctrl + U → Uncomment
Fungsi: Menandai komentar atau menghapus komentar dari baris kode.
7. Command Palette — Pusat Semua Perintah VSCode
Ctrl + Shift + P
Fungsi: Membuka Command Palette. Kamu bisa mencari semua perintah VSCode di sini.
Contoh:
Ketik Git Commit, Reload Window, atau Preferences: Open Settings.
8. Navigasi Struktur Kode — Melihat Outline Kode
Ctrl + Shift + O
Fungsi: Membuka daftar fungsi, variabel, class dalam file (outline navigator).
9. Shortcut untuk Refactoring
F2
Fungsi: Rename simbol/variabel/fungsi dengan aman (termasuk semua referensinya).
Contoh:
Ingin ganti nama getData() ke fetchData()? Tekan F2 saat kursor di nama fungsinya.
10. Shortcut Editor Tambahan
| Shortcut | Fungsi |
|---|---|
Ctrl + / | Comment/uncomment cepat satu baris |
Ctrl + Shift + [ atau ] | Lipat/buka blok kode |
Ctrl + Enter | Tambah baris baru di bawah |
Ctrl + Shift + Enter | Tambah baris baru di atas |
Penutup: Tips Menguasai Shortcut
- Jangan hafalkan semua langsung. Fokus pada 5–10 shortcut yang paling sering kamu gunakan.
- Tempel cheat-sheet di layar atau meja.
- Latihan rutin. Makin sering dipakai, makin hafal otomatis.
- Sesuaikan sendiri shortcut kamu lewat:
File > Preferences > Keyboard Shortcuts(Ctrl + K Ctrl + S)