[실습]NodeJS + EXPRESS + MySQL 을 이용한 게시판 만들기 1(MVC)

NodeJS를 공부해 볼 겸 이것저것 찾아보다 이왕 한 번 만들어보자라는 생각이 들어 만들기 시작
NodeJS가 어떻게 흘러가는지 파악하는게 목적이고, 이미 설치되어 있는 MySQL을 이용해 볼 생각임
먼저 기본 뼈대를 만든 다음, 간단하게나마 뷰 페이지를 구성하고, 컨트롤러, 모델을 구성해 나갈 생각임
즉 MVC 형태로 구현을 할 예정인데 완벽한 MVC는 아니고 PHP에서 사용하던 방식을 그대로 이용해 공부할 예정임

기본 설정

프로젝트 생성

$ mkdir /d/Projects/node/Blog
$ cd /d/Projects/node/Blog/
$ express --view=pug backend
$ cd backend

디렉토리 구조 변경

$ mkdir -p app/controllers app/models app/config data
$ mv views/ app/
$ mv routes/ app/

전체 디렉토리

• 보기

    backend
    |---app
    |----|---config
    |----|---|---mysql.js
    |----|---controllers
    |----|---|---indexController.js
    |----|---|---usersController.js
    |----|---models
    |----|---routes
    |----|---|---index.js
    |----|---|---users.js
    |----|---views
    |----|---|---layout.pug
    |----|---|---index.pug
    |----|---|---error.pug
    |---bin
    |----|---www
    |---data
    |---node_modules (하위 생략)
    |---public
    |----|---images (하위 생략)
    |----|---javascripts (하위 생략)
    |----|---stylesheets (하위 생략)
    |- .env
    |- app.js
    |- package.json
    |- package-lock.json

필요한 모듈 설치

npm install --save mysql dotenv

소스 수정

• app.js

  require되는 경로중 routes 와 views 앞에 app/ 를 붙여준다.

    ...
    require('dotenv').config()
    ...
    var indexRouter = require('./app/routes/index');
    var usersRouter = require('./app/routes/users');
    ...
    app.set('views', path.join(__dirname, './app/views'));
    ...

• .env 파일에 mysql 정보 입력

    MYSQL_HOST="localhost"
    MYSQL_PORT="3306"
    MYSQL_DB="DB 이름"
    MYSQL_USER="사용자 이름"
    MYSQL_PASS="사용자 비밀번호"
    MYSQL_CHARSET="utf8mb4"

• app/config/mysql.js 파일 추가

  const mysql = require("mysql");
  
  // mysql 연결
  const mysqlConnection = {
    init: function () {
      return mysql.createConnection({
        host: process.env.MYSQL_HOST,
        port: process.env.MYSQL_PORT,
        user: process.env.MYSQL_USER,
        password: process.env.MYSQL_PASS,
        database: process.env.MYSQL_DB,
        charset: process.env.MYSQL_CHARSET // Emoji - utf8mb4
      });
    },
    open: function (conn) {
      conn.connect(function (err) {
        if (err) {
          console.error('MySQL connection failed.');
          console.error('Error Code : ' + err.code);
          console.error('Error Message : ' + err.message);
        } else {
          console.log('MySQL connection successful.');
        }
      });
    }
    ,
    close: function (conn) {
      conn.end(function (err) {
        if (err) {
          console.error('MySQL Terminate failed.');
          console.error('Error Code : ' + err.code);
          console.error('Error Message : ' + err.message);
        } else {
          console.log("MySQL Terminate connection.");
        }
      });
    }
  };
  
  module.exports = mysqlConnection;
  

DB 연결 테스트

• 라우터 파일에 테스트연결(app/routes/users.js)

    const express = require('express');
    const router = express.Router();
  
    // mysql 연결
    const mysqlConnObj = require('../config/mysql');
    const mysqlConn = mysqlConnObj.init();
    mysqlConnObj.open(mysqlConn); // 정상적으로 연결되었는지 확인
  
    /* GET users listing. */
    router.get('/', function(req, res, next) {
      res.send('respond with a resource');
    });
  
    /*
    post로 넘어온 값은 req.body 로 받을 수 있다.
    get 으로 넘어온 값은 req.query 로 받을 수 있다.
    */
    router.post('/signUp', function (req, res, next) {
      const user = {
        'userid': req.body.user.userid,
        'name': req.body.user.name,
        'password': req.body.user.password
      };
  
      // 값 이스케이프 처리
      let query = 'SELECT userid FROM users WHERE userid = ?';
      let bindParam = [
          user.userid
      ];
      mysqlConn.query(query, bindParam, function (err, results, fields) {
        if (err) throw err;
  
        if (results[0] === undefined) { // 동일한 아이디가 없을 경우
          //const salt = bcrypt.genSaltSync();
        } else {
  
        }
      });
    });
  
    module.exports = router;

서버 실행

$ npm install
...
$ set DEBUG=backend:*
$ npm start

컨트롤러 등록

routes 안의 파일들에서 컨트롤 할 수 있는 부분을 분리해준다.(참고1, 참고2)

• app/routes/index.js 를 아래처럼 수정

    const express = require('express');
    const router = express.Router();
    const indexController = require('../controllers/indexController'); // 추가

    /* GET home page. */
    router.get('/', indexController.indexPage); // 수정

    module.exports = router;

• app/controllers/indexController.js 추가

    exports.indexPage = (req, res, next) => {
        res.render('index', { title: 'Express' });
    };

서버를 재실행 후 제대로 접속되는지 테스트(http://localhost:3000)