[1] CRUD 게시판 프로젝트 - React 셋팅

Github 저장소 : https://github.com/BerkleyLim/project_board

GitHub - BerkleyLim/project_board: Spring Boot + React CRUD형 게시판 만들기 프로젝트 안내서

 

개발 환경은

Front : React 기반

Back-End : Spring Boot 기반

DB : My-SQL 기반

 

Nodejs 및 npm 패키지 / java와 maven 이 미리 설치를 한 상태로 먼저 환경 설정을 셋팅을 한다.

 

1. React 설치 및 라이브러리 추가

 

1) Powershell을 열어 먼저 리액트 프로젝트를 설치 후 아래와 같이 입력

$ npx create-react-app board_front

 

2) 설치 이후 리액트 템플릿 board_front 에 진입을 한다.

$ cd board_front

 

3) 각 스크롤 라이브러리 및 리액트 템플릿에 필요한 것을 설치한다.

※ 필요 라이브러리 : axios, react-router-dom, immutablilty-helper, reactstrap, bootstrap 설치

$ npm install axios --save
$ npm install react-router-dom --save
$ npm install immutability-helper --save
$ npm install reactstrap --save
$ npm install bootstrap --save

 

4) 설치 후 Package.json에서 dependencies 아래와 같이 설치 되어 있으면 정상적으로 설치 되었음을 확인할 수 있습니다.

 

 

5) npm run start를 통해 리액트가 잘 설치 되었는지 확인한다.

$ npm run start

 

 

6) 리액트 설치 성공