Bölüm 4 – WordPress ve Nesne Yönelimli Programlama: Bir WordPress Örneği – Tasarım

Yayınlanan: 2022-02-03

Bu noktada, bu serinin 3. Kısmında açıklandığı gibi açıkça tanımlanmış gereksinimlerimiz var (kaçırdıysanız buradan kontrol edin).

Şimdi yeni ve geliştirilmiş eklentimizin tasarımı hakkında düşünmeye başlama zamanı!

Kendi projelerinizde denediğinizde bu adımın uzun sürebileceğini hatırlatmak isteriz. Muhtemelen ilk seferde de her şeyi doğru alamayacaksınız. Muhtemelen bir tasarım bulursunuz, onu uygulamaya başlarsınız ve sonra geri dönüp yaklaşımınızı yeniden düşünmeniz gerektiğini anlarsınız.

Bu çabaya kesinlikle değer, bu yüzden her şeyi doğru yapmak için gerektiği kadar zaman ayırın. İyi yapılandırılmış bir proje, onu korumayı ve genişletmeyi ve hatta kodunu diğer projelerde yeniden kullanmayı kolaylaştıracak, böylece uzun vadede iyi bir zaman kullanımı olacaktır.

Sırada, eklentinin bazı önemli kısımlarına odaklanacağız ve tasarımımızı nasıl oluşturduğumuzu tartışacağız.

Ayarlar Sayfasının İncelenmesi

Eklentinin admin sayfasına daha yakından bakalım.

Sayfanın altında bir başlık (“Giriş Denemelerini Sınırla”), bazı alanları içeren birkaç bölüm ve bir “Seçenekleri Değiştir” düğmesi olduğunu fark edeceksiniz.

Her bölüm, "İstatistikler" gibi bir başlık ve birkaç alandan oluşur.

Her alanın solunda bir başlığı ve sağ tarafında içeriğinin geri kalanı vardır. Metin alanları, radyo düğmeleri ve onay kutuları vardır ve bunlardan bazıları, "Toplam Kilitlemeler" gibi yalnızca bilgileri görüntüler ve yönetici kullanıcı tarafından doğrudan değiştirilemez.

Bazı alanlar, "Site Bağlantısı" alanı gibi bir açıklama da içerir, ancak hepsini içermez.

Yukarıdakileri göz önünde bulundurarak, onu daha sonra sınıf olacak kavramsal parçalara ayırmamız gerekiyor.

WordPress Ayarları API'si, ayar sayfalarını, bu sayfalardaki bölümleri ve bölümler içindeki alanları kaydetmemize olanak tanır:

Sayfalar → Bölümler → Alanlar

Eklentimizi gelecekte daha kolay genişletmek için neden bir “katman” daha eklemeyelim, Elements diye düşündük.

Sayfalar → Bölümler → Alanlar → Öğeler

Bu nedenle, Sayfalar ve Bölümler, yukarıda zaten açıkladığımız şeydir ve Alanlar, sağ tarafta herhangi bir içerik türünden Öğeler içerecektir.

Tüm bu farklı eleman türlerini göz önünde bulundurarak, farklı çıktılar oluşturacak onay kutuları, radyo düğmeleri, sayılar vb. için bir Element sınıfı ve birkaç sınıf ile onu genişlettik.

Ayrıca gelecekte daha fazla sayfa ve bölüm eklememiz gerekebilir. Bu nedenle, bu yönetici sayfasını ve bölüm sınıflarını genişletmemiz gerekebilir.

Aynı şey tarlalar için de geçerli. “Toplam kilitleme”, “Aktif kilitleme” vb. sınıfları aynı (ebeveyn) sınıfı genişletecektir.

İşte bu ilişkileri gösteren basitleştirilmiş bir görsel:

Tabii ki, tüm "bileşenler" şemaya dahil edilmemiştir.

Bunun gibi bir yapı, eklentinin genişletilmesini kolaylaştırır; ihtiyaç duyulursa kolayca bir alan, eleman veya bölüm ekleyebiliriz. Mevcut olanları değiştirmek zorunda kalmadan yeni alt sınıflar oluşturarak daha fazla bileşen (alanlar, öğeler veya bölümler) kolayca ekleyebileceğiz.

Düşünme ve Soyutlama

Şimdi, eklentimizin çeşitli bileşenlerinin ne yaptığını düşünmeye başlamanın tam zamanı. Tasarım aşamasında, bir şeyin nasıl çalıştığı hakkında çok fazla ayrıntıya girmemize gerek yok.

Örneğin, kullanıcıya gösterilecek tüm öğeleri, tabloları, istatistikleri ve hemen hemen her şeyi düşünün. Ortak hiçbir şeyleri olmayan ayrı bileşenler olabilirler, ancak hepsi sonunda bir miktar çıktı verecektir. Bu nedenle, aksi takdirde tamamen ilgisiz olan bileşenler için bazı işlevler ortak olacaktır. Elbette bu, diğer bileşenlerimizi de kapsıyor.

Yukarıdaki görselde, bir UI arayüzünün birden çok sınıf tarafından nasıl uygulandığını görüyoruz.

UI arabiriminin, üst sınıflar olarak adlandırılan İstatistikler, Kilitleme Günlükleri, Tablo ve Öğe sınıfları tarafından uygulandığına dikkat edin. Tüm arabirimleri üst sınıflarından devraldıkları için, Radio/Number/Checkbox Element sınıflarının arabirimi doğrudan uygulamasına gerek yoktur. Ancak, bir alt sınıf, üst sınıfının bir yöntemini geçersiz kılabilir.

Eklentimizin ayarlarla ilgileneceğini bildiğimiz için, değerlerini okuyup yazacağımızı güvenle söyleyebiliriz. Yani seçenekleri alabilmek , ayarlayabilmek ve kaldırabilmek .

Tüm bu eylemler bir sınıfta bir araya getirilecek. Muhtemelen seçeneklerimizi WordPress veritabanında veya buna benzer bir yerde saklayacağız. Şimdilik, verilerimizi nasıl veya nerede depolayacağımızla ilgilenmemize gerek yok.

Al/set/remove seçenekleri soyutlamasını zihnimizde tutabilir, işleri kavramsal olarak basitleştirebilir ve eklentimizi tasarlamaya devam edebiliriz.

Ana Eklenti Dosyası

Burada, başlık yorumu aracılığıyla WordPress eklentisi hakkında bazı bilgiler sağlayacağız ve bazı başlatmalar gerçekleştireceğiz. Her şeyi küçük bir sınıfa sararak kodumuzu düzenleyeceğiz.

Eklentimizin sınıflarının birlikte nasıl çalışacağına bağlı olarak, ana sınıfın çoğunu somutlaştırması gerekecektir. Bildiğimiz kadarıyla bu, seçenekler, yönetici sayfaları, yeniden denemeler ve kilitlemelerle ilgili sınıfları içerecektir.

Potansiyel Sınıflar

Hangi sınıflara ihtiyacımız olacağını bulmaya çalışmak için biraz zaman harcadık ve aşağıdaki gibi bir liste oluşturduk:

  • yeniden deneme
  • Kilitlemeler
  • Kurabiye
  • Hata mesajları
  • E-posta Bildirimleri
  • Yönetici bildirimleri
  • Düğmeler
  • Kilitleme günlükleri
  • Aktif/Toplam kilitleme
  • IP adresi

Eklentinizi yapılandırmanın tek bir "doğru" yolu olmadığını unutmayın. Yazılım geliştirmedeki çoğu şeyde olduğu gibi, bir sorunu çözmenin birden çok, eşit derecede geçerli yolu vardır.

Örneğin “Genel” bölümünde, sınıflarımız arasındaki ilişkiler şöyle görünecektir:

"İstatistikler" bölümü şuna benzer olacaktır:

Son olarak, "Kilitleme günlükleri", "İstatistikler"e çok benzer olacaktır:

Çözüm

Şimdiye kadar gereksinimlerimizi belirledik ve yeni ve geliştirilmiş eklentimiz için bir tasarım düşündük. Yapımızı nasıl oluşturduğumuzu açıkladık ve ayrıca sınıflarımızın birbirleriyle nasıl ilişkilendirileceğini gösteren bazı basit diyagramlar sağladık.

Nesneye Yönelik Programlama Serimizde Bölüm 5'i okumak için buraya tıklayın

Ayrıca bakınız

  • WordPress ve Nesne Yönelimli Programlama – Genel Bakış
  • Bölüm 2 – WordPress ve Nesne Yönelimli Programlama: Gerçek Bir Dünya Örneği
  • Bölüm 3 – WordPress ve Nesne Yönelimli Programlama: Α WordPress Örneği – Kapsamın Tanımlanması