TripNest Nedir?
TripNest, seyahat ve tur sektörüne yönelik olarak sıfırdan geliştirdiğimiz profesyonel bir web platformudur. Proje; tur listeleme, destinasyon tanıtımı, online rezervasyon ve blog yönetimi gibi temel ihtiyaçları tek bir çatı altında toplar.
Çift Dil Desteği ve İçerik Yönetimi
Platform Türkçe ve İngilizce olmak üzere iki dilde hizmet verir. Dil geçişleri sayfa yeniden yüklenmeden, React'ın context yapısı üzerinden anlık olarak gerçekleşir. Tüm metin içerikleri — başlıklar, açıklamalar, buton yazıları — admin panelden düzenlenebilir. Bu sayede site sahibi herhangi bir kod bilgisine ihtiyaç duymadan içeriklerini güncelleyebilir.
Ana Sayfa Bileşenleri
Ana sayfa 13 farklı bölümden oluşur ve her biri veritabanından dinamik olarak beslenir:
- Tam ekran video arka planlı hero banner
- Lokasyon, tarih ve kişi sayısına göre tur arama çubuğu
- Popüler destinasyonlar ve öne çıkan tur kartları
- Hizmet tanıtımı, müşteri yorumları ve iş ortağı logoları
- Başarı sayaçları (ödül, mutlu gezgin, deneyim yılı)
- Adım adım rezervasyon rehberi ve blog bölümü
Bileşenlerin tamamı GSAP ve Swiper kütüphaneleriyle zenginleştirilmiş animasyonlar içerir.
Tur ve Destinasyon Sistemi
Sitede her tur için ayrı bir detay sayfası bulunur. Bu sayfalarda tur açıklaması, fiyat bilgisi, süre, puan, görsel galeri ve benzeri bilgiler yer alır. Fiyatlar dil tercihine göre otomatik olarak TL veya USD cinsinden gösterilir. Destinasyon sayfaları da benzer yapıdadır; her destinasyonun kendine özel tanıtım sayfası ve görselleri mevcuttur. Tüm bu içerikler TripNest platformu üzerinden yönetilmektedir.
Online Rezervasyon Altyapısı
Tur detay sayfalarında çok adımlı bir rezervasyon formu yer alır. Kullanıcı tarih seçer, kişi sayısını belirler ve her yolcu için ad, soyad, TC kimlik numarası, telefon ve adres bilgilerini girer. Kişi sayısı artırıldığında yolcu formları otomatik olarak eklenir. Form, kredi kartı veya banka havalesi gibi ödeme yöntemlerini destekler. Gelen rezervasyon talepleri admin panelden takip edilir ve durum güncellemesi yapılabilir.
Gelişmiş Arama ve Filtreleme
Ana sayfadaki arama çubuğu; lokasyon, kategori, tarih ve kişi sayısı parametreleriyle çalışır. Flatpickr takvim bileşeni sayesinde tarih seçimi kullanıcı dostu bir arayüzle gerçekleşir. Arama sonuçları tur listeleme sayfasında URL parametreleri üzerinden filtrelenir ve sonuç sayısı kullanıcıya gösterilir.
Blog ve İçerik Modülü
Entegre blog sistemi, seyahat rehberleri ve bilgilendirici yazıların yayınlanmasını sağlar. Her blog yazısı iki dilde başlık, içerik, yazar bilgisi ve kapak görseli ile oluşturulur. Blog detay sayfalarında zengin metin formatı desteklenir. Bu modül hem site içi etkileşimi artırır hem de SEO açısından organik trafik kazanımına katkı sağlar.
Admin Panel
Projenin en kapsamlı bölümlerinden biri olan admin panel, 28 farklı yönetim sayfası içerir. Panel üzerinden yönetilebilen modüller şunlardır:
- Tur ekleme, düzenleme, silme ve durum değiştirme
- Destinasyon yönetimi ve görsel yükleme
- Blog içerik editörü
- Gelen rezervasyonların listesi ve durum takibi
- Müşteri yorumları, hizmetler ve iş ortağı logolarının yönetimi
- Başarı sayaçları ve "Neden Bizi Seçmelisiniz" bölüm düzenleyicisi
- Site ayarları: logo, iletişim bilgileri, sosyal medya linkleri, footer metni
- Ödeme ayarları ve kullanıcı yönetimi
- Menü yapısı düzenleme
Teknik Altyapı
Frontend tarafında React 19 ve Vite kullanılmıştır. Vite, geliştirme sürecinde hızlı derleme ve anlık güncelleme sağlayan modern bir araçtır. Stil yönetimi Tailwind CSS ile yapılmıştır; 12'den fazla özel animasyon, özel renk paleti ve özel tipografi tanımları Tailwind yapılandırma dosyasında merkezi olarak yönetilir. Sayfa geçişleri React Router v7 ile yönetilir ve tüm uygulama tek sayfa uygulama (SPA) mimarisindedir.
Backend tarafında PHP ile geliştirilmiş 65 adet REST API uç noktası bulunur. Bu uç noktalar MySQL veritabanıyla iletişim kurarak CRUD işlemlerini (veri oluşturma, okuma, güncelleme, silme) gerçekleştirir. Veritabanında 11 farklı tablo yer alır: turlar, destinasyonlar, bloglar, hizmetler, müşteri yorumları, iş ortakları, başarı verileri, popüler arama terimleri, bölüm içerikleri, site ayarları ve kullanıcılar.
Tasarım ve Kullanıcı Deneyimi
Tasarımda Google Fonts ailesinden Kaushan Script, Afacad ve Figtree fontları kullanılmıştır. Renk paleti seyahat temasına uygun olarak koyu turkuaz, canlı yeşil ve kehribar tonlarından oluşur. TripNest web sitesi tüm cihazlarda sorunsuz çalışacak şekilde responsive tasarlanmıştır. Custom cursor efekti, scroll-to-top butonu, off-canvas mobil menü ve loading ekranı gibi detaylar kullanıcı deneyimini tamamlar.
Projenin canlı versiyonunu incelemek ve tüm özellikleri deneyimlemek için
İlginizi Çekebilir
