Visual Studio Code, Microsoft tarafından sağlanan popüler açık kaynaklı kod düzenleyicilerinden biridir. Birçok developer, işlevsellik, üretkenlik, hata ayıklama ve hız gibi konularda çok sayıda eklenti sunduğu için Visual Studio Code'u tercih eder. Bu eklentiler, developer’ların daha iyi kod yazmasına yardımcı olur. Bu yazımızda, 2023'te kullanmanız gereken en iyi Visual Studio Code eklentilerini ele alacağız 👇.
Visual Studio Code Eklentileri Nedir?
Visual Studio Code, sürüm kontrolü, hata ayıklama ve görev çalıştırma gibi yazılım ve uygulama geliştirme süreçlerini destekleyen bir kaynak kodu düzenleyicisidir. Visual Studio Code, çoğu programlama dili için kod oluşturma ve hata ayıklama gibi hizmetler sunar. Ancak, bu süreçte Visual Studio Code’dan daha iyi verim alabilmek için eklentiler de kullanılır. Eklentiler, yeni işlevlere erişebilmeyi sağlar. Bu eklentiler, üretkenliği artırır ve kodlamayı daha kolay ve kusursuz hale getirir.
Visual Studio Code Eklentileri Ne İşe Yarar?
Visual Studio Code, kod editörleri arasında popüler bir seçenektir ve bunun birçok sebebi vardır. Bu kod editörünün en büyük avantajlarından biri, eklentilerinin olmasıdır.
Visual Studio Code eklentileri, programlama dilleri, stil ve tema, kod yönetimi ve düzenleme, geliştirme araçları ve daha birçok alanda ekstra özellikler sunarlar. Eklentiler, kod yazarken işleri kolaylaştırır ve daha verimli hale getirir.
Eklentiler, kişiselleştirilebilirlik seçenekleri sunarak, kullanıcının isteklerine göre ayarlanabilir ve kullanımı daha da keyifli hale getirebilir. Kod tamamlama uzantılarını kullanarak kodlama sırasında gereksiz hatalardan kaçınılabilinir. Dolayısıyla, doğru Visual Studio Code eklentilerini kullanmak, daha iyi bir kod yazma deneyimi sağlar.
Visual Studio Code Eklentileri Nasıl Yüklenir?
Visual Studio Code eklentileri, kullanıcıların ihtiyaçlarına göre kolayca yüklenebilir. Visual Studio Code eklentilerini yüklemek için şu adımları takip edebilirsiniz:
- Visual Studio Code'u açın.
- En soldaki “Etkinlik Çubuğunu” bulun. Menüden "Extensions (Eklentiler)” sekmesine tıklayın.
- Visual Studio Code Marketplace'te bulunan en popüler eklentilerin bir listesini göreceksiniz. Buradan istediğiniz eklentiyi seçin. Ya da arama çubuğuna istediğiniz eklentinin adını veya özelliğini yazın.
- Eklentiye tıkladıktan sonra "Install (Yükle)” butonuna tıklayın.
- Yükleme tamamlandıktan sonra, "Reload (Yeniden Yükle)” butonuna tıklayarak Visual Studio Code'u yeniden başlatın.
Ayrıca, "Installed" (Yüklü) sekmesinde yüklü eklentilerinizi görebilir, "Update" (Güncelle) butonuna tıklayarak güncelleme yapabilir veya "Uninstall" (Kaldır) butonuna tıklayarak eklentileri kaldırabilirsiniz.
En İyi 10 Visual Studio Code Eklentisi
Settings Sync
Settings Sync, GitHub aracılığıyla her şeyi kaydedebilen bir eklentidir. Ayarlardan klavye kısayollarına ve diğer Visual Studio Code uzantılarına kadar Visual Studio Code'da özelleştirdiğiniz hemen hemen her şeyi Github ile senkronize etmeye olanak tanır. Bu hizmetleri kolaylaştırmak için GitHub Gists'i kullanır. Github'u Settings Sync ile yapılandırma hakkında daha fazla ayrıntıyı kendi belgelerinde bulabilirsiniz.
📍 Özellikleri
- Settings Sync eklentisi, developer’ların bir proje üzerinde çalışırken parçacıkları, ayarları, temaları, anahtar bağlamaları ve dosya simgelerini çeşitli makinelerde eşitlemesine olanak tanır.
- Kolay bir şekilde indirilebilir.
- Yapılandırmalar hakkında bilgilerin yer aldığı bir özet sayfası bulundurur.
- Ayarları değiştirmek için bir GUI bulundurur.
- GitHub Enterprise için destek sunar.
- Settings Sync eklentisi, kullanıcılara birçok farklı senkronizasyon seçeneği sunar.
- Özelleştirilebilir.
Live Server
Live Server eklentisi, Visual Studio Code kullanıcılarına web geliştirme işlemlerini daha kolay ve hızlı hale getirmek için tasarlanmış bir eklentidir. Bu eklenti, geliştirme aşamasında kod değişikliklerinin anlık olarak görüntülenmesini sağlayarak, geliştiricilere gerçek zamanlı web sayfası önizlemesi sunar.
Kod her kaydedildiğinde, tarayıcıya yansıyan değişiklikler anında görülür. Böylece, hatalar çok daha hızlı bir şekilde tespit edilebilir. Live Server uzantısının 2,4 milyondan fazla indirmesi var.
📍 Özellikleri
- Live Server eklentisi, Visual Studio Code içinde kurulumu çok kolay olan bir eklentidir.
- Sunucuyu başlatmak ve durdurmak kolaydır.
- Kısayol desteği sunar.
- Gezgin menüsü, tarayıcıyı başlatmaya ve HTML dosyalarını açmaya olanak tanır.
- Eklenti, farklı dillerde web sayfası oluşturmaya olanak tanır.
- Tarayıcı desteği sunar.
- CORS varsayılan olarak etkindir.
- Live Server eklentisi, geliştiricilerin web sayfalarını HTTPS protokolü ile de çalıştırmalarına olanak tanır.
Remote - SSH
Remote - SSH eklentisi, bir SSH sunucusuna sahip herhangi bir uzak makineyi kullanmayı sağlar. Bu eklenti, çeşitli senaryolarda geliştirmeyi ve/veya sorun gidermeyi çok daha kolay hale getirir. Remote – SSH eklentisinin, 12 milyondan fazla indirmesi bulunur.
📍 Özellikleri
- Windows, macOS, Ubuntu, Debian ve CentOS dahil olmak üzere farklı işletim sistemlerini destekler.
- Kaynak kodunun yerel makinede olmasını gerektirmez.
- Yerel bilgisayarı yavaşlatmadan farklı geliştirme ortamları arasında geçiş yapmayı sağlar.
- Uzak bir bilgisayarla bağlantı kurmayı kolaylaştırır.
- SSH anahtarları kullanarak güvenlik önlemleri alır.
Prettier
Prettier, kod yazarken kullanılan bir yazılım aracıdır ve özellikle JavaScript, TypeScript, CSS ve HTML dosyalarında kullanılan kodlar için düzenleme işlemini kolaylaştırır. Prettier, kod yazarken ortak kullanılan stilleri ve düzenlemeleri otomatik olarak yapar ve kodun daha okunaklı hale gelmesini sağlar.
Prettier, şu anda en popüler Visual Studio Code uzantılarından biridir. Şimdiye kadar 23 milyondan fazla developer Visual Studio Code Prettier eklentisini indirdi.
📍 Özellikleri
- Prettier, JavaScript, TypeScript, CSS ve HTML gibi birçok programlama dili ile uyumludur.
- Klavye kısayollarıyla kod biçimlendirmeyi sağlar.
- Otomatik biçimlendirme sağlar. Böylece komut dosyaları kolayca okunabilir.
- Kurulumu kolaydır.
- Prettier, projelerde tutarlılık sağlar. Bu sayede, kodda yapılan değişikliklerin tüm projeye yansıması kolaylaşır.
- Hata tespit etme özelliği sunar.
GitHub Copilot
GitHub Copilot, programlamaya yardımcı olan bir yapay zeka aracıdır. Bu araç, OpenAI tarafından geliştirilmiştir ve birçok programlama dili için destek sunar. GitHub Copilot, kod önerileri verir, kodu otomatik tamamlar ve kod yazılmasına yardımcı olur. Copilot, gerçek zamanlı olarak kod ve işlevler önerir.
📍 Özellikleri
- GitHub Copilot, kullanıcılara kodlama sırasında kod önerileri ve kod tamamlama önerileri sunar.
- GitHub Copilot, doğal dil desteği sunar.
- GitHub Copilot, birçok programlama dilini destekler.
- GitHub Copilot, kodlama sürecinde kullanıcılara örnekler sunar. Bu örnekler, kullanıcılara karmaşık kodlar yazmak yerine örnekleri kullanarak hızlı bir şekilde kodlama yapmalarına olanak tanır.
- Düzenli olarak güncellenir ve yeni özellikler eklenir.
Auto Rename Tag
Auto Rename Tag, Visual Studio Code kullanıcıları için bir eklentidir ve HTML, XML ve Markdown dosyalarında etkili bir şekilde çalışır. Visual Studio Code doğası gereği bir açılış etiketi yazdığınızda hemen kapanış etiketleri eklerken, Auto Rename Tag değiştirilen etiketleri otomatik olarak yeniden adlandırır.
Auto Rename Tag eklentisi, HTML, XML, PHP ve JavaScript için çalışır. Etiket adlarını iki kez değiştirme ihtiyacını ortadan kaldırır. Bu eklenti, koddaki birçok iç içe geçmiş bileşenle çalışırken kullanışlıdır. Açılış ve kapanış etiketlerini değiştirmek yerine, etiketleme ihtiyaçlarını etkili bir şekilde yönetmek için Auto Rename Tag eklentisini kullanabilirsiniz.
📍 Özellikleri
- Geliştirmeye harcanan çabayı ve zamanı önemli ölçüde azaltmaya yardımcı olur.
- Çok sayıda açılış ve kapanış etiketinin söz konusu olduğu projeler için uygundur.
- Visual Studio IDE ile aynı işlevselliği gerçekleştirir.
GitLens
GitLens, Visual Studio Code'un Git yeteneklerini güçlendiren bir eklentidir. Bu eklenti, kodda yapılan değişikliklerin tam olarak kim tarafından, ne zaman ve neden yapıldığını takip etmeyi sağlar. Bu özellik, kodda yapılan hataları tespit etmeyi ve düzeltmeyi kolaylaştırır. GitLens, son derece özelleştirilebilir bir eklentidir. GitLens ile kod kolayca görselleştirebilir. GitLens 16 milyondan fazla indirmeye sahiptir.
📍 Özellikleri
- GitLens, bir dosyanın geçmişinde kolay gezinmeyi sağlar.
- Her satırın sonunda en son değişikliği kimin yaptığını gösterir.
- GitHub, GitLab, Gitea, Gerrit, GoogleSource, Bitbucket ve Azure DevOps ile kolayca entegre olabilir.
- Özelleştirilebilir bir eklentidir.
Git History
GitLens'e benzer şekilde Git History, git geçmişinin görselini veren bir Visual Studio Code eklentisidir. Git History eklentisi, Visual Studio Code editöründe kullanıcıların projelerindeki git geçmişini ve detaylarını görüntüleyebilmelerini sağlar. Bu eklenti, kullanıcılara projelerindeki değişiklikleri takip etmelerinde ve bu değişikliklerin neden yapıldığını anlamalarında yardımcı olur.
CSS Peak
CSS Peak, web geliştiricilerinin CSS dosyalarında hızlıca gezinmelerine ve arama yapmalarına olanak tanıyan bir tarayıcı eklentisidir. Bu eklenti, HTML ve ejs dosyalarındaki CSS/SCSS/LESS kodunu gösterecek şekilde genişletmeye olanak tanır. Ayrıca, sınıf veya kimlik adını biliyorsanız, doğru CSS koduna hızlı bir şekilde ulaşmanıza da olanak tanır. Herhangi bir satıra yorum yapma esnekliği de sağlar.
JavaScript Code Snippets
Visual Studio Code, JS IntelliSense içerir. JavaScript Code Snippets ise bir dizi sınıf yardımcıları ve yöntem tetikleyicileri ekleyerek bu deneyimi geliştirir. Bu eklenti, JS, TypeScript, JS React, TS React, HTML ve Vue gibi teknolojileri destekler. Bir nesne koleksiyonunda belirli bir nesneyi bulmayı basitleştirir. Uzun vadede genel geliştirici deneyimini iyileştirmek için JavaScript Code Snippets kullanılabilinir.