Buradasın
ASP.NET MVC'de Ürün Listesi ve Detay Sayfası Oluşturma Eğitimi
youtube.com/watch?v=UI4_3vBm4RwYapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, bir ASP.NET MVC uygulamasında ürün listesi ve detay sayfası oluşturma sürecini adım adım gösteren bir eğitim içeriğidir.
- Videoda, önceki derste tedarikçi listesi oluşturulduktan sonra aynı yapıyı ürün listesi için nasıl uygulayacağımız anlatılmaktadır. Önce "Product" klasörüne "List" ve "Details" klasörleri eklenerek, ardından ürün listesi sayfası oluşturulmaktadır. Daha sonra detay sayfası için ürün resmi, ürün adı, birim fiyatı ve stok miktarı gibi bilgilerin nasıl gösterileceği kodlanmaktadır. Ayrıca, detay sayfasına yönlendirme için link oluşturma ve veritabanından ürün bilgilerini çekme işlemleri de detaylı olarak gösterilmektedir.
- 00:01Product Klasörü Oluşturma
- Önceki derste sublier klasörüne eklenen liste ve detay sayfaları, bu derste product klasör içerisinde gerçekleştirilecek.
- Product klasörüne "list" ve "details" adında iki klasör eklenecek.
- List klasörü, product list'in içerisine sürüklenecek ve kod kısmı listenin içerisine yapıştırılacak.
- 01:56List Sayfası Oluşturma
- Northwind context'in referansları alınacak ve list sayfası çalıştırılacak.
- List sayfası boş çalıştığında tüm ürünler gelecek, filtreleme yapıldığında belli kategorilere göre farklı ürünler yükleniyor.
- Product liste ihtiyacımız kalmadığı için artık kullanılmayacak.
- 03:02Detay Sayfası İçin Link Oluşturma
- Detay sayfası için listeden bir detay linki oluşturulması gerekiyor.
- Ürün isimlerine tıklandığında direkt detay sayfasına gidecek şekilde link oluşturuluyor.
- Ürün isimlerine a href etiketi eklenerek link haline getiriliyor ve id değeri eval'den product id olarak alınıyor.
- 05:02Detay Sayfası Arayüzü
- Detay sayfası için strip tarzında bir satır ekleniyor ve class'ları belirleniyor.
- Satır ikiye bölünüyor: sol tarafta 4 kolon resim için, sağ tarafta 8 kolon ürün detayları için kullanılıyor.
- Resim için holder.gs altında 400x400 alan gösteriliyor ve altına ürün ismi, fiyatı ve stok miktarı için label'lar ekleniyor.
- 08:04Detay Sayfası Kodlama
- Detay sayfasında id'ye göre bir query string questing oluşturuluyor.
- Details adında bir metod oluşturuluyor ve Northwind context kullanılıyor.
- Gelen string id değeri integer'a dönüştürülerek product id'ye eşit olan ürün seçiliyor ve product name, unit price ve stok bilgileri label'lara atanıyor.
- 13:37Hata Ayıklama ve Sonuç
- Unity stack'ta hata oluştuğu için integer'ın 32 bitlik değil 16 bitlik olduğunu belirtmek gerekiyor.
- Veritabanına codeverse'e ulaşmaya çalışırken tip ve isimlerin birebir aynı olması gerekiyor.
- Ürün detay sayfasında ürün resmi, ismi, fiyatı ve stok miktarı şeklinde bir arayüz hazırlanmış oluyor.