본문 바로가기

TIL

자체 UT 후 계획 및 버그수정

어제 최종 프로젝트의 중간발표를 마친 뒤 중간 회고를 진행했다.

 

🥲 아쉬웠던 점

  1. 커스텀 훅, 공용 컴포넌트 사용 미숙
  2. 체계적인 일정 관리가 조금 안됐던 것 같다
  3. 비지니스 로직 분리가 잘 안되어서 아쉽다
  4. 개발 기능에 집중 하다 보니 , 성능적인 부분이나, 구조적인 문제 개선을 하지 못했슴 + 로딩창을 거의 사용하지 못함 + 이벤트나 ui동적 요소 부족
  5. fetch 로직 겹치는 부분 정리가 잘 되지 않음 / Query, fetch 일관성 부족
  6. 필요하지 않은 client 컴포넌트 / 렌더링 방식을 고려하지 않은 컴포넌트 작성

 

😍 좋았던 점

  1. 소통이 잘 되고 피드백이 좋았음
  2. 팀원들의 태도가 매우 우수함 / 감정상해죄 0
  3. 오류나 어려운 부분이 있을때 서로 질문하면서 해결한 점
  4. 작업하고 있는 팀원의 흐름이 깨지지 않도록 각 팀원과의 의논이 필요한 경우 따로 나와서 이야기한점

 

🧐 발전할 계획 & 우선순위

* 5분 기록 활성화(구현이 되었을 때, 수정되었을 때, 트러블슈팅, 풀리지 않는 오류가 있을 때)

1 개선 버그 수정 : 자잘한 버그 수정 2024-11-12
2 설정 메타 데이터 설정하기 : 탭 이름, 설명 등 => 빨리 끝날 것 같아서 2024-11-12
3 개선 로직 / UI 분리 : 개인 페이지 내에서 컴포넌트 분리 및 로직 분리 2024-11-14
4 UI 공통 컴포넌트화 2024-11-14
5 UI UI 개선 2024-11-14
6 개선 로딩 UI : 스켈레톤 UI 설정 , 긴 로딩시간 → 성능 최적화 생각해보기 2024-11-18
7 개선 에러처리 : sentry, 에러바운더리 2024-11-18
8 개선 최적화 : useMemo useCallback / 라이트 하우스 2024-11-19
9 개선 Query 정리 : fetch 함수와 query 정리하고 커스텀 hooks 폴더 분리 2024-11-20

 

 

디자이너 포함 두 팀으로 나누어 자체 UT 진행

각 페이지마다 디테일하게 테스트 해보며 발견되는 오류들을 기록했다.

 

 

기록한 의견들을 종합하여 체크박스 형태로 정리 후 버그를 하나씩 수정하기로 했다.

 

맡은 페이지/기능의 수정목록

☀︎ 모집글 상세페이지

  1. 공유하기 클립보드 alert 디자인 - 토스트가 나왔다가 사라져야함
  2. 로그인이 안 됐는데 신청이 됨 (수정 완)
  3. 푸터가 고정돼야 하는데 댓글 달리면 밀림 - 푸터가 모든 view에서 아래로 유지되며 따라다녀야 함 (수정 완)
  4. 댓글 간 간격 조정
  5. 작성된 내용 밑에 여백 필요함 (100px) (수정 완)
  6. 모집글 수정 삭제 드롭박스 버튼 가로 크기 (뚱뚱이로) (수정 완)
  7. 댓글 작성 input 이랑 댓글 내용 간격 확인 (수정 완)
  8. 프로필 이미지 테두리 추가 (수정 완)
  9. 댓글 추가 버튼 크기  (수정 완 - 디자인 수정됨)
  10. 모달창 뜰 때 배경 스크롤 방지(수정 완)
  11. 댓글 텍스트필드 선택 되었을 때 밑에 줄 진해져야 함(수정 완)
  12. 신청 각오 한마디 할 때 (최대 12자 추가)(수정 완)
  13. 대댓글 작성 누르고 안 하고 싶을 때? 다른 곳 누르면 사라지게끔 해야 할 것 같음.? (디자인 수정 - 취소버튼 추가)
  14. 댓글 리스트 보여주는 버튼이랑 답글달기 버튼 분리

 

☀︎ 그룹페이지

  1. 회고록 더보기 기능 구현 필요
  2. 더보기 화살표 색상 변경
  3. 회고록 멤버 이미지 흰색 테두리 추가
  4. 캘린더 날짜가 6줄 됐을 때 밀림 현상
  5. 캘린더 선택 되었을 때의 날짜 색상 블랙
  6. 일정잡기 띄어쓰기(’일정 잡기’로)

 

☀︎ 캘린더 일정 관리

  1. 일정 잡기 추가 완료 일정 추가하는 모달 꺼지기
  2. 스터디 일정 잡았을 새로고침 안하고도 되도록
  3. 버튼 플러스 정확하게 눌러야만 하는 문제 - 버튼 전체 눌러도 되도록
  4. 헤더 스타일링
  5. 텍스트 필드 기본으로 적혀진 텍스트 색상 변경

차근차근 하나씩 수정해나가야지..!

 

+ 2024.11.10. 수정완료

 

모집글 상세페이지

  1. 공유하기, 신청하기 alert 디자인 - 토스트
  2. 신청하고 창 뜨는데 안 닫힘 (이부분 다시 물어보기 태현님)
  3. 로그인이 안 됐는데 신청이 됨
  4. 푸터가 고정돼야 하는데 댓글 달리면 밀림 - 푸터가 모든 view에서 아래로 유지되며 따라다녀야 함 - (디자이너 회의)
  5. 댓글 간 간격 조정 - (디자이너 회의)
  6. 작성된 내용 밑에 여백 필요함 (100px)
  7. 모집글 수정 삭제 드롭박스 버튼 가로 크기 (뚱뚱이로)
  8. 댓글 작성 input 이랑 댓글 내용 간격 확인 28px
  9. 프로필 이미지 테두리 추가
  10. 댓글 추가 버튼 크기 불일치
  11. 모달창 뜰 때 배경 스크롤 방지
  12. 댓글 텍스트필드 선택 되었을 때 밑에 줄 진해져야 함
  13. 신청 각오 한마디 할 때 (최대 12자 추가)
  14. 답글입력폼 / 수정모드 - 취소 확인 버튼 추가, 댓글 리스트 보여주는 버튼이랑 답글달기 버튼 분리
  15. 로그인 안한 상태에서 댓글 달때 막기
  16. 댓글 수정모드일때 위아래 간격 더주기
  17. 콘솔 이미지 오류 잡기
  18. 버튼 태그 type = submit 추가해주기
  19. 모집인원 가득찼을때  신청하기버튼을 disable + 모집마감
  20. 푸터 고정 및 스크롤 다시 테스트

캘린더 일정 관리

  1. 일정 잡기 추가 완료 시 일정 추가하는 모달 꺼지기
  2. 스터디 일정 잡았을 때 새로고침 안하고도 되도록
  3. 버튼 플러스 정확하게 눌러야만 하는 문제 - 버튼 전체 눌러도 되도록
  4. 헤더 스타일링 - 폰트 두께 수정, 헤더 고정하기
  5. 텍스트 필드 기본으로 적혀진 텍스트 어둡게 해줘야 함
  6. 최대150자로 수정 및 글자수에 맞게 입력 필드 조절
  7. 일정잡기 띄어쓰기(’일정 잡기’로)
  8. 캘린더 날짜가 6줄 됐을 때 밀림 현상
  9. 캘린더 선택 되었을 때의 날짜 색상 블랙
  10. 모든 필드 입력 안되어있으면 버튼 disable

추가된 부분

  1. Alert -> 토스트 알림으로 변경

그룹페이지

  1. 회고록 더보기 기능 구현 필요
  2. 더보기 화살표 색상 변경
  3. 회고록 멤버 이미지 흰색 테두리 추가
  4. 프로필 불러오는 로직 변경(user.profileImg)
  5. 멤버 승인해도 회고록에 표시 안되는 문제 해결 -> 승인버튼에 회고록 queryKey 동기화해주는 로직 추가

 

 

🥹 느낀점

중간 발표와 회고를 진행하면서, 우리 팀이 잘한 부분과 개선할 부분을 명확히 파악할 수 있었다. 개발하는 시간 내내 몸은 힘들지만 사람간의 스트레스는 크게 받았던 기억이 없다고 느낄 정도로 분위기가 너무 좋았고 팀원과의 소통이 원활하게 되었다. 이런 팀을 만나는게 쉽지 않다 생각하는데 운이 좋았던 것 같다.

기술적인 부분에서는 아쉬운 점들이 있었는데 기능을 구현에 몰두해 공용 컴포넌트를 제대로 활용하지 못했고, 특히 비즈니스 로직 분리나 성능 최적화에도 신경 쓰지 못해서 페이지 로딩 속도가 다소 느렸다. 그렇지만 회고를 통해 이러한 문제점들에 대해 의견을 나누고 개선 계획을 세웠으니 우선순위를 고려하며 차근차근 개선해나갈 계획이다.