개발새발 로그

CRUD - Read : 게시글 불러오기 (1) 본문

MERN

CRUD - Read : 게시글 불러오기 (1)

이즈흐 2023. 6. 24. 23:04

이제 DB에 저장된 데이터를 클라이언트에서 요청해 불러와보자

 

 

우리가 원하는 순서를 그려보았다,

작동순서

 

 

  1. 클라이언트에서 axios요청을한다.
  2. 서버에서는 해당하는 API를 만들고 DB에서 데이터를  몽구스의 find로 찾아서 postList라는 이름으로 저장한다.
  3. 다시 클라이언트에서 데이터를 받아 배열에 저장한다.
  4. 해당 배열을 map을 이용해 뿌려준다.

 

 

 1.클라이언트에서 axios요청을한다.

-클라이언트에서 useEffect를 이용해서 해당 컴포넌트가 렌더링되면 axios 요청을한다.

2. 서버에서는 해당하는 API를 만들고 DB에서 데이터를  몽구스의 find로 찾아서 postList라는 이름으로 저장한다.

3. 다시 클라이언트에서 데이터를 받아 배열에 저장한다.

4. 해당 배열을 map을 이용해 뿌려준다.

 

 

발생하는오류

axios요청에 Catch문

-axios요청에서 catch문을 사용하지않으면 위와같은 오류가 뜬다.

728x90
반응형
LIST