You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Web-Dev-For-Beginners/translations/tr/8-code-editor/1-using-a-code-editor
Lee Stott 2daab5271b
Update Quiz Link
3 weeks ago
..
README.md Update Quiz Link 3 weeks ago
assignment.md 🌐 Update translations via Co-op Translator 4 weeks ago

README.md

Bir kod editörü kullanma

Bu ders, web tabanlı bir kod editörü olan VSCode.dev kullanmanın temellerini kapsar. Böylece bilgisayarınıza herhangi bir şey yüklemeden kodlarınızı değiştirebilir ve bir projeye katkıda bulunabilirsiniz.

Öğrenme hedefleri

Bu derste şunları öğreneceksiniz:

  • Bir kod projesinde bir kod editörü kullanma
  • Sürüm kontrolü ile değişiklikleri takip etme
  • Geliştirme için editörü özelleştirme

Ön Koşullar

Başlamadan önce GitHub ile bir hesap oluşturmanız gerekecek. GitHub adresine gidin ve henüz bir hesabınız yoksa bir hesap oluşturun.

Giriş

Bir kod editörü, program yazmak ve mevcut kod projeleriyle iş birliği yapmak için temel bir araçtır. Bir editörün temellerini ve özelliklerini nasıl kullanacağınızı anladığınızda, bunları kod yazarken uygulayabilirsiniz.

VSCode.dev ile başlama

VSCode.dev, web üzerinde bir kod editörüdür. Bunu kullanmak için herhangi bir şey yüklemenize gerek yoktur; tıpkı başka bir web sitesini açar gibi kullanabilirsiniz. Editörü kullanmaya başlamak için şu bağlantıyıın: https://vscode.dev. Eğer GitHub hesabınıza giriş yapmadıysanız, giriş yapmanız veya yeni bir hesap oluşturmanız için yönlendirmeleri takip edin.

Yüklendiğinde, aşağıdaki görsele benzer bir ekran görmelisiniz:

Varsayılan VSCode.dev

Soldan sağa doğru üç ana bölüm vardır:

  1. Aktivite çubuğu, büyüteç 🔎, dişli ⚙️ gibi bazı simgeleri içerir.
  2. Varsayılan olarak Gezgin (Explorer) olarak genişletilmiş olan yan çubuk.
  3. Ve son olarak, sağdaki kod alanı.

Her bir simgeye tıklayarak farklı menüleri görüntüleyebilirsiniz. İşiniz bittiğinde, başladığınız yere geri dönmek için Gezgin simgesine tıklayın.

Kod yazmaya veya mevcut kodu değiştirmeye başladığınızda, bu işlemler sağdaki en büyük alanda gerçekleşir. Mevcut kodu görüntülemek için de bu alanı kullanacaksınız.

Bir GitHub deposu açma

İlk olarak, bir GitHub deposu açmanız gerekecek. Bir depoyu açmanın birden fazla yolu vardır. Bu bölümde, değişiklik yapmaya başlamak için bir depoyu açmanın iki farklı yolunu göreceksiniz.

1. Editör ile

Bir uzak depoyu açmak için doğrudan editörü kullanabilirsiniz. VSCode.dev adresine giderseniz, bir "Uzak Depo Aç" (Open Remote Repository) düğmesi göreceksiniz:

Uzak depo aç

Ayrıca komut paletini kullanabilirsiniz. Komut paleti, bir komutun veya bir eylemin parçası olan herhangi bir kelimeyi yazabileceğiniz ve doğru komutu bulabileceğiniz bir giriş kutusudur. Sol üstteki menüyü kullanarak Görünüm (View) seçeneğini seçin ve ardından Komut Paleti (Command Palette) seçeneğini seçin veya şu klavye kısayolunu kullanın: Ctrl-Shift-P (MacOS'ta Command-Shift-P).

Palet Menüsü

Menü açıldığında, uzak depo aç yazın ve ardından ilk seçeneği seçin. Parçası olduğunuz veya daha önce açtığınız birden fazla depo görünecektir. Ayrıca bir GitHub URL'sini tam olarak kullanarak bir depo seçebilirsiniz. Aşağıdaki URL'yi kullanın ve kutuya yapıştırın:

https://github.com/microsoft/Web-Dev-For-Beginners

Başarılı olursa, bu depodaki tüm dosyaları metin editöründe yüklü olarak göreceksiniz.

2. URL kullanarak

Bir depoyu yüklemek için doğrudan bir URL de kullanabilirsiniz. Örneğin, mevcut depo için tam URL https://github.com/microsoft/Web-Dev-For-Beginners şeklindedir, ancak GitHub alan adını VSCode.dev/github ile değiştirerek depoyu doğrudan yükleyebilirsiniz. Ortaya çıkan URL şu şekilde olur: https://vscode.dev/github/microsoft/Web-Dev-For-Beginners.

Dosyaları düzenleme

Depoyu tarayıcıda veya vscode.dev'de açtıktan sonra, bir sonraki adım projeyi güncellemek veya değiştirmek olacaktır.

1. Yeni bir dosya oluşturma

Bir dosyayı mevcut bir klasörün içine veya kök dizine/klasöre oluşturabilirsiniz. Yeni bir dosya oluşturmak için, dosyanın kaydedileceği konumu/dizini açın ve 'Yeni dosya ...' simgesini aktivite çubuğunda (sol) seçin, bir ad verin ve enter tuşuna basın.

Yeni bir dosya oluştur

2. Depodaki bir dosyayı düzenleme ve kaydetme

Vscode.dev, projenizde hızlı güncellemeler yapmak istediğinizde herhangi bir yazılımı yerel olarak yüklemenize gerek kalmadan kullanışlıdır. Kodunuzu güncellemek için, aktivite çubuğunda bulunan 'Gezgin' simgesine tıklayın ve depodaki dosya ve klasörleri görüntüleyin. Bir dosyayı seçin, kod alanında açın, değişikliklerinizi yapın ve kaydedin.

Bir dosyayı düzenle

Projenizi güncellemeyi tamamladıktan sonra, depodaki yaptığınız tüm yeni değişiklikleri içeren sürüm kontrolü simgesini seçin.

Projenizde yaptığınız değişiklikleri görüntülemek için, genişletilmiş aktivite çubuğundaki Değişiklikler klasöründeki dosyaları seçin. Bu, dosyada yaptığınız değişiklikleri görsel olarak görebileceğiniz bir 'Çalışma Ağacı' (Working Tree) açacaktır. Kırmızı, projeden bir çıkarımı, yeşil ise bir eklemeyi ifade eder.

Değişiklikleri görüntüle

Yaptığınız değişikliklerden memnunsanız, Değişiklikler klasörünün üzerine gelin ve değişiklikleri hazırlamak için + düğmesine tıklayın. Hazırlama, değişikliklerinizi GitHub'a göndermeye hazırlamak anlamına gelir.

Ancak, bazı değişikliklerden memnun değilseniz ve bunları iptal etmek istiyorsanız, Değişiklikler klasörünün üzerine gelin ve geri al simgesini seçin.

Ardından, bir commit mesajı yazın (Projeye yaptığınız değişikliğin açıklaması), değişiklikleri göndermek ve kaydetmek için onay simgesine tıklayın.

Projenizde çalışmayı tamamladıktan sonra, sol üstteki hamburger menü simgesini seçerek github.com'daki depoya geri dönün.

Değişiklikleri hazırla ve gönder

Uzantıları kullanma

VSCode'da uzantılar yüklemek, editörünüze yeni özellikler eklemenizi ve geliştirme ortamı seçeneklerini özelleştirmenizi sağlar. Bu uzantılar, geliştirme iş akışınızı iyileştirmek için birden fazla programlama dili desteği eklemenize de yardımcı olur ve genellikle genel uzantılar veya dil tabanlı uzantılar olarak sınıflandırılır.

Mevcut tüm uzantıların listesini görüntülemek için, aktivite çubuğundaki Uzantılar simgesine tıklayın ve 'Marketplace'te Uzantıları Ara' etiketli metin alanına uzantının adını yazmaya başlayın.

Bir uzantının adı, yayıncının adı, bir cümlelik açıklaması, indirme sayısı ve yıldız derecelendirmesi gibi bilgileri içeren bir liste göreceksiniz.

Uzantı detayları

Ayrıca, daha önce yüklediğiniz tüm uzantıları Yüklü klasöründe, çoğu geliştirici tarafından kullanılan popüler uzantıları Popüler klasöründe ve aynı çalışma alanındaki kullanıcılar tarafından önerilen veya son açtığınız dosyalara dayalı önerilen uzantıları Önerilen klasöründe görüntüleyebilirsiniz.

Uzantıları görüntüle

1. Uzantıları Yükleme

Bir uzantıyı yüklemek için, arama alanına uzantının adını yazın ve genişletilmiş aktivite çubuğunda göründüğünde üzerine tıklayın. Uzantı hakkında ek bilgileri kod alanında görüntüleyebilirsiniz. Uzantıyı yüklemek için genişletilmiş aktivite çubuğundaki mavi yükleme düğmesine veya kod alanında görünen yükleme düğmesine tıklayın.

Uzantıları yükle

2. Uzantıları Özelleştirme

Uzantıyı yükledikten sonra, davranışını değiştirmek ve tercihleriniz doğrultusunda özelleştirmek isteyebilirsiniz. Bunu yapmak için, Uzantılar simgesini seçin ve bu kez uzantınız Yüklü klasöründe görünecektir. Dişli simgesine tıklayın ve Uzantı Ayarları seçeneğine gidin.

Uzantı ayarlarını değiştir

3. Uzantıları Yönetme

Uzantıyı yükledikten ve kullandıktan sonra, vscode.dev farklı ihtiyaçlara göre uzantınızı yönetme seçenekleri sunar. Örneğin, şunları yapabilirsiniz:

  • Devre Dışı Bırakma: (Bir uzantıyı tamamen kaldırmak istemediğinizde ancak geçici olarak devre dışı bırakmak istediğinizde kullanılır)

    Genişletilmiş aktivite çubuğunda yüklü uzantıyı seçin > Dişli simgesine tıklayın > 'Devre Dışı Bırak' veya 'Çalışma Alanında Devre Dışı Bırak' seçeneğini seçin VEYA Uzantıyı kod alanında açın ve mavi Devre Dışı Bırak düğmesine tıklayın.

  • Kaldırma: Genişletilmiş aktivite çubuğunda yüklü uzantıyı seçin > Dişli simgesine tıklayın > 'Kaldır' seçeneğini seçin VEYA Uzantıyı kod alanında açın ve mavi Kaldır düğmesine tıklayın.


Ödev

vscode.dev kullanarak bir özgeçmiş web sitesi oluşturun

Gözden Geçirme ve Kendi Kendine Çalışma

VSCode.dev hakkında daha fazla bilgi edinin ve diğer özelliklerini keşfedin.

Feragatname:
Bu belge, AI çeviri hizmeti Co-op Translator kullanılarak çevrilmiştir. Doğruluk için çaba göstersek de, otomatik çevirilerin hata veya yanlışlık içerebileceğini lütfen unutmayın. Belgenin orijinal dili, yetkili kaynak olarak kabul edilmelidir. Kritik bilgiler için profesyonel insan çevirisi önerilir. Bu çevirinin kullanımından kaynaklanan yanlış anlamalar veya yanlış yorumlamalar için sorumluluk kabul etmiyoruz.