heroku + mLab 프로젝트 업로드

 

2018/12/28 - [NodeJS] - Node.js + Express + MongoDB CRUD 만들기

 

이전에 만들었던 프로젝트를 헤로쿠클라우드 서비스에 업로드하는 방법입니다.

 

한 두시간 세시간을 끙끙 싸맨것같은데 어찌어찌 업로드에 성공하였습니다.

 

 

 

헤로쿠 클라우드에 업로드해서 mLab 에서 제공하는 mongoDB 서비스까지 연결해서 CRUD 가 정상적으로 작동하고 있습니다.

 

1. 헤로쿠 사이트 회원가입 하고 앱 만들기

 

2. 헤로쿠 앱 생성하기

 

3. 헤로쿠 CLI 설치하기

 

4. # npm install -g heroku

 

5. # heroku login

 

6. # heroku create

 

7. # heroku apps:rename 변경할이름 --app 기본생성이름

 

8. 확장자없는 /Procfile 생성 web: node app.js(실행할 서버 파일 이름)

 

9. MongoDB 데이터베이스를 사용 할 수 있도록 mLab MongoDB 라는 add-on을 설치

 

10. 신용카드정보입력(기본 사용량 까지는 무료 이후는 유료전환)

 

11. # heroku addons:create mongolab:sandbox --app 7번에서의 프로젝트 이름

 

12. 애드온 성공적 설치 되었으면 헤로쿠 사이트에서 앱 정보를 확인

 

13. mLab MongoDB 클릭

 

14. MongoDB에서의 상세정보화면에서 Users 탭을 클릭하고 계정생성

 

15. app.js 파일에서

mongoose.connect(mongodb://<dbuser>:<dbpassword>@~~~)

이 부분을 본인의 dbuser 명과 비밀번호를 입력

 

만약 비밀번호에 특수문자가 들어갔다면

 

백틱(``) 을 사용해서 mongoose.connect(`mongodb://dbuser:${encodeURIComponent("비밀번호")}@~~`) 해주셔야 정상적으로 db에 연결이 됩니다.

 

이것때문에 한 두시간 해먹었습니다.....

 

16. process.env.PORT || 3000

 

app.set('port', process.env.PORT || 3000);

16번 이것도 꼭 확인해줘야합니다 stack overflow에서도 저 문제로 오류를 많이 겪더라구요 저또한 express 가 자동으로 설정해놓은 기본파일들을 수정해서 오류 잡았습니다.

 

express로 프로젝트 생성했을때 bin/www 라는게있는데 기본서버실행 파일을 저걸로 잡고있더군요

 

그냥 app.js 에서 서버실행 express 실행 다 합니다. 그렇게 변경해줘야 헤로쿠 올릴때 오류가 안나는것같아요

 

http.createServer(app).listen(app.get('port'), function() {

console.log('익스프레스 서버를 시작했습니다.' + app.get('port'));

})

 

이젠 깃헙에 올릴때랑 비슷합니다.

 

• # git init
• # heroku git:remote -a 프로젝트명
• # git add .
• # git commit -am "커밋내용"
• # git push heroku master

 

/.gitignore 파일생성 /node_modules 업로드안되게 작성해주시면 됩니다.

 

헤로쿠 실행

 

• # heroku ps:scale web=1 --app 프로젝트명
• # heroku open

 

헤로쿠에서는 nodeJS 를 지원하는만큼 pakage.json 을 보고 자동으로 필요한 모듈들을 설정해 주는것같습니다.

 

추가적으로

 

pakage.json

 

"scripts": {

"start": "node app.js"

},

 

 

"engines": {

"node" :"~10.14.2",

"npm": "~6.4.1"

}

수정 및 추가 해주셔야 합니다.

 

만약 버전이 안맞는다는 오류가 뜨면 버전을 업로드한다음에 다시 헤로쿠에 푸시해주면 됩니다.

 

 

code-reading 블로그에 방문해 주셔서 환영합니다.
댓글은 모두 환영하니 많이 달아주세요.