Total: Today: Yesterday:
연구소/node.js | 2016. 4. 15. 18:47 | Posted by 자수씨

회사에서 게임 개발/운영 업무를 하다보니 신규 컨텐츠 제작 시 반복적인 신규 리소스 배포작업을 하고 있었습니다.


node.js 공부도 할겸 배포 스크립트 만들어봤습니다.



#h3 배포하기


목표로 했었던 배포 환경을 포스팅용으로 구성해보았습니다.


  • source: 복사할 소스 이미지들이 있는 디렉토리
  • destination/project: 프로젝트(코딩)에 리소스 디렉토리
  • destination/share: 공유 디렉토리


PS E:\temp\sources\resources> tree /a /f

E:.

+---destination

|   +---project

|   |   +---A

|   |   +---B

|   |   \---C

|   \---share

|       +---1

|       +---2

|       \---3

\---source

        02.png

        03.png

        04.png



```Gruntfile.js```
### js

'use strict';

module.exports = function(grunt) {
var readline = require('readline');
var path = require('path');
var sourceDir = 'E:/temp/sources/resources/source';
var shareDestDir = {
root: 'E:/temp/sources/resources/destination/share',
bg: '1',
logo: '2',
icon: '3'
};
var projectDestDir = {
root: 'E:/temp/sources/resources/destination/project',
bg: 'A',
logo: 'B',
icon: 'C'
};
var resourceId = -1;

// Project configuration.
grunt.initConfig({
deploy: {
main: {
files: [
{cwd: sourceDir, src: ['02.png'], dest: [shareDestDir, projectDestDir], type: 'bg'},
{cwd: sourceDir, src: ['03.png'], dest: [shareDestDir, projectDestDir], type: 'logo'},
{cwd: sourceDir, src: ['04.png'], dest: [shareDestDir, projectDestDir], type: 'icon'},
]
}
}
});

grunt.registerTask('question', function() {
var done = this.async();
var rl = readline.createInterface({
input: process.stdin,
output: process.stdout
});
rl.question('Input resource ID: ', function(answer) {
rl.close();
resourceId = answer;
grunt.log.writeln('입력받은 아이디: ' + resourceId);
done();
});
});

grunt.registerMultiTask('deploy', function() {

var options = this.options({
encoding: grunt.file.defaultEncoding,
timestamp: false,
mode: false
});

var copyOptions = {
encoding: options.encoding,
process: options.process,
noProcess: options.noProcess
};

this.files.forEach(function(filePair) {
var type = filePair.type;
filePair.src.forEach(function(src) {
var srcPath = path.join(filePair.cwd, src);
var destFileName = type + '_' + resourceId + '.png';
filePair.dest.forEach(function(dest) {
if (dest[type]) {
var destDirName = path.join(dest.root, dest[type]);
var destPath = path.join(destDirName, destFileName);
grunt.file.copy(srcPath, destPath, copyOptions);
grunt.log.writeln('Copy to ' + destPath);
}
});
});
});
});
grunt.registerTask('default', [
'question', 'deploy'
]);
};


기존에 ```copy``` 태스크를 ```deploy``` 로 변경하였으며, 하드코딩으로 파일 복사가 아닌 ```grunt.initConfig({...})``` 에 설정을 읽어들여 파일을 복사하도록 수정하였습니다.



빌드 스크립트 실행결과는 다음과 같습니다.


PS E:\temp\sources\grunt> grunt

Running "question" task

Input resource ID: 0001

입력받은 아이디: 0001


Running "deploy:main" (deploy) task

Copy to E:\temp\sources\resources\destination\share\1\bg_0001.png

Copy to E:\temp\sources\resources\destination\project\A\bg_0001.png

Copy to E:\temp\sources\resources\destination\share\2\logo_0001.png

Copy to E:\temp\sources\resources\destination\project\B\logo_0001.png

Copy to E:\temp\sources\resources\destination\share\3\icon_0001.png

Copy to E:\temp\sources\resources\destination\project\C\icon_0001.png


Done, without errors.



파일들이 복사된 경로를 트리형태로 보면 아래와 같습니다.


PS E:\temp\sources\resources> tree /a /f

E:.

+---destination

|   +---project

|   |   +---A

|   |   |       bg_0001.png

|   |   |

|   |   +---B

|   |   |       logo_0001.png

|   |   |

|   |   \---C

|   |           icon_0001.png

|   |

|   \---share

|       +---1

|       |       bg_0001.png

|       |

|       +---2

|       |       logo_0001.png

|       |

|       \---3

|               icon_0001.png

|

\---source

        02.png

        03.png

        04.png



지금까지 21번이나 복사하는 작업을 반복했는데, 왜 이런걸 만들 생각을 그동안 못했는지 눙물이 납니다 ㅠㅠ




연구소/node.js | 2016. 4. 15. 17:44 | Posted by 자수씨

회사에서 게임 개발/운영 업무를 하다보니 신규 컨텐츠 제작 시 반복적인 신규 리소스 배포작업을 하고 있었습니다.


node.js 공부도 할겸 배포 스크립트 만들어봤습니다.



#h3 파일 복사하기


파일 복사 테스트를 위해 하드코딩으로 이미지 파일을 입력받은 아이디로 리네임된 파일을 복사 테스트를 해보았습니다.


```Gruntfile.js```

### js


'use strict';


module.exports = function(grunt) {

var readline = require('readline');

var resourceId = -1;


// Project configuration.

grunt.initConfig({

copy: {

main: {

}

}

});


grunt.registerTask('question', function() {

var done = this.async();

var rl = readline.createInterface({

input: process.stdin,

output: process.stdout

});

rl.question('Input resource ID: ', function(answer) {

rl.close();

resourceId = answer;

grunt.log.writeln('입력받은 아이디: ' + resourceId);

done();

});

});


grunt.registerMultiTask('copy', function() {


var options = this.options({

encoding: grunt.file.defaultEncoding,

timestamp: false,

mode: false

});


var copyOptions = {

encoding: options.encoding,

process: options.process,

noProcess: options.noProcess

};

var srcPath = 'grunt.png';

var destPath = resourceId + '.png';


grunt.file.copy(srcPath, destPath, copyOptions);

});

grunt.registerTask('default', [

'question', 'copy'

]);

};


파일 복사 작업을 진행하는 ```copy``` 라는 멀티 태스크를 만들고 디폴트 태스크에 추가하였습니다.


입력받은 아이디를 사용해야하기 때문에 ```question``` 태스크 다음에 실행되도록 순서를 지정하였습니다.


실행을 하면 다음과 같이 복사작업이 완료됩니다.


PS E:\temp\sources\grunt> grunt

Running "question" task

Input resource ID: UWO_22

입력받은 아이디: UWO_22


Running "copy:main" (copy) task


Done, without errors.



멀티태스크로 만들 경우 ```grunt.initConfig({...})``` 에 설정 값이 없으면 태스크를 인식하지 못하는 듯 합니다. 아직 아무런 값이 없지만 ```grunt.initConfig({...})``` 에 ```copy``` 태스크 설정을 합니다.



파일 복사 테스트도 끝났으니 이제 마지막 배포 작업만이 남았습니다.




연구소/node.js | 2016. 4. 15. 17:06 | Posted by 자수씨

회사에서 게임 개발/운영 업무를 하다보니 신규 컨텐츠 제작 시 반복적인 신규 리소스 배포작업을 하고 있었습니다.


node.js 공부도 할겸 배포 스크립트 만들어봤습니다.



#h3 아이디 입력받기


"아이디" 는 신규 컨텐츠 마다 별도로 지정이 되기 때문에 스크립트 실행 시 입력받도록 만들고자 합니다.


해당 작업을 위해서는 ```readline``` 라이브러리가 필요합니다. ```readline``` 의 question 함수를 이용하여 입력을 받는 부분을 구현해보았습니다.


```Gruntfile.js```

### js


'use strict';


module.exports = function(grunt) {

var readline = require('readline');

var resourceId = -1;


// Project configuration.

grunt.initConfig({

});


grunt.registerTask('question', function() {

var done = this.async();

var rl = readline.createInterface({

input: process.stdin,

output: process.stdout

});

rl.question('Input resource ID: ', function(answer) {

rl.close();

resourceId = answer;

grunt.log.writeln('입력받은 아이디: ' + resourceId);

done();

});

});

grunt.registerTask('default', [

'question'

]);

};


```question``` 이라는 태스크를 만들고 기본 태스크에 ```question``` 을 등록한 상태이기 때문에 스크립트를 실행하면 아래와 같이 나오게 됩니다.


PS E:\temp\sources\grunt> grunt

Running "question" task

Input resource ID: 12

입력받은 아이디: 12


Done, without errors.



입력받은 아이디는 재사용해야하기 때문에 grunt 전역에서 사용할 수 있도록 선언하고 입력받은 값으로 설정합니다.



아이디 입력받기도 끝!!


연구소/node.js | 2016. 4. 15. 16:14 | Posted by 자수씨

회사에서 게임 개발/운영 업무를 하다보니 신규 컨텐츠 제작 시 반복적인 신규 리소스 배포작업을 하고 있었습니다.


node.js 공부도 할겸 배포 스크립트 만들어봤습니다.



개요

신규 컨텐츠의 디자인이 나오면 해당 파일을 개발 시에 사용하는 이름으로 변경하고 프로젝트 인원들이 함께 볼 수 있는 "공유폴더" 와 개발 워크스페이스에 "리소스폴더" 에 복사를 합니다.




"공유폴더" 와 "리소스폴더" 는 하위 폴더 구조도 상이하여 작업을 할 때마다 개별폴더에 하나씩 복사해야했기에 반복/귀찮은 작업이었습니다.


신규 리소스는 개발에 사용 시에 "아이디" 에 따라 네이밍을 하였기 때문에 배포 작업 시에 변경되는 사항은 "아이디" 밖에 없었습니다.



따라서, 다음과 같이 배포 스크립트를 만드려고 합니다.


  • "아이디" 는 스크립트 실행 시 입력을 받는다.

  • 각 파일들은 "아이디" 를 조합하여 리네임한다.

  • 각 파일들은 각 배포 경로에 복사한다.



사전작업

일단 node.js 와 grunt 실행이 가능하도록 환경을 구성하였습니다.


그 후 가장 기본적인 grunt 스크립트를 만들었습니다.


```package.json```

### JSON


{

  "name": "slotresource-deploy",

  "version": "0.0.1",

  "devDependencies": {

    "grunt": "~0.4.5"

  }

}


```Gruntfile.js```

### js


'use strict';


module.exports = function(grunt) {


    // Project configuration.

    grunt.initConfig({

    });


};


같은 디렉토리에 ```package.json``` 과 ```Gruntfile.js``` 를 생성하고 npm 로 초기화합니다.


npm install


위의 명령어를 실행하면 npm 에서 자동으로 필요한 모듈을 내려받게 됩니다.


slotresource-deploy@0.0.1 E:\temp\sources\grunt

`-- grunt@0.4.5

  +-- async@0.1.22

  +-- coffee-script@1.3.3

  +-- colors@0.6.2

  +-- dateformat@1.0.2-1.2.3

  +-- eventemitter2@0.4.14

  +-- exit@0.1.2

  +-- findup-sync@0.1.3

   ...



이 상태에서 ```grunt``` 를 실행하면 아무것도 없기 때문에 에러가 납니다.


사전작업은 여기까지가 끝!!




연구소/node.js | 2016. 4. 5. 16:27 | Posted by 자수씨

1. node.js 설치하기

 - node.js 홈페이지에 접속하여 LTS 버전을 다운로드 받습니다.

 - 포스팅 작성시점에는 v4.4.2 입니다.

 - LTS 는 Long-term Support 의 약어입니다.

 - 설치가 완료되면 cmd 창에서 "node -v" 명령으로 설치가 잘되었는지 확인합니다.



2. bootstrap 설치하기

 - HTML, CSS, JS 프레임워크

 - http://bootstrapk.com/

 - nodejs 가 설치된 경로(기본설치했을 경우 "C:\Program Files\nodejs")로 이동하여 다음의 명령어를 실행합니다.

 - "npm install bootstrap"


C:\> cd C:\Program Files\nodejs

C:\> npm install bootstrap




3. grunt 설치

 - 자바스크립트 task runner (자동화된 빌드도구?)

 - http://gruntjs.com/

 - 글로벌로 설치하기 위해 "-g" 옵션으로 설치합니다.

 

C:\> npm install grunt-cli -g



4. git 설치

 - 많은 오픈소스들이 git 으로 소스관리가 되어 있기 때문에 git 을 설치합니다.

 - https://git-scm.com

 - 자세한 설정은 잘 모르기 때문에 일단 "Next" 연타로 설치 완료//




5. "bootstrap" grunt task

 - bootstrap 을 grunt 로 빌드합니다.


C:\Program Files\nodejs> cd node_modules\bootstrap

C:\Program Files\nodejs\node_modules\bootstrap> npm install







위와 같이 나오면 bootstrap 빌드 완료?




뭐가 뭔지도 모르는 상태에 일단 따라하긴 했으나 앞으로 알아야 할 것이 너무 많아 보입니다...




References

1. http://50english.blog.me/220603479539

2. https://nodejs.org/en/

3. http://bootstrapk.com/

4. http://gruntjs.com/

5. https://git-scm.com/