Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, bir eğitmen tarafından sunulan web geliştirme eğitimidir. Eğitmen, izleyicilerle etkileşim halinde (Sadullah adında bir kişi de dahil) dinamik bir menü sistemi oluşturma konusunda rehberlik etmektedir.
- Videoda, PHP ve jQuery kullanarak web uygulamasında dinamik menü sisteminin nasıl oluşturulacağı adım adım gösterilmektedir. Eğitmen, menüdeki kategorilerin tıklandığında sol taraftaki menü öğelerinin nasıl aktif hale getirileceğini, session ve local storage teknolojilerinin nasıl kullanılacağını ve debugger'ın faydalarını anlatmaktadır.
- Eğitim boyunca, left sidebar'ın çalışması, session değişkenlerinin kullanımı ve JavaScript ile event manipülasyonu gibi konular ele alınmaktadır. Eğitmen, "room folder" yerine "rezervation folder" gibi yeni kategoriler ekleyerek uygulamanın işlevselliğini test etmekte ve gelecek projeler hakkında bilgi vermektedir. Ayrıca, haftaya oda resim ekleme için Dropzone kullanımı hakkında yeni bir video çekeceğini belirtmektedir.
- 00:03Menü Aktifleştirme Sorunu
- Dashboard'a tıklandığında hiçbir şey olmuyor ve sadece aktif kategori görünüyor.
- Sol taraftaki menüde tıklandığında yanık renk geliyor, ancak kategori olarak algılanmıyor.
- Her sayfada kategoriden, odalardan veya başka bir yerden geldiğimizi tanımlamak gerekiyor.
- 01:12Dinamik Menü Çözümü
- Odalara tıklandığında controller'a "active page" gibi bir veri gönderilebilir.
- Hem menüdeki parlaklığı tutabilecek hem de triview'e açık gelmesini sağlayacak bir değişkene ihtiyaç var.
- Dinamik bir çözüm için PHP ile session kullanmak daha mantıklı görünüyor.
- 04:04PHP ile Session Kullanımı
- Session'ı PHP'de tutmak için local storage kullanılabilir.
- Her sayfada jQuery işlemi yapmak yerine PHP'de session okutup HTML'i ona göre oluşturmak daha kolay.
- Tıklanan menü elemanının ID'sini alıp session'a aktararak, sonraki sayfada sol tarafta aktif hale getirilebilir.
- 07:16Menü Tıklama Algılama
- Menü elemanlarına tıklandığında hangi elemanın altında olduğunu algılamak gerekiyor.
- Her menü elemanına "room folder", "room kategori", "room properties" gibi id'ler verilebilir.
- Tıklanan menü elemanının parent ve child id'lerini alarak hangi section'da olduğumuzu anlayabiliriz.
- 12:26Controller Oluşturma
- Menü değerlerini session'a aktarmak için bir controller gerekiyor.
- Dashboard'a "set active menü" adında bir metot eklenebilir.
- Bu metot, tıklanan menü elemanının parent ve active item değerlerini alıp session'a aktarabilir.
- 14:23Active Item ve Session Kullanımı
- Active item elemanı gönderilecek ve alert response yazdırılacak.
- Session kullanımı hatırlatılıyor ve session'a gerek olduğu belirtiliyor.
- Session'a parent ve active item için array tanımlanarak veriler aktarılıyor.
- 16:09Left Sidebar ve Menü İşlemleri
- Left sidebar'da session'ı okuyarak işlem yapılacağı belirtiliyor.
- Sadece room folder olduğu için rahatlıkla işlem yapılabileceği, farklı bir menü olsaydı farklı davranış sergilenmesi gerektiği söyleniyor.
- Session'dan parent bilgisi okunarak menülerde aktif item için class eklenmesi gerektiği açıklanıyor.
- 18:46Kod Hataları ve Debugging
- Kod çalıştırıldığında hata ile karşılaşıldığı ve encryption key'e girilmesi gerektiği belirtiliyor.
- Odalara tıklandığında menülerin tekrar geldiği ancak çalışmadığı gözlemleniyor.
- Debugger kullanılarak hata ayıklama yapılıyor ve video yeniden başlatılarak sorun çözülüyor.
- 21:32Kodlama Sorunları ve Çözümleri
- Left sidebar'da eko özelliği eksik ve bazı kodlar çalışmıyor.
- Kodlama sırasında yanlış yerde tanımlama yapıldığı fark edildi ve kodların sayfanın en başına taşınması gerekti.
- Özellikler ve kategoriler arasında geçiş yaparken bazı sorunlar yaşanıyor, bu sorunun çözümü için session ve asset değişkenleri kullanıldı.
- 27:19Tıklama İşlemlerinin Düzenlenmesi
- Tıklama işlemlerinde default değeri engelleyerek (event.defaultValue = false) linklere gitmemesini sağladılar.
- Tıklanan elementin href'ini alarak JavaScript ile manuel işlem yaptırdılar.
- Zamanlayıcı (setTimeout) kullanarak tıklama işleminin hemen gerçekleşmemesini sağladılar.
- 30:42Yeni Kategori Ekleme
- Room folder yerine reservation folder adında yeni bir kategori eklendi.
- Yeni kategori için gerekli değişiklikler yapıldı ve tıklama işlemlerinde doğru şekilde çalışması sağlandı.
- Ekstra servislerde ikonlar ve diğer özelliklerin gösterilmesi için gerekli kodlar incelendi.
- 33:52Gelecek Çalışmalar
- Ekstra servisler bittikten sonra oda açma, uygunluk durumu ve ücret planı ekleme işlemleri yapılacak.
- Odalara resim ekleme özelliği eklenecek ve bunun için dropzone kullanılacak.
- Öğrencilere bu hafta sonu ekstra servisleri tamamlamaları ve bir sonraki videoda detaylı olarak resim ekleme işlemini gösterileceği belirtildi.