Back-End / Front-End Nedir?


Optimist Hub Team 29/12/2017
23/09/2020 Tarihinde Güncellendi

Okunma   Beğeni


Backend ve frontend nedir ve aralarındaki fark nedir?Artık birçok web sitesi dinamik olmak ve her bir kullanıcısı için özel içerik sunmak üzere tasarlanıyor. Tarayıcınızı açıp favori web sitenizde kendi hesabınıza giriş yapıyorsunuz, kendi paylaşımlarınıza ve arkadaşlarınıza ulaşıyorsunuz. Web sitesi sizin arkadaşlarınızı nereden biliyor? Yazdığınız ve paylaştığınız her şeyi nereden hatırlıyor? İşte back-end geliştiriciler tam da bu noktada devreye giriyor. Web sitesine giriş yaptığınızda sunucunuz tarayıcınızdan bir talep alıyor ve sizinle bağlantılı olan bütün verileri arka plandan alıp size sunuyor.

Back-End Nedir? Back-End Developer Kimdir?

Tanımlandığı kelime öbeğinden de anlaşılacağı üzere, bir web projesinin son kullanıcının görmediği çekirdek yazılım kısmına Back-End ve bu mimariyi kodlayan yazılımcıya ise Back-End Developer, yani yazılım geliştirici denir. Back-End altyapısı için kullanılan yazılım dilleri; genelleme yaparak aşina olduğumuz PHP ve ASP.net, veritabanı mimarisi için ise MYSQL ve MSSQL’dir. Mimaride kullanılan bu bileşenler ile örneğin bir CMS (Content Management System – İçerik Yönetim Sistemi) oluşturmak ve bir web sitesinde kullanıcı dostu bir admin panel vasıtası ile her bir sabit – statik alanı dinamik olarak yönetilebilir kılmak mümkündür.

Front-End Nedir?

Back-end kısmı olarak veri tabanında kullanıcı datalarına sahip olmak güzel; ancak diğer yandan web sitenizin görüntüsünü iyi yapan şey ne? İşte bu noktada Front-end devreye giriyor. Ziyaret edilen her sayfa için güzel bir görünüm ve iyi bir his yaratıyor. Başka bir deyişle direkt etkileşime geçtiğiniz ve gözünüzle görebildiğiniz her sayfa için renk, fon ve diğer tüm stilleri oluşturuyor. Web sitesi kullanıcılarına marka kimliğini yansıtıp duygusal deneyim yaşatıyor.

Front-End için ise; HTML, CSS ve JavaScript programlama dilleri kullanılıyor. Bu programlama dilleri web sitesinin size yansıyan görünüşüne odaklanıyor. Front-End kısmında işleyişi şöyle bir hiyerarşik liste ile özetlemekte yarar var:

UID (User Interface Designer – Kullanıcı Arayüzü Tasarımcısı ya da Web Arayüz Tasarımcısı) tarafından öncelikle grafik düzlemde web arayüz tasarımının hazırlanması,
UXD (User Experience Designer – Kullanıcı Deneyimi Tasarımcısı) tarafından UX geliştirmelerin ilk fazının tamamlanması,
Tasarımın / projenin Back-End Developer ve marka için anlamlı kılınması adına Wireframe olarak marka onayına sunulması.

Burada bizler PDF formatta taslak çizim / sunum yerine, marka kurumsal kimliğini, görsel ve söylemlerini barındıran, bir anlamda sitenin bitmiş halinin marka tarafından algılanıp kısmen deneyimlenebileceği online sunumları tercih etmekteyiz.

Wireframe onayı sonrasında projenin Front-End Developer’e evrensel Front-End standartlarında aktarımı için; brief döküman eşliğinde PSD versiyonunun, projede yer alan tüm sayfalar, alt sayfalar ve tüm alt kırılımları içerir şekilde iletilmesi (örneğin bir e-ticaret projesinde tasarlanması gereken sayfa sayısı minimum 35 adettir).

Bu aşamada Front-End kısmında tasarımın html css’e dökülmesi olarak tanımladığımız kodlanması yapılır. UI kodlamasında ise günümüzdeki en önemli unsurlar; temiz kodlama, schema.org ve W3C School kriterlerine uyum, AMP ve Rich Snippet’in olması, kodlamanın LESS veya SASS gibi disiplinler kullanılarak dinamik olarak yazılması gibi ana başlıklarda sıralanabilir.

front-end ve back-end nedir?

Back-End ise adı üstünde kodlamanın arka yüz kodlaması için kullanılan bir yazılım tabiridir. Bu alanda nihai kullanıcı için görsel anlamda bir farklılık sezilmese de sitenin doğru çalışması anlamında Back-End Developer’a çok iş düşer. Tıpkı Front-End’de olduğu gibi; Back-End kısmında da elbette projeler tek bir yazılım geliştirici üzerinden ilerlemiyor. Projenin oluşumunda bir analiz uzmanının data mining yapması, proje road map’ini oluşturması, proje büyüklüğüne göre farklı title ve sayıda geliştirici ile oluşturulan ekibe görevlerini deklare etmesi gerekir. Burada proje yöneticisinin de farklı alanlarda minimum 7-8 proje bitirme tecrübesinin olması gerekli. Yeri gelmişken bazı yanlış algılara da değinmekte yarar var. Bir yazılım mühendisinin yazılım alanında her bir yazılım dilini veya framework’lerin tamamını sular seller gibi bilmesi diye bir şey söz konusu olamaz.

Back-end nedir konusunda Steve Jobs’un kısa ve basit tanımına katılmamak elde değil:

“Tasarım bir şeyin yalnızca nasıl göründüğü ve nasıl hissettirdiği ile ilgili değildir. Tasarım bir şeyin nasıl çalıştığıyla da alakalıdır..’’.

Özetleyecek olursak Back-End; projenin mutfağı olan server side ile web sitesinin düzgün çalışmasını sağlayan arka plan kısmını kapsıyor ve ön yüz ile veri alışverişine cevap verip verileri saklıyor. Front-End ise; web sitesinde kullanıcıların gördüğü ve direkt etkileşimde bulundukları ön yüzü kapsayıp kullanıcının back-end katmanı ile veri alışverişi yapabilmesini sağlıyor.

Örneğin bütün süreci bir tiyatro oyunu gibi düşünürsek; sahne arkasındaki tüm senaryo, kurgu, ezber vb. süreçleri arka yüz yani back-end sayıp, sahnede görünen oyunu da ön yüz yani front-end sayabiliriz.

Back-End ve Front-End kavramlarından sonra, son olarak şunu belirtmekte fayda var; yakın geçmişe kadar web sitelerini tamamlayıp yayına aldığımızda proje bitmiş olarak kabul edilirdi. Günümüzde ise aslında her şey bitti dediğimiz yerde başlamakta. Tasarım bitmeyen bir serüvendir. Arka planda son kullanıcının hareketlerini ısı haritası üzerinden takip etmek; site paneli üzerinden kullanıcıların hangi adımlarda takıldığını, Analytics toolları üzerinden sayfanızda ne kadar kaldığı, hangi aşamalarda siteyi terk ettiklerini tespit etmek mümkün. Haliyle tasarımımızın kullanıcılara daha iyi bir deneyim yaşatmak için; Front-End kodlamasının scheme.org, W3C School, SEO friendly perspektifinde güncellenmesi gerekmekte. Bu durum Back-End tarafında da geçerli; yazılımın güncel teknolojiyle evrilen bir mimaride ve siber güvenlik gereksinimleri doğrultusunda güncelleniyor olması gereklidir.

En güncel gelişmelerden haberdar olmak için E-posta listemize katılın

  Beğeni

Optimist Hub Team

Optimist Hub Team

Optimist Hub; yazılım, tasarım ve pazarlama yetenekleri ile işletmelere büyük dijital çözümler sunan, müşteri deneyimi odaklı 360 Dijital Ajans.

13 yorum

  1. Suat kocak

    Selamlar back end developer bilen bir kişiyle projem için röportaj yapmam gerekiyor. Tanıdığın biri var mı?

  2. cenk

    Konuyu tamamen yazınızla öğrenmiş biri olarak şöyle bir çıkarımda bulundum; bazı siteler yapım aşamasında ve sonraki süreçlerde işin back-end kısmına gerekli önemi vermiyorlar. Front-end’te gördüğümüz göze hoş gelen ama kırık linkler, açılmayan sayfalar bunu gösteriyor sanırım. Ellerinize sağlık.

  3. Evet Cenk Bey çok haklısınız. Bir çok web sitesi kırık linkler ve hatta hatalı linklemeler ile dolu.
    Yalnız, kırık link (broken link) konusu, yazılımın konusu olmayıp, içerikleri oluşturan admin / webmaster her kim ise onun hatası olup, ayrıca yine site yöneticisinin takip etmesi gereken bir durumdur. Bugün Google Search Console bunun için var. Bir webmaster’ın bu tarz aldığı uyarılar karşısında yapacağı işlem, 404’e düşen eski kaldırılmış sayfalar için 301 yönlendirme (rewrite) işlemi yaparak sorunu çözmek, ziyaretçilerin negatif deneyim yaşamasının önüne geçmek olmalıdır.
    Umuyoruz ki yakın bir gelecekte Back-End ve Frond-End’e ve de webmaster (web yöneticisi) meslekleri – kavramları gereken önem – saygıyı görecektir, daha kullanışlı siteler ortaya çıkacaktır.

  4. FATİH ÇAKIR GÜNDOĞAN

    Merhaba,
    Backend dillerinden hangisini öncelikli olarak tavsiye edersiniz. Sadece freelancer olarak çalışacağım.

  5. Temel – genel tanımlama olarak iki dil var; PHP ve .net.
    Her ikinin de geçerliliği ve geleceği var elbet.
    Önemli olan bu diller altındaki farklı kodlama disiplinleri deneyimlemek, merak etmek, çaba göstermek.
    Elbette hangisi sizlere daha sıcak geliyor ise, onu tercih etmelisiniz.
    Sevgiler.

  6. barış

    Bu işe meraklı olanlara oldukça yararlı bir yazı olmuş. Hatta kendini tırnak içinde ”profesyonel” olarak adlandıran birçok site sahibi ve web site tasarımı yapan kişilerin de dikkat etmesi gereken detaylar mevcut.

  7. Selamlar Barış;
    Amatör ruhla profesyonel yaklaşım sergilemek ve günceli takip etmek önemli olan.
    Biliyorum demektense, öğreniyorum demek daha doğru bir yaklaşım olacaktır.
    Sevgiler.

  8. Barış

    Bu işe meraklı olanlara oldukça yararlı bir yazı olmuş. Hatta kendini tırnak içinde ”profesyonel” olarak nitelendiren birçok site sahibi ve web site tasarımı yapan kişilerin de dikkat etmesi gereken detaylar mevcut.

  9. Geri bildirimleriniz için teşekkür ederiz Barış Bey;
    Sevgiler.

  10. mahmut

    Merhaba,back-end kısmıyla ilgilenmek istiyorum bunun için belli bir alt yapı olması gerekiyor mu yoksa sıfırdan başlanılıp öğrenilebilir mi ? Bir de back-end ile ilgilenmek için front-end bilmek gerekir mi? teşekkürler

  11. Serkan Çifci

    Bilgisayar mühendisliği öğrencisiyim ve back-end’e yönelmek istiyorum ama ne yapacağımdan tam olarak emin değilim. Fikir vermek isteyen olursa çok memnun olurum.

  12. miray

    Front-end freelance çalışacak birisi için önerileriniz nelerdir?

  13. Merhabalar;
    Tavsiyelerimiz aşağıdaki gibidir:
    Basit bile olsa, protokol olmaksızın hiçbir projeye girişmeyiniz.
    Mutlaka ilkelerimiz, metotlarımız ve prensiplerimiz olmalı.
    Front-end’in sadece bir tasarımı HTML CSS’e dökmenin ötesinde bir kavram olduğunun bilincinde olmalıyız.
    BEM metodolojisini uygulama, JS yerine typscript, pixel yerine REM kullanımı ve benzeri clean code ilkelerini uygulamakta öncü olmalıyız.
    Özellikle tasarımın website’a entegrasyonu noktasında rol almanız gerekebilir; bu back-end’in işidir deyip geçemeyeceğimiz bir dünyaya doğru ilerliyoruz.
    Şimdilik bu kadar söyleyeceklerimiz.
    İlgilerinize teşekkür ederiz.

barış yorumuna cevap yazın Cevabı iptal et

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

Güncellemelerden ilk siz haberdar olmak ister misiniz?