[포스코x코딩온] 웹개발자 풀스택 과정 4주차 | express모듈

Express 모듈

Express

• 웹 서버를 생성하는 것과 관련된 기능을 담당하는 프레임워크
• 웹 애플리케이션을 만들기 위한 각종 메소드와 미들웨어 등이 내장되어 있다.
• http 모듈 이용 시 코드의 가독성↓ 확장성↓
  → 이를 해결하기 위해 만들어진 것이 Express 프레임워크

const express = require('express');
const app = express();
const PORT = 8000;

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

app.listen(PORT, function(){
  console.log('Listening on port ${PORT}! http://localhost:${PORT}');
});

const express = require('express');
// require : nodeJs에서 다른 패키지를 불러올 때 사용되는 키워드

const app = express();
// app이라는 변수에 express 함수를 저장

const PORT = 8000;
// PORT 변수에 8000 저장

app.get('/', function(응답,요청){
  응답.send('메세지');
});

app.listen(서버를 오픈할 포트번호, 
           function(){서버 오픈시 실행할 코드})

템플릿 엔진

EJS 템플릿

• 템플릿 엔진
  • 문법과 설정에 따라 파일을 html 형식으로 변환시키는 모듈
• ejs
  • Embedded Javascript의 약자로, 자바스크립트가 내장되어 있는 html 파일, 확장자는 .ejs

app.set('view engine', 'ejs');
app.set('views', './views');
app.use( express.static('폴더이름'))

index.js가 들어있는 위치에 views 폴더를 만들고
views 폴더에 ejs파일을 집어 넣는다.

app.get('/도메인이름', function(응답,요청){
  res.render('ejs파일이름');

EJS 문법

<% %> : 무조건 자바스크립트 코드가 들어가야 하고, 줄바꿈을 할 경우에는 새로운 <% %>를 이용해야 한다.

<%= %> : 값을 템플릿에 출력할 때 사용

<%- include('view의 상대주소') %> : 다른 view 파일을 불러올 때 사용

미들웨어

• 요청이 들어옴에 따라 응답까지의 중간과정을 함수로 분리한 것
• 서버와 클라이언트를 이어주는 중간 작업
• use()를 이용해 등록할 수 있다.

미들웨어 - static

• 이미지, css파일 및 Javascript 파일(front)과 같은 정적파일 제공
• Express에 있는 static 메소드를 이용해 미들웨어로 로드
• 등록방법

  app.use('/static', express.static('/static'));