협업 시 API와 리덕스에 대해

협업다운 협업은 이번에 처음인 것 같다. 느낀점과 배운점, 궁금한점을 남긴다.

백엔드 분들과 협업을 하면서 느끼는 점은 진짜 API가 전부 라는것! 한번 API를 결정하고 나면 각자 기능을 완성할때까지 열심히 하면된다.

동시에 api를 바꿔야하는경우, 서로 업무가 늘어날 수 있기 때문에 아주 신중해야 한다는 것!

잘 만들어두면 편하게 할 수 있다. 왼쪽사진은 메인화면에서 받아오는 게시물 데이터이고, 오른쪽은 게시물 상세페이지에서 받아오는 상세게시물 데이터이다. 만약 최상위 컴포넌트 app.js에서 useEffect로 post데이터를 가져올때, post_content까지 받아왔으면 api가 하나 줄지 않았을까? 최상위컴포넌트에서 받은 데이터로 언제든 useSelector 훅을 이용해서 데이터를 가져오면되니까.. 라고 생각했는데

실제 서비스라면 게시물 갯수가 늘어날텐데 이렇게 최상위 컴포넌트에 데이터를 넣어두고 계속 물고다니는게 맞는지? 

아니면 차라리 api를 하나 더 만들더라도, 무겁게 물고다니는 데이터를 줄여주는게 맞는지가 궁금하다.

=>질문해보니 api를 하나 더 만들어서 수많은 데이터를 filter돌지 않게 해주는게 좋을 것 같다는 피드백

미들웨어에서 비동기 처리후 홈화면("/")에서는 GETPOST액션을 실행하고 게시물상세페이지("/detail/:postId")에서는 GETDETAILPOST액션을 실행한다. 홈화면에서는 모든 게시물 데이터를 받아오고, 상세페이지로 가면 해당하는 게시물 데이터만 받아온다. 그래서 action에 post_list 와 post라는 변수의 차이를 주었다.

그리고 각 컴포넌트에서 useEffect를 써서 매번 화면이 렌더링되면 두 액션을 실행한다. 

근데 홈->상세->홈으로 돌아오면 아래와같은 에러가 나왔다. 콘솔을찍어가며 확인해보니 홈의 useEffect가 실행되지 않는다는 점을 파악하고 강제로라도 렌더링을 시키기 위해 여러 방법을 사용해봤지만 렌더링이 안되었다!

혹시 홈->상세->홈 의 과정에서 변화하는게 뭐가있지.. mock API썻으니까 비동기처리는 빼고.. 아무리 봐도 리덕스문제인데.. 재렌더링이 안된다면 혹시 리듀서에서 뭔가를 잘못했나? 수정전을 보면 액션 두개 다 draft.list에 덮어씌우고 있는데, 이 부분에서 상태가 변화하는걸 인식하지 못하는걸까? 하여 key를 수정했더니 정상 작동했다. list 안에 내용물은 바뀌었는데...왜 상태가 바뀐걸 모르는거지..?

간단하다고 생각했는데 너무 어렵다 리덕스 ㅠㅠ