프로젝트 배포하기

프로젝트 배포

이전에 만든 프로젝트를 vm에 배포할 것이다 그러기 위해서 서버를 먼저 설정한다

나중에 수정 사항은 줄이고 싶다면 프로젝트 끼리 연결 부분 먼저 한다

 

서버 설정

프로젝트 배포 전 서버를 설정 시간이나 자바 노드등을 설치한다

 

시간 설정

vm에서 date를 통해서 시간을 확인한다

시간이 우리나라와 맞지 않는다면 sudo ln -sf /usr/share/zoneinfo/Asia/Seoul /etc/localtime로 시간을 설정하고 date로 바뀐 시간을 확인한다

 

 

자바 설치

본인이 작업한 자바와 맞는 버전을 설치한다

자바를 설치하기전 우분투 패키지를 최신으로 업데이트한다 sudo apt update

java로 자바가 있는지 확인

자바 17버전으로 만들었으므로 sudo apt install openjdk-17-jdk 로 자바를 설치

20버전인 경우 wget https://download.oracle.com/java/20/latest/jdk-20_linux-x64_bin.deb

sudo apt install -y ./jdk-20_linux-x64_bin.deb

설치된 자바를 확인 java -version

 

node 설치

sudo apt updata

---

여기서 install nodejs 로 설치한다면 우분투 20.04버전에 있는 nodejs 10버전을 다운 받는다

22.04버전을 이용해도 node 12 버전을 다운받기 때문에 아래과정으로 Node 14를 설치해야한다

사용하는 nodejs버전과 맞지 않아 다른 버전을 설치해야 한다 (이방법으로 설치)

curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -

sudo apt-get install -y nodejs

입력하면 이화면에서 기달려야한다

---

sudo apt install nodejs 노드 설치

sudo apt install npm npm 설치

설치 확인

 

 

backend 프로젝트 빌드

backend 프로젝트 위치에 들어간다

./gradlew build로 빌드를 실행

cd build/libs 경로에 빌드된 jar 파일을 확인

간단하게 vm에 파일 옮기기위해 GCP 페이지 에서 ssh 브라우저 연결을 이용한다

파일 업로드 버튼을 통해서 파일을 업로드 한다

java -jar backend-0.0.1-SNAPSHOT.jar으로 배포 파일을 실행 시킨다

포트 설정

방화벽 설정에 들어가서 8080포트를 열어준다

방화벽 규칙 만들기 접속

소스 IPv4 범위를 통해서 접속할 수 있는 ip를 제한한다 0.0.0.0/0 은 모든 ip에서 접속 가능하다

8080포트를 열어준뒤에 외부ip:8080/hello로 접속 해서 hello world가 뜨는지 확인한다

백엔드는 정상적으로 실행된다

 

 

frontend 프로젝트 빌드

해당 프로젝트 위치에서 npm run build실행 build결과물을 압축한다

backend.jar파일을 업로드한것과 같이 웹 터미널에서 압축 파일을 업로드한다

업로드 후에 unzip build.zip로 압축을 해제한다 안될경우 sudo apt install unzip후에 다시 실행

sudo npm i -g serve npm으로 serve 설치

sudo serve -s -p 80 build빌드된 리액트 프로젝트를 실행한다

고정 ip 주소와 80번 포트를 이용한다면 정상 접근이 된다

 

 

프로젝트끼리 연결

지금 상태에 프런트와 백엔드는 연결이 안되어 있다

글 생성시 위 오류가 뜬다

변경 작업에는

• 도메인 설정

• backend의 cors 모든 허용
• 요청 보낼 주소 수정

이렇 과정이 필요하다

 

도메인 설정

내도메인.한국 로그인

지금은 서비스에 접속 할려면 고정 ip를 입력해서 들어가야한다 대신 도메인을 이용할 수 있도록 한다

로그인후 메인페이지에서 일반 도메인에 원하는 문자를 넣은뒤 검색 경과에 나온것중 하나를 등록하면 된다

인증 번호 입력후 수정으로 들어간다

표시한 부분에 내 고정 ip를 넣고 수정을 완료한다

이제 고정 ip대신 도메인인 (guestbook.kro.kr을 사용 가능하다)

 

 

자바 cors 허용

자바 프로젝트에 들어가서 CommentController.java

@CrossOrigin(origins = "*")

이렇게 수정한다

 

리액트 수정

요청을 보낸 주소의 앞 부분을 변경한다

main, detail, edit, create를 수정해야한다

자신의 도메인을 적어야한다

http://guestbook.kro.kr:8080을 붙여준다

 

 

터미널에서 프로젝트 실행

2개의 프로젝트를 돌려야한다 + 백그라운드 실행

터미널을 2개를 켜서 돌리는 경우도 있지만 하나를 백그라운드에 실행시킨다면 두개를 하나의 터미널에서 실행 시킬수 있다

또한 백그라운드에서 실행한다면 터미널을 닫아도 계속 실행된다 nohop이용할것

또한 여러 명령을 하나의 스크립트로 만들어서 실행 할것이다(쉘 스크립트) 이렇게 만든다면 킬때 종료할때 해당 스크립트만 실행시키면 된다는 장점이 있다

터미널에서 vi start.sh

#!/bin/bash

JAR=backend-0.0.1-SNAPSHOT.jar

nohup java -jar $JAR &
nohup sudo serve -s -p 80 build &

esc :wq로 빠져나온다

그리고 파일에 권한을 부여한다 chmod +x start.sh

이제는 ./start.sh로 실행한다면 두개의 프로젝트가 백그라운드에 실행된다

 

종료 스크립트 생성

vi stop.sh

#!/bin/bash

java_PID=$(ps -ef | grep java | grep java | awk '{print $2}')

if [ -z "$java_PID" ];
then
    echo "java is not running"
else
    kill -9 $java_PID
    echo "java stopped."
fi

# Node.js 프로세스 종료
node_PID=$(ps -ef | grep node | grep -v grep | awk '{print $2}')

if [ -z "$node_PID" ];
then
    echo "Node.js is not running"
else
    sudo kill -9 $node_PID
    echo "Node.js stopped."
fi

이 스크립트 파일 역시 chmod +x stop.sh로 권한 부여하면 정상 작동 된다

종료시에 포트를 죽일 필요없이 ./stop.sh로 끝낼수 있다