티스토리 뷰

Study/NodeJS

[Node.js] Study. Hello World!

Hoon's Blog 2020. 2. 6. 18:34

혼자 학습하는 공간입니다. 다소 틀린 점이 있을 수 있습니다. 알려주시면 수정할께요.

 

EJS?

 

기본적으로 잘 알려진 템플릿 엔진은 ejs(Effective Javascript Templating)와 jade(또는 pug라 불림)가 있다.

ejs의 특징으로는 기본 html 문법을 그대로 사용한다.  (자세한 설명 : https://ejs.co/)

 

기본적인 문법은 다음과 같다.

<%=데이터 변수명%>

 

디렉터리 구조

 

ejs로 프로젝트를 생성한 경우 아래와 같은 디렉터리 구조를 갖는다.

 

디렉토리 구조

(1) 기본적인 라운팅 설정은 app.js에 설정한다.

 

(2) 하위 라우팅 정보는 routes 이하에 설정한다.

 

(3) view는 views 이하에 작성한다.

 

HelloWorld!

 

(1) View 작성 : views/helloWorld.ejs

<!DOCTYPE html>
<html>
<head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<h1><%= title %></h1>
<p>Hello World!!!</p>
</body>
</html>

view는 views 이하에 위치시킨다. 

 

(2) routing 정보 : /routes/helloWorld.js

var express = require('express');
var router = express.Router();

/* GET hellowWorld page. */
router.get('/', function(req, res, next) {
    res.render('helloWorld', { title: 'helloWorld!' });
});

module.exports = router;

(3) routing 설정 : app.js

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var helloWorld = require('./routes/helloWorld');


var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/users', usersRouter);
app.use('/hello', helloWorld);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

(4) 확인

 

http://localhost:8080/hello

 

 

Ref. http://expressjs.com/ko/guide/using-middleware.html

 

Express 미들웨어 사용

미들웨어 사용 Express는 자체적인 최소한의 기능을 갖춘 라우팅 및 미들웨어 웹 프레임워크이며, Express 애플리케이션은 기본적으로 일련의 미들웨어 함수 호출입니다. 미들웨어 함수는 요청 오브젝트(req), 응답 오브젝트 (res), 그리고 애플리케이션의 요청-응답 주기 중 그 다음의 미들웨어 함수 대한 액세스 권한을 갖는 함수입니다. 그 다음의 미들웨어 함수는 일반적으로 next라는 이름의 변수로 표시됩니다. 미들웨어 함수는 다음과 같은 태스크를

expressjs.com

 

< 용어에 익숙해지자 >

 

저작자표시 비영리 변경금지

'Study > NodeJS' 카테고리의 다른 글

[Node.js] Simple CRUD Project (with MongoDB)  (2) 2020.02.14
[Node.js] Mongo DB 사용  (2) 2020.02.11
[Node.js] 기본적인 MongoDB 연결과 확인  (4) 2020.02.07
[Node.js] 팁. Port 설정  (0) 2020.02.06
[Node.js] 환경 설정 및 실행  (1) 2020.02.06
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG more
«   2024/05   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함