GraphQL, 새로운 모델을 만들어 찜 기능 만들기
- 먼저 백엔드에 Like라는 새로운 모델을 생성하였다.
- Like는 게시물과 N:1, 그리고 Like와 유저도 N:1 관계를 가진다.
- 한 게시물은 많은 찜을 가질 수 있고, 특정 유저도 많은 찜 목록을 가질 수 있기 때문이다.
- 프론트엔드에서 '찜하기'를 누를 시, 백엔드에서는 해당 게시물과 누른 유저 각각의 id를 이용하여 연결하며 Like 모델에 새로운 테이블을 생성한다.
- 프론트엔드에서는 찜하기를 두 번 이상 누를 수 없기 때문에 이미 찜이 되어있는지를 확인해야 한다.
- 따라서 백엔드에서 게시물의 type Defs에 isLike 컬럼을 추가한다.
- 아래는 해당 type Def에 대한 resolver 내용이다.
- context 매개변수를 이용하여 로그인 한 유저를, 그리고 root 매개변수를 이용하여 일치하는 데이터를 찾아서 Boolean 값으로 반환한다.
- 이를 통해 프론트엔드에서는 처음 게시물 데이터를 받아올 때, isLike를 이용하여 사용자가 찜을 눌렀는지를 알 수 있게 된다. 따라서 데이터를 받아오게 되면 해당 값을 state에 갱신한다.
- 이 state 값에 따라 찜 버튼을 활성화 또는 비활성화 시킨다.
- 활성화되어있을시에는 deleteLike, 비활성화되어있을 시에는 addLike를 mutation 요청을 보내게 되는 것이다.
- 마지막으로 리스트에서는 해당 게시물의 likes의 length를 이용하여 좋아요 갯수를 나타낸다.
prisma에서 delete 시, unique한 컬럼으로만 삭제가 가능하기 때문에 발생했던 오류
- 테이블 삭제 시, unique한 컬럼으로만 테이블 삭제가 가능하다. 따라서 delete 대신 deleteMany로 대체하였다.
- 그리고 Like 모델에서 삭제되는 테이블의 조건은 context를 이용한 로그인한 유저의 id, 그리고 프론트엔드에서 보내진 게시물의 id를 모두 가진 테이블이다.