Front-End Developer Neleri Bilmeli

Front-End Developer Neleri Bilmeli

Hepinize merhaba dostlarım 😊. Daha önceki makalelerin birisinde back-end developer neleri bilmeli bunu anlatmıştım (okumayan dostlarım buradan ulaşabilir 😊). Bu yazımda ise sizlere bir front-end developer' in neleri bilmesi neler hakkında bilgi sahibi olması gerektiğinden bahsedeceğim 😊. Aranızda backend developer haricinde front-end developer olanlar da vardır biliyorum çünkü her insan front-end developer veya backend-developer olacak diye bir kaide bir kural yok 😊. Bu Allah vergisi olup kişinin yeteneğine göre değişebilir 😊. Ben meselal backend tarafına yatkınken birkaç arkadaşım ise front-end tarafına yatkın bu değişebilir 😊. Şimdi sözümüzü daha fazla uzatmadan bir front-end developer neleri bilmeli gelin bunları inceleyelim. Kemerlerinizi bağlamışsanız uçuşa geçebiliriz 😊

HTML, CSS, JAVASCRIPT

Eveeeet dostlarım 😊. İlk başlığımız ile konumuza ufaktan giriş yapmış bulunmaktayız. Başlıktan anladığımız gibi HTML (Hypertext Markup Language) yani Metin İşaretleme Dili, CSS (Cascading Style Sheets) olarak geçen ve metin biçimlendirme dili ve Javascript in web dünyasında önemli bir yere sahip olduğunu hepimiz biliyoruz. Özellikle bir front-end developerin bunları bilmesinin çok ama çok önemli olmasının da gereğini açıkça söyleyebiliriz. Herhangi bir front-end projesinde front-end developerin öncelikle HTML bilgisinin çok çok iyi olup ana sayfanın iskeletini çıkarması, daha sonra bu iskeleti CSS bilgisi ile (bunun da çok çok iyi olması gerekir çünkü bir front-end developerin vazgeçilmezlerinden birisidir 😊) güzel biir şekilde biçimlendirmesi ve en sonunda ise JAVASCRIPT bilgisiyle de gerekli kısımlardan güzel bir şekilde aksiyon aldırması gerekir 😊. Bu muhteşem üçlüye nasıl birbirinden ayrılamıyorsa front-end developer da bunlardan asla ama asla ayrılmamalıdır 😊 Bu kısma kadar tamam ise dostlarım gelelim bir diğer başlığımıza

JQUERY

Bir diğer başlığımız olan jquery kısmına da gelmiş bulunmaktayız 😊. Özellikle backend tarafında olduğumdan ve php programlama dili ile uğraştığımdan dolayı sıklıkla duyduğum ve değerli hocam "Zafer YILDIZ" dan da (blog sayfasına buradan ulaşabilirsiniz) (PHP den çok jquery öğren 😊) sözüne şahit olduğumu göz önüne alırsak bir back-end alanında jquery bu kadar önemli iken front-end alanında daha önemli olduğunun rahatlıkla analiz edebiliriz. Front-end developerin peynir ekmeğidir bu 😊. Örnek vermemiz gerekirse bir slider alanı tasarladı varsayalım. Bu sliderların belirli saniyeler arasında geçişinin olması gerek değil mi 😊, veya bu sliderların sağında ve sonunda next ve prev şeklinde toplamda iki adet butonun olması, önceki ve sonraki slider'ı ekranımıza getirmesini sağlamak jquery ile olur 😊. Bu da bir front-end developer'in vazgeçilmezi olduğunu (backend-developer in de yeri geldiğinde vazgeçilmezidir unutmayalım 😊). 

BOOTSTRAP

Ve geldik en tatlı başlığımıza 😊. Twitter tarafından geliştirilen, açık kaynak kodlu (open source) olan ve front-end developer ların neredeyse sıklıkla kullandığı (back-end developerlar da kullanıyor ezme durumuna girmeyelim 😊) bir ön yüz çatısı olan bootstrap i bilmek oldukça önemlidir. Neden diye soracak olursanız dostlarım örnek vereyim:

Bir web sayfanız var diyelim bunu uzun uzun css kodlarıyla ortaladınız, mobil - masaüstü - tablet gibi platformlarda görünmesi için uzun uzun kod yazdınız varsayalım. Ama bootstrap kısmında böyle uzun uzun işlemlere zaman kaybetmenize hiç ama hiç gerek yok. Tanımladığınız html taglerinde gerekli olanlara (div olur button olur form olur vs vs 😊) bunlara bir class verip içerisine bootstrap in özel class ları (col-md-8 gibi veya btn btn-success gibi, alert alert-info gibi vs.) şeklinde verceğimiz ufak bir class name ile css üzerinde yapacağımız uzun uzun işlemi tek bir kod ile yapabiliriz ve bu da bize çok büyük zaman kazandırır 😊. Öğrenmenizde ve projelerinizde kullanmanızda fayda var 😊

SASS & LESS

Son zamanlarda özellikle front-end developer iş ilanlarında karşımıza çıkan teknolojilerden olan sass ve less ilk başlarda biraz yabancı gelebilir dostlarım ve hemen "Bunlar da ne böyle 😊" şeklinde ufak şaşırmalar olabilir 😊. Ben de ilk duyduğumda bu şekilde tepkiler vermiştim. Konunun özüne gelecek olursak bu sass ve less aslında bizim yukarıda bahsettiğimiz CSS (Cascading Style Sheets) yazımında yazdığımız CSS e dinamiklik kazandıran ön işlemcilerdendir. Nasıl diye merak ediyorsanız dostlarım bunu da sizlere açıklayayım. Normalde biz CSS i yazıyoruz iyi hoş. Ama bazen öyle durumlar geliyor ki bu yazdığımız CSS e dinamiklik vermemiz zorunlu oluyor (yani kısaca front-end de ufak tefek backend-developer moduna giriş yapıyoruz 😊). Örnek vermemiz gerekirse değişken tanımlama yapabiliyoruz veya if else gibi yapılar kullanabiliyoruz 😊. İşte bu ve bunun gibi CSS dinamikliği gereken durumlarda bu işlemleri çok rahat bir şekilde yapmamıza yarayan SASS ve LESS teknolojileri bir front-end developer için oldukça gereklidir 😊  

JAVASCRIPT FRAMEWORKLERİ

Geldik bir diğer başlığımız olan Javascript Framework leri başlığımıza 😊. Burası çok ama çok önemli bir konudur dostlarım 😊. Önceki yazdığım yazılardan birisi olan Framework Nedir ? başlıklı yazımdan (okumayan dostlarım için buraya linki bıraktım) framework kullanmanın ne kadar önemli olduğunu ve işlemleri ne kadar hızlandırdığını anlatmıştım 😊. Bu sadece back-end alanında değil front-end alanında da böyledir dostlarım 😊. Özellikle bir tasarım yaptınız veya bir butondan aksiyon alacaksınız varsayalım. Bunu Vue.js, React.js veya Angular.js ile rahatlıkla ve son derece hızlı bir şekilde yapabilirsiniz 😊. Ve yeri gelir Node.js frameworkü ile de yapabilirsiniz 😊. Bunlar sizi he framework alanında çok rahat bir şekilde geliştirir hem de son derece hız sağlar. Javascript frameworkleri hakkında yeni şeyler öğrenmek istiyorsanız "Didem Küçükkaraaslan" hocamın youtube kanalına "codingwithdidem" (kanalının linkini buraya bıraktım 😊) ulaşabilirsiniz 😊

RESPONSIVE DİZAYN

Geldik artık en son kısmımız olan responsive dizayn konusuna dostlarım 😊. Son zamanlarda üzerinde sıklıkla durulan konu olan ve zaman zaman bir front-end developer in çıldırmasına sebep olan konulardan birisi olan responsive dizayn a genel bir bakacak olursak dostlarım bunun amacı tasarlanan bir web sitesinin mobilde, masaüstünde ve tablet gibi ortamlarda taşmasını önleme işlemidir 😊. Çoğu zaman back-end developerlerin korkulu rüyası olan ve son derecede çileden çıkartan bir konudur. Ama bir front-end developerin bunu kesinlikle bilmesi lazımdır diyebilirim 😊. Çünkü bir tasarımın taşması genelde çok hoş durmaz ve özellikle bir front-end developerin bunu bilmesi çok ama çok gereklidir 😊 

 

Evet dostlarım 😊. Bu yazımda sizlere bir front-end developerin neleri bilmesi gerektiğinden, nelerin hız kazandıracağından dilim döndüğünce bahsettim. Umarım faydalı olmuşumdur 😊. Eksik veya hatalı bir bilgi aktarımı yapmışsam benimle iletişime geçmekten çekinmeyin 😊. Özellikle bir front-end gelişitirici olmak istiyorsanız veya bu alana ilginiz varsa front-end alanında sadece bu anlattıklarımla kalmayıp kendinizi geliştirmeye sürekli devam edin 😊. Bu yazımda ufak da olsa öneri fikri veren "Barış Tunar" hocama da (ulaşmak isterseniz LinkedIn adresi burada 😊) çok teşekkür ediyorum 😊

Hayallerinizi gerçekleştirmeniz ve güzel yerlere gelmeniz dileklerimle... İyi çalışmalar dilerim 😊

Muhammed Fatih BAĞCIVAN
Yazar Hakkında

Kendi Halinde Bir Backend Developer

Önceki YazıPHP'de Trait Kullanımı
Sonraki YazıNode.js MongoDB Veri Silme İşlemi
Yorumlar (0)
Bu Yazıya Ait Hiçbir Yorum Bulunamadı (veya admin onaylamadı). İlk Yorum Yapan Sen Ol
Yorum Yapabilirsiniz