読者です 読者をやめる 読者になる 読者になる

"Diary" インターネットさんへの恩返し

いつもソースコードコピペばかりなので,みなさまへ少しばかりの恩返しを

ubuntuを開発環境にしてnode.js on herokuが動くまで



スポンサーリンク

f:id:azumami:20140402190826p:plain

Windowsに頑張ってherokubelt入れてがんばっていたけど、sshのところで上手くイカなかったので諦めた。vagrantで作ったubuntuを開発環境としてnode.js on herokuが動くまでやっとできたので記録として残します。

環境

windows 7
virtual box 4.3.4
vargrant 1.3.5
Ubuntu 12.04
nodebrew 0.7.2
node.js 0.10.26
express 3.5.1

vagrantのセットアップ

vagrantの仮想OSを管理するためのディレクトリを作成

C:\Users\<user>\Documents\Programing>mkdir vagrnt
C:\Users\<user>\Documents\Programing>cd vagrnt

ubuntuの定義の初期化

C:\Users\<user>\Documents\Programing\vagrnt>vagrant init precise32 http://files.vagrantup.com/precise32.box
A `Vagrantfile` has been placed in this directory. You are now
ready to `vagrant up` your first virtual environment! Please read
the comments in the Vagrantfile as well as documentation on
`vagrantup.com` for more information on using Vagrant.

percise32を指定した場合は「Ubuntu 12.04 LTS 32-bit」がインストールされます。
その他のOSはこちらを参照

vagrant起動とubutuイメージのダウンロード

C:\Users\<user>\Documents\Programing\vagrnt>vagrant up
Bringing machine 'default' up with 'virtualbox' provider...
[default] Importing base box 'precise32'...
[default] Matching MAC address for NAT networking...
[default] Setting the name of the VM...
[default] Clearing any previously set forwarded ports...
[default] Creating shared folders metadata...
[default] Clearing any previously set network interfaces...
[default] Preparing network interfaces based on configuration...
[default] Forwarding ports...
[default] -- 22 => 2222 (adapter 1)
[default] Booting VM...
[default] Waiting for machine to boot. This may take a few minutes...
[default] Machine booted and ready!
[default] The guest additions on this VM do not match the installed version of
VirtualBox! In most cases this is fine, but in rare cases it can
cause things such as shared folders to not work properly. If you see
shared folder errors, please update the guest additions within the
virtual machine and reload your VM.

Guest Additions Version: 4.2.0
VirtualBox Version: 4.3
[default] Mounting shared folders...
[default] -- /vagrant


git bash(Git for Windowsを事前にインスト-ル)でインストールしたディレクトリに移動し、「vagrant ssh」でログイン。

vagrant@precise32:~/donating-now$sudo apt-get install vim ・・・デフォルトではvim(テキストエディタ)が入っていないのでインストール
vagrant@precise32:~/donating-now$sudo apt-get install curl   ・・・デフォルトではcurlが入っていないのでインストール

node.js関連のインストール

nodebrewのインストール。

vagrant@precise32:~/donating-now$curl https://raw.github.com/hokaccha/nodebrew/master/nodebrew | perl - setup

上記でうまくいかない場合は以下を実行(https://github.com/hokaccha/nodebrew

curl -L git.io/nodebrew | perl - setup

環境変数の編集。一度ログインしなおし。

vim .bachrc

以下追加
export PATH=$HOME/.nodebrew/current/bin:$PATH

vagrant@precise32:~/donating-now$ exit

C:\Users\<user>\Documents\Programing>vagrant ssh

//環境変数が通ったことを確認
vagrant@precise32:~/donating-now$ nodebrew -v
nodebrew 0.7.2

インストールするnode.jsのリリースバージョン確認

agrant@precise32:~/donating-now$ nodebrew ls-remote

node.jsのサイトにあるダウンロードバージョンをインストール

vagrant@precise32:~/donating-now$ nodebrew install-binary  v0.10.26
fetch: http://nodejs.org/dist/v0.10.26/node-v0.10.26-linux-x86.tar.gz
######################################################################## 100.0%
Install successful

インストール後状態確認。current:noneとでるので、今は使えない。

vagrant@precise32:~/donating-now$ nodebrew ls
v0.10.26
current: none

使用node.jsバージョンの指定。current:の値が変わることを確認。

vagrant@precise32:~/donating-now$ nodebrew use v0.10.26
use v0.10.26
vagrant@precise32:~/donating-now$ nodebrew ls
v0.10.26

current: v0.10.26

node.jsのバージョン確認。

vagrant@precise32:~/donating-now$ node -v
v0.10.26

node.jsのフレームワークexpressのインストールとバージョン確認。"-g"でグローバルにインストール。

#4.x.xだとなんかうまくいかないので3.5.1で
vagrant@precise32:~/donating-now$  npm install -g express@3.5.1
vagrant@precise32:~/donating-now$ express --version
3.5.1

プロジェクト用フォルダ作成。

vagrant@precise32:~$ mkdir project
vagrant@precise32:~$ express donating-now

   create : donating-now
   create : donating-now/package.json
   create : donating-now/app.js
   create : donating-now/public
   create : donating-now/public/javascripts
   create : donating-now/public/images
   create : donating-now/public/stylesheets
   create : donating-now/public/stylesheets/style.css
   create : donating-now/routes
   create : donating-now/routes/index.js
   create : donating-now/routes/user.js
   create : donating-now/views
   create : donating-now/views/layout.jade
   create : donating-now/views/index.jade

   install dependencies:
     $ cd donating-now && npm install

   run the app:
     $ node app

プロジェクトディレクトリに移動し、上記ステップでdependenciesと書かれたコマンドを実行。

vagrant@precise32:~$ cd donating-now/
vagrant@precise32:~/donating-now$ npm install

ローカル上のnode.js動作確認

node.jsを開始。

vagrant@precise32:~/donating-now$ node app


vagrantはデフォルトでPCからのアクセスのルーティングが出来ていないので、別ウインドウからvagrant sshでログインしてhttpアクセスが出来るか確認。

vagrant@precise32:~$ wget http://localhost:3000

--2014-04-02 07:44:20--  http://localhost:3000/
Resolving localhost (localhost)... 127.0.0.1
Connecting to localhost (localhost)|127.0.0.1|:3000... connected.
HTTP request sent, awaiting response... 200 OK
Length: 170 [text/html]
Saving to: `index.html'

100%[======================================>] 170         --.-K/s   in 0s

2014-04-02 07:44:20 (26.0 MB/s) - `index.html' saved [170/170]

vagrant@precise32:~$ wget http://localhost:3000

vagrantのネットワーク設定

デフォルトでは、ポートが閉じているのでvagrantレベル、ubuntuレベルそれぞれでポート3000を開ける。
まず、vagrantレベル。vagrantのフォルダに有るVagrantfileを開きポートの設定をします。

$ vim Vagrantfile

以下の行を追加
--------------------------------------------
 config.vm.network :forwarded_port, guest: 3000, host: 3000
--------------------------------------------

続いてvagrant upでubuntu起動後、以下の設定

vagrant@precise32:~$ sudo iptables -A INPUT -p tcp --dport 3000 -j ACCEPT
vagrant@precise32:~$ sudo iptables -F

クライアントPC側のheroku設定

herokuのクライアントソフトherokubeltをインストール。

vagrant@precise32:~$ wget -qO- https://toolbelt.heroku.com/install-ubuntu.sh | sh


herokuの初期設定。

vagrant@precise32:~$ heroku login
Enter your Heroku credentials.
Email: xxxxxxxxx@gmail.com
Password (typing will be hidden):
Authentication successful.


Procfileの編集。

vagrant@precise32:~/donating-now$ vim Procfile
-- 内容 ---------------
web: node app.js
----------------------


gitignoreの編集

vagrant@precise32:~/donating-now$ vim .gitignore
-- 内容 ---------------
node_modules
.DS_Store
----------------------

package.jsonにenginesの部分を追加。

vagrant@precise32:~/donating-now$ vim package.json
------------------ここから--------------------------------
"engines": {
  "node": "0.10.26",
  "npm":  "1.4.3"
}
------------------ここまで--------------------------------
上のブロックのコンマ","忘れないように。
<||

gitで初期化。
>||
$ git init
$ git add .
$ git commit -m "initial commit"

herokuとgitのsshの設定。

vagrant@precise32:~/donating-now$ heroku keys
vagrant@precise32:~/donating-now$ ssh-keygen -t rsa -C "xxxxx@gmail.com"
vagrant@precise32:~/donating-now$ heroku keys:add ~/.ssh/id_rsa.pub
Uploading SSH public key /home/vagrant/.ssh/id_rsa.pub... done
vagrant@precise32: git remote add heroku git@heroku.com<アプリの名前>.git

herokuへアップロード。

vagrant@precise32:~/donating-now$ git push heroku master

http://<アプリの名前>.herokuapp.comへアクセスし、正常な旨表示されればOK!

f:id:azumami:20140402190027p:plain

その他

node.jsはプログラムを更新するたび、反映にするにはnode.jsサーバを再起動する必要がるので、プログラム変更があったら自動で再起動するためのプログラムをインストールします。nodemon "app名"で起動します。

$ npm install nodemon -g
$ nodemon "app名"


ejsテンプレートのインストール。

$ npm install ejs


以上