nunjucks 템플릿 연결하기

app.js에서 정적파일 연결하기

const __dirname = path.resolve();
app.set("views", path.join(__dirname, "views"));
app.set("view engine", "html");

views는 템플릿 파일들이 위치한 폴더를 지정한다. 

혹은 절대경로를 넣어주면 되는데, 그렇게 하면 소스코드가 유출되었을때 우리 서버의 구조를 알려주게 되니까 비추천.

view engine은 어떠한 종류의 템플릿 엔진을 사용할지를 나타내는데, nunjucks는 html로 표기해도 된다.

굳이 구분하고 싶다면 njk로 한다. 

 

 

import express from "express";

const router = express.Router();

router.get("/", (req, res) => {
  res.render("index", {
    name: "안지영",
  });
});

export default router;

res객체의 render 함수를 이용하여 표시할 html파일과 데이터를 보낸다. 

render 함수의 첫번째 인자는 위에서 지정한 views에 지정한 경로의 index.html를 찾는다. 

데이터는 저렇게 json 형식으로 보내준다. 

 

 

    <h1>나는야 케쳡될거야</h1>
    <h2>{{ name }}</h2>