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

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

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

ブログをWordPressからMiddlemanに移行しました！ | feedforce Engineers' blog

2015/01/20 13 users Git Markdown 眉間 お初 XML

お初にお目にかかります。鉛弾を敵の眉間にブチ込むゲームが好きなdkimuraです。 先月末に当ブログを、WordPressからMiddlemanへ移行いたしました。 その際にハマった/悩んだところをご紹介させていただきます。 移行の流れ WordPressから、記事データをXMLでエクスポートする エクスポートした記事データをMarkdownに変換 middleman-blogコーディング Git... 続きを読む

Proteus - Webフロントエンド開発スターターキット MOONGIFT

2014/12/27 27 users MOONGIFT Proteus Gulp RubyGems

最近はフロントエンド開発が盛んです。そんな中で開発補助ツールも数多く開発されています。あえて自分で補助ツールを揃えることなく、ジェネレータを使えば一気に整ってしまいます。 Proteusはそのためのツールになります。Middleman、Jekyll、Gulpに対応した開発環境構築ツールになります。 Proteusの使い方 インストールはRubygemsでできます。 $ gem install pr... 続きを読む

Middlemanでがんばるぞい系テンプレートgem「middleman-ganbaruzoi」作りました | Border/memo

2014/08/19 34 users GitHub Sass CoffeeScript Slim

Middleman、最近結構使っていて実案件でもこれでサイト作ったりしている。数十ページのサイトだけど、WordPress使うまでもないような重さのサイトにちょうど良い。 Middlemanを使うときは、僕はSlim + Sass(SASS) + CoffeeScriptでやっていてる。config.rbやSlimやSassのテンプレートみたいなやつは、基本的に同じものを使い回す。GitHubやG... 続きを読む

エンジニアブログを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 は機能が軽量であることから学習コストが低... 続きを読む

middleman/middleman-core/spec/middleman-core/binary_spec/unicode.txt at master · middleman/middleman · GitHub

2013/11/14 13 users GitHub spec

続きを読む

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に近... 続きを読む

Rebuild: 16: Designing new Rebuild.fm (Naoya Ito, nagayama)

2013/08/01 21 users iOS Bootstrap Rebuild nagayama

伊藤直也さん (@naoya_ito)、長山武史さん (@nagayama) を迎えて、Rebuild.fm リニューアル, Middleman, Bootstrap, iOS アプリデザインなどについて話しました。 Show Notes Rebuild.fm miyagawa デカール Jekyll middleman Yeoman Grunt Bootstrap Bootstrap 3 RC1... 続きを読む

Middlemanで生成したサイトをAmazon S3で運用する - QNYP Blog

2013/05/21 42 users 静的コンテンツ QNYP Blog 手順 構成 コンテンツ

おぐらです。 このブログは、Middlemanを使って生成した静的コンテンツをAmazon S3にアップロードし、S3 Static Website Hosting機能を使ってWebサイトとして配信しています。 今回は、この構成を実現するための手順として、 コンテンツをS3にアップロードするmiddleman-syncの導入 S3 Static Website Hostingの設定 について解説し... 続きを読む

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

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

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