VS Kodu: WordPress Geliştiricileri için Derinlemesine Bir İnceleme

Microsoft kötü bir rap alır. Yıllar geçtikçe, çağın biraz gerisinde ve kullanıcı dostu olmaktan uzak olarak ün kazandılar. Yıllar önce, bunu hak etmiş bile olabilirlerdi. Ama artık değil. Microsoft'un en son girişimleri platformlar arası, sezgiseldir ve teknolojinin sınırlarını zorlar. İşte burada Visual Studio Code devreye giriyor. 2015'te piyasaya sürülmesinden bu yana VS Code, birçok geliştirici için fiili kod düzenleyicisi haline geldi ve Sublime Text ve Atom'u en iyi seçenekler olarak çıkardı. Ve bu çok şey söylüyor. Öyleyse, VS Code'un neden bu kadar harika olduğunu ve Microsoft'un tüm güvenimizi nasıl yeniden kazandığını anlatalım.

Visual Studio Code: Açık Kaynak ve Onu Sevmek

Yüzeyde, Visual Studio Code, oradaki diğer düzenleyicilerin çoğuna benziyor. Sözdizimi vurgulama, karanlık tema, uzantılar, vb. Ancak biraz daha derine indiğinizde, diğer birçok düzenleyici ve IDE'den farklı olarak, VS Code'da elde ettiğiniz deneyimin sadece pürüzsüz ve — puntoyu bağışlayın — yüce olduğunu görürsünüz.

VS Code'un sahip olduğu en büyük pozitif, açık kaynak olmasıdır. Ama yine de Atom da öyle (ve GitHub'ı satın aldıkları için teknik olarak Microsoft'a da ait). Dahası, Microsoft, açık kaynak lisanslarının en hoşgörülü ve açık olan MIT lisansı altında yayınladı. Tarihsel olarak patentler ve fikri mülkiyet konusunda oldukça sıkı olan bir şirket için bu çok büyük bir adım.

Bu lisanslama nedeniyle, VS Code, yazılımı yalnızca profesyonel yaşamları için kullanmakla kalmayıp aynı zamanda editörün kendisine veya onu özelleştirmek için kullanılabilecek birçok uzantı ve eklentinin bazılarına katkıda bulunan, ölmesi zor bir geliştiriciler topluluğuna komuta eder. Visual Studio Code için MIT lisansının genişliği konusunda bazı tartışmalar vardır, ancak bu, kullanıcıları veya çoğu geliştiriciyi etkilememelidir.

Hepsi Bir Arada IDE?

İşte günün sorusu: VS Code bir kod düzenleyici mi yoksa bir IDE mi? Yerleşik Git entegrasyonu, terminal erişimi ve bash, bir hata ayıklama konsolu ve IntelliSense adlı özel bir sözdizimi vurgulama ve kod tamamlama türüne sahiptir.

Tüm bunlar, indirmeden hemen sonra, hiçbir uzantı veya özelleştirme olmadan. Genellikle, resmi geliştirme ekibi tarafından yerleşik ve güncellenen bu tür özellikler, PhpStorm gibi premium uygulamalarda bulunur. Ancak VS Kodu ile… bu çizgi bulanıklaşıyor. Birçok IDE benzeri özellik sunar.

Ama sonunda, oldukça tam bir IDE değil. Varsayılan kod yeniden düzenleme, resmi dile özgü güncellemeler ve geleceğe yönelik koruma ve bir IDE'nin içinden geçebileceği diğer ağır şeyler almazsınız. Bununla birlikte, bir Visual Studio IDE'si var. Microsoft'un yıllardır ürettiği ayrı, birinci sınıf bir üründür ve Visual Studio Code, Visual Studio ailesinin bir başka üyesidir. Yani tam, ağır bir IDE arıyorsanız, MS'den bir tane alabilirsiniz. Ama dürüst olmak gerekirse, bu oldukça yakın bir saniye.

Ayrıca, bir Visual Studio IDE olması, geliştiricilerin buna Visual Studio yerine VS Kodu veya basitçe Kod olarak başvurmasının nedenidir. Aksi çok kafa karıştırıcı olurdu.

VS Kodu: Kullanıma Hazır

Şimdiye kadar tahmin etmediyseniz, VS Code'u oluşturan birçok parça var. Herhangi bir uzantı eklemeden veya herhangi bir şeyi özelleştirmeden önce, temel bilgilere ve her şeyin kutudan çıkar çıkmaz nasıl çalıştığına bakarak başlayalım.

Düzenleyiciyi ilk kez açtığınızda, iki şey fark edeceksiniz:

• Düzen ve tasarım diğer editörlere benzer ve bu nedenle çoğu kişiye aşinadır.
• Diğer kod düzenleyicilerin çoğundan daha hızlı yüklenir (Atom, sizin yönünüzü arıyoruz)

Ne kadar duyarlı olduğuna şaşırmayı bitirdiğinizde, sol kenar çubuğuna geçebiliriz. VS Code ile birlikte gelen ek araçların çoğunluğunun yaşayacağı yer burasıdır.

Yandaki varsayılan simgelerin her biri, tıklandığında yeniden boyutlandırılabilen ve özelleştirilebilen yeni bir sütun açar.

1. Gezgin

VS Kodundaki varsayılan görünümünüz Explorer sekmesi olacaktır. İçinde, belgeler için VS Code argosu olan Open Editors adlı bir bölüm göreceksiniz. Açtığınız her dosya yeni bir Düzenleyici olarak kabul edilir. Yani açık 8 .css dosyanız varsa, 8 düzenleyiciden oluşan bir liste göreceksiniz.

Ardından, VS Kodu ile düzenlenebilecek dosyalar oluşturabilecek açık Programların listesine sahipsiniz. Bu örnek için arka planda açtığım tek kişinin Snagit olduğunu göreceksiniz. Bunun altında, geçerli dosyanın iskeletini görüntüleyen Anahat bulunur . Devasa bir dosya aldığınızda ve tüm yapının yukarıdan aşağıya görünümünü almanız gerektiğinde, Anahat görünümü aslında ekranın sağındaki mini haritadan bile biraz daha sorunsuz çalışır.

2. Arama

VS Kodundaki Arama özelliği olağanüstü. Diğer editörlerden daha güçlü olduğu için değil (çünkü burada dürüst olmam gerekiyor: Sublime Text'de Bul/Değiştir'e bayılıyorum). Diğer editörlere göre daha kolay ve daha şeffaf olmasıdır.

Aramayı yaptığınızda, arama teriminizin her bir örneği sağ sütunun altında bulunur. Ardından, arama teriminin dosya içindeki konumunu vurgulamak için tek bir örneğe tıklayabilirsiniz. (CTRL/CMD-Tıklama yaparsanız, yeni seçilen satırı vurgulayarak dosyanın ikinci bir örneğini açar.)

İkinci alandaki terimi değiştirmeyi seçerseniz, sonuçlarda arama teriminin kırmızı, üstü çizili bir versiyonu ve yeşil tonlu bir alternatif gösterilir. Sonuçlarda bul/değiştir üzerine tıkladığınızda, değişiklikleri önizlemek için karşılaştırmalı bir fark görünecektir. Bu özellik o kadar kullanışlı ki, onsuz nasıl yaşadığınızı merak edeceksiniz.

3. Git

Git'e yaklaşımımda muhtemelen önyargılı olduğumu söyleyerek başlayacağım. Komut satırı/bash kullanıcısı olma eğilimindeyim ve Git'in grafik istemcileri benim için hiçbir zaman gerçekten doğru hissetmedi. Bu nedenle, diğer editörler ve IDE'lerle birçok Git entegrasyonu benim için bir fincan çay olmadı. Ancak, VS Code'un uygulaması, komut satırı ile GUI arasında bir melezdir ve hangi Git sürümünü tercih ederseniz edin, şaşırtıcı derecede iyi çalışır. Anla… Git'in sürümü mü?

VS Kodunda Git entegrasyonu ile ilgili kısım, sadece çalışmasıdır. Git simgesine tıkladığınızda görünen sol sütun, deponuzun durumunun görsel bir göstergesidir. Normalde çok özel olarak yazılması gereken Git komutlarını kontrol etmek için üç noktaya (…) tıklayabilirsiniz. Bağlam menüsü aracılığıyla aşamalı dosyalarınızı ekleyebilir, onaylayabilir, iletebilir ve hatta değiştirebilir ve çeşitli dallarda çalışabilirsiniz.

Ek olarak, editörün kendisinde bir bash terminali açma seçeneğiniz de vardır. Gezinme çubuğunda bir Terminal menüsü var ve VS Kodunun içindeki menü, özelleştirmeye gerek kalmadan hızlı, temiz, pürüzsüz ve oldukça kullanışlı. Gerekirse birden çok sütuna bölünebilir ve açılır menüden geçiş yapabileceğiniz farklı terminallerde çeşitli dizinleri açık tutabilirsiniz.

Terminal de Git'e özgü değil. Bu özellikle o kadar iyi çalışıyor ki, buraya eklemek doğal geldi.

4. Hata Ayıklama Konsolu

Hata Ayıklama Konsolu , VS Code'daki diğer kod düzenleyicilerden farklı olmasını sağlayan varsayılan özelliklerden biridir. Bu yazı itibariyle, VS Code içinde kurulabilecek 171 hata ayıklama ortamı bulunmaktadır . Sayı vermiyorlar, ama bilmek istedim ve senin de yaptığını düşündüm, bu yüzden elle saydım.

Sonuçlar içinde, akla gelebilecek her şey için hata ayıklayıcılar bulabilirsiniz. JavaScript, CoffeeScript, Coffee, Java… tüm kafein markalı komut dosyaları, gerçekten. LUA ortamları ve Python ve Ruby, Docker, PHP, SASS, LESS ve… her şeyi elde edersiniz. Hata ayıklayıcı bulmaya çalıştığım tüm belirsiz ve/veya ölü programlama dilleri arasında, sonuç vermeyen tek dil QBasic oldu. Ve uzun zamandır kimse kullanmıyor. Uzantı Pazarı'nda modern kullanımda olmayan bir şey bulmakta zorlanacağınızı düşünüyorum.

5. Uzantı Pazarı

Tüm bunlar, Extensions Marketplace'e daha derin bir bakış, size editörün geliştirme topluluğundan bekleyebileceğiniz türden araçlar hakkında bir fikir verir. Yukarıdaki ekran görüntüsünde bazı uzantıların sahip olduğu milyonlarca yüklemeyi görebilirsiniz ve nereden başlayacağınızdan emin değilseniz, Kuruluma veya Popülerliğe göre sıralamak en iyi seçeneğiniz olabilir.

@sort parametresini kullanarak anahtar kelimeye göre sıralama ve arama yapabilirsiniz. Ancak, tüm seçeneklerinizi içeren bir açılır menü için üç noktayı (2) da tıklayabilirsiniz. Kendi yüklü uzantılarınızı yönetme seçenekleri de burada bulunur.

Yüklemek istediğiniz bir şey bulduğunuzda, yapması çok basit. Yeşil Yükle düğmesine tıklayın,

Ardından, kurulumu tamamlamak için VS Code düzenleyicisini Yeniden Yüklemeniz gerekecektir.

Bu kadar. Bu tamamlandığında, uzantınız kullanıma hazırdır. Yine de, genellikle güncellenmiş ve renk kodlu etiketler aracılığıyla çeşitli sorunlar burada ele alındığından, zaman zaman Ayrıntılar sekmesine dönmek isteyebilirsiniz.

Bağımlılık ve güvenlik açığı durumunu kontrol edebilmek harikadır ve uzantılarla ilgili açık sorunları ve bunları ele almanın genellikle ne kadar sürdüğünü görebilirsiniz. Her uzantı tüm bilgileri göstermez, ancak görüntülediklerinde inanılmaz derecede faydalıdır.

Klavye Kısayolları ve Tuş Haritaları

Bir kod düzenleyicinin belki de en önemli kısmı klavye kısayolları ve tuş haritalarıdır. Bahsettiğimiz şeylerin hepsi harika ve editörün ve projenin başarısının ayrılmaz bir parçası. Ancak bir tuş haritasına alıştığınızda ve parmaklarınız bunları kas hafızası aracılığıyla kullandığında, yeni bir tuş haritasına geçmek neredeyse imkansızdır.

En iyi ihtimalle, takas proje programınızı yavaşlatır ve verimliliğinizi azaltır ve en kötü ihtimalle, beceriksiz parmaklarınız kod tabanına bir miktar feci enjeksiyon yapar.

VS Code'a geçiş yaptığınızda nereden geldiğiniz önemli değil, topluluk sizi kapsıyor. İster VIM, Emacs, Sublime Text ve hatta Notepad++'dan olsun, alıştığınız kısayolları ve tuş haritalarını saklayabilirsiniz. Uzantı Pazarı'nda @recommended:keymaps ile arama yapabilir veya kullanılabilir uzantıların listesini getirmek için Dosya – Tercihler – Anahtar Haritalar'a gidebilirsiniz.

Ve kısayol tercihiniz yoksa, bu da sorun değil. Herhangi bir şeyi özelleştirmeniz gerektiğini düşünüyorsanız (veya yalnızca varsayılan olarak VS Kodunda hangi klavye kısayollarının bulunduğunun bir özetini istiyorsanız), File – Preferences – Keyboard Shortcuts seçeneğine gidebilirsiniz.

Çeşitli Hakkında Bilmeniz Gereken Özellikler

Genel bir bakış olarak, bu noktada VS Code'un bir metin ve kod düzenleyici olarak sunabileceklerinin çoğunu görebilmeniz gerekir. Bununla birlikte, bilmeniz gereken bir avuç yararlı şey var.

1. Seçim Menüsü

Bu, hangi düzeyde geliştirici olursanız olun yararlıdır, ancak genel olarak editörler konusunda yeniyseniz özellikle yararlıdır. Seçim menüsü, paha biçilmez bulacağınız bir dizi fonksiyona sahiptir.

Özellikle, bir tıklamayla Satır Uçlarına İmleç Ekle'yi kullanabilmek güzeldir ve geçerli dosyada menüye girip vurgulanan bir kelimenin, ifadenin veya parçacığın Tüm Tekrarlarını Seçebilmek güzeldir. Çoğu düzenleyicide bunlar kısayol olarak bulunur, ancak hepsinde VS Kodunun yaptığı kadar kolay etiketlenmez veya kullanılabilir değildir. Kullanacağınız en değerli ve öne çıkan komutlardan bazıları olduğu için onları bu kadar ön planda görmek canlandırıcıydı.

2. Terminal Menüsü

Bir kod düzenleyicide çalışıyor olmanız, bir komut satırı sihirbazı olduğunuz anlamına gelmez. Aslında, yukarıdaki komut satırına ve terminal bölümüne bakmış ve asla kullanmayacağınızı düşünmüş olabilirsiniz.

Ancak Terminal menüsüne bir göz atın. Bununla pek bir şey yapmasanız bile, menüden yürütebileceğiniz ve gelişiminize biraz yardımcı olabilecek bazı temel komutlar göreceksiniz.

Kabuk komutlarını bilmek yerine bunlara bir menü aracılığıyla erişmek, terminali, bash ve komut satırını birçok uygulamanın kaçırdığı bir şekilde açar. VS Code'u yalnızca VIM veya Emacs'tan gelen deneyimli kodlayıcılara değil, herkese gerçekten çekici kılan bu gibi küçük dokunuşlardır.

3. Zen Modu

Görünüm menüsünün altında, Zen Modunu Değiştir seçeneğini içeren Görünüm adlı bir alt menü bulacaksınız. Görünüm altındaki diğer seçenekler kontrol etmeye ve denemeye değer, ancak dikkatinizi Zen Moduna çekmek istiyorum çünkü pek çok kişinin bunu hiç denemediğini düşünüyorum.

Farklı editörler buna farklı isimler verebilir, ancak genel fikir, tüm ekranınızı yalnızca o anda düzenlemekte olduğunuz belgeyle doldurmanızdır. Uygulamayı değil belgeyi büyütmeniz açısından tam ekran modundan farklıdır.

Modu bir ekran görüntüsüyle göstermek zordur çünkü tüm ekranın VS Code düzenleyicisi tarafından kapsandığını gerçekten gösteremez. Windows görev çubuğu ve MacOS yuvası bile. Ekrandaki gayrimenkulün her pikseli mevcut projeniz tarafından alınır, böylece siz ona odaklanabilirsiniz, başka bir şeye değil.

Ve sizin için değilse, sadece ESC'ye basın ve eski görünümünüze geri dönün.

Çok fazla görünmeyebilir ve ben bir şüpheciydim. Ama kurgu yazmak için Scrivener'da benzer bir özelliği kullandıktan sonra, ben bir dönüşüm yapıyorum. Daha kolay bir akış durumuna girebilir ve işleri gerçekten halledebilirsiniz. Zen Modu'nu uygulamak için VS Code'a o kadar çok övgü var ki, kulaklıklarımızı takıp istediğimiz zaman (veya elimizden geldiğince) dikkatimiz dağılmadan çalışabiliyoruz.

Toplama

Her şey düşünüldüğünde, Visual Studio Code'u indirip denemeyi ihmal etmiş olursunuz. Microsoft, piyasadaki en kararlı, en çok desteklenen, en hızlı ve orantılı olarak hafif/özellik ağırlıklı düzenleyicinin ne olabileceğini ortaya koydu. Doğru araçları bulmak isteyen yeni kodlayıcılar, deneyimli geliştiriciler veya hobiler… VS Kodu sizin için tasarlandı. Bunu başarmak kolay bir başarı değil, ancak sahip olduğu için VS Kodu, sabit sürücünüzdeki bit ve baytlara değer. Ve belki daha önce yazdıysanız Microsoft'a bir kez daha bakın.

VS Kodunun en sevdiğiniz yönleri nelerdir? Anahtarı yaptın mı?