Frontend, bir web sitesinin ya da uygulamanın kullanıcının gördüğü ve dokunduğu kısmıdır: sayfa düzeni, butonlar, formlar, menüler. Backend ise kullanıcının görmediği arka taraftır: verinin saklandığı veritabanı, form gönderildiğinde çalışan kurallar, kullanıcı girişi ve güvenlik kontrolleri. Bir projede "frontend ve backend nedir" sorusunun cevabı aslında "işin hangi kısmını kim yapıyor ve bütçe nereye gidiyor" sorusunun cevabıdır.
Kısaca
- Frontend (ön yüz): Tarayıcıda ya da telefonda çalışan, kullanıcının gördüğü katman. HTML, CSS ve JavaScript ile yazılır.
- Backend (arka yüz): Sunucuda çalışan, veriyi işleyen ve saklayan katman. PHP, Python, Node.js gibi dillerle yazılır.
- İki taraf genellikle bir API üzerinden konuşur: ön yüz istek gönderir, arka yüz cevap verir.
- Basit bir tanıtım sitesinde backend işi azdır; panel, üyelik, teklif ya da sipariş gibi özellikler eklendikçe backend payı büyür.
- Teklif karşılaştırırken "bu proje ne kadar ön yüz, ne kadar arka yüz işi?" diye sormak bütçeyi anlamanın en kısa yoludur.
Frontend nedir?
Frontend (ön yüz), kullanıcının ekranda gördüğü her şeydir. Örneğin bir ziyaretçi sitenize girdiğinde tarayıcı, sunucudan gelen dosyaları okur ve sayfayı çizer. Bu dosyalar üç temel dille yazılır:
- HTML sayfanın iskeletini kurar: başlık, paragraf, görsel, form. (Ayrıntı için: HTML Nedir?)
- CSS görünüşü belirler: renk, yazı tipi, boşluk, mobil uyum. (Bkz. CSS Nedir?)
- JavaScript etkileşim ekler: açılır menü, form kontrolü, kaydırma efektleri. (Bkz. JavaScript Nedir?)
MDN Web Docs'un anlatımıyla, istemci tarafı (client-side) kod tarayıcıda çalışır. Görevi sayfanın görünüşünü ve davranışını iyileştirmektir: arayüz bileşenleri, yerleşim, gezinme, form doğrulama. Ayrıca bu kodun işletim sistemine erişimi yok denecek kadar azdır. Yani ön yüz, verinizi kalıcı olarak saklayamaz; yalnızca gösterir ve kullanıcıdan alır.
Bu yüzden frontend işi tasarımla iç içedir. Bir arayüz tasarımı (UI) ne kadar iyi olursa olsun, ön yüz geliştiricisi onu farklı ekran boyutlarında ve tarayıcılarda doğru çalışır hale getirmek zorundadır. Arayüz tarafını merak ediyorsanız Kullanıcı Arayüzü (UI) Nedir? yazımıza bakabilirsiniz.
Backend nedir?
Backend (arka yüz), sunucuda (server) çalışan kısımdır. MDN'e göre sunucu tarafı kodun ana işi, gelen isteğe göre tarayıcıya hangi içeriğin gönderileceğine karar vermektir. Bunun içinde şunlar vardır:
- Gönderilen formu ve isteği doğrulamak,
- Veritabanına kayıt yazmak ve oradan veri okumak,
- Kullanıcı girişi, yetki ve oturum yönetimi,
- E-posta göndermek, başka sistemlerle (ödeme, kargo, muhasebe) konuşmak.
Arka yüz kodu PHP, Python, Ruby, C# ya da JavaScript (Node.js) gibi pek çok dille yazılabilir. Dili geliştirici seçer. Bu kod sunucunun işletim sistemine tam erişime sahip olduğu için güvenlik sorumluluğu da büyüktür. Sunucunun kendisini merak ediyorsanız Sunucu Nedir? yazımız bu konuyu anlatıyor.
Kısaca: ön yüz verinin nasıl görüneceğini, arka yüz hangi verinin gönderileceğini belirler.
İki taraf nasıl konuşur?
Bir restoran düşünün. Salon (frontend) müşterinin gördüğü yerdir: masa düzeni, menü, servis. Mutfak (backend) görünmez ama yemeği o hazırlar. Garson da iki taraf arasında siparişi taşır. Yazılımda bu garsonun adı genellikle API'dir (Application Programming Interface, uygulama programlama arayüzü).
Örnek bir akış:
- Ziyaretçi iletişim formunu doldurup "Gönder"e basar (ön yüz).
- Tarayıcı, form verisini sunucuya bir istek olarak gönderir.
- Sunucudaki kod alanları kontrol eder, kaydı veritabanına yazar, size bildirim e-postası atar (arka yüz).
- Sunucu "başarılı" cevabını döner; ön yüz ekranda "Mesajınız alındı" yazar.
Kullanıcı yalnızca 1. ve 4. adımı görür. Ancak projenin emeği çoğu zaman 2. ve 3. adımdadır.
Projenize ve bütçenize etkisi
Bir web ya da yazılım teklifi aldığınızda iş kalemleri genellikle bu iki tarafa dağılır. Hangisinin ağır bastığını bilmek, teklifleri doğru karşılaştırmanıza yardım eder.
| Proje tipi | Ön yüz payı | Arka yüz payı | Örnek |
|---|---|---|---|
| Tanıtım (kurumsal) sitesi | Yüksek | Düşük; hazır içerik yönetim sistemi çoğunu karşılar | Hizmet sayfaları, iletişim formu |
| E-ticaret sitesi | Orta | Orta–yüksek; ürün, stok, ödeme, kargo | Sepet, ödeme adımları |
| Müşteri paneli, CRM, iş takip uygulaması | Orta | Yüksek; kurallar, roller, raporlar, entegrasyonlar | Teklif, servis kaydı, raporlama |
| Mobil uygulama | Yüksek (iki platform) | Uygulamanın arkasındaki sunucu tarafına göre değişir | Üyelik, bildirim |
Elbette bu tablo yalnızca genel bir eğilimi gösterir. Her projenin kapsamı ayrıca değerlendirilir.
Birkaç pratik sonuç:
- "Sadece bir ekran" diye tarif edilen işler büyüyebilir. Ekranda tek bir buton görünse de arkasında yetki kontrolü, kayıt, e-posta ve raporlama olabilir.
- Tasarım değişikliği çoğunlukla ön yüzü etkiler. Renk, yerleşim ya da metin değişikliği genelde arka yüze dokunmaz.
- Kural değişikliği arka yüzü etkiler. "Teklif onaylanınca muhasebeye de düşsün" gibi bir istek, arka yüz ve entegrasyon işidir.
- Barındırma (hosting) ihtiyacı arka yüzle büyür. Veritabanı ağırlıklı bir uygulama, basit bir tanıtım sitesinden farklı sunucu kaynakları ister.
Full-stack ne demek?
Hem ön yüz hem arka yüz geliştirebilen kişiye ya da ekibe "full-stack" denir. Küçük ve orta projelerde tek bir full-stack ekip işi baştan sona götürebilir. Büyük projelerde ise iki taraf ayrı uzmanlar tarafından yürütülür, çünkü her birinin derinliği ayrı bir uzmanlık ister. Sizin için önemli olan unvan değil, iki tarafın da sorumlusunun belli olmasıdır.
Sık yapılan hatalar
- Yalnız ekran tasarımını onaylamak. Tasarım onayı, "bu ekran hangi veriyi nereden alıyor, kim düzenliyor?" sorularını cevaplamaz. Arka yüz kuralları da yazılı olarak netleşmelidir.
- Güvenliği ön yüze bırakmak. Formdaki kontroller (ör. "e-posta alanı boş olamaz") kullanıcıya kolaylık sağlar ama güvenlik sağlamaz. Asıl kontrol sunucuda yapılmalıdır, çünkü tarayıcıdaki kod kullanıcı tarafından değiştirilebilir.
- Arka yüzü kimin barındırdığını bilmemek. Sunucu, veritabanı ve yedekler kimin hesabında? Özellikle proje biterken bu bilgilerin size teslim edildiğinden emin olun.
- Bakımı yalnız tasarım olarak düşünmek. Arka yüzdeki dil ve kütüphane sürümleri de güncelleme ister. Bu konuyu Web Sitesi Bakımı Neden Gerekli? yazımızda anlattık.
Bizim deneyimimiz
Kurumsal web projelerimizin büyük çoğunluğunu WordPress üzerinde yapıyoruz. Bu yapıda ön yüz, tema ve Elementor ile kurulan sayfalardır. Arka yüz ise WordPress'in sunucuda çalışan PHP kodu ve MySQL veritabanıdır. İçerik yönetimi hazır geldiği için bu projelerde emeğin çoğu ön yüze, yani tasarım, mobil uyum ve hıza gider. Örneğin Tuğra Karot sitesinde hizmet bazlı, SEO uyumlu sayfa yapısı ve telefon ile WhatsApp aksiyonları ön plandaydı.
Panel, CRM ya da iş takip uygulaması gibi özel yazılım işlerinde ise tablo tersine döner: kurallar, roller, raporlar ve entegrasyonlar arka yüzde yoğunlaşır. Bu nedenle projelerimizde teklif aşamasında iki tarafı ayrı ayrı yazıya döküyoruz. Böylece "bu ekranın arkasında ne çalışıyor?" sorusu baştan cevaplanmış oluyor.
Sık sorulan sorular
Frontend mi daha zor, backend mi?
İkisi farklı zorluklar taşır. Ön yüzde zorluk, çok sayıda ekran boyutu, tarayıcı ve kullanıcı davranışıdır. Arka yüzde ise veri tutarlılığı, güvenlik ve performanstır. Sonuç olarak projenin hangi tarafı daha ağırsa, uzmanlık ve bütçe de o tarafa kayar.
Bir web sitesi backend olmadan çalışır mı?
Yalnızca sabit (statik) sayfalardan oluşan bir site, arka yüz kodu olmadan sunulabilir. Ancak form, içerik yönetimi, üyelik ya da sipariş gibi bir özellik eklendiğinde veriyi işleyecek bir arka yüz gerekir. Kurumsal sitelerde bu ihtiyacı genellikle WordPress gibi bir içerik yönetim sistemi karşılar.
Teklifte frontend ve backend ayrı mı yazılmalı?
Zorunlu değil ama faydalı. İki tarafın ayrı yazılması, kapsamı daha net gösterir ve sonradan "bu da dahil mi?" tartışmalarını azaltır.
Frontend ile UI tasarım aynı şey mi?
Değil. UI tasarımı ekranın nasıl görüneceğini tasarlar; frontend geliştirme bu tasarımı çalışan koda dönüştürür. Bazı ekiplerde aynı kişi iki işi de yapabilir, ama iki ayrı beceridir.
Sonuç
Frontend ve backend, bir yazılım projesinin iki yarısıdır: biri kullanıcıyla, diğeri veriyle ilgilenir. Projenizin hangi yarısının ağır bastığını bilmek, teklifleri karşılaştırmanızı, öncelik belirlemenizi ve sonradan sürprizlerle karşılaşmamanızı sağlar. Bir web sitesi ya da özel bir uygulama planlıyorsanız Web Tasarım ve Yazılım ve Dijital Çözümler sayfalarımıza göz atabilir ya da bizimle iletişime geçebilirsiniz.
Grafik Sanat'ta öğrenin: Konuyu görselli anlatım ve testlerle öğrenmek için → grafiksanat.com.tr/terim/frontend-backend
Kaynaklar2
- MDN Web Docs — Introduction to the server side (istemci ve sunucu tarafı kodun karşılaştırması). — erişim: 2026-10 developer.mozilla.org
- MDN Web Docs — API (sözlük). — erişim: 2026-10 developer.mozilla.org
