Heroku via Dropbox

Herokuのデプロイ方法に、Dropbox Syncが追加されていたらしいので、試してみる。

とりあえず、できるだけ簡単に、HTMLを設置して表示することを目指す。

前提

  • Dropboxアカウントを持っている。
    • なければ作ってください。
  • Herokuアカウントを持っている。
    • なければ作ってください。
  • なんか、シングルページのHTMLで、何かしら公開したい人。
    • プログラムを組む気はないし、Facebookとかで公開してればいいし、ぐらいな人。
  • HTMLを少しいじれる人。

Gitを使わなくて良くなるので、簡単なことはHerokuで、無料でできちゃう、とか思ってます。

手順

Herokuで新しくAppを作成する。

App = 新しいサイト、ということで、まずは設置場所をつくる。

ログインをして

f:id:sugilog:20150211192538p:plain

右上の「+」のリンクをクリックして

f:id:sugilog:20150211192548p:plain

Appの名前(サイト名っぽいのん)を入力する。

ここで入力した内容は、デフォルトでのサブドメインになる。

Dropboxと連携する。

予め連携したいDropboxのウェブサイトにログインしておくと良いです。

「Deploy」タブで「Dropbox」を選んで

f:id:sugilog:20150211192554p:plain

「Connect to Dropbox」な感じで進んで

f:id:sugilog:20150211192546p:plain

連携を承認して

f:id:sugilog:20150211192555p:plain

おわりです。

Dropboxをみると、Dropbox > Apps > Heroku > (入力したApp名)でディレクトリが作られる。

f:id:sugilog:20150211192545p:plain

ファイル設置

ここだけ、自分のパソコンで作業。

f:id:sugilog:20150211192551p:plain

ここでは、index.htmlindex.phpの2つのファイルを設定してみます。 Dropbox > Apps > Heroku > (入力したApp名) なディレクトリの下に置く感じ。

  • その他のディレクトリは無視ってください。

HerokuにDropbox経由でStaticなファイルを設置してみる

デプロイ

HerokuのDropbox Syncは自動的にデプロイされるわけではないので、Herokuの管理画面から作業が必要です。

  • おかげで、Dropboxにファイルを設置したまま、作業ができて便利。

「Deploy」タブの「Dropbox」から

f:id:sugilog:20150211192549p:plain

「Deploy Changes」のメッセージに変更内容の要約を入力して

f:id:sugilog:20150211192552p:plain

「Deploy」押して、少し待つと完了。

f:id:sugilog:20150211192543p:plain

表示されました。