İçeriğe geç

Atom Editörde Snippet Kullanımı

Uyarı: İlgili yazı 60 günden daha uzun bir süre önce yayınlandığı için güncelliğini yitirmiş olabilir.

Text editörlerde daha hızlı kod yazabilmemiz için sürekli kullandığımız kalıpları kaydedebileceğimiz bir yapı bulunuyor, buna da snippet deniliyor. Şimdi biraz daha açıklayıcı olması için hemen bir örnek gösterelim.

Text editörümüz de bir HTML dosyası açalım ve img yazıp tab tuşuna basalım. Hemen aşağıda ki yapı oluşacaktır.

Burada imleç src etiketinde olacak, siz değeri yazıp tekrar tab tuşuna basınca imleç alt etiketine kayacak. Bu normalde Atom Text Editör ile gelen bir parçacık (snippet’ın Tükçesi), eğer kendi snippetımızı oluşturmak istersek File > Snippets yolunu takip ediyoruz ve snippets.cson dosyasını açıyoruz.

Daha önce snippet eklemedi iseniz boş olabilir, sorun yok. Kendi parçacığımızı ekleyelim.

Şimdi satır satır anlatalım.

  1. Satır sayfa türünü belirtiyor ki diğer sayfaların kodlarını da aşağıda vereceğim. text.html.basic HTML sayfaları için olduğunu söylüyor.
  2. Satır Snippetımızın ismi.
  3. Satır Tetikleyici, yani editörde ne yazınca bu snippet çalışacak.
  4. Satır Tetikleyici çalışınca eklenecek parçacık.

Görüldüğü gibi bir HTML sayfası açıp snippet yazdığımızda hemen öneri geldi, sorunsuz çalışıyor. Çoklu satır eklemek için ise 3 tırnak kullanıyoruz (  """ ). Aynı zamanda parçacığın içerisinde (img etiketinde olduğu gibi) tab tuşu ile gezinmek istiyorsak dolar (  $ ) işaretini kullanmalıyız.

Örnek kötü oldu ama neyse, bu şekilde birden fazla satır ekleyebilir ayrıca tab tuşuna basarak hızlıca imleci istediğini konuma getirebilirsiniz. Dikkat ederseniz $1 iki kez kullanıldı, burada imleç aynı anda 2 noktada olacak demek bu.

Yukarıda HTML sayfaların snippetını belirlemek için  .text.html.basic kullanıyoruz dedik. Aşağıda ki listede bazı diller için kodlar var, sayfa türüne göre özelleştirebiliriz artık.

HTML:  .text.html.basic
CSS:  .source.css
JavaScript:  .source.js
JSON:  .source.json
PHP:  .text.html.php
JAVA:  .source.java
Ruby:  .text.html.erb
Python:  .source.python
Düz Metin:  .text.plain

Artık aşağıda ki gibi bir parçacık yapısı oluşturarak daha hızlı kod yazabilirsiniz.

Örnek saçma oldu ama üstesinden gelirsiniz bence. Neyse, yazıyı hazırlarken sitepoint.com sitesini referans aldım demek isterdim ama şaka. Direk oradan C/P yaptım :p isteyen ilgili kaynağa da bakınabilir.

How To Use Code Snippets in Atom: Yazıya Git!

Selametle.

Tarih:Genel Programlama

İlk Yorumu Siz Yapın

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir