React, Express, MongoDB : 댓글기능 환경 구축

게시글을 클릭해서 들어가면 아래와 같이 구성되는 것이다

이 그림과 같이 컴포넌트를 나눠준다.

 

PostArea

1. PostArea.js에서는 서버에 postNum을 이용해 클릭한 게시글 데이터를 요청한다.

2. PostArea는 받은 데이터를 Detail과  RepleArea에 props해준다.

3. spinner도 PostArea에서 보여주게된다. -> 로딩 화면

 

Detail

1. props로 받은 데이터를 출력해준다.

RepleArea

1. RepleUpload 컴포넌트와 RepleList 컴포넌트를 하위 컴포넌트로 만들어준다.

2.RepleUpload는 input태그와 button태그를 생성해 간단한 댓글 등록 페이지로 만든다.

3.RepleUpload에서 등록 버튼을 클릭하면 서버에 댓글 등록 요청을 해주는 함수를 만들어준다.

완성된 클라이언트

 

서버요청부분 Reple 모델 구축

1. Reple 몽구스 모델 생성