저번에는 임시 DB를 이용해 MVC 패턴을 적용해보았다. 오늘은 MySQL을 연동하여 Node.js로 서버를 구현하는 법에 대해 알아보자.
1. MySQL이란?
MySQL은 오픈소스 관계형 데이터베이스 관리 시스템이다. 데이터를 표(table) 형식으로 관리하고 SQL을 통해 데이터를 저장, 검색, 업데이트 삭제 (CRUD)를 할 수 있다.
2. MySQL 테이블 구축
먼저, MySQL를 통해 방문록을 저장할 테이블을 구축해줘야 한다.
나는 다음과 같은 visitor 테이브를 작성해주었다. 여기서는 id와 name, comment를 저장하고 관리한다.
CREATE TABLE visitor (
id INT PRIMARY KEY AUTO_INCREMENT,
name VARCHAR(10) NOT NULL,
comment MEDIUMTEXT
);
그리고 아래 명령어로 테이블이 잘 생성되었는지 확인해보자.
desc visitor;
마지막으로, 테이블에 데이터를 저장해준다.
INSERT INTO visitor(name, comment) VALUES ("홍길동", "내가 왔다");
INSERT INTO visitor VALUES (null, "이찬혁", "으라차차");
그러면 다음과 같이 데이터가 잘 저장된 것을 확인할 수 있다. 일단 저 데이터를 Node.js를 통해 프론트에 표시되도록 구현해 볼 예정이다.
SELECT * FROM visitor;
3. MySQL를 통해 Model 작성
MySQL의 데이터베이스에 접근하려면 보안이 중요하기 때문에 사용자 권한 부여가 필요하다. 따라서 grant를 이용해 권한을 부여해야 한다.
3-1. MySQL 권한 부여
-- MySQL 사용자 생성
CREATE USER '(사용자 이름)'@'%' IDENTIFIED BY '(비밀번호)';
-- 권한 부여
GRANT ALL PRIVILEGES ON *.* TO '(사용자 이름)'@'%' WITH GRANT OPTION;
-- 새로운 설정 적용
ALTER USER '(사용자 이름)'@'%' IDENTIFIED WITH mysql_native_password BY '(비밀번호)';
FLUSH PRIVILEGES;
-- 권한 확인
SELECT * FROM mysql.user;
show GRANTS for '(사용자 이름)'@'%';
이 명령어를 통해 원하는 사용자 이름에 모든 권한을 부여했다. 그리고 이제 Model에 MySQL을 연동해볼 것이다.
다음과 같이 먼저 MySQL 모듈을 가져온다.
const mysql = require("mysql");
그리고 데이터베이스 연결을 생성한다. 여기서 user, password, database는 각각 자신이 구축한데로 작성해주면 된다.
const conn = mysql.createConnection({
host: 'localhost',
user: '(사용자 이름)',
password: '(비밀번호)',
database: '(데이터베이스 이름)',
});
getVisitor 함수는 클라이언트가 데이터를 요청할 때 실행된다. visitor 테이블에서 데이터를 자겨오는 역할을 하는데 처음에는 약간 복잡해보일 수 있지만, 하나씩 살펴보면 어렵지 않다.
const mysql = require("mysql");
const conn = mysql.createConnection({
host: 'localhost',
user: '(사용자 이름)',
password: '(비밀번호)',
database: '(데이터베이스 이름)',
});
exports.getVisitors = cb => {
// DB 연결
conn.query('SELECT * FROM visitor', (err, rows) => {
if (err) {
throw err;
}
console.log('visitor 테이블 전체 조회', rows);
cb(rows);
});
};
- 콜백함수를 매개변수로 받음 : 사실 MySQL의 테이블에 접근하는 것 자체도 시간이 걸리는 일이다. 따라서 콜백함수를 통해 데이터를 조회한다.
- 쿼리 실행 : 데이터베이스에 SQL언어를 통해 쿼리를 실행한다. 그리고 그 결과를 rows에 저장한다.
- 오류 처리 : 만약 쿼리 실행 중에 오류가 발생하면, err에 오류 정보가 저장되고 throw err를 통해 프로그램을 종료한다.
- 결과 전달 : 만약 오류가 발생하지 않았다면 콜백함수 (cb)를 호출해 rows 데이터를 전달한다.
4. Controller
그리고 controller에서는 model에서 사용한 getVisitor함수를 통해 데이터를 view에 전달한다.
const Visitor = require("../model/Visitor");
// GET "/"
exports.main = (req, res) => {
res.render("index");
};
// GET "/visitors"
exports.visitor = (req, res) => {
// [DB 연결후]
Visitor.getVisitors((result)=>{
console.log("전체 목록 Cvisitor.js", result);
res.render("visitors", {data:result});
});
};
5. Router
이제 Router 코드를 다음과 같이 작성해준다. Router는 클라이언트 요청 경로와 Controller를 연결하는 역할을 한다.
const express = require("express");
const controller = require("../controller/Cvisitor");
const router = express.Router();
// GET "/"
router.get("/", controller.main);
// GET "/visitor"
router.get("/visitors", controller.visitor);
module.exports = router;
6. View
View에서는 Model의 데이터를 Controller에 의해 전달받게 된다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>방명록 페이지</title>
</head>
<body>
<h2>방명록 페이지</h2>
<form name="visitor-form">
<fieldset>
<legend>방명록 등록</legend>
<input type="text" name = "name" placeholder="사용자 이름" />
<br/>
<input type="text" name = "comment" placeholder="간단 방명록 작성" />
<br/>
<button type="button">방명록 등록</button>
</fieldset>
</form>
<br/>
<table border="1" cellspacing="0">
<thead>
<tr>
<th>ID</th>
<th>작성자</th>
<th>방명록</th>
<th>수정</th>
<th>삭제</th>
</tr>
</thead>
<!--
data : [
{id: 1, name: '홍길동', comment : "내가 왔다."},
{id : 2, name: '이찬혁', comment: "으라차차"},
]
-->
<tbody>
<%for (let i = 0 ; i < data.length ; i++) {%>
<tr>
<td><%=data[i].id%></td>
<td><%=data[i].name%></td>
<td><%=data[i].comment%></td>
<td><button>수정</button></td>
<td><button>삭제</button></td>
</tr>
<%}%>
</tbody>
</table>
</body>
</html>
7. 결론
오늘은 MySQL과 Node.js를 연동하고 데이터를 Read하는 법에 대해 알아보았다. 다음에는 Create, Read, Update, Delete에 공부해보기로!
'🙋♀️ Server' 카테고리의 다른 글
| [Server] sequelize를 이용한 중첩 조인 (0) | 2024.12.28 |
|---|---|
| [Server] Database 설계 & SQL 1452 문제 해결 (2) | 2024.12.17 |
| [Server] 임시 DB로 Node.js에서 MVC 패턴 연습하기 (0) | 2024.12.01 |
| [Web] let, var, const의 차이 (2) | 2024.11.09 |
| [Spring] 스프링 입문 - thymeleaf 동작 환경 과정 (0) | 2024.09.23 |