Making Todolist with node.js and mongo Part VII

အခု task တစ်ခု ပြီးသွားတဲ့ ကိစ္စကို သွားရအောင်။ Done ကို နှိပ်လိုက်တာနဲ့ /done/:id ကို သွားမယ်။ ပြီးရင် ပြန်လာမယ်။
ဒါကြောင့် အောက်ကလို ရေးလိုက်တယ်။

app.get('/done/:id',function(req,res){
   taskProvider.closeByid("saturngod",req.params.id,function(error,result){
      res.redirect('/');
   });
});

ပြီးတဲ့ အခါ ကျွန်တော်တို့မှာ closeByid မရှိသေးဘူး။ closeByiD က username နဲ့ task id ပေါ်မှာ မူတည်ပြီး done ကို 1 ဆိုပြီး update လုပ်ပေးရမယ်။ ဒါကြောင့် set ကို သုံးပြီး current id သိအောင် $.done နဲ့ သုံးရမယ်။ code ကို အောက်မှာ ကြည့်လိုက်ပါ။ dataprovider.js မှာ အောက်ကလို ဖြည့်လိုက်တယ်။
Continue reading “Making Todolist with node.js and mongo Part VII”

Making Todolist with node.js and mongo Part V

ရှေ့ပိုင်းမှာတော့ value တွေ ထည့်တာ task အသစ်ထပ်ဖြည့်တာတွေကို ပြောပြီးပါပြီ။ အခု Mongodb ကိုပဲ ရှေ့ဆက်ရအောင်။

Update Value

အခု ကျွန်တော်တို့တွေ Task တစ်ခု done ဖြစ်သွားတဲ့ အခါမှာ done ကို 1 ပြောင်းပေးပါမယ်။ ဒီတော့ လက်ရှိ object ကို update လုပ်ရပါမယ်။

> db.tasks.update({user:'saturngod',"todo.id":1},{"$set":{"todo.$.done":1}})

ဆိုပြီး ရိုက်လိုက်ပါ။

todo.id ဆိုတာက todo အောက်က id field ကို ညွှန်းလိုက်တာပါ။ id က 1 ဖြစ်ရမယ်ဆိုပြီး ညွှန်းလိုက်တာပါ။

$set ကတော့ ပြန်ပြင်ဖို့ပေါ့။ todo.$.done ဆိုတာကတော့ ကျွန်တော်တို့ ရှာတွေ့ထားတဲ့ array number အောက်က done field ကို 1 လို့ ပြင်လိုက်တာပါ။
Continue reading “Making Todolist with node.js and mongo Part V”

Making Todolist with node.js and mongo Part IV

အခုဆိုရင်တော့ mongodb ကို နည်းနည်း သဘောပေါက်သွားလောက်ပါပြီ။ အခု project structure ကို ရှင်းပြပါမယ်။ Project က Task တွေကို add မယ်။ Task Done ဖြစ်သွားရင် မှတ်ထားမယ်။ မလိုအပ်တဲ့ task တွေကို ပြန်ဖျက်မယ်။ ဒီတော့ data ကို အောက်ပုံစံနဲ့ သိမ်းလိုက်ပါတယ်။

{"user" : "saturngod", "todo" : [
	{
		"id" : 1,
		"desc" : "hi",
		"done" : 0
	},
	{
		"id" : 2,
		"desc" : "hello",
		"done" : 0
	}
],
"lastid":2
 }

data တွေကို username ပေါ်မှာ မူတည်ပြီး သိမ်းလိုက်ပါတယ်။ todo ကို array နဲ့ သိမ်းပါမယ်။ ဖြစ်မပြီးကို သိဖို့ အတွက် done ကို 0 နဲ့ 1 သတ်မှတ်ပါမယ်။ နောက်ဆုံး သိမ်းထားတဲ့ id နံပတ်ကို သိအောင် lastid နဲ့ သိမ်းထားလိုက်ပါတယ်။ MySQL မှာ auto increment မပါတဲ့အတွက် အသစ်ဖြည့်တာ အခါမှာ id ကို ကိုယ့်ဘာသာ ကိုယ် တိုးဖို့အတွက် သိမ်းခဲ့တာပါ။

Install Mongodb

အရင်ဆုံး mongodb ကို ဒီကနေ http://www.mongodb.org/downloads download ချလိုက်ပါ။

အခု ကျွန်တော် အသုံးပြုမှာကတော့ 1.8.1 ပါ။ ၄ လပိုင်း ၆ ရက်နေ့ က ထွက်တဲ့ နောက်ဆုံး stable version ပေါ့။

tgz file ကို ဖြည်လိုက်တဲ့အခါမှာတော့ mongodb folder ထဲမှာ bin folder ကို တွေ့ပါမယ်။ ကျွန်တော် အခု ဖြည်လို့ရလာတဲ့ folder ကို mongodb လို့ နာမည်ပေးပြီး home folder အောက်က document folder ထဲထည့်လိုက်ပါမယ်။ သင်လည်း သင့်စိတ်ကြိုက်နေရာမှာ သိမ်းနိုင်ပါတယ်။ ပြီးရင် Environment variable အတွက် terminal ကို ဖွင့်လိုက်ပါ။ ကျွန်တော် တို့တွေ အစပိုင်းမှာ .profile file ကို ဖန်တီးခဲ့တာ မှတ်မိပါအုံးမယ်။ အဲဒီ အထဲမှာ အခု mongodb bin folder ကို ထည့်လိုက်ပါမယ်။ ကျွန်တော်ကတော့ ~/.bash_profile ထဲမှာ သိမ်းထားလို့ အဲဒီ file လေးကို ဖွင့်ပြီးအောက်ကလို ထပ်ဖြည့်လိုက်ပါတယ်။

$HOME/Documents/mongodb/bin

ဆိုတာလေး ဖြည့်လိုက်ပါတယ်။ သင်လည်း သင် mongodb သိမ်းထားတဲ့ path ကို ထည့်ရုံပါပဲ။ ပြီးရင် ပြန်ပြီး load ခေါ်ပါမယ်။

$vim ~/.bash_profile
$source ~/.bash_profile

mongodb က data ကို /data ထဲမှာ သွားသိမ်းပါတယ်။ ဒါကြောင့် ကျွန်တော်တို့ data သိမ်းဖို့အတွက် folder ဆောက်ရပါမယ်။

$sudo mkdir /data
$sudo mkdir /data/db
$sudo chown -R $USER /data
$sudo mongod
အဲဒါပြီးရင်တော့ mongodb server ကို run လို့ရပါပြီ။ တကယ်လို့ အဲလိုမျိုး မတည်ဆောက်ချင်ဘူးဆိုရင်လည်း အဆင်ပြေတဲ့ folder ကို dbpath ပေးပြီး ခေါ်လို့ရပါတယ်။

$sudo mongod –dbpath your_path

mongodb server run ပြီးရင်တော့ ကျွန်တော်တို့တွေ client ကို run ကြည့်ပါမယ်။ အဲဒီ အတွက် နောက်ထပ် terminal တစ်ခု ခေါ်ရပါမယ်။ လက်ရှိ server run ထားတာ မပိတ်လိုက်ပါနဲ့။

$sudo mongo

လို့ ခေါ်လိုက်ရင် client ဘက် ရောက်သွားပါမယ်။

Save Data on Mongodb Client

client ကို စမ်းပါမယ်။ အရင်ဆုံး database တစ်ခု ဆောက်ပါမယ်။

> use tatoo
switched to db tatoo
> db.tasks.save({user:’saturngod’ , todo:[{id:1,desc:’hello’,done:0}],lastid:1})

ဆိုပြီး save လုပ်လိုက်ပါမယ်။ tasks ဆိုတာကတော့ collection ပါ။ MySQL မှာဆိုရင်တော့ Table ပေါ့။ Mongodb မှာ database , collection တွေကို create လုပ်ပေးစရာမလိုပဲ အလိုလို တည်ဆောက်ပေးပါတယ်။

ပြီးရင် သိမ်းထားတဲ့ data ကို ပြန်စစ်ရအောင်။

> db.tasks.find()
{ “_id” : ObjectId(“4df475be7b55990799b034f5”), “user” : “saturngod”, “todo” : [ { “id” : 1, “desc” : “hello”, “done” : 0 } ] , lastid:1 }

return ပြန်လာတဲ့အခါမှာ _id အလိုလို ပါလာတာ တွေ့မှာပါ။ သူက objectID ကို သိမ်းထားတာပါ။ save လုပ်လိုက်တိုင်း objectId တစ်ခု အလိုလိုပါလာပါတယ်။

Update Data on Mongodb Client

ကျွန်တော်တို့ နောက်ထပ် todo တစ်ခု ထပ်ဖြည့်ရအောင်။

> db.tasks.update({user:”saturngod”},{“$push”:{todo:{id:2,desc:”world”,done:0}},”$inc”:{lastid:1}})

db.tasks.update မှာ ပထမ parameter က query ရှာတာ ဖြစ်ပြီး ဒုတိယ အပိုင်းကတော့ update လုပ်တာပါ။ user:saturngod ကို ရှာလိုက်တယ်။ ပြီးတော့ todo array ထဲမှာ update လုပ်ချင်တာကြောင့် $push ကို အသုံးပြုလိုက်တယ်။ lastid ကို သိရအောင် $inc နဲ့ 1 တိုးပြီး increase လုပ်လိုက်ပါတယ်။ ပြီးရင် find နဲ့ result ကို စစ်ကြည့်ရအောင်။

> db.tasks.find()
{ “_id” : ObjectId(“4df4b7fce68a6352c234f660”), “lastid” : 2, “todo” : [
{
“id” : 1,
“desc” : “hello”,
“done” : 0
},
{
“id” : 2,
“desc” : “world”,
“done” : 0
}
], “user” : “saturngod” }

ဆိုပြီးတွေ့ရမှာပါ။

နောက်အပိုင်းမှာတော့ task ဖျက်တာနဲ့ task done ဖြစ်တာကို ရေးပေးပါအုံးမယ်။

CSS Myanmar EBook

ဒီစာအုပ်ကို ရေးတာ ဘယ်လောက် ကြာလို့ ကြာသွားမှန်းတောင် မသိတော့ဘူး။ သေချာတာကတော့ ၁ နှစ်ကျော်သွားပြီဆိုတာပဲ။ ၁ နှစ်အတွင်းမှာ အားတဲ့ အချိန်တွေမှာ တဖြည်းဖြည်းခြင်းရေးခဲ့တာ အခုတော့ ပြီးသွားပါပြီ။ ကျွန်တော် ရေးတဲ့အချိန်တုန်းက CSS 3 က ပေါ်ကစဖြစ်ပြီး browser အားလုံး support မလုပ်သေးပါဘူး။ ဒါကြောင့် အခု CSS စာအုပ်မှာ CSS 3 အကြောင်းမပါလာခဲ့ပါဘူး။ စာလုံးပေါင်းမှားနေတာ ရေးထားတာမှားနေတာတွေကို ဝေဖန်ထောက်ပြနိုင်ပါတယ်ဗျာ။

Download

Making Todolist with node.js and mongo Part II

အပိုင်း၁ မှာတော့ Node.js ဆိုတာ ဘာလဲ။ ဘယ်လို သွင်းရလဲ စတာတွေကို ရေးပြခဲ့ပြီးပါပြီ။ နောက်ပြီးတော့ hello world ဥပမာလေးလည်း ရေးပြခဲ့ပါတယ်။ သို့ပေမယ့် code လေးတွေကို မရှင်းပြရသေးပါဘူး။ အခု Hello World ရေးထားတဲ့ code လေးကို လေ့လာရအောင်။

var sys = require("sys");
    http = require("http");

http.createServer(function(request, response) {
    response.sendHeader(200, {"Content-Type": "text/html"});
    response.write("Hello World!");
    response.close();
}).listen(3000);

sys.puts("Server running at http://localhost:3000/");

ဆိုတဲ့ code မှာ

var sys = require("sys");

require ဆိုတာကတော့ php မှာ include ခေါ်သလို python မှာ import လုပ်သလိုပေါ့။ Node.js မှာတော့ require က module တွေ ခေါ်တာပေါ့။ Module ဆိုတာက Node.js မှာ အရန်သင့် အသုံးပြုရန် အတွက် ရေးထားတဲ့ library တွေပါ။ System မှာ default ပါတဲ့ module တွေ ကို ခေါ်ပြီး အသုံးပြုလို့ရသလို Third Party Module တွေကိုလည်း ခေါ်ပြီးသုံးလို့ရပါတယ်။ Node.js မှာပါတဲ့ module အကြောင်းတွေကို ဒီမှာ ဖတ်နိုင်ပါတယ်။

အပေါ်က code က sys module နဲ့ http module ၂ ခုကို ခေါ်လိုက်ပါတယ်။ sys module ကတော့ terminal မှာ message ပြဖို့နဲ့ http module ကတော့ website အတွက်ပေါ့။ port 3000 နဲ့ web server တစ်ခုကို ဆောက်လိုက်ပါတယ်။ sendHeader နဲ့ header ကို ကြေငြာပြီးတော့ hello world ကို ရိုက်ထုတ်လိုက်ပါတယ်။

NPM

NPM ကတော့ Node Package Manager ပါ။ တနည်းပြောရင် module installer ပေါ့။ Node မှာ ရှိတဲ့ module တွေကို npm ကနေ တဆင့်သွင်းလို့ရပါတယ်။ ဘာနဲ့ ဆင်တူသလဲဆိုတော့ apt-get install လို လို့ ပြောလို့ရပါတယ်။ NPM က node.js module developer တွေအနေနဲ့ npm ပေါ် လွယ်လင့်တကူ publish လုပ်လို့ရသလို node.js ကို အသုံးပြုပြီးရေးနေတဲ့သူတွေအနေနဲ့ module တွေကို လွယ်လင့် တကူ install လုပ်လို့ရပါတယ်။

Installing NPM

$ sudo curl http://npmjs.org/install.sh | sh

ဆိုပြီး သွင်းလိုက်ရုံပါပဲ။ သူ့ဘာသာသူ download ချပြီး သွင်းသွားပါလိမ့်မယ်။ တကယ်လို့ သွင်းမရဘူးဆိုရင်တော့ git ကနေ တဆင့်သွင်းပါမယ်။

$ git clone http://github.com/isaacs/npm.git
$ cd npm
$ sudo make install

NPM သွင်းလို့ ပြီးရင်တော့ express web framework လေးကို စမ်းကြည့်ရအောင်။

Starting Project

အခု todo list ကို စလုပ်ပါတော့မယ်။ မစခင်မှာ express framework ကို စမ်းကြည့်ပါမယ်။ express ဆိုတာက Node.js အတွက် web framework ပါ။ node တစ်ခုတည်းမှာဆိုရင်တော့ url ပေါ်မှာမူတည်ပြီး case နဲ့ စစ်စစ်ပြီး website အတွက် ရေးပေးရပါတယ်။ နောက်ပြီး template system တွေ အတွက် သီးသန့် ထပ်ရေးပေးဖို့ လိုပါတယ်။ express ကနေ template နဲ့ အလွယ်တကူပေါင်းနိုင်အောင် နောက်ပြီး mongodb နဲ့ အလွယ်တကူ အသုံးပြုနိုင်အောင် ဖန်တီးပေးပြီးသားပါ။

Install Express

အရင်ဆုံး project တစ်ခု ဆောက်ရအောင်။

$ mkdir ~/tatoo
$ cd ~/taoo
$ touch index.js
$ npm install express

ပြီးရင် index.js မှာ express framework ကို စမ်းပါမယ်။

var app = require('express').createServer();

app.get('/', function(req, res){
    res.send('Hello World');
    });

app.get('/helloworld',function(req,res){
        res.send('Working');
});

app.listen(3000);

ပြီးရင်

$ node index.js

ဆိုပြီး run လိုက်ပါ။ browser ကနေ http://localhost:3000 ကို ခေါ်ကြည့်ပါ။ နောက်ပြီး http://localhost:3000/helloworld ကို ခေါ်ကြည့်ပါ။ အလုပ်လုပ်တယ်ဆိုရင်တော့ express framework အလုပ်လုပ်ပါပြီဗျာ။

နောက်နေ့တွေမှာ project structure အကြောင်းဆက်ရတာပေါ့ဗျာ။

Making Todolist with node.js and mongo Part I

Node.js နဲ့ Mongodb ကို အသုံးပြုပြီးတော့ Todo list လေး တစ်ခု တည်ဆောက်ပုံကို ရေးပြပါမယ်။ Todo list မှာ ဘာ feature တွေ ပါမလဲဆိုတော့ ထည့်မယ်။ ဖျက်ပြီ။ ပြီးသွားတဲ့ task တွေကို done လုပ်တာ ပါမယ်။ ဒီလောက်ပါပဲ။

Node.js

အရင်တုန်းကတော့ Javascript ဆိုတာ web browser client side တွေမှာ အလုပ်လုပ်တဲ့ script ပါ။ အခုအခါမှာတော့ Google V8 ကြောင့် Javascript ကို server side မှာ အသုံးပြုလို့ရလာပါပြီ။ Node.js ဟာ Google V8 ကို အသုံးပြုထားတဲ့ Event I/O framework ပါ။ Node.js က အရမ်းကို မြန်ပါတယ်။ PHP ထက်လည်း မြန်ပါတယ်။ နောက်ပြီးတော့ Real Time application တွေ ဖြစ်တဲ့ Friendfeed , Google Wave တို့လို့ application တွေကို လွယ်လွယ်နဲ့ ရေးလို့ရပါတယ်။ Nodejs ဟာ threads တွေ အစား event loop ကို အသုံးပြုထားပြီး concurrent connection millions အတွက် ကောင်းကောင်း အသုံးပြုနိုင်ပါတယ်။ file read write တွေ အသုံးပြုလို့ရသလို အခြား web service api တွေကိုလည်း ခေါ်သုံးလို့ရပါတယ်။

Step 1. Installtion

Node.js ဟာ Mac OS X , Linux နဲ့ FreeBSD တွေ မှာပဲ သုံးလို့ရပါတယ်။ Windows အသုံးပြုနေရင်တော့ ဒီ post series ကို ဆက်မဖတ်ပါနဲ့တော့။ Windows သမားတွေအနေဲ့ Cygwin ကို အသုံးပြုလို့ရသလို virtual box မှာ Ubuntu linux တင်ပြီး အသုံးပြုတာ ပိုအဆင်ပြေပါလိမ့်မယ်။ Windows မှာ Cygwin နဲ့ သွင်းပုံကို ဒီမှာ ဖတ်နိုင်ပါတယ်။

Linux သမားတွေအနေနဲ့ကတော့ ဘာမှ မလိုအပ်ပါဘူး။ သို့ပေမယ့် python 2.4 နဲ့ အထက်နဲ့ libss-dev ကိုတော့ သွင်းထားပေးဖို့လိုပါတယ်။

Mac OSX သမားတွေအနေနဲ့ကတော့ Xcode ကို သွင်းထားဖို့ လိုပါတယ်။ ဒါကြောင့် XCode ကို အရင် download ချပြီး မှ သွင်းလို့ရပါလိမ့်မယ်။

Github ကနေ ပြီးတော့ Node ကို download ချလိုက်ပါ။ အခု လက်ရှိ version ကတော့ 0.4.8 ဖြစ်တဲ့အတွက် 0.4.8 ကို download ချပါ ။ ပြီးသွားရင် zip ကို ဖြည်ချလိုက်ပါ ။ ပြီးရင် download ချပြီး zip ဖြည်ထားတဲ့ folder ထဲကို terminal ကနေ သွားလိုက်ပါ။

ဥပမာ။။

$ cd ~/Download/joyent-node-v0.4.8-0-g7dd22c2/joyent-node-950a048/

folder name တွေကတော့ တစ်ယောက်နဲ့ တစ်ယောက် တူမှာမဟုတ်ပါဘူး။ အခု cd နဲ့ သွားထားတာက example အနေနဲ့ ပြထားတာပါ။ cd နဲ့ node folder ထဲရောက် ပြီးရင် compile လုပ်ပါမယ်။

$export JOBS=2 # optional, sets number of parallel commands.
$mkdir ~/local
$./configure --prefix=$HOME/local/node
$make
$sudo make install
$export PATH=$HOME/local/node/bin:$PATH

ပြီးသွားရင် node command ကို ခေါ်ကြည့်ပါ။ ခေါ်လို့ရရင် Ctrl+ C နဲ့ ပြန်ထွက်ပြီး terminal ကို ပိတ်ပါ။ ပြီးရင် terminal ဖွင့်ပြီး
တကယ်လို့ ခေါ်လို့ မရရင်တော့ home folder အောက်မှာ .profile ဆိုတဲ့ file ကို vi ဆောက်ပါ။ home folder အောက်မှာ .profile သို့မဟုတ် .profile_bath ရှိမရှိ စစ်ပါ။ .bash_profile ရှိရင် တော့ .bash_profile ကိုပဲ vi နဲ့ ပြင်ပါမယ်။

$vi ~/.profile

သို့မဟုတ်

$vi ~/.profile_bath

ပြီးရင်

PATH=$HOME/local/node/bin:$PATH

ကို ဖြည့်လိုက်ပါ။

$ source ~/.profile

ဆိုပြီး load ပြန်လုပ်ပေးလိုက်ရင် ရပါပြီ။ terminal ကနေ node ခေါ်လို့ရရင်တော့ node.js ကို စရေးဖို့ အသင့်ဖြစ်ပါပြီ။

Hello World

index.js file ကို တနေရာတွင် ဆောက်လိုက်ပါ။ ကျွန်တော်ကတော့ Home folder အောက်မှာပဲ ဆောက်ထားလိုက်ပါတယ်။

$cd ~/
$mkdir Nodejs_test
$cd Nodejs_test
$touch helloworld.js

ပြီးရင် နှစ်သက်ရာ editor နဲ့ ဖွင့်လိုက်ပါ။ ကျွန်တော်ကတော့ vi နဲ့ပဲ ဖွင့်လိုက်ပါတယ်။ ( vi မသုံးတတ်ရင် မသုံးပါနဲ့။ နှစ်သက်ရာ editor ကို သုံးနိုင်ပါတယ်။ )

$vi helloworld.js

ပြီးရင် အောက်ကလို ရိုက်ကြည့်လိုက်ပါ။

var sys=require('sys');
sys.puts('Hello World');

ပြီးရင် save လုပ်ပြီးတော့ terminal ကနေ run ပါမယ်။

$node helloworld.js
Hello World

ဆိုပြီး return ပြန်လာတာ တွေ့ပါလိမ့်မယ်။ ကဲ.. အဲဒီ helloworld.js ကို အောက်ကလို ထပ်ပြင်ပါမယ်။

var sys = require("sys");
    http = require("http");

http.createServer(function(request, response) {
    response.writeHead(200, {"Content-Type": "text/html"});
    response.end("Hello World!");
}).listen(3000);

sys.puts("Server running at http://localhost:3000/");

ပြီးရင် terminal ကနေ ပြန် run ပါမယ်။

$node helloworld.js
Server running at http://localhost:3000/

ပြီးရင် browser ကနေ localhost:3000 ကို ရိုက်ပြီးခေါ်ကြည့်လိုက်ပါ။ Hello World ပေါ်နေတာကို တွေ့ရပါမယ်။

ကျွန်တော် macbook pro ပျက်သွားလို့ ပြင်ဖို့ ဆိုင်ပို့ထားရလို့ ရုံးကနေ မပြန်သေးပဲ ရေးနေတာပါ။ အိမ်ပြန်လည်း နောက်ကျနေပြီမို့ ဒီနေ့တော့ ဒီလောက်ပါပဲ။ နောက်နေ့ တွေမှာ npm သွင်းနည်းကို ရှင်းပြပါမယ်။

PHP Developer ကောင်း မပီသခြင်း Part II

အပိုင်း ၁ ကို ဒီမှာ ပြန်ဖတ်နိုင်ပါတယ်။

ကိုယ့် coding ကို အားကိုးလွန်းခြင်း

တချို့ ကိစ္စတွေမှာ ရိုးရိုးလေးနဲ့ အရှည်ကြီး ရေးရမယ့် coding နဲ့ သင့်ရဲ့ trick နဲ့ တိုတို လေး ရေးလိုက်လို့ရတာတွေ ရှိပါတယ်။ လူတိုင်း နီးပါးကတော့ ကိုယ်ပိုင် trick လေး သုံးပြီးရေးလိုက်ချင်တာပဲ။ သို့ပေမယ့် သင့် code က ပြန်ဖတ်တဲ့ အခါမှာ အရမ်းကို ရှုပ်ထွေးလွန်းနေပြီး သင်တစ်ယောက်တည်းသာ နားလည်နိုင်တယ်ဆိုရင်တော့ သင်ဟာ Developer ကောင်း ပီသတဲ့ သူမဟုတ်တော့ဘူး။ လူတိုင်းက သင့်လို မတော်ပါဘူး။ သင်ရေးတဲ့ code က သင့်တစ်ယောက်တည်း အတွက်ဆိုရင် ကိစ္စမရှိပေမယ့် နောင်တချိန် အခြားလူတစ်ယောက်က ပြန်ပြင်ရမယ်ဆိုရင်တော့ မသုံးသင့်ဘူးပေါ့။ ပြန်ပြင်တဲ့လူက သင့် code ကို လုံးဝ နားမလည်ဘူး သို့မဟုတ် သင့်လောက် မတတ်ဘူး မတော်ဘူးဆိုရင်တော့ သင့်ကို ပြန်မေးတာတွေကို သင်ပြန်ဖြေနေရလိမ့်မယ်။ လူတိုင်းက သင့်လောက် မတော်ပါဘူး။ ဒါကြောင့် ရိုးရှင်းပါ။
Continue reading “PHP Developer ကောင်း မပီသခြင်း Part II”

PHP Developer ကောင်း မပီသခြင်း

PHP ကို တတ်ကျွမ်းနားလည်ပြီး ကောင်းကောင်းမွန်မွန်ရေးတတ်ရုံနဲ့ တကယ်တော်တဲ့ PHP Developer အနေနဲ့ မသတ်မှတ်နိုင်ပါဘူး။ code တွေ လန်ပျံနေအောင် ရေးတတ်ပါစေ အချို့ အချက်တွေက Developer ကောင်းလို့ သတ်မှတ်ခြင်း မခံရစေပါဘူး။ ဘာအချက်တွေက သတ်မှတ်လို့မရဘူးလဲ။

Coding မရေးခင် ဘာမှ မစဉ်းစားထားခြင်း

Coding တစ်ခု စရေးတော့မယ်ပဲ ဖြစ်ဖြစ် project တစ်ခု စရေးတော့မယ်ဖြစ်ဖြစ် ဘာတွေ လုပ်မလဲ။ ဘယ်အဆင့်တွေကို ရေးမလဲဆိုတာကို ကြိုတင် list မလုပ်ထားဘူး။ လက်တန်း ချရေးနိုင်လို့ လက်တန်း ချရေးမယ်ဆိုရင်တော့ အဲဒီလူက တကယ်တော်တဲ့ PHP Developer မဟုတ်တော့ပါဘူး။ Developer ကောင်းတွေက မရေးခင်မှာ ဘာတွေ ပါမလဲဆိုတာကို အရင်စဉ်းစားထားပါတယ်။ UML မဆွဲဖြစ်ချင်ရင်တောင် Todo list ကို အနည်းဆုံးတော့ ပြင်ထားပါတယ်။ အချို့ Developer ကောင်းတွေက အရင်ဆုံး comment တွေ တောင် ကြိုပြီးရေးထားတတ်သေးတယ်။

<?php
// Include necessary data

// Initialize the database connection

// Include common header

// Determine the page variables from the POST data

// Load the proper database info with page variable

// Loop rows
    // Image Display
    // Create Image Link
    // Format the entry display
    // Add formatted entry to entry array
// Collapse the entry array
// Output the entries
// Include common Footer
?>

ဒါကတော့ ဥပမာ အနေနဲ့ ပြထားတာပါ။ ဘာ code မှ စမရေးခင် Pseudo သဘောမျိုး comment တွေ စဉ်းစားပြီး ရေးသွားတာပါ။ ကိုယ်တိုင် အဲဒီ class သို့မဟုတ် Library ကို မရေးဖြစ်ရင်တောင် ကိုယ့် colleague ( လုပ်ဖော် ကိုင်ဖက်) က ဘာတွေ ရေးရမလဲဆိုတာကို နားလည်ပြီး သူရေးနိုင်ပါတယ်။

Comment တွေ လုံးဝ မရေးခြင်း

Comment ရေးတယ်ဆိုတာ အပြောလွယ်သလောက် အလုပ်ရှုပ်တယ်ဆိုတာ မှန်ပါတယ်။ အများအားဖြင့် Rapid Developer တွေက comment ရေးရမှာ ပျင်းတတ်ကြတယ်။ Developer ကောင်း တစ်ယောက် အနေနဲ့ဆိုရင်တော့ comment က လိုအပ်ရင် ရေးထားသင့်ပါတယ်။

if(is_array($data_array))
{
    extract($data_array);
}
require(SITE_PATH."/application/View/".$view.".php");

က ကြည့်လိုက်ရင် သိပေမယ့် extract ကို ဘာလုပ်ဖို့ သုံးထားတာလဲ ဆိုတာ ရုတ်တရက် နားလည်ရခက်နေပါတယ်။


// extract for view variable
// $data_array['foo']='boo' to $foo='boo'
if(is_array($data_array))
{
    extract($data_array);
}
//load view
require(SITE_PATH."/application/View/".$view.".php");

ဒီလိုမျိုးလေး ရေးထားလိုက်ရင်တော့ extract manual ကို သီးသန့် သွားရှာဖတ်နေမယ့် အစား အလွယ်တကူ နားလည် သဘောပေါက်သွားနိုင်ပါတယ်။ မြန်မြန် ပြီးဖို့ အဓိက ဆိုပြီး comment တွေ မရေးသွားရင်တော့ နောက်တချိန် code တွေကို ပြန်ပြင်တဲ့အခါမှာ မှတ်မိတော့မှာ မဟုတ်တော့ပါဘူး။

Code လိုင်းတိုတို မရှင်းမလင်း

Code လိုင်းတိုဖို့ condition က bracket တွေကို ဖြုတ်ချထားတာတွေကို တွေ့ဘူးတယ်။ code line က တိုသွားတယ်။ ရှင်းတယ်။ သို့ပေမယ့် ပြန်ဖတ်တဲ့သူအတွက်ကတော့ ရှုပ်သွားတယ်။

$foo = 8;

if( $foo<10 )
    if( $foo>5 )
        echo "Greater than 5!";
    else
        echo "Less than 5!";
else
    echo "Greater than 10!";
    echo "<br />Another note.";

ဒီ code မှာဆိုရင် အောက်ဆုံး အကြောင်းက Loop ထဲပါတာလည်း မပါဘူးလားဆိုတာကို နားလည်မှုလွဲသွားနိုင်သလို ရှုပ်လည်း ရှုပ်သွားစေတယ်။ နောက်ပြီး if တွေက အဆင့်ဆင့် ပါတော့ ဘယ်အဆင့်က ဘာလဲဆိုတာကို နားလည်ဖို့ နည်းနည်း ခက်သွားပါတယ်။ ဒါကြောင့် {} တွေ ထည့်ခြင်းက အစ နဲ့ အဆုံးကို နားလည် စေတယ်။ code line အရေအတွက် များသွားပေမယ့် ပိုပြီး ရှင်းလင်းပါတယ်။

$foo = 8;

if( $foo<10 )
{
    if( $foo>5 )
    {
        echo "Greater than 5!";
    }
    else
    {
        echo "Less than 5!";
    }
}
else
{
    echo "Greater than 10!";
}
echo "<br />Another note.";

Coding Standard မလိုက်နာခြင်း

Coding Standard လို့ ဆိုလိုက်ရင် အခုမှ စလေ့လာက လူတွေက ဘာမှန်း မသိ။ နည်းနည်း ကြောင်သွားတတ်ပါတယ်။ လက်ရှိ လူသုံးများတဲ့ standard ကတော့ မူရင်း pearl ရဲ့ coding standard ပါပဲ။ Coding standard အတိုင်း မရေးတော့ code တွေက တစ်နေရာမှာ တစ်မျိုးဖြစ်နေတယ်။ နောက်ပြီး {} သုံးတဲ့အခါ သုံးတယ်။ မသုံးတဲ့အခါမသုံးဘူး။ short code တွေကို သုံးရင် သုံးမယ်။ မသုံးတဲ့ အခါမသုံးတာတွေ ဖြစ်တတ်ပါတယ်။

Duplicate Code

ဒါကတော့ ထွေထွေ ထူးထူး ပြောစရာလိုမယ် မထင်ပါဘူး။ code တွေကို ပြန်ပြန်ရေးတာပဲဖြစ်ဖြစ် ပြန်ပြန် သုံးနေရင်ပဲ ဖြစ်ဖြစ် ကောင်းမွန်တဲ့ အရာမဟုတ်ပါဘူး။ function ခွဲရေးတာ ဖြစ်ဖြစ် class ခွဲရေးဖို့ ဖြစ်ဖြစ် စဉ်းစားသင့်ပါတယ်။

Development Pattern ကို အသုံးပြုခြင်း

သာမာန် ရိုးရိုး coding ဆိုရင်တော့ Design Pattern က မလိုအပ်ပါဘူး။ Web application တစ်ခုလုံးကို ရေးမယ်ဆိုရင်တော့ Development Pattern က အရေးပါလာပါပြီ။ MVC ကို မဖြစ်မနေ ရေးရမယ်လို့ ဆိုလိုတာမဟုတ်ပါဘူး။ MVC လိုမျိုး pattern ကို အသုံးပြုမယ်ဆိုရင်တော့ web development မှာ အများကြီး လွယ်ကူသွားစေပါတယ်။ Design Pattern တွေ MVC တွေ သိဖို့ မလိုပါဘူး။ အလုပ်ဖြစ်ဖို့ လိုတယ် ဆိုပြီး php code တွေကြီးပဲ ရေးနေရင်တောင် သင်ဟာ Developer ကောင်း တစ်ယောက် မဟုတ်သေးပါဘူး။

ဆက်ပါအုံးမည်….

PHP Developer တွေအတွက် အသုံးဝင်မယ့် အချက် ၁၀ ချက် – အပိုင်း ၂

အပိုင်း ၁ ကို ဒီမှာ ဖတ်ရှုနိုင်ပါတယ်။

၆။ သင့်အတွက် အသုံးဝင်မယ့် Snippet တွေကို သိမ်းထားပါ

Coding တွေရေးတဲ့အခါမှာ ထပ်ခါထပ်ခါ ပြန်သုံးနေရတာတွေ ရှိပါတယ်။ ဥပမာ။ File read / write လိုမျိုး ၊ ဒါမှမဟုတ် mysql connect ချိတ်တာမျိုးတွေပေါ့။ အဲလိုမျိုး code တွေကို ပြန်စဉ်းစား ပြန်ရေးနေမယ့်အစား အသုံးဝင်မယ့် code အပိုင်းတွေကို သိမ်းထားသင့်ပါတယ်။ အသုံးဝင်တဲ့ App တွေကတော့ Snippet, snippely, Code Collector စတာတွေပေါ့။ Snippely က လွဲလို့ ကျန်တာတွေက Mac app တွေပါ။ Snippely တစ်ခုပဲ free ရပါတယ်။ Windows, Mac , Linux အားလုံးအတွက် jcodecollector ရှိပါတယ်။
Continue reading “PHP Developer တွေအတွက် အသုံးဝင်မယ့် အချက် ၁၀ ချက် – အပိုင်း ၂”

PHP Developer တွေအတွက် အသုံးဝင်မယ့် အချက် ၁၀ ချက်

PHP ဟာ လူသုံးများတဲ့ web development language တစ်ခုပါ။ 20 millions domain လောက်က PHP ကို အသုံးပြုထားပြီး wikipedia, facebook စတဲ့ နာမည်ကြီး site တွေအပြင် WordPress , Drupal , Joomla စတာတွေကလည်း PHP နဲ့ ရေးသားထားတာပါ။ အခု ဆောင်းပါးမှာတော့ PHP Developer တွေ ပိုအကျိုးရှိစေမယ့် အချက် ၁၀ ချက်ကို ဖော်ပြပေးသွားပါမယ်။
Continue reading “PHP Developer တွေအတွက် အသုံးဝင်မယ့် အချက် ၁၀ ချက်”

Vanilla Forum Script Installation

ကျွန်တော် ဒီတစ်ခါတော့ vanilla ဆိုတဲ့ forum script ကို install လုပ်နည်းကိုပြသသွားမှာ ဖြစ်ပါတယ်။ vanilla ကို mysteryzillion မှာ VBulletin အစားအသုံးပြုတော့မယ့် forum CMS တစ်ခုဖြစ်ပါတယ်။ vanilla ဟာ install လုပ်ရတာအရမ်းလွယ်ကူပြီးတော့ configure လုပ်ရတာလည်း ခန့်မှန်းထားသလောက်မခက်ခဲ့ပါဘူး။ သူရဲ့အားသာချက်ကတော့ VBulletin လိုအခကြေးငွေတစ်စုံတစ်ရာပေးစရာမလိုတဲ့ free (not only like beer free but also like freedom)  CMS အမျိုးအစားတစ်ခုဖြစ်တဲ့အတွက် forum စတင်စမ်းသပ်ထူထောင်လိုသူများအတွက် အထူးသင့်တော်မယ်လို့ယူဆရပါတယ်။ သို့သော် ကျွန်တော်သည် developer level user (power user ) တစ်ယောက်မဟုတ်တာကြောင့် vanilla နဲ့ပတ်သတ်၍ က မှ အ အဆုံးထိရေးသားနိုင်စွမ်းမရှိပါဘူး။ ကိုယ်တက်နိုင်သလောက် installation process ကို end user များနားလည်နိုင်အောင်ရေးသားလိုက်ရပါတယ်။
Continue reading “Vanilla Forum Script Installation”

The anatomy of a WordPress theme

wordpress theme တစ်ခု ဖန်တီး ဖို့အတွက် wordpress theme တည်ဆောက်ပုံကို သိထားဖို့ လိုအပ်ပါတယ်။ အောက်ကပုံမှာ wordpress theme တစ်ခု တည်ဆောက်ဖို့ ဘာတွေ လိုအပ်သလဲ။ နောက်ပြီး ဘယ် file တွေက ဘာတွေ အတွက်လဲ ဆိုတာကို ရှင်းလင်း ပြထားပါတယ်။ WordPress Theme တစ်ခုလုံးကို ရှင်းလင်း လွယ်ကူစွာ နားလည်သွားစေနိုင်တဲ့ ပုံဆိုလည်း မမှားပါဘူး။

JSON with javascript

Json ဆိုတာကတောာ့ avaScript Object Notation ဖြစ်ပြီး အခုနောက်ပိုင်း အသုံးများတဲ့ format ဆိုလည်း မမှားပါဘူး ။ web developer ဆိုရင်လည်း json ကို သိထားသင့်ပြီး iOS developer တွေ အနေနဲ့လည်း apple က plist နဲ့ တူတဲ့ အတွက်ကြောင့် သိထားသင့်ပါတယ်။json ကို JavaScript မှာ လွယ်လွယ်ကူကူ အသုံးပြုနိုင်ပါတယ်။ အခြား ဘာ addon မှ မလိုပဲ အသုံးပြုနိုင်သလို php မှာလည်း ပါပြီးသားပါ။ language တော်တော်များများမှာတော့ JSON ကို ထည့်သွင်းလာပါတယ်။ နောက်ပြီး web api တွေ အများစုကလည်း json ကို အသုံးပြုပါတယ်။ facebook ရဲ့ graph api ဆိုလည်း JSON ပါပဲ။

Continue reading “JSON with javascript”

Real-time web applications

အခုအချိန်မှာ real-time web applications ဆိုတာက မြန်မာနိုင်ငံနဲ့ အလှမ်းကွာသေးပေမယ့် သိသင့်ပါတယ်။ အထူးသဖြင့် google doc က အကောင်းဆုံး real-time web applications ပါပဲ။ ဒီဘက်က စာရိုက်လိုက်တာနဲ့ ဟိုဘက်မှာ ချက်ခြင်း သွားပေါ်တယ်။ Real-time web applications က chat လိုမျိုး web applications တွေမှာ တော်တော်ကို အသုံးဝင်ပါတယ်။ real time chatting ပေါ့ဗျာ။ သာမာန် သမာရိုးကျ နည်းလမ်းက ဟိုးအရင်တုန်းကတော့ iframe သုံးပြီး refresh ကို ၅ စက္ကန့် တစ်ကြိမ် လုပ်ကြတယ်။ နောက်ပိုင်း ajax ပေါ်လာတော့ iframe အစား ajax နဲ့ ၅ စက္ကန့် တစ်ခါ refresh လုပ်ရပြန်တယ်။

Continue reading “Real-time web applications”

Writing jQuery Plugin Tutorial

jQuery မှာ plugin တွေ ဘယ်လောက် အသုံးဝင်သလဲဆိုတာ သိမှာပါ။ ကျွန်တော်တို့ ကိုယ်တိုင်လည်း jquery plugin တွေ ရေးလို့ရပါတယ်။ plugin ဆိုတာကလည်း function လိုပါပဲ။ ကျွန်တော်တို့ ထပ်ခါ ထပ်ခါလုပ်နေရတာကို လွယ်ကူအောင် ဖန်တီးပေးတာပါ။ ဥပမာ။။ အောက်က code လေးကို ကြည့်လိုက်ပါ။


<html>

<head>

<title>jQuery Sample</title>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script src = "bgcolor.js"></script>

<script>

$(document).ready(function(){

changecolor($("#sample"),"red");

changecolor($("#sample2"),"#FF00FF");

});

function changecolor(id,value)

{

$(id).css("background-color",value);

}

</script>

</head>

<body>

<div id="sample">This is sample<div>

<div id="sample2">This is sample<div>

</body>

</html>

အဲဒီမှာ changecolor ဆိုတဲ့ function လေး ရေးထားပါတယ်။ အဲဒါကို ကျွန်တော်တို့ plugin ပြောင်းကြည့်ရအောင်။ function ခေါ်ရေးရင် ရပေမယ့် user friendly ဖြစ်သွားအောင် plugin ပြောင်းရေးတာပါ။ plugin ပြောင်းရေးလိုက်ရင် ကျွန်တော်တို့ အောက်ကလို ပြောင်းပြီး ခေါ်လို့ရသွားမှာပါ။

[lang name=”js”]

$(“#sample”).bgcolor();

$(“#sample2″).bgcolor({

value:”#FF00FF”

});

[/xhtml]

ပိုပြီး user friendly ဖြစ်ပြီး code ကြည့်လိုက်တာနဲ့ နားလည် လွယ်တာပေါ့။

အရင်ဆုံး bgcolor.js မှာ အောက်ကလို ရေးလိုက်ပါတယ်။


(function(jQuery){

jQuery.fn.bgcolor = function(options) {

return this.each(function() {

//write code in here

});

};

})( jQuery );

အဲဒါက jquery plugin ရေးဖို့ပေါ့။

jQuery.fn.bgcolor က bgcolor function ကို extend လုပ်လိုက်တာပေါ့။ selector တွေကနေ တဆင့် bgcolor ဆိုတဲ့ function ခေါ်လို့ရအောင်ပါ။ ကျွန်တော် code ကို အောက်ကလို ပြင်ရေးလိုက်ပါမယ်။


(function(jQuery){

jQuery.fn.bgcolor = function(options) {

var defaults = {

value:"red"

};

var options = jQuery.extend(defaults, options);

return this.each(function() {

$(this).css("background-color",options.value);

});

};

})( jQuery );

defaults က red လို့ပေးထားပါတယ်။ အဲဒါက JSON format ပါ။ JSON format ကို merge လုပ်ဖို့အတွက်

var options = jQuery.extend(defaults, options);

options ဆိုတဲ့ JSON parmater က value ပါလာရင် red ကို ဖျက်ပြီး အသစ်ပြောင်းသွားမှာပါ။

return this.each(function() {

//ဒီမှာ code ရေးရပါတယ်။

}

အဲဒီမှာက ကိုယ် ဖြစ်ချင်တဲ့ code ရေးရပါတယ်။ ကျွန်တောက်တော့ ရောက်လာတဲ့ selector ကို background color ပြောင်းထားပါတယ်။

HTML မှာ

<script src = "bgcolor.js"></script>

ထည့်ပြီးတော့ bgcolor ဆိုတဲ့ function ကို ခေါ်လိုက်ရင် background ပြောင်းသွားပါလိမ့်မယ်။ ပေါ်ချင်တဲ့ အရောင်ကိုတော့ value ကို ထည့်ပြီး ပြောင်းပေးလို့ရပါတယ်။


$("#sample").bgcolor();

$("#sample2").bgcolor({

value:"#FF00FF"

});

စမ်းကြည့်ချင်ရင်တော့ code ကို download ချပြီး စမ်းနိုင်ပါတယ်။