pre-project 10일차 (22.08.31. 답변 작성, 수정 기능 구현)

✅ 오늘한 일

답변 작성 기능 구현

답변을 작성할 경우 title을 뺴고 내용만을 작성하여 데이터를 서버로 전달하고 해당 데이터를 바로 받아와서 작성된 답변이 실시간으로 보이도록 했다. 작업을 하던중 실시간으로 보여주려 했으나 새로고침을 해야 볼 수 있었다. 이것은 windows.location.reload()를 사용하여 새로고침을 하여 해결했다.

질문 작성 기능 구현

답변 수정 페이지 구현

답변 수정하기 페이지의 로직도 질문 수정하기 로직이랑 똑같은 형식으로 진행된다. 그리고 두 개의 컴포넌트를 처음에 하나로 사용했었는데 질문하기에는 title이 존재하고, 답변 수정 페이지에는 title이 존재하지 않아서 삼항연산자를 사용해 하나의 컴포넌트로 사용하려 했지만 아직 실력이 부족했던 것 같다. 다음에는 조금 더 컴포넌트를 재사용할 수 있도록 작성해봐야겠다.

질문 수정 페이지 구현 글: https://homile.tistory.com/170 

답변 수정 페이지

백엔드 서버와 통신

백엔드 서버와 통신을 해보았다. 서버와 통신을 하기전 axios를 사용하여 서버에 요청하느 코드를 작성해 두어야 했기에 JSON 서버를 사용하여 통신을 했었다. 이제 백엔드분들이 서버를 구현하셨다고 하여 우리 코드를 하드코딩하여 통신이 되는지 여부를 확인했고, 회원가입, 질문작성, 질문수정 기능에 대한 통신 테스트를 했다.

테스트를 하던 중 CORS 오류가 있어서 프로트쪽에서 package.json 파일에 Proxy 설정을 해주고 백엔드분들이 CORS 에러를 잡아주어 원활한 테스트를 할 수 있었고 요청에 따른 응답값이 잘 넘언오는 것을 확인했다.

JSON 서버 데이터를 구성할 때 API 명세서와 조금 다르게 작성이 되어 이부분을 고치는 수정 작업이 필요해졌다... 메인 프로젝트때는 처음부터 API 명세서에 맞춰서 JSON 서버 데이터를 구성해 봐야겠다.

📌 해야할 일

• 로그아웃 드롭다운 메뉴 틀 구현
• 로그아웃 기능 구현
• API 명세서에 맞춰서 코드 변경하기
• 로그인 유지