React 심화주차 개인프로젝트를 진행하며 일어난 트러블 슈팅

post를 전송하던 와중 post 409 conflict가 생김
구글링을 하다보니 동일한 값을 넣고 회원가입 버튼을 눌러서 생긴 문제였음.
실제로 아이디, 패스워드, 닉네임을 다르게 해서 넣어보니 문제 해결

이젠 다른 문제가 생김

post를 전송하던 와중 post 401 unauthorized가 생김
마찬가지로 구글링을 하다보니 위와 동일한 문제? 줄바꿈 문제였다....

또 nav에서 오류가 나서 살펴보니, useContext();안에 아무것도 넣어주지 않아서 문제가 생기는 것이었다.

그러면 useContext안에는 무엇을 넣어야할까? 살펴보니 UserContext라는 파일을 만들고 임포트 한 뒤에 넣어줘야했다. 그러면 UserContext안에는 무엇이 들어갈까?


UserContext에 항목을 넣어주니 오류가 또 떴다. 이번엔 무슨 문제인가 살펴보니
Cannot destructure property 'user' of 'useContext(...)' as it is undefined.가 떴다.
구글링을 진행해보며 레딧과 같은 해외 사이트에서 찾아보니 app.jsx에서 생긴 문제라고했다.
UserContext를 사용하면서 UserContext 하위에 있는 요소들에 전역으로 user를 사용할 수 있도록 한건데, 제일 중요한 UserContext의 위치를 정해주지 않아서 생기는 문제였다.
app.jsx로 가서 제일 상위div로 UserContext를 추가해주니 해결되었다.

 

Profile.jsx:29 Uncaught TypeError: Cannot read properties of undefined (reading 'map')
map에서는 문법 오류가 일어나지 않았을 것이라고 판단, console.log(data)를 찍어서 혹시 데이터가 없어서 map에서 오류가 일어나는 건 아닐까 하고 생각함. 그 결과 undifined가 나옴.
map부분을 지웠더니 제대로 동작했다... 대체 무슨 문제가 있는걸까


과제 진행 도중에 헤더에 
headers: {
"Authorization": "Bearer AccessToken"
}
을 넣는 이유가 궁금...