728x90
HTML 기반의 앱이나 하이브리드 앱을 개발하는 동안 공유 스토리지에 대한 요구사항은 상당히 많다고 알려져 있다. HTML5 가 도입되면서 로컬에서 데이터를 샌드박스 형태의 저장공간에 저장할 수 있는 방법이 생겼지만 다양한 장치에서 데이터를 공유해 사용하기에는 별도로 개발해야 하는 코드의 양이 상당히 많을 수 밖에 없었다.

구글의 오픈소스 기반 브라우저 프로젝트이자 구글 크롬의 모태이기도 한 크로미움(Chromuim) 프로젝트에서 최근 이런 니즈를 반영한 듯한 API 를 공개했다. HTML5 로 대동단결하고 있는 상황에서 특정한 플랫폼에서만 사용 가능한 API 를 이야기 한다는 것이 조금 엇박자인 듯 하지만 필요에 따라 이런 API 들이 HTML5 로 통합될 가능성도 있기 때문에 알아둬서 나쁠 것은 없어보인다.


SyncFileSystem API 는 구글 드라이브를 클라우드 기반의 스토리지로 활용하면서 사용자들이 다양한 기기에서 데이터를 동기화 할 수 있는 방법을 제공해 주는 형태이다. 주요 메서드는 4가지 정도로 정의 되어 있는데, 간단히 정리해보면 아래와 같다.

1) 동기화를 위한 파일 시스템 객체 얻기 (requestFileSystem)
2) 클라우드 스토리지 사용 현황 얻기 (getUsageAndQuota)
3) 클라우드 스토리지에 저장된 파일 상태 얻기 (getFIleStatus)
4) 클라우드 스토리지에 저장된 파일 변경 이벤트 얻기 (onFileStatusChanged)

무척 간단하고 사용하기 어렵지 않은 API 이다. 크로미움 환경 전용이라는 현재의 한계가 있긴 하지만 W3C 에 제안해 놓은 파일 API 상의 디렉토리와 파일 부분의 연장선상에 있다고 하니 HTML5 에서 채택될 수 있기를 기대해 볼 수 있을 것 같다. (자세히 살펴보기 : http://www.w3.org/TR/file-system-api/

- NoPD - 
728x90
728x90
Node.js 를 공부하고 코드를 테스트 하는 방법은 여러가지가 있습니다. Cloud9 과 같은 웹 기반의 IDE 를 이용하는 방법이 가장 간편하고 사용자 환경도 타지 않기 때문에 좋지만 웹 기반이다 보니 은근히 불편한 점들이 있는 것도 사실입니다. 이 때 우리가 선택할 수 있는 좋은 대안은 Node.js 를 PaaS 형태로 제공하는 호스팅 서비스를 이용하는 것입니다. 그중에서도 오늘은 Node.js 를 비롯하여 Ruby, Java, Python 등을 PaaS 형태로 제공하는 Heroku 를 이용하기 위한 준비를 해보겠습니다. (간만에 글 올리면서 마치 준비된냥 Heroku 를 건드립니다 ;;;)

먼저 Heroku 를 사용하기 위해서는 간단한 가입 절차를 거쳐야 합니다. 이런 류의 외국 서비스들이 그러하듯 간단한 이메일 인증만을 하면 무료로 사용할 수 있는 공간을 할당받게 됩니다. Heroku 는 기본적으로 무료 서비스이고 추가적으로 용량을 늘리거나 다른 서비스를 이용할 때 추가적으로 비용을 내면 됩니다. 참고로 Cafe24 가 제공하고 있는 Node.js 호스팅 서비스의 최소 단위는 월 500원 입니다 ;;;



 Heroku 에 가입하기 위해서 가입 페이지로 이동합니다. (바로가기 : https://api.heroku.com/signup) 간단한 이메일 입력만으로 가입은 끝납니다. 참 쉽죠잉? 이메일을 입력하고 Sign Up 버튼을 누르면 입력한 이메일로 컨펌 URL 이 발송됩니다. 이메일도 빨리 도착하기 때문에 수신함에서 메일을 찾아 본문의 컨펌 URL 을 클릭하면 됩니다.


이메일에 대한 유효성 점검이 끝났다고 모두 끝은 아니겠지요? 비밀번호 정도는 셋팅 해줘야 나중에 로그인을 할 수 있을 겁니다. 설마 정말로 이메일만 입력했다고 모든게 끝이라고 생각했다면 여러분은 바보 입니다 -_-;; (퍽퍽...) 실제로 개발을 하고 소스 버전 관리를 하고 커밋 하는 등의 행위를 위해서 커맨드 라인 도구를 제공하는데 이 때도 필요한게 바로 이 비밀번호이니 잘 기억해 두시기 바랍니다.

 
비밀번호까지 입력하고나면 간단한 Get Started 방법에 대한 가이드가 화면에 출력됩니다. 로컬에서 개발하고 Heroku 로 소스코드를 업데이트 하고 구동시키기 위해서 몇 가지 도구가 필요한데요, Git 과 SSH 도구를 잘 엮어둔 Heroku Toolbelt 라는 패키지를 제공하고 있습니다. 사용자 환경이 윈도우냐 맥이냐, 아니면 리눅스냐에 따라 패키지가 여러가지로 제공되니 각자 필요한 패키지를 다운로드 받아 설치하면 되겠습니다. Heroku Client 와 Git, SSH 등이 설치된다는 것 기억하시구요.

 
잠시동안 지루한 설치 작업이 진행되고나면 끝납니다. 그리고 아무것도 보이지 않습니다. 뭘 해야 할까요? 윈도우 기준으로 설명을 드리면 설치가 끝나고 나면 윈도우 커맨드라인 도구 (시작 > cmd) 를 실행해서 Heroku 라는 커맨드를 통해 명령행 도구를 실행하셔야 합니다. 그냥 Heroku 라고 한번 쳐보시고... " 아 그렇구나 " 하신다음 위의 스샷처럼 heroku login 명령을 내려주시기 바랍니다. heroku login 명령을 입력하면 조금전에 가입시 썼던 이메일과 비밀번호를 입력합니다.


Git 에 엑세스 하기 위해서는 SSH Key 를 만들어야 합니다. 로컬에서 접근하기 위해서도 필요하고 Heroku 가 Git 에 접근하기 위한 권한 부여를 위해서도 필요합니다. heroku login 을 처음 하게 되면 이런 과정을 한큐에 다 정리를 해줍니다. SSH Key 를 생성해서 로컬에 저장해 주고 (윈도우의 경우 기본 사용자 프로파일 경로에 /.ssh/ 폴더 밑에 생성) Heroku 에 업로드까지 깔끔하게 마무리 해줍니다. Key 가 잘 등록되었는지 확인하기 위해서는 heroku keys 라고 입력해 보면 됩니다. 키를 지우려면 heroku remove 하면 되고 키 추가를 위해서는 heroku keys:add 하시면 됩니다.

자 여기까지가 Heroku 사용을 위한 환경 셋팅입니다. Heroku Toolbelt 가 제공되기 전까지는 별도로 Git 도구를 설치하고 키 생성을 하는 등 번거로운 작업이 많았지만 이제는 참 많이 편해졌다고 다들 그러시더군요 -_-... 그럼 샘플 코드 올려서 구동해보는 건 다음시간에... 해보시지요.

- NoPD -

 
728x90
728x90
새로운 언어나 개발환경에 익숙해 지는데에는 간단한 실습만한 것이 없다. Hello World 를 출력하는 프로그램이 모든 언어의 첫번째 예제가 되는 것은 다 이유가 있다. Hello World 를 출력하는 프로그램을 통해 언어가 가지고 있는 기본적인 코드 구성 방법을 이해할 수 있고 표준 입출력을 이용하여 결과값을 출력해 볼 수 있기 때문이다. 

node.js 역시 마찬가지 방법으로 접근을 해보고자 한다. 다만 javascript 에 익숙치 않은 사람들을 위하여 점진적으로 코드를 완성해 나가는 방식을 이용해 앞으로 설명을 하고자 한다. NoPD 역시 OOP 기반의 언어들에 익숙한 상태라 처음 javascript 에 익숙해 지는데 시간이 무척 오래 걸렸다. javascript 가 궁극의 개발 언어라고 주장하는 사람들은 이런 javascript 의 코드 개발 방식을 들기도 하니 유심히 살펴볼 필요도 있을 것 같다


자바스크립트로 서버를 만든다고?

node.js 는 서버 혹은 클라이언트에서 사용될 수 있는 스크립트임을 앞선 포스팅에서 이야기 했다. 클라이언트야 그렇다 치고 서버에서는 도대체 무슨 역할을 할 수 있는 것일까? node.js 는 로직을 가지고 있는 javascript 로서의 역할도 충분히 하겠지만 그 보다는 웹 서버, 소켓 서버 등의 역할로 사용되는 경우가 더 많다. 서버에 설치된 웹 서버 (예> IIS, Apache) 의 유무와 상관없이 독립적으로 동작이 가능하다.

웹 서버라는 것이 결국은 특정한 포트 (예> 80) 를 통해 TCP 통신을 받아들일 수 있도록 해주는 역할이라고 해석한다면 소켓 서버를 특정한 포트로 만드는 것과 별반 다른 것이 아니라는 점을 이해할 수 있을 것이다. 이제 간단한 웹 서버를 만드는 코드를 통해 node.js 의 구조를 이해하고 얼마나 생산성 높은 개발 환경인지를 알아보도록 하자.

var http = require('http');

먼저 위와 같이 코드를 입력해 보자. var 는 자바스크립트에서 변수를 선언할 때 사용되는 키워드이다. http 라는 변수를 선언하고 이 변수에는 require('http') 라는 문장을 통해 node.js 의 http 모듈의 객체 인스턴스를 생성하도록 했다. node.js 은 다양한 모듈을 가지고 있는데 모듈을 사용하기 위해서는 위와 같은 코드를 이용한다. 다른 언어에서 include 나 using, import 와 같은 역할을 한다고 보면 된다.

코드의 구조를 잡아보기

객체 인스턴스를 생성했으면 이제 이 인스턴스가 제공하는 다양한 메소드를 이용하기만 하면 된다. node.js 의 서버 모듈이 제공하는 다양한 메서드와 이벤트는 공식 웹사이트의 도움말을 참고하면 좋다 (바로가기 :  http://nodejs.org/api/http.html) 우리는 일단 간단한 웹 서버를 만들어 볼 예정이니 문서가 제공하는 방대한 내용을 다 이해할 필요는 없다. 이제 코드에 살을 좀 붙여보자.

var http = require('http');

http.createServer(function (request, response) {

});

생성한 http 인스턴스가 제공하는 createServer 메소드를 호출하는 코드이다. createServer 메소드는 파라메터로 requestListener 를 받는다고 공식 문서에 정의되어 있다. requestListener 는 특별한 것은 아니고 공식 문서에도 기술되어 있는 것처럼 request 이벤트의 이벤트 핸들러 형태를 따르는 함수면 된다. 그런데 이 서버는 어떤 포트를 통해 요청을 받을 것인지가 명시 되어 있지 않다. http 객체가 제공하는 listen 메소드를 이용해 1234번 포트로 요청을 받는 서버를 만들어 보도록 하자.

var http = require('http');

http.createServer(function (request, response) { 

}).listen(1234);

참 간단하다. 이제 이 코드에 우리가 추가해야 할 것은 요청(request) 가 들어 왔을 때 무엇을 회신(response) 할 것이냐이다. 웹 서버라는 것이 별 것은 아니고 사용자의 요청이 들어왔을 때 적절한 회신을 해주는 것임을 생각해 보면 이해하기는 어렵지 않다. 회신할 내용을 만드는 코드를 넣고 서버가 동작중임을 알리는 콘솔 메세지를 추가해보자.

var http = require('http');

http.createServer(function (request, response) {
  response.writeHead(200, {'Content-Type': 'text/plain'});
  response.end('Hello World~!\n');
}).listen(1234);

console.log('Server running at http://127.0.0.1:1234/');
결과 확인해 보기! 

어렵지 않게 웹 서버를 무사히 만들어 냈다. 물론 진짜 웹 서버에 비하자면 동적인 웹 페이지의 생성, 적절한 결과의 응답등이 빠져 있지만 이런 부분들은 앞으로 여러 포스팅을 통해 다양한 모듈을 활용하여 풀어나갈 수 있는 부분이니 여기선 구조를 이해하는 선이면 충분할 것 같다. 이제 node.js 에서 만든 코드를 실행해 보도록 하자.  

 
서버가 동작중임을 알려주는 메세지가 화면에 출력되어 있다. 기본적으로 createServer 는 별도로 종료하지 않는한 계속 구동되고 있게 된다. 서버를 종료하는 별도 로직을 추가하거나 (특정한 요청에 응답?) Ctrl-C 등을 눌러 프로세스를 종료 시키면 서버는 종료되게 된다. 물론 서버가 종료되면 안되는게... 기본 동작 요구사항일 것이므로 그냥 그렇다고만 알고 있자. 이제 웹 브라우저를 이용하여 웹 서버에 접근을 해보도록 하자.


놀랍지 않은가? 단 몇줄의 코드로 웹 서버를 구동시켜 보았다. 앞서 이야기 한 것처럼 보완할 부분이 많은 말 그대로 껍데기 밖에 없는 웹 서버이지만 node.js 의 원리를 이해하고 강력한 기능을 맛보기에는 충분한 예제였다. 앞으로 node.js 를 이용하여 재미있는 것들을 많이 만들어 나가도록 하자.


- NoPD -

 
728x90
728x90
node.js 는 구글의 크롬(Chrome) 브라우저가 채택하고 있는 자바스크립트 엔진인 V8 을 기반으로 하고 있다. node.js 개발 환경을 설치한다는 것은 V8 엔진을 설치하고 V8 을 통해 자바스크립트를 브라우저를 통하지 않고도 실행할 수 있다는 것을 의미한다. 현재 제공되고 있는 설치 패키지는 윈도우(Windows) 플랫폼과 맥(Mac) 플랫폼이다. 하지만 github를 통해 소스코드를 제공하고 있고 다양한 리눅스 배포판별로 설치 방법을 가이드 하고 있으니 사실상 제한이 없다고 봐도 되겠다

 
node.js 설치파일을 받기 위해서는 공식 웹사이트인 http://nodejs.org 를 방문하여 가운데 있는 Download 링크를 누르면 된다. NoPD 는 윈도우 플랫폼을 사용하고 있기 때문에 윈도우용 MSI 설치 패키지를 받아서 설치했다. 개발 환경이라고는 하지만 커맨드 라인 기반의 인터페이스를 제공하고 있기 때문에 용량이 그리 크지 않다.
 

윈도우 환경에서 기본 설정으로 node.js 를 설치하고 나면 Program Files 폴더 아래에 nodejs 경로에 node.js 의 관련 파일들이 설치된다. 이미 이야기한 것처럼 node.js 의 구조는 무척 간단하다. 엔진 및 커맨드라인 인터페이스인 node.exe 파일이 있고 node.js 가 제공하는 모듈들은 자바스크립트로 작성되어 node_modules 폴더 아래에 깨알같이 분산되어 있다.

node.js 가 설치된 폴더의 구석구석을 살펴보면 자바스크립트로 만들어진 깨알같은 소스코드들이 많이 들어 있어서 참고하기에 무척 좋다. node.js 를 꼭 사용하지 않더라도 브라우저 기반으로 자바스크립트를 구동시킬 때 참고할만한 소스코드들이 무척 많으니 천군만마를 얻은 것 같은 기분이다. 이러한 구조를 참고하여 나중에 개인적인 모듈을 만들때 많은 도움을 받을 수 있으니 시간이 되면 살펴보는 것도 좋을 것 같다.

 
node.js 가 제공하는 다양한 기능들을 제대로 활용하기 위해서는 기술문서를 꼼꼼히 읽어보는 것이 좋다. node.js 의 공식 웹사이트가 제공하고 있는 Document 를 참고하면 node.js 의 어떤 요소들을 활용하여 무엇을 개발할 수 있을지 생각하는데 큰 도움이 된다. node.js 로 개발을 진행하는 동안 가장 도움을 많이 받을 기술 레퍼런스이니 항상 다른 창으로 띄워 놓도록 하자.

이번 포스팅을 그냥 이렇게 마무리 할까 하다가... 소스코드 한줄 정도는 만들어 봐야 하지 않을까 싶어서 모든 개발 환경의 기본 테스트이자 가장 많은 의미를 갖는 샘플, "Hello World" 를 출력하는 방법을 살펴보고 글을 마무리 할까 한다. 일단 첫번째 방법으로 무작정 설치 경로에 위치한 node.exe 를 실행해 보자. ">" 프롬프트가 뜨면서 뭔가를 입력하라는 화면이 휑~ 하니 출력된다. 변수 하나에 문자열을 집어넣고 console.log 메소드를 이용하여 콘솔 화면에 출력하는 간단한 소스를 입력해 보자.

 
첫번째 방법은 코드를 간단히 테스트 해볼때 사용하기 좋은 방법이다. 이 화면을 보고 혹시 크롬 브라우저의 개발자 기능중 콘솔 기능이 떠올랐다면 정확히 본 것이다. node.js 가 하는 일이라는 것이 결국 자바스크립트 엔진으로 자바스크립트 소스를 보내고 수행한뒤 결과를 리턴하는 것이라는 이해를 하면 그것으로 충분하다.

하지만 첫번째 방법은 실무에서 쓰기에는 별로 좋은 방법은 아니다. 간단한 디버깅이나 소스코드의 동작을 확인하는 용도 정도일 뿐이다. 우리가 원하는 방식은 별도로 소스코드를 만들어 이를 실행하는 방식일 것이다. 귀차니즘으로 에디터 쓰는 것도 번거로우니 커맨드 라인에서 간단히 소스코드를 만들고 실행을 해보도록 하자. 

 
자바스크립트 기반이기 때문에 확장자는 .js 를 일반적으로 붙여주지만 사람에 따라서는 .node 를 붙여 주기도 한다. 두가지 확장자를 쓰는 경우에 한하여 node.js 는 알아서 해당 파일을 찾아 실행을 해주니 별도의 확장자를 쓰기 보다는 .js, .node 를 이용하는 것이 좋다. 오늘 포스팅에서는 node.js 개발 환경을 설치하고 간단한 소스코드를 실행해 봤다. 다음 포스팅에서는 몇가지 쉬운 코드를 이용하여 node.js 가 기본적으로 제공하는 모듈을 사용해 보도록 하자.


- NoPD - 
728x90

+ Recent posts