rcmdnk's blog
Last update

English ver.: New blog with Octopress + Octogray, in GitHub Pages

GitHubを使って色々管理をし始めた今日このごろ、 GitHubではGitHub Pagesとページが 簡単に作れるということを知って、 さらにしばらく調べていたらOctopressと 言うツールを使ってブログをGitHub Pages上でブログを作る、 と言うのが面白そうだったのでいっその事ブログも作って見ることにしました。

ということでまずは、導入メモ。 今回はMacとWindowsで作業を行ったのでそれらのメモです。

Sponsored Links

GitHubでの設定

GitHubのアカウントを作ります。 gitの導入なり、ssh-keyの登録なりは色々な所で紹介されているので省略。

アカウントが作成できたら、Create a new repoへ行き、 “username.github.com”というGitHub page用のレポジトリを作ります。

追記

今はGitHub Pagesのドメインが変わって、username.github.comではなく、username.github.ioが割り当てられるので、 リポジトリもusername.github.ioにすべきです。 Rakefileの中に、

branch = (repo_url.match(/\/[\w-]+\.github\.io/).nil?) ? 'gh-pages' : 'master'

という箇所がありますが、この箇所がgithub\.io/となっていればioレポジトリにしておかないと 実際に公開するのに少し手間が必要です。 (masterの代わりにgh-pagesというブランチにpushしてしまいます。 gh-pagesというのはGitHubで特別なブランチで、このブランチにあるものを GitHub Pagesの元、username.github.io/<repository>で公開できます。 USER.github.comはさらに特殊なレポジトリで、そこのmasterにあるファイルを username.github.io/で公開します。)

もし、古いOctopressでここがgithub\.com/の場合、 ここをioに直すか、username.github.comのレポジトリを使う必要があります。

追記ここまで

追記: 2014/07/09

最新のOctopressではRakefileの中でioだけじゃなく、comの場合もチェックして masterを使うようになってます。

追記ここまで

rubyのインストール

Macの場合 (rvmを使う)

現在使っているMacは2011年に買ったLionなのですが、 入っているrubyは1.8.7で、octopressには1.9.3以上が必要なので 新しいものをrvmを使って入れます。

rvmのインストールで、... bash -s stable --rubyとするとrubyも同時にインストール 出来るのですが、自分の環境だと

There is no checksum for 'http://production.cf.rubygems.org/rubygems/rubygems-2.0.2.tgz' or 'rubygems-2.0.2.tgz', it's not possible to validate it.
If you wish to continue with unverified download add '--verify-downloads 1' after the command.

There has been an error while trying to fetch the source.
Halting the installation.

と言うメッセージが出たので、別途入れることにしました。 現時点でrubyの最新版が2.0.0、これと同時にインストールされるrubygemが2.0.2で、 どうもこれが悪さしてるみたいです。 2.0.0でメッセージにあるように--veryfy-downloads 1をつけてもrubygemの インストールで失敗している様なので1.9.3をインストールすることにしました。

$ # rvm installl, ref: https://rvm.io/
$ \curl -L https://get.rvm.io|bash -s stable
$ # ruby install, also rubygems-1.8.25 (at this time) will be installed
$ rvm install 1.9.3

この時点ではPATH等が上記のコマンドによって自動的に設定されますが、 今後も$HOME/.rvm以下のrubyを使うように、bashを使っている場合は.bash_profile (または.bashrc.bash_profileから読み込む様にしてある場合は.bashrc)に

1
2
3
if [ -s $HOME/.rvm/scripts/rvm ];then
  source $HOME/.rvm/scripts/rvm
fi

を加えておきます。

Windowsでの設定

今回はCygwinを使って環境を作りました。 インストール時にはOctopress用に最低限

  • Devel:git
  • Ruby:全部

はインストールします。 gitをCUIで積極的に使う場合は

  • Utils:tig (gitのCUIブラウザー)

もインストールしておくと良いと思います。

Cygwinでsetup.exeでインストールされるrubyは現時点で1.9.3なのでそのまま使えます。 現時点で使っている物は

  • Cygwin 1.7.17
  • ruby 1.9.3p385
  • git version 1.7.9
  • tig version 1.1

です。

CygwinはRubyのためで、この他にもWindowsにインストールする方法としては

  • RubyInstaller: rubyを使えるコマンドプロンプトがインストールされる。
  • yari: Yet Another Ruby Installer、rvm などにinspireされたツールということらしいが、コマンドプロンプトからrubyをインストール出来る。(参考ページ)
  • これらの場合には別途GitまたはGitHub Clientも必要。 また、
  • MinGW: Cygwinからフォークして出来たUnix環境を作るソフト。

といったものもあります。

CygwinでOctopressをインストールする時、下にある bundle installposix-spawnをインストールする時に 上手く行かないのでこれだけ先に別にインストールしておきます。

追記: 2014/11/12

現時点でposix-spawnのバージョンは0.3.9で、これは Windowsでbundle installで問題なくインストールできます。 なので、下記のコマンドはやらなくても大丈夫です。

追記ここまで

$ # for cygwin only
$ cd ~/tmp # anywhere tmporally space
$ gem install rake-compiler
$ git clone git://github.com/rtomayko/posix-spawn.git
$ cd posix-spawn
$ vi lib/posix/spawn/version.rb
$ # change     VERSION = '0.3.7' to     VERSION = '0.3.6'
$ rake gem
$ #gem install pkg/posix-spawn-0.3.6
$ #gem install pkg/posix-spawn-0.3.7.gem
$ gem install pkg/posix-spawn-0.3.6.gem

追記: 2013/11/07

posix-spawnが0.3.7になってたのと、installのところで.gemが抜けてたのを 訂正。

追記ここまで

追記: 2013/11/31

インストールしただけでキチンと使ってなかったので色々ダメなままだった。。。

デフォルトGemfileのままだと、posix-spawn-0.3.6 が呼ばれますが、GitHubのレポジトリの最新版は上に書いた様に0.3.7です。

これはWindows用のBugfixみたいです。

Version bump to 0.3.7 for Windows backtick fix

もし、0.3.7をインストールした場合、Gemfileに

"posix-spawn", "~> 0.3.7"

を書き加えて最初に必ずbundle updateをする必要があります。

ただ、Macと共有のGemfileを使いたい場合、 RubyGemsに登録されてるものがまだ0.3.6なので 0.3.7にしてしまうとMacにも直接インストールしなくてはいけなくなります。

posix-spawn RubyGems.org

で、ちょっとやってみたところ、最初からつまづきました。

$ rake gem
rake aborted!
cannot load such file -- rake/extensiontask
./posix-spawn/Rakefile:17:in `<top (required)>'
(See full trace by running task with --trace)

ちょっと面倒なのと、出来ればRubyGemsの定義だけでやりたいし、 上の0.3.7への変更は特にWindowsだけのためっぽいので (だからRubyGemsもアップデートされてない?) Macでは0.3.6でやりたい。

ので、ちょっと無理矢理ですが、Gemfileなどはそのままにして、 Windowsでインストールする時に無理やりVersionを0.3.6と認識させます。

上のインストールのところにあるように、Version情報は lib/posix/spawn/version.rbにあるので、これを書き換え、後は 同じ様に0.3.6としてインストール。

これで、Windowsの場合とMacの場合で同じくposix-spawn-0.3.6で使えます。

GitHubレポジトリにある古いのを無理やり持ってきても良いかもしれませんが、 Windowsに関するBugfixで入れておいた方が良いので新しいものを使った方が 良いと思います。

一つくらいのパッケージならこのような無理やりな変更も許されるだろう、、、ということで。

追記ここまで

もしrake gemの所でエラーが出るようなら、もう一度、Cygwinのsetup.exeで Ruby等が全て最新になっているか確認してみてください。 全てUpdateしなおすと上手く行くこともあります。 それでも上手くいかない場合は個別に上手く行くバージョンを調べて インストールしたりする必要があるかもしれません。

Octopressのインストール

Octopressをcloneしてきてインストールします。

$ cd /path/to/octopress/install/dir
$ git clone git://github.com/imathis/octopress.git octopress
$ cd octopress

公式のsetupページにもあるように、 rvmを使っている場合はcdした時に、octopress内の.rvmrcをtrustするか聞かれるので yesとします。

$ gem intall bundler
$ bundle install
$ rake install

もしここで、rake aborted!と出たら、(rakeのバージョン云々のメッセージとともに)

$ bundle update

を一度実行してからもう一度rake installすればインストール出来るとおもいます。

ここまで出来たら、試しにrake previewとコマンドを打ってみると

$ rake preview
Starting to watch source with Jekyll and Compass. Starting Rack on port 4000
....

と始まるので、ブラウザでhttp://localhost:4000/ を開いてみます。 そうすると”My Octopress Blog”と言ったタイトルのブログページが見れると思います。

rake previewコマンドはHTMLにコンバートするrake generateコマンドも 同時に行うので、 いきなりpreviewコマンドを叩いてもちゃんとそれまで編集した物が反映されています。 さらにsourceを監視している様で、previewしながら記事を編集すると 即座にページを作成してくれるのでブラウザを再読み込みすると直ぐに ローカルで編集したものがチェック出来ます。

記事やページを作る

新しいブログ記事を作るには

$ rake new_post["test post"]

とするとsource/_posts/YYYY-mm-DD-test-post.markdownと言うファイルができるので それをMarkdown形式で編集します。

新たなページを作るには

$ rake new_page["test-page"]

とするとsource/test-page/index.markdownと言うファイルができるので、これも Markdown形式で編集します。 ページの方はBlog上に直接リンクが貼られないので必要ならばリンクを どこかに書いておく必要があります (Octopressのページの作成)。

rake previewしてみるとtest postと言うタイトルの記事がpostされているのが分かります。 さらに、http://localhost:4000/test-page にアクセスしてみると、 Test Pageと言うタイトルのページが表れるはずです。

preview中に記事を編集しても即座にブラウザをリロードすれば反映されるので 常に確認しながら書くことも可能です。

ちなみに、最初にnew_postなどに使うタイトルがファイル名に使われるので、 ここでは日本語は使えない様です。 タイトル自体は出来たファイルのYAML Front Matterブロック(ファイル上部の---で囲まれた部分) にあるtitleの値を編集すれば日本語に出来ます。

日本語の記事に関しては、utf-8にエンコードされてないと文字化けします。

GitHubとOctopressを繋げて記事を公開する

$ rake setup_github_pages

とコマンドを打ってレポジトリ ([email protected]:username/username.github.com)を入力すればOK。

この作業で作業ブランチがmasterからsourceに変わります。 ただし、Projectページ(username.github.com以外の通常レポジトリを指定した場合) はmasterのままとどまるので下に各sourceの管理、のところとかで ブランチ名に注意する必要があります。

追記

同上。 [email protected]:username/username.github.ioを入力。


次にブログを実際に作ってGitHubへpushします。

$ rake generate # convert to html
$ rake deploy   # publish (push to GitHub)

これで暫く経ってからusername.github.com(username.github.io)にアクセスすると ブログが出来ていのが確認出来るはずです。

追記ここまで

追記

もし、ブログが見えない場合、GitHubのusername.github.io等のレポジトリを 調べて見てください。上に書いたように、masterにpushする代わりに、 gh-pagesにpushされてる可能性があります。 その場合、Rakefileを上の様に確認し、_deployを削除して再度 設定しなおして見てください。 GitHub上のusername.github.iogh-pagesブランチは消してしまっても構いません。 (一番最初ならレポジトリ毎消して再度作りなおしても構いません。)

追記ここまで

この2つのコマンドは

$ rake gen_deploy

で一気に行う事も可能です。 ただし、gen_deploygenerateが失敗した場合でもdeployを実行するので、 generate失敗時な形で投稿されてしまうことがあります。 さらに、下にあるpublishedのステートメントは最後の方に判断されるらしく、 例えば後で投稿しようと思っている下書きが他にあって、 今書いているものを投稿しようとしてその時にgen_deployすると、 中途半端な今の記事と後で投稿する予定の下書きの方も送られてしまうことがあるので ちょっとした変更とか以外は一回ちゃんとgenerateした方がよいです。

previewで見ながら編集していた場合には既にページが出来ているのでrake deploy するだけでもOKです。 ただし、preview中に大きな編集(テーマを変えたり)するとたまにgenerate が上手く行かなくなってページがおかしくなるので、そいういった場合は 別途rage generateしてやればちゃんとページが作成されます。

下書きをdeployしないようにする

一部下書きがあって完成してない状態でも、他の部分だけを公開したい時も あると思いますが、その場合は

published: false

をYAMLブロックに加えるとそのファイルはpreviewでは見れますが、deployされません。

sourceの管理

Octopressのインストラクション だとsouceにあるMarkdown形式のファイルもGitHubで管理する様になっていますが、 無料版だと元のファイルそのものが公開になってしまいますし、 下書きの段階でもバックアップしておこうと思うと 公開されてしまいます。 さらにgitの管理の面でも面倒が起こったりするとのことなので (Octopressのインストールから運用管理までにとても詳しく書いてあります) 他の人を真似てsourceはBitbucketの方で管理します。 BitbucketはGitHubと同じような要領でssh keyの登録やレポジトリの作成が出来ますが、 無料で非公開のレポジトリを作ることが出来ます。

Bitbucketの方で、username.github.com (管理しやすいようにGitHubのページと同じ名前のレポジトリにしましたが、何でもOKです) をprivate repository (Create a new repositoryのページで This is a private repositoryにチェックを入れておく)として作ります。

Butbucketのリモートレポジトリを登録します。

$ git remote add bitbucket [email protected]:username/username.github.com.git
$ git push -u bitbucket source

これで何か書いたら

$ git add .
$ git commit -m "comment"
$ git push

でBitbucketの方に記事のバックアップがとれます。

Bitbucketをあまりちゃんと使ってなかってんですが、 Bitbucketだとdiffがside-by-sideでも見れますね。 GitHubもそのうち出来るようになってもらいたい…

管理のまとめ

  • 記事を書くには

      $ rake new_post["title"]
    

    でファイル(source/_posts/YYYY-mm-DD-test-post.markdown)を作成して、それを編集する。

  • ブログのポストとは別にページが作りたい場合は

      $ rake new_page["title"]
    

    で新たなページを作り、source/title/index.markdownとして出来たファイルを編集 したりしてページを作る。

  • 書いたらプレビューしてみる

      $ rake preview
    

    を走らせて、http://localhost:4000/をブラウザで開く。 途中で変更しすぎておかしくなったら一度generateする。

      $ rake generate
    
  • 記事の元のファイルをバックアップしたいときはBitbucketに送る

      $ git add . # or files what you want to backup
      $ git commit -m "comment"
      $ git push
    
  • 出来たらGitHubに送って公開する

      $ git generate
      $ git deploy
    

    または

      $ git gen_deploy
    
  • 暫く使ってると色々キャッシュが溜まってくるので

      $ rake clean
    

    をすると

      $ rm -rf .pygments-cache/** .gist-cache/** .sass-cache/** source/stylesheets/screen.css
    

をしてくれます。

追記: 2013/10/04

どうもデフォルトのままだと上手くclean出来てないようでちょっと Rakefileを変更する必要があります。

Ref: rake+cleanの+不具合?

追記ここまで

  • gitの話ですが、暫く使っているとgitの管理ファイル(.git内)もどんどん肥大化していってしまうので、 気が向いたら

      $ git gc
    

    を行うと不要なファイルを削除したり最適化を行なってくれます。

Sponsored Links
Sponsored Links

Octopressで最初に行う設定変更 »