Front End Geliştiricisi Nedir? Neleri bilmek gerekir?

Ön Yüz geliştiricinin yol haritası..

Front End Geliştiricisi Nedir? Neleri bilmek gerekir?

Kimdir Bu Web'ciler?

Mobil uygulamaların olmadığı zamanlarda bile bize sadık olan web uygulamaları hala yerini koruyor. Bir Web geliştiricis olmak için bazı izlemeniz gerek yollar vardır. Birkaç programlama dili öğrenip ardından geliştiricisi olamazsınız. Geliştirici olaylarında Junior-Mid-Senior olarak ayrılıyor. Askerlikteki gibi rütbe sistemi vardır. 

 

Junior, genç yazılımcılara verilen isimdir. Sektörde teorik ve uygulama tecrübesi olan ve kendini geliştirmek isteyenlerdir.

Mid, geliştirici ise adından anlaşılacağı gibi senior ve junior yazılımcının ortasına sıkışmış bir kavramdır. 

Vee o kutsal rütbeye geldik. Senior yazılımcılar.. Deneyim bazında 5 yıl ve üstü olarak kabul edilebilir. Bu rakam değişkendir. Ama tecrübe konusunda birçok proje geliştirmiş ve çok sayıda hata çözümünü bilmektedir. Bunları tecrübesiyle test etmiş yazılımcı kategorisine girmektedir.

Peki Web Geliştirmeye Nereden Başlanmalı?

Web geliştirmenin atası olan HTML bilmelidir. Nedir bu HTML? (HyperText Markup language) olarak geçiyor. Yani bir işaretleme dilidir. Programlama değil.! Yapacağınız tasarımın kaba taslağını çizmek gibi düşünebilirsiniz. HTML ile çalışlan bir programala dili yapılamaz. Web tarayıcıları sitenizdeki HTML kodlarını oluşturarak size bir çıktı oluşturur. Böylelikle sitenin tasarımını görmüş olursunuz. Tabii HTML ile başlı başına tasarım yapılamaz. Bunun yanında ek şeyler öğrenmek gerekir. Neler bunlar? CSS(Görselleştirmenin daha iyi olması için),  JavaScript(Dinamik web sayfaları yapmak için)..

 

Web geliştirme olayı üç taraf olarak bölüme ayrılmıştır;

  • Front End Development
  • Back End Development
  • Full Stack Development

Front End, tasarım odaklı bir çalışma şeklidir. Görsel ve tasarım zekanızın olması avantajınıza olacaktır. Tasarlamaktan ve görsel işlerden sıkılmıyorsanız bu alanda çalışmanızca sakın yoktur.

 

Kullanılan bazı diller ve bazı kütüphaneler;

  • JavaScript
  • HTML
  • CSS
  • Ajax
  • Flash
  • JQuery

 

Back End, daha çok bir sistemin arka planında çalışmayı göze almış kişilerdir. Yani sistemin işlemesi, arka planda dönen işlemler ve server-side arasında gidip gelmektedir. Siz bir web sitesinde işlem yaptığınızda veya kaydolduğunuz zaman arka planda dönen işlemleri bu grup yapmaktadır.

Kullanılan Diller;

  • PHP
  • ASP.NET
  • JAVA
  • Ruby on Rails
  • Python(Django)

 

Full Stack ise ikisini bir arada geliştiren kişilere denmektedir. Maaş olarak tabii ki daha yüksektir. Hem tasarımını ve görsel dizaynını yapıp, arka plandaki geliştirmeyi yaparlar.

 

NOT: HTML için çoğu kişinin bildiği popüler kaynaklardan biri olan; .w3schools.com'dan incelemenizi kesinlikle tavsiye ederim. Sadece HTML yok. Birçok programlama dili ve framework vardır. Web geliştirme alanında birçok şeyi bulabilirsiniz. Kesinlikle bakınız.

 

CSS(Cascading Style Sheets)

HTML'den daha fazla görsel etiket ve biçimlendirme için olanak sunmaktadır. HTML ile ana şablon oluşturulur. CSS ile bu oluşturduğumuz şablonlara, deyim yerindeyse makyaj yapılır. Güzelce süslenirler. CSS görsellik için çok önemli bir husustur.

 

 

Bir de sektörde framework denen şeyler duyabilirsiniz. Bunu söylemenin tam vakti olduğunu düşünüyorum. O efsanevi yapılar olan Framework.. Geliştiricilerin kullanabilmesi için önceden içlerine dahil edilmiş özellikler veya geliştiricilerin kendisinin düzenleyebileceği yapılardır. Bir geliştiricinin zamandan kazanması için imdadına yetişmektedir. Böylelikle hazır yapıları kullanarak hızlı işlemler yapabilmekteler. Örneğin; Veritabanı bağlantısı, form kontrolü veya güvenlik için token kontrolü olabilir. Her framework çatısının kendi özellikleri ve kullanılmasının uygun olduğu yerler vardır.

CSS'in Frameworkleri neler peki?

 

 

Fotoğrafta gördüğünüz gibi birçok isimleri var. En çok kullanılanlar ve duyabilcekleriniz aşağıdadır. En çok kullanılanı Bootstrap olarak görebiliriz.

  • Bootstrap
  • Materialize

  • Semantic UI

 

Peki iyi ama bize bunun avantajı nedir? Neden öğreneyim?

  • En önemli sebeplerinden biris size oldukça önemli bir zaman kazandırmasıdır.
  • Düzenli ve temiz kod görünümü sağlamaktadır. Ekip arkadaşlarınız ile daha kolay entegre olmanızı sağlamaktadır.
  • Günceldir ve sürekli yeni özellikler gelmektedir.
  • Daha önce bahsettğimiz gibi, içlerinde bazı tanımlı işlemler ve fonksiyonlar gelmektedir.
  • İş görüşmeleride avantajınız olur.

 

Dezavantajları nedir peki? Yok mudur? Elbette vardır..

  • Projelere göre framework seçimi değişebilmektedir. Her framework biriminin kendi has özellikleri vardır.
  • Normal kodlamaya göre daha yavaş çalışabilir. Çünkü içinde bazı dosya sistemleri vardır. 
  • Öğrenmeniz biraz zaman alabilir
  • İçinde bazı fonksiyonlar hazır geldiğinden programlama bilginizi unutma ihtimaliniz var. Bildiklerinizi sürekli canlı tutmalısınız

 

JavaScript Nedir?

Javascript dinamik bir web sitesi oluşturmak için kullanılan bir programlama dilidir. HTML ile ana şablonu oluşturduğumuz, css ile görünüm kazandırdığımız web sitesine canlılık katarak onun adeta yaşamasını sağlar. Nesne tabanlı programlamaya sahip, yorumlanmış bir programlama dilidir. Hareketleri, animasyonları ve anlık uyarıları javascript ile yapmak mümkündür. Front End tarafında kullanıldığı gibi, sunucu tarafında da kullanılabilir(Node.js)

 

En çok kullanılan Frameworkleri ise;

Angular, React, Vue.js, Node.js, Backbone.js olarak geçer. 

 

Evet bu konumuzda front end ve basit web geliştiriciliği adımlarını incelemeye çalıştık. Diğer yazımızda back end geliştirme tarafına değineceğiz. İnternetten birçok kaynak bulabilirsiniz. Udemy'de bulunan ücretli kurslardan veya YouTube'dan ücretsiz olarak yararlanabilirsiniz.

NOT: Burada bulunan yol haritasından yararlanabilirsiniz.

 

KAYNAKÇA:

https://tr.wikipedia.org/wiki/HTML

https://en.wikipedia.org/wiki/CSS_framework

https://geekflare.com/best-css-frameworks/

https://www.acarnet.com/blog/framework-nedir-neden-kullanilmalidir/

https://sanalkurs.net/roportajlar/php-ve-framework-ler-irfan-evrens

https://hackr.io/blog/best-javascript-frameworks

https://skillcrush.com/blog/javascript/

https://www.tutorialspoint.com/javascript/javascript_overview.htm

https://gelecegiyazanlar.turkcell.com.tr/konu/web-programlama/egitim/301-javascript/javascript-nedir