Octopressでカテゴリーの一覧みたいのを実装する

2012-08-10 Octopress, 日本語, ゴ

Octopressはそれなりに高機能なのにも関わらず、なぜかカテゴリーの一覧を表示する機能がありませんでした。仕方ないので、自分で実装することにしました。今回の記事は、次の画像のようなカテゴリーの一覧をサイドバーに表示するまでのメモです。前提知識として、Octopressのサイドバーをカスタマイズするためには、次の2つの作業が必要です。ここでは、categoriesという名前のサイドバーを追加します。 source/_includes/asides/categories.htmlというファイルを作る。 _config.ymlのdefault_asides:にasides/categories.htmlを加える。ex. あとは、1,のsource/_includes/asides/categories.htmlにカテゴリーの一覧を表示する機能をうまく実装しなくてはなりません。 siteというグローバル変数のダンプを手がかりに、site.categoriesというハッシュが存在することがわかりました。 JekyllのLiquidテンプレートエンジンの文法がよくわからないので、以下のサイトなどを参考にして学習しました。 http://wiki.shopify.com/UsingLiquid http://melborne.github.com/2012/05/13/first-step-of-jekyll/ for item in hash すると、item[0]にキー名、item[1]に値が入るしかし、site.categoriesはカテゴリー名をキーとして値が記事の本文のHTMLへの参照(?)の配列としたハッシュになっており、そのままではURLが取得できず、カテゴリー名からURLに変換する処理をLiquidの文法だけで実装するのは無理だと気が付きました。で、どうしたかというと、Liquidを拡張しました。Jekyll::Filtersにメソッドを定義すると、Liquidからそのメソッドを呼び出せるようになります。最終的に、_config.ymlを編集後、 source/_includes/asides/categories.htmlとplugins/category_generator.rbを次のようにしたら、うまくいきました。 source/_includes/asides/categories.html source/_includes/asides/categories.html はこれだけです。 {.{ の.は消してください。 <section class="well"> <ul id="categorys" class="nav nav-list"> <li class="nav-header">Categorys</li> {.{ site.categories | site_categories_links }} </ul> </section> plugins/category_generator.rb plugins/category_generator.rbのJekyll::Filtersにsite_categories_linksというメソッドを追加します。 module Jekyll module Filters # Outputs a list of categories as comma-separated <a> links. This is used # to output the category list for site’s all categories.

Ruby 1.9を使ってアスキーコードを取得する方法

2012-08-09 Ruby, tips, ASCII

Ruby 1.9を使ってアスキーコードを取得する方法です。次のように、bytesメソッドを使えばいいです。

# Ruby1.9
"ABC".bytes.to_a # => [65, 66, 67]

なお、上記のコードはRuby1.8では動きません。

Ruby1.8でアスキーコードが欲しい場合、[]で取得できますが、あまりこの動作は美しくないですよね。

# Ruby1.8
?A # => 65
"A"[0] # => 65

cocotで文字コードが異なるマシンにsshする

2012-08-06 ssh, coins, cocot, Mac OS X

私が所属している情報科学類(略称coins)では、24時間いつでもsshできるiMacがあるのですが、文字エンコーディングはEUC-JPです。

一方で私のノートPCの文字エンコーディングはUTF-8なので、普通にsshすると文字化けしてひどいことになってしまいます。

cocotという端末(tty)とプロセスの間に割り込んで、文字コード変換を行うツールがあるので、これを使うことで文字化けが解消します。

OS Xを使っていれば、cocotは普通にhomebrewからインストールできます。

brew install cocot # cocotをインストールする

UTF-8環境からEUC-JP環境にsshする場合、次のようにすればいいです。

# cocot -t コンソール側の文字コード -p プロセス側の文字コード -- 使いたいコマンド
cocot -t UTF-8 -p EUC-JP -- ssh coins

頻繁にsshする場合、次のようにエイリアスを作ればいいかと思います。うーむ。エイリアス名は検討の余地がありそうです。(汗)

alias sshe='cocot -t UTF-8 -p EUC-JP -- ssh' #EUC-JP環境にsshする
sshe coins

Mountain Lionにアップデートしたら、X11が消えた件

2012-08-04 Mac OS X, Mountain Lion, X11, trouble

この前Macを使い始めたばかりでしたが、無料でアップデートできると知って、 Mountain Lionにしてしまいました。

しかし、Mountain Lion にしてから困ったことに、 wineやinkscapeといった、X Window Systemを必要とするアプリケーションがすべて動かなくなってしまいました。

調べてみると、Moutain Lionから標準でX11がインストールされなくなったようです。

X11の代わりに、OS X用のXQuartzというXウィンドウシステムがあるので、これをインストールして再起動すれば、解決します。

X11はバグがあるらしいので、Moutain Lionじゃない人もXQuartzに乗り換えてもいいかもしれませんね。

Macを使い始めて最初に入れたアプリケーションたち

2012-08-01 Mac OS X, Lion

Mac Book Airを使い出してから、1週間を経過しました。まともにMacを使ったことがなかったのですが、1週間でかなり慣れました。ひとまず、1週間の間にインストールしたソフトをまとめてみます。こんなのも便利だよというのがあれば教えてください。 Google日本語入力ことえりは正直に言って、残念なIMEでした。 Windows時代にもお世話になり、Ubuntu時代にもMozc(goolge日本語入力のOSS版)を使っていたので、もちろんMacでも導入しました。 KeyRemap4 MacBook Mac界隈では有名なキーリマッパーらしいです。 Xmodmapでキーリマップすることを早々に諦めて正解でした。このソフトのすごい点は、xmlファイルを編集することで、独自のリマップ設定を作ることが可能なので、自由度がすごく高いことです。ひとまず、「英数」キーを日本語入力と英数入力のトグル、「かな」キーをdeleteに割り当てました。 LockTight Macでは、なぜかスクリーンロックを行うショートカットが存在しないようなので、仕方なく導入しました。物理アカウントハックされたら困りますからね。 CheatSheet コマンドキーを長押しすることで、現在割り当てられているショートカットを表にして表示してくれるという有り難いユーティリティです。私のように、Macを使い出したばかりの人にとっては神アプリでした。 Google Chrome ブラウザはChromeを最近使ってます。環境の移行もgoogleアカウントがあれば終わるので楽ですからね。 Googleに依存しすぎて怖いｗ DropBox なんかかんだで便利ですよね。 muCommander 2カラムのファイラーが欲しくなったので入れました。 Finderが使いにくという人はぜひ。 Picasa Googleの写真編集・管理ソフトです。なんだかんだで使いやすいです。 Linux版が開発中止になってしまったので、Ubuntuでは使えなくて苦労しました。 RDC(Remote Desktop Connection) MacからWindowsにリモートデスクトップするためのソフトです。学校のWindowsマシンをホストにする予定でしたが、節電中でまだ使えてません。ワロタ。 SimpleCap スクリーンショットするためのソフトです。使い勝手がいいです。 Skype Linux版のUIが微妙すぎたので、Mac版はけっこうまともに見えます。 YoyuFukurou Twitterクライアントです。 TwitterはWeb派ですが、時々使います。 Magican Macシステム用の最適化ユーティリティソフトです。 128GBのSSDでは容量が足りなくなることは明らかなので入れました。重複ファイル検索などは便利ですが、開発用のパソコンで使うのはリスキーな気がしてまだ使ってません() 開発用 Xcode4.4 入れました。ちなにみ、Xcode4.4からgccを入れるのはお勧めしません。代案として、次で紹介するosx-gcc-installerを使ったほうが良かったと思いました。なお、Xcodeからgccを入れるためには、Xcodeをインストールしたあと、 Xcode-> Preferences-> Downloads から、Command Line Tools をインストールすればよいです。 osx-gcc-installer 最終的にはこのインストーラでgccを入れました。特に問題は起きていません。 FileZilla 有名なFTPクライアントです。Macでもちゃんと使えました。

Mac(Lion)でアプリケーション内でウィンドウを切り替える方法

2012-07-29 Mac OS X, Lion

Macでは、Comand + tabなどで、アプリケーション単位の切り替えができますが、同一アプリケーションで複数のウィンドウを開いているときに、どうやってウィンドウを切り替えるのかがわかりませんでした。

調べてみると、OSの標準機能で同一アプリケーション内のウィンドウを切り替える機能がありました。

次のウィンドウを操作対象にする

環境設定 > キーボード > キーボードとショートカット > キーボードと文字入力 > 次のウィンドウを操作対象にする

このような機能があるので、これに任意のショートカットを割り当てれば良いです。

私の場合、option + tabに割り当てることにしました。

これで、Chromeで複数ウィンドウを開いているときなども、簡単にウィンドウを切り替えることができるようになりました。

Linux(Ubuntu)からOS Xへ開発環境を移すときにしたこと

2012-07-28 Mac OS X, Lion, Terminal.app, vim, homebrew, git

とりあえず次のような感じになりました。ターミナル :Terminal.app エディタ :vim パッケージ管理システム :homebrew バージョン管理システム :git Mac初心者が躓かないように、この順番で作業すればうまくいくという順番で紹介していきます。 Terminal.app Terminal.appはMacOSに標準で入っている端末です。最終的にはこんな感じになりました。外観を変える外観を変えるために、環境設定 > 設定でProという設定を使うことにしました。フォントをMonaco 13pt.にして、テキストをアンチエイリアス処理を有効にしました。 .bash_profile を設定するこれまでの常識では、~/.bashrcに書いた設定が端末の起動時に読み込まれるものと思っていたのですが、 macの場合は~/.bashrcは無効になっており、ログイン時だけ~/.bash_profileが読み込まれるようです。要するにMacのTerminalの設定は~/.bash_profileに書けばいいということです。設定の反映が必要であれば$ source ~/.bash_profileを実行すればいいことなので、ログイン時でも端末起動時でもそれほど影響はないです。前の環境の.bashrcは禍々しくて見せられませんが、.bash_profileをこんな感じで書いていきます。

307 export CLICOLOR=1 export LSCOLORS=DxGxcxdxCxegedabagacad # プロンプトも色を付ける PS1=’[\033[36m][\u@\h:[\033[33m]\w[\033[36m]][\033[0m] \$ ‘ exitでタブやウィンドウを閉じるようにするなぜかデフォルトではexitしても画面が残ってしまうので、設定を変えます。

~/Library/Preferences/com.apple.Terminal.plistのRoot > Window Settings > (任意のテーマ) > shellExitActionの値を1(Number)に変更します。 Mac OSXでTerminalをexitしたら閉じるようにする方法を参考しました。

MacでRuby on Railsの開発環境を作るまで

2012-07-27 Mac OS X, Ruby on Rails, rvm, gem, gcc, xcode, llvm-gcc

MacでRuby on Railsの開発環境を作るまで先日、1世代前のMac Book Air 13インチモデルを入手しました。設定を弄りまくっている真っ最中ですが、まずはMacでRuby on Railsの開発環境を作るまでをまとめます。今回の記事を一言でまとめると、「RAILSINSTALLERは神」です。おおまかな手順を説明すると、次のような感じです。せっかくなので、正解と失敗の２通りの方法を紹介します。失敗 Xcode4.4経由でgccを入れると、LLVMベースのgccが入ってしまい、rvmでコケます。 XcodeをAppStoreからインストールする。 Xcode-> Preferences-> Downloads から、Command Line Tools をインストールする。 (ここでなんとなくhomebrewをインストールする。) rvmを公式ページのように$ curl -L https://get.rvm.io | bash -s stable –rubyとかでインストールする。 rvmのインストールは完了するが、rubyのコンパイルに失敗する。 $ rvm requirementsをしたら、Xcodeを4.1にダウングレードするか、Xcodeをアンインストールしてosx-gcc-installerをインストールしろと言われる。 Xcodeを入れなおすのも消すのもめんどくさい＼(^o^)／ｵﾜﾀ正解最初からRAILSINSTALLERを使っていれば、これだけで終了しました。Xcode4.4と共存もできます。 RAILSINSTALLER でrvmをインストールする。 rvmでrubyをインストールする。 rvmで適当にgemsetを作って使う。 3.で作ったgemsetに、gemでrailsを入れる。正解例を詳しく RAILSINSTALLER でrvmをインストールするリンクからRailsInstallerをインストールします。 GUIでとっても簡単にインストールできます。ゆとり仕様です。あまりちゃんと確認しませんでしたが、この段階で最新のRubyとRailsが入った環境になります。最新でないRubyやRailsが欲しいときは、次のような感じで作業すればいいと思います。 rvmでrubyをインストールする Ruby1.9.2が欲しければ、$ rvm install 1.9.2をします。なんで1.9.2にしたか言うと、Octopressを使いたいからです。ご了承ください。 rvmの超基本的な使い方 rvm listでインストールしたrubyの一覧を表示します。 $ rvm list rvm rubies ruby-1.

ServersMan@VPSでRubyのCGIを実行するまでのメモ

2012-07-26 Apache, ServersMan@VPS, Ruby, CGI

ServersMan@VPS(Ubuntu)でRubyのCGIを実行するまでのメモです。

apache2をインストールする

apt-getかaptitudeでインストールすればいいと思います。

sudo aptitude install apache2

AddHandlerを設定する

/etc/apache2/mods-enabled/mime.confにAddHandlerを設定します。

#AddHandler cgi-script .cgiという行があるので、見つけてコメントアウトを解除して、次のように書き換えればいいと思います。

AddHandler cgi-script .cgi .rb

Options +ExecCGIを設定する

/etc/apache2/sites-available/defaultでOptions +ExecCGIを設定します。

<Directory /var/www/html/>
    #Options Indexes FollowSymLinks MultiViews 
    Options Indexes FollowSymLinks MultiViews ExecCGI
    AllowOverride None
    Order allow,deny
    allow from all
</Directory>

apache2を再起動する

上の2つのファイルを編集したら、apacheを再起動して設定を反映させます。

sudo /etc/init.d/apache2 restart

Ruby CGIのパーミッションを755にする

cd /var/www/html
chmod 755 test.rb

これでたぶん動くようになります。

ね？簡単でしょ？

うまくいかないときは

/var/log/apache2/error.logのエラーメッセージを見ましょう。

Octopressでbootstrap-themeにしたとき、sass/custom/_styles.scssが反映されなくなった件について

2012-07-24 Octopress, CSS, SASS/SCSS, theme, bootstrap

Octopressでbootstrap-themeにしたとき、sass/custom/_styles.scssが反映されなくなった件について前回、Octopressのテーマをカスタマイズするという記事で、 Octopressにbootstrap-themeを導入しました。 If you want to add or override styles, edit sass/custom/_styles.scss. This stylesheet is imported last, so you can override styles with the cascade. 上の文はOctopressの公式からの引用で、本来であればsass/custom/_styles.scss に書いたSCSSが最終的にオーバーライドされて適用されるはずです。しかし、このテーマを導入してから、sass/custom/_styles.scssに書いたSCSS(CSS)が反映されなくなってしまいました。 OctopressのCSS生成の仕組み Octopressでは、sass以下のディレクトリにある.scssファイルを読み取り、最終的なCSSを生成しているようです。(たぶん) SCSSとは、CSSメタ言語のことで、要するにCSSを生成するための言語です。本題のsass/custom/_styles.scssが反映されない原因は単純で、 sass/bootstrap/bootstrap.scssを見たら、sass/custom/_styles.scsがimportされていませんでした。というわけで、sass/bootstrap/bootstrap.scssの最終行に次のような感じでimport文を追加することで解決します。 // Custom @import "custom/colors"; @import "custom/fonts"; @import "custom/layout"; @import "custom/styles"; 後は、sass/custom/_styles.scsに好きな設定を書けばOKです。ひとまず、こんな感じにしました。 // This File is imported last, and will override other styles in the cascade // Add styles here to make changes without digging in too much div.