HTML’de Faydalı 5 Harika Visual Studio Code Eklentisi

HTML’de Faydalı 5 Harika Visual Studio Code Eklentisi

Bir süredir VS Code kullanıyorum ve kesinlikle VS Code kullanımını çok pratik buluyorum. Basit, verimli ve kullanımı kolay. Ancak VS Code ile ilgili en iyi şeylerden biri, onun için mevcut olan çok çeşitli uzantılar ya da eklentiler. Hemen hemen her şey için uzantılar var ve bunlar iş akışınızı geliştirmenize gerçekten yardımcı olabilir. Bu blog yazısında, Visual Studio Code için en sevdiğim 5 HTML uzantısını paylaşacağım. Bu uzantılar kesinlikle bana çok yardımcı oldu ve umarım sizin için de aynısını yapabilirler!

VS Code’da Eklenti Nasıl Kurulur?

VS Code’da eklenti kurmak son derece kolay. Sol taraftaki panelden Extensions sekmesine gelerek ya da Shift Windows X tuşlarına basarak gelen pencerede arama yapmanız yeterli. Çıkan sonuçlarda ilginizi çeken eklentideki Install butonuna tıklayarak eklentinin kurulumunu başlatabilirsiniz.

Emmet

Bazı metin editörlerine kurmanız gereken, ancak Visual Studio Code ile birlikte gelen Emmet, yazdığınz HTML kodlarını çok hızlandıran bir teknoloji. Çok kapsamlı olduğu için ayrıca bir videoyu hak ediyor. Yine de en çok kullandığım eklentiler arasında yerini alıyor.

Auto Rename Tag

Bir HTML sayfasında, açılış etiketinde değişiklik yaptığınız zaman o etiketin kapanışını da değişiklik yaptığınız etiketle değiştirir. div etiketini h2 ile değiştirdiğinizde /div kapanış etiketi de otomatik olarak /h2 ile değiştirilir. Bu da vakit kazandırır.

HTML Tag Wrapper

HTML kodlarının dışına ektra bir HTML etiketi eklemek istediğinizde rahatlıkla ekleyebilmek için bu eklentiyi kullanabilirsiniz. Eklentiyi kurduktan sonra HTML kodlarını seçin ve Ctrl + I tuşlarına basın. Hemen seçili kodların dışına yeni bir etiket açıp sizden hangi etiketi ekleyeceğinizi yazmanızı isteyecektir.

Live Server

Bir web geliştiricisiyseniz, kod düzenleyiciniz ve web tarayıcınız arasında sürekli geçiş yapıyor olma ihtimaliniz yüksektir. Bu, özellikle kodunuzda her değişiklik yaptığınızda tarayıcınızı yenilemeniz gerekiyorsa, zaman alıcı bir işlem olabilir.

Front-end geliştiricilerin olmazsa olmazı Live Server eklentisi, yazdığınız HTML kodlarının anlık olarak tarayıcıda görüntülenmesini sağlayan bir eklenti. Yazdığınız her kodda, tarayıcıya geçerek refresh yapma derdinden kurtarıyor.

Open In Browser

Üzerinde çalıştığınız dosyayı varsayılan tarayıcınızda ya da isterseniz Firefox, Edge gibi seçtiğiniz tarayıcılarda da açarak görüntülenmesini sağlayan bir eklenti. Eklentiyi kullanabilmek için dosya üzerinde sağ tıklayıp Open in Default Browser (Alt + B) ya da Open in Other Browsers (Shift + Alt + B) seçeneklerinden birini seçmeniz gerekiyor.

HTML koduyla çalışıyorsanız, iyi bir kod düzenleyiciye sahip olmanın ne kadar önemli olduğunu bilirsiniz. Ve eğer harika bir kod düzenleyici arıyorsanız, Visual Studio Code’a kesinlikle göz atmalısınız. Bu makalede, Visual Studio Code için hayatınızı çok daha kolay hale getirebilecek 5 HTML uzantısını paylaştık. İş akışınızı hızlandırmaya yardımcı olabilecek bir HTML uzantısı arıyorsanız, bunlara mutlaka bakın.

Popular Tutorials

Görsel Optimizasyon ile Daha Hızlı Web Sayfaları

Resimleri optimize ederek sitenizin daha hızlı ve verimli kullanımını sağlayabilirsiniz. Bunun için…

5 Awesome VS Code Plugins Useful in HTML

I have been using VS Code for a while now and I…

WampServer Kurulumu ve Kullanımı

Bilgisayara yerel sunucu kurmak için server uygulamalarından faydalanırız ve bu uygulamalarla PHP…

CSS ile Padding ve Margin Kullanımı (Boşluklar)

CSS’te sayfa tasarlarken kullanılan boşluklar padding ve margin özellikleri ile verilir. Padding…

Ücretsiz Cloudflare CDN Kurulumu, Kullanımı ve Ayarları

Cloudflare, ücretsiz CDN hizmeti veren bir firma ve web sitelerimizin performansını artırmayı…

Uppercase Türkçe Karakter Problemi ve Çözümü

Uppercase özelliği, CSS’te tüm karakterlerin büyük harfle yazılmasını sağlar. Ama sayfanın doğru…