sublimetext ve eklentilerinin kurulumu

bu yazımda sizlere daha önce videosunu çektiğim sublime text kurulumu ve eklentilerinin ayarlanmasını anlatacağım.

videoyu çektikten sonra sublimetext programında ayarlar bakımından çok küçük bir değişiklik olmuştu. aslında bu değişiklik çok önemli olmasada bazı arkadaşlarımızın o kısmı çözemediklerini geri dönüşlerden öğrendim.

şimdi başlayalım.

öncelikle sublimetext.com adresine giriyoruz ve açılan pencerede download linkine tıklıyoruz.

ekran görseli:

karşımıza gelen pencereden windows 64 bit yada karşısındaki portable versionu tıklıyoruz. ben portable tarcih ettim.

ekran görseli:

inen zip dosyasını açıp içine açtığımızda sublime_text.exe isimli dosyayı çift tıklayarak açıyoruz.

ekran görseli:

karşımıza sublime text programı açılıyor. burada doğrudan hiçbirşey yapmadan CTRL+SHİFT+P tuşlarına basın karşımıza aşağıdaki gibi bir seçenek listesi açılacak

ekran görseli:

burada en üstteki kutuya install yazdığımızda (devamını yazmaya gerek yok) en üstte çıkan install package control seçeneğine tıklıyoruz.

ekran görseli:

burayı tıkladığımızda biraz bekledikten sonra kurulum gerçekleşecektir. kurulumun bittiğini karşımıza bir uyarı balonu çıktığında anlayabiliriz.

ekran görseli:

şimdi bundan sonra eklentilerimizi kuralım.

emmet eklentisi:

bu eklenti kodlarımızı yazarken bize tamamlama noktasında birçok kolaylıklar sağlar. eğer eklentilerin nasıl faydalar sağladığını görmek isterseniz  https://www.youtube.com/watch?v=4EUKcWJnT4k adresindeki videoyu muhakkak inceleyin.

emmet eklentisini kurmak için

CTRL+SHİFT+P ile açılan pencereye install yazdığımızda açılan seçeneklerden en üstteki insall package seçeneğine tıklayın. 

ekran görseli:

karşımıza tekrar başka bir seçenek kutusu gelecek bu gelen kutuya emmet yazdığımızda alttaki seçeneklerden en üstte bulunana tıklayalım.

ekran görseli:

eklentinin kurulum bilgisi yeni bir sayfada açılacaktır. bu arada her eklenti kurulduğunda böyle bir dosya açılmayabilir.

ekran görseli:

autofilename eklentisi:

dosya adlarını otomatik tamamlamaya yarayan bir eklenti.

CTRL+SHİFT+P ile açılan pencereye install package yazarak çıkan seçeneklerden install package seçeneğine tıklayın (burası bütün eklenti kurulumlarında sabit olarak ilk yapılacak işlemdir)

daha sonra açılan kutuya autofile yazın ve ilk seçeneği tıklayın. 

ekran görseli:

BracketHighlighter eklentisi:

parantezleri vurgulamaya yarayan bir eklenti.

CTRL+SHİFT+P ile açılan pencereye install package yazarak çıkan seçeneklerden install package seçeneğine tıklayın

daha sonra açılan kutuya  bracketh yazın ve ilk seçeneği tıklayın.

ekran görseli:

kurulumun bittiğini sublime text penceresinin sol altında bulunan durum çubuğundan öğrenebilirsiniz.

ekran görseli:

colorpicker eklentisi:

css için renk paletini aktif etmeye yarayan bir eklenti.

CTRL+SHİFT+P ile açılan pencereye install package yazarak çıkan seçeneklerden install package seçeneğine tıklayın

daha sonra açılan kutuya  colorpicker yazın ve ilk seçeneği tıklayın.

ekran görseli:

html nest comments eklentisi:

tagları açıklama satırı içine alırken daha önce açıklama satırları var ise onları pasifize etmeye yarıyor.

CTRL+SHİFT+P ile açılan pencereye install package yazarak çıkan seçeneklerden install package seçeneğine tıklayın

daha sonra açılan kutuya  htmlnest yazın ve ilk seçeneği tıklayın.

ekran görseli:

htmlbeautify eklentisi:

bu eklenti ise html kodlarını hizalamaya yarıyor.

CTRL+SHİFT+P ile açılan pencereye install package yazarak çıkan seçeneklerden install package seçeneğine tıklayın

daha sonra açılan kutuya  htmlb yazın ve ilk seçeneği tıklayın.

ekran görseli:

buraya kadar eklenti kurulumlarını tamamladık.

şimdi ise eklentilere ait kısayol oluşturma işini reindent üzerinden anlatayım.

şöyleki,

normalde reindent yapmak için edit-line-reindent menü seçeneklerini tıklamak zorundasınız. ama ekleyeceğiniz kısayol ile bunu sadece f12 tuşuna bağlayabilirsiniz. siz dilerseniz f12 ye değilde ctrl+alt+shit+f12 yede bağlayabilirsiniz.

üst menülerden preferences-keybindings seçeneğine tıklayın ve açılan pencerede sağ bölüme aşağıdaki kodları yazın ve kaydedip çıkın.

[

 { “keys”: [“f12”], “command”: “reindent”}

]

ekran görseli:

artık f12 ile reindent yapabilirsiniz.

bu yazımda sizlere işin tekniğini gösterirken bazı eklentileride kurmuş oldum siz artık ihtiyacınız olan eklentileri araştırıp gerektiğinde kurabilirsiniz.

Facebooktwitterlinkedin