カテゴリー別アーカイブ: middleman

about static site generator “Middleman”

Middleman v4 がリリースされました

先日不意にリリースされた v4 ですが, ドキュメント日本語版の更新が完了しドキュメントページに反映されています。個人的に重要だと思う点をまとめてみます。

https://middlemanapp.com/jp/

手をつける前に読むべきもの

Middleman ガイドのドキュメントに V4 アップグレードのドキュメントと, Middleman の開発リポジトリに CHANGELOG (英語) があります。

プレビューサーバ (middleman server) で SSL が使えるようになったりしているんですが記述がないことに気づきました。いくつかオプションがあるんですが簡単に使うには次のコマンドで動きます。

$ middleman server --https

細かいところではテンプレートや config.rb で使用していた page (カレントページを表す) は削除され current_resource を使うことようになりました。

v4-beta から使っていたのであまり何が変わったのか他には思い出せないので何か見つけた人はまとめてくれると助かります。

続きを読む

Middlemanの拡張gemをv4.beta.2対応してハマったこと

このところの Middleman の変更も落ち着いて来たようなので公開している Middleman の拡張機能をアップデートしてみました。

やったこと

  • v4.beta でも拡張機能が動作するように gemspec の依存関係を変更
  • .travis.yml から Ruby v1.9 関係の処理を削除
  • v4.beta.x と併用した場合に落ちるテストへの対応

続きを読む

仕事サイトをMiddleman v4.beta.2にしてみた

v4-beta がようやくリリースされたので自分の サイト を v4.beta.2 に変更してみました。正確には middleman/middleman の master ブランチを Gemfile に追加して利用しています。

続きを読む

外部APIを用いてMiddlemanで動的にページ生成する

Middleman には 動的ページ と呼ばれる機能があります。この機能は非常にパワフルでデータを元にして動的にページを生成することができます。

今回はこの機能を用いて外部 API からデータを取得しつつページを生成してみます。

外部 API を用意する

Lumenで簡単なAPI作ってみた で作成した API 機能を用いてテストしてみます。難しいことはなく単に次の画像のようなデータを JSON で返すだけです。データ自体は faker で作られています。

lumen-test-api response

この API をローカルの Vagrant 上で動作させています。

続きを読む

Middlemanでwikiっぽいことができたら便利だなと思ったからmiddleman-tansu v0.1.0をリリースした

tansu top

静的サイトのwikiっぽくページ間リンクをアレする何かを作っている | e2esound.com業務日誌

リンク先の記事の中で使っていたものを昨年中に update して, 1月中にだらだらとライブラリ化, そして 1/20 くらいから gem 化。先週の時点ですでに v0.0.1 以上を公開していました。それに手を加えて v0.1.0 をリリースしました。Middleman のプロジェクトテンプレートとして作られているので init する時に指定して使うことができます。

$ middleman init PROJECT --template tansu

その他の事項については README と init した後にサーバを立ち上げると細かい話が書かれています。現在 Middleman v4 beta に向けて開発が進んでいますが, 残念ながら今のところ v3 系限定の対応です。

tansu sample page

続きを読む

Middleman で絵文字を使うために middleman-gemoji を作った

middleman-gemoji

middleman-gemoji

実はすでに絵文字を実現できるらしい gem は公開されていたのですが, あまりメンテナンスされていないらしいこと, 絵文字画像のインストール処理をコマンドで追加したかったりといったところがあって新しく作ってみました。

絵文字の処理と絵文字画像については github の gemoji に依存しています。

続きを読む

Mac の Middlemanでbuild&deployしたページにアクセスできないトラブル

  • ファイルの生成は MacBook Air 上の Middleman 環境
  • 環境は さくらVPS + nginx 環境の web サーバ
  • middleman-deploy の rsync モードでデプロイ
  • http://hogehoge.com/パーフェクトRoR/1章.html のような URL にアクセスすると 404
  • それ以外のページは問題があったり, なかったりする

原因

デプロイしたファイルに日本語ディレクトリや日本語ファイル名が含まれる場合, UTF-8-MAC の文字コードの影響で 404 になってしまっていました。例えば「パ」が含まれると UTF-8 と UTF-8-MAC では異なる情報になるため, ファイルが探し出せず 404 となる。

対応

Middleman + SinatraでALOHA FISHMANSのサイトをリニューアルしました – blog.katsuma.tv の「濁点問題」のところにあるように rsync で --iconv=UTF-8-MAC,UTF-8 を渡すと手っ取り早く解決できるようです。

middleman-deploy の rsync モードには flags に rsync のオプションが渡せるので指定する。

# config.rb
activate :deploy do |deploy|
  deploy.method = :rsync
  deploy.host   = 'www.example.com'
  deploy.path   = '/srv/www/site'
  deploy.flags  = '--iconv=UTF-8-MAC,UTF-8 -avz'
end

これで問題なくアクセスできるようになりました。middleman-deploy 以外の場合には after_build でファイル名変換, 文字列変換する必要がありそうですね。

middleman-remover作ったのでついでに他の拡張にも日本語READMEつけた

middleman-remover

middleman-remover という gem を作りました。

こんなことができます。

  • $ middleman build を実行する際に build ディレクトリから特定のファイル/ディレクトリを削除できる
  • 削除するファイル/ディレクトリの設定にワイルドカードが使えたりする

今回から日本語版の README も追加する用にしたので, ご興味のある方は github の README.jp.md をご参照ください。

その他の拡張機能についても日本語版の README を追加しています。

国内でのユーザの利便性を考えればもっと早く用意しておくべきだったなと反省しています。

build 時に robots.txt を生成する gem を作った(middleman-robots)

ある Middleman を採用している案件で, クローラを拒否したいが source ディレクトリ以下に robots.txt を置きたくない事情があるものがありました。

middleman-robots を使うと直接 robots.txt を用意せずとも config.rb に設定を書くことで自動で作成してくれます。

続きを読む

静的サイトのwikiっぽくページ間リンクをアレする何かを作っている

「個人用の wikiっぽい何か」という表現が似合いそうな何かを作っている。

機能としては

  • markdown で記事を追加できること
  • ディレクトリ毎に記事を整理できること
  • 書いた記事の一覧が何らかの形でリンクされること
  • コードの syntac highlight が可能なこと

続きを読む