Express에 Bootstrap 적용하기
2016. 4. 1. 15:57ㆍIT관련
반응형
웹서버에 적용할 CSS style을 고민하다가 결국은 Bootstrap을 사용하기로 결정하였다.
먼저 Bootstrap을 다운로드를 받아야 한다.
다운로드 --> http://bootstrapk.com/getting-started/#download
다운로드를 받아 압축을 해제하면 아래와 같은 디렉토리와 파일 구조를 확인할 수 있다.
이 압축해제한 것들을 Express 어플리케이션의 public 디렉토리에 그대로 복사를 하고 사용하고자 하는 템플릿 엔진에 적용하면 된다.
나는 Express-handlebars를 템플릿 엔진으로 사용하고 있기 때문에 DefaultLayout의 파일에 아래와 같이 적용하였다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Example App</title>
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="/css/bootstrap.min.css">
<!-- 부가적인 테마 -->
<link rel="stylesheet" href="/css/bootstrap-theme.min.css">
<!-- 합쳐지고 최소화된 최신 자바스크립트 -->
<script src="/js/bootstrap.min.js"></script>
</head>
<body>
{{{body}}}
</body>
</html>
반응형
'IT관련' 카테고리의 다른 글
ASUS 공유기 RT-AC68P 2.4GHz 먹통 현상 해결 (2) | 2016.04.13 |
---|---|
Evoluent Vertical Mouse 드라이버 (25) | 2016.04.06 |
nodemon (0) | 2016.03.28 |
Express을 이용한 웹페이지 생성 (0) | 2016.03.28 |
npm와 종속성(dependency) (0) | 2016.03.25 |