[Feat] 상세페이지 구현

[otcroz]

⚙️ 기능 설명

마이페이지에서 리스트 아이템을 클릭했을 때 상세 페이지로 이동합니다.
상세 페이지는 변환 페이지와 동일한 화면이므로, 변환, 상세페이지 중 어떤 용도로 사용되는지 파악 후 동작되도록 합니다.

✅ To-do

• 상세페이지 API 연결
• 변환 페이지, 상세 페이지를 구분하는 조건 추가
• 상세페이지의 역할을 할 수 있도록 코드 수정

📑 참고 자료

• [React] useNavigate로 state 넘기기

[otcroz]

페이지가 2번 뜨는 것으로 예상되어 뒤로가기가 잘 구현되지 않았던 문제

문제상황: 2번 또는 그 이상 클릭해야 뒤로가기가 되었다.

_2024_10_27_13_19_53_881.mp4

문제 해결: index.tsx에 있는 React.StrickMode를 제거하면 페이지가 2번 뜨는 이슈가 발생하지 않는다.

_2024_10_27_13_29_48_393.mp4

React.StrictMode의 역할

• 애플리케이션 내 잠재적인 문제를 알아내는 도구
• 개발 모드에서만 활성화
• 안전하지 않은 생명주기를 사용하는 컴포넌트 탐색
• 레거시 문자열 ref에 대한 사용 경고
• 레거시 context API의 쓰임새 검사
• 권장되지 않는 findDOMNode 사용 경고

개발 시에 경고창을 띄우는 역할을 React.StrictMode가 합니다.

참고문헌

• Strict Mode