[Node.js, Vue.js, AWS] 배포하기

 

 

여는 글

---

 

구글링하면 nodejs만 배포하거나 vue 배포만 하는 글이 많고 둘 다 있다고 하더라도 막 시작하는 (나처럼 코드가 이미 한가득 작성되어 있지 않은) 단계의 글이 많아서 해결하는 데 시간이 오래 걸렸다.

 

그러니 이 글은 아래 경우에 해당되는 사람이 배포 할 때 도움이 되는 글이다.

 

1. nodejs, vuejs 를 동시에 배포해야하고 개발 마무리 단계다.

 

2. 개발 라이브러리가 frontend, backend 따로 구분되어 있다.

 

 

 

AWS 세팅 및 서버 구동하기

---

 

세팅은 아래 포스팅을 거의 참고했다. (참고하기 전에 아래 글을 먼저 읽고 참고하길 바람)

 

GitHub과 Node.js Express를 이용한 자동배포 환경 만들기(feat. AWS-EC2, AWS CodeDeploy, AWS CodePipeline) 1편 - 까

 

이 포스팅을 따라하다가 막힌 부분이 있었고 나와는 다른 구조로 되어 있어서 그렇다는 걸 깨달았다.

 

 

 

ssh 접속 할 때

 

나는 aws 이름이 codewriter였기 때문에 codewriter@ip 로 했는데 계속 실패했다.

 

이거 때문에 며칠을 구글링했는데 그냥 기본이름인 ubuntu로 하니까 바로 됐다...

 

그리고 굳이 가상머신->리눅스로 하지 않아도 윈도우 cmd에서도 충분히 된다.

 

시작 메뉴에서 openssh 설치 후 cmd에서 ssh를 쳐보면 설치확인을 할 수 있고 여기서 바로 접속할 수 있다. (권한 문제가 있다면 구글링하면 많이 나오므로 생략)

 

구글링하다보니 cmd 사용을 꺼리거나 그냥 putty를 많이 사용하던데 본인의 선택이다.

 

난 배포 가능 여부가 급해서 그냥 cmd로 했다.  

 

[미래의 나를 위해 써두는 cmd 실행 명령어 순서]

바탕화면에 pem 파일이 있으므로 먼저 cd Desktop

ssh -i "olrangstore.pem" ubuntu@퍼블릭ip

(코드 갱신 시 git에 업로드 후 rm -rf olrang, git clone https://github.com/codelistwriter/olrang.git)

cd olrang

cd frontend/backend

npm run build/npm run start

 

 

 

GitHub에 파일을 업로드할 때 

 

나는 vscode로 개발했고 .gitignore가 있었다.

 

근데 그대로 올려서 clone으로 내려받았더니 npm start가 안됐다.

 

문제는 .gitignore에 node_modules가 포함되어 있어 GitHub에는 backend, frontend 하위의 저 폴더가 업로드 되지 않아 npm start 명령어가 먹히지 않았던 것이다.

 

구글링해보니 package.json이 저 폴더를 대체할 수 있으며 node_modules는 내용이 많아서 git에 올리지 않는다고 하는 글을 봤다.

 

근데 나는 node_modules 폴더를 올리지 않으니 서버 명령어가 안 먹혔고 올리고 난 후에는 잘 동작한다.

 

 

npm start 명령 수행 위치

 

나는 기본 경로(ubuntu@ip~)에서 npm start하면 안 먹힌다.

 

vscode에서 개발했다면 frontend 폴더에서 npm run build한 후 backend 폴더로 이동해 npm run start 명령어를 사용하는 방식으로 구동했을 텐데 여기서도 그렇게 해야한다.

 

 그러니까 기본 경로에서 cd 명령어를 이용해 frontend, backend 폴더로 이동한 후 vscode에서 하던 것처럼 구동 명령어를 해주면 된다.

 

 

 

닫는 글

---

 

배포를 진행하면서 진지하게 고민했는데 일단 결제 기능 구현되고 나면 부족했던 로그인, frontend에 alter 삽입하기 등을 다시 잡아볼 생각이다.

 

원래는 빨리 끝내고 포트폴리오를 하나 더 만들 생각이었는데 이것도 제대로 못하는 데 양이 많아봤자 무슨 소용이냐는 생각이 들었다.

 

 

아래는 public ip로 접속한 페이지!

 

 

 

현재는 DB 이용이 안된다.

 

개발 시에 로컬 기준으로 동작하도록 구현했기 때문이다.

 

다음은 배포한 주소에서도 DB사용이 가능하도록 하는 내용의 포스팅이다.