4 Mart 2015 Çarşamba

Node.js , Express ve MongoDB ile basit bir web application yazma.

Node.js ve Express'i yükleyin.
Node.js i kendi web sitesinden indirip yükleyebiliyoruz.
Expressi yüklemek için:
C:\node>npm install -g express
C:\node>npm install -g express-generator

Böylece c:\node klasörüne expressi yüklemiş olduk.

Şimdi bir node projesi yaratalım:
C:\node>express nodetest1

Böylece proje yaratılmış oldu. Node.js de proje yaratıldığında bir package.json dosyası yaratılır. Bu dosyaya MongoDB ve Monk kullanmak istediğimizden bunları ekliyoruz:

"mongodb": "*",
    "monk": "*"

Komut satırına dönüp yükleme komutunu veriyoruz:
C:\node\nodetest1>npm install

Böylece projenin dependency'leri yüklenmiş oluyor.

MongoDB verisini tutacak bir yer yaratalım:
C:\node\nodetest1>mkdir data

Şimdi web serverı çalıştıralım:
C:\node\nodetest1>npm start

Server çalışmaya başladı.
http://localhost:3000 adresine gittiğimizde welcome yazısını görürüz.

Şimdi server çalıştığına göre hello world yazdıralım.
Proje klasöründeki routes içinde index.js i açalım.
Burada module.exports satırının hemen üzerine şu metodu ekleyelim:

/* GET Hello World page. */
router.get('/helloworld', function(req, res) {
    res.render('helloworld', { title: 'Hello, World!' })
});

Sonra views folder içindeki index.jade i açalım.
Bu dosyayı helloworld.jade olarak kaydedelim.
Sadece şu değişikliği yapalım:
p Hello, World! Welcome to #{title}

Komut satırından server çalışıyorsa ctrl+c ile durduralım.
Yeniden çalıştıralım:
C:\node\nodetest1\> npm start
Server çalışmaya başladığında göre yeni yazdığımız helloworld sayfasını açalım:
http://localhost:3000/helloworld

MongoDB yükleyin : http://mongodb.org/ adresinden yükleyebiliyoruz.
Örneğin C:\mongo klasörüne kopyalayın.

Şimdi mongo serveri çalıştıralım:
C:\mongo> mongod --dbpath c:\node\nodetest1\data
Sonra aynı yerde şunu yazalım:
mongo

Şimdi mongo konsolunda bir veritabanı yaratalım:
use nodetest1

Veritabanına veri ekleyelim:
db.usercollection.insert({ "username" : "testuser1", "email" : "testuser1@testdomain.com" })

Sonra satır satır dizilmiş şekilde görmek için:
db.usercollection.find().pretty()

Mongo konsolunda yeni veriler ekleyelim:
newstuff = [{ "username" : "testuser2", "email" : "testuser2@testdomain.com" }, { "username" : "testuser3", "email" : "testuser3@testdomain.com" }]
db.usercollection.insert(newstuff);

Tekrar satır satır görmek için :
db.usercollection.find().pretty()

Şimdi sıra Mongo'yu node a bağlamaya geldi.
C:\node\nodetest1\app.js i açalım.

bodyParser ın altına şunları ekleyelim:
var mongo = require('mongodb');
var monk = require('monk');
var db = monk('localhost:27017/nodetest1');

Sonra app.use('/', routes); satırının hemen üzerine ekleyelim :
// Make our db accessible to our router
app.use(function(req,res,next){
    req.db = db;
    next();
});

Şimdi Mongodan verileri çekip göstermeye sıra geldi.
C:\node\nodetest1\routes\index.js açalım. Ekleyelim:
/* GET Userlist page. */
router.get('/userlist', function(req, res) {
    var db = req.db;
    var collection = db.get('usercollection');
    collection.find({},{},function(e,docs){
        res.render('userlist', {
            "userlist" : docs
        });
    });
});

C:\node\nodetest1\views\index.jade açalım ve userlist.jade olarak kaydedelim.
Şöyle değiştirelim:
extends layout

block content
    h1.
        User List
    ul
        each user, i in userlist
            li
                a(href="mailto:#{user.email}")= user.username

Şimdi server çalışıyorsa kill edelim. Yeniden başlatalım:
C:\node\nodetest1>npm start

http://localhost:3000/userlist i açınca DBden alınıp ekrana getirilen nesne listesini görebiliriz.

Şimdi sıra veritabanına yazmaya geldi.
/routes/index.js açalım ve  son module.exports satırından hemen önce ekleyelim:
/* GET New User page. */
router.get('/newuser', function(req, res) {
    res.render('newuser', { title: 'Add New User' });
});

/views/index.jade açalım ve newuser.jade olarak kaydedelim.
İçeriği değiştirelim:
extends layout

block content
    h1= title
    form#formAddUser(name="adduser",method="post",action="/adduser")
        input#inputUserName(type="text", placeholder="username", name="username")
        input#inputUserEmail(type="text", placeholder="useremail", name="useremail")
        button#btnSubmit(type="submit") submit

Node serverı yeniden başlatalım.
http://localhost:3000/newuser açtığımızda yeni kayıt ekleme formunu görürüz.

Şu anda yeni kayıt eklenemiyor. Şimdi bu fonksiyonu ekleyelim.
/routes/index.js açıp sondaki module.exports satırından hemen önce ekleyelim:
/* POST to Add User Service */
router.post('/adduser', function(req, res) {

    // Set our internal DB variable
    var db = req.db;

    // Get our form values. These rely on the "name" attributes
    var userName = req.body.username;
    var userEmail = req.body.useremail;

    // Set our collection
    var collection = db.get('usercollection');

    // Submit to the DB
    collection.insert({
        "username" : userName,
        "email" : userEmail
    }, function (err, doc) {
        if (err) {
            // If it failed, return error
            res.send("There was a problem adding the information to the database.");
        }
        else {
            // If it worked, set the header so the address bar doesn't still say /adduser
            res.location("userlist");
            // And forward to success page
            res.redirect("userlist");
        }
    });
});

Mongod nin çalışıyor olduğundan emin olun.
Node serveri yeniden başlatalım:
C:\node\nodetest1>npm start

http://localhost:3000/newuser açtığımızda kayıt ekranı görünüyor.
Yeni bir kayıt ekleyelim ve /userlist ekranında yeni kaydın eklendiğini görelim.

Böylece Node.js, Express ve Jade kullanarak bir MongoDB veritabanına okuma/yazma yapmayı öğrenmiş olduk.





Hiç yorum yok:

Yorum Gönder