Medya Kitaplığı (SPA)

ISE-201 Web Teknolojileri ödevi için geliştirilen tek sayfa web uygulaması. Yerel data/media.json dosyasından fetch ile medya verisi (film/dizi/kitap) çekilir; arama ve filtreleme yapılır, detaylar modal olarak gösterilir ve favoriler localStorage ile kalıcı tutulur.

https://sauwebprogramming.github.io/web-tech-project-togrul331/

Özellikler

• SPA davranışı: Sayfa yenilenmeden detay gösterimi ve gezinme
• Arama (başlık ve özet) ve kategori/yıl filtreleri
• Detay modalı; oyuncu/yazar bilgileri ve puan
• Favoriler: localStorage ile kalıcı, panelden temizlenebilir
• Duyarlı tasarım: Grid/Flex; mobil/tablet/masaüstü uyumu
• Modern JS: ES6+, const/let, arrow functions, async/await, fetch

Kullanım

1. Proje dosyalarını yerel olarak açın.
2. Geliştirme için basit bir statik sunucu kullanın (gerekli, çünkü fetch ile dosya okuma):
   • Python: python -m http.server 5500
   • Node: npx serve .
   • VS Code Live Server veya benzeri de olur.
3. Tarayıcıda http://localhost:5500 adresini açın (kullandığınız porta göre değiştirin).

Yapı

• index.html – Anlamsal iskelet ve bölümler
• styles.css – Grid/Flex tabanlı responsive tasarım
• script.js – SPA mantığı, fetch, filtreler, modal ve localStorage
• data/media.json – Örnek medya verisi (12 kayıt)

Notlar

• Veri kaynağı değiştirmek için data/media.json dosyasını düzenlemeniz yeterli.
• Görseller Unsplash üzerinden sağlanıyor; isterseniz yerel görsellerle güncelleyebilirsiniz.