node.js 웹서버 프로젝트 실시간 데이터 dashboard 만들기 2(express 모듈)

web에서 사용하는 모듈

 

 http 모듈로 웹 서버를 생성하면 일을 직접 처리해야 하므로 기존에 서버 생성 개념에 익숙하지 않다면 어렵습니다. 이런 상황에서 http 모듈에 여러가지 기능을 추가해 여러 기능을 쉽게 사용할 수 있도록 만든 모듈을 express모듈이라 합니다  

 아래는 node.js 웹 개발에서 많이 사용하는 각각의 모듈에 대한 간단한 description입니다.

개념	설명
express 모듈	http 모듈처럼 사용할 수 있지만  더 많은 기능을 내장한 내부 모듈
미들웨어	expres  모듈 user() 메서드의 매개변수에 입력하는 함수를 의미
router	페이지 라우팅을 지원하는 미들웨어
static	지정한 폴더에 있는 내용을 모두 웹서버 루트 폴더에 올릴떄 사용
cookie patser	용청한 쿠키를 분석하여 추출
body parser	post 요청 데이터를 추출한다
connect-muliparty	인코딩 방식을 통해 post 데이터를 요청 및 추출
express-session	세션을 새로이 생성할 수 있도록 도와준다
RestFul 웹 서비스	일관된 웹 서비스 인터페이스 설계 기반의 rest 규정을 맞추어 만든 웹 서비스

 

page 라우팅 및 랜더링

 해당 프로젝트에서는 위 표에 해당되는 모듈들을 사용하여 페이지를 라우팅 및 렌더링을 합니다.

var express = require('express');
var bodyParser = require('body-parser')
var app = express();
var path = require('path');
var router = express.Router();
var mysql = require('mariadb');
var login_ok = require('./router/login_ok.js');
var RealTime_data = require('./data_api/RealTime_data.js')
var register_ok = require('./router/register_ok.js');
var Data_search = require('./data_api/Data_search.js');
var express = require('express');
var session = require('express-session');
var alarm = require('./data_api/RealTime_alarm.js')
app.use(session({
    secret: 'keyboard cat',
    resave: false,
    saveUninitialized: true,
  }));
 
app.use(bodyParser.urlencoded({extended: false})) //bodyparser를 등록해줘야 post 방식에서 데이터를 읽을 수 있음.
app.use(bodyParser.json());
 
app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, 'assets')));
app.set('views', path.join(__dirname, 'views'));
app.engine('html', require('ejs').renderFile);
 
 
app.get('/',function(req,res){
    res.render('login.html');
});
 
app.post('/login_ok',login_ok);
// app.post('/login_ok',Data_search);
app.post('/RealTime_alarm',alarm);
app.post('/RealTime_data',RealTime_data);
app.post('/register_ok',register_ok);
app.post('/Data_search',Data_search);
app.get('/register.ejs',function(req,res){
    res.render('register.ejs');
})
app.get('/table_day',function(req,res){
    res.render('table_day.ejs');
})
 
app.get('/table_month', function(req, res){
    res.render ('table_month.ejs')
});
app.get('/table_time', function(req, res){
    res.render ('table_time.ejs')
});
app.get('/table_year', function(req, res){
    res.render ('table_year.ejs')
});
 
app.get('/table_index', function(req, res){
 
   res.render("table_index.html")
});
app.get('/main', function (req, res) {
  res.render('main.ejs');
});
 
app.listen(3001, function () {
    console.log("client accept port 3001")
});
 

 

위 코드를 보면 app.js 파일 내애서 express 모듈을 추가 한다음 요청이 필요한 페이지에 대한 라우팅을 하고 이것에 대한 요청을 받아 각 localhost에서 쪼개지는 페이지를 구성하는 것을 볼 수 있습니다. 최종적으로 app.listen을 통해 서버를 구동시게 되며  해당 코드는 localhost:3001 포트에 서버를 구성했기 때문에 브라우저 주소창을 통해 해당 서버 연결을 확인 할 수 있습니다. 

위에 코드 에서 알 수 있듯이  기본 루트가 아래와 같이 login페이지로 랜더링이 되어 있는 것을 알 수 있습니다.

app.get('/',function(req,res){
    res.render('login.html');
});