app.js 자작 예제 프로그램 공개!

<

p style=”text-align: center; clear: none; float: none;”>

다운로드 링크 클릭 후 소스를 볼 수 있으며, HTML 로 만들어져 있다. 내가 만들었지만 app.js 는 놀랍다.

MIT 라이센스이므로 당신이 원하는 앱으로도 공부하기에 충분할 것이다.

composite / 2012년 9월 26일 / 미분류 / 0 Comments

appjs Dev kit

app.js 개발을 위한 키트.

내용물은 node.js 포함하여 app.js 등이 있으며 크기는 약 16MB.

첨부파일 제한 때문에 어쩔 수 없이 분할압축하여 올림.

이 배포본은 appjs 공식 사이트의 배포본을 기초로 하여 제작됨.

따라서 readme.txt 파일을 참조하여 유의사항을 짚어본 후 개발 및 배포할 것.

예제 또한 app.js 에서 만든 예제를 올려두었음.

그럼 app.js 의 재미를 느껴보기 바란다.

조만간 mac 및 linux 용 개발 키트도 만들어 올릴 예정이다.

cfile7.uf.1777D039505C203A0101C8.rar

<

p style=”text-align: left;”>cfile10.uf.184AE639505C203C330869.rar

한번에 받기 (github)

composite / 2012년 9월 21일 / 미분류 / 0 Comments

Node.js 로 데스크탑 앱을 만드는 app.js

node.js 에서 드디어 UI도 정복하는 건가? 커뮤니티에서 이미 데스크탑 UI까지 이식하려 한다.

UI 프레임워크는 다른 것도 봤듯이 API가 드럽게 방대해서 일반적인 데스크탭 앱 프레임워크를 만들기엔 당연히 무리.

하지만 그런 UI 구조에 구세주를 내려주셨으니 그것은 바로 Chrome Embedded Framework

바로 프로그램 안에 HTML5를 이식할 수 있는 프레임워크이다. 거기다가 크로스 플랫폼이다.

app.js 는 바로 이 크롬 임베디드로 UI 프레임워크의 방대함을 간단하게 극복했다.

만약 Qt나 WxWidget 를 자바스크립트로 이식한다 해도 그 API를 알아야 하지만, HTML은 그럴 필요가 없기 때문이다.

Morteza Milani 와 Brandon Benvie 2명이서 만든 이 node.js 프레임워크는 단 몇분만에 UI를 입힌 데스크탑 앱을 만들 수 있도록 도와준다.

준비물 : node.js 32비트 (64비트의 경우 크롬 엔진이 지원하지 않아 안된다 한다. 현재 수정 중).

NPM:

npm install appjs

NPM 설치 시 윈도우의 경우 Visual Studio 2010 컴파일러가 없는 경우 네이티브 코드 컴파일이 안될 것이다. 다행히도 각각의 바이너리를 제공하니 다운받으면 된다.

AppJS 0.0.19 Distributables:

      <ul><li><a href="http://dists.appjs.org/0.0.19/appjs-0.0.19-win32-ia32.zip">Windows</a></li><li>Linux <a href="http://dists.appjs.org/0.0.19/appjs-0.0.19-linux-ia32.tar.gz">32 bit</a> / <a href="http://dists.appjs.org/0.0.19/appjs-0.0.19-linux-x64.tar.gz">64 bit</a></li><li><a href="http://dists.appjs.org/0.0.19/appjs-0.0.19-darwin-ia32.zip">Mac OS X</a></li></ul><p>그런 다음 <span style="font-family: Courier New;">node --harmony node_modules/appjs/examples/hello_world/app.js</span> 실행을 해 보시라.

화면이 대충 이런 식으로 나올 것이다.

아래는 본인이 직접 앱을 시연하는 동영상이다.

크롬 개발자 도구도 지원하기 때문에 UI 디버깅도 척척 해낼 수 있다.

그럼 이거를 어디다 쓰면 좋을까? 좋은 질문이다.

활용 범위는 다양하다. 일단 HTML5 이므로 여러분이 원하는 최대한의 표현을 할 수 있다. 차트던 그래픽이던 모두.

서버 모니터링할때 이쁘게 꾸밀 수 있지 않겠는가?

아니면 아예 클라이언트 데스크탑 앱으로 해도 손색이 없다. 커뮤니티 전용 앱이라던가, 웹 게임 등. 다양한 활용 범위가 있을 것이다.

또한 안정화가 되면 비즈니스에서 보안을 요구하는 사내 프로그램에 대한 생산성 향상을 꾀할 수 있다.

또한 HTML5/CSS/Javascript 정도 알면 당신은 이미 100% 데스크탑 앱을 만들 수 있다.

또한 node.js 자스 코드를 그대로 웹상에서 활용 가능하다. 말 다했다.

아직 취약점이 있고 개선해야 할 부분은 천지다. 하지만 이 가능성은 이미 충분하고도 남는다.

이제 자바스크립트로도 데스크탑 앱을 만들 수 있다. 준비 되었으면, 참여하고 경험하라!

composite / 2012년 9월 19일 / 1127 / 1 Comment

골때리는 자바스크립트 외전 2탄 – 지연된 객체(Deferred Object)

오랜만에 골때리게 한번 팁을 날려보겠습니다.

jQuery 1.5 에서 획기적이지만 잘 안쓰는 게 있죠.

바로 지연된 객체(Deferred Object) 입니다.

이 객체의 위력을 정말 느껴본사람 빼고는 잘 안쓰죠.

이놈의 패턴이 어떻냐..

$.get(‘/serv/get.php’,null,function(){

     alert(‘뭘 받아온듯.’);

});

이 기존 패턴과

$.get(‘/serv/get.php’)

    .success(function(){

         alert(‘뭘 받아온듯.’);

    });

이 제이쿼리에서 제안한 패턴과 똑같은 효과를 줍니다.

뭐.. 느낌상 패턴은 당연히 틀리죠.

분명 Ajax는 비동기 스크립트입니다. 하지만 동기한 것 처럼 뭔가 착각을 불러일으키기도 하고.

바로 비동기 스크립트를 이렇게 눈에 보기 좋게 꾸며 놓는다는 장점이 있습니다.

node.js 개발하다보면 이벤트 중점적이다 보니 종종 비동기 쓸때 이런 패턴이 발생합니다.

var mongodb = require(‘mongodb’),

Db = mongodb.Db;

var db = new Db(‘test_db’, new Server(process.env[“MONGODB_HOST”], process.env[“MONGODB_PORT”], {}));

db.open(function(err, db) {

db.collection(“test_collection”, function(err, collection) {

collection.find({“cmd”:cmd}, {“sort”:”order”}, function(err, cursor) {

cursor.each(function(err, item) {

if (item != null) {

// Do something

}

if (item != null) {} // 반복문 끝

});

db.close();

});

});

});

오우 쉣. 함수안에 함수안에.. 너무 지저분합니다.

하지만 제이쿼리가 제안한 지연된 객체 패턴으로 간다면 저걸?

db.open()

.collection(‘test_collection’)

.find({“cmd”:cmd}, {“sort”:”order”})

.fetch(function(err,cursor){

cursor.each(function(err, item) {

if (item != null) {

// Do something

}

if (item != null) {} // 반복문 끝

});

})

.close();

이런 식으로 비동기 스크립팅에 제이쿼리의 최강무기 메서드 체이닝을 구사할 수 있다는 겁니다.

물론 저런 패턴 제공하는 놈은 아직까지 없으니 그대로 따라하지 마시길. 그냥 예를 든거니까요.

그럼 어떤 원리로 하는건지 오늘 골때리게 설명해 드리도록 하겠습니다.

일단 먼저, 동적 클래스의 개념과 클로저 개념을 이해하고 있어야 합니다.

저는 그 이해를 하고 있는 분으로 간주하고 팁을 씁니다. 모르면 문학이님이 떡하니 강좌 올려놨으니 보시길.

..라고 무섭게 얘기했는데. 어렵지 않습니다. 먼저 동적 클래스를 만들 함수를 하나 짜주세요.

fuynction MyDefferd(){

this.fn={};

//초기화 할거 있음 하덩가.

}

그리고 지연된 객체에서 체이닝에 사용할 프로토타입 함수 하나 만들겠습니다.

MyDefferd.prototype.done=function(func){

this.fn.done=func;

};

뭐.. 준비 끝입니다.

그리고 이제 지연된 객체를 리턴할 함수를 하나 만들겠습니다.

그리고 이 함수는 비동기 작업을 할 겁니다. 간단하게 setTimeout 을 쓰겠습니다.

function Deffer(delay){

var deff=new MyDefferd();//아까 만든 지연객체를 동적으로 하나 불러와 주시고.

alert(‘작업 시작!’);

setTimeout(function(){

if(typeof(deff.fn.done)==’function’)

deff.fn.done();//done 함수를 끌어다 씁니다.

},delay*1000);//몇초 후에? 님이 쓴 초 후에.

return deff;//반드시 동적 지연 객체를 반환해줘야 합니다!

}

이것으로 지연객체 패턴을 사용할 수 있는 함수를 쓸 준비가 끝났습니다. 참 쉽죠?

어떻게 쓰냐? 간단합니다. 예를 들어 3초 후에 작업 끝 메시지가 나오도록 꾸며보겠습니다.

Deffer(3).done(function(){

alert(‘작업 끝!’);

});

그럼 처음에 작업 시작이란 경고창이 뜬 다음, 3초 후에 작업 끝이란 경고창이 뜰겁니다.

그렇게 나오면 성공!

어때요. 참 쉽죠?

동적 클래스는 함수 종료 후 클로저 때문에 메모리 다시 반납해 하는걸 개나 줘버라는는 성질 덕분에 deff 함수에서 언제든지 저렇게 동적 클래스 안에 있는 데이터를 잃지 않고 갖다 쓸 수 있습니다.

이걸 이용해서 지연된 객체를 통해 비동기 스크립트 패턴을 동기 스크립트 패턴같이 꾸밀 수가 있는 것이죠.

이런 지연 객체를 응용해서 Ajax는 물론, node.js 에서 할 수 있는 대부분의 비동기 작업에서 여러분의 눈을 정화시키는 패턴을 만들 수 있을 것입니다.

그리고 쿨하게 오늘의 골때리는 팁을 마치겠습니다.

링크 #1은 지연된 객체 패턴을 이용한 동적 스크립트 불러오는 함수입니다.

링크 #2는 이 강좌 예제입니다. 바로 실행되고 또 하고싶음 run 버튼 누르셈.

라이센스 : 해당 강좌에 사용한 기술은 죽써도 밥써도 상관없는 Public Domain. 강좌 자체는 크리에이티브 커먼즈 라이선스

composite / 2012년 9월 10일 / 미분류 / 0 Comments

jQuery MsgBox 0.2.6 Beta

아직 베타.

https://github.com/composite/jQuery.MsgBox

http://jsfiddle.net/preFy/

리뷰 곧 작성 예정

composite / 2012년 9월 10일 / 미분류 / 0 Comments

프로시져나 뷰, 펑션등을 수정할때마다 쏘스를 저장하는 방법

http://www.sqler.com/491522

툴은 아니고 프로시져나 뷰, 펑션등을 수정할때마다 쏘스를 저장하는 방법이 있습니다.

DDL 트리거를 이용합니다.

CREATE TABLE dbo.SPLOG(

일련번호 int IDENTITY(1,1) NOT NULL,

오브젝트명 varchar(100) NULL,

구분 varchar(20) NULL,

SQLCMD varchar(max) NULL,

수정자 varchar(20) NULL,

수정일 datetime NULL,

 CONSTRAINT XPKSPLOG PRIMARY KEY NONCLUSTERED 

(

일련번호 ASC

))

GO

CREATE TRIGGER TRG_SPLOG ON DATABASE

FOR

CREATE_PROCEDURE, ALTER_PROCEDURE, DROP_PROCEDURE,

CREATE_VIEW, ALTER_VIEW, DROP_VIEW,

CREATE_FUNCTION, ALTER_FUNCTION, DROP_FUNCTION,

CREATE_TRIGGER, ALTER_TRIGGER, DROP_TRIGGER

AS

DECLARE @DATA XML

SET @DATA = EVENTDATA()

INSERT INTO DBO.SPLOG (오브젝트명, 구분, SQLCMD, 수정자, 수정일)

VALUES

(@DATA.value(‘(/EVENT_INSTANCE/ObjectName)[1]’, ‘VARCHAR(100)’),

 @DATA.value(‘(/EVENT_INSTANCE/EventType)[1]’, ‘VARCHAR(100)’),

 @DATA.value(‘(/EVENT_INSTANCE/TSQLCommand/CommandText)[1]’, ‘VARCHAR(MAX)’),

 HOST_NAME(),

 GETDATE())

composite / 2012년 4월 27일 / 미분류 / 1 Comment

크로스 브라우저 blink

(function(){
    var a=document,b=’v’==’\v’,c=b?’attachEvent’:’addEventListener’;
    if(‘v’==’\v’){a.createElement(‘blink’);}
    window[c]((b?’on’:”)+’load’,function(){
        var d=a.getElementsByTagName(‘blink’);
            setInterval(function(){
                for(var i=0;i<d.length;i++){
                    var e=’visibility’,f=’hidden’,g=d[i].style,h=g[f];
                    g[f]=h==f?”:f;
                }
            },400);
    },!1);
})();

composite / 2011년 12월 19일 / 미분류 / 0 Comments

jQuery MsgBox 0.2.5 Alpha

세상에서 가장 가벼운 알림창. MsgBox. 라이브 예제

주의 : 표준 window.alert, window.confirm, window.prompt 함수를 대체할 수 있으나 사용자 입력 대기 하지 않음. 이벤트 기반.

cfile5.uf.184DEE3B4F41E5250B3C1B.html

cfile7.uf.153AD03B4F41E5252C3744.js

cfile30.uf.1853213B4F41E525036773.js

크리에이티브 커먼즈 라이선스
컴포지트에 의해 창작된 jQuery.msgbox 은(는) 크리에이티브 커먼즈 저작자표시-비영리-동일조건변경허락 3.0 Unported 라이선스에 따라 이용할 수 있습니다.
blog.hazard.kr의 저작물에 기초
이 라이선스의 범위를 넘는 이용허락은 http://blog.hazard.kr에서 받을 수 있습니다.

Creative Commons License
jQuery.msgbox by Composite ([email protected]) is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
Based on a work at blog.hazard.kr.
Permissions beyond the scope of this license may be available at http://blog.hazard.kr.

composite / 2011년 12월 7일 / 미분류 / 0 Comments

composite / 2011년 11월 11일 / 미분류 / 2 Comments

윈도우 비스타/2008 에서 절전 모드를 명령어로 처리

일단 cmd 키고

Rundll32.exe Powrprof.dll,SetSuspendState Sleep

이 명령어 실행하면 바로 절전 모드로 들어간다. 대기 시간 따위는 없다.
물론 깨려면 마우스 까딱하던가 파워버튼 누르던가 등등..

shutdown 명령어로는 종료,재시작,최대 절전까지는 가능하지만
절전 명령어는 shutdown 에서 관리를 안한다. 윈도우 8이면 모를까.

어쨌든, 이 명령어를 바로가기 시켜서 넣으면 아이콘 클릭으로 간편하게 절전 모드를 할 수 있다.
윈도우 7에서 절전 모드가 좋은 점은, 일단 컴퓨터는 꺼지며, 전기를 최대한 아끼지만 전력은 유지해야 한다.
하지만 다행이도 전기 나가던가 해서 전력이 손실되도 최대 절전 모드처럼 상태를 유지하며 윈도우를 재시작할 수 있다.
XP 까지는 절전 모드 상태에서 전원이 나가면 오류 메시지 표기하면서 2번 재시작하는 상황이 발생했다.

SSD한테는 최대 절전 모드가 유리하지만, HDD 쓰는 사람에게는 절전 모드는 정말 빠르게 부팅할 수 있는 좋은 기능이다.

composite / 2011년 9월 23일 / 미분류 / 0 Comments