Hatena::ブログ(Diary)

知のレバレッジを最大化せよ このページをアンテナに追加 RSSフィード Twitter

2015-02-19

git remote branch の削除

github で merge 後に remote branch 削除。その後 local の不要 branch を push してしまった場合などに remote に不要 branch が残ってしまいます。いつも微妙に忘れてしまうので、この場合のメモ。

  • local branch を削除
$ git branch -D local/branch
  • 削除した内容を push
$ git push origin :local/branch

2015-01-30

Rails 404 や 500 などのエラーページの国際化対応

public ページ以下にあるエラーページの拡張子

/public/500.html

下記のように locale をセットすれば locale によってエラーページを切り分けてくれます

/public/500.ja.html
/public/500.en.html

参考

http://api.rubyonrails.org/classes/ActionDispatch/PublicExceptions.html

2015-01-16

Application Loader 3.0 ってどこからダウンロードすればいいの?

新しくなった iTunes Connect では、曰く「XCode 5.1.1 以降 或いは Application Loader 3.0 以降でバイナリ送信してください」とのことなのですが、Application Loader 3.0 のリンクをクリックしても、2.9.1 へのダウンロードリンクになってしまうようです *1

f:id:mabots:20150116115601p:image:w360

下記のリンクから直接 3.0 をダウンロードできる模様です。

https://itunesconnect.apple.com/apploader/ApplicationLoader_3.0.dmg

なんとなくですが、2.9 より 3.0 のほうが見た目が質素になってしまっているのがちょっと気になります。

*1:2015/01/15現在

2015-01-09

bootstrap-sass gem で Rails で快適に Bootstrap を使う

Bootstrap はちょくちょく version があがっています。Bundler 管理にすることでより簡単に新 version に追従したり asset 配信するために bootstrap-sass gem を使ってみます。*1 すでに Sass で構築された Rails Application に親和性が高いです。

Gemfile

Rails で sass を利用するために sass-rails gem を使うことが出来ますが、boostrap-sass も依存するので、sass-rails をすでに追加していることを確認します。また、vendor prefix を自動的につけてくれる autoprefixer-rails *2 も一緒に使うことを推奨しています。bootstrap-sass を新規に導入する場合は、Rails 4.x 以降である必要があります。

gem 'bootstrap-sass', '~> 3.3.1'
gem 'sass-rails', '>= 3.2'
gem 'autoprefixer-rails'

Bundler 実行

Gem file に追加後、bundle 実行し、Web Server を再起動しておきます。

$ bundle

application.css.scss

今回新たに sass-rails を導入するなど、Rails 環境最初に構築した時に app/assets/stylesheets/application.css という sass を意識しない拡張子になっている場合は app/assets/stylesheets/application.css.scss にリネームするなり再生成しておきます。

asset pipeline の順番として bootstrap-sprockets が bootstrap よりも先に load するようにします。vendor/ 以下に bootstrap の実態を設置する必要はありません。

@import "bootstrap-sprockets";
@import "bootstrap";

application.js

asset pipeline の順番として jquery の後に bootstrap-sprockets を load するようにすれば完成です。

//= require jquery
//= require bootstrap-sprockets

2015-01-07

Brace.io 買収に伴いサービス終了

以前の記事 *1 でも少し紹介した Brace.io (旧 Backlift)ですが、Squarespace *2 による買収により、1/19 でサービスを終了する模様です。

なお、FORMS *3、CHARTS *4 、DATA *5 などは、オープンソースプロジェクトとして公開される模様です。

詳しくは http://blog.brace.io/2014/11/17/squarespace/

2014-12-25

Slim で条件によって動的にクラスを付与する

例えば、なにかの表で偶数列だったら even クラスをつけるといった場合の処理 ( 単純に css でも対応できますが ) の仕方をいつも忘れてしまうのでメモ。

  • シンプルに cycle を使う
- data.each do |i|
  .item class=(cycle('odd', 'even')) 
  • 毎回評価する (例えば なにかの helper の実行結果によって挙動を変えたい時など)
- data.each do |i|
  .item class=('even' if i / 2 == 0) 

2014-12-12

Android Web View で tel: リンクから電話をする

tel: リンクは、スマホから電話をかけるリンクとして、便利なのですが、Android Web View で tel: リンクを Not Found として処理してしまう模様。(標準ブラウザChrome では意図した挙動をする)

<a href="tel:0312345678">電話する</a>

解決方法としては、下記の stackoverflow にあるように条件に一致したら明示的に loadUrl する必要がありそう。

http://stackoverflow.com/questions/4338305/android-webview-tel-links-show-web-page-not-found

ちなみに mailto: も同じように明示的に処理する必要がありそう

2014-08-29

iOS の Safari で Rails のページをリロードすると真っ白画面になる件

iPhone でリロードを多用した操作を Rails アプリケーションに対して実施すると、真っ白いページが表示されることがあります。今回 iOS 7Safari だけでなく、OS X 10.8 の Safari でも再現したので、まとめてみました。

状況

画面としては真っ白画面が表示される。Safari の debugger でみると、head body の中身がない。

f:id:mabots:20140829114708p:image

ステータスコードとしては、304 Not Modifided として取り扱われている。

f:id:mabots:20140829114709p:image

Webrick の log をみると、サーバとしては 200 を返しているので、Last-Modified を比較して safari が処理していると推測される。

Started GET "/" for IP_ADDR at 2014-08-29 11:23:05 +0900
Processing by CertainController#CertainAction as HTML
  Rendered hoge.html.slim (0.1ms)
  (snip)
Completed 200 OK in 111ms (Views: xx ms | ActiveRecord: yy ms)

原因

Erlingur.is *1 によると

It seems that for some reason Safari 7 will cache the 304 blank response body for a page and then return it on subsequent requests. This seems like a bug in Safari 7 on OS X and on iOS 7.

Safari 7 になってから 304 の status が帰ってきた時に真っ白ページをキャッシュして、その後ずっとその真っ白ページが表示される。iOS 及び OS X に搭載された Safari 7 のバグと思われれる。」とあります。

一時的な対応

  • header の last modified を常に更新されたことにして 304 として取り扱わないような対応がありますが、とても dirty なやり方かつパフォーマンスにも影響するので到底薦められるものではありません。一応下記を application controller の before action に追加する方法で再現しなくなっていることは確認しました。
headers['Last-Modified'] = Time.now.httpdate

VGTech *2では、

To do this, we created a Varnish rule which removes the If-Modified-Since and If-None-Match headers on request and then have Varnish deliver the content as normal. This rule only applies to iOS7-devices, since this is where we know the problem exists.

「If-Modified-Since と If-None-Match headers を iOS 7 だったらその場合に限定して取り除く」としていますが、厳密には、OS XSafari でも起こるのでこのあたりの条件は吟味したほうがよいでしょう

参考サイト

2014-08-12

Middleman で Slim をサクッと使えるようにする

Middleman の build と、Movable Type の publish ってなんだかシンパシーを感じてしまいますね。ところで、静的サイトジェネレーターの Middleman *1Rails で使われるとてもシンプルなテンプレートエンジン Slim *2 をサクっと使う方法をまとめました。

導入編

もうすでに project をつくってしまった状態で Slim 化する想定です。なお、様々なプロジェクトテンプレートが用意されており、プロジェクト作成時にそれを使うのもよいでしょう。

$ gem install middleman
$ middleman init PROJECT_NAME
$ cd PROJECT_NAME
$ bundle exec middleman s

Slim の導入

Gemfile を編集

gem "slim"

Bundle / Bundle Install

$ bundle

Config.ru を編集

Slim::Engine.set_default_options :pretty => true

Slim::Engine.set_default_options :shortcut => {
  '#' => {:tag => 'div', :attr => 'id'},
  '.' => {:tag => 'div', :attr => 'class'},
  '&' => {:tag => 'input', :attr => 'type'}
}

Slim ファイルの作成と確認

適当な拡張子の slim ファイル (aaaaa.html.slim) を /source 以下に作ってみます。

.welcome
  h1 Middleman is Watching
  p.doc
    = link_to "Read Online Documentation", "http://middlemanapp.com/"

ただそのまま http://localhost:4567/aaaaaa.html にアクセスしても設定がロードされていないので Not Found になります。そこで middleman server を再起動すれば Slim で記述された内容がレンダリングされます。

Ctrl-C 
$ bundle exec middleman s

デフォルトの application layout を Slim 化してみる

Middleman で用意している layout.erb (source/layouts/layout.slim) を Slim 化したサンプルを下記に貼り付けておきますので、ご参考にどうぞ。

html
  head
    meta charset="utf-8"
    /! Always force latest IE rendering engine or request Chrome Frame
    meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"
    /! Use title if it's in the page YAML frontmatter
    title= current_page.data.title
    = stylesheet_link_tag "normalize", "all"
    = javascript_include_tag  "all"
  body class= page_classes
    = yield

*1http://middlemanapp.com/jp/

*2Haml よりも少し高速に動作し、より少ない文字量でマークアップが可能 http://slim-lang.com/

2014-07-31

「今は後方互換性を確保しているが、将来変わるかもしれません」を英語でどうやっていうか?

どんどん進化する web service で、どこかで後方互換性を捨てなければならない時がくるかもしれません。そういった免責的な英語の言い回しってどうやっていうべきか、というので事例を調査してみました。

例えば

We maintain this feature for posterity, but is subject to change moving forward.

あくまで「将来変わる」前提ですが、今は互換性残してます! というのがいい感じですね。

スマートフォン解析