Backend mi Frontend mi? İki Geliştirici Rolünü Yan Yana Koymak

Bir web uygulamasının iki yüzü

Bir e-ticaret sitesinde ürün listesine bakıp sepete ürün eklediğinizi düşünün. Ekranda gördüğünüz düzen, düğmeler, filtreler, sepet simgesinin güncellenmesi ve sayfanın telefonda da düzgün görünmesi frontend geliştiricinin işidir. Frontend, tarayıcıda ya da mobil uygulamada çalışan, kullanıcıyla doğrudan etkileşen katmandır.

Sepete ekle düğmesine bastığınızda arka planda olanlar ise backend tarafıdır: isteğin kimden geldiğinin doğrulanması, stokun kontrol edilmesi, fiyatın ve kampanyanın hesaplanması, sepetin veritabanına yazılması ve sonucun frontend'e geri dönmesi. Backend, sunucuda çalışan, veriyi saklayan, iş kurallarını uygulayan ve bunları API'ler aracılığıyla dışarıya açan katmandır. İki rol aynı ürünü farklı uçlardan inşa eder ve aralarındaki sözleşme çoğunlukla bir API'dir.

Ortak zemin

İki rol de yazılım geliştirmenin temel disiplinlerini paylaşır: Git ile sürüm kontrolü, kod incelemesi, otomatik testler, temiz ve okunabilir kod, hata ayıklama, sürekli entegrasyon ve dağıtım hatları. İkisi de HTTP'nin nasıl çalıştığını, JSON gibi veri biçimlerini, kimlik doğrulama kavramlarını ve temel güvenlik ilkelerini bilmek zorundadır.

Dil açısından da örtüşme artmıştır. JavaScript ve TypeScript hem tarayıcıda hem Node.js ile sunucuda çalıştığı için aynı dilde iki tarafı yazmak mümkündür. Next.js gibi çatılar sunucu tarafında çalışan bileşenlerle arayüz ve sunucu tarafını aynı projede birleştirir. Bu yüzden sınır bulanıklaşsa da sorumluluk alanları ve düşünme biçimleri belirgin biçimde farklıdır.

Temel farklar ölçüt ölçüt

• Çalıştığı ortam: Frontend tarayıcıda ya da kullanıcının cihazında çalışır / Backend sunucuda, bulutta ya da konteynerde çalışır.
• Ana sorumluluk: Frontend arayüz, etkileşim, erişilebilirlik ve kullanıcı deneyimi sağlar / Backend veri modeli, iş kuralları, API, güvenlik ve entegrasyonlardan sorumludur.
• Tipik teknolojiler: Frontend HTML, CSS, JavaScript ya da TypeScript ile React, Vue, Angular gibi kütüphane ve çatılar kullanır / Backend Node.js, Java, C#, Python, Go gibi dillerle PostgreSQL, MongoDB gibi veritabanları ve mesaj kuyrukları kullanır.
• Başarı ölçüsü: Frontend için sayfanın hızlı açılması, akıcı etkileşim ve farklı cihazlarda tutarlı görünüm önemlidir / Backend için doğru sonuç, düşük yanıt süresi, yük altında ölçeklenme ve veri bütünlüğü önemlidir.
• Çalıştığı paydaşlar: Frontend tasarımcı ve ürün yöneticisiyle yakın çalışır / Backend veritabanı yöneticisi, DevOps ve diğer servis ekipleriyle yakın çalışır.
• Hata türleri: Frontend'de tarayıcı uyumsuzluğu, durum yönetimi karmaşası ve görsel kaymalar öne çıkar / Backend'de eşzamanlılık sorunları, yavaş sorgular, veri tutarsızlığı ve güvenlik açıkları öne çıkar.
• Geri bildirim döngüsü: Frontend'de yapılan değişikliğin sonucu ekranda hemen görülür / Backend'de sonuç çoğunlukla log, test ve izleme panelleri üzerinden görülür.

Bir iş gününden kesitler

Örneğin aynı ürün ekibinde çalışan bir frontend ve bir backend geliştiricinin gününe bakalım; aynı özellik üzerinde çalışsalar da gün içinde çözdükleri problemler oldukça farklıdır.

Frontend geliştirici sabah tasarımcının hazırladığı yeni ödeme ekranını inceler, bileşenlere ayırır ve form doğrulamasını yazar. Öğleden sonra ekranın klavyeyle gezilebilir olduğunu ve ekran okuyucuyla anlamlı okunduğunu kontrol eder. Yavaş açıldığı bildirilen bir sayfada gereksiz yeniden çizimleri bulur, görselleri tembel yüklemeye geçirir ve değişikliği bileşen testleriyle güvenceye alır.

Backend geliştirici aynı ödeme akışı için sipariş oluşturma uç noktasını tasarlar: istek gövdesi nasıl olacak, hangi hata kodları dönecek, aynı istek tekrar gelirse mükerrer sipariş nasıl engellenecek? Veritabanında stok düşme ve sipariş kaydını aynı işlem (transaction) içinde yapar, ödeme sağlayıcısıyla entegrasyonu yazar, yavaş çalışan bir raporlama sorgusuna indeks ekler ve servis loglarında gece oluşan bir hatayı izler. Gün sonunda geliştiriciler API sözleşmesindeki bir alan adını birlikte netleştirir.

Hangi yol kime daha uygun?

Frontend size daha yakın olabilir: • Görsel sonuç görmek, tasarım ve kullanıcı deneyimiyle ilgilenmek sizi motive ediyorsa • Küçük ayrıntıların (hizalama, animasyon, erişilebilirlik) kullanıcıya etkisini önemsiyorsanız • Tasarımcı ve ürün ekibiyle yoğun iletişimden keyif alıyorsanız

Backend size daha yakın olabilir: • Veri yapıları, algoritmalar ve sistemlerin nasıl çalıştığı ilginizi çekiyorsa • Performans, ölçeklenme ve güvenlik gibi görünmeyen kalite boyutlarıyla uğraşmak hoşunuza gidiyorsa • Karmaşık iş kurallarını modellemek ve sistemleri birbirine bağlamak size cazip geliyorsa

Kararsız kalıyorsanız küçük bir projeyi uçtan uca yapın: basit bir görev listesi uygulamasının arayüzünü ve API'sini kendiniz yazın. Hangi tarafta zamanın nasıl geçtiğini fark etmediğiniz, size yön gösterir. Her iki tarafı da yürütebilen geliştiriciler full stack olarak anılır; full stack geliştiriciler de genellikle bir tarafta daha derin uzmanlaşır.

Öğrenme yolu ve sık yapılan hatalar

Frontend için tipik öğrenme sırası HTML ve anlamsal yapı, CSS ve duyarlı tasarım, JavaScript temelleri, ardından TypeScript ve React gibi bir kütüphanedir; sonra durum yönetimi, yönlendirme, test ve performans gelir. Backend için bir sunucu dili, HTTP ve REST API tasarımı, SQL ve veritabanı modelleme, kimlik doğrulama, ardından önbellekleme, kuyruklar ve dağıtım gelir.

Sık yapılan hatalar: • Frontend'de çatıya atlayıp JavaScript ve CSS temellerini atlamak; çatı değiştiğinde bilgi taşınmaz. • Backend'de veritabanını yalnızca bir depo gibi görmek; indeks, işlem ve normalizasyon bilgisi olmadan uygulama büyüdükçe yavaşlar. • Güvenliği yalnızca diğer tarafın işi saymak; girdi doğrulaması iki tarafta da gerekir. • Portföyde yalnızca eğitim projesi kopyaları sergilemek; gerçek bir problemi çözen küçük ama özgün projeler daha çok şey anlatır.

Mindset programlarında bu rolleri nerede çalışırsınız

Modern Web Geliştirme: Frontend (React) eğitimi React ekosistemi ve modern geliştirme ortamı, bileşen mimarisi ve props sistemi, hook'larla durum ve yan etkiler, global durum yönetimi, yönlendirme ve sayfa mimarisi, performans optimizasyonu ile test ve kalite güvencesini kapsar.

Modern Web Geliştirme: Backend (Node.js / NestJS) eğitimi Node.js çalışma ortamı ve mimari temelleri, NestJS'in modüler yapısı, RESTful API tasarımı, veritabanı entegrasyonu ve ORM, kimlik doğrulama ve yetkilendirme, mikroservis ve mesajlaşma desenleri ile test, CI/CD ve üretim hazırlığını ele alır. Kurumsal ölçekte derinleşmek isteyenler için NestJS İleri Seviye ile Kurumsal Backend eğitimi istek yaşam döngüsü, transaction yönetimi ve gözlemlenebilirlik konularını işler.