Tasarım Kalıplarını Uygulamak için Öneriler - Javascript ile Yazılım Geliştirmede İşinizi Kolaylaştıracak Araçlar (Bölüm 4)

js

Bu yazı, Tasarım Kalıpları dizinin 4. yazısıdır. Dizinin diğer yazılarına aşağıdaki içindekiler kısmından ulaşabilirsiniz.

İçindekiler

  1. Bölüm 1: Tasarım Kalıpları - Sorunlar ve İlkeler
  2. Bölüm 2: Tasarım Kalıpları Nedir?
  3. Bölüm 3: Tasarım Kalıplarının Kullanımı
  4. Bölüm 4: Tasarım Kalıplarını Uygulamak için Öneriler

Tasarım Kalıplarını Uygulamak için Öneriler

Teoride hepsi bir yere oturuyor. Özellike karşılaştığımız sorunun tespitinden sonraki aşamada, yani entegrasyon aşamasında oldukça eğlenceli saatler geçireceğinizi düşünüyorum. Ancak bunların hemen öyle olduğu gibi implemente etmemizin belli başlı sakıncaları bulunuyor. Özellikle zaten varolan bir kaynak kodu üzerinde böyle bir işe girişecekseniz iyi düşünüp geliştirmenizi önce projelendirmelisiniz diyebilirim. Bunun için izlenmesini tercih ettiğim aklımdaki belli başlı maddeleri şöyle sıralayabilirim:

a) Bir veri yönetim yapısı üzerinde mutabık olun. Nasıl bir yöntem izleyeceğinize karar verin ki o standardı birlikte çalıştığınız diğer geliştirici arkadaşlarınız da belirlesin ve böylece dökümante edilmesi kolay kodlarınızı üretmeye başlarsınız. Örneğin tamamen OOP bir yapı üzerinden ilerlemek isterseniz şöyle bir best practice’inizin olmasında fayda var:

/**
 * models/Person.js
 * Person nesnesini tanımladığımız dosya.
 */

"use strict";

/**
 * Person is the model for people
 * @param {String} name
 * @param {String} age
 */
var Person = function (name, age) {
   this.name = name;
   this.age = age;
}

b) Standart olarak OOP prensiplerini benimseyin.

/**
 * models/Employee.js
 * Person nesnesinden kalıtım alan Employee nesnesinin dosyası.
 */

"use strict";

/**
 * Employee is the model for employees
 * @param {String} department
 * @param {Integer} price
 */
var Employee = function (name, age, department, price) {
   this.department = department;
   this.price = price;
   Person.apply(this, arguments);
}
/**
 * models/Developer.js
 * Developer nesnesinin tanımlandığı ve Person ile Employee 
 * nesnelerinden kalıtım alan kodlarımızın bulunduğu dosya.
 */

"use strict";

/**
 * Developer is the model for employees
 * @param {Array} skills
 * @param {Date} contractDate
 */
var Developer = function (name, age, department, price, skills, contractDate) {
   this.skills = skills;
   this.contractDate = contractDate;
   Employee.apply(this, arguments);
}

var developer = new Developer(‘John Doe’’, 28, ‘IT’, 1, [‘Python', 'Django'], new Date());

c) Proje kapsamında işinize yarayacağını düşündüğünüz, kullanışlı tasarım kalıplarınızı da sample kodlar halinde türetin ve ekibinizle paylaşın. Onlarla birlikte tartışın ve neticeye en son kodlama yaparken ulaşıyor olacaksınız. Mesela şöyle bir Java’msı model ile karşılaşınca çalışma arkadaşlarınız heyecanlanıyorsa onlara sarılın, bırakmayın, sevgi verin:

//Java-ish Objects - 1

"use strict";

/**
 * Developer is the model for employees
 * @param {string} name
 * @param {number} age,
 * @param {string} department
 * @param {number} price
 * @param {Array} skills
 * @param {Date} contractDate
 */
var Developer = (function () {
   return function (name, age, department, price, skills, contractDate) {

      var proto = new Object();

      proto.name = name;
      proto.age = age;
      proto.department = department;
      proto.price = price;
      proto.skills = skills;
      proto.contractDate = contractDate;

      return {

         getName : function () {
             return proto.name;
         },

         getAge : function () {
             return proto.age;
         },

         getDepartment : function () {
             return proto.department;
         },

         getPrice : function () {
             return proto.price;
         },

         getSkills : function () {
             return proto.skills;
         },

         getContractDate : function () {
             return proto.contractDate;
         },

         setName : function (name) {
             proto.name = name;
         },

         setAge : function (age) {
             proto.age = age;
         },

         setDepartment : function (department) {
             proto.department = department;
         },

         setPrice : function (price) {
             proto.price = price;
         },

         setSkills : function (skills) {
             proto.skills = skills;
         },

         setContractDate : function (contractDate) {
             proto.contractDate = contractDate;
         }
      }
   }
})();

Ya da şöyle bir nesne ile karşılaşsanız siz de sevinmez miydiniz?

"use strict";

var Tab = function (title, subTitle, activated, html, events) {
   return (function () {
      var proto = new Object({
         self : this,
         title : title,
         subTitle : subTitle,
         activated : activated,
         html : html,
         events : events
      });

      this.title = title;
      this.subTitle = subTitle;
      this.activated = activated;
      this.html = html;
      this.events = events;

      var getSelf = function () {
         return proto.self;
      }

      var getTitle = function () {
         return proto.title;
      }

      var getSubTitle = function () {
         return proto.subTitle;
      }

      var getActivated = function () {
         return proto.activated;
      }

      var getHtml = function () {
         return proto.html;
      }

      var getEvents = function () {
         return proto.events;
      }

      return {
         getSelf : getSelf,
         getTitle : getTitle,
         getSubtitle : getSubTitle,
         getActivated : getActivated,
         getHtml : getHtml,
         getEvents : getEvents,
      }
   })();
}

var tab = new Tab("sadas", "sadasd", true, "<div>test</div>", {onClick : function () { console.log("sadasd"); }});

d) Eğer istemci-tarafında Javascript geliştiricekseniz view katmanı ile model yani data katmanını nasıl bağlayacağınıza dikkatlice karar verin. Bu aşamada doğru yapılmayan tasarımlar ileride çok baş ağrıtabilir. Özellikle sizin geliştirdiğiniz kod bloklarında Lazy-Initialization gibi kalıpları kullanmak çok işinize yarayacaktır. Browser’ın render olma zamanını bilemediğinizden bunu ayrıca bir publish / subscribe kalıbı üzerinden de genişleterek bir mixin ile bağlayıp gerçekleyebilirsiniz.

e) Tarayıcının engine'ine hakim olun; onu sevin, o da sizi sevsin ;)

f) Bütün bir geliştirmeyi sadece sizin tasarladığınız yapı üzerinden ilerleteceğinize yoksa bir kütüphane ya da çatıdan destek alıp almayacağınıza karar verin. Günümüzde popüler olan çatı ve kütüphanler hariç oldukça decoupled araçlar bulunuyor. Benim tavsiye edeceklerim, Core.js, T3.js ve Knockout olacak. Hatta Core.js ile yapılmış küçük bir örneğe şuradan ulaşabilirsiniz: Currency Converter

g) Bütün bir geliştirme ortamınıza karar verin; IDE’nizden en küçük zoom plugin’inize kadar mümkünse siz karar verin ve elinizde kullanacağınız faydalı kod blokları yok ise bunu siz geliştirin.

h) Anti-pattern’lardan kaçının. Çok zorda kalmadıkça o sokağa girmeyin; alışkanlık yapar.

i) Ekibiniz ile bilgi paylaşımını üst safhada tutmaya çalışın ve bunu kışkırtın. Bazen aralarında üzülenler ve size kızanlari belki darılıp küsenler de olacaktır ancak tahminimce birkaç sene içerisinde (olumlu ya da olumsuz) bunu yaşamış olmaları nedeniyle seviniyor olacaklar. Siz (belki) orada olmasanız da en azından iyi anılırsınız diye tahmin ediyorum. Bunun için kendi aranızda workshop’lar, küçük anlatım seansları düzenleyebilirsiniz.

j) Birlikte çalıştığınız arkadaşlarınızla dışarıda da zaman geçirin. Böyle bir imkanınız yoksa en azından belli dönemlerde dışarıda birer kadeh elma-vodka için; iyi gelir ;)

k) Her şeye rağmen kod yazılır, önemli olan yapıdır.

Bütün bunlara değindiğim ve 20 Haziran’da Bahçeşehir Üniversitesi’nde gerçekleştirilen HTMLMag, the Frontiers:Mini etkinliğinde yaptığım sunumuma buradan ulaşabilirsiniz : A Developers View Patterns to Make Life Easier

Bu ya da başka konular ile ilgili bana aşağıdaki iletişim kanallarından da ulaşabilirsiniz :

Bu yazıyı yazmamda beni teşvik eden HTMLMag ekibine ve üretirken bana yardımcı olan Spotify listeme de teşekkürü borç bilirim.

Yazı Dizisi Boyunca Faydalanılan Kaynaklar