静的webサイト作成の強い味方「Middleman」【前編】 | dwango creators' blog

2015/12/11 76 users dwango creators ヘッダー 味方 はじめ バナー

はじめまして、chiiです。 以前はフロントエンドエンジニアっぽいことをしていましたが、今年のはじめからデザイナーとしてバナーやLPを作るお仕事をしています。 今日はヘッダーなどの共通パーツを部品化して、使い回すことができる静的サイトジェネレーターの 「Middleman」 を紹介したいと思います。 今回はその導入編です。 Middlemanが解決してくれること いきなり紹介に入る前に、どんなこと... 続きを読む

エンジニアブログをMiddlemanでつくる3つの理由 - CrowdWorks Engineer Blog

2014/08/06 66 users CrowdWorks Engineer Blog 理由

みなさん、技術ブログの運用って面倒じゃないですか？ぼくは面倒です！ ネタを貯めて、記事を書いて、公開する。会社的にも・個人的にも意味があり、 そのプロセス自体も楽しいものです。 大抵の場合、ブログの運用には便利なブログエンジンやブログサービスを使います。 ところが、長期間運用していると、「もうちょっとなんとかならないか？」と思うことがあります。 例えば、以下のようなことです。 拡張できない・しづら... 続きを読む

CoffeeScript と TypeScript をそれぞれ実務案件で使ってみた感想 ｜ Developers.IO

2014/05/13 351 users CoffeeScript TypeScript 双方 半年弱

そんな訳で、CoffeeScript を触り始めて半年弱、TypeScript を触り始めて1ヶ月弱ほど経ちました。まだまだ日は浅いですが、いちおう両方とも実務案件にて使用したということで、ここらで双方に対する振り返りを簡単にしておくとします。 CoffeeScript について http://coffeescript.org/ 学習開始時期:2014年1月頃始めたきっかけ:Middleman や... 続きを読む

Grunt + TypeScript + Middleman によるフロントエンド開発環境を作ってみる ｜ Developers.IO

2014/04/30 145 users TypeScript Grunt Sinatra Ruby

Middleman を使うようになってしばらく経ちますが、2014年4月現在 TypeScript に対応していないというのがどうも気になります。Ruby on Rails や Sinatra といった他の Ruby 製フレームワークと同様、Middleman が対応している Alt JS は CoffeeScript のみです。 CoffeeScript は機能が軽量であることから学習コストが低... 続きを読む

WordPressからmiddlemanに移行してGithub Pagesで運用する方法

2013/09/19 56 users Ham Git Markdown github pages

サイトをリニューアルしていました。 WordPressからmiddleman-blogに乗り換えました。 ホスティングもロリポップからgithub-pagesに乗り換え。 理由は普段使っているエディタでmarkdownでブログを書いてgitでデプロイする流れがやりたかったから。 static site generatorは数あれど、慣れたmiddlemanでやってしまおうと思っていました。 ham... 続きを読む

静的サイト開発ツールとしてのMiddlemanとGrunt - Webtech Walker

2013/09/03 146 users Grunt concat Sass CSS HTML

最近自分の周りを見ると、フロントエンドの開発ツールといえばGruntをみんな使ってるんだけど、Middlemanを使うのもけっこういいんじゃないかと思ったので比較してみる。 実現したいこと 例えば次のようなものをつくりたいとする。 HTMLは数ページ〜十数ページくらい（ヘッダ・フッタくらいは共通化したい） JSはconcatしてminifyしたい CSSはSassを使いたい 開発時はwatchした... 続きを読む

ブログをJekyllからmiddlemanに移行してTravis CIでGitHub Pagesにデプロイするようにした - Webtech Walker

2013/08/26 68 users jekyll GitHub hokaccha 興味 ブログ

ちょうど一年くらい前にWordPressからJekyllに移行したんだけど、今回middlemanで作りなおしてみた。 hokaccha/webtech-walker - GitHub 特にJekyllに不満があったわけでもなく単に技術的興味によるもの。 middleman Middleman: Hand-crafted frontend development middlemanはほぼJekyl... 続きを読む

Slimでセレクタを追加するときの書き方、及び Middleman の素晴らしさ。 - 納豆には卵を入れる派です。

2013/08/05 53 users Haml セレクタ Slim item class

Slim, Ruby, Middlemanよく、要素につけるidやclassを動的にしたい時とかに、Hamlだとこんな感じの書き方をする %li{class: "item #{item.name}"} この書き方がSlimだとダメっぽくてつまずいた。Slimだとこんな感じの書き方になるらしい li[class="item #{item.name}"] こういうのもいけるっぽい。割と素のHTMLに近... 続きを読む

【Middleman】でモダンにHTMLファイルを出力してみる。 ｜ Developers.IO

2013/03/20 62 users アジェンダ おさらい Developers.IO 前回 特徴

前回に引き続き、Middlemanで静的なサイトを構築してみたいと思います。 実際に、Middlemanを使用して、ベーシックなhtmlテンプレートを出力してみます。 その際に、Middlemanの特徴の一つとして「Layout機能、Partial機能」を使用して、構築したいと思います。 アジェンダ ディレクトリ構造のおさらい。 レイアウトの考え方 Frontmatter(ページ固有変数) 実際に... 続きを読む