VS Code ile Hızlı Kod Yazma ve En Çok Kullanılan Eklenti Yapılandırması
Visual Studio Code editörünü en verimli şekilde kullanmak için hayat kurtaran kısayolları, Emmet kullanımını ve vazgeçilmez eklenti yapılandırmalarını inceleyin.
Modern Dünyanın Kod Editörü: VS Code
Microsoft tarafından geliştirilen Visual Studio Code (VS Code), hafif yapısı, devasa eklenti havuzu ve açık kaynak esnekliği sayesinde dünya genelindeki yazılımcıların ve web geliştiricilerin bir numaralı tercihi haline gelmiştir. Varsayılan ayarlarla bile güçlü olan bu editör, doğru eklentiler ve klavye kısayollarıyla donatıldığında kod yazma hızınızı (Productivity) katbekat artırabilir. Editörü sadece bir metin belgesi gibi kullanmak yerine onun sunduğu otomasyon gücünü keşfetmek gerekir.
Hayat Kurtaran Klavye Kısayolları
Fareyi klavyeden elinize daha az almak, kod yazma hızını artıran en temel kuraldır. VS Code içinde en çok kullanmanız gereken temel kısayollar şunlardır:
– `Ctrl + Shift + P`: Tüm komut paletini açar (Dosya arama, tema değiştirme vb.).
– `Ctrl + P`: Proje içindeki herhangi bir dosyaya ismini yazarak saniyeler içinde ulaşmanızı sağlar.
– `Alt + Yukarı/Aşağı Ok`: Bulunduğunuz satırı veya seçili kod bloğunu doğrudan yukarı veya aşağı taşır.
– `Shift + Alt + Aşağı Ok`: Bulunduğunuz satırın birebir kopyasını alt satıra kopyalar.
– `Ctrl + D`: İmlecin seçtiği kelimenin aynısını sıradaki eşleşmelerde de seçerek çoklu imleç (Multi-cursor) ile aynı anda yazmanızı sağlar.
Emmet ile Saniyeler İçinde HTML/CSS Yazmak
Web geliştirme yaparken etiketleri tek tek kapatmak büyük zaman kaybıdır. VS Code içinde yerleşik olarak gelen Emmet teknolojisi bunu tarihe gömer. Örneğin boş bir HTML dosyasında sadece ünlem işaretine (`!`) basıp Tab tuşuna tıkladığınızda sistem sizin için tüm standart HTML5 iskeletini (“, “, “) anında üretir. Bir satıra `div.kutu>ul>li*3` yazıp Tab tuşuna bastığınızda ise içinde 3 adet liste elemanı (`
Olmazsa Olmaz VS Code Eklentileri
VS Code\’un sol menüsündeki Extensions (Eklentiler) sekmesinden kurabileceğiniz ve geliştirme kalitenizi doğrudan artıracak en temel eklentiler şunlardır:
1. **Prettier – Code formatter**: Kaydet tuşuna bastığınızda dağınık kodlarınızı otomatik olarak kurallı bir formata sokar.
2. **GitLens**: Projenizdeki her bir satır kodun kim tarafından ve ne zaman yazıldığını doğrudan satır arkasında gösterir.
3. **Live Server**: HTML/CSS projelerinizde yaptığınız değişiklikleri tarayıcıda anlık olarak (sayfayı yenilemenize gerek kalmadan) canlı görmenizi sağlar.
4. **Auto Rename Tag**: HTML etiketlerinden birini değiştirdiğinizde (örneğin `
settings.json ile Editörü Kişiselleştirme
Eklentilerin yanı sıra editörün davranışını kalıcı olarak optimize etmek için ayarlar dosyası (`settings.json`) yapılandırılmalıdır. `Ctrl + Shift + P` ile \’Open User Settings (JSON)\’ seçeneğini açarak şu hayat kurtaran kuralları ekleyebilirsiniz: `\”editor.formatOnSave\”: true` (her kayıtta kodu otomatik düzenler), `\”editor.wordWrap\”: \”on\”` (uzun kod satırlarının ekrandan taşmasını engeller ve alt satıra kaydırır) ve `\”files.autoSave\”: \”afterDelay\”` (dosyaları siz unutsanız bile arka planda otomatik kaydeder).
Başlangıç Kontrol Listesi
- Fare kullanımını azaltmak için temel kısayolları (`Ctrl+P`, `Ctrl+D`) ezberleyin.
- HTML yazarken hız kazanmak için Emmet kısayollarını aktif kullanın.
- Kod düzeni karmaşasını bitirmek için Prettier eklentisini kurup \’Format On Save\’ özelliğini açın.
- Canlı web önizlemesi için Live Server eklentisini projelerinize entegre edin.
Sonuç
Visual Studio Code, doğru kısayollar, Emmet entegrasyonu ve akıllı eklentilerle yapılandırıldığında sadece bir kod editörü olmaktan çıkar, adeta yazma hızınızı artıran akıllı bir asistana dönüşür. SoftPusula görselinde VS Code resmi arayüzü, eklentiler sekmesi veya ayarlar JSON ekranı kullanılmalı; dizüstü bilgisayar, kahve fincanı veya yapay yazılımcı stok fotoğrafları kullanılmamalıdır.
SPGörüşünüz bize yol gösterir.
Tek dokunuşla değerlendirin. Kişisel bilgi toplanmaz.