events.js:72

        throw er; // Unhandled 'error' event


기존에 잘 되던 소스들이 갑자기 안되거나 위의 에러가 나면서 파일 업로드가 안된다면 express 버전 문제일 가능성이 있습니다.

4.5.x 버전으로 올라오면서 핸들링쪽이 많이 바뀌어서 기존의 소스들이 전혀 먹지를 않습니다. (네..이걸로 몇시간 삽질을..)


결국 3.x대로 내리니 정상적으로 돌아가네요...ㅜㅡㅜ 


WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글이 없습니다.
secret

(먼저 node.js 와 ruby 가 설치 되었다고 가정합니다.)
1. yeoman 설치 

$(sudo) npm install -g yeoman
$(sudo) npm install -g generator-webapp


2.webapp 생성
$mkdir (폴더) 
$yo webapp
$grunt
$grunt server

자세한건 동영상을 보시면 됩니다~



WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글이 없습니다.
secret

이클립스에서 install 에 들어가서 http://www.nodeclipse.org/updates/ 

로 검색하여 필요한것만 설치(아래의 이미지 참조)



매일 node 개발할땐 터미널만 썼었는데 이클립스에 플러그인이 있었다니;;

but npm 설치가 자유롭지가 않다. 해당 프로젝트를 커맨드로 들어가서 따로 설치하자.

그리고 당연하게도 코드 어시스트 또한 지원이 안된다.


WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글이 없습니다.
secret

정말 한번쯤은 쓸수 밖에 없는 모듈! 한글 인코딩 모듈인 urlencode 입니다.


1. 먼저 설치! npm install urlencode



2. 사용법은 간단합니다. urlencode() 자체가  utf-8 이 디폴트이기 때문에 따로 설정도 필요없이 바로 넣어주면 됩니다. 


var urlencode = require('urlencode');

console.log(urlencode('변환'));
console.log(urlencode.decode('%EB%B3%80%ED%99%98'));



쉽죠?!


WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글이 없습니다.
secret

node.js 에서 사용하는 모듈을 사용할수 있다고하지만 않되는게 너무 많다.(제약사항이 너무 많다.)

일단 기본 내장 모듈인  child-process 부터 에러. (fock 에 버그가 있다고 한다. - node-webkit 개발자가 시간이 없어서 못고친다고 선언;;;;)


패키징 했을때 mac의 경우엔 일반 디렉토리와 패키징의 권한과 디렉토리 경로가 완전히 달라지는데(mac 의 특성이란다. 처음알았다.)  이에 따른 절대경로 문제도 에러가 있다. (이 부분이 신기한데 mac 의 경우 응용프로그램이 작동하면 하드상의 어떤 부분을 참조하게 되는데 이 부분이 컴퓨터 마다 다르게 권한,명시 되며 프로그램으로 알수가 없다. - 보안상 , 한마디로 절대/상대 경로로 애플에서 제공하지 않는 함수로는 실행 불가. 하지만 node.js 나  node-webkit 의 패키징 상태가 아닐 경우엔 일반적인 경로 이므로 실행가능. )


phantomjs 로 신나게 개발 다하고 잘 돌아갔으나 패키징 하니 안됨;; (쿠..쿨럭!)


node.js 에서 기본적으로 제공하는 모듈들도 nw 모듈로 돌려서 해야 하는데 안되는게 너무 많다.


다시 한번 말하자면  node-webkit 이 정식으로 서비스 되는것도 아니기 때문에 정말 어플리케이션을 node-webkit으로 개발할려고 한다면 많은것을 고려해봐야 할것 같다.(특히 mac 의 경우!!)


- 다 만들어 놓고서 배포에 문제가 있어서 버린건 첨이네. 


WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글  2개가 달렸습니다.
  1. 블로그 잘 봤습니다.

    제가 https://www.youtube.com/watch?v=JWAyzK9BgA0 이 동영상을 보고 따라해봤는데

    저는 자꾸 에러가 나네요..ㅠㅠ 에러 코드는 4이고 메시지는 뭔지도 모르게 글씨가

    깨져나오네요. 혹시 webkit에서는 child_process가 아주 못쓰는 건가요? 아님 fork만

    버그가 있는건가요?
    • 동영상을 봤지만 chlid_process 를 쓰는 부분은 없던데요?
      다른 동영상을 올려주신거 같습니다.
      webkit의 에러코드는 상당히! 난해 하기에(정말 불친절합니다.)
      오타가 없는지 혹은 쓰시는 모듈이 잘못되지는 않았는지
      컴파일러보다 자신을 믿는편이 더 좋습니다;;

      마지막으로 제가 해본 바로는 child_process 를 쓸수는 있지만 mac/linux에서 패키징을 할경우(app.js로 하나로 묶을경우) 해당하는 경로가 심볼링크로 되지 않는이상 mac 에선 경로 선택이 어렵기 때문에 위와 같은 글을 썼었습니다. 하지만 윈도우에선 잘됩니다.
secret



만일 osx 에서 node-webkit 압축시(*.nw) 만들하여 만든 파일이  package.json 파일이 있는데도 불구하고 위와 같이 화면만 나온다면 맥에서 지원하는 zip 파일로 만든후 확장자만 .nw 로 지정하면 위와 같이 에러가 납니다.

(맥에서 지원하는 아카이브 프로그램으로 zip 파일 압축시 일어납니다.)


커맨드 창에서 만든 폴더 자체를 압축시켜 주시고($zip -r app.nw * ) 바로 *.nw 파일을 만듬. 


- 이부분이 안되서 하루 날렸네요. 분명히 버그는 개발자가 픽스 했다고 작년 날짜로 되어 있는데.. 왜 안되는지 한참을 해맸네요.


- 오픈소스의 경우 무엇이든 개발자가 말한 팩트를 따라줘야 합니다. 편하다고 자기 멋대로 하면 저 처럼 하루 날려요.


WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글이 없습니다.
secret
// Load native UI library
var gui = require('nw.gui');

// We can not create a clipboard, we have to receive the system clipboard
var clipboard = gui.Clipboard.get();

// Read from clipboard
var text = clipboard.get('text');
console.log(text);

// Or write something
clipboard.set('I love node-webkit :)', 'text');

// And clear it!
clipboard.clear();

https://github.com/rogerwang/node-webkit/wiki/Clipboard


참고로 node-webkit 에선 jquery, javascript , flash 에서 사용하는 clipboard 소스는 모두 적용이 되지 않는다.

물론 IE 에서 사용하는건 당연히 않된다.

버그인지 모르겠지만 node.js 의 모듈로 제공되는 클립보드도 적용이 안된다.(zeroclipboard , copy-paste , clipboard 모두 안됨) 


오직 되는것은 위의 nw 에서 지원한는 코드뿐인거 같다.(이걸로 대략 6시간 소비.....)


WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글이 없습니다.
secret

먼저 node0webkit 은 node.js 로 윈도우기반의 프로그램을 만들수 있게 도와주는 프로그램입니다. 단순히 실행되는 node가 아닌 윈도우상태로 돌아가며 가장 중요한! os에 구해받지 않으며 모든 플랫폼에서 돌아가는 실행파일을 만들수 있는!! 아주 성스러운 프로그램입니다!! node-webkit 에는 크로미움과 node 내장되어 있어서 자체적으로도 돌아가면서 실행파일도 os 별로 구현이 가능합니다. (충격과 공포급이죠.)


해당 예제는 https://github.com/rogerwang/node-webkit 에 있는 퀵스타트 부분의 예제입니다. 


1. 먼저 해당 프로그램을 다운 받아야 합니다.(저는 mac os 에서 진행하였습니다.) 다른 플랫폼의 경우 다운만 받아서 설치하면 되지만 mac os 의 경우 약간의 설정을 해줘야 합니다. 

https://github.com/rogerwang/node-webkit#downloads


2. 다운받은 파일을 압축 푼후 응용 프로그램에 넣어줍니다.



3. 이제 응용프로그램에 설치가 완료되었습니다. 실행시켜보면 다음과 같은 화면이 나옵니다. 사파리와 상당히 유사해 보이지만 크로미움입니다. 



4. 커멘드 창에서도 실행 가능 하도록 설정해줘야 합니다. 커맨드 창을 열고 다음을 타이핑 합니다.

open -a TextEdit ~/.bash_profile


그다음 아래의 문장을 넣어주고 저장합니다.

# alias to nw
alias nw="/Applications/node-webkit.app/Contents/MacOS/node-webkit"

5. 이제 터미널 어떤 곳에서 nw 를 실행하면 3번에서 보았던 화면이 나옵니다. 


6. 간단한 예제를 만들어보겠습니다. app 이름의 폴더를 하나 생성합니다. 해당 폴더에 index.html , package.json 파일을 만들어 줍니다. 


7. index.html 파일 내용

<!DOCTYPE html>

<html>

  <head>

    <title>Hello World!</title>

  </head>

  <body>

    <h1>Hello World!</h1>

    We are using node.js <script>document.write(process.version)</script>.

  </body>

</html>


8. package.json 파일 내용

{

  "main": "index.html",

  "name": "nw-demo",

  "private" : true,

  "description": "demo app of node-webkit",

  "version": "0.1.0",

  "keywords": [ "demo", "node-webkit" ],

  "window": {

    "title": "node-webkit demo",

    "toolbar": true,

    "width": 800,

    "height": 500,

    "position": "mouse",

    "min_width": 400,

    "min_height": 200,

    "max_width": 800,

    "max_height": 600

  },

  "webkit": {

    "plugin": true

  }

}


9. 이제 커맨드 프로그램을 실행한후 6번에서 만들었던 app 폴더가 있는곳으로 이동합니다. 

    nw app 로 실행하면 다음의 화면이 나올껍니다. 



끝! node.js 로 윈도우어플리케이션을 만드는게 상당히 매력적입니다. 

앞으로 node-webkit 으로 몇가지 예제를 올려드리겠습니다.




WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글이 없습니다.
secret

무슨 이유인지 모르겠지만 node-webkit 에서 jquery 를 사용하기 위해서 cdn 으로 하면 $을 찾을수 없다고 에러가 나온다.

하지만 파일을 다운받아서 절대주소로 적어주면 작동;; 


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

이걸 사용하면 안되고 다운 받은후 

<script type="text/javascript" src="js/jquery.js"></script>

이렇게 걸어주면 작동.


- 크로미움에 문제가 있는건가??



WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글 하나 달렸습니다.
  1. 지나가는사람 2016.02.19 09:52 신고
    앞에 http붙이면 됩니다.
secret
var fs = require('fs');
  
var file1_path = './test1.txt';
var file2_path = './test2.txt';
var file3_path = './test3.txt';

fs.readFile(file1_path, function(err, content_file1) {
	fs.readFile(file2_path, function(err, content_file2) {
	    fs.writeFile(file3_path, content_file1 + content_file2, function(err) {
		if (err) throw err;
		console.log('end.');
	    });
	});
});
해당 소스는 파일1과 파일2의 데이터를 파일3에 쓰는 예제 입니다. 비동기형식의 node 에서는 이렇듯 코드 중첩이 계속 일어납니다. 만일 여기에 if 문이 하나라도 들어가면 코드는 두배로 늘어나며 코드 일긱도 불편해 집니다. 

var fs = require('fs');
  
var file1_path = './test1.txt';
var file2_path = './test2.txt';
var file3_path = './test3.txt';

fs.readFile(file1_path, 'utf8', function(err, content_file1) {
fs.appendFile(file3_path, content_file1 , function(err) {
if (err) throw err;
console.log('file1 end.');
});
});

fs.readFile(file2_path, 'utf8', function(err, content_file2) {
    fs.appendFile(file3_path, content_file2, function(err) {
if (err) throw err;
console.log('file2 end.');
    });
});

해당 소스는 파일1과 파일2의 데이터를 파일3에 쓰는 예제 입니다. 비동기형식의 node 에서는 이렇듯 코드 중첩이 계속 일어납니다. 만일 여기에 if 문이 하나라도 들어가면 코드는 두배로 늘어나며 코드 일긱도 불편해 집니다. 

var fs = require('fs');
  
var file1_path = './test1.txt';
var file2_path = './test2.txt';
var file3_path = './test3.txt';

fs.readFile(file1_path, 'utf8', function(err, content_file1) {
	fs.appendFile(file3_path, content_file1 , function(err) {
		if (err) throw err;
		console.log('file1 end.');
	});
});

fs.readFile(file2_path, 'utf8', function(err, content_file2) {
    fs.appendFile(file3_path, content_file2, function(err) {
	if (err) throw err;
	console.log('file2 end.');
    });
});
만일 두개의 파일에서 각각의 로직을 하고 파일3에 써놓는 동기코드는 다음과 같을 겁니다. 읽기도 쉽고 직관적이지만 node 에선 위의 소스를 확신할수 없습니다. 만일 첫번째 로직이 시간이 엄청나게 걸린다면 두번째 로직이 먼저 발동되고 끝나버릴수도 있기 떄문입니다. 

이렇듯 비동기 로직은 우리가 생각한것과는 다르게 동작합니다.(너무 동기적 프로세스에 익숙해져 있기 때문이겠지요.)
비동기를 동기적으로 바꿔주는 모듈이 바로 async 모듈입니다. 


1. 먼저 설치 입니다. 0.9.0 버전이 설치되었습니다. 
npm install async

2. async 의 waterfall 예제 입니다. (일반적인 동기 스타일입니다.) 아래의 소스를 실행해 보면 waterfall() 안의 소스들이 차례로 실행되며 함수마다 콜백을 통하여 함수의 값을 다음 함수로 전달 할수 있습니다.
(만일 비동기로 처리한다면 중첩이 엄청나겠지요?)
var async = require('async');

async.waterfall([
    function(callback){
	console.log("1");
        callback(null, 'one', 'two');
    },
    function(arg1, arg2, callback){
	console.log(arg1 + "  " + arg2);      	
	console.log("2");
        callback(null, 'three');
    },
    function(arg1, callback){
	console.log(arg1);
        console.log("3");
        callback(null, 'done');
    }
], function (err, result) {
   console.log(result);
   console.log("end"); 
});
3. 다음은 async의 parallel 입니다. parallel 는 당연히 동시에 일어납니다. 하지만 parallel() 안이 모두 끝날때 까지 다음으로 넘어가지 않습니다. 
var async = require('async');

async.parallel([
    function(callback){
        setTimeout(function(){
            callback(null, 'one');
        }, 200);
    },
    function(callback){
        setTimeout(function(){
            callback(null, 'two');
        }, 100);
    }
],

function(err, results){
    console.log(results);
});


async 에서 많이 사용하는 waterfull 과 parallel 을 살펴 봤습니다. 이 두개만 잘 사용해도 비동기로직을 동기로 변환하여 보다 쉽게 로직 표현을 할수 있습니다. 


마지막으로 맨 처음의 예제였던 파일을 읽은 다음 쓰는 예제를 async 로 변환한 소스 입니다. 

var fs = require('fs');
var async = require('async');
  
var file1_path = './test1.txt';
var file2_path = './test2.txt';
var file3_path = './test3.txt';

async.waterfall([
    function(callback){
	fs.readFile(file1_path, 'utf8', function(err, content_file1) {
			fs.appendFile(file3_path, content_file1 , function(err) {
				if (err) throw err;
				console.log('file1 end.');
			});
		});
        callback(null);
    },
    function(callback){
	fs.readFile(file2_path, 'utf8', function(err, content_file2) {
		    fs.appendFile(file3_path, content_file2, function(err) {
			if (err) throw err;
			console.log('file2 end.');
		    });
		});
        callback(null);
    }
], function (err, result) {
  
   console.log("end"); 
});



WRITTEN BY
No.190
세계정복의 시작점

받은 트랙백이 없고 , 댓글이 없습니다.
secret