Frontend geliştirmede yönlendirme uygulamanın hangi yolları vardır?

Ön uçta yönlendirmeyi uygulamanın iki temel yolu vardır:

1. İstemci tarafı yönlendirme: Yönlendirme doğrudan tarayıcıda JavaScript kullanılarak yönetilir.

   • Çalışma prensibi: Navigasyon sırasında sayfa tamamen yeniden yüklenmez. JavaScript, tarayıcıdaki URL'yi (History API kullanarak) değiştirir ve gerekli bileşenleri veya sayfa parçalarını dinamik olarak yükler veya yeniden çizer.
   • URL durumu:
     • History API (pushState, replaceState) kullanır. URL temizdir, # içermez.
     • Hash (#) kullanabilir (eski yöntem # ile).
   • Avantajlar:
     • Daha iyi kullanıcı deneyimi (daha hızlı geçişler, tam sayfa yenileme olmadan).
     • Tek sayfa uygulamaları (SPA) için uygundur.
   • Dezavantajlar:
     • Doğrudan URL erişimleri için sunucu yapılandırması gerektirir (örneğin, fallback olarak index.html ayarlamak).
     • İçerik yalnızca istemci tarafında render ediliyorsa SEO sorunları olabilir (SSR veya ön render ile çözülür).
   • Popüler kütüphaneler/frameworkler: React Router, Vue Router, Angular Router.

2. Sunucu tarafı yönlendirme: Yönlendirme tamamen sunucu tarafında işlenir.

   • Çalışma prensibi: Her yeni URL isteğinde, tarayıcı bir istek gönderir. Sunucu isteği işler, hangi içeriğin döneceğine karar verir ve tam bir HTML sayfası gönderir. Tarayıcı sayfayı tamamen yeniden yükler.
   • URL durumu: URL, sunucudaki gerçek kaynağa karşılık gelir.
   • Avantajlar:
     • Çok sayfalı uygulamalar (MPA) için basit uygulama.
     • Arama motorları tarafından iyi indekslenir (SEO), çünkü içerik hemen hazırdır.
     • Temel gezinme için JavaScript gerekmez.
   • Dezavantajlar:
     • Tam sayfa yenileme nedeniyle geçişler daha yavaştır.
     • SPA'ya kıyasla daha az etkileşimlidir.
   • Örnekler: Geleneksel web uygulamalarından miras kalmıştır, her URL'nin sunucuda ayrı bir dosya veya rota ile eşleştiği durumlar (örneğin, PHP, Django/Flask gibi Python frameworkleri, Node.js ile Express vb.).

Modern frontend uygulamalarında, özellikle SPA'larda, istemci tarafı yönlendirme standarttır. Sunucu tarafı yönlendirme, çok sayfalı siteler veya SEO iyileştirmeleri için istemci tarafı yönlendirme ile birlikte kullanılır (örneğin, SSR).