Heroku를 이용한 Node개발 : Heroku 앱 생성과 deploy

Heroku X NodeJS

1. Heroku App 만들기 

---

이 글은 Heroku사의 Getting Started with Node.js on heroku 문서를 참고해 만들어졌습니다.

---

 

1. Heroku 로그인 

 개요 글에서 남긴 간단한 개발 요건들을 설치한 후 Heroku의 회원가입을 마치고나면 개발을 시작할 준비가 끝나게 된다. 글을 읽기전에 혹시나 NodeJS 혹은 Heroku Toolbelt가 설치되지 않았다면 먼저 설치해주길 바란다.  설치가 모두 끝난 뒤에는 먼저 Heroku Toolbelt에 계정을 로그인해두어야한다. 먼저 CMD를 실행해보자. 

 
  heroku login

 위의 명령어를 실행한 후 이메일과 패스워드를 입력해주면 이제 어플리케이션을 생성하고 관리할 수 있게된다. 

2. Heroku Application 만들기

 

 heroku측에서 제공하는 소스를 그대로 사용할 수 있겠으나 이 글에서는 바닥에서부터 웹을 만드는 과정을 기록하는게 목적이기때문에 어플리케이션을 생성하고 직접 업로드하고 올려보도록하겠다. 먼저 Application을 생성하려면 cmd에서 아래의 커맨드를 입력한다. 

heroku create YOUR-APP-NAME

 

 위의 커맨드를 입력하면 (heroku의 앱 이름 유효성의 벗어나지않는 경우) 간단하게 heroku application이 생성된다. "git@heroku.com:YOUR-APP-NAME"형식의 git 주소를 기억해두도록하자.

생성된 어플리케이션은 http://heroku.com에서 로그인한 후 대쉬보드에서 확인 할 수 있다.

3. git 

 

 Heroku앱을 만들고 나면 Heroku앱을 작업할 공간을 로컬에 만들어두어야한다. 먼저 cmd로 소스를 저장할 폴더로 이동한 후 아래와 같이 입력해주자 

 

// 해당 폴더에 git 초기화
git init
git clone https://git.heroku.com:YOUR-APP-NAME.git

 heroku의 git주소는 보통 git@heroku.com:YOUR-APP-NAME.git 형식으로 설정된다. 위와 같이 입력하면 현재 폴더로 heroku에 저장된 APP의 git을 가져오게된다. 물론 현재는 앱을 만든 후 아무것도 업데이트하지 않았기때문에 클론된 폴더안에 .git폴더 외에는 아무것도 들어있지 않다.

# 혹시 git clone이 정상적으로 작동되지 않는다면 heroku명령어로 소스를 가져올 수 도 있다.

heroku git:clone --app YOUR-APP-NAME

4. Heroku에서 실행할 Node 소스 코딩 

 이제 git을 초기화하고 git 폴더를 가져왔으니 Heroku에서 사용할 간단한 NodeJS소스를 로컬에서 먼저 작업해야한다. 간단히 콘솔에서 앱이 실행되는 상황을 확인하고 화면에 "Hello World"를 찍어주는 정도까지만 진행해보도록 하자.

// index.js
 
var express = require("express"),
 app = express();

// Heroku의 환경 변수 PORT가 존재하면 환경변수를 사용하고 , 없다면 5000포트를 사용하도록한다.
// 로컬에서 실행하기 위해 설정한다.
app.set("port" , (process.env.PORT || 5000));
app.listen(app.get("port") , 
  function(){ 
   console.log("APP IS RUNNING ON ["+ app.get("port") +"]");
 });

app.get("/" , function(req , res){
  res.send("Hello World!");
});

위 소스를 "index.js"라는 이름의 파일에 저장한 뒤에  npm으로 express를 설치 해주고 node로 index.js 파일을 실행하면 http://localhost:5000에서 HelloWorld라는 문구를 확인해 볼 수 있다. 이 정도면 동작을 확인 할 수 있는 간단한 nodeJS앱이 만들어진 것 같다. 

 하지만 Heroku에서 해당 앱을 실행하기 위해서는 추가적으로 package.json파일을 작성해주어야 한다. heroku의 git에 생성된 프로젝트가 어떤 엔진에서 돌아가는지 , 어떤 소스를 메인으로 실행할지, heroku앱이 스타트 되면 어떤 스크립트를 실행할지에 대한 설정이 되어있지 않기때문이다. package.json은 간단히 아래와 같이 작성 할 수 있다. 

{
    "name": "demo",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start" : "node index.js"
    },
    "dependencies" : {
        "express" : "~4.9.x"
    },
    "engines" : {
        "node" : "0.12.2"
    },
    "author": "GOMJA",
    "license": "MIT"
}

앱에서 기본적으로 express를 사용하니 dependencies에 express를 추가해주고 , main파일은 index.js로 사용하며 앱의 엔진은 node 0.12.2버전을 사용한다고 명시해 두었다.

5. Heroku에 소스 업로드 

 package.json파일과 간단한 node 소스를 작성하였으니 heroku로 파일을 업로드해야하는데, heroku는 ftp등을 사용하지 않고 기본적으로 git을 사용하고 있기때문에 해당 앱의 git으로 push해주어야한다. heroku앱으로 푸시 하기 위해서는 cmd에서 다음과 같이 입력해주면된다. 

git add .
git commit -m "YOUR COMMIT MESSAGE"
git push heroku master

이제 앱의 git으로 소스가 푸시되고 앱을 실행할 수 있게되었다. 혹시 git push heroku master문을 실행할 때 정상적으로 실행되지 않는다면 

git remote heroku -v

로 git의 환경을 설정해주자. heroku에 push하기 위한 설정을 git에서 자동으로 작업해준다. 

6. Heroku앱 실행하기 

 Node소스를 작업하고 서버에 업로드하였다면 이제 업로드된 heroku앱을 직접 실행해볼 차례다. cmd에서 다음과 같이 타이핑하자

heroku ps:scale web=1
heroku open

현재 작업중인 어플리케이션을 배포하고 인스턴트를 생성해준 후 , heroku 어플리케이션을 실행하도록한다. 2번째 줄을 실행하면 잠시뒤 자동으로 브라우저에 http://APP-NAME.herokuapp.com이라는 도메인으로 접근하게된다. 

 소스가 제대로 올라갔다면 로컬에서 실행한 화면과 동일하게 화면에서 HelloWorld를 출력해줄 것이다.