https://soohyun6879.tistory.com/163
이전 포스팅에서 모델과 관계 정의까지 완료했습니다! 이번 포스팅에서 사용자 등록, 댓글 쓰기 등 쿼리 수행을 해보겠습니다
1. 시퀄라이즈 쿼리 알아보기
쿼리 수행을 하기 전에 시퀄라이즈에서 쿼리를 어떻게 사용하는지 알아야 합니다! 다음 예시를 보면 간단한 CRUD 쿼리를 알 수 있습니다.
// SELECT
// SELECT * FROM nodejs.users;
User.findAll({});
// SELECT name, age FROM nodejs.users WHERE married = 1;
User.findAll({
attributes: ['name', 'age'],
where: {
married: true
},
});
// INSERT
// INSERT INTO nodejs.users (name, age, married, comment) VALUES ('zero', 24, 0, '자기소개1');
User.create({
name: 'zero',
age: 24,
married: false,
comment: '자기소개1',
});
// UPDATE
// UPDATE nodejs.users SET comment = '바꿀내용' WHERE id = 2;
User.update({
comment: '바꿀내용',
}, {
where: { id: 2 },
});
// DELETE
// DELETE FROM nodejs.users WHERE id = 2;
User.destroy({
where: { id: 2 },
});
2. 쿼리 수행하기
프론트엔드 코드는 파일로 첨부하겠습니다! 서버 코드가 중요한 것이므로 프론트엔드쪽 코드는 다루지 않겠습니다
views 폴더에 sequelize.html, error.html 을 생성하고, public 폴더에 sequelize.js 를 생성하면 됩니다.
서버쪽을 쿼리 수행 부분을 살펴보겠습니다. routes 폴더에 index.js, users.js, comments.js 파일을 만듭니다.
// routes/index.js
const express = require('express');
const User = require('../models/user');
const router = express.Router();
// http://localhost:3000/ 접속
router.get('/', async (req, res, next) => {
try {
const users = await User.findAll(); // 모든 사용자 조회
res.render('sequelize', { users });
} catch (err) {
console.error(err);
next(err);
}
});
module.exports = router;
이 라우터는 GET / 로 접속했을 때의 라우터입니다. User.findAll 메서드로 모든 사용자를 찾은 후 sequelize.html을 렌더링할 때 users를 넣습니다. 시퀄라이즈는 기본적으로 프로미스를 지원하므로 async/await 와 try/catch로 성공 시와 실패 시의 정보를 얻을 수 있습니다.
// routes/users.js
const express = require('express');
const User = require('../models/user');
const Comment = require('../models/comment');
const router = express.Router();
// http://localhost:3000/users/ 접속
router.route('/')
.get(async (req, res, next) => {
try {
const users = await User.findAll(); // 모든 사용자 조회
res.json(users);
} catch (err) {
console.error(err);
next(err);
}
})
.post(async (req, res, next) => {
try {
const user = await User.create({ // 사용자 등록
name: req.body.name,
age: req.body.age,
married: req.body.married,
});
console.log(user);
res.status(201).json(user);
} catch (err) {
console.error(err);
next(err);
}
});
// http://localhost:3000/users/id값/comments 접속
router.get('/:id/comments', async (req, res, next) => {
try {
const comments = await Comment.findAll({ // 사용자의 모든 댓글 조회
include: {
model: User,
where: { id: req.params.id },
},
});
console.log(comments);
res.json(comments);
} catch (err) {
console.error(err);
next(err);
}
});
module.exports = router;
먼저 GET /users 와 POST /users 로 접속했을 때 라우터입니다. GET 방식일 때는 사용자를 조회하는 요청을 수행하고, POST 방식일 때는 사용자를 등록하는 요청을 수행합니다.
GET /users/:id/comments 로 접속했을 때 라우터입니다. 사용자의 댓글을 조회하는 요청을 수행합니다. include 옵션에서 model 속성에 User 모델을 넣어주고, where 속성에 :id로 받은 아이디 값을 넣어주었습니다.
:id 의 의미가 궁금하다면 다음 링크의 "라우트 매개변수" 부분을 참고해주세요!
https://soohyun6879.tistory.com/159
// routes/comments.js
const express = require('express');
const { User, Comment } = require('../models');
const router = express.Router();
// http://localhost:3000/comments/ 접속
router.post('/', async (req, res, next) => {
try {
const comment = await Comment.create({ // 댓글 등록
commenter: req.body.id,
comment: req.body.comment,
});
console.log(comment);
res.status(201).json(comment);
} catch (err) {
console.error(err);
next(err);
}
});
// http://localhost:3000/comments/id값/ 접속
router.route('/:id')
.patch(async (req, res, next) => {
try {
const result = await Comment.update({ // 댓글 수정
comment: req.body.comment,
}, {
where: { id: req.params.id },
});
res.json(result);
} catch (err) {
console.error(err);
next(err);
}
})
.delete(async (req, res, next) => {
try {
const result = await Comment.destroy({ where: { id: req.params.id } }); // 댓글 삭제
res.json(result);
} catch (err) {
console.error(err);
next(err);
}
});
module.exports = router;
이 라우터는 댓글 관련 CRUD 작업을 하는 라우터입니다. POST /comments 라우터는 댓글을 등록하는 라우터입니다. commenter 속성에 사용자 아이디를 넣어 사용자와 댓글을 연결합니다. PATCH /comments/:id 는 댓글을 수정하는 라우터이고, DELETE /comments/:id 는 댓글을 삭제하는 라우터입니다.
마지막으로 app.js 에서 라우터를 가져와서 라우터를 연결해주면 됩니다!
// app.js
const express = require('express');
const path = require('path');
const morgan = require('morgan');
const nunjucks = require('nunjucks');
const { sequelize } = require('./models');
// 라우터 가져오기
const indexRouter = require('./routes/index');
const usersRouter = require('./routes/users');
const commentsRouter = require('./routes/comments');
const app = express();
app.set('port', process.env.PORT || 3000);
app.set('view engine', 'html');
nunjucks.configure('views', {
express: app,
watch: true,
});
sequelize.sync({ force: false })
.then(() => {
console.log('데이터베이스 연결 성공');
})
.catch((err) => {
console.error(err);
});
app.use(morgan('dev'));
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
// 라우터 연결하기
app.use('/', indexRouter);
app.use('/users', usersRouter);
app.use('/comments', commentsRouter);
app.use((req, res, next) => {
const error = new Error(`${req.method} ${req.url} 라우터가 없습니다.`);
error.status = 404;
next(error);
});
app.use((err, req, res, next) => {
res.locals.message = err.message;
res.locals.error = process.env.NODE_ENV !== 'production' ? err : {};
res.status(err.status || 500);
res.render('error');
});
app.listen(app.get('port'), () => {
console.log(app.get('port'), '번 포트에서 대기 중');
});
모든 코드가 완성된 후 npm start 를 하고 웹페이지에 접속하면 다음과 같은 화면을 볼 수 있습니다!
'Back-end > Node.js' 카테고리의 다른 글
[Node.js+MongoDB] 몽구스 (2) (Mongoose) (0) | 2021.07.23 |
---|---|
[Node.js+MongoDB] 몽구스 (1) (Mongoose) (0) | 2021.07.20 |
[Node.js+MYSQL] 시퀄라이즈 (2) (Sequelize) (0) | 2021.07.18 |
[Node.js +MYSQL] 시퀄라이즈 (1) (Sequelize) (0) | 2021.07.18 |
[Node.js] 템플릿 엔진 사용하기 (Pug, Nunjucks) (0) | 2021.07.16 |