본문 바로가기

전체 글

ExpressJS::개발환경 구축과 실행 NodeJS를 위한 빠르고 개방적인 간결한 웹 프레임워크인 ExpressJS의 실습을 위한 간단한 개발환경 구축 및 실행방법에 대하여 정리해 보았습니다. NodeJS 설치하기Express를 위해서는 NodeJS가 우선적으로 설치가 되어 있어야 합니다. https://nodejs.org/en/ 에서 다운로드 받은 후 간단한 절차를 통해 설치가 가능합니다. terminal에서 node 버전확인을 통해 설치가 제대로 되었는지 알 수 있습니다. $ node -v node version: 6.10.2 프로젝트 생성하기개발툴에서 ExpressJS 실습을 위한 프로젝트를 생성해줍니다. 저의 경우 visual studio code(vscode)에서 started_express 라는 이름의 폴더를 생성해 주었습니다. 개.. 더보기
Javascript::Promise에 대한 이해 전통적인 callback 패턴function mySandwich(param1, param2, callback) { alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2); callback();} mySandwich('ham', 'cheese', function() { alert('Finished eating my sandwich.');});Colored by Color Scriptercs위와 같은 형식들로 자바스크립트에서 비동기 프로그래밍을 위한 패턴으로 callback을 사용했습니다. 하지만 이러한 전통적인 callback 패턴에는 몇가지 단점이 있습니다.비동기 처리 중에 발생한 오류를 예외처리 하기가 까다롭다. (http:/.. 더보기
D3 :: select(), selectAll()을 이용한 문서요소 만들기 D3는 'Data-Driven Document' 라는 이름에서도 알 수 있듯이 다양한 방법으로 쉽게 Data를 DOM element에 쉽게 바인딩 할 수 있기 때문이다. Data를 바인딩하여 출력물을 내는 간단한 예제를 통해서 D3의 기본적인 구조, selection 객체, select & selectAll 메소드 등을 알아본다. 현재 D3 v4가 release되었지만 v3, v4의 비교를 통한 공부를 하기위해 v3으로 진행한다. 기본개념에 대한 예제123456789101112131415161718192021222324252627 var theData = [1, 2, 3, 4 ,5]; var selection = d3.select("body") .selectAll("p") .data(theData) .e.. 더보기