검색결과 리스트
프로그래밍/nodejs에 해당되는 글 4건
- 2018.08.17 handlebars로 array 문자열을 넘길때 발생하는 문제...
- 2018.08.11 handlebars 사용 하면서 알게된 팁 정리...
- 2018.08.08 node.js async에 들어있는 waterfall 정리...
- 2018.08.07 node.js 소스 수정시 자동으로 재시작 해주는 pm2 & nodemon
글
node.js에서 아래와 같은 값을 render로 보낸다 치면
const labels = ['Mar 1', 'Mar 2', 'Mar 3', 'Mar 4', 'Mar 5', 'Mar 6', 'Mar 7']
문자열의 표시인 작은 따옴표가 없어지는 경우가 발생함..
이는 html을 컨트롤 하는데는 좋은데..
html 안에 client javascripte 안에 변수로 던저 줄때는 문제가 된다..
따옴표가 없으니 제대로 인식이 안되는
그래서 수동으로 따옴표 붙이는 작업도 해봤는데 뭔가 좀 거시기해서 구글링 해서 찾으니
json 인코딩을 이용한 처리가 있었음
- node.js 의 스크립트 파일
const labels = ['Mar 1', 'Mar 2', 'Mar 3', 'Mar 4', 'Mar 5', 'Mar 6', 'Mar 7'];
res.render('dashboard', {
labels: encodeURIComponent(JSON.stringify(labels))
});
- handlebars의 html 처리
<script>
// Area Chart Example
var ctx = document.getElementById("realTimeUser");
var myLineChart = new Chart(ctx, {
type: 'line',
data: {
labels: JSON.parse(decodeURIComponent("{{{labels}}}")),
}
});
</script>
참고로 html 파일에 값은 따옴표 꼭 붙쳐줘야 제대로 인코딩 됨
글
node.js express에서 template engine 으로 handlebars를 사용하기로 하면서 몇가지 알게 된것을 정리 해본다.
- - layout 기능
template engine 중에 그나마 html 태그를 그대로 쓰는것중에 ejs 하고 handlebars가 있었다. 사람들이 가장 많이 이야기 하게 handlebars 라서 사용 하였는데 대쉬보드 형태의 페이지를 만든다면 layout 기능이 지원하는 handlebars 가 편한거 같다. ejs도 확장 기능으로 layout 지원하는거 같은데 아직은 뭔가 한참 만들고 있는느낌이라 패스..
- - 거지 같은 조건 비교문 #if #unless
#if #unless 로는 true / false 밖에 사용이 안된다. 그래서 따로 helper를 이용해서 조건문 연산자를 만들어 사용 하는거 같다. 아래 주소는 사용 방법이니 참고를...
[Javascript] handlebars.js {{#if}} 조건부의 논리 연산자
안에 페이지 보면 Handlebars.registerHelper() 요렇게 되어있는데 메인페이지에 선언해 뒤면 되고 앞에 Handlebars 는 var Handlebars = require('hbs') 해서 가지고 오면 된다.
- - 색션 내에서 다른 루트 변수에 접근 할때 확인
{
main : { name: '나 메인'},
sub : { name: '나 서브'}
}
이런 값을 넘겨서
아래와 같이 템플릿으로 사용 할경우
{{#main}}
{{name}} <- 이것은 main의 값
// 여기서 sun 의 name 값을 가지고 올려면
{{../sub/name}} <- 요렇게 해야 sub의 name값을 가지고옴
{{/main}}
처음에는 ../이거 없이 했는데 값이 undefined 해서 나와서 환장 했음..
이 사이트가 아니였음 눙물 흘리고 계속 삽질 할뻔 했음.. https://taegon.kim/archives/4910
올려주신분에게 감사의 마음을...
글
node.js에서 async 를 쓰는 이유는 콜백사용으로 인해 중첩되는 함수들을 줄이기 위해서 라고 알고 있는데....
그중에서 가장 많이 쓰는게 waterfall 을 많이 쓰는거 같아 일단 정리 해본다.
waterfall<T, E>(tasks: Function[], callback?: AsyncResultCallback<T, E | Error>): void; |
함수 구조는 위와 같이 되어있다.
tasks는 대괄호 안에 순서대로 처리할 function을 넣어야 하고
AsyncResultCallback 위에 task function에서 에러가 나거나 마지막 함수를 처리 할때
들어오는 함수로 보면 될꺼 같다.
tasks에 선언하는 function의 인자값은 callback을 사용 하며 이것을 이용하여 다음 function으로 이동 하거나 에러를 보내서 AsyncResultCallback함수에 에러 값을 보내기도 한다.
callback을 함수로 사용 하면 첫번째 인자는 error 값을 보내게 되어있고 두번째 인자 부터는 다음 task에 전달할려고 하는 값을 넣을 수 있다.
일단 waterfall을 왜 써야하는지를 간단하게 보기 위해 아래와 같은 샘플 코드를 작성 해보았다
코드를 간단하게 설명하면 test.txt 파일을 읽어서 test_async.txt 파일로 쓰기를 하는 코드이다.
일단 test.txt 파일을 읽고 callback으로 파일을 제대로 읽었는지 확인후에
test_async.txt 파일을 쓰기를 하고 그 결과를 callback 으로 확인 하는 로직이다.
콜백 중첩이 2단계 정도라 보기 편하지만 점점 중첩 단계가 많아진다면 보기가 힘들어질것이다
그래서 async의 waterfall 로 처리한 코드 아래와 같이 작성하였다.
중첩되는 괄호가 없어서 보기는 편해졌다..
코드가 생략된 부분이 있어서 조금 풀어서 보면 아래와 같이 작성 된다.
2번째 사진처럼 구조를 알고 있다면 심플하게 작성하는것도 나쁘진 않지만.
코드는 명확하게 하는게 작업할때 더 좋다 그래서 3번째 처럼 작성 하는것을 추천함.
자세한 설명은 아래 정식 문서를 참조하기 바람..
https://caolan.github.io/async/docs.html#waterfall
글
node.js 개발할 때 JavaScript 수정 할때마다 어플리케이션을 재실행 해야하는데
그런 귀찮음을 해결 해주는 어플 2가지를 소개 합니다.
자세한 사용 방법은 구글에 물어보면 많은 분들이 설명해서 간단하게만 정리 해둡니다.
개발용으로 사용한다면 nodemon을 하는게 좋고 라이브 서비스에서 사용한다면 pm2가 좋은거 같심다.
pm2
공식 설명서 : https://pm2.io/doc/en/runtime/overview/)
개발용으로 쓰기에는 좀 무겁지만.. 그래도 세팅 해두면 자동으로 되기에 간단한 사용 방법은 아래와 같이...
유료버전도 있는거 같은데 아직은 필요성을 잘 모르겠네요..
설치 방법
npm install pm2 -g |
사용 방법
pm2 start app.js --watch |
로그 확인
pm2 log |
nodemon
공식 설명서 : https://github.com/remy/nodemon#nodemon
개발 할때 쓰는건 이게 심플 하고 좋은거 같심다. vscode에서 디버깅을 하기위해 attach를 해서 사용도 가능 합니다. 위에 pm2는 그게 안되서 조큼 귀찮긴 했죠.
설치 방법
npm install nodemon -g |
사용 방법
nodeman app.js |
RECENT COMMENT