#

Web Geliştiriciler için En İyi Atom Paketleri

Yıllarca Sublime Text kullandıktan sonra, bir kaç ay önce Atom’a geçmeye karar verdim. Atom’a geçmemin en büyük nedenleri paket kurulumunun kolaylığı, tema çeşitliliği ve tema düzenlemenin basit olması. Ayrıca FTP bağlantısının Sublime Text’e göre daha kullanışlı ve basit olması beni kendine çekti.

Atom’dan biraz bahsetmek gerekirse, Atom: GitHub tarafından geliştirilen açık kaynak kodlu ve ücretsiz, Node.js ve CoffeScript ile hazırlanan Cross-platform bir metin editörüdür. Tabii yıllarca Sublime Text kullandıktan sonra yeni geçeceğim metin editörünün sublime text’de olduğu gibi görsel açıdan hoş (noteped++ gibi sıkıcı olmayan) sublime text kadar zengin paket ve tema çeşitliliği olmasını bekledim. Atom’un neye benzediğini belirtmem gerekirse Sublime Text, Webstorm ve Brackets karışımı diyebilirim. Zira bazı paketleri, Sublime ile birebir aynı.

Atom’un beğenmediğim yanlarına geçecek olursak;  Sublime Text kadar hızlı olduğunu düşünmüyorum. Bir karşılaştırma veya deneme yapmadım. Sadece hissiyatımı dile getiriyorum. Bana Sublime Text kadar hızlı değilmiş gibi göründü. Karşılaştığım bir diğer sorun büyük dosyaları açmakta ciddi sıkıntılar gördüm. Kasmalar, donmalar, yanıt vermemeler yaşıyorum. Diğer yandan bazı sayfalarda Atom’un RAM kullanımının yüksek olduğunu okudum. Ben bununla ilgili bir sorun yaşamadım. Benim editörümde 7-8 dosya açık haldeyken ve ftp bağlantısı aktifken, görev yöneticisinden baktığımda aşağı yukarı 300mb ram kullandığını gördüm. Benim için devede kulak.

Yazıda ki asıl yazma amacıma geçecek olursak, kendi kullandığım ve önerdiğim Atom paketlerini aşağıda açıklamalarıyla beraber listeledim. Umarım işinize yaracak paketleri bulabilirsiniz.

Paket kurmak için File → Settings → Packages yolunu izleyebilirsiniz.

file-icons

File-icons, dosyaların türlerini solda ağaç görünümünde ve sekme sıralamasında dosya isminin solunda küçük iconla gösterir. Dosya simgelerini düzenleyebilir, kendi simgenizi “packages/file-icons/styles” yolunu takip edip LESS dosyalarını düzenleyerek ekleyebilirsiniz. Varsayılan simgelere 8 renk ve 3 ton (hafif, orta, koyu) verebilirsiniz. Gayet kullanışlı ve güzel düşünülmüş bir eklenti. Hızlı işlem yapmak için birebir.

atom-beautify

Atom-beautify, kodların dizilimini düzeltir. Dağınık kodunuzu düzgün, sıralı ve daha okunabilir hale getirirAnlaşılır bir hale sokar. HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, Coldfusion, SQL ve daha fazla fazlası üzerinde çalışabiliyor.

color-picker

Color-picker, editör üzerinde renk paleti kullanmanızı sağlar. CSS / SASS / LESS dosya tiplerinde çalışır. HEX, HEXa, RGB, RGBa, HSL, HSLa, HSV, HSVa, VEC3 ve VEC4 renk kodlarını seçebilirsiniz. color-picker’ı kullanmak için sağ tıklayabilir veya CMD/CTRL+SHIFT+C kısayolunu kullanabilirsiniz.

minimap

Minimap, dosyanızın tamamını görmenizi ve satırlar arası hızlı geçiş yapmanızı sağlar. Sublime Text kullanmış olanlar minimap’e alışıklar. Bende Atom’a geçtikten sonra ilk aradığım şey minimap oldu. Minimap’in durumu solda veya sağda olarak ayarlanabilir. “highlight-selected” kullanılabilir.

highlight-selected

Highlight-selected, Sublime Text veya Notepad++ gibi anahtar kelimenin veya değişkenin üzerine çift tıkladığınızda aynı kelimeleri çerceve içine alır. Aynı kelimeleri hızlı ve güvenilir bir şekilde bulmanızı sağlar. Satır satır aramanızı engeller. Minimap ile beraber başarılıdır.

css-snippets

Css-snippets, CSS, SCSS, Sass ve Less kodlarını otomatik tamamlar, özelliklere vereceğiniz değerleri listeler. Ayrıca “background:” girmek için “bg” yazıp TAB’a basmanız yeterli olacak. font-family için ff, color için c, width için w vs…

emmet

Emmet, daha hızlı HTML, CSS, XML kodları yazmanıza olanak sağlayan bir pakettir. Emmet’e alışması zor, yokluğu ise çok daha zordur. Emmet kodları hızlı bir şekilde tamamlayarak zamandan kazanmanızı ve daha az uğraş vermenizi sağlar.
Örneğin css editörüne şunları yazıp;

div+div>p>span+em^^bq

tab tuşuna basarsanız, aşağıdaki gibi bir çıktı alırsınız;

<div></div>
<div>
    <p><span></span><em></em></p>
</div>
<blockquote></blockquote>

daha fazla kısayol için buraya tıklayın.

atom-css-comb

Atom-css-comb, css kodlarını türlerine göre yeniden dizen, düzenleyen harika bir pakettir. Önceden hazırlanmış Yandex, Zen, ve CSSComb sıralama tercihlerini kullanabilir veya kendi sıralama tercihinizi kullanabilirsiniz. Paketi kullanmak için CTRL+ALT+C kısayolunu kullabilir veya  Packages > CSS comb > Comb dosya yolunu izleyebilirsiniz.

remote-ftp

remote-ftp, hostunuza  FTP/FTPS/SFTP üzerinden bağlanmayı ve dosyaları düzenlemenizi sağlar. Aynı ağaç görünümde olduğu gibi ftp bağlantısınıda ağaç görünümüyle solda listeler.

activate-power-mode

Bonus olarak active-power-mode’u tanıtmak istedim. Active-power-mode siz kod yazdıkça puanlama yapar ve kod yazmayı efektif bir hale sokarak, eğlenceli bir hale getirir.

Etiketler

Paylaş

Yorumlar