데이터 흐름

API 요청 플로우

View -> Hooks -> Query Library(optional) -> Fetcher -> API server

locahost:3000에서 localhost:9999관한 에러 발생시

Access to XMLHttpRequest at 'http://localhost:9999/category' from origin 'http://localhost:3000' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

리액트 CORS오류로 express 서버파일에서 cors를 설치해주고,

app.use(
  cors({
    origin: "http://localhost:3000",
    credentials: true,
  })
);

코드를 추가해주니 해결되었다.

에러2 cors에러를 해결해도 카테고리가 나오지 않음

프로젝트 2 진행중 category의 속성을 id, name에서 categoryId, categoryName으로 변경하였다. 타입또한 변경해주니 잘 나타났다.