[개발][nodejs] express + pug 로 홈페이지 뚝딱 만들기 1

wonsama(71)

Published in

#zzan

Words

194

Reading

1 min

Listen

Play

개요

express + pug 를 이용하여 동적 웹을 만들어 보는 과정을 기록으로 남겨 봅니다.

1일차 : hello world 화면에 출력하기

결과물

우리의 친구 hello world 를 화면에 똭 !

설치

기본적으로 nodejs 는 설치 되어 있다고 가정하고 작업을 진행 합니다.

mkdir web - 프로젝트폴더명 ( 맘에 드는 것으로 만들어도 됨 )
cd web - 해당 폴더로 들어가서
npm init - 그냥 엔터 연타
npm install express - 웹 엔진
npm install pug - 템플릿 엔진

관련 소스

기본 구성을 위한 소스가 좀 포함되어 있어 그렇지 실상 핵심 소스는 별 것 없습니다.

간략설명

require - 필요 라이브러리를 로드할 때 사용
init - 웹 엔진을 초기화
load view engine - 화면 표시용 템플릿 엔진(pug)을 웹엔진(express)에 설정
home route - 루트 / 로 접근한 경우 라우팅(화면 전환)할 정보를 설정, /로 접속하면 응답(res)에 hello world 라는 값을 전송(send) 하라 라는 구문
start server - 3000 번 포트로 수신대기(listen) 한다. 웹 브라우저 등에서 요청(request)이 들어오면 수신대기(listen) 하고 있고 있다가 수신 받은 정보를 기반으로(경로, 데이터 등) 라우팅하여 화면을 그려주겠다는 이야기.

const express = require('express');
const path = require('path');

// init
const app = express();

// load view engine
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

// home route
app.get('/', function(req,res){
    res.send('hello world');
});

// start server
app.listen(3000, function(){
    console.log('server is started with port 3000.');
})