태그 글목록: javascript

Icon_MongoDB_by_xkneo

mongodb batch (1)

몽고디비에서 돌아가는 배치 프로그램을 작성 할경우  콘솔에서 아래처럼 실행 할수 있다.
(로컬에서 실행중이고 디폴트 포트일경우)

$ mongo < batch.js

이때 저 batch.js 안에 외부 자바스크립트 라이브러리를 load 해서 작성 할수 있다. json 데이터를 다루는 만큼 underscore.js 같은걸 쓰면 데이터 조작이 아주 편할꺼 같다고 생각, 테스트 한 결과는 아래와 같다. 순서는

1. 외부소스를 로딩하고
2. 원하는 디비로 이동해서
3. 질의를 시작하여 결과를 array 로 변환한뒤
4. array 의 모든 요소를 다른 쪽디비(mola)로 등록한다.

기타 print(몽고쉘명령) 명령 으로 실행 결과를 출력하여 확인 할수 있다.

 

  • Facebook
  • Google Plus
  • Twitter
  • LinkedIn
  • Pinterest
  • Tumblr
  • Instapaper
  • Delicious

특정 key(columns) 만 뽑아 배열 만들기

몽고디비에서는 특정 컬럼만 뽑기 위해서 db.collection.find({조건},{key:1,…}) 로 질의 한다. 

몽고디비에 대한 의존도를 줄여보자.

1. map 만 쓴 질의
pj.yearlyCmltCntdHeatLoad.public.map(function(obj){ return obj.heatingCntdHeatLoad; });
-> 전세계?어디서나 쓸수 있는 질의 , 그런데 내가 가저오고 싶은 key 가 제일뒤에 보인다.

2. 언더스코어 질의
_.pluck(pj.yearlyCmltCntdHeatLoad.public,'heatingCntdHeatLoad');
-> 언더스코어의 pluck 함수를 이용한 질의.(짧다!). parameter 의 순서가 바뀌었다면 최고 인데.. 쉽다.

3. 커피스크립트 질의
x.heatingCntdHeatLoad for x in pj.yearlyCmltCntdHeatLoad.public
-> 물론 추후 js 로 바뀜. 몽고 console 이 커피스크립트를 지원한다면 좋겠음.
,물론 커피로 만든 함수를 js 로 변환한뒤 콘솔에서 로딩해서 쓰는 방법도 있음.

여러분이 좋아하는 sql 

select heatingCntdHeatLoad from pj.yearlyCmltCntdHeatLoad.public
-> 간단해 보임

 

  • Facebook
  • Google Plus
  • Twitter
  • LinkedIn
  • Pinterest
  • Tumblr
  • Instapaper
  • Delicious
angularjs-188x200

angularjs 와 java , mongodb 사용의 나쁜예 퀵하게 보기 (1)

현재 angularjs 와 java(톰켓)을 사용하여 SI 프로젝트를 하고 있습니다. 현시점에서 상태를 퀵하게 기술해봅니다.  전체를 상세 설명하려면 소스 공개가 가장 빠르겠지만 SI 특성상 공개 할수가 없습니다. 제 개발 패턴이 궁금하신분이 있다면(없겠지만) 차라리 데모?를 직접 보여 드릴 수는 있습니다. ㅎㅎㅎ

front : javascript ( angularjs 를 주로 씀 )
was : java / tomcat / struts2 / spring(젤 하는일없음)
db : mongodb 
o/s : dev-osx , server-ubuntu

1. 클라이언트

1.1 코딩기준 
	- jQuery 떡칠 way 는 하지 않고 (아예사용안함) angular way 로만 한다. 
	- single web page 로 구성한다. 
	- index.html 상단과 좌측 메뉴 처리 , appControl 관련된 javascript 처리
		-> 실제로 메인 app. 메인 컨텐츠 부분은 ng-view 로 동적 로딩 되게 한다. 
	- 동적 로딩되는 실제 ui 처리는 ng-view와 router 를 사용한다. 
          로딩되는 화일은 화면명.html + 화면명Ctrl.js 의 한쌍으로 구성한다.
		-> 개인적인 취향 jQuery 떡칠패턴으로 개발시부터 
                   ui.html + ui.js + ui.css를 주로 써왔음
	- 디렉티브는 별도로 저장한다. 
	- 전체 화면의 공유 데이터는 rootScope 데이터 변수를 사용하여 공유한다.
		-> service 는 사용하지 않는다 (angularjs 권고사항) 

1.2 폴더
	/estimate 	- index.html 및 화면명.html , 화면명Ctrl.js 화일들 저장 
	|- /directive	- angularjs 디렉티브 + ui.bootstrap 디렉티브
	|- /filter	- 필터관련 js 화일
	|- /helper	- 메뉴처리 js , 기타 분류안한 js 예) request 처리 js
	|- /service	- view Controller 에서 공통 사용되는 업무관련 함수들
			  ex) 몽고디비기본함수 (find,remove,update..) 클라이언트 구현체 
	/lib		- 외부 자바스크립트 프레임워크들 
	|- /bootstrap
	|- /Hightchart 
	|- underscore.js

	/schema
		schema.js   - json템플릿 리턴 및 벨리데이션 담당
		schema.json - json 스키마정의 

2. 서버 (tomcat)
	2.1 어떠한 경우도 서버페이지(jsp) 를 생성하지 않는다. 
	2.2 브라우저 요청과 서버쪽 Action 은 이름으로 매칭한다. (설정최소화)
	    -예) 클라이언트 요청 SalesEstimate-findProject 
		 -> 서버쪽 처리    SalesEstimateAction 의 findProject
	2.3 브라우저 리프레쉬 할경우 클라이언트 라우터 동작을 위한 리디렉트 구현
	2.4 odm 은 하지 않는다. jsonhashmap 변환으로 대체 (gson 라이브러리사용)		
		key 값을 method 로 사용하지 않음. key 값을 검색의 대상으로 동적 사용하므로 불가능함. 
	2.5 향후 node 로 변환 or 스프링및 스트러츠 걷어내고 jsp 만으로 전환.

3. issue 
	router시 앵귤러 해쉬뱅 '/#/' 으로 인해서 ie 에서 비정상적 동작. 
           1. 심각하게 "angularjs 들어 내기" , "single web 안하기" 중에 고민중.
           2. 앵귤러들어내기 (meteor 에서 ddp만 내리고 클라이언트만 사용하기)
        "서버가 자바인 관계로 자료구조(json) 핸들링의 어려운점" 해결방안 모색
           1. 자바들어내기 - 현재는 hashmap 으로 꿋꿋하게 버티는중.

소스나 개발 패턴이 좀더 나아지면 (2)탄도 써보겠습니다.

  • Facebook
  • Google Plus
  • Twitter
  • LinkedIn
  • Pinterest
  • Tumblr
  • Instapaper
  • Delicious
angularjs-188x200

ng-repeat sort by object , possible with key

ng-repeat 에서 key,value object 의 경우 sort 가 안댐. array 만됨
아래 링크 횽아가 sort 가 되게 orderObjectBy 라는 필터를 만들음..

http://justinklemm.com/angularjs-filter-ordering-objects-ngrepeat/

근데 이거는 key 로 소트가안댐.. 댕장 그래서 쪼금 아주쪼금 수정함 (빨간색)

app.filter('orderObjectBy', function() {
    return function(items, field, reverse) {
        var filtered = [];
        angular.forEach(items, function(item , key) {
            item["key"] = key;
            filtered.push(item);
        });
        filtered.sort(function (a, b) {
            if(a[field] > b[field]) return 1;
            if(a[field] < b[field]) return -1;
            return 0;
        });
        if(reverse) filtered.reverse();
        return filtered;
    };
});

사용법

<tr ng-repeat="v in project.loadStandard | orderObjectBy:'key':true">

 

  • Facebook
  • Google Plus
  • Twitter
  • LinkedIn
  • Pinterest
  • Tumblr
  • Instapaper
  • Delicious

javascript iteration 함수 연습

/*첫날*/

var companies = [
{‘name’:’apple’,’country’:’USA’}
,{‘name’:’samsung’,’country’:’KOREA’}
,{‘name’:’sony’,’country’:’JAPAN’}
,{‘name’:’lg’,’country’:’KOREA’}
]
var rslt = “”;

//1. forEach 예제

companies.forEach(function(element, index, array) {
console.log(“a[” + index + “] = ” + element.name);
});

결과
a[0] = apple
a[1] = samsung
a[2] = sony
a[3] = lg

//2. map + join 단순예제

rslt = companies.map(function(element, index, array){
return element.name;
}).join(‘,’);
console.log(“전체 회사의 목록입니다. : ” + rslt);

결과
전체 회사의 목록입니다. : apple,samsung,sony,lg

//3. some 예제

rslt = companies.some(function(element, index, array){
return element.name==’apple’;
});
console.log(“apple 도 있습니까? > ” + rslt);

결과
apple 도 있습니까? > true

//4. every 예제

rslt = companies.every(function(element, index, array){
return element.name==’apple’;
});
console.log(“모두 apple 입니까? > ” + rslt);

결과
모두 apple 입니까? > false

//5. map , join 인데 조건주기 헛… 근데.. 이쁘지가 않아..

rslt = companies.map(function(element, index, array){
if(element.country===”KOREA”) return element.name;
}).join(‘,’);
console.log(“국적이 KOREA 인 회사의 목록입니다. ” + rslt);

결과
국적이 KOREA 인 회사의 목록입니다. ,samsung,,lg

//6.filter 로 해결 – 에 조건을 줘서 돌리기보다 filter 를 써서 참인것만 받는게 낫네 , 맵은 그냥 전체 배열의 element 를 대상으로 어떤 실행을 해주는것(apply) 이 맞는거 같음

rslt = companies.filter(function(element, index, array){
return element.country===”KOREA”;
}).map(function(element){
//json 을 리턴하니까 회사명만 발라내기
return element.name;
}).join(“,”);
console.log(“국적이 KOREA 인 회사의 목록입니다. ” + rslt);

결과
국적이 KOREA 인 회사의 목록입니다. samsung,lg

//7. reduce – 전체를 대상으로 한개의값을 리턴 reduced map 또는 map Reduced 로 nosql 쪽에서 많이 적용. 근데 node 에서는 sum 빼놓고 어디 써야 할지 모르겠음

소스
var a = [1,2,3,4,5,6,7,8,9];
var i = 0;
a.reduce(function(prev,curr){
console.log((i++).toString() + “:” + prev.toString() + ” : ” + curr.toString());
return prev + curr;
},100);  <– 요 100은 합계에 초기값

//8. 넣기 빼기 pop , push , shift unshift

console.log(companies);
console.log(companies.shift()); //머리에서 빼옴
console.log(companies);
companies.unshift(‘unshift’); //머리에다 넣음
console.log(companies);
console.log(companies.pop()); //뒤에서 빼옴
console.log(companies);
companies.push(‘push’); //뒤로 넣음
console.log(companies);

sort , concat , indexOf , slice , splice

  • Facebook
  • Google Plus
  • Twitter
  • LinkedIn
  • Pinterest
  • Tumblr
  • Instapaper
  • Delicious

Create a node webapp with express.js

웹서버를 노드에서 돌리는거는 오방 간단한데… (node.js 사이트 가보면 젤먼저 나오는 6줄 짜리 테스트 코드) 첨부터 끝까지 api 가지고 개발할려면 안습.

역시 양깨들의 힘을 빌어 express.js 님을 (http://expressjs.com/) 이용해서 웹서버하나 돌려 봐야지

시작~

1. express.js install

>npm install -g express

* 위에처럼 뜨면 성공.. (아..캡처 뜨고 minus 에 이미지 올리고 할려니 너무 힘들다;; 있어보이기는 하는데 앞으로는 걍 하지 말아야지)

 

2. express simpleWeb (simpleWeb 프로젝트) 만들어보기 

ppillip@ubuntu:~$ cd ProjectsN/
ppillip@ubuntu:~/ProjectsN$ express simpleWeb <— 요기가 커맨드

create : simpleWeb
create : simpleWeb/package.json
create : simpleWeb/app.js
create : simpleWeb/public
create : simpleWeb/public/javascripts
create : simpleWeb/public/images
create : simpleWeb/public/stylesheets
create : simpleWeb/public/stylesheets/style.css
create : simpleWeb/routes
create : simpleWeb/routes/index.js
create : simpleWeb/routes/user.js
create : simpleWeb/views
create : simpleWeb/views/layout.jade
create : simpleWeb/views/index.jade

install dependencies:
$ cd simpleWeb && npm install

run the app:
$ node app

ppillip@ubuntu:~/ProjectsN$

* express 를 -g 옵션으로 설치 햇으니 마치 우붕 유틸처럼 잘도 됨

 

3. 관련 패키지 설치

>cd simpleWeb
*express 가 만들어준 폴더에 들어가서

>npm install
*추가 옵션없이 바로 명령어 실행하면 현재 디렉토리(simpleWeb) package.json 을 읽고 그안에 있는것을 추가 install 한다.

ppillip@ubuntu:~/ProjectsN/simpleWeb$ npm install <— package.json 을 읽고 실행됨
npm WARN package.json application-name@0.0.1 No README.md file found!
npm http GET https://registry.npmjs.org/express/3.0.0rc4
npm http GET https://registry.npmjs.org/jade
npm http 200 https://registry.npmjs.org/express/3.0.0rc4
npm http GET https://registry.npmjs.org/express/-/express-3.0.0rc4.tgz
npm http 200 https://registry.npmjs.org/jade
npm http GET https://registry.npmjs.org/jade/-/jade-0.27.4.tgz
npm http 200 https://registry.npmjs.org/express/-/express-3.0.0rc4.tgz
npm http 200 https://registry.npmjs.org/jade/-/jade-0.27.4.tgz
npm http GET https://registry.npmjs.org/connect/2.4.4
npm http GET https://registry.npmjs.org/commander/0.6.1
npm http GET https://registry.npmjs.org/range-parser/0.0.4
npm http GET https://registry.npmjs.org/mkdirp
npm http GET https://registry.npmjs.org/mkdirp/0.3.3
npm http GET https://registry.npmjs.org/cookie/0.0.4
npm http GET https://registry.npmjs.org/crc/0.2.0
npm http GET https://registry.npmjs.org/fresh/0.1.0
npm http GET https://registry.npmjs.org/methods/0.0.1
npm http GET https://registry.npmjs.org/send/0.0.4
npm http GET https://registry.npmjs.org/debug
npm http 304 https://registry.npmjs.org/connect/2.4.4
npm http 304 https://registry.npmjs.org/range-parser/0.0.4
npm http 304 https://registry.npmjs.org/mkdirp
npm http 304 https://registry.npmjs.org/commander/0.6.1
npm http 304 https://registry.npmjs.org/cookie/0.0.4
npm http 304 https://registry.npmjs.org/mkdirp/0.3.3
npm http 304 https://registry.npmjs.org/crc/0.2.0
npm http 304 https://registry.npmjs.org/fresh/0.1.0
npm http 304 https://registry.npmjs.org/methods/0.0.1
npm WARN package.json methods@0.0.1 No README.md file found!
npm http 304 https://registry.npmjs.org/send/0.0.4
npm http 304 https://registry.npmjs.org/debug
npm http GET https://registry.npmjs.org/mime/1.2.6
npm http GET https://registry.npmjs.org/qs/0.4.2
npm http GET https://registry.npmjs.org/formidable/1.0.11
npm http GET https://registry.npmjs.org/bytes/0.1.0
npm http GET https://registry.npmjs.org/pause/0.0.1
npm http 304 https://registry.npmjs.org/qs/0.4.2
npm http 304 https://registry.npmjs.org/formidable/1.0.11
npm http 304 https://registry.npmjs.org/bytes/0.1.0
npm http 304 https://registry.npmjs.org/mime/1.2.6
npm http 304 https://registry.npmjs.org/pause/0.0.1
jade@0.27.4 node_modules/jade
├── commander@0.6.1
└── mkdirp@0.3.4

express@3.0.0rc4 node_modules/express
├── methods@0.0.1
├── fresh@0.1.0
├── range-parser@0.0.4
├── cookie@0.0.4
├── crc@0.2.0
├── commander@0.6.1
├── debug@0.7.0
├── mkdirp@0.3.3
├── send@0.0.4 (mime@1.2.6)
└── connect@2.4.4 (pause@0.0.1, bytes@0.1.0, qs@0.4.2, formidable@1.0.11)

먼가 오방 인스톨 하는게 보임.. package.json 에 관련된거 싸그리 ㅋ 잘보면 jade랑 express 랑 설치 된것인데 , 여기서 express는 npm_moudles 에 들어가서 내 프로젝트의 라이브러리로서 작용 하는것. (-g 의 프로젝트 생성해주는 유틸과는 다른 것).

게다가 jade하위 프로젝트(lib)들 , express 하위프로젝트들 죄다 설치됨.

 

4. node app.js 

위와 같은 커맨드로 app.js 를 실행해보기

브라우져에서 요런게 보였다면 helloWold 성공 ~!

 

덧붙이기 :

a. express.js 는 npm  -g 옵션으로 선택해서 설치 하면 콘솔에서 “express 프로젝트명” 이런 사용법으로 유틸처럼씀

b. “npm install 패키지명” 하면 해당 패키지가 설치됨, 만약 패키지명 생략하면 현재디렉토리의 package.json 을 찾아서 싸그리 설치함

c.  node app.js 형태로 실행함

 

  • Facebook
  • Google Plus
  • Twitter
  • LinkedIn
  • Pinterest
  • Tumblr
  • Instapaper
  • Delicious

우분투에 node 개발환경 만들기

node.js 가 업뎃도 되고 (http://nodejs.org/)

윈도우 node를 쓰니 “이건 먼가 좀 커피 쏟아 말라 비틀어진 장판에 발이 쩍 달라붙은 느낌” 처럼 찜찜한게 있다.

게다가 사용중에 이래저래 귀찮은 일이 벌어진다. (가령 forever 가 소스 반영된걸 감지 못한다던가)

또한 윈도용으로 나오는 솔루션들은 항상 릴리즈나 트러블 슈팅이 조금씩?늦다.  없을수도;; (meteor는 안대!)

사실 마이크로소프트횽아들이 전폭적인? 지원을 하고 있다고 하지만  웬지 미심쩍은 곳도 있고.

그렇다고 Mac 을 사자니 돈도 없고….

결국, 이상적이고 포터블한 개발환경은 스펙(http://spectrumdig.blogspot.kr/)말대로 우분투 vm 헤드리스모드가 답인듯.

몇일전 작업 이지만 우분투에 history 가 남았으니 설명을  덧붙여서 작성하게 되었슴.
*솔직히 이글 남길려고 wordpress 설치하고 blog.ppillip.com 계정 연결하고 웬갖 삽질 다하고나서
이제야 남기네… ㅜ.ㅜ

 

이제 작업 시작

일단 vm ware 에 ubuntu 를 최~에신 버전을 설치한다 (난 쌔거가 무조껀 좋아 : 현재 12.04 LTS)

1. ssh 설치 한다

sudo apt-get install ssh
service ssh start

* 일단 vm 을 띄워서 run in background 로 돌리고 나머지 작업은 ssh 접속해서 터미널로 작업 할려고 그랫음

 

2. 사전 필요 모듈 들 설치

sudo apt-get install -y g++ apache2-utils git git-core curl build-essential openssl libssl-dev libxml2-dev

* 하나하나 필요한곳이 잇는데 사실 apache2-utils 예는 머하는건지 나중에 찾아봐야 할듯

 

3. node source 다운로드 하기

mkdir node
git clone git://github.com/joyent/node.git && cd node
git checkout v0.8.9  <– 요고는 원하는데로 버전을 변경할수 있어서 좋다 
(“git checkout 버전”)

*일단 여러가지 방법이 있는데 난 그냥 소스 받아서 컴파일 하는 방법을 택함.

 

4. 컴파일 (node 받은 디렉토리로 이동)

./configure
make
sudo make install

*요대목에서 생각보다 시간 엄청 걸림 ㅋ

 

5. npm 다운로드 및 설치

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

*node package manager 다운로드 요거없음 상당히 불편

 

6. 현재유저(ppillip)한테 로컬 폴더 권한주기 

sudo chown -R $USER /usr/local

* -g 옵션(글로발)으로 설치 할려면 이게 있어야지 안그럼 sudo로 npm 실행해야 하는데 그건 좀 사절

 

설치된 기념으로 다가 잇증샷 ㅋ

 

난 애라나도 최신꺼가 젤좋아 ㅋㅋㅋㅋㅋㅋ

사실 궁극의 목적은 웹 IDE 인 cloud9 을 설치 하는것!  설정 완료 되면 다음에 또 포스팅 ㅎㅎ

  • Facebook
  • Google Plus
  • Twitter
  • LinkedIn
  • Pinterest
  • Tumblr
  • Instapaper
  • Delicious