어떤 기능인가요?

내 케이크 메인 화면 구축하기

작업 상세 내용

• #32
• 케이크 보기 / 캔들 보기 토글 스위치 구현
• 캔들 페이징 처리 및 페이지네이션 구현
• 생일까지 남은 날짜와 케이크이름에 따른 버튼 구현

어떤 버그인가요?

친구목록이 나타나야하는데 에러 발생

어떤 상황에서 발생한 버그인가요?

Tab 키에서 친구목록을 클릭했을 때 api로 친구목록을 불러와야하는데 오류 발생
console.log로 내용을 봤으나 500 에러가 나타난다고 함
에러를 해결하기 위해 이것저것 시도 했으나 계속 오류가나서 좀더 코드를 공부해보고 수정할 예정

예상 결과

친구목록 화면에 나타나는 결과

참고할만한 자료(선택)

어떤 기능인가요?

친구목록 불러오는 기능 구현

작업 상세 내용

• 친구목록을 볼 수 있는 창 구현
  일단 하긴 했는데 아직 친구목록에 아무도 없어서 제대로 작동하는지는 확인 못했습니다.
  일단 친구목록에 아무도 없을때는 멀쩡히 뜨고 오류도 없습니다.

참고할만한 자료(선택)

어떤 기능인가요?

케이크 생성하기 버튼을 누르면 나오는 화면

작업 상세 내용

• 상단의 홈버튼, 하단의 이전 버튼과 다음 버튼
• 케이크 선택 후 다음 화면에서 해당 케이크 나오기
• 케이크 설정 후 완료 버튼 누르면 백엔드로 api 보내기

어떤 기능인가요?

서버 주소 보안 유지 및 수정 용이성을 위한 변수화와 파일명 변경

작업 상세 내용

• 서버주소를 SERVER_URl 변수에 저장 후 사용
• 컴포넌트 파일 이름을 카멜케이스 + 첫글자 대문자로 변경
• 약간의 코드 리팩토링과 로그인 페이지 코드 가독성을 위해 로그인폼 컴포넌트화

참고할만한 자료(선택)

어떤 기능인가요?

friend 부분 기능 추가

작업 상세 내용

• 메뉴 버튼 클릭시 모달창 나타나게 하는 기능 구현
• 모달창 안에 Tab 기능을 구현 하여 친구목록, 달력, 친구요청을 선택할 수 있는 기능 구현
• 친구목록을 볼 수 있는 창 구현 ( 진행중 )

결과물

어떤 기능인가요?

메뉴 기능을 포함한 헤더 생성

작업 상세 내용

• 내 케이크 메인으로 돌아가기
  • hover 시 tooltip 생성
• 친구
  • 친구 목록보기
  • 친구 생일 달력보기
  • 친구 신청
  • 상태관리 적용하기
  • 탭 구현
• 설정
  • 프로필 편집
  • 내 케이크 보관함 가기
  • 내가 쓴 편지 보관함 가기
  • 로그아웃
  • 회원탈퇴
• 그외
  • styled-component에서 다른 컴포넌트를 선택하는 방법
  • 말풍선 모양 구현하는 방법 -> ::after 사용

참고할만한 자료(선택)

어떤 버그인가요?

먼저 loginApi의 경우 혼자 소문자로 파일명이 작성되어 있음. 그러나 import 부분은 대문자로 되어있음.
TitleLocation의 경우 대문자로 되어 있으나 import 하는 부분에서는 소문자로 되어있음.

따라서 위와 같은 에러가 발생하였음. 파일명을 대문자로 통일하도록 수정이 필요함.
추정상 css와 js가 같이 쓰이는 파일은 대문자로, js만 쓰이는 파일은 소문자로 두었던게 의도인 것 같은데, 이런 부분에서 문제가 생길 수 있으니 주의하길 바람.

참고할만한 자료(선택)

https://velog.io/@asj1966/React-%ED%8F%B4%EB%8D%94-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8-%ED%95%A8%EC%88%98-%EB%AA%85%EB%AA%85-%EA%B7%9C%EC%B9%99

어떤 기능인가요?

모든 페이지에서 사용하는 배경화면 스타일을

작업 상세 내용

• 로그인 및 회원가입의 핑크색 배경화면
• 테이블이 있는 아이보리색 배경화면

어떤 버그인가요?

어떤 버그인지 간결하게 설명해주세요

년도나 월만 바꾸는 경우에는 생년월일 값이 변경되지 않음. 반드시 달력에서 날짜를 선택하는 경우만 생년월일이 바뀌는 문제가 있음.

월이나 년도에 대한 정보만 바꾸려고 하다가 우연히 발견하게 되었음.

치명적인 버그는 아니라고 생각하므로 정말 심심해죽겠고 삶이 허무할 때 수정해주면 좋겠음!

어떤 버그인가요?

일단 어제 풀리퀘 줬던 feature/friend 랑 feature/mycake-main 각 브랜치에 머지하고
두 브랜치를 main으로 머지하여 main에서 해당 기능들을 테스트 하는 도중이었음..

케이크 정보 열람시 모달창 여러번 나타나는 버그

어떤 상황에서 발생한 버그인가요?

로그인 한 후에 케이크 정보를 불러오는 모달창이 두번 열림.

여기서 확인누르면

또 나옴

그다음 확인 누르면 페이지를 불러오기는 하지만 반응형으로 안되어 있어서 창 크기 조절되면 이렇게 컴포넌트가 겹침.

오른쪽에 뜨는
데이터를 가져오는 중 오류가 발생했습니다. TypeError: Cannot read properties of null (reading 'toString')
at fetchData (MyCakeMain.jsx:36:1
에러는 내쪽에서 잘못된 것 같으니 확인해보겠음.