Web Uygulaması Nedir? Nasıl Çalışır, Türleri ve Örnekleri

Web sitesi ile web uygulaması arasındaki işlev farkı

Web sitesi çoğunlukla kullanıcıya bilgi sunar. Bir kurumun iletişim bilgileri, bir haber yazısı veya bir ürün tanıtım sayfası, kullanıcı tarafından okunabilir; fakat kullanıcıdan gelen her girdinin arka planda işlenmesi gerekmeyebilir. Bu tür sayfalarda içerik ağırlıklı yapı baskındır.

Web uygulamasında ise kullanıcı bir işlem başlatır ve sistem bu işlemin sonucunu üretir. E-posta hesabında ileti göndermek, çevrim içi ofis aracında belge düzenlemek, alışveriş sitesinde ürünleri filtrelemek veya bankacılık ekranında para transferi talimatı vermek buna örnektir. Burada yalnızca metin görüntülenmez; kullanıcı verisi alınır, kurallara göre işlenir ve çoğu durumda yeni bir sonuç oluşturulur.

Bu ayrım mutlak bir sınıra dayanmaz. Bir web sitesi arama kutusu, üyelik formu veya yorum sistemi içeriyorsa uygulama özelliklerine sahip olabilir. Benzer şekilde bir web uygulamasında bilgilendirici, statik sayfalar da bulunabilir. Karar verirken şu soruya bakılabilir: Kullanıcı yalnızca içeriği mi görüntülüyor, yoksa sistem kullanıcı girdisini işleyip kişiye veya oturuma özel bir sonuç mu üretiyor? İkinci durumda web uygulaması niteliği belirginleşir.

Tarayıcıdan sunucuya: tek bir isteğin izlediği yol

Bir web uygulamasındaki etkileşim çoğunlukla istemci-sunucu modeliyle açıklanır. İstemci, kullanıcının cihazı ve üzerinde çalışan tarayıcıdır. Sunucu ise uygulamanın işlem mantığının ve gerekli verilerin bulunduğu bilgisayar veya sunucu altyapısıdır.

Örneğin kullanıcı giriş formunu doldurup 'Giriş yap' düğmesine bastığında süreç kabaca şu sırayı izler:

1. Tarayıcı, girilen bilgileri uygulamanın sunucusuna bir istek olarak gönderir.
2. Sunucu isteğin hangi işlem için geldiğini belirler ve gerekli kontrolleri yapar.
3. Kullanıcı hesabı gibi bilgiler gerekiyorsa sunucu veritabanına başvurabilir.
4. Sunucu olumlu veya olumsuz sonucu tarayıcıya gönderir.
5. Tarayıcı gelen sonuca göre hata mesajı, kullanıcı paneli veya başka bir ekran gösterir.

Bu akışın her adımı her uygulamada aynı biçimde gerçekleşmez. Bazı işlemler tarayıcıda tamamlanabilir, bazıları için sunucuyla yeniden iletişim kurulabilir. İnternet bağlantısının kesilmesi de sunucuyla iletişim gerektiren işlemleri etkileyebilir. Dolayısıyla 'tarayıcıda çalışır' ifadesi, tüm işlemlerin yalnızca cihaz üzerinde yapıldığı anlamına gelmez.

Frontend, backend ve veritabanı aynı işlemde nasıl birleşir?

Frontend, kullanıcının gördüğü ve etkileşim kurduğu bölümdür. Menü, düğme, form, ürün kartı ve ekranda gösterilen sonuçlar frontend kapsamındadır. Tarayıcıda çalışan bu katman, kullanıcının seçimini alır ve gerekli olduğunda sunucuya iletir. Frontend konusu için Frontend Nedir? bağlantısına bakılabilir.

Backend, uygulamanın sunucu tarafındaki işlem mantığıdır. Yetki kontrolü, sipariş kurallarının uygulanması, hesaplama yapılması veya gelen verinin işlenmesi gibi görevler burada yürütülebilir. Backend, frontend'in gösterdiği ekranın arkasında çalışan bütün mekanizma değildir; uygulamanın sunucuda gerçekleştirilen işlevlerini ifade eder. Ayrıntılı ayrım için Backend Nedir? ve Frontend ile Backend Arasındaki Fark içerikleri ilişkilidir.

Veritabanı ise uygulamanın ihtiyaç duyduğu verilerin saklandığı sistemdir. Kullanıcı hesabı, ürün bilgisi, sipariş kaydı veya belge içeriği gibi veriler uygulamanın yapısına göre burada tutulabilir. Ancak veritabanı tek başına web uygulaması değildir; backend ile birlikte kullanıldığında uygulamanın kalıcı veri saklama ihtiyacını karşılar. Bu ayrım Veritabanı Nedir? başlığında ele alınır.

Örneğin ürün sayfasında görülen fiyat frontend tarafından ekrana taşınır; fiyatın hangi ürüne ait olduğu ve siparişe uygulanacak kurallar ise backend ve veritabanı tarafında işlenebilir. Bu nedenle ekranda görülen bir değer ile o değerin güvenilir biçimde hesaplanması aynı katmanın görevi değildir.

Kurulum gerektirmemenin gerçek anlamı ve sınırları

Web uygulamalarının önemli özelliği, ana yazılımın çoğunlukla sunucu tarafında bulunmasıdır. Kullanıcı tarayıcıda uygulamanın adresini açarak hizmete erişir; klasik masaüstü programlarında olduğu gibi uygulamanın tamamını cihazına kurması gerekmeyebilir. Bu durum özellikle farklı cihazlardan aynı hizmete ulaşmayı kolaylaştırır.

Bununla birlikte 'hiçbir şey indirilmez' ifadesi teknik olarak fazla geneldir. Tarayıcı, uygulamayı görüntülemek ve çalıştırmak için sayfa dosyalarını, görsel içerikleri veya betikleri geçici olarak cihaza alabilir. Kullanıcı açısından önemli fark, bunların ayrı bir kurulum paketi olarak elle yüklenmesinin çoğu durumda gerekmemesidir.

Güncellemelerin sunucu tarafında yapılabilmesi de yönetim avantajı sağlar. Geliştirici yeni sürümü hizmetin sunulduğu ortamda yayımladığında kullanıcıların ayrı bir kurulum dosyası indirip çalıştırması gerekmeyebilir. Fakat tarayıcı uyumluluğu, eski önbellek verileri, bağlantı kalitesi ve cihazın performansı deneyimi etkileyebilir. Bu yüzden web uygulaması platform bağımsızlığı sunabilir; ancak her tarayıcıda ve her cihazda tamamen aynı davranacağı garanti edilmez.

Web, mobil ve masaüstü uygulaması arasında seçim

Web uygulaması tarayıcı üzerinden erişim kolaylığı sağlar. Kullanıcı, desteklenen bir tarayıcı bulunan farklı cihazlardan aynı hizmete ulaşabilir ve uygulamayı ayrıca kurmayabilir. Bu yapı, geniş bir kullanıcı grubuna hızlı erişim sunmak isteyen hizmetler için uygun olabilir.

Mobil uygulama ise telefon veya tablet işletim sistemi için hazırlanır ve genellikle cihazın uygulama mağazasından yüklenir. Mobil uygulamalar, uygulamanın tasarımına ve işletim sistemi izinlerine bağlı olarak bildirim, kamera, konum veya başka cihaz özellikleriyle daha doğrudan bütünleşebilir. Buna karşılık indirme, güncelleme ve işletim sistemi uyumluluğu gibi ek süreçler ortaya çıkabilir. Ayrıntılı karşılaştırma için Mobil Uygulama Nedir? içeriğine gidilebilir.

Masaüstü uygulaması, belirli bir işletim sistemi için cihaza kurulup yerel olarak çalışabilir. Bu model, cihaz kaynaklarına erişim veya çevrim dışı çalışma açısından avantaj sağlayabilir; fakat kurulum ve sürüm yönetimi kullanıcıya daha fazla sorumluluk yükleyebilir. Masaüstü Uygulama Nedir? konuyu tamamlar.

Seçim tek bir üstünlük kuralıyla yapılmaz. Kullanıcının çevrim dışı çalışma ihtiyacı, cihaz donanımına erişim gereksinimi, hedef platformlar, güncelleme yöntemi ve bağlantı koşulları birlikte değerlendirilmelidir. Aynı hizmetin web, mobil ve masaüstü sürümlerini bir arada sunması da mümkündür.

Web uygulaması geliştirmede kullanılan katmanlar

Bir web uygulaması genellikle tek bir programlama dilinden oluşmaz. Kullanıcının gördüğü arayüz için HTML, CSS ve JavaScript gibi web teknolojileri kullanılabilir. HTML içerik yapısını, CSS görünümü, JavaScript ise sayfadaki etkileşimleri ve tarayıcı tarafındaki davranışları düzenlemede rol oynar.

Sunucu tarafında Python, Java, PHP veya Node.js gibi farklı teknolojiler tercih edilebilir. Hangi teknolojinin seçileceği; uygulamanın ihtiyaçlarına, ekibin deneyimine ve mevcut altyapıya bağlıdır. Python ile JavaScript Arasındaki Fark bağlantısı, bu iki dilin kullanım bağlamlarını ayırmaya yardımcı olur.

Veri saklamak için kullanılan veritabanı da mimarinin ayrı bir parçasıdır. Kullanıcı işlemleri, ürün kayıtları veya belgeler gibi kalıcı veriler burada tutulabilir. Ayrıca kimlik doğrulama, yetkilendirme ve veri aktarımının korunması gibi güvenlik konuları tasarımın parçasıdır. Bir uygulamanın tarayıcıda açılması tek başına güvenli olduğu anlamına gelmez; güvenlik, kullanılan yöntemlere ve uygulamanın nasıl yönetildiğine bağlıdır.

Bu yapı, uygulamanın neden yalnızca bir ekran tasarımından ibaret olmadığını gösterir. Kullanıcının gördüğü düğme frontend'de bulunabilir; düğmeye basınca gerçekleşen yetki kontrolü backend'de yapılabilir; işlem sonucunun saklanması ise veritabanına bağlı olabilir.

Çözümlü örnek: web uygulamasında ürün siparişi

Verilenler: Kullanıcı bir tarayıcıda alışveriş web uygulamasını açıyor. Bir ürünü inceliyor, sepete ekliyor ve sipariş oluşturmayı deniyor. Ürün bilgileri uygulamanın verilerinde kayıtlı; sipariş işlemi için kullanıcının seçimi sunucuya aktarılıyor.

Çözüm adımları:

1. Ürün listesinin açılması: Tarayıcı uygulamanın ilgili adresine gider ve ürünleri görüntülemek için gerekli içeriği ister. Ekrandaki ürün kartları frontend tarafından gösterilir.
2. Ürün seçiminin yapılması: Kullanıcı 'Sepete ekle' düğmesine basar. Bu etkileşim tarayıcı tarafında yakalanır. Sepet bilgisi yalnızca tarayıcıda tutuluyorsa işlem yerel olabilir; kullanıcı hesabıyla ilişkilendirilecekse sunucuya gönderilmesi gerekebilir.
3. Ürün ve stok kontrolü: Sunucu, ürünün geçerli olup olmadığını ve sipariş kuralına göre işlenip işlenemeyeceğini denetleyebilir. Ürün bilgilerinin veya stok durumunun veritabanından okunması mümkündür.
4. Sipariş talebinin gönderilmesi: Kullanıcı sipariş verme adımını seçtiğinde tarayıcı, seçilen ürün ve diğer gerekli bilgileri sunucuya iletir.
5. Sonucun üretilmesi: Backend, gelen isteği işler. Uygulamanın kurallarına uygun bir sonuç oluşursa sipariş kaydı veritabanına yazılabilir; uygun değilse kullanıcıya hata veya düzeltme mesajı dönebilir.
6. Ekranın güncellenmesi: Tarayıcı sunucudan gelen sonucu işler ve sipariş onayı, hata mesajı veya ödeme adımı gibi yeni ekranı gösterir.

Sonuç: Kullanıcının gördüğü ürün kartı ve düğme frontend'e; isteğin işlenmesi backend'e; ürün ve sipariş kayıtlarının kalıcı biçimde saklanması veritabanına aittir. Bu üç parçayı birbirine karıştırmamak, web uygulamasının çalışma mantığını anlamanın anahtarıdır.

Çözümlü örnek: giriş ekranında istemci-sunucu ayrımı

Verilenler: Kullanıcı e-posta ve parola alanlarını dolduruyor, ardından giriş düğmesine basıyor. Uygulama başarılı girişte kullanıcı panelini, başarısız girişte hata mesajını gösterecek şekilde tasarlanmış.

Çözüm adımları:

1. Formun oluşturulması: E-posta ve parola kutuları ile giriş düğmesi frontend tarafından sunulur. Kullanıcı bilgileri bu arayüzden girer.
2. İlk kontrol: Frontend, alanların boş bırakılıp bırakılmadığını kontrol edebilir. Bu kontrol kullanıcıya hızlı geri bildirim verir; ancak tek başına yeterli güvenlik kontrolü sayılmaz.
3. Sunucu isteği: Giriş bilgileri, uygulamanın backend katmanına gönderilir. Sunucu gelen isteğin biçimini ve yetkili işlem olup olmadığını denetler.
4. Kayıtla karşılaştırma: Backend, gerekli kullanıcı kaydını veritabanında arayabilir ve uygulamanın kimlik doğrulama sürecini yürütür. Bu adımın ayrıntıları kullanılan sisteme göre değişir.
5. Yanıt: Bilgiler kabul edilirse sunucu başarılı sonuç ve kullanıcı oturumunun devamı için gerekli yanıtı döndürebilir. Uygun bulunmazsa hata sonucu gönderilebilir.
6. Görsel geri bildirim: Frontend, gelen yanıta göre paneli açar veya hata mesajı gösterir.

Sonuç: Formun ekranda bulunması hesabın doğrulandığı anlamına gelmez. Kullanıcı deneyimi için frontend kontrolü yapılabilir; asıl kararın güvenilir biçimde sunucu tarafında verilmesi gerekir. Bu, frontend ile backend görevlerinin neden ayrıldığını gösteren tipik bir örnektir.