Frontend, Backend, Full-Stack Ne Demek?

Bir web sitesinde gördüğün her şey ve görmediğin her şey iki dünyaya ayrılır: önde olanlar ve arkada olanlar.

Okuma süresi: 10–12 dakika Seviye: Başlangıç Konu: Frontend, backend, full-stack

İçindekiler

1. Önce büyük resim
2. Frontend nedir?
3. Backend nedir?
4. Bir örnek: Giriş yapma
5. Full-stack nedir?
6. Karşılaştırma tablosu
7. Nereden başlamalı?
8. Sık sorulan sorular

1. Önce büyük resim

Bir web sitesini ya da uygulamayı iki ana parçada düşünebilirsin:

• Frontend (ön yüz): Kullanıcının gördüğü ve dokunduğu her şey.
• Backend (arka yüz): Kullanıcının görmediği, arkada çalışan kısım.

Bir otomobil gibi düşün: direksiyon, koltuk, gösterge paneli ve renk ön yüzdür; motor, yakıt sistemi ve elektronik kontrol arka yüzdür. Sürücü motoru görmez ama araba onsuz yürümez.

2. Frontend nedir?

Frontend, tarayıcıda çalışan ve kullanıcıyla doğrudan etkileşen kısımdır. Şunları kapsar:

• Sayfanın yapısı (başlıklar, paragraflar, görseller, formlar)
• Görünümü (renkler, yazı tipleri, boşluklar, düzen)
• Etkileşimi (butona tıklama, menü açma, form kontrolü, animasyon)
• Mobil uyumluluk, yani farklı ekran boyutlarına uyum

Temel teknolojiler:

Bunların üzerine React, Vue, Angular gibi çerçeveler (framework) ve kütüphaneler ile Tailwind, Bootstrap gibi stil araçları eklenir. Ama bunlara geçmeden önce üçlüyü iyi öğrenmek önemlidir.

3. Backend nedir?

Backend, sunucuda çalışan ve kullanıcının doğrudan görmediği kısımdır. Şunlardan sorumludur:

• Veriyi saklama ve okuma (veritabanı işlemleri)
• Kullanıcı girişi ve yetkilendirme (kim, neye erişebilir?)
• İş mantığı (sipariş toplamı hesaplama, stok kontrolü)
• API'ler aracılığıyla frontend'e veri sağlama
• Güvenlik (parola saklama, saldırılara karşı önlem)
• E-posta gönderme, ödeme alma gibi arka plan işleri

Sık kullanılan teknolojiler:

• Diller: Python, JavaScript (Node.js), PHP, Java, C#, Go, Ruby
• Çerçeveler: Django, Flask, FastAPI, Express, Laravel, Spring
• Veritabanları: MySQL, PostgreSQL, SQLite, MongoDB
• Sunucu ve dağıtım: Linux, Nginx, bulut hizmetleri

Backend geliştirici, sitenin "beyni ve hafızası" üzerinde çalışır.

4. Bir örnek: Giriş yapma

Bir sitede kullanıcı adı ve parolanla giriş yaptığında olanlar:

1. Frontend: Giriş formunu gösterir. Alanlar boşsa uyarır. Butona basınca bilgileri gönderir.
2. Backend: Bilgileri alır, veritabanında kullanıcıyı arar, parolayı güvenli şekilde kontrol eder.
3. Backend: Sonucu (başarılı veya hatalı) frontend'e geri yollar.
4. Frontend: Başarılıysa seni ana sayfaya yönlendirir, hatalıysa "Parola yanlış" mesajı gösterir.

İkisi arasındaki iletişim çoğunlukla bir API üzerinden yapılır. Yani frontend istek yapar, backend cevap verir.

5. Full-stack nedir?

Full-stack geliştirici, hem frontend hem backend tarafında çalışabilen kişidir. Yani bir uygulamayı baştan sona, arayüzden veritabanına kadar geliştirebilir.

Avantajları:

• Tüm sistemi anladığı için bütünü görebilir.
• Küçük projelerde ve girişimlerde tek başına ürün çıkarabilir.
• Ekip içinde iki taraf arasında köprü olabilir.

Dikkat edilecekler:

• Her alanda aynı derinliğe ulaşmak zaman alır.
• "Her şeyi biraz bilen" yerine "temelleri sağlam, bir alanda güçlü" olmak genelde daha iyidir.

Yeni başlıyorsan "full-stack olacağım" hedefi güzel bir yol haritasıdır ama bunu adım adım yapmalısın.

6. Karşılaştırma tablosu

7. Nereden başlamalı?

Önerilen basit yol:

1. HTML: Sayfa yapısını öğren. Başlık, liste, form, bağlantı.
2. CSS: Renk, boşluk, flexbox ve grid ile düzen.
3. JavaScript: Değişkenler, döngüler, fonksiyonlar ve DOM ile sayfayı hareketlendirme.
4. Git ve GitHub: Kodunu saklamayı ve paylaşmayı öğren.
5. Küçük projeler: Kişisel sayfa, yapılacaklar listesi, hesap makinesi.
6. Backend'e geçiş: Python veya Node.js ile basit bir API yaz.
7. Veritabanı: SQL temellerini öğren, API'ni veritabanına bağla.
8. Kendi full-stack projen: Giriş yapılabilen basit bir uygulama geliştir.

Hangisi daha kolay? Frontend sonucu hemen gözle görmek açısından başlangıç için daha motive edicidir. Backend ise mantık ve veriyle ilgilenmeyi sevenlere hitap eder. İkisini de denemek en doğrusu.

8. Sık sorulan sorular

Frontend mi backend mi daha zor?

Biri diğerinden kesin olarak zor değildir; farklı beceriler ister. Frontend'de tarayıcı ve cihaz çeşitliliği, backend'de güvenlik ve veri tutarlılığı zorluk yaratır.

Tasarımcı ile frontend geliştirici aynı şey mi?

Hayır. Tasarımcı görünümü planlar (Figma gibi araçlarla), frontend geliştirici bu tasarımı çalışan koda dönüştürür.

JavaScript hem frontend hem backend'de kullanılabilir mi?

Evet. Tarayıcıda frontend için, Node.js ile backend için kullanılır. Bu yüzden full-stack'e başlamak isteyenler için popüler bir seçimdir.

İlk dil olarak ne seçmeliyim?

Web ile ilgileniyorsan HTML, CSS ve JavaScript ile başla. Genel programlamayı öğrenmek istiyorsan Python iyi bir başlangıçtır.

Özet

Kendini dene

• Beğendiğin bir sitede hangi kısımların frontend olduğunu göster.
• Aynı sitede backend'in ne yapıyor olabileceğini tahmin et.
• Basit bir HTML sayfası yaz.
• Sayfaya CSS ile renk ve düzen ekle.
• Bir buton ekleyip JavaScript ile tıklanınca mesaj göster.

Son söz: Frontend'le kullanıcıya dokunur, backend'le sistemi ayakta tutarsın. Hangisini seçersen seç, ikisinin birbirini nasıl tamamladığını bilmek seni daha iyi bir geliştirici yapar.

Bu yazı eğitim amaçlıdır. Ayrıntılar sürüme ve işletim sistemine göre farklılık gösterebilir.