Node.js
Express
openshift
kubernetes

openshiftでデモアプリをホスティングする

More than 1 year has passed since last update.

合同会社kumanoteのTanakaです。

openshiftを使って、小さなWebアプリを作る機会があり、そのときのメモをご紹介します。

無料でサーバーをつくって、軽くデモをするときなどに便利です。

openshiftとは?

Openshiftは、redhat社が展開するクラウドサーバーのサービスです。

(GoogleやAWSなんかと同じような感じですね)

使ってみた感想としては、以下です。

  • Googleさん の Google Container Engine に近い
  • redhatさんのKubernetes愛を感じる
  • 学習コストがやや高く、小さなアプリ公開にはむかない
    • Kubernetes を多少理解している必要がある
    • Openshift の Document は 豊富なのですが、最初に来た人にはとっつきづらい
    • 一度理解してしまえば、demoやるときは最速かも(今後もことあるごとに利用させていただきたい)

実施したこと

以下実施したことを記載します。
今回は、デモページを公開したかったので・・
最終的なゴールは静的ファイル(html/image/css/js)の配信を行うサーバーを立てるまでになります。
(・・が、db等も使えるので、簡単なアプリケーションは、無料で作れてしまう機能が備わっています。)

sign up

まずは登録からですね。
ここから登録できます。
クレジットカード登録不要です。

※ 1 project 無料で、72時間毎に18時間sleepするらしいので、商用利用はほぼ不可能です。

スクリーンショット 2017-08-20 14.29.16.png
スクリーンショット 2017-08-20 14.32.12.png

プロジェクトの作成

web consoleが開いたら、全てGUIでプロジェクトを作成できます。

スクリーンショット 2017-08-20 14.40.12.png

プロジェクトの概要を入力します
スクリーンショット 2017-08-20 14.41.48.png

JavaScriptを選択します
スクリーンショット 2017-08-20 14.42.22.png

Node.js v6 を選択します
スクリーンショット 2017-08-20 14.42.30.png

デプロイしたいGithubのリポジトリを入力します
private repository OKです → その場合、githubのリポジトリにデプロイキーを登録して、sshのprivate keyをopenshiftのプロジェクトに登録する必要があります。
また、githubにwebhookを登録することもでき、ブランチをpushしただけで、ビルド〜デプロイが自動化できるのも魅力でした。
スクリーンショット 2017-08-20 14.51.04.png

これだけで動きます。結構すごいです。
ただ、動作原理がわかるまでかなりの時間を使いました。Documentをもう少しわかり易くしてほしいです。。

以下、僕なりの理解です。

  • openshiftはソースコードからコンテナイメージを動的に作成する機能(s2iというらしい)がある
  • 上のように、カタログを選択した(nodeのtemplateを使った)場合は、npm install後、プロジェクトルートのnpm startを動かすコンテナイメージが勝手に作られる
    • つまりpackage.jsonstart scriptかいとけば、勝手にimageがつくられる ← これがわかるまで四苦八苦しました。
  • 上のように、カタログを選択した(nodeのtemplateを使った)場合は、カタログにて定義されたserviceやpodが勝手に立ち上がり、サービスが公開される。

ソースコードのアップ

以下だけ、要点をかいつまんで

  • package.json

scripts.startを記述して、server.jsを呼ぶようにしました。

{
  "name": "kumanote-test",
  "version": "1.0.0",
  "description": "",
  "author": "kumanote,LLC.",
  "main": "server.js",
  "private": true,
  "scripts": {
    "dev": "node build/dev-server.js",
    "build": "node build/build.js",
    "lint": "eslint --ext .js,.vue src",
    "test": "IP=0.0.0.0 PORT=3030 mocha --timeout 5000 tests/*_test.js",
    "start": "node server.js"
  },
  "dependencies": {
    "chai": "^3.5.0",
    "chai-http": "^2.0.1",
    "mocha": "^2.4.5",
    "express": "^4.13.4"
  },
  "engines": {
    "node": ">= 4.0.0",
    "npm": ">= 3.0.0"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}
  • server.js

dist配下に公開したいファイルを配置しました。
また、portipprocess.env.OPENSHIFT_NODEJS_PORTprocess.env.OPENSHIFT_NODEJS_IPの指定が必要みたいです。

var express = require('express'),
    app     = express();

var port = process.env.PORT || process.env.OPENSHIFT_NODEJS_PORT || 8080,
    ip   = process.env.IP   || process.env.OPENSHIFT_NODEJS_IP || '0.0.0.0';

app.use(express.static(__dirname + '/dist'));

// error handling
app.use(function(err, req, res, next){
  console.error(err.stack);
  res.status(500).send('Something bad happened!');
});

app.listen(port, ip);
console.log('Server running on http://%s:%s', ip, port);

module.exports = app;

以上になります。