2022 Yılında Hemen Yapmanız Gereken 9 Muhteşem VSCode Uygulaması – JSManifest

2022 Yılında Hemen Yapmanız Gereken 9 Muhteşem VSCode Uygulaması – JSManifest

Bu gönderide, 2022’de Şimdi Yapmanız Gereken 9 Harika VSCode Uygulamasından bahsedeceğiz ve VSCode kullanıyorsanız ve onu bu kadar harika yapan özelliklerin kullanımında topluluğun geri kalanına dahil olmayı umuyorsanız, o zaman doğru gönderiye gelin çünkü aynı takımdayız ve muhteşem VSCode özellikleri listemize göz atmanın zamanı geldi!

Bu yazının amacı en azından önemli biri Bilmediğiniz VSCode özelliğinin geliştirmede büyük olumlu etkileri oldu. Ve eğer en az bir kişinin gelişim deneyimlerini geliştirmesine yardımcı olacak bir etki yaptıysam, o zaman amacıma ulaşmışım demektir.

Herhangi birinin isteyeceği son şey, sahip oldukları çok önemli bir özelliği kaçırdıklarını fark etmektir. baştan beri kullanıyor olabilirdi. Kimse bunu istiyor.

Harika VSCode özelliklerini listeleyen birçok makale bulabilirsiniz, ancak çoğunun yapmadığı bir şey açıklamaktır. neden her özellik kendi deneyimlerinde gelişimi hızlandırır?. İnsanlar anlamıyorsa bazen yararlı bir özellik yararlı değildir nasıl kodlamada bir insan olarak deneyimlerini etkiler.

O halde daha fazla uzatmadan başlayalım!

1. Bölünmüş Terminal ve Aktif Terminali Öldür (Önerilen: Onları bağlayın ikisi birden bir kısayol tuşuna)

Tüm projelerinizi bir masaüstünde geliştiriyor ve terminali VSCode’da kullanıyorsanız, bu özellik bir zorunluluktur.

VSCode’da terminali kullanmak, git gibi komut satırı işlemlerini gerçekleştirirken düzenleyicide kalmanıza olanak tanır. Yararlıdır ve zamanla fazladan beyin hücrelerini kurtarır.

Bölünmüş bir terminali iki yoldan biriyle gerçekleştirebilirsiniz:

  1. Komut penceresini aç (Ctrl + P) > Tıkla Terminal: Bölünmüş Terminal
  2. Bir tuş kısayoluna bağlanın. kullanırım Ctrl + Shift + 5

Daha da yararlı olan şey, az önce yarattığın terminali öldür. Bu, benim gibi, mevcut terminale dokunulmamasını isteyen ve çıktıyı görmek için bir veya daha fazla komut gerçekleştirmek için yan taraftaki bir terminali hızlı bir şekilde açmak isteyen bir oyun değiştiricidir. ve sonra diğer terminalle yaptığımız şeye geri dönmek için işimiz bittiğinde kapatın. Bunun nedeni istemediğimiz mevcut stdout ile kurcalama geri döneceğimiz birinin çıktısı. OKB ile ilgili bir şey. (Şaka yapmak). Bunu göz açıp kapayıncaya kadar yapmaya alıştığımızda, stres seviyemizde gerçekten gözle görülür bir fark yaratıyor.

Aşağıdaki bu kısa kayda bir göz atın. Sol tarafta, içinde bulunulan ayı şu aya atayacağımı görebilirsiniz. todaysMonth değişken. Ama hangi ay olduğunu unuttuğum için yan tarafta hızlıca bir terminal açıp hangi ay olduğunu kontrol ettim, sonra onu kapatıp değişkenime geri döndüm:

Geliştirme deneyimimizi güzelleştiren bunun gibi küçük hareketlerdir. hızlı, heyecan verici ve dahası verimli!

2. Terminal Panelini Aç/Kapat (Önerilen: Bir kısayol tuşuna bağlayın)

Terminali VSCode’da kullanıyorsanız, terminalinizi açıp kapatmak da yararlıdır. Bunu yapmanın iki yolu vardır:

  1. Komut penceresini aç (Ctrl + P) > Tıkla Görünüm: Terminali Aç/Kapat
  2. Bir tuş kısayoluna bağlanın. kullanırım Ctrl + ~

Bunu şununla birleştir Bölünmüş Terminal, Aktif Terminali Öldür daha da iyi bir deneyim için. Hızlı düşünürseniz, dosyaları düzenlerken editörünüzde dolaşabilirsiniz ve bu kısayolları kullanarak, projelerinizi daha önce hiç olmadığı kadar çok bitirme havasında olmak isteyebilirsiniz. Sadece deneyimlerime dayanarak konuşuyorum çünkü işleri ne kadar hızlı bitirirsem bir sonraki görevi yapmak için o kadar motive oluyorum.

3. Boyutlandırmayı İçerik Genişliğine / Kelime Kaydırmaya Geçiş

Kod yazarken, daha iyi okunabilirlik için belirli bir sütun sayısına ulaştığında uzun kod satırlarını sarmak yararlıdır.

Normalde uzun cümleleri düz bir çizgide birleştirmek ve okumak için biraz tıklama ve geri alma yapmamız gerekir, ancak aslında bunu bizim için tüm dosya için yapabilen gizli bir kısayol var. dosyayı değiştirmeden.

Aşağıdaki örneği alın. Bunu okumak pek hoş görünmüyor ve ilk birkaç saniyede hangi içeriğin neyle gruplandığı hemen belli değil:

vscode-short-cut-expand-lines-word-wrap-column-fast-development-expand.png

Bir proje boyunca birden fazla dosya böyle görünüyorsa, kodu anlamaya çalışmak için biraz motivasyon kaybedebiliriz. Motivasyon burada anahtardır. Motive olmak istiyorsak, kodu okumayı kolaylaştırmalıyız. şimdi tabii yazı odak noktası daha temiz kod olmalıdır, ancak kod satırları uzadığında, o kadar bile fazla bir şey yoktur. daha güzel uzun çizgilerin güzel görünmesini sağlamak için yapabilir.

VSCode, ayarlarımızda ayarlanan maksimum sütun sayısını geçen uzun kod satırlarını saran düzenleyicimizin maksimum sütun sayısını değiştirebileceğimiz bir “kaçış kapağı” sağlar.

Basarak Alt + Z bunu geçici olarak devre dışı bırakabiliriz ve daha sonra uzun kod satırlarını daha düz ve zarif bir şekilde okuyabiliriz:

vscode-shortcut-disable-word-wrap-column-readable-code.png

4. Düzenleyici Simgelerini ve Kapsamlarını İnceleme

Kod temamızı VScode’dan, kodlar ve kutudan veya hatta kişisel blogumuzdan özelleştirmek istediğimizde, bazen kullandığımız mevcut kod temasından belirli bir renk veya arka plan isteriz.

Örneğin, VScode’da Material Theme High Contrast kullanıyorum ve bu temayla ilgili en sevdiğim kısım, reaksiyon bileşenlerindeki altın vurgu:

vscode-color-theme-settings-material-theme-high-contrast-javascript.png

Bunu temanın JSON yapılandırmasında kendiniz arayabilirsiniz veya Düzenleyici Belirteçlerini ve Kapsamlarını İncele özelliğini kullanarak bu bilgiyi bulmanın çok daha hızlı ve daha havalı bir yolunu yapabilirsiniz.

Devam edin ve basın Ctrl + P ve yazın inspect ve üzerine tıklayın Developer: Inspect Editor Token and Scopes.

Bu açıkken, imlecinizi dosyanızın etrafında hareket ettirebilir ve aşağıdaki gibi bilgileri almak için mevcut kodun AST belirteçlerini inceleyebilirsiniz. ön plan veya arka fon renk:

javascript'te vscode-inspect-tokens-and-scopes-daha hızlı-geliştirme

5. Satır Yorumunu Değiştirme (Önerilen: Bir kısayol tuşuna bağlayın)

Bu, VSCode’u kullanmaya başladığım ilk haftadan beri kullandığım için minnettar olduğum VSCode’un en önemli özelliklerinden biridir.

Bu özellikle ilgili en güzel şey, bir satırın başına tıklamanıza gerek kalmamasıdır. satırı yorumlamak için. Bu zaman içinde zamandan tasarruf sağlar!

Soğuk bir satırda satır yorumu yapmak için, tuşuna basın. Ctrl ve vur / buton.

Bu döner

vscode-uncommented-code.png

İçine:

vscode-toggled-line-comment-key-shortcut-combination.png

6. Blok Yorumu Değiştirme (Önerilen: Bir kısayol tuşuna bağlayın)

Satır yorumlarını değiştirmeye ek olarak, blok yorum sözdizimini kullanarak yorumları da değiştirebiliriz.

Örneğin bu kod bloğu:

vscode-uncommented-code.png

Dönüşür:

vscode-block-comment-shortcut-key-combination.png

Bunu yapmak için varsayılan kısayol Shift + Ctrl + L

Ancak kullanmanızı tavsiye ederim Ctrl + Shift + / satır yorumu kısayoluyla daha yakından hizalamak için doğru hissettiriyor.

7. Hızlı kaydırma hassasiyeti (Önerilen: Bir kısayol tuşuna bağlayın)

Fareniz kodda olması gerekenden daha yavaş mı ilerliyor? Peki, iki seçeneğiniz var:

  1. Bilgisayarınızın ayarlarından kaydırma hassasiyetinizi ayarlayın.

  2. Kaydırma hassasiyetinizi bilgisayarınızın ayarlarında tutun, ancak kaydırma hassasiyetinizi VSCode’da ayarlayın.

Çoğumuz ilk seçeneğe kolayca gidebilir ve buna bir gün diyebilir, ancak VSCode’un dışındaki kaydırma hassasiyetine zaten alışkınız. Belki TikTok içeriğinde gezinme hızımız sevdiğimiz şekilde iyidir veya Facebook haber akışımızda gezinmek tam olduğu gibi geliyor.

Peki VSCode aslında yapabileceğiniz bir tuş kombinasyonu sağlar. Daha hızlı kaydırma yapmak için Alt tuşunu basılı tutun ve aynı anda kaydırın ve ardından normal hızda kaydırmaya geri dönmek için Alt tuşunu bırakın.

Bu önemli çünkü aslında json ayarları görüntüleme modumuzda görünmüyor! Bu yüzden kolayca gözden kaçabilir. Başka bir deyişle, bazılarımız, bu seçeneği kullanmadıkça bu seçeneğin var olduğunu asla bilemeyeceğiz. GUI modu.

8. Kod Satırlarını Sıralama (Yükselme / Azalma)

Sıklıkla kendimizi büyük bir nesneyle çalışırken buluruz ve tüm anahtar/değer çiftlerini sıralamak isteriz. Anahtar/değer çiftlerini sık sık yukarı ve aşağı aramak zorunda kaldığımızda, özellikle onları sıralama ihtiyacını artırıyoruz.

Bu anahtar değer çiftlerini alfabetik olarak sıralayabilirsek çok iyi olur, böylece çok fazla hareket etmemeleri için gözlerimizi biraz daha rahatlatabiliriz.

VSCode’un satırları sıralama özelliği vardır, böylece aşağıda gösterildiği gibi bunu yapabiliriz:

vscode-sıralama-satırları-artan-veya-azalan-javascript-geliştirme-iş akışı

9. JSON nesnelerini sıralama (Yükseliş/Azalış)

Kod satırlarını sıralamanın yanı sıra JSON nesnelerini de sıralayabiliriz. Bu, API yanıtlarından veya kişisel projelerdeki verileri manipüle ederken, genellikle JSON nesneleriyle çalıştığımız için çok kullanışlıdır.

Devam edin ve yükleyin JSON nesnelerini sıralama uzantısına basın ve bir JSON nesnesi arayın, ardından Ctrl + Parayın ve tıklayın Sort JSON.

vscode-sort-json-komut-artan-veya-azalan-javascript-development-iş akışı

Sağ tıklayıp menüdeki seçeneği de seçebiliriz. sadece ihtiyacım var JSON’u sırala seçeneği, bu yüzden genellikle diğerlerini devre dışı bırakırım.

Çözüm

Ve bu yazının sonu burada bitiyor! Umarım bunu değerli bulmuşsunuzdur ve gelecekte daha fazlasını ararsınız!

Bir cevap yazın

E-posta hesabınız yayımlanmayacak.