0'dan Uygulamalı Tüm Platformlar Web Tasarım 3 Visual Studio Code'u Tanıma - Murat Bilginer
0'dan Uygulamalı Tüm Platformlar Web Tasarım 2 Visual Studio Code...
0’dan Uygulamalı Tüm Platformlar Web Tasarım 3 Visual Studio Code’u...
0'dan Uygulamalı Tüm Platformlar Web Tasarım 3 Visual Studio Code'u Tanıma
Bir önceki yazıya aşağıdan ulaşabilirsiniz.
Programı çalıştırdığımızda bizi aşağıdaki gibi bir ekran karşılayacaktır.
İlk olarak çalışma alanına ve menülere bakalım.
SideBar Icons Ve İşlevleri
Icon hemen yan tarafında açık olan Gezgin kısmını açıp kapatmak için kullanılır.
Icon ise VS Code ekranında herhangi bir şeyi aramak için kullanılır. Özellikle çalışma yapılan dosyalar içinde aramak istediğimiz bir kelime karakter var ise buraya yazıp aratabilirsiniz. Ayrıca kelimeleri değiştirmek içinde Değiştir alanı kullanılabilir. Örneğin X1 diye kodlanmış alanlarınız var ve bu tanımlama 100 yerde kullanılmış. Siz bu X1’i daha sonra X2 olarak değiştirmek istiyorsunuz. Bunun için bu alanı kullanmanız yeterli olacaktır. Ara kısmına X1’i yacak değiştir yerine X2’yi daha sonra hemen yanındaki seçeneklerden ya tek tek değiştirebilirsiniz. Kontrollü bir iş yapmak istiyorsanız. Ya da kendinizden eminseniz tamamını değiştir seçeneğini kullanabilirsiniz.
3. Icon Git bağlantınız için. VS Code, Git ile entegre çalışır. Git dosya takiplerinizi otomatik yapar ve yine program üzerinde Commitler oluşturmanıza, eğer uzak depoda tutuyorsanız projenizi depoya yenilikleri push etmenize olanak sağlar.
Ayrıca Git kuruluysa bilgisayarınızda Terminal kısmında Git kodlarını yazarak çalışabilirsiniz.
Aklınıza terminal kısmı nasıl açılır sorusu gelebilir.
4. Icon yazdığınız programlarla alakalı değişken takiplerinizi yapar. Debug bölümüdür. Bu bölümü ilerde daha detaylı kodlama yaparken inceleyeceğiz.
5. Icon ise VS Code’a dışarıdan eklentiler kurmak için kullanabileceğiniz yer. Pek çok geliştirici VS Code için 3. parti ve çok kullanışlı eklentiler geliştirirler. Bunları kullanarak çok daha kolay ve hızlı ayrıca görseli güçlü kodlamalar yapabiliriz. Bize büyük avantajlar sağlar eklentiler.
Örneğin bir sonraki yazımızda ekleyeceğimiz HTML eklentisi sayesinde Html kodlama yaptığımı algılayıp kodlarımı ona göre tamamlayıp sıralama ve düzenini otomatik ayarlayacak ve bizi bir hayli iş yükünden kurtulmuş olacağız.
Şimdi hemen yanındaki Gezgin kısmına göz atalım.
Bir proje üzerinde çalışacağımız zaman öncelikle proje klasörünü Program üzerinde açmamız gerekir. Gezgin kısmı bize bu konuda yardımcı olacaktır.
Proje klasörünü ilk olarak program üzerinden kendimizde oluşturabiliriz. Ya da var olan bir proje dosyasını programa ekleyebiliriz.
VS Code Üzerinde Proje Dosyası Açma
Klasör ekle sekmesine tıklıyoruz.
Hangi proje üzerinde çalışacaksak o klasörü seçiyoruz ve Add diyoruz. Eğer projemize daha yeni sıfırdan başlıyorsak öncelikle Yeni Klasör deyip klasörü oluşturuyoruz görünen konumda. Sonra onu seçip Add diyebiliriz.
Ekledikten sonra burada artık görünür durumda. Bu klasör içinde istersem yeni klasörler oluşturabilir, dosyalar ekleyebilirim. Hepsini yapacağız.
Görünen bölümde üzerine tıklayarak Klasör içeriğini görünür yapabilir tekrar tıklarsak klasörü kapalı hale getirecektir.
VS Code Üzerine Projemize Yeni Klasör ve Dosya Ekleme
Bahsedilen bölümde klasörün üzerine tıklar aşağıya doğru açılmasını sağlarsak artık VS Code bu klasör üzerinde çalıştığımızı varsayacaktır. Ve hemen üst tarafında ekleme butonlarını aktif edecektir.
Icon yeni bir dosya oluşturmak için kullanılır.
Icon Yeni bir klasör oluşturmak için kullanılır.
Icon Yenile Iconudur.
Icon ise açık olan dosyaları kapatır ve toparlar.
Bir tane klasör ekleyelim ve içine de bir tane Deneme.txt diye dosya ekleyelim.
Sol tarafta gezginde tıkladığımız dosya yazmaya hazır bir şekilde sağ tarafta açılacaktır. Artık bir txt doyasına nasıl yazıyorsanız o şekilde yazabilirsiniz.
Dosyalar UnSave olduğu anda yanlarında bir beyaz nokta görünecektir.
Yani bunun anlamı dosyada yeni değişiklikleriniz var ama bunlar kaydetmediniz.
CTRL + S ile dosyayı her zaman anlık kaydedebilirsiniz.
Şimdi yeni bir dosya daha ekleyelim projemize. İsmi Deneme2.txt olsun.
Kodlama yaparken sıklıkla birden fazla dosyayla sekronize ve aynı anda çalışmaya ihtiyaç duyabiliyoruz.
Şimdi oluşturmuş olduğum Deneme.txt ve Deneme2.txt ile aynı anda çalışmak istersem şunu yapmam gerekir.
İlk olarak hangi dosyayı açmak istersem ona tıklar açarım.
Daha sonra 2. dosya üzerine sağ tıklar Yana Aç seçeneği ile hemen yanında açılmasını sağlayabilirim.
Böylelikle ve ya daha fazla dosya ile aynı anda çalışma imkanımız oluştu.
VS Code Tema Değiştirme
VS Code bize pek çok tema seçeneği sunmuştur.
Bunu kendi zevkimize göre düzenleyebiliriz.
Bunun için yapmanız gereken…
Diğer temel özellikleri biraz deneyerek test ederek kendiniz bulabilirsiniz.
Yeri geldikçe kodlama yaparken farklı özellikleri dipnot olarak paylaşmaya devam edeceğim.
Eğitim yazılarının daha fazla kişiye ulaşması için paylaşırsanız sevinirim.
by muratbilginer 17 dakika ago 17 dakika ago
by muratbilginer 35 dakika ago 35 dakika ago