July 17, 2013
by Sabit Huraira
Sebelumnya saya pernah posting simple example how to use nodejs dengan express untuk membuat form sederhana di https://sabitlabscode.wordpress.com/2013/07/03/nodejs-express-make-simple-form/. Tentunya tidaklah cukup hanya membuat simple form, paling tidak kita harus tahu bagaimana cara menghubungkan nodejs itu sendiri ke database. Kali ini saya akan memaparkan bagaimana membuat operasi CRUD (Create, Read, Update, Delete) pada nodejs dengan sasaran databasenya Mysql. Pertama-tama buatlah sebuah aplikasi baru dengan nodejs. Lalu hal yang kita butuhkan adalah sesuatu untuk menghubungkan nodejs dengan mysql database. Untuk itu kita perlu menginstallnya dengan cara mengetikkan code berikut pada command anda :
npm install mysql
Setelah itu definisikan module mysql pada aplikasi anda, pada app.js pastikan code konfigurasi anda seperti berikut :
var express = require('express')
, routes = require('./routes')
, user = require('./routes/user')
, http = require('http')
, path = require('path')
, mysql = require('mysql');
var app = express();
var connection = mysql.createConnection({
host : 'your host',
user : 'your user',
password : 'your password',
database : 'database name'
});
Saya asumsikan kita memiliki sebuah database dengan nama tabel “author” dimana tabel ini terdiri dari 3 buah column yaitu : id, first_name, dan last_name. Kita ingin membuat fungsi-fungsi yang dapat melakukan hal-hal berikut :
– melihat semua data pada tabel author
– melihat data detail pada tabel author
– menghapus data pada tabel author
– memperbaharui data pada tabel author
– membuat data baru
Pertama-tama, kita definisikan terlebih dahulu fungsi-fungsi di atas.
1. View All Data
Pada app.js, masukkan code berikut :
//show all data from author table
app.get('/author', function(req, res) {
sql='SELECT * FROM author';
// execution sql and save result to "rows"
connection.query(sql, function(e, rows, f) {
if (!e) {
//render "author" page
//and send "rows" as "data"
res.render('author', {
data: rows
});
}
});
});
Kemudian pada folder “views”, buatlah file “author.jade” yang akan menampilkan user interfacenya. Masukkan code berikut pada file “author.jade” :
extends layout
block content
h1= title
p Welcome to Author
a(href="/author/new")!= "Add New Author"
#Daftar Author
table
thead
tr
th Firstname
th Lastname
tbody
each row in data
tr
td= row.first_name
td= row.last_name
td
a(href="/author/view/"+row.id)!= "View"
2. View Detail Data
Untuk menampilkan data secara detail, tambahkan kode berikut pada “app.js” :
//view detail data
app.get('/author/view/:id', function(req, res) {
//get parameter :id and save it in "tid"
var tid=req.params.id;
sql='SELECT * FROM author WHERE id='+connection.escape(tid);
// execution query and save result to "rows"
connection.query(sql, function(e, rows, f) {
//check if there is error or data not found
if (!e && (rows.length === 1))
{
//get first data and save it to "row"
var row = rows[0];
//render "author_view" and send some value
res.render('author_view', {
title: 'New Author',
data : row
});
}
else {
//write error when error
console.log(e);
}
});
});
Setelah itu buatlah “author_view.jade” pada folder “views” dan masukkan kode berikut :
extends layout
block content
h1= title
div.newsiswa
div
div= data.first_name
div= data.last_name
a(href="/author/update/"+data.id)!= "[Update]"
label
a(href="/author/delete/"+data.id)!= "[Delete]"
3. Insert New Data
Masukkan kode berikut pada app.js :
//we have 2 request in author/new
//"get" will run when we request author/new
//and "post" will run when we do submit data
app.get('/author/new', function(req, res) {
//render "author_new"
res.render('author_new', {
title: 'New Author'
});
});
app.post('/author/new', function(req, res) {
//get value that have been submitted
//and save it in variable
var fname = req.param('firstname');
var lname = req.param('lastname');
sql='INSERT INTO author(first_name,last_name) VALUES("'+fname+'","'+lname+'")';
//do query
connection.query(sql, function(e, rows, f) {
if (!e) {
res.redirect('/author')
}
});
});
dan untuk tampilannya yaitu “author_new.jade” masukkan code berikut :
extends layout
block content
h1= title
div.newsiswa
form( method="post")
div
div
span.label Firstname :
input(type="text", name="firstname")
div
span.label Lastname :
input(type="text", name="lastname")
div#editEmployeeSubmit
input(type="submit", value="Save")
a(href="/author")!= "Back to Author List"
4.Updata Data
Masukkan code berikut pada app.js
//same with author/new
//author update have 2 request
app.get('/author/update/:id', function(req, res) {
//get parameter :id and save it to "tid"
var tid=req.params.id;
sql='SELECT * FROM author WHERE id='+connection.escape(tid);
//show data to the form
connection.query(sql, function(e, rows, f) {
if (!e && (rows.length === 1))
{
var row = rows[0];
res.render('author_update', {
title: 'Update Author'+row.first_name+' '+row.last_name,
data : row
});
}
else {
console.log(e);
}
});
});
app.post('/author/update/:id', function(req, res) {
//get parameter :id
var tid=req.params.id;
//get data that have been submitted
var fname = req.param('firstname');
var lname = req.param('lastname');
sql='UPDATE author SET first_name="'+fname+'",last_name="'+lname+'" WHERE id='+tid;
//do query
connection.query(sql, function(e, rows, f) {
if (!e) {
res.redirect('/author')
}
});
});
Lalu masukkan kode berikut pada “author_update.jade” yang telah anda buat pada folder “views”:
extends layout
block content
h1= title
div.newsiswa
form( method="post")
div
div
span.label Firstname :
input(type="text", name="firstname", value=data.first_name)
div
span.label Lastname :
input(type="text", name="lastname", value=data.last_name)
div#editEmployeeSubmit
input(type="submit", value="Save")
a(href="/author")!= "Back to Author List"
5. Delete Data
Untuk delete data sendiri tidak akan memanggil tampilan suatu form, dia hanya akan mengeksekusi dan setelah itu langsung redirect ke halaman “author”, untuk itu masukkan kode seperti berikut :
//delete data
app.get('/author/delete/:id', function(req, res) {
// get parameter :id
var tid=req.params.id;
sql='DELETE FROM author WHERE id='+connection.escape(tid);
//do query
connection.query(sql, function(e, rows, f) {
if (!e)
{
//redirect to "/author"
res.redirect('/author')
}
else {
console.log(e);
}
});
});
Itulah dia cara melakukan operasi crud pada suatu tabel dengan menggunakan msyql database.
Selesai… Hope it help.. Happy coding..
Komentar