middleman 〜簡易版Railsみたいなやつ〜

Last updated at 2019-12-15Posted at 2019-12-15

個人サイトでも作ろうかなーと思って、
でもWordPressやるのはコスト高いし、ブログはちょっと違うような気もするし・・、
HTMLをゴリゴリ書いていくのも、slimになれたおじさんにはストレスがマッハなので、いい方法がないか調べてたら middleman ってものがあった。

middleman とは

middleman は静的サイトをRubyで作るためのフレームワークです。
RubyOnRails と似ていて、Railsを知っている人には使いやすいものになってます。

■ middlemanの雑イメージ

運用的には、Rubyで書いたファイルをHTMLにビルドして、それをサーバにアップロードする感じですね。

すごく RubyOnRails の走り感があって、RubyOnRailsの学習前段階で使えそうな感じ。
Rails 難しいよー＼(^o^)／うわぁぁぁってなってる人は、middleman から入ってみてはどうでしょうか。

$ gem install middleman

$ cd [作業したいディレクトリ]
$ middleman init [プロジェクト名]

プロジェクトが出来ましたね。はい、次はフォルダ構成を見てみましょう。

■ フォルダ構成

Rails を小さくした感じ。ファイルやフォルダ数が少なくて、とてもシンプルです。

サーバ起動も出来ます。
ただし、Railsに比べたら読み込みが遅い。

$ cd [プロジェクト名]
$ middleman server

■ ドン!!

このページが見えたらOKです。あとは、自由にカキカキしていきましょう。

$ middleman build

プロジェクトのフォルダ内のbuildフォルダを確認してください。
htmlファイルが出来てますね。あとは、これをサーバにアップロードしましょう。

環境によってご自由に。
AWS S3の静的サイトホスティング とか、Firebase Hosting がおすすめ。

hoge.slim

// Railsの書き方
= render "menu"
// middlemanの書き方 
= partial "menu"

Railsと書き方が違って、戸惑ったので注意！！

例）名前のリストを表示する場合

data/users.yaml

- user_name: hoge
  mail_address: hoge@mail.com
  age: 30
- user_name: fuga
  mail_address: fuga@mail.com
  age: 45

index.slim

ol
  - data.users.each do |user|
    li = user.user_name