3 Ağustos 2012 Cuma

NodeJS Express Framework

Daha önceki yazılarımızda NodeJS kurulumu ve npm ile express framework kurulumundan bahsetmiştik. Express nodejs ile çok daha kolay ve hızlı geliştirme yapmamıza imkan sağlayan bir web çatısıdır(web framework). Daha önce kurmuş olduğumuz WebMatrix programı açılıp templates diyerek yeni bir Node tabından Empty Site şablonu seçilir.Site adına "Express Sample" adını verelim. Her ne kadar diğer şablonlarda Express kurulu olarak gelse de bu yazımızda npm ile Express kurulumunu da göstermek adına Empty Site şablonu üzerinden devam edeceğiz.



"Next" dedikten sonra WebMatrix bizim için şablon uygulamamızı hazırlayacak. Sol alt köşede yer alan Files sekmesine tıkladığımızda projemizde yer alan dosyaların görüntülendiğini göreceğiz. Devam etmeden önce express kurulumu yapmak için Command Prompt açılıp dizin olarak projemizin oluşturulduğu dizine geçiş yapılır.

cd Dcouments\My Web Sites\Express Sample komutu çalıştırılır. Daha önce site adını farklı verdiyseniz çalıştıracağınız komut da buna göre değiştirilmelidir.

npm install express komutu çalıştırılır.
Kurulum bittikten sonra proje altındaki kurulu paketleri görüntülemek için
npm ls
komutu çalıştırılıp Express'in listelendiği görülür.

Şimdi WebMatrix'e dönüp server.js dosyamızda express'i kullanmak için ilgili kodlarımızı yazalım.
var express = require('express'),
app = express.createServer();
 
app.get('/', function(req, res) {
    res.send('Express deneme');
});
 
app.listen(process.env.PORT || 8080);

express ile suncumuzu oluşturduktan sonra "\" ile gelecek requestleri dinlemesi için metodumuzu yazıyoruz.Bunun dışında bir request yapıldığında 404 hatasına karşılık gelen "Cannot GET /{istek yapılan sayfa}" cevabını döndürecektir.

Bu şekilde farklı sayfalara yapılan istemleri yönlendirebiliriz. Örneğin, id request parametresi alan urun sayfamız olsun.Bu sayfaya yaptığımız istemleri gelen request parametresinin değeri ile ekrana yazdıralım.
app.get('/urun/:id', function(req, res)
{ res.send('Talep edilen ürün:'+req.params.id); });

kodlarını server.js içerisine eklememiz yeterli olacaktır. Tanımlanmayan bir sayfaya istem yapıldığında gösterdiğimiz 404 hata sayfasını özelleştirelim.
app.use(function(req, res, next)
 { res.send("Böyle bir sayfa yok ki", 404); });

metodunu eklediğimizde server içerisinde talep edilen istem tanımlanmadıysa çalışacak ve kullanıcıya bizim tanımladığımız cevabı döndürecektir.Adres çubuğundan herhangi bir adres girişi yaparak sayfayı test edebiliriz.
Şu ana kadar verdiğimiz örneklerde response'a direkt ekleme yaptık, tanımlayacağımız myFirstPage sayfası için myFirstPage.ejs dosyasının görüntülenmesini sağlayalım. Bu işlem için öncelikle EJS paketini kurmamız gerekmektedir.EJS veri ile şablonları birleştirerek html oluşturmamız sağlayan javascript kütüphanesidir. Kurulum işlemi için command prompt açılıp, projemizin dizinine eriştikten sonra

- npm install ejs komutu çalıştırılır.
app.get('firstHtmlPage/:id', function(req, res)
 { res.render("firstHtmlPage.ejs", {itemRequested:req.params.id,layout:false}); }); 

metodu eklenerek firstHtmlPage'e request gönderdiğimizde proje içerisinde firstPage.js dosyasını bulamadığı için hata verecektir. Proje klasörüne sağa tıklanıp yeni bir klasör açılarak "views" olarak isimlendirilir.

Yeni oluşturulan klasöre sağa tıklayarak new File denilip HTML dosyası seçilir, firstHtmlPage.ejs olarak isimlendirilir.




Html Dosyası Ürün sayfası

Talep Edilen Ürün id: <%=itemRequested%> "itemRequested" oalrak server.js içerisinde tanımladığımız request parametresini sayfa içerisinde "<%=%>" tagleri arasında kullandık. adres çubuğundan "/firstHtmlPage/urun" isteminde bulunduğumuzda yazdığımız html görüntülenecektir.



NodeJS versiyonu ve tüm kodlara ulaşabileceğiniz github adresi aşağıda yer almaktadır.
Node Version : v0.8.4
GitHub: GitHub

Hiç yorum yok:

Yorum Gönder