1. 개요

1. 일시 및 장소 : 11.17.(수) 15:00 ~ 21:30, 게더타운
2. 참여자 : 전원
3. 목적 : CI/CD 구축 및 배포 자동화
4. 회의 중요도 : 중

2. 고려 사항

2.1. nCloud 서버 구축 및 배포

• 서버 인스턴스 몇 개 만들지?
  • 2개
    • 하나의 인스턴스에서 두 서버를 같이 실행할 수 있음
    • web server + api server
    • crontab server
  • 3개
    • web server와 api server를 분리해서 안정성을 높일 수 있음
    • web server
    • api server
    • crontab sever
  • 우선 하나에서 진행
• nginx 설정
  • 설치
  • ipv4 80번 포트로 접속
    • default 파일의 ipv6 80번 포트는 주석 처리
• nodejs 설치 및 설정
  • Ubuntu node.js 설치 방법
    • 16.10.0 버전으로 진행
• git 클론
  • dev 브런치 사용
  • yarn 설치 : npm install -g yarn
• 배포 확인
  • FE
    • 프로젝트 client에서 빌드하기
    • usr/share/nginx/html에 client 빌드 파일 넣기
  • BE
    • js 파일로 build해서 사용
    • pm2로 구동
      • yarn global add pm2
      • pm2 start ./dist/src/app.js
    • 참고 자료

2.2. Github Actions로 CI/CD 구현

2.2.1. 사용 이유

• CI/CD는 배포 관련된 작업 시간을 줄여줘 상대적으로 적은 프로젝트 기간에 도움이 됨
• Jenkins는 CI/CD 구현을 위한 러닝 커브가 많이 소요되는데, Github Actions는 상대적으로 진입 장벽이 낮음
  • 팀원들이 CI/CD에 대한 사전 지식이 적어 쉽게 사용할 수 있음
  • 프로젝트 기간이 짧기 때문에 빠르게 배워서 사용할 수 있음

2.2.2. 구현 전 고려 사항

• CI
  • 현재 test 코드가 없고, 단순히 자동 push 기능으로만 사용함
  • 다만, 개발 환경에서 배포 환경을 이동했을 때 제대로 병합되는지 확인 가능
• CD
  • 개발 환경과 배포 환경의 Node.js, Ubuntu 버전을 통일
  • nCloud와 연동
    • 참고자료

3. 할 일

• nCloud에서 클라우드 서버 생성
  • Client - Nginx
  • API - pm2
• GitHub Actions CI/CD 구현
• 배포 환경에서 실행
• Nginx 설정

4. Trouble Shooting

4.1. Nginx start 에러

• 문제점 : nginx 실행 시 nginx: [emerg] socket() [::]:80 failed (97: Address family not supported by protocol) 에러 발생
• 원인 : nCloud에서 클라우드 서버 생성 시 IPv6를 설정하지 않음
• 해결 : /etc/nginx/sites-available/default 파일에서 IPv6로 연결되는 부분을 주석처리함

# /etc/nginx/sites-available/default
server {
    listen 80 default_server;
    # listen [::]:80 default_server; -> 주석 처리
		...
}

4.2. Ubuntu 18.04에서 node.js 설치

• 문제점 : Ubuntu 18.04에서 nvm으로 node.js 18.12.1을 설치하니 에러가 발생
  • node: /lib/x86_64-linux-gnu/libc.so.6: version 'GLIBC_2.28' not found (required by node)
• 원인 : Ubuntu 18.04는 node.js 18번대를 지원하지 않음
• 해결 : node.js 버전을 16.10.0으로 변경
  • 이래서 docker를 쓰는구나…
• 참고자료

4.3. git checkout -t [원격 브랜치명]

• 문제점:
  • git remote update를 해도 원격저장소의 브랜치가 가져와지지 않았음
  • git checkout이 제대로 되지 않았음
• 원인: 브랜치 추적이 되지 않아서 생겼던 문제
• 해결: ‘--track’ 옵션을 설정해서 현재 브랜치의 목록들을 트래킹해서 가져옴
• 참고자료

4.4. cannot read properties of undefined (reading ‘CITYDATA’)

• 원인: .env 파일이 존재하지 않아 생기는 에러
• 해결: 파일을 만들고, 해당 파일 내부에 CITYDATA 정보를 적음

4.5. cp -r /A/B/…/C/ /D를 이용해서 파일들을 복사하기로 했으나 복사가 되지 않는 에러 발생

• 원인: 3번째 인자와 4번째 인자가 서로 뒤바뀌었다 (3번째가 원본이고, 4번째가 복사할 대상을 의미)

4.6. nginx의 디렉터리 경로 설정이 제대로 안되어서 index.html을 인지하지 못함

• 문제점 : 클라이언트의 build 파일을 /usr/share/nginx/html 에 복사하고 nginx를 실행시켰지만 기존의 페이지가 노출됨
• 원인: nginx의 root 디렉터리 경로가 /var/www/html 로 되어있었음
• 해결: etc/nginx/sites-available에서 root 부분의 경로 코드를 수정함

4.7. nvm으로 설정한 node v16.10.0버전이 밥 먹고 돌아왔더니 v18.12.0으로 롤백되어 있는 문제

4.8. [ERROR][PM2] Interpreter … is not available in PATH

• 해결: pm2 install typescript 를 설치 → 타입스크립트 설치를 했어야 함

4.9. .env 파일을 읽지 못하는 에러 발생 (TypeError: Cannot read properties of undefined ‘CITYDATA’)

4.9.1 시도 1

• PM2와 PM2 with TypeScript를 global로 설치해서 문제라고 함(참고자료) → node_moduls 내부에서 PM2와 typescript를 설치했지만 동작하지 않음

4.9.2 시도 2

• npx tsc -p . 로 타입스크립트 컴파일
• 컴파일된 dist 폴더 내부에서 pm2 start app.js 실행

4.9.3. 시도 3 → 해결

• .env 파일의 위치가 잘못되었다
• .env 파일을 server/dist 에 넣어서 해결

5. 궁금한 점

5.1. docker와 버전

• docker 위에서는 ubuntu여도 18버전 이상의 node를 사용할 수 있을까? 4.2.참고

5.2. Nginx 폴더 구조

• 정적 파일이 위치해야되는 디렉토리 위치가 /usr/share/nginx/html, /var/www/html 두 곳이 있었는데, 이 둘의 차이점이 뭘까?
• 루트 디렉토리를 지정해줄 수 있기 때문에 아예 프로젝트의 build폴더 위치를 루트 디텍토리로 지정해주면 더 편하지 않을까? 해서 바꾸어보았지만 404 에러 발생 (확실하진 않음)

5.3. node

• nodemon과 ts-node에서는 server/dist/app.js 를 실행해도 잘 되었다.
• 하지만 pm2에서는 실행되지 않았다. 이 둘의 차이는 무엇일까?

6. 배포 결과

배포 사이트

백엔트 포트 번호 : 3000(리액트 빌드 서버랑 동일)

클라이언트 포트 번호 : 80

6.1. 클라이언트 서버

• build된 파일을 nginx에서 구동 중인 모습

6.2. api 서버

• 요청이 잘 온다

• 브라우저에서도 잘 보임

6.3. CI/CD는 다음 기회에 ㅎ.ㅎ

• .github/workflows에서 쓰던 yml 파일 사용하기