[최종 프로젝트] 7주차: 프론트 디테일 구현, 멘토링 (250901)

해피해피슈크림·2025년 9월 1일

주요 기능들은 개발이 어느정도 다 되었기에, 개발을 마무리하며 프론트 디테일을 만졌다.

1. 채팅 화면 '신고하기' 버튼

  • 프론트: 채팅 화면 '신고하기' 버튼 누르면 신고 사유 선택 및 상세 입력 할 수 있는 팝업 띄우기 >> 구현 완료
  • 백엔드: '신고하기' 버튼 누르면 (1) chat_history(대화 내역) 테이블의 report(대화 신고 여부)를 'Y'로 바꾸고, (2) 신고된 LLM 응답에 대한 정보를 chat_report(대화 신고 내역) 테이블에 넣기 >> (1)은 구현했지만, (2)는 구현하지 못함. 범석오빠에게 넘김. 403 에러가 토큰 인증 방식 때문에 그런 거였다. 저번에 회원 목록 조회 때랑 비슷한 이유로 난 오류였고, 범석 오빠가 해결해주었다.

2. 채팅 신고 내역 사이드바 수정

  • 스크롤 내리면 사이드바가 끊기는 오점이 있길래 수정했다.

3. 관리자 화면: 검색 영역 고정 + 표 페이지네이션 구현

  • 세 가지 수정사항을 고려했다. 먼저 검색 영역을 상단에 고정하기. 기존에는 스크롤을 내리면 검색 영역 까지 내려갔는데, 검색 영역이 상단에 있는 게 깔끔할 듯 했다. 두번째는 표에서 '사용자 질문'과 'LLM 응답' 같이 길게 출력되는 텍스트를 30자만 표시하고 더보기 처리하기. 텍스트 전문을 다 출력하면 표가 그만큼 세로로 길어졌기 때문에 스크롤이 불가피했다. 목표는 스크롤을 없애는 것이다. 마지막은, 이전에 텍스트를 더보기 처리 했으니, 채팅 신고 내역 표의 행을 누르면 팝업창을 열려 자세한 정보를 볼 수 있게 하는 것이다.
  • 구현하면서 표가 화면에 꽉 채워지니 좁고 답답한 느낌이 들었는데, 범석 오빠가 데이터를 표 형태에서 카드 형태로 나타나게끔 구현했더니 시각적으로 훨씬 더 깔끔하고 보기 좋았다. 더 좋은 아이디어였던 범석 오빠 코드로 진행하기로 했다. 내 코드가 discard 된 것이 마냥 웃을 수만은 없는 일이다만, 카드 형태로 신고 내역 데이터를 표현한 것은 정말 좋은 아이디어였다.

4. 내일 미션: 계정 활성화 버튼 구현

  1. 계정 활성화 컬럼에 드롭다운
  2. '변경 사항 저장' 버튼을 누르면 DB와 프론트에 계정 활성화 여부 변경 사항 반영
  3. 중요: DB, 프론트 변경 후 반드시 리로드 할 것!

(???: 수민이 내일 저녁까지 다 못하면, 제육볶음에 공깃밥 네 그릇이야~)

5. 멘토링

개발을 마무리하며 여러 세부 사항을 살펴보고 있는 지금, 멘토님께서 우리가 생각하지 못한 부분도 세세하게 짚어주셨다. 특히 싱글턴 or 멀티턴 부분이 가장 기억에 남았다.

여담

우리 팀 PM님은 정말 일 잘하시고, 팀원들에게 부드럽고, 말을 재치있게 하신다. 닮고 싶다. 동경한다.

0개의 댓글