More than 5 years have passed since last update.

WebだけでGitHubからHerokuに空っぽのWebサービスを立ち上げてみた(Node.js)

Last updated at 2016-08-07Posted at 2016-07-23

WebだけでGitHubからHerokuに空っぽのWebサービスを立ち上げてみた(Node.js)

最近のHerokuって、Heroku Toolbeltインストしなくても、いいんだね。
HerokuからGitHubのリポジトリに接続してDeployできる様になってた。

という事で、Webブラウザだけで、GitHubにリポジトリ作って、Node.jsのファイルを置いて、Herokuに空っぽのWebサービスを立ち上げてみた。もちろん無料だ。

前提知識

Node.jsによるWebアプリケーション作成知識
npmを使って依存関係を解決する方法
HerokuやGitHubのサインアップ方法

準備

GitHubにサインインしよう
Herokuにサインインしよう

Gmailアカウント等で、GitHubとHerokuにサインインしよう。
アカウント持っていなかったらサインアップからやってね。

手順

GitHubにリポジトリ作ろう
Node.jsのファイルを作成しよう
Herokuでアプリを新規作成しよう
HerokuのアプリからGitHubリポジトリに接続しよう
HerokuでAuto Deploy設定してDeployしよう
Herokuアプリを開こう
GitHubにリポジトリ作ろう

クライアントのツール(Git関連ツール)でやっても良いけど、Webからできるね。

.gitignoreは言語に合わせてNodeなどを選んでおこう。
node_modulesとかリポジトリに保持して欲しくないもんね。

作成した直後は以下の様になった。良い子はREADME.mdも作ろう。

リポジトリはここに置いた。
LightSpeedC - lightspeedc-qiita-heroku1 - GitHub

Node.jsのファイルを作成しよう

とりあえず1行アプリでも作っておこう。

index.js

require('http').createServer((req, res) => res.end('hello')).listen(process.env.PORT || 3000);

Herokuでは、環境変数PORTでサービスしないといけないので、process.env.PORTでlisten()しよう。
listenの引数はportだけでいいみたい。
listenにhostnameまで追加するとHerokuでサービスできなくなるみたい。

npmのpackage.jsonは一応ちゃんと作ろう。
npm initでテンプレートを作ってからやると簡単だよね。

package.json

{
  "name": "lightspeedc-qiita-heroku1",
  "version": "0.0.0",
  "description": "lightspeedc-qiita-heroku1",
  "main": "index.js",
  "engines": {
    "node": "6"
  },
  "scripts": {
    "start": "node index",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "LightSpeedC/lightspeedc-qiita-heroku1"
  },
  "keywords": [
    "heroku"
  ],
  "author": "LightSpeedC",
  "license": "MIT"
}