Front-End Geliştirme Araçları #1

Merhaba, ilk blog yazımda front-end geliştirme ile uğraşırken kullandığım bazı araç ve uygulamaları tanıtacağım bir rehber yazmak istedim. İş kalitesini ve verimliliği arttıran bu araçlarla yakından ilgileniyorum ve olabildiği kadar çalışma alanıma dahil etmeye çalışıyorum. Kullandığım programları dizayn, kodlama ve bunlar harici yardımcı programlar olarak 3 başlık altında topladım. Yer verdiğim programların bazıları çok bilinen, bazılarıysa pek duyulmamış programlar. Herhangi bir ayrımda bulunmadan, bu teknolojilere hakim olmayan bir insanın da fikir sahibi olabilmesini sağlayabilecek bir liste yapmak istediğim için bu programları da yazımda listeledim.

Tasarım

Figma

Figma arayüz ve prototipler oluşturabileceğiniz bir UI tasarım programı. Masaüstü uygulaması veya tarayıcı üzerinden çevrimiçi olarak kullanabiliyorsunuz. Güzel bir topluluğu ve eklenti desteği olan bu uygulamada bir proje üzerinde aynı anda birden fazla kişinin çalışması mümkün ve bence bu çok güzel bir özellik. Ücretli ve ücretsiz olarak farklı plan seçenekleri mevcut.

Platform: Windows, Linux(unofficial) ve MacOs, Web
Alternatifler: Adobe XD, Sketch, Framer

X-Scope

xScope çok yönlü olarak tasarlanmış bir yardımcı uygulama. İçerisinde 10 farklı araç bulunmakta. Ben yalnızca Dimensions, Guides ve Loupe’u kullandığım için sadece bunlardan bahsedeceğim. Guide ekrana yatay ve dikey eksende kılavuz çizgileri çekmemize yarıyor. Loupe ile ekranda gördüğünüz herhangi bir rengi atanan kısayol ile kopyalayıp Loupe kütüphanesine ekleyebiliyor ve daha sonra rahatlıkla ulaşabiliyorsunuz. Dimensions ise ekran üzerindeki objeler arasındaki uzaklığı pixel cinsinden görmenize yarıyor. Eğer pixel-perfect tasarım yapmaya çalışıyorsanız araçlar işinizi çok kolaylaştıracaktır.

Platform: MacOs
Alternatifler: Pixel Snap

Font Base

Kendini “Font Manager” olarak tanımlayan Font Base, bilgisayarınızda yüklü olan fontları tek bir yerden kontrol etmenizi sağlıyor. Programın içerisindeki tasarım aracıyla fontlara tanımlanan farklı değerleri kolayca önizleyebiliyorsunuz. Google Fonts ile entegre çalıştığı için de pratik bir kullanım sağlıyor.

Platform: Windows, Linux ve MacOs

FontXChange

Ücretli bir program olan FontXChange bilgisayarınızdaki fontları farklı formatlara dönüştürmeye yarıyor. OpenType, WebFont, TrueType ve PostScript Type gibi güncel font uzantılarını destekliyor. Kullanımı çok basit ve hızlı, fontları istediğiniz ayarlarda encode edebiliyorsunuz. Seçtiğiniz tüm uzantılar ve önizleme dosyasını belirlenen dizine oluşturuyor.

Platform: Windows ve MacOs

Kodlama

Visual Studio Code

Microsoft tarafından Electron kullanarak açık kaynak olarak geliştirilen Visual Studio Code son yılların en gözde kod editör programları arasında. Benim tercih etme sebebim çok fazla kişiselleştirilebilir olması ve geniş eklenti desteği.

Platform: Windows, Linux ve MacOs

Responsively

Responsively yaptığınız tasarımları farklı ekran çözünürlüklerinde ve cihazlarda eş zamanlı olarak görebilmenizi sağlayan ücretsiz bir program.

Platform: Windows, Linux ve MacOs

Snipetty

Eğer ki projelerinizde aynı kod bloklarını sık sık kullanıyorsanız Snipetty ile yeni snippetler oluşturup bu snippetleri kategorize ederek kendi kütüphanenizi oluşturabilirsiniz.

Platform: MacOs
Alternatifler: Vs Code Snippets

Devbook

Açık kaynak geliştirilen Devbook yeni bir uygulama. Düzenli güncelleme alıyor ve sürekli olarak yeni özellikler ekleniyor. Herhangi bir tarayıcı penceresi açmaya gerek kalmadan devdocs dökümantasyonlarına ulaşabilir veya Stackoverflow üzerinden arama yapabilirsiniz. Atanan kısayol tuşu ile uygulamayı çalıştırıp aramanızı yapabilirsiniz.

Platform: Windows, Linux ve MacOs

Diğer Programlar

Daily.dev

Daily.dev, tarayıcınızın ana sayfasını teknoloji ve yazılım dünyasındaki yeni haber ve gelişmeleri takip edebileceğiniz bir araca çevirmenizi sağlayan bir eklenti. Takip ettiğiniz kaynak ve etiketleri uygulamaya ekleyip haber ağınızı genişletebilirsiniz.

Platform: Google Chrome, Mozilla Firefox ve Microsoft Edge

Notion

Notion basitçe anlatmak gerekirse bir not alma uygulaması fakat çok farklı şekillerde kullanımlara olanak sağlayan bir yapısı var. Kendi şablonunuzu oluşturabilir, diğer kullanıcıların şablonlarına göz atabilir veya programın size sunduğu hazır şablonları seçerek kullanmaya başlayabilirsiniz. Özellikle proje takibi gibi konular için yararlı bir uygulama.

Platform: Windows, Linux ve MacOs, iOS, Android, Web

Thor

Açık kaynak geliştirilen Thor klavye kısayolları kullanarak programlar arasında kolayca gezinmenizi sağlayan bir uygulama. Herhangi bir kısayolu istediğiniz programa atayabiliyorsunuz. alt-tab kısayollarını kullanmaktan çok daha pratik ve zaman kazandıran bir uygulama.

Platform: MacOs

Alfred

Alfred Mac OS’un varsayılan arama çubuğu olan Spotlight’a alternatif olarak kullanılabilen uygulama. Ücretsiz olarak kullanılabilse de özelliklerin büyük bir kısmını oluşturan workflow’ları kullanmak istiyorsanız lisans almanız gerekiyor. Workflow’ların sağladığı çok yararlı özellikler var. Kendi workflow’unuzu oluşturabileceğiniz gibi topluluk tarafından oluşturulanları da kullanabilirsiniz. Benim favori workflow’larım:

• Colors: RGB, HEX veya HSL formatlarında yazdığınız renk kodunu istediğiniz renk formatına dönüştürebilen bir workflow.

• Audio Switch: Arama çubuğu üzerinden ses giriş çıkışlarını kontrol etmenize yarayan bir workflow.
• Clipboard History: Kopyaladığınız verilere daha sonra ulaşabilmek için kullanılan bir built-in özellik.

Platform: MacOs

Rectangle

Rectangle açık kaynak geliştirilen, masaüstü pencerelerinizi atadığınız kısayollar ile ekranda yatay ve dikey olarak istediginiz boyutlarda konumlandırabileceğiniz bir uygulama. Thor ile birlikte kullanıldığında çok verimli bir çalışma alanı sağlıyor.

Platform: MacOs
Alternatifler: Grid, Magnet

Autotimer

App Store üzerinden indirebileceğiniz bu uygulama ile projelerinize ayırdığınız aktif zamanı takip edebilir ve hangi dili ne ölçüde yazdığınızı yüzde olarak görebilirsiniz.

Platform: MacOs
Alternatifler: Code Time, CodeTime

Bu yazının sonuna geldik fakat yeni öğrendiğim programlar oldukça bu seriyi devam ettirmeyi planlıyorum. Umarım yardımcı bir rehber olmuştur ve zaman ayırıp okuyan herkese teşekkür ederim. Sonraki yazılarda görüşmek üzere.