※ 본 프로젝트는 기존 JSP 뷰 방식에서 벗어나 BackEnd와 FrontEnd를 분리하기 위한 예시 파일로 참고만 하시길 바랍니다.

프로젝트에서 사용된 환경 프로그램 정보는 다음과 같다.

심플 홈페이지 Backend 소스를 받아 구동한다.

아래 1 ~ 3의 과정을 따라서 진행한다.

Git에서 복제하여 설치 시 1-1. 을 참고한다.

표준프레임워크 개발환경에서 설치 시 1-2. 를 참고한다. (2022년 2월 현재)

Git에서 clone 한다.

# 프로젝트 저장소를 로컬로 복제
git clone https://github.com/hmmhmmhm/egovframe-template-simple-react.git

# 복제된 프로젝트 디렉토리로 이동
cd egovframe-template-simple-react

# node modules를 설치해 준다.
npm install 

egovframe-template-simple-backend 설치 이후 egovframe-template-simple-react 디렉터리를 egovframe-template-simple-backend 디렉터리 밖으로 이동한다.

# 이동한 프로젝트 디렉토리로 이동
cd egovframe-template-simple-react

# node modules를 설치해 준다.
npm install 

구동된 BackEnd 서버의 URL을 본 어플리케이션의 .env.development 파일의 REACT_APP_EGOV_CONTEXT_URL에 설정해 준다. (단, 개발환경에서는 사용하는 환경변수 정보는 .env.development, build 시 사용하는 환경변수는 .env.production 에 기입해 준다.)

# .env.development 예시
REACT_APP_EGOV_CONTEXT_URL=localhost:8080

# 테스트용 리액트 서버를 실행할 때 아래 명령어를 사용한다.
npm start

보다 상세한 설명은 아래의 문서를 확인한다.

1. Available scripts in CRA
2. 개발환경 초기 설정