ejs layout 사용하기

성인석·2024년 9월 12일
0

layout 설치

모든 페이지에 공통적으로 들어갈수있는 디자인을 layout파일로 분리하여 만들고싶기때문에 layout.ejs 파일을 만들자

npm install express-ejs-layouts

layout 기본 설정

const layout = require('express-ejs-layouts');
app.use(layout);
app.set('layout', 'layout.ejs');


이런식으로 설정하고 다른 페이지들은 부분만 남기면 레이아웃이 적용된다.

그리고 css를 연결하여 레이아웃을 꾸며주었다.

어느정도 구도가 잡힌김에 중간점검을 해봤다.

character.ejs = 캐릭터정보가 들어가있는페이지(검색창을이용하여 닉네임을 검색하면 캐릭터 정보를알수있음)
layout.ejs = 모든 페이지에 들어가는 부분들을 모아둔 페이지(레이아웃)
main.ejs = 페이지에 접속하면 제일먼저나오는 화면(업데이트내용이나 기타기능들 넣을예정)
markets.ejs = 거래소페이지, 검색하면 원하는 데이터(가격정보)를 알수있음

다음번에는 거래소 페이지를 조금더 깔끔하게 다듬는작업을 할 예정이다

0개의 댓글