Bu makalede, Nodejs için popüler bir web framework'ü olan Expressjs kullanarak Observer Pattern'in nasıl uygulanabileceğini ele aldık Observer Pattern, bir nesnenin durumunda değişiklik olduğunda bağımlı nesnelere otomatik olarak haber vermek ve bağımlı nesnelerin değişikliklere uyum sağlamasını sağlamak için kullanılan bir tasarım desenidir Expressjs, minimalist, hızlı ve esnek yapısı sayesinde Observer Pattern'in uygulanması için oldukça uygun bir araçtır Bu makalede, model, view ve Observer'ların nasıl oluşturulacağı ve kullanılacağına dair adımları ele aldık Son olarak, haberlerin depolanması ve gösterilmesi üzerine bir örnek uygulamayı detaylı bir şekilde inceledik

Express.js, Node.js için oldukça popüler ve sürekli olarak geliştirilen bir web framework'üdür. Bu makalede, Express.js kullanarak Observer Pattern'i uygulamayı ele alacağız. Observer Pattern'in amacı, bir nesnenin durumunda değişiklik olduğunda bağımlı nesnelere otomatik olarak haber vermek ve bağımlı nesnelerin değişikliklere uyum sağlamasını sağlamaktır.

Express.js, minimalist, hızlı ve esnek bir web uygulama framework'üdür. MVC düzeni kullanarak web uygulamaları oluşturabilmektedir. Birçok geliştirici, Express.js'yi Node.js projelerinde kullanarak web uygulamalarını kolaylıkla geliştirip yönetebilirler. Observer Pattern'in uygulanması, Express.js'in açık kaynak kodlu yapısı sayesinde oldukça kolaydır. Bu makalede, model, view ve Observer'ların nasıl oluşturulacağı ve kullanılacağına dair birkaç adım ele alınacaktır.

Bu örnekte, haberler hakkında bir web uygulaması oluşturulacak ve kullanıcılar, haberleri görüntüleyebileceklerdir. Express.js kullanarak bir web uygulaması oluşturup observer pattern kullanarak haberlerin güncellenmesi işlemlerini ele alacağız. Bu örnek, uygulama verilerinin depolanması, güncellenmesi ve view'lerin otomatik olarak güncellenmesi konularında oldukça faydalı olacaktır.

Observer Pattern Nedir?

Observer Pattern, yazılım mühendisliği alanında kullanılan bir tasarım desenidir. Bir nesnenin durumunda değişiklik olduğunda, bağımlı nesnelere otomatik olarak haber verme yöntemidir. Bu sayede, bağımlı nesneler istedikleri işlemleri gerçekleştirerek değişikliklere uyum sağlayabilirler. Observer Pattern'da temel olarak iki rol vardır: Subject ve Observer. Subject, değişen nesnedir ve Observer'lar nesnede oluşacak değişiklikleri gözlemler ve buna göre güncellenir.

Observer Pattern'da Subject ve Observer'lar birbirlerine sıkı sıkıya bağlıdır. Sistemde bir değişiklik olduğunda, Observer'lar hemen haberdar edilir ve gerekli işlemleri yaparlar. Bu sayede sistemin yaratılışı sırasında herhangi bir geliştirici tarafından eklenmeleri kolaydır. Ayrıca, Observer Pattern'in kullanımı sayesinde, sistem daha esnek ve genişletilebilir hale gelir.

Express.js Nedir?

Express.js, Node.js için minimalist, hızlı ve esnek bir web uygulama framework'üdür. Bu framework, MVC (Model-View-Controller) düzeni kullanarak web uygulamaları oluşturabilmektedir. Dinamik web siteleri, API'ler ve tek sayfalık uygulamalar başta olmak üzere birçok farklı uygulama geliştirme senaryosuna uyum sağlamaktadır.

Express.js, temel HTTP fonksiyonlarının yanı sıra, middleware'lerden oluşan geniş bir koleksiyona da sahiptir. Bu middleware'ler, uygulama için özel çözümler geliştirmek için kullanılabilir. Ayrıca, çeşitli Node.js modülleri ile entegre edilebilir. Özellikle, MongoDB gibi popüler veritabanlarıyla birlikte kullanıldığında, bir web uygulaması için tüm gereksinimleri karşılayacak bir framework sağlamaktadır.

Observer Pattern Uygulaması

Bu bölümde, Express.js uygulamasında Observer Pattern kullanarak nasıl bir haberleşme sistemi oluşturabileceğimizi inceleyelim. Amacımız, haberleri depolamak ve yeni bir haber eklendiğinde otomatik olarak view'leri güncellemektir.

Uygulamamızda, haberler için bir model ve görüntülemeler için view'ler oluşturacağız. Model, verilerin depolandığı yerdir ve Observer Pattern kullanılacak olan kısımdır. Model, haber verilecek herhangi bir değişiklik olduğunda Observer'lara haber verecektir. Observer'lar, verilere bağlı olarak view'leri otomatik olarak güncelleyecektir.

Bu uygulamada, haberlerin eklenmesi ve silinmesi durumlarını ele alacağız. Yeni bir haber eklediğimizde, modelimizi güncelleyecek ve Observer'lar yeni haberin eklenmiş olduğunu fark edeceklerdir. Daha sonra, Observer'lar, değişiklikler olduğunda otomatik olarak view'leri güncelleyecektir.

Silme durumu içinse, haberi sildiğimizde modelden haber silinecektir. Observer'lar, bu değişikliği tespit edecek ve view'leri otomatik olarak güncelleyecektir.

Tüm bu işlemler, Express.js kullanarak kolayca gerçekleştirilebilir. Observer Pattern kullanarak, bağımlı nesneler arasında otomatik bir haberleşme yapabilir ve uygulamalarımıza dinamiklik katabiliriz.

Adım 1: İlk Görünüm (View) Oluşturma

Express.js ile Observer Pattern uygulaması yapmak için ilk adım, görünümleri (view) oluşturmaktır. View'ler, uygulamanın verilerinin render edilip kullanıcıya sunulduğu yerlerdir. Bu adımda, gerekli view'leri oluşturup, bunları .hbs uzantılı dosyalara yazacağız.

Handlebars (hbs) gibi bir template motoru kullanarak, view'lerimizi kolayca oluşturabiliriz. Örneğin, haberlerin görüntülendiği sayfayı oluştururken, handlebars fonksiyonları ve kendi özel css dosyalarınızı kullanarak görünümü şekillendirebilirsiniz.

Bunun yanı sıra, uygulamada birden fazla view kullanırsanız, view'lerin yönetimini kolaylaştırmak için bir view engine kullanmanız tavsiye edilir. Express.js, popüler bir view engine olan EJS'yi destekler.

Komutlar	Açıklama
$ npm install ejs	EJS modülünü yükler.
app.set('views', './views')	View'lerin bulunduğu klasörü belirler.
app.set('view engine', 'ejs')	EJS view engine'inin kullanılacağını belirtir.

View oluşturma adımı tamamlanınca, uygulamamızda haberlerin görüntülendiği sayfa gibi basit bir sayfanın oluşması sağlanır.

Adım 2: Model Oluşturma

Observer Pattern kullanarak haberleşme sistemimizi oluşturma işlemine devam ederken, uygulama verilerinin depolanacağı yani bizim için önemli olan 'Haber' verilerinin nasıl depolanacağını belirlememiz gerekiyor.

Bu işlemi gerçekleştirmek için, uygulama yapısı ve veri yapısını anlamak önemlidir. Model, uygulama verilerinin depolandığı yerdir. Bu durumda, model'in amacı, haberleri depolamaktır.

Bir Model oluşturmak için öncelikle, Express.js'in sağladığı mongoose modülünü kullanabiliriz. Model oluşturmadan önce, mongoose modülünün projemiz içerisinde tanımlanmış olması gerekmektedir.

Bunun için, öncelikle mongoose modülünü projemize dahil etmemiz gerekiyor.

            const mongoose = require('mongoose');    

Daha sonra, aşağıdaki gibi bir 'Haber' modeli tanımlayabiliriz:

            const HaberSchema = new mongoose.Schema({          baslik: String,          icerik: String,          tarih: { type: Date, default: Date.now }        });        const HaberModel = mongoose.model('Haber', HaberSchema);    

Bu şekilde, haberlerimizi kaydetmek için gerekli olan modelimizi oluşturmuş olduk.

Model oluşturma işlemi tamamlandıktan sonra, artık haberlerimizi kaydedebiliriz. Bu işlemi gerçekleştirmek için, ileriki adımlarda Observer'ları ve Controller'ları kullanarak bir POST isteği oluşturacağız.

Adım 3: Observer Oluşturma

=

Observer'ların amacı, modeldeki durum değiştiğinde otomatik olarak view'leri güncellemektir.

Observer Pattern'in en önemli unsuru olan Observer'lar, belirli bir şarta bağlı olarak modeldeki değişiklikleri takip ederek otomatik olarak View'lari güncellerler. Uygulamamızdaki Observer'lar, modelde gerçekleşen herhangi bir değişikliği otomatik olarak algılayarak bu değişikliğin sonucunda view'lari günceller. Bu sayede, modelde yapılan bir değişiklik sadece Observer'lar tarafından takip edilir ve view'larda otomatik olarak güncellenir. Bu adımda, Observer'ları oluşturarak model ile view arasındaki haberleşmeyi sağlıyoruz. Öncelikle, bir Observer sınıfı oluşturuyoruz. Bu sınıf, hem homepage hem de news sayfasındaki view'ları güncelleyebilir. Ardından, Model sınıfına bir Observer nesnesi eklenir ve bu Observer nesnesi view'ların güncellenmesi gerektiğinde çalıştırılacak fonksiyonu içerir.Observer oluşturmak için; ```javascriptclass Observer { constructor() { this.observers = []; } subscribe(fn) { this.observers.push(fn); } unsubscribe(fn) { this.observers = this.observers.filter(subscriber => subscriber !== fn); } update(data) { this.observers.forEach(subscriber => subscriber(data)); }}```Bu kod parçası, bir Observer sınıfı oluşturur. Observer, subscribe, unsubscribe ve update işlevlerini içerir. View da, Observer sınıfına abone olur ve model de Observer'a update fonksiyonunu bildirir.Bu sayede, view'lerde bir değişiklik olması durumunda, Observer Pattern aracılığıyla bu değişikliklerin takibi sağlanır ve ilgili model/kod sekmelerinde otomatik olarak güncellenerek kullanıcı deneyimi artırılır.

Adım 4: Yeni Haber Ekleme

Express.js uygulamasında yeni bir haber eklemek için, kök dizindeki index.js dosyasındaki router.post() fonksiyonuna yeni bir endpoint ekleyin. Endpoint, POST isteği aldığında modeldeki haberleri güncelleyecek ve Observer'lara yeni bir durum bildirecektir.

Aşağıdaki örnek, Express.js uygulamasına yeni bir haber ekleme işlemini göstermektedir:

router.post('/haberler', function(req, res) {  var yeniHaber = req.body;  model.haberEkle(yeniHaber);  observerlar.durumGuncelle(model);  res.redirect('/');});

Bu kodda, newHaber değişkeni Request Body'den alınarak model.haberEkle() fonksiyonuna gönderilir. Bu fonksiyon, modeldeki haber listesine yeni bir haber ekler. Sonrasında, Observer'lar yeni durumu fark eder ve view'leri otomatik olarak güncelleyerek kullanıcılara yeni haberi sunar.