Visual Studio Code
VS Code, genişletilebilirliği ve desteklediği birçok dil sayesinde popüler bir kod editörüdür. Aşağıda, VS Code ile çalışmaya başlarken bilmeniz gereken temel bilgiler ve ipuçları yer almaktadır.
Visual Studio Code (VS Code) Başlangıç Rehberi
VS Code Nedir?
VS Code, Microsoft tarafından geliştirilen, ücretsiz, açık kaynaklı bir kod editörüdür. Web geliştirme, Python, C++, Java gibi birçok programlama dilini destekler ve geniş bir eklenti yelpazesi sunar.
Temel Özellikler
- Syntax Highlighting: Kodunuzu daha okunabilir hale getiren renk kodlaması.
- Code Completion: IntelliSense özelliği ile kod tamamlama ve parametre bilgisi sağlar.
- Debugging: Hata ayıklama desteği ile uygulamanızı doğrudan VS Code’da test edebilirsiniz.
- Version Control: Git entegrasyonu sayesinde, kod değişikliklerinizi takip edebilir ve yönetebilirsiniz.
- Extensions: Farklı programlama dilleri, framework’ler ve araçlar için binlerce eklentiye erişim.
Kurulum ve İlk Adımlar
-
VS Code’u İndirin ve Kurun:
- VS Code resmi web sitesi üzerinden işletim sisteminize uygun sürümü indirin ve kurulum talimatlarını takip edin.
-
Kullanıcı Arayüzü ile Tanışın:
- Explorer: Dosyalarınıza ve klasörlerinize erişim sağlar.
- Search: Projenizdeki dosyalarda arama yapmanıza olanak tanır.
- Source Control: Git reposuyla çalışmanızı sağlar.
- Debug: Uygulamanızı hata ayıklama seçenekleri sunar.
- Extensions: Eklentileri aramanızı, görüntülemenizi ve yönetmenizi sağlar.
-
Bir Proje Açın veya Oluşturun:
- VS Code’u açın ve “File > Open Folder” seçeneğini kullanarak mevcut bir projeyi açın veya yeni bir klasör oluşturun.
Temel Kullanım ve İpuçları
-
Eklenti Yükleme:
- Sol taraftaki eklentiler simgesine tıklayarak veya
Ctrl+P
(Cmd+P on macOS) kısayolunu kullanarak eklenti pazarına ulaşın ve ihtiyacınız olan eklentiyi arayıp yükleyin.
- Sol taraftaki eklentiler simgesine tıklayarak veya
-
Kısayollar:
Ctrl+P
: Hızlı dosya açma.Ctrl+Shift+P
: Komut paletini açar, buradan VS Code’un tüm fonksiyonlarına erişebilirsiniz.Ctrl+
/-
: Kodunuzu yakınlaştırın veya uzaklaştırın.Ctrl+Shift+F
: Tüm dosyalarda arama yapın.
-
Tema ve Görünüm Ayarları:
Ctrl+K Ctrl+T
kısayolları ile tema seçim menüsünü açabilir ve editörünüzün görünümünü kişiselleştirebilirsiniz.
-
Entegre Terminal:
- `Ctrl+“ kısayolu ile VS Code içerisinde terminali açabilir, komutları buradan çalıştırabilirsiniz.
İleri Seviye İpuçları
-
Çoklu Seçim ve Düzenleme:
Ctrl+D
kısayolu ile benzer metinleri seçerek, aynı anda çoklu düzenleme yapabilirsiniz.
-
Kod Parçacıkları (Snippets):
- Sık kullanılan kod bloklarını kolayca eklemek için kod parçacıklıklarından yararlanabilirsiniz. Özel snippet’lar oluşturabilir veya eklentiler aracılığıyla hazır snippet’lara erişebilirsiniz.
-
Dosya ve Klasör İşlemleri:
- Explorer bölümünde dosya ve klasörleri sağ tıklayarak çeşitli işlemler (yeniden adlandırma, silme, yeni dosya/klasör oluşturma) gerçekleştirebilirsiniz.
-
Git Entegrasyonu ve Kullanımı:
- Source Control bölümünden Git işlemlerinizi (commit, push, pull, branch oluşturma ve değiştirme) doğrudan VS Code içinden yönetebilirsiniz.
-
Debugging:
- Hata ayıklama için, debug panelini kullanarak breakpoint’ler ekleyebilir, kodunuzun adım adım çalıştırılmasını izleyebilir ve değişken değerlerini kontrol edebilirsiniz.
-
Eklenti Önerileri:
- Prettier: Kodunuzu otomatik olarak formatlar.
- ESLint: JavaScript kodunuzu analiz eder ve hataları veya stil sorunlarını belirtir.
- Live Server: HTML/CSS/JavaScript projeleri için yerel bir geliştirme sunucusu başlatır.
- Python: Python geliştirme için gerekli araçları ve özellikleri sağlar.
-
Ayarlar ve Kişiselleştirme:
- VS Code’un ayarlar menüsü (
File > Preferences > Settings
), editörünüzü tam olarak istediğiniz gibi yapılandırmanıza olanak tanır. Font büyüklüğünden tema rengine, klavye kısayollarından özellik ayarlarına kadar pek çok detayı kişiselleştirebilirsiniz.
- VS Code’un ayarlar menüsü (
Eklenti Önerileri
VS Code extensions web sitesi üzerinden tüm eklentileri inceleyebilir ve kurabilirsiniz.
Benim kullandığım ve önerebileceğim bazı temel eklentiler:
- Auto Rename Tag: Eşleştirilmiş HTML/XML etiketini otomatik olarak yeniden adlandırın. Link
- Git Graph: Deponuzun Git Grafiği’ni görüntüleyin ve Git eylemlerini grafikten kolayca gerçekleştirin. İstediğiniz gibi görünecek şekilde yapılandırılabilir! Link
- HTML CSS Support: Visual Studio Code için HTML kimliği ve sınıf özniteliğinin tamamlanması. Link
- Live Preview: Web projelerinizi önizlemeniz için yerel bir sunucuyu barındıran bir uzantı! Link
- Live Server: Statik ve dinamik sayfalar için canlı yeniden yükleme özelliğine sahip yerel bir geliştirme sunucusu başlatın. Link
- Tailwind CSS IntelliSense: Tailwind CSS IntelliSense, Visual Studio Code kullanıcılarına otomatik tamamlama, sözdizimi vurgulama ve satır ekleme gibi gelişmiş özellikler sağlayarak Tailwind geliştirme deneyimini geliştirir. Link
Elbette, işte VS Code için temel kısayolların kısa açıklamalarıyla birlikte bir Markdown tablosu:
VS Code Temel Kısayolları
Bu tablo, VS Code kullanırken sıkça ihtiyaç duyacağınız temel kısayolları içermektedir. Daha verimli bir çalışma ortamı için bu kısayolları öğrenmek ve alışkanlık haline getirmek önemlidir. Kısayollar, zaman kazandırmanın yanı sıra, kod yazım sürecinizi daha akıcı hale getirebilir.
Kısayol | Açıklama |
---|---|
Ctrl + P | Hızlı dosya açma penceresini açar. |
Ctrl + Shift + P | Komut paletini açar. |
Ctrl + \ | Yeni bir editör bölmesi açar. |
Ctrl + B | Kenar çubuğunu gösterir/gizler. |
Ctrl + / | Satırı yorumlar/yorumu kaldırır. |
Ctrl + Shift + K | Seçili satırı siler. |
Ctrl + ] / Ctrl + [ | Satırı girintiler/girintiyi azaltır. |
Ctrl + F | Dosya içinde arama yapar. |
Ctrl + H | Dosya içinde değiştirme yapar. |
Ctrl + Shift + F | Tüm dosyalarda arama yapar. |
Ctrl + Shift + H | Tüm dosyalarda değiştirme yapar. |
Alt + Up / Alt + Down | Seçili satırı veya satırları yukarı/aşağı taşır. |
Ctrl + Space | Otomatik tamamlamayı tetikler. |
F12 | Tanıma git. |
Alt + F12 | Tanımı önizler. |
Ctrl + G | Belirli bir satıra git. |
Ctrl + Shift + \ | Eşleşen paranteze git. |
Ctrl + K Ctrl + C | Açık dosyanın yolunu kopyalar. |
Ctrl + Shift + V | Markdown önizlemesini açar. |
Ctrl + Shift + N | Yeni pencere açar. |
Ctrl + Shift + W | Mevcut pencereyi kapatır. |
Ctrl + , | Ayarlar sayfasını açar. |
Ctrl + Shift + O | Dosya içinde sembollere git. |