23년 3월 20일
배운 것
오늘은 댓글 API 전반적으로 수정 및 추가적으로 보완 할 부분을 수정하였다. 그리고 팀원들과 함께 EC2를 이용해서 첫 배포를 시도하였다.
시도 한 것
오늘 아침에 주말에 구현 했던 부분까지 모두 다 수정하여서 깃에다 커밋하였고 드디어 main 레퍼리토리에 머지를 함으로써 지금까지 나를 포함해서 팀원들이 한 코드들 모두 합치는 작업을 하였다. 팀원 한분이 cors 설정까지 마무리 하였고 그리고 나서 EC2 ubuntu로 첫 배포를 하였다. 하지만 배포를 오래전에 했어서 대부분 기억을 까먹었었고 그로 인해 예전 입문주차때 배웠던 강의 노트를 참고하였다.
다만 그 당시에는 NoSQL로 구현을 했었기 때문에, MySQL로 구현하는 방법은 몰라서 다음과 같은 블로그를 참고하여서 겨우 연동하였다.
RDS 연동하기 참고자료1
RDS 연동하기 참고자료2
아직 처음 하는 부분이라 지금도 완벽하게 정리는 하지는 못했지만, 팀원 한분이 배포작업을 하였고, 우리는 어떻게 하는지 방법을 알려주어서 라이브 코딩 하는 방식으로 진행하였다.
그렇게 RDS 데이터베이스로도 연동을 하였고, git에 있던 레포지토리 주소를 복사하여서 클론을 하였다. 그렇게 처음으로 첫 배포를 마무리 하였다.
하지만 프론트앤드에서 cors가 안 불러지는 오류가 계속 났었다. 처음에는 형식이 틀렸나 생각했었지만 나중에 보니까 호이스팅 문제였다는 것을 알게 되었다.
const express = require('express')
const cors = require('cors')
require('dotenv').config()
const cookieParser = require('cookie-parser')
const morgan = require('morgan')
const app = express()
const port = 3000
const globalRouter = require('./routes')
app.use(
cors({
origin: '*',
credentials: true,
optionsSuccessStatus: 200,
})
)
app.use(express.json())
app.use(cookieParser())
app.use(morgan('dev'))
// 정적 파일로 제공하기 위한 미들웨어
// 클라이언트에서 요청할때 브라우저에서 직접 접근 가능해짐.
app.use(express.static('public'))
app.use('/api', globalRouter)
app.listen(port, () => {
console.log(`listening at http://localhost:${port}`)
})바로 저 const cors = require('cors')코드를 const globalRouter = require('./routes')보다 아래에다 적으면서 호이스팅 문제를 일으켜서 cors가 전혀 안불려졌던 것이였다. 그래서 이것을 수정해서 마침내 수정을 하였다.
이 다음에는 내가 코드 중에서 몇몇 수정 할 부분이 있어서 API를 수정하였다.
공통적으로 오늘 오후에 댓글 작성 API와 댓글 삭제 API에 게시글이 없을때 게시글이 조회하지 않습니다가 떠야 하는데 예외처리가 잘 안되어서 catch문으로 빠지는 것이였다.
원인을 알아보니까 where 조건을 넣지 않아서 발생했던 부분이였다. 그래서 다음과 같이 수정하였다.
// 게시글 존재 확인
const post = await Posts.findOne({
where: { postId: postId }
});
// 게시글 미존재
if (!post) {
res.status(404).json({
errorMessage: "게시글이 존재하지 않습니다"
});
return;
}게시글 존재 확인 아래 코드를 빼 먹어서 아예 적용이 안되었던 것이였고 post 변수를 선언해서 postId 조건문으로 생성하면 되었다. 이걸 댓글 작성 API와 댓글 삭제 API를 수정하였다.
그리고 다른 하나는 프론트앤드 분이 시간이 조금 깔끔하게 나오게 해달라는 부탁을 받았었다. 나타내는 방식을 createdAt을 "2023-03-20 03:19:16"형식 으로 나오게 해달라는 것이였다. 그래서 이 부분도 잘 몰라서 구글링과 chatGPT를 겨우 도움을 받아서 2시간만에 해결을 하였다.
// Comments와 Users 테이블을 참조하여 comments 변수에 저장
// createdAt을 "2023-03-20 03:19:16"형식으로 변경, 한국시간대로 변경(9시간 후)
const comments = await Comments.findAll({
attributes: [
"commentId",
"userId",
"comment",
// createdAt 컬럼을 date_format 함수로 변경하여 KST 시간대로 변환하여 조회
// as 키워드를 사용하여 변경된 컬럼 이름을 createdAt으로 설정함.
[Sequelize.fn('date_format', Sequelize.fn('convert_tz', Sequelize.col('Comments.createdAt'), '+00:00', '+09:00'), '%Y-%m-%d %H:%i:%s'), 'createdAt'],
"User.nickname",
],
include: [
{
model: Users,
attributes: [],
},
],
where : [{ postId: postId }],
order: [['createdAt', 'DESC']],
raw: true, // JSON 형태로 반환된 데이터를 처리
})방법은 의외였는데 sequelize.fn문을 통해서 %Y-%m-%d %H:%i:%s'를 사용하면 되었다. 그리고 동시에 현재 데이터베이스에 시간이 9시간 더 느린 시간으로 떠서 시간도 '+00:00', '+09:00'로 바꿔주면 되었다.
그리고 마지막으로 맨위에 모델 참조코드를 다음과 같이 바꾸면 되었다.
const { Posts, Comments, Users, Sequelize } = require("../models");이렇게 해서 오늘 내가 수정한 코드는 마무리 되었고 오늘 밤에 기술매니저님한테 중간 점검을 받은것으로 마무리 하였다. 동시에 프론트앤드 기술매니저님도 운 좋게 듣게 되었는데 확실히 헙업이 중요하다는 것을 알게 되었고, 무엇보다도 계속되서 의논을 해야 된다는 것을 알게 되었다.
해결
오늘 처음 배포를 해서 프론트앤드에게 전달하였고, 게시글 API를 수정을 하였다.
알게 된 점
토요일에 확실히 끝났다고 생각했었지만, 프론트앤드분들한테 데이터 저장 형식을 바꿔달라는 부탁을 받아서 적용해서, 확실히 협업을 한다는 느낌을 받았었다. 나는 게시글 API 담당을 맡았지만, 한분은 multer 패키지를 받아서 게시글 사진을 저장하는 작업, 그리고 다른 한분은 bcrypt을 이용해서 비밀번호를 못보게 변조하는 방식등 새로운 방법을 사용하였다. 하지만 나는 시간 설정만 바꾸는것만 새로 적용해서 확실히 다른 분들들에 비해서 아직 미숙한게 많았지만, 그래도 sequelize.fn문을 통해서 %Y-%m-%d %H:%i:%s'을 나타내는것이랑 시간 설정을 한국 시간으로 바꾸는 방법을 터득을 해서 새로운 것을 알게 되었다. 다른분들은 잘 하고 있는데 나만 잘 못하고 있는거 아닐까 계속 걱정하고 있었지만 그래도 잘 풀려서 다행인 것 같았다.
앞으로 할 일
이제 백엔드쪽에서 API 작업은 거의다 마무리 되어서 계속해서 프론트앤드분들이 에러처리 이상 있으면 그부분 수정하는 작업을 계속해서 협업을 할 것 같다.
