Node.js - express (3) get 요청 , post 요청
·
Node/Express
이번 포스팅에서는 웹브라우저가 get 방식 혹은 post 방식으로 데이터를 담아 웹서버에 요청을 보냈을 때 express와 nunjucks를 활용해 이러한 요청들을 처리하는 방법에 대해 다뤄보고자 한다. get 방식의 요청과 응답 post 방식의 요청과 응답 웹브라우저에서 웹서버로 요청을 보내는 방식은 크게 get 방식과 post 방식이 있다. get 방식은 URL에 queryString 형태로 데이터를 담아 웹서버에게 요청을 보내는 방식이다. 위와 같은 형태로 express.js 파일과 index.html 파일이 작성되어 있다고 했을 때 app.get( ) 메소드의 콜백함수에게 전달된 req 객체를 이용하면 get 방식으로 요청이 들어왔을 때 querySt..
Node.js - express (2) 템플릿 엔진 사용하기
·
Node/Express
이번 포스팅에서는 express를 이용해 웹서버를 구축할 때 템플릿 엔진을 사용하는 방법에 대해 알아보도록 하자. 템플릿 엔진으로는 nunjucks를 사용하고자 한다. 템플릿 엔진 nunjucks nunjucks 세팅하기 템플릿 엔진을 이용해 변수 다루기 템플릿 엔진에는 ejs, pug, jade, nunjucks 등등 다양한 종류의 템플릿 엔진이 있다. 우리가 사용할 템플릿 엔진은 이러한 여러 템플릿 엔진 중 nunjucks라는 녀석이다. 템플릿 엔진을 사용하는 이유는 HTML 파일을 만들어 주기 위해서이다. 앞서 우리가 express를 이용해 요청이 들어온 웹브라우저에게 응답을 보낼 때는 res.send() 메소드를 사용해 웹브라우저에게 랜더할 페이지의..
Node.js - express (1) 웹서버 만들기
·
Node/Express
앞으로 Node.js의 express 모듈을 이용해 웹서버를 제작하는 과정을 포스팅해 보고자 한다. 이번 포스팅에서는 express 모듈을 사용해 포트를 연결하고 접속하는 것만 구현해 보도록 하자. npm install express (express 패키지 설치) 웹서버 만들기 Node.js에는 웹서버가 내장되어 있기 때문에 이를 활용하면 웹서버를 구축할 수 있다. 우리가 사용할 것은 express로 이는 Node.js에서 실행할 수 있는 웹서버를 구축하기 위한 패키지이다. 우선 npm을 사용하기 위한 준비 작업으로 vsCode(Visual Studio Code) 에디터의 터미널 창에 "npm init"을 입력해 package.json 파일을 생성하..
Node.js 실행하기 (with Visual Studio Code)
·
Node/Node.js
이번 포스팅에서는 Visual Studio Code(이하 vsCode)를 사용해서 Node.js를 실행해 보도록 하자. REPL 모드로 실행하기 vsCode 에디터에서 터미널을 이용해 REPL 모드로 Node.js를 실행할 수 있다. REPL은 Read Evaluate Print Loop의 약자로 코드를 읽고 평가하고 출력하는 것을 반복한다는 뜻으로 이해하면 된다. 컴파일 과정 없이 즉석에서 코드를 입력하고 결과를 바로 알 수 있는 방식을 일컫는다. 터미널창에 node를 입력하면 ">" 모양의 화살표가 뜨면서 REPL 모드로 Node.js가 실행된다. console.log("Hello Node.js") 를 입력하고 엔터를 치면 아래에 보이는 것과 같이 즉각적인 결과물이 콘솔창에 출력되는 것을 알 수 있다..
JavaScript ES6 - 템플릿 리터럴 , 객체 리터럴 , 구조분해 할당
·
JavaScript
이번 포스팅에서는 JavaScript의 ES6 문법 중 템플릿 리터럴과 객체 리터럴에 대해 알아보고 더 나아가 구조분해 할당에 대해서도 조금 알아보도록 하겠다. 템플릿 리터럴 객체 리터럴 구조분해 할당 템플릿 리터럴은 ES6로 넘어오면서 도입된 새로운 문자열 표기법이다. ES6 이전에는 문자열 안에 변수를 사용해 값을 집어 넣고 싶은 경우 +연산자를 이용해 문자열과 변수를 연결해주었다. let name = "bitkunst" let aa = "안녕하세요 "+name+"입니다" console.log(aa) // output : 안녕하세요 bitkunst입니다. 하지만 ES6에서는 템플릿 리터럴을 사용하여 문자열 안에서 변수 호출이 가능해..