Final project (Day12)

dorazi·2021년 3월 5일
0

파이널 프로젝트

목록 보기
12/19
post-thumbnail

오늘 한일

유저검색 후 없으면 추가

어제 쿼리문으로 userAdd를 서버로 날려서 데이터가 정상적으로 들어가는 것을 확인했다.
위와 같은 로직만 적는다면 이미 있는 유저도 로그인 시 추가되는 경우가 있기 때문에 로그인 시 해당 유저의 이메일로 userGet을 한번 보낸 뒤 데이터베이스에 유저가 없다면 추가하고 추가한 id 값을 가져오고 만약 있다면 존재하는 id 값을 가져오는 로직을 짰다.

그 결과 내가 생각하고 짠 로직대로 없을 경우에만 데이터베이스에 추가되는 것을 확인했다.

그룹 생성

유저가 제대로 들어가고 id 값을 가져오는 것을 확인했으니 다음은 그룹 생성이라 생각해서 그룹 생성 로직을 짰다. 그룹 생성의 경우

mutation {
    meetAdd(Meet:{
      meetName: "테스트용"
      totalcost: 10000
    }){
      id
    }
  }

위와 같이 쿼리문을 보내 그룹을 생성할 수 있었다.
그룹만 생성하면 join이 안 되기 때문에 join 테이블에도 유저의 id 값과 방금 생성하고 응답받은 그룹의 id 값을 restApi로 서버로 보내줘야 했다.
이 부분은 왜 restApi를 통해 전송하냐면 백 앤드에서 사용하는 graphQL-sequelize 라이브러리가 join 테이블을 인지 못해서 그렇다 아마 join 테이블을 sequelize를 통해 만든 것이 아니어서 그런가 확실한 이유는 아직 모르겠다.

그룹 생성의 경우 유저는 4개 이상의 그룹을 생성할 수 없는데 이에 대한 검사는 애초에 컴포넌트에서 로그인한 유저가 그룹이 4개일 경우 추가 버튼을 안 보여주게 로직을 짰기 때문에 따로 처리는 필요 없었다.

그룹정보와 그룹에 가입한 유저 정보 가져오기

그룹정보와 그룹에 가입한 유저의 정보의 경우 위에서 join 테이블로 서로 연결을 시켜줬기 때문에 쉽게 가져올 수 있었다.

query {
 userGet(where:{id : 1}){
  id
  Meets{
    id
    meetName
    totalcost
    Users{
      id
      img
      email
    }
  }
}
}

위와 같이 쿼리문에 로그인한 유저의 id를 실어서 보내면

{
  "data": {
    "userGet": [
      {
        "id": 1,
        "Meets": [
          {
            "id": 6,
            "meetName": "그룹 테스트 1",
            "totalcost": 10000,
            "Users": [
              {
                "id": 1,
                "img": "undefined",
                "email": "kbsik05@naver.com"
              },
              {
                "id": 2,
                "img": "이미지URL",
                "email": "qlaks1436@naver.com"
              }
            ]
          },
          {
            "id": 7,
            "meetName": "그룹 테스트 2",
            "totalcost": 100000,
            "Users": [
              {
                "id": 1,
                "img": "undefined",
                "email": "kbsik05@naver.com"
              },
              {
                "id": 2,
                "img": "이미지URL",
                "email": "qlaks1436@naver.com"
              }
            ]
          }
        ]
      }
    ]
  }
}

위와 같이 해당 유저가 가입한 그룹과 그 그룹에 가입된 유저의 정보를 한 번에 가져올 수 있었다.
이 요청의 경우 유저가 로그인을 할 때와 그룹 생성할 때 중간에 들어간다.

마지막

오늘 예상보다 많은 작업을 한 것 같아 뿌듯하다. 본격적으로 사가를 사용하기 시작했고 아직 사가의 많은 기능을 사용하진 못하지만 그래도 Thunk를 사용할때보단 유연하게 사용 할 수 있게된거 같다.
위의 작업은 전부 사가를 이용해서 작업했으며 서버 요청이 필요한 경우 모두 사가에서 처리할 예정이다.

진짜 마지막

옛날 같았으면 애먹었을 만한 것들도 요즘은 조금만 생각해도 해결법을 찾을 수 있는 것 같다. 걱정과 달리 요즘 내가 달라지고 있다는 것을 느껴서 매우 만족스럽다.

profile
프론트엔드 개발자

0개의 댓글