OmniAICreator/Qiita-1.07M huggingface dataset:
シェルコマンド履歴を簡単にコピーするシェル関数

* historyコマンドの出力をどうにかする。

## n個前のコマンドをコピー
* historyコマンドの出力にはそれ自身が含まれるため、直前のコマンドを表示するには`history 2`とする必要がある
    * それは直感に反するので引数に+1する
* historyコマンドの出力は、以下のようにスペース2個で区切られる
    * cutコマンドでコマンド部分だけを抽出したいが、cutではデリミタに複数の文字を指定できない
    * デリミタをスペース1個にすると、コマンド文はフィールド5以降に当たる
    * awkでスペース2個区切りのフィールド3以降を表示できるが、クッソ長いのでやめた

```bash
$ history 1
  508  history 1
# (空白のフィールド1) (空白のフィールド2) 508 (空白のフィールド4) history 1
```

```bash
chis () { #copy shell history
  num=1
  grep -q '^[0-9]$' <<< "$1" && num="$1" # 引数から数値のみを抽出
  history "$((num+1))" | head -n 1 | cut -d ' ' -f 5- | pbcopy
  pbpaste 
}
```

## 履歴をpecoで絞り込んでコピー
* 数字の引数があるか判定
    * あればn個前の履歴から絞り込み
    * なければ全履歴から絞り込み
* `sort -r`で逆順にして新しい履歴を上に
    * 最新の履歴はこれ自体なのでsedで削除

```bash
shis () { #search shell history
  if grep -q '^[0-9]\+$' <<< "$1";then
    history $(($1 + 1))
  else
    history
  fi | sort -r | sed 1d | peco --prompt "Select history to copy:" | cut -d ' ' -f 5- | pbcopy
  pbpaste
}
```

## 履歴をpecoで絞り込んで実行

```bash
rhis () { #run shell history
  eval "$(shis "$1")"
}
```

### 参考
* [Zsh - pecoを使って、コマンド履歴をインクリメンタルに絞り込んでコマンド再実行 - Qiita](http://qiita.com/akymrk/items/e9900c2cc3ecface0fe8)
border-imageの普通の書き方

IE11が対応したことで、ほぼすべてのブラウザで動作するようになりました。
参考 [Can I use](http://caniuse.com/#feat=border-image)

##対象となる方
* 書き方がよくわからんマークアップな人。
* 部材を作るデザイナー的な人。

##特徴
* 一度用意すれば、CSSで大きさを変えて使いまわせる。
* 仕様や文言変更にも耐えられる場合が多い。
* 見た目をオシャレに出来る。
* 使い方が直感的ではなく、空で書くのはツライ。

##書き方
細けぇことはいいんだ的な人用に。
[border-image.com](http://border-image.com/)を利用して、自分の画像から適切なCSSを作りましょう。
よく分かんない人は次の項目へ。

```html:HTML
<div class="wrap">
　<img src="#" width="240" height="240" alt="画像とか入れてもいいし" />
  <p>テキストとか入れてもいいし</p>
  ・・・HTML略・・・
</div>
```
```css:CSS
.wrap {
  width: 280px;
  border-style: solid;
  border-width: 22px 26px 20px 28px;
  -moz-border-image: url(image_path.png) 22 26 20 28 stretch;
  -webkit-border-image: url(image_path.png) 22 26 20 28 stretch;
  -o-border-image: url(image_path.png) 22 26 20 28 stretch;
  border-image: url(image_path.png) 22 26 20 28 fill stretch;
  box-sizing: border-box;
}
```
![border_image1.jpg](https://qiita-image-store.s3.amazonaws.com/0/67519/57255e3d-9251-77f0-2ece-2a1881a764a2.jpeg)
上のように書けばこうなる。
横幅は指定したので`280px`で固定される。
高さは、色のついてる部分の中の要素の高さに合わせて伸びる。
それに合わせて左右の白枠も縦に伸びる。

##解説
`border-image`は何が起きてるのか理解しづらく、空で書くのは難しいし手間。
上でも書いた[border-image.com](http://border-image.com/)を利用しましょう。

###使用するイメージの初期設定
```:CSSのこの部分
border-image: url(image_path.png) 22 26 20 28 stretch;
```
使用したいイメージパスの指定と枠のサイズ、枠のパターンを指定できます。
イメージパスの説明は省略します。

次に4つ並んでいる数字が枠のサイズです。
上右下左の順に指定でき、すべて同じや上下同じ、左右同じ場合は省略できます。（marginとかと同じです。）
また、指定する数値はpx単位ですが、**画像の本来の大きさ**に対するpx数を指定します。
スマホ用（Retina対応とか）に使う場合は気を付けましょう。

その次に書いてある文字列が枠のパターンです。
stretch　辺の部分を伸ばして表示します。
repeat　 辺をリピートして表示します。
round　　repeatの優秀なやつです。対応ブラウザが少な目。
2つ同時に指定することもできます。
その場合は上下、左右と適用されます。

###枠の表示サイズを設定する
```:CSSのこの部分
border-width: 22px 26px 20px 28px;
```

基本的には初期設定で使用した数値をそのまま使って問題ありません。
スマホ用の場合は数値をそれぞれ半分にして使うようにすると良いと思います。
つまり**初期設定の段階で2で割れる数字にしておいた方が良い**です。

###その他の設定
```:CSSのこの部分
width: 280px;
border-style: solid;
box-sizing: border-box;
```

幅を指定すると中の要素に応じて縦だけ伸ばすことができます。
また、幅を指定する場合は`box-sizing: border-box`を指定しないと、指定サイズより枠の大きさ分大きくなってしまいます。
`border-style: solid`は`solid`以外を指定したことはありませんが、一応指定します。
（具体的に必要な理由は分かりません。ごめんなさい。）


##あとがき
長々と書きましたが、これが`border-image`の基本的な作り方です。
理解するのはかなり苦しいと思います。
何度か紹介したborder-image.comを活用して使うのが良いと思います。

今回の方法には弱点もあって、それは大きな飾りがついた枠を使うのが難しいということです。
`border-width`の部分が大きくなりすぎると、表示できる場所がどんどん狭くなってしまうからです。
それに対する別の書き方をまた紹介します。
（書いたらリンク貼ります）

ではお疲れ様でした。
ElasticSearch と Amazon CloudSearch の用語比較


ElasticSearch から CloudSearch への移行を検討中。

|ElasticSearch|CloudSearch|
|:------------|:----------|
|index|domain|
|document|document|
|field|field|
|field type|field type|

ElasticSearch での index を、CloudSearch では domain と呼ぶ、と考えて良さそう。(概念的にも)大体変わらないようにみえる。ただし、CloudSearch は domain 毎にインスタンスを割り当てるので、そのぶん料金がかかる。(ElasticSearch では、単一のサーバに複数の index を作成していける。)

そもそものデータ量や検索量が少ないのであれば、field の命名を工夫し、検索対象の field を適切に選択するような使い方をすれば、1 domain 内で複数のユースケースに対応できるインデックスを構成できるかもしれない。

# 参考

* [高速スケーラブル検索エンジン ElasticSearch Server](http://www.amazon.co.jp/gp/product/4048662023/ref=as_li_ss_tl?ie=UTF8&camp=247&creative=7399&creativeASIN=4048662023&linkCode=as2&tag=tmtysk-22)
* [Amazon CloudSearch](http://docs.aws.amazon.com/ja_jp/cloudsearch/latest/developerguide/what-is-cloudsearch.html)
JAWS DAYS 2015でドンジャラ初心者がAWSドンジャラをやったら、奇跡が起きた話

**AWSドンジャラ**とは、
ADSJの**片山さん(@c9katayama)**が作ったCDPの普及のために作った
AWS麻雀牌でやるゲーム。※*私の主観*

3/22のJAWS DAYS 2015の会場に麻雀＆ドンジャラコーナーが設置された。
ルールとかは以下参照。
http://jawsdays2015.jaws-ug.jp/aws_mahjong_donjara/

*****

さて、麻雀は脱衣麻雀ゲーム(笑)ぐらいしかやったことがなく（しかも大分前・・・）、
ドンジャラもやったことあるかな～。ぐらいの初心者。
わからないので、どんな感じかなぁ～～～。眺めていたら、
片山さんに「ドンジャラやってみますか？」と誘われて、
たぶん人生初の麻雀卓に。

一緒にドンジャラをしたのは、同じく誘われた元ADSJの**玉川(@KenTamagawa)さん**とADSJの**小林さん**。
業界の有名人を前に緊張しまくり、ギャラリーが増えさらに緊張しまくりでした。

1人でルールブックを占有し（本当にすみません）、いざ開始。
ただ、緊張しっぱなしかつ、この絵なんだ～。役（CDP）どれだ～。と思いながらやっていたので、記憶が曖昧。
しかも、ルールがわからず、牌の数間違えたり、
1ゲーム目：牌をオープンにして、あれこれ悩んだり、教えてもらったりしたら、BackNetパターンができて、勝った気がする。
※記憶が曖昧なので、間違っていたらごめんなさい。
2ゲーム目：牌を隠して、勝負。うまくパターンができなくて終わり。
3ゲーム目：またもやBackNetパターンができそうだと、集めて、リージョン牌が来るのを待って、上りに成功！
ここで驚愕の事実が・・・。BackNetパターンだけ見ていたら、ほかの牌でも役ができていました。奇跡です！

片山さんに3CDPの素晴らしいアーキテクチャとツィートして頂きました。
<blockquote class="twitter-tweet" lang="ja"><p>3CDPの素晴らしいアーキテクチャ <a href="https://twitter.com/hashtag/jawsdays?src=hash">#jawsdays</a> <a href="http://t.co/cC9wmj29so">pic.twitter.com/cC9wmj29so</a></p>&mdash; アマゾン ウェブ サービス (@awscloud_jp) <a href="https://twitter.com/awscloud_jp/status/579516005925330944">2015, 3月 22</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
・・・正直、指摘されるまで全然気付きませんでした・・・。1つ揃えるのに精一杯だったので・・・。
あまりの驚きに以降動揺状態・・・。
4ゲーム目：役が揃わず、終了・・・。
ちなみに、動揺を引っ張り、牌の取る数間違えたり、本当にすみません。

*******
やってみて、感想は、
すごく楽しかったです。
そして、勉強になりました。

最初はまずこのicon(絵)が何だっけ？から始まり、
持っている牌でどのCDP(役)で作れるか、
全然わからなかったのですが、
最後のほうには、これとこれを組み合わせればというのが、何となくわかるようになった気がします。
※正直なところはまだまだです。１組み合わせ作るのが精一杯です。

これは遊びながらCDPを学べる非常にいいツールだと思います。
もうちょっと勉強して、もう1回チャレンジできたらと思います。

*****

片山さん、誘って頂いてありがとうございました！
この場をお借りして、お礼申し上げます。

*****
最後に・・・初めて書くので、内容に問題がありましたら、ご連絡ください。
日付フォーマット

日付・文字列変換

```ToString.java
//日付型を文字列へ
String nowDateString = DateTimeFormat.getFormat("yyyy-MM-dd HH:mm:ss").format(new Date());
```

```ToDate.java
//文字列を日付型へ
Date birthDate = DateTimeFormat.getFormat("yyyy-MM-dd").parse("2015-03-23");

```
【iOS】PHImageManagerを使って画像取得する時の注意点

PHImageManagerのを使ってPhotosアプリから写真や動画のポスターフレームを取得する時自分が気づいたところをまとめます。

* requestImageForAsset:
    * 動画を指定したら動画のポスターフレーム（大体先頭フレーム）を返すことができますが。注意しなければいけないのは取得した画像が普通の画像の色チャネルの順番と違って、取得したUIImageをそのままopenGLのシェーダで処理すると色がおかしくなります。自分の場合はRチャネルとBチャネルが逆なっていました。
    * iOSシミュレータでこのメソッドから画像を取得する場合、取得した画像のチャネルも同じように逆になっています。でも本体で同じコードを実行すると正しくなります。原因が不明で、シミュレータのバグかシミュレータのRGBと本体のRGBのフォーマットが違うかと推測します。

requestImageDataForAsset:を使ってNSDataを取得し、UIImageに変換すればうまく画像の色問題を解消できそう。但し、requestImageDataForAsset:は動画のポスターフレームを取得できないため、ポスターフレームの取得はAVFoundationを利用するしかないみたいです。
CentOS 6.5 (64bit)でDockerを使う


EPELレボジトリを導入

```
$ sudo rpm -ivh http://ftp.riken.jp/Linux/fedora/epel/6/x86_64/epel-release-6-8.noarch.rpm
```

Dockerのインストール

```
$ sudo yum update
$ sudo yum -y remove docker
$ sudo yum -y install docker-io
$ sudo service docker start
$ sudo chkconfig docker on
```

インストール出来たか確認

```
$ docker --version
```

CentOSの導入

```
$ sudo docker pull centos
$ sudo docker images centos
$ sudo docker run -i -t centos /bin/bash
```
MacでのApache起動について

MacでApacheを起動しようとして下記の参考リンクを元に設定を行ったのですが、http://localhost/~[ユーザー名]/にアクセスすると「You don't have permission to access /~m-sato/ on this server.」のエラーが発生します。

どうか原因をお教えいただけないでしょうか。
よろしくお願いいたします。


○参考リンク
http://nantekottai.com/2014/10/26/os-x-10-10-sites/

○状況
1. Safariからhttp://localhost/にはアクセスできる。
「It works!」と表示される。
2./private/etc/apache2/users/[ユーザー名].confのパーミッション値：
-rwxr-xr-x+ 1 root  wheel  142  3 24  2014 /private/etc/apache2/users/[ユーザー名].conf
3.Sitesのパーミッション値：
drwxrwxrwx+ 4 [ユーザー名]  [ドメイン名]\Domain Users  136  3 23 16:42 Sites/
4.ログインしているユーザーは「m-sato」

○環境情報
Macのバージョン：Yosemite10.10.2

○Apacheのエラーログから抜粋
[Mon Mar 23 18:28:56.716539 2015] [authz_core:error] [pid 658] [client ::1:49943] AH01630: client denied by server configuration: /Users/[ユーザー名]/Sites/

![スクリーンショット 2015-03-23 18.29.36.png](https://qiita-image-store.s3.amazonaws.com/0/73154/8b92baf3-33c6-3234-6784-6a22239344d7.png)
ApacheでGETのみ許可する設定


POSTでリクエストがくるとwebサーバのログに載らなくて嫌じゃないですか？
POSTでリクエストが来たら弾くようにします。
ApacheのLimitExceptというディレクティブを使います。(http://httpd.apache.org/docs/2.4/ja/mod/core.html#limitexcept)


##Webサーバの設定

```httpd.conf
Alias /get_only/ /usr/home/qoAop/public_html/get_only/
<Directory "/usr/home/qoAop/public_html/get_only/">
        Options ExecCGI FollowSymLinks Includes
        AllowOverride None
        AddHandler cgi-script .cgi
        <LimitExcept GET>
                Order deny,allow
                Deny from all
        </LimitExcept>
</Directory>
```

##サンプルプログラム

```method.cgi
#!/usr/bin/perl
use strict;

my $env = $ENV{'REQUEST_METHOD'};

print <<EOM;
Content-Type: text/plain; charset=UTF-8

REQUEST_METHOD=$env
EOM

exit(0);

1;
```

##動作確認

wgetで--post-dataをつけるとPOSTでリクエストしてくれるのでこれで確認します。

###GET…200 OKで成功します。
```
sh-3.2$ wget -S --no-proxy -O -  http://127.0.0.1/get_only/method.cgi
--2015-03-23 18:21:54--  http://127.0.0.1/get_only/method.cgi
127.0.0.1:80 に接続しています... 接続しました。
HTTP による接続要求を送信しました、応答を待っています...
  HTTP/1.1 200 OK
  Date: Mon, 23 Mar 2015 09:21:54 GMT
  Server: Apache
  Connection: close
  Content-Type: text/plain; charset=UTF-8
長さ: 特定できません [text/plain]
`STDOUT' に保存中

    [<=>                                                                                                                ] 0           --.-K/s              REQUEST_METHOD=GET
    [ <=>                                                                                                               ] 19          --.-K/s 時間 0s

2015-03-23 18:21:54 (1.65 MB/s) - `-' へ保存終了 [19]
```

###POST…403 Forbiddenで弾かれます。
```
sh-3.2$ wget -S --no-proxy -O - --post-data "a=b" http://127.0.0.1/get_only/method.cgi
--2015-03-23 18:22:10--  http://127.0.0.1/get_only/method.cgi
127.0.0.1:80 に接続しています... 接続しました。
HTTP による接続要求を送信しました、応答を待っています...
  HTTP/1.1 403 Forbidden
  Date: Mon, 23 Mar 2015 09:22:10 GMT
  Server: Apache
  Content-Length: 221
  Keep-Alive: timeout=5, max=100
  Connection: Keep-Alive
  Content-Type: text/html; charset=iso-8859-1
2015-03-23 18:22:10 エラー 403: Forbidden。```
```

###ログ

```
127.0.0.1 - - [23/Mar/2015:18:21:54 +0900] "GET /get_only/method.cgi HTTP/1.0" 200 19 "-" "Wget/1.11.4 Red Hat modified" "-" 0 5958
127.0.0.1 - - [23/Mar/2015:18:22:10 +0900] "POST /get_only/method.cgi HTTP/1.0" 403 221 "-" "Wget/1.11.4 Red Hat modified" "-" 0 352
```
EC-CUBE3のメモ - 開発環境 -

公式にもインストール方法について記載はありますが、EC-CUBE範囲外の事項も多々あるので、備忘録代わりに開発環境の構築手順をメモ

※xamppでのインストール手順をかきました。とりあえず動かしてみたいかたは以下で。
http://qiita.com/chihiro-adachi/items/5fb2175454d3bfa047ac


# ご注意(2015/04/16追記)
この記事で書いている構築手順は、PHPバージョンがEC-CUBE3のシステム要件を満たしていないなど少し問題があるので、あくまでも動作確認レベルとしてご利用下さい。

公式のvagrantに関する扱いは、以下で議論されています。
https://github.com/EC-CUBE/ec-cube/issues/1

# 環境
以下の環境を想定しています。

* ホスト環境
    * Windows 7
    * Virtual Box 4.3.26
    * Vagrant 1.7.2
* ゲスト環境
    * CentOS 6.6
    * PHP 5.3.3
    * PostgreSQL 8.4.20

# Vagrantファイル
githubに上記環境を構築するVagrantファイルを置きました。
https://github.com/chihiro-adachi/eccube3-vagrant

# 手順
## Vagrant/VirtualBoxインストール
上記バージョンの、VagrantとVirtualBoxをインストールします。

## Vagrant起動まで
```
$ git clone https://github.com/chihiro-adachi/eccube3-vagrant.git
$ cd eccube3-vagrant
* vagrant起動
$ vagrant up
* 起動したゲストOSへログイン
$ vagrant ssh
```
## EC-CUBEのインストール
注記：以下の手順はec-cubeの本家レポジトリからソースコードを落としてきてます。動作確認は可能ですが、pushやpull requestを送ることができないです。開発に参加してプルリクエスト送りたい！という人は、[こちら](http://qiita.com/chihiro-adachi/items/f31c9d90b1bcc3553c20)を参考にしてください。

とりあえず動かしてみたい場合は以下で進めて問題ないです。

```
* 共有フォルダへ移動
$ cd /vagrant

* EC-CUBEのβブランチをclone
$ git clone -b eccube-3.0.0-beta https://github.com/EC-CUBE/ec-cube.git
$ cd ec-cube

* シンボリックでドキュメントルート以下に設定
$ sudo ln -s /vagrant/ec-cube /var/www/html/ec-cube

* install.shを環境に合わせて変更。
$ vi eccube_install.sh

※以下の箇所を変更
HTTP_URL=${HTTP_URL:-"http://192.168.33.10/ec-cube/html/"}
HTTPS_URL=${HTTPS_URL:-"http://192.168.33.10/ec-cube/html/"}
ROOT_URLPATH=${ROOT_URLPATH:-"/ec-cube/html/"}

* install.shを実行。初回は時間がかかります。
$ ./eccube_install.sh pgsql
```

※eccube_install.shでcomposer installも実行されているので、別途composerを動かす必要は無いです。

上記が完了したら、
http://192.168.33.10/ec-cube/html/
でアクセスすれば、トップページが表示される（はず）

## MySQLを利用する場合
vagrant upを実行する前に

* /etc/mysql/my.cnfを追加
* （vagrantの）setup.shに追記

/etc/mysql/my.cnf

```
[client]
default-character-set = utf8

[mysqld]
datadir=/var/lib/mysql
socket=/var/lib/mysql/mysql.sock
user=mysql
# Disabling symbolic-links is recommended to prevent assorted security risks
symbolic-links=0
skip-character-set-client-handshake
character-set-server = utf8
collation-server = utf8_general_ci
init-connect = SET NAMES utf8

[mysqld_safe]
log-error=/var/log/mysqld.log
pid-file=/var/run/mysqld/mysqld.pid
default-character-set=utf8

[mysqldump]
default-character-set = utf8

[mysql]
default-character-set = utf8
```

setup.sh

```
# ---------------
# set up mysql
# ---------------

cp -f /vagrant/etc/mysql/my.cnf /etc/my.cnf
service mysqld start
chkconfig mysqld on

# ---------------
# set up ec-cube
# ---------------

sudo mysql -uroot -e "GRANT ALL PRIVILEGES ON *.* TO cube3_dev_user@'localhost' IDENTIFIED BY 'password' WITH GRANT OPTION;"
sudo mysql -uroot -e "FLUSH PRIVILEGES;"
```
Rails 複数チェックボックスで入力された値をカンマ区切りで DB へ格納する

## やりたい事

複数チェックボックスで入力された値をカンマ区切り形式でデータベースへ格納したい。
~~( 中間テーブルを使った has_many through なアソシエーションを組む方法もあるが、そこまでする必要がないと判断した場合に。 )~~

**テーブルを正規化し、中間テーブルを使った has_many through なアソシエーションを組むのが正攻法だと思うが、こういう事もできますよという参考まで。**


## 前提

||バージョン|
|:--|:--|
|Ruby|2.1.1|
|Rails|4.2.0|


下記のテーブルをもとに説明

**stores ( 店舗情報 )**

|列名|データ型|概要|
|:--|:--|:--|
|name|string|店舗名|
|facilities|string|設備 ※ ここへカンマ区切りで値を格納|


## 1. モデルクラスのアクセサメソッドをオーバーライド

セッターで配列をカンマ区切り形式のテキストへ変換。
ゲッターでカンマ区切り形式のテキストを配列へ変換。

```app/models/store.rb
def facilities=(value)
  str = ''
  value.each do |val|
    str += val.to_s + ','
  end

  rslt = str.empty? ? nil : (',' + str)

  write_attribute(:facilities, rslt)
end

def facilities
  read_attribute(:facilities).to_s.split(';')
end
```


## 2. フォームの修正 (複数チェックボックス)

```app/views/stores/_form.html.erb
<div class="field">
  <%= f.label :facilities %><br>
  <%
    # デフォルトでチェックをつける項目
    checked = @store.facilities.presence || []

    # 設備 ( 実際には定数 or DB格納すべきだが ... )
    facilities = [1 => "駐車場あり", 2 => "個室あり", 3 => "クレジットカード可"]

    # 設備の項目数ぶんループ
    facilities.each do |key, value|
      checkedval = checked.include?(key) ? true : false

      concat f.check_box :facilities, { multiple: true, checked: checkedval }, key, nil
      concat value
      concat " "
    end
  %>
  </div>
```


## 3. コントローラの Strong Parameters 修正

facilities は配列を許可する。

```app/controllers/stores_controller.rb
def store_params
  params.require(:store).permit(:name, :address, :access, { :facilities => [] })
end
```

---

以上。
【iOS】うちの新人さんがはまったUICollectionViewController


うちの１年目の新人さんが研修しに来てiOSアプリの開発の学習を始まりました。既存のアプリが使っていたUICollectionViewControllerの所で意外とハマってました。

* NSFetchResultControllerとUICollectionViewControllerの連携
    * 新人さん：CoreDataの変更をどうやって自動的に画面に反映していますか？
    * 僕の答え：自動的ではなく、NSFetchResultControllerDelegateの実装によりFetchResultの変更を監視と処理ができます。

```
- (void)controller:(NSFetchedResultsController *)controller didChangeObject:(id)anObject
    atIndexPath:(NSIndexPath *)indexPath forChangeType:(NSFetchedResultsChangeType)type
    newIndexPath:(NSIndexPath *)newIndexPath {
    // ここでUICollectionViewやCellの更新を行う。
}

```
* UICollectionViewのperformBatchUpdatesのエラー
    * 新人さん：performBatchUpdatesでエラーが起きた、半日かけて解決できてないです。どうすればいいでしょうか？

> Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'Invalid update: invalid number of sections. The number of sections contained in the collection view after the update (1) must be equal to the number of sections contained in the collection view before the update (2), plus or minus the number of sections inserted or deleted (0 inserted, 0 deleted).'


* 僕の答え：performBatchUpdatesを実行する前のsecion数+performBatchUpdates中に呼んだdeleteSection、insertSecionの数!=performBatchUpdates後のsection数なら、このエラーが起こります。performBatchUpdatesでdeleteSectionを一回も読んでないのに、DBからsectionのcellデータを全部削除したため、UICollectionViewの更新でsection数が変わりました。そのため、このエラーが出ました。DBからsectionのcellを全部削除したら、該当sectionを明示的にdeleteSectionしましょう。

まぁこういうような問題がありました、既存のソースが多すぎで新人さんにとって解析しにくい原因もあると思います。
three.jsで3Dモデル表示

three.js を少し試してみました。
数値を取得したり、設定したりできるようにしています。
マウス操作で動かせるようにしていますが、少し微妙なところもあります。
マウスホイールで拡大縮小も可能です。

http://web.loft-net.co.jp/lofttecs/three_js_test/
パッケージ[Script]でJS,CoffeeScriptを実行


ATOM上でコードの実行ができるScriptを使ってみようとしたところ、Rubyは実行できたがJS,CoffeeScriptは実行できなかった。

Script:https://atom.io/packages/script

## 環境
  * Mac OS X Yosemite(10.10.2)
  * Node 0.11.12
  * ATOM 0.181.0
  * Script 2.18.0

## エラー内容

  ```
  Failed to spawn command coffee. Make sure coffee isinstalled and on your PATH
  ```

## 原因
  調べたところnodeのPATHが通っていないことが原因っぽい。
  1. Nodeのパスはターミナル等で `echo $NVM_BIN` と打てば確認できる。(nvm使ってる場合)
  2. ATOMのPATHはDeveloper Toolsで `process.env.PATH` と打てば確認できる。Developer ToolsはCmd + option + iまたはメニュー[View → Developer → Toggle Developer Tools]で開ける。
  3. 1のパスが2に含まれているかを確認。

## 対応
とりあえずの対応としては、
https://github.com/AtomLinter/Linter/issues/150#issuecomment-75265883
のようにinit.coffeeでPATHを通せばOK。
nvmを使っていれば↓のような感じ。

  ```coffee:init.coffee
  process.env.PATH = ["/Users/xxx/.nvm/v0.11.12/bin", process.env.PATH].join(":")
  ```

  ちなみにinit.coffeeはメニューから[Atom → Open Your Init Script]で開ける。

この対応はnvmの利点が活かせてないので、あまりよくないです。 `process.env.NVM_BIN` が参照できればいいんですが、分からなかった。。。
Pythonでプログラムを書くとき

# Pythonのプログラム
最近Pythonのプログラムを書く人が増えたように感じます。
私が使っててPythonはプログラムが書きやすくてメンテナンスがやりやすいので大変気に入ってます。また、ライブラリが多いのも魅力です。pipでサクッとインストールできるところは素晴らしいですね。

PHPなんかバージョンが代わったらすぐ動かなくなるので、当時の開発環境作りなおさないとダメだ！
windowsなんかコンパイラすらもう売ってなかったりするわけで。。。
最悪な開発環境です。二度と関わりたくないです。


**しかしPythonではそんなことお構いなし！！**


いつでも開発当時の環境をサクッと作れてしまいます。
いやーすばらしい！！


ただ、便利に使えてない人が多いので一言書いておきます！

# pipでインストールする時は気をつけろ！

Pythonでプログラムを書くときはpipで色んな物をインストールするケースがあります。
SoftLayerのCLIなどもpipでインストールすると思います。
しかし、何も考えないでそのまま


```lang:shell
#pip install softlayer
```

なんて実行したもんならあとでとんでもない目に合いますよ！
変なエラーが出たり、動かなくなったのを直すのが趣味な人には無縁な世界でしょうけど。。


pythonでコードをさわるなら何も考えず、virtualenvを使ってください！
でないと、変なエラーが出たり、最悪動かなくなってしまいます。

実行するときはworkonで仮想環境に入ってからコマンドを実行するようにしてください！

```lang:shell
(softlayer)....#pip install softlayer
```

ターミナルの前に（）がついてこんな感じの画面になると思います。

これで幸せなPythonライフが送れることでしょう！！

ちなみにvirtualenvの設定の仕方についてはググってみればたくさん出てくると思うのでここでは省略します！
Seasar2における件数取得の書き方について。(条件あり)

現在Java、Seasar2(SAStrats/S2JDBC)、JSP、PostgreSQLで
DBを使ったWebアプリケーションを作っています。

質問があるのですが
結論から言うと

**Seasar2において件数取得(条件あり)はどのように書けばよいでしょうか？**

<br>
現在サービスクラスで
条件を指定したレコードの件数を取得したいと思っています。

具体的に言うと次のSQL文をサービスクラスで書きたいです。

```rb:SQL文
select count(*) from users where name like '%ほげ%';
```
<br>
現在このあいまい検索の結果を取得するメソッドは作成できました。

```rb:UserService.java
	public List<User>findByName(String searchName)
	{
		String sql = "select * from users where name like ?";
		List<User> searchList = jdbcManager.selectBySql(User.class, sql,
				'%' + searchName + '%').getResultList();
		return searchList;
	}
```

この返ってきたリストに対して件数を取得するメソッドを作る
という視点でもいいのかもしれません。

AbstractServiceクラスのgetCount()があるのは知っているのですが、
総件数ではなく、条件に対する件数を取得する書き方がわかりません。


もしわかる方がいれば教えて頂きたいと思います。
Xcode plugin管理ツールのAlcatrazをProxy経由で使う

所要時間:3分くらい
## Alcatrazって？
Xcode plugin便利ですね。
便利なんですが、github上に散在していて、ものによってインストールの仕方もちょっと違ってたりします。

Alcatrazはそんな悩みを解決してくれるパッケージ管理ツールです。
Xcode pluginやテーマを簡単にインストール/削除できるようになります。
余談ですがAlcatraz自体もXcode pluginとして実装されていますね。
https://github.com/supermarin/Alcatraz

## Proxy経由でのインストール方法
いつもの感じ。Proxy経由じゃないならcurlの行だけでOK

```bash
# your.proxy.domain.comとportは経由するプロキシ
export https_proxy=[your.proxy.domain.com]:[port]
curl -fsSL https://raw.github.com/supermarin/Alcatraz/master/Scripts/install.sh | sh
```

## 使い方
[Window] -> [Package Manager] からパッケージやテーマを検索して[INSTALL]を押すだけ。
アンインストールは[REMOVE]押すだけ。超簡単です。

## Alcatraz Tour
「Alcatrazは便利！けどどのPlug-inが便利だったり人気があるのか分からない！」

って方向けの、人気Plugin検索ツールです。
COCOAPODS SEARCHみたいな感じで、githubで人気のPluginを一覧表示させてくれます。
https://github.com/haranicle/AlcatrazTour
URL（path）の文字列から Routing パラメーターの Hash に変換する


タイトルの通りです。一度調べて忘れたので、備忘録として。

```ruby
Rails.application.routes.recognize_path "users/1"
=> {:controller=>"users", :action=>"show", :id=>"1"}
```
対応する Route が無いと `ActionController::RoutingError` が出ます。
なお、その逆の働きをするのは

```ruby
Rails.application.routes.generate_extras({:controller=>"users", :action=>"show", :id=>"1"})
=> ["/users/1", []]
```

です。
対応する Route が無いとこちらは `ActionController::UrlGenerationError` が出ます。

これで安心して忘れられます。
kintoneのテキストフィールドでMarkdown記法が使えるようにする

kintoneのテキストボックスで[Markdown](https://help.github.com/articles/markdown-basics/)が使えたらな、という時には簡単なJavaScriptカスタマイズで願いをかなえることができます。

![image.PNG](https://qiita-image-store.s3.amazonaws.com/0/25990/a6ca5569-c4af-621e-0d2d-9f151b1e1825.png)

Markdownのパース処理については[marked](https://github.com/chjj/marked)を利用しました。
これを読み込ませたうえで(CDNで提供されているので、そのURLを読み込ませればOKです)、以下のスクリプトを追加すればOK。

```js
/*
 * markdown
 * (It requires to load marked.min.js)
 * Licensed under the MIT License
 */
(function() {
    "use strict";
    
    var showEvents = ["app.record.detail.show"];

    //Show preview to 
    kintone.events.on(showEvents, function(event){
        var record = event.record;
        var doc = kintone.app.record.getFieldElement("document");
        doc.innerHTML = marked(record["document"].value);
    });
    
})();
```

"document"はフィールドの名前なので、お使いのkintoneアプリに応じて変更ください。もう少し工夫すれば、Previewを表示するのも簡単でしょう。下記には、ソースコードとすぐに導入するためのアプリテンプレートを入れてあります。

[kintoneJavaScripts](https://github.com/icoxfog417/kintoneJavaScripts)

これでkintoneをWikiとしても使用することができます。ワークフロー管理・差分管理がデフォルトでついているのでドキュメント校正にも最適です。
CloudFront+HTTPSなリソースを含むCloudFormationスタックをUpdateする際の要注意！

CloudFrontの設定をちょいとだけ弄るCloudFormationテンプレートの修正をしてUpdateStackをしたら __UPDATE_ROLLBACK_FAILED__ になってしまって超焦った話。

既にサポートには勘弁してよーっていう新規ケースを投げてあるけど、他の人が同様の問題にぶち当たって途方に暮れないようにメモを共有。ていうか同じ内容をQiita用に書くのだるいのでサポートに投げた文面コピペ。

# サポートに投げた内容
>CloudFormationの既存スタックをUpdateStackしたらUPDATE_ROLLBACK_FAILEDな状態になってしまいました。
>CloudFormationのEventsのログを見ても __CloudFront encountered an internal error. Please try again.__ と出ているのみで最初原因が分かりませんでした。自分のせいなのかAWS側の障害なのかも不明…。
>
>とりあえず同テンプレートをupdateではなくcreateで別スタック名で実行してみたところ __The parameter ViewerCertificate The specified distribution is configured for SNI and the minimum SSL protocol version is specified as SSLv3. You cannot specify both.__ というエラーメッセージが表示されて失敗していたことがわかりました。このテンプレートは元々正常にCreateStack出来ていたママです。
>
>CloudFrontリソースのViewerCertificate設定に不備があったのかと思い、確認したのですがテンプレートの当該項目は以下の様な内容であり、ドキュメントを見る限りでは特に不備は見つかりませんでした。
>http://docs.aws.amazon.com/AWSCloudFormation/latest/UserGuide/aws-properties-cloudfront-distributionconfig-viewercertificate.html
>
```json:
"ViewerCertificate": {
  "IamCertificateId": "XXXXXXXXXXXXXXX",
  "SslSupportMethod": "sni-only"
}
```
>
>エラーメッセージからするとSSLv3が云々と出ているのでHTTPSのプロトコルバージョンに関する設定かと思いましたが上記URLのドキュメントにはそれらしい項目はありません。
>
>ですがエラーでスタックが作れないままだと困る為、エラーメッセージに出てくるキーワードで色々検索した所、最新のAWS SDKの方には `MinimumProtocolVersion` というEnumが存在することを発見しました。
>http://docs.aws.amazon.com/AWSJavaSDK/latest/javadoc/com/amazonaws/services/cloudfront/model/MinimumProtocolVersion.html
>CloudFormationのテンプレートドキュメントには載っていませんが、試しに以下のように設定を追加してみた所、無事スタックを作成/更新することが出来ました。
>
```json:
"ViewerCertificate": {
  "IamCertificateId": "XXXXXXXXXXXXXXX",
  "SslSupportMethod": "sni-only",
  "MinimumProtocolVersion": "TLSv1"
}
```

大体こんな感じ。あとはアンドキュメントな設定になっちゃってて気持ち悪いのでWeb上のドキュメントの更新お願いしますとか幾つかお願い書いといたくらい。


# CloudFormation便利なんだけどもうちょっと頑張って欲しい

- 特に運用するとき怖いのが __UPDATE_ROLLBACK_FAILED__。これ一旦なったらどうすればいいのか分からん。サポートに問い合わせれば回復してもらえるんだろうか？
    - これの回復はサポートに連絡すれば可能な限り対応してもらえるそうです。
- AWSの各種プロダクツは頻繁に新機能とか更新早いのは良いんだが、CloudFormationから利用できるようになるのに時間かかりすぎ。新種のリソースやら設定項目やらをいつまでもコード管理できないのは不便。現状痒いところにはCustomResourceで自前実装したりスクリプト組み合わせる逃げ道もあるけどCloudFormationだけでバシッとやりたいのが本音よね。

とりあえず不具合報告くらいなら気づいた時に頑張るので、AWSの中の人も頑張ってください。


# 追記 2015-04-17：公式リリースキタ
https://aws.amazon.com/about-aws/whats-new/2015/04/aws-cloudformation-updates-support-for-auto-scaling-opsworks-route-53-and-cloudfront/

今日付けでドキュメントにも載ったし、デフォルト値の問題も対応されたようだ（デフォルトでSSLv3）
SpriteBuilder Android Plugin てきとうに


### 前身
Apportableというコマンドラインツールで
ObjC -> Android APKコンパイルを売りにしたツールを出していたが
cocos2dに焦点を絞って、Xcodeプラグイン化したものがこのAndroid Plugin。


### 価格
Community 無料
Indie $99.99/month (今だけ1年間$50/month)
Pro $299.99/month

上記12ヶ月は最低加入しないといけないみたい。
その後に支払いをやめた場合のライセンスなどよくわかっていない。
英語読める方助けて＞＜


### 比較

|                      | SpriteBuilder Android Plugin | Apportable                            |
|----------------------|------------------------------|---------------------------------------|
| APK出力              | ○                            | ○                                     |
| 外部jar              | △ (indieライセンス以上)        | ○                                     |
| 外部Java             | △ (indieライセンス以上)      | ○                                     |
| アーキテクチャ       | △ (armv7a-neonのみ)          | ○ (armeabi, armv7a, armv7a-neon, x86) |
| コマンドラインビルド | △ (Proのみ)      | ○                                     |
| コード補完(xcode)    | ○                            | ☓                                     |
| Swift                | ☓                            | ☓                                     |

比較すると正直、良いとこないんですが
プラグイン化した事で導入が簡単になっている。pkgインストールするだけ。
後は普通にXcode上でScheme切り替えてビルドするだけです。
基本実機でしか動かないと思う。x86端末とかだと今のとこビルド失敗するんで注意。
細かい事は http://android.spritebuilder.com/

過去バージョンではconfiguration.jsonというjson設定ファイルで
色々Androidの設定を行って、その上でAndroidManifestの自動生成などを行っていたけど
素直にAndroidManifestを書けるようになったり
以前は無かったActivityクラスも出てきたりしたんで、わかりやすい実装になってきた。

(外部jar対応できました)<del>外部jar</del>やアーキテクチャの問題は過去に対応していたので、そのうち対応すると思う。。
今のとこはアーキテクチャは他のものを試してもエラー発生。
Androidに出力したいならObjCで書きましょう。今はSwiftのコンバートは未対応。

<del> コマンドライン上でのビルドは
少し前のバージョンで
`xcodebuild -scheme "projname Android"`</del>

<del>した場合、プロバージョン以上のみだよ。みたいな警告が出ていたけど
20150317バージョンで試したら普通にapk作成ができた。
自分がindieバージョンなので、communityバージョンでも行えるのかは未確認。
またバージョンアップを機に動かなくなるかもしれない。 </del>

20150408バージョンにしたら下記の文言が表示されて、Androidターゲットのxcodebuildが動かなくなりました。
`Please upgrade to the SpriteBuilder Android Plugin Professional License to build from the command line.`

### 困ったら

Android側の実体は

```
/Library/SBAndroid/Application Support/Developer/Shared/Xcode/Platforms/Android.platform/Developer/SDKs/SBAndroid.sdk/System/Library/Frameworks
```
上記のパスにframeworkとして存在します。(※バージョンによってディレクトリ名がSBAndroidIndieなどぶれてるので注意)


細かい事をやりたい場合はAndroidKitやJavaKitを使うと良い。
Android Bridged APIs (AndroidKit/JavaKitのリファレンス)
http://android.spritebuilder.com/api/index.html


ちょろっと見たいだけなら、
Xcode上でCmd+Shift+Oで検索すれば色々その場でチェックできる。
大体Android側と同じ実装方法していて、軽くObjCライクに書きなおされてます。

```
// javaっぽ
activity.getWindow()

// objCっぽ
[activity window]
// or 
activity.window
```
getXXなんかは大体上記のような実装になってます。



もうちょい突っ込んだ実装したいならBridgeKit(indie以上)
https://github.com/apportable/BridgeKitSample.spritebuilder
サンプル。
Source/Platforms/Android 以下にカスタムJavaクラス実装内容がある。
外部jarが使えるようになれば、BridgeKitを用いて外部SDKを実装したりすると思われ。
AdMobとか海外でも主要な広告はPlugin側で対応してくれる気がする。(過去CLI版はそうだった)

後過去CLIバージョンは少し古めのAFNetworkingが使えたけど
現バージョンでつかえるか確認していない。使えたら楽だなぁ。

更新で追加情報があれば修正します。
RabbitMQのインストール

## インストール
```
sudo rpm --import http://www.rabbitmq.com/rabbitmq-signing-key-public.asc
sudo yum install http://www.rabbitmq.com/releases/rabbitmq-server/v3.5.0/rabbitmq-server-3.5.0-1.noarch.rpm
```
RabbitMQと一緒にerlangもインストールされる

## サービス起動
`sudo service rabbitmq-server start`

## ステータス確認（設定確認）
`sudo service rabbitmq-server status`

```text
:結果
Status of node 'rabbit@xxxx' ...
[{pid,12386},
 {running_applications,[{rabbit,"RabbitMQ","3.5.0"},
                        {mnesia,"MNESIA  CXC 138 12","4.5"},
                        {os_mon,"CPO  CXC 138 46","2.2.7"},
                        {xmerl,"XML parser","1.2.10"},
                        {sasl,"SASL  CXC 138 11","2.1.10"},
                        {stdlib,"ERTS  CXC 138 10","1.17.5"},
                        {kernel,"ERTS  CXC 138 10","2.14.5"}]},
 {os,{unix,linux}},
 {erlang_version,"Erlang R14B04 (erts-5.8.5) [source] [64-bit] [rq:1] [async-threads:30] [kernel-poll:true]\n"},
 {memory,[{total,27622192},
          {connection_readers,0},
          {connection_writers,0},
          {connection_channels,0},
          {connection_other,2648},
          {queue_procs,2648},
          {queue_slave_procs,0},
          {plugins,0},
          {other_proc,9417392},
          {mnesia,58672},
          {mgmt_db,0},
          {msg_index,34008},
          {other_ets,770688},
          {binary,10440},
          {code,14671675},
          {atom,1361729},
          {other_system,1292292}]},
 {alarms,[]},
 {listeners,[{clustering,25672,"::"},{amqp,5672,"::"}]},
 {vm_memory_high_watermark,0.4},
 {vm_memory_limit,248633753},
 {disk_free_limit,50000000},
 {disk_free,5731168256},
 {file_descriptors,[{total_limit,924},
                    {total_used,3},
                    {sockets_limit,829},
                    {sockets_used,1}]},
 {processes,[{limit,1048576},{used,123}]},
 {run_queue,0},
 {uptime,7}]
```
VirtualBoxのCentOS7にGuestAdditionsをインストール

ローカルで開発したCakeアプリを、VirtualBox上のCentOSでマウントしてApacheで動かす。
VirtualBoxの__共有フォルダ__の機能を用いるために__GuestAdditions__をインストールする。

## 構成
- VirtualBox 4.3.26
- ゲストOS CentOS [ Linux release 7.0.1406 (Core) ]
- ホストOS OSX10.10


## GuestAdditionsをインストール

+ GuestAdditionをマウント

```bash

mkdir -p /mnt/cdrom
mount -r /dev/cdrom /mnt/cdrom/
```

+ 必要なパッケージをインストール

```bash

yum install -y bzip2 gcc make kernel-devel kernel-headers dkms gcc-c++
```
+ 再起動

```bash

reboot
```

+ GuestAdditionsをインストール

```bash

sh /mnt/cdrom/VBoxLinuxAdditions.run
```

## ローカルのWebrootディレクトリをマウントする

```bash

mount -t vboxsf -o uid=$(id apache -u),gid=$(id apache -g) local_webroot_dir /var/www/html/
```
マウントする際にApacheが所有権を持つようにしておく。
`/etc/rc.local`にも記載しておくと、リブートしたときにもマウントしてくれる。

## VirtualBoxでApacheを動かすことについて追記

- 下記設定を入れないと、CSSなどが文字化けしてうまく読み込めないことがある

```apache:httpd.conf

EnableMMAP Off
EnableSendfile Off
```

> 参考: [VirtualBoxの共有ディレクトリの静的ファイルをApacheから読むと文字化けする問題](http://takemaru123.hatenablog.jp/entry/20140430/1398853387)


- __SELinuxが有効だと`403エラー`を吐くので注意する。__
awscliでEMRを実行する際に、IAM Roleを使う

ちょっと嵌ったのでメモ。
既にEMRを実行するサーバでIAM Roleの権限は適用済みの前提

## 最新のawscliを取り直す
```
curl -kL https://raw.github.com/pypa/pip/master/contrib/get-pip.py | sudo python
sudo pip install --upgrade awscli
```
* 古いawscliだと`create-cluster`がなかったりする。

## これが必要(デフォルトのRoleを作成)
```
aws emr create-default-roles --region ap-northeast-1
```


で、`--use-default-roles`を付ければIAM Roleを認識した。

## 参考
* [Amazon EMR の IAM ロールの作成と使用 - Amazon Elastic MapReduce](http://docs.aws.amazon.com/ja_jp/ElasticMapReduce/latest/DeveloperGuide/emr-iam-roles-creatingroles.html)
* [create-default-roles — AWS CLI 1.7.15 documentation](http://docs.aws.amazon.com/cli/latest/reference/emr/create-default-roles.html)
Tableau DesktopをVagrant内のMySQL鯖に接続して使えるようにするまで


# Tableauとは？
　いわゆるデータ可視化ツール。プログラミングスキルがなくても、DBなどからデータ分析をサクサク行うことができます。

# 環境
* クライアント
 * OS X Yosemite
* サーバー
 * MySQL 5.6.22
 * Vagrant 1.6.5
 * CentOS 6.6

# クライアント側の準備
* tableauの[ダウンロード](http://www.tableau.com/ja-jp/products/trial)とインストール
* MySQL用のODBCドライバの[ダウンロード](http://dev.mysql.com/downloads/connector/odbc/)
 * 今回はMac OS X 10.7 (x86, 64-bit), DMG Archiveをインストールしました

# 手順
　いろいろなやり方があると思いますが、今回はVagrant内の仮想環境に対して、SSHポートフォワーディングを行いました。

　具体的には、[こちら](http://www.tamurasouko.com/?p=1092)のサイトを参考にさせていただき、以下のようなコマンドを実行しました。

```
ssh -f -N -C -L 12345:127.0.0.1:3306 hostname
```

これにより、tableauのMySQLの設定でサーバーを127.0.0.1、ポートを12345にすることで使えるようになりました。

### 参考リンク
* [Tableau Software 製品のヘルプ](http://www.tableau.com/ja-jp/support/help)
canonical属性でURLを正規化

# canonical属性とは？
URLを正規化する方法のひとつ。似たような内容（もしくは完全重複）のコンテンツが複数存在する場合、URL正規化タグを使うことによって、検索エンジンに対して統一のURLを指定することができる。

例えば…
http://fuga.com
というサイト内で

```hoge.html
<html>
 <body>
  <p>ほげほげ</p>
 </body>
</html>
```

```hoge01.html
<html>
 <body>
  <p>ほげほげ</p>
 </body>
</html>
```

とあり、hoge01.htmlがhoge.htmlの重複コンテンツだとすると、hoge01.htmlのhead要素に

```
<head>
 <link rel="canonical" href="http://fuga.com/hoge.html">
</head>
```

と記述することで、hoge.htmlとページ内容が同じであることを検索エンジンに伝えることができる。
これによって、検索エンジンからの評価を下げず、インデックスさせるURLをhoge.htmlに指定することができる。

# 自己参照canonical
canonical属性に、ページ自身のURLを記述すること。
たとえば

```www.hoge.com/hugahuga
<head>
 <link rel="canonical" href="http://www.hoge.com/hugahuga">
</head>
```

という場合である。一見意味がないように思えるが、例えばhugahugaの後にパラメータ付きURLが生成される場合は、重複コンテンツとみなされるリスクを回避できる。


### 参考リンク
* [Googleウェブマスターツール＞正規URLを使用する](https://support.google.com/webmasters/answer/139066?hl=ja)
Onsen UI のサンプルを動かしてみる


Onsen UI を利用したサンプルアプリを Firefox OS で動かしてみました。


# ■サンプルアプリをDLする

[Monaca の公式サイトにサンプル](http://docs.monaca.mobi/cur/ja/sampleapp/samples/)があります。

![monaca_top_ss.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/a6f1436f-117a-9944-92f6-7d8d97ef1355.jpeg "monaca_top_ss.jpg")

今回はOnsen UI スライドメニューを使用してみます。

Monacaの サイトから下記の UI スライドメニューをDLします。

![monaca_slide.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/74de8d49-844c-19c1-59a0-b5719a91b63d.jpeg "monaca_slide.jpg")


以下から [Download ZIP]を選択し DL するか、 git clone にて取得して下さい。
https://github.com/monaca/project-templates/tree/dev

今回使用するサンプルは 8-ons-sliding-menu-nav/www です。

# ■Firefox OSで動かす

Firefox OS で動かしてみたいと思います。

まず、 Firefox ブラウザから WebIDE を起動しサンプルアプリを読み込みます。

Firefox ブラウザを起動したらメニューから[開発ツール]を起動します。
![開発ツール.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/15f9d41f-13bd-849d-f3e2-2260eec1b8c0.jpeg "開発ツール.jpg")

次に [WebID] を選択し、WebIDE を起動します。
![WebIDE.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/d27cc18f-f4db-75f9-661a-78eb71bd5f8d.jpeg "WebIDE.jpg")

WebIDE が起動した後は、先ほど DL したサンプルアプリを開いてみましょう。
[パッケージ型アプリを開く]を選択し、 DL したサンプルアプリを選択して下さい。
![WebIDE_Open.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/db94b91c-9684-b159-1406-340fd275840f.jpeg "WebIDE_Open.jpg")

「パッケージアプリは、プロジェクトのルートフォルダに 'manifest.webapp' という名前の manifest ファイルが必要です」
というエラーが表示されました。

![WebIDE_error.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/0285162f-4749-8eac-b586-7d2646cfc674.jpeg "WebIDE_error.jpg")

Firefox OS アプリは manifest が無いとダメですので、manifestファイルを追加します。

``` manifest.webapp
{
  "name": "OnsenUI slidemenu",
  "description": "OnsenUI slide application",
  "launch_path": "/index.html",
  "icons": {
    "512": "/img/icon-512.png",
    "128": "/img/icon-128.png" 
  },
  "developer": {
    "name": "name",
    "url": "http://your-homepage-here.org" 
  },
  "default_locale": "ja" 
}
```

正しく追加できた場合、以下のようにエラー表示がされなくなります。
※今回はアプリアイコンの設定は行わないため、アプリアイコンは表示されないままです。

![manifest_done.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/c7e61392-1acb-a014-1f2a-a3bdf09ebd21.jpeg "manifest_done.jpg")

次に、シミュレータ上で起動させてみることにします。
右上の[ランタイムを選択]から[Firefox OS 2.2]を選択します。もし、項目が表示されていない場合は
[シミュレータをインストール]を選択し、Firefox OS 2.2 のシミュレータをインストールして下さい。

シミュレータの起動が完了した後、WebIDEの再生ボタンを選択し、シミュレータにアプリをインストールします。

正しくインストールが出来れば、以下の様に起動するはずです。

![sample1.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/25f8e9a5-06b0-ebef-e4cc-dfd2c33ccb69.jpeg "sample1.jpg")

![sample2.jpg](https://qiita-image-store.s3.amazonaws.com/0/27642/c90e4965-b4b6-0010-236c-586ec0f4df83.jpeg "sample2.jpg")

左からフリックか画面上のボタンタップでメニューが表示されます。
uGUiのButtonで自分のSetActiveを引数にする。

ボタンクリックイベントにGameObject.SetActiveをセット
　↓
エディターを実行してボタンをクリックすると、ボタン自身が消える。
※再度クリック可能にするにはスクリプト側でSetActiveがTrueにする必要あり。

チュートリアルみたいに１回しか使用しない時には楽かも!


![uGUi_Button_Click.png](https://qiita-image-store.s3.amazonaws.com/0/17904/23e4bab0-85b9-6dfb-eff8-19af0fc4bdde.png)
jQuery Validation Plugin 簡単な使い方まとめ

jQuery Validation Pluginの簡単な使い方まとめです。
http://jqueryvalidation.org/

#基本形式
```lang:javascript
$("form").validate({
	rules: {
		"menu[]" :{
			required: true
		},
		date :{
			require_from_group: [1, ".date_group"]
		}
	},
	messages: {
		"menu[]":{
			required: "ご希望のメニューを選択してください"
		},
		date :{
			require_from_group: "日時を選択してください。"
		}
	}
});
```
rulesにはそれぞれのname属性に対するチェック項目を決められます。
チェックボックスなんかで「name="menu[]"」としている場合は
「"menu[]":{}」という感じで囲ってあげてください。
messagesにはそれぞれのチェック項目に対するエラー内容（テキスト）をいれます。

#focusした後に何もせずblurした場合もチェックする
```lang:javascript-jquery.validate.js
if ( !this.checkable( element ) && ( element.name in this.submitted || !this.optional( element ) ) ) {

↓↓↓↓↓↓

if ( !this.checkable( element ) ) {
```
デフォルトだと、ルールに「required」が設定されていても、
focusした後に何もせずblurした時にチェックしてくれません。
なので、上のように、「jquery.validate.js 」内のソースを修正すれば、
ちゃんとチェックしてくれるようになります。

#エラー表示位置を変える場合
```lang:javascript
errorPlacement: function(error, element) {
	element.before( error );
}
```
デフォルトでは指定したエレメントの後にエラーが入りますが、
「errorPlacement」でエレメントの前にも表示可能です。

#チェックボックスのvalidation
```lang:javascript
$('input[type="checkbox"]').on('click', function() {
	$('form').validate().element( this );
});
```
デフォルトでは、チェックボックスに「required」をつけても反応してくれないので、
上記を追加してやると該当エレメントのバリデーションを実行してくれます。
##validationおまけ
$('form').validate();
と書いてやると、フォーム全体のバリデーションが行えます。

#あとからチェック項目を変更
```lang:javascript
$( ".foo" ).rules( "add", {
	required: true,
});
```
ラジオボタンでAが選択したらA'を必須項目にしたい場合等は、
rules("add",{ 追加チェック項目 });
でチェック項目を増やすことができます。
rules("remove",{ 削除チェック項目 });
でチェック項目を減らすこともできます。

#カスタムチェック項目
```lang:javascript
$.validator.addMethod("phone", function(value, element) {
	return this.optional(element) || /^[\d,-]+$/.test(value);
}, "数字を入力して下さい");
```
「$.validator.addMethod」を使って、カスタムチェック項目を作れます。
上記の例は、「数字とハイフンのみの場合OK」という感じです。
電話番号や郵便番号などに使えるかなと思います。
WebDAV環境の構築手順

# WebDAV環境の構築手順
各種lamp環境は整っている前提です。


## mod_sslのインストール
`yum -y install mod_ssl`

## オレオレ証明書の作成
`cd /etc/pki/tls/certs`

### 証明書の発行
`openssl genrsa -des3 -out server.key 2048`
パスワードを2回聞かれるので入力する

`openssl rsa -in server.key -out server.key`
パスワードを聞かれるので上で入力したパスワード入力する

`openssl req -new -x509 -days 3650 -key server.key -out server.crt`
少なくとも Country Name と Common Name は正しい値を入れる
- Country Name : Ja
- Common Name : DomainName

### アクセス権の変更
`chmod 400 server.key`
`chmod 400 server.crt`


## ssl.confの編集

`vi /etc/httpd/conf.d/ssl.conf`

SSLCertificateFileとSSLCertificateKeyFileを下記のように変更

`SSLCertificateFile /etc/pki/tls/certs/server.crt`
`SSLCertificateKeyFile /etc/pki/tls/certs/server.key`

## /etc/httpd/conf.d/webdav.confの作成

`vim /etc/httpd/conf.d/webdav.conf`

```apache
Alias /dav/ "/var/www/html/dav/"
<IfModule mod_dav.c>
DAVMinTimeout 600
<Location /dav>
DAV On
EnableSendfile off
SSLRequireSSL
AuthType Basic
AuthName "Login WebDAV"
AuthUserFile "/etc/httpd/conf/.htpasswd"
Require valid-user
Order deny,allow
Deny from all
Allow from all
</Location>
</IfModule>
```
WebDAVのディレクトリが変わる場合はAliasを変更する

## Basicの設定
`htpasswd -c /etc/httpd/conf/.htpasswd username`
入力後パスワードを2回聞かれる

## Apacheの再起動
`service httpd restart`

## WebDAVにつなぐ
[https://domainname/dav/](https://domainname/dav/)
htpasswdのユーザー名とパスワードでログインできる

### コマンドラインから接続（Windows）

#### 接続
`net use I: https://domainname/dav/ /user:username password`

#### 接続解除
`net use /delete I:`
## 参考URL
- [【オレオレ証明書】自作WebDAVサーバーにWindows7で接続する【MacもOK】](http://www.kyoji-kuzunoha.com/2012/04/webdavwindows7windows7.html)
- [【imoten用VPSを】WebDAVサーバーを立ててみよう【使いつくす】](http://www.kyoji-kuzunoha.com/2012/04/webdavwindows7windows7.html)
- [webdavでsslでベーシック認証するための設定](http://www.systemexpress.co.jp/windows/webdav.html)
- [net - ファイル共有サービス制御](http://yanor.net/wiki/?Windows%2F%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%2Fnet%20use%20%28net%20share%29%20-%20%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%85%B1%E6%9C%89%E3%82%B5%E3%83%BC%E3%83%93%E3%82%B9%E5%88%B6%E5%BE%A1)
【HTML5】video要素


#video要素の使い方
##通常
```html:kobito.html
<video src="movie.mp4" autoplay>

	<!--代替画像-->
	<img src="dole.jpg">
	
</video>
```

##複数の拡張子を指定するばやい

```html:kobito.html
<video poster="dole.jpg" autoplay>
	<source src="movie.mp4" type="video/mp4">
	<source src="movie.mov" type="video/mov">
</video>
```
主要データベース 自動採番取得方法

|データベース名|取得方法|
|-----------|------|
|SQLServer|select SCOPE_IDENTITY();|
|Access|select LAST(id列名);|
|MySQL|select LAST_INSERT_ID()|
|PostgreSQL|select curval('シーケンス名')|
|SQLite|select seq from sqlite_sequence where name='テーブル名'|
|Oracle|select シーケンス名.curval from dual;|
|hsqldb|call identity()|
tableの中のdivタグをtdタグいっぱいまで広げる方法

tableタグの中でcolspanを使用しているtdタグをdivタグに置き換える際にはまった内容が解決したので、忘れないうちにメモ。

# 状況
tdタグの中のdivタグのheightを100%にしても高さが100%にならない。

# 対策
Google先生に教わったところ、table、td、divタグ全てをheight 100%にしなければならないとのこと。

# でも実際は、、、
確かにdivタグはheight 100%になったけど、なぜか1行目だけ異常な高さになってしまった。2行目からは問題はない。

# 原因（というか考察）
どうもtableタグを100%に指定すると、最低限の高さが決められてしまう模様。その状況で、tdタグのheightを100%にすると、tableタグいっぱいの高さになる（これが1行目だけ異常な高さになる要因）。

# 解決策
調べても解決策が見つからなかったので、いろいろと試した結果、以下の方法で目的を達成することができました。

```table.css

table {
  height: 0 auto;
}

table div {
  height: 100%
}
```

ええ、「width: 0 auto;」と一緒のことがheightでもできるってことです。tdタグのheight指定は不要です。

Chrome、FireFoxでの確認はOKでした。
IE?スマホサイトを想定してるので検証してません！

以上、はまっている方は参考にどうぞ。
【資料公開】社内LTで「プログラミング学習の3つのポイント」を話しました。

社内でLTを月に一回ぐらいのペースで開催していて、久々に登壇しました。

久々に発表用資料を作りましたが、頭の中を整理するのにちょうどいいですね。あとLTで意識しているのは「緊張感を楽しむ」ということ。
これは中学時代の部活（実はバレー部のキャプテン）で先生に教えてもらった言葉ですが、いまも意識しています。

大した話ではないですが、資料公開しておきます。
（今年は発表に力入れているので）

**speakerdeck**
[every-day-programing](https://speakerdeck.com/maaaato/every-day-programing)

<h2>1.SIMPLE　シンプルに継続する。</h2>
継続は力なりという言葉の通り、続けるとすこしずつ成長はする。
運動もそうで、ジムに週6日くらい通っている奥さんの方が、だんぜん動ける。。。頑張ろう。

<h2>2.EASY&SMALL 小さく簡単に作る。</h2>
少しでも動くとやっぱ楽しい。いきなりでかいものは作れないので、少しずつ進めていく。
そして、簡単なものでいいから作る。

<h2>3.READ コードを読む。</h2>
コード読むのはメリットだらけ。次第に読めてくると楽しいし、アイディアも湧く。
尊敬・憧れのエンジニアのコードだと尚更。

憧れのエンジニアはメルカリの久保さん。これはdotsSummit2015の発表を見て、カッコイイと思いました。
発表も冷静沈着な印象で、僕とは違う感じ（笑）
slackboardの話で、イラっとしてGoでささっと書いたという話が印象的で、インフラでしっかりコードが書ける久保さんのようになりたいと思いました。
なので、slackboardのコードはgithubで読んでます。

ということで、pocket-for-Golangを頑張るぞ。
node.js サブドメインでfavicon出し分け


```js
var fs = require('fs');
var http = require('http');
 
var html = '<html><body>test</body></html>'
 
http.createServer(function (request, response) {
	var host = request.headers.host
	var arrayOfStrings = host.split('.hostname.');
 
	var path = 'static';
	if (arrayOfStrings.length == 2){
		path = path + '/' + arrayOfStrings[0];
	}
 
	if(request.url == '/favicon.ico'){ //ファビコン
		var buf = fs.readFileSync( path + '/favicon.ico');
		response.writeHead(200, {"Content-Type": "image/vnd.microsoft.icon"});
		response.end(buf);
	} else { //ファビコン以外
		response.writeHead(200, {'Content-Type': 'text/html'});
		response.end(html);
	}
}).listen(8888);
Goでtoml.DecodeFileしたときにハマったことメモ

<img src="http://nikuniku.me/wp-content/uploads/182b65b9-539c-4d24-9b1f-ee4a1a8756f1.png" alt="182b65b9 539c 4d24 9b1f ee4a1a8756f1" title="182b65b9-539c-4d24-9b1f-ee4a1a8756f1.png" border="0" width="240" height="240" />
TOMLという設定ファイルの為のミニ言語があり、それをGoで試してみた所、うまく読み込まれずにハマってしまったので、メモ。

config_test.go
<pre><code>
package main

import (
	"github.com/BurntSushi/toml"
	"testing"
	"fmt"
)

type ConfToml struct {
	Keys SectionKeys `toml:"keys"`
}

type SectionKeys struct {
	Consumer_key string `toml:"consumer_key"`
	access_token string `toml:"access_token"`
}

// config の read
func readSettingsConfig(path string, config *ConfToml) {
	_, err := toml.DecodeFile(path, config)
	if err != nil {
		panic(err)
	}
}

func Test_readSettingsConfg(t *testing.T) {
	var conftoml ConfToml

	_, err := toml.DecodeFile("config.toml", &conftoml)	
	if err != nil {
		panic(err)
	}
	
 	fmt.Println(conftoml.Keys)

	// Printlnする為に、あえてerrorにしている。
 	if conftoml.Keys.Consumer_key != "aab" {
 		t.Error("Not Match")
 	}
 	if conftoml.Keys.Consumer_key != "bbb" {
 		t.Error("Not Match")
 	}

}

</code></pre>

config.toml
<pre><code>
[keys]
consumer_key = "aaa"
access_token = "bbb"
</code></pre>

実行結果
<pre><code>
<strong>{aaa }</strong>
--- FAIL: Test_readSettingsConfg (0.00s)
        config_test.go:38: Not Match
        config_test.go:41: Not Match
FAIL
FAIL    command-line-arguments  0.005s
</code></pre>

この太字にしたところがポイントで、これはtomlファイルを読み込んだ構造体をPrintlnしているのですが、aaaという値だけ格納されている状態です。
本来ならば、{aaa bbb}となるはずです。

<pre><code>
type SectionKeys struct {
	<strong>Consumer_key</strong> string `toml:"consumer_key"`
	<strong>access_token</strong> string `toml:"access_token"`
}
</code></pre>
このSectionKesyという構造体のフィールド名が小文字と大文字で違っているのが原因です。
どうやらDecodeFileは<strong>フィールド名が小文字だと値が設定されない</strong>ようです。
※Access_tokenと大文字で設定すると正しく値は設定されました。

恐らくですが、github.com/BurntSushi/tomlパッケージ外の構造体へのアクセス権限がない（エクスポートできない）のが原因かと思っています。
値が設定されず、やだな〜やだな〜こわいなーこわいな〜とハマっておりました。

謝った認識かもしれませんので、ご指導ご鞭撻のほどよろしくお願いします。

<h2>参考サイト</h2>
<a href="http://qiita.com/futoase/items/fd697a708fcbcee104de" target="_blank">【個人メモ】設定ファイルフォーマットにはTOMLがいいのかも</a>
<a href="http://blog.monochromegane.com/blog/2014/03/23/struct-implementaion-patterns-in-golang/" target="_blank">Go言語での構造体実装パターン</a>
【AWS】ElastiCacheRedisをMulti-AZ構成にするとAOFの設定ができないっぽい？

<img src="http://nikuniku.me/wp-content/uploads/redis.png" alt="Redis" title="redis.png" border="0" width="349" height="300" />
今日はElastiCacheRedisを触ることが多かったので、本日二回目のElastiCacheのメモ。

ElastiCacheRedisがMulti-AZ対応したので、Multi-AZ構成でクラスタを作成していたのですが、
なんとParameterGroupでappendonly yesにしたgroupを設定するとエラーとなってしまうのです！ドン！（多分だけど。。。）

<pre><code>
Cannot have redis persistence(appendonly) and Multi-AZ both on
</code></pre>

ちなみにこんなエラー。

どうやら同じエラーになった方がいたようで、こちらの記事を参考にさせて頂きました。
<a href="https://siguniang.wordpress.com/2015/02/14/cannot-have-aws-redis-aof-and-multi-az-both-on/" target="_blank">[AWS]マルチAZなElastiCache Redisの永続性についてメモ</a>

実は今年の一月ぐらいに他のインスタンスで同じMulti-AZ構成にしたクラスタがあったのですが、そちらはなんとAOFの設定が出来ているのです！（さらに深まる謎）

<h2>結局のところ</h2>
埒が明かないので、AOFの設定無しのParameterGroupを設定したところ、クラスタの作成が問題なく出来ました。
参考にさせて頂いた記事にありましたが、Multi-AZではインスタンスが死んだら、そのインスタンスは破棄するので、AOFを残す意味がないから？という仮説を立てられておりました。
自分もその意見には納得です。

だれかご存知の方いますかーーーーー？

<font color="red">追記 2015/02/18</font>
この件についてAWSに問い合わせしたところ早速回答がきました！
Multi-AZ構成でAOF設定は<strong>出来ない仕様</strong>
さらに英語のみですが、ドキュメントに記載されているとのこと。
　- Best Practices for Implementing Amazon ElastiCache / Mitigating Out-of-Disk-Space Issues When Using AOF
　<a href="http://docs.aws.amazon.com/AmazonElastiCache/latest/UserGuide/BestPractices.html#BestPractices.FaultTolerance" target="_blank">http://docs.aws.amazon.com/AmazonElastiCache/latest/UserGuide/BestPractices.html#BestPractices.FaultTolerance</a>

<BLOCKQUOTE>
Enabling Redis Multi-AZ as a Better Approach to Fault Tolerance
　If you are enabling AOF to protect against data loss, consider using a replication group with Multi-AZ enabled instead of AOF. In any Redis replication group, if a replica fails, it is automatically replaced and synchronized with the primary cluster. If Multi-AZ is enabled on a Redis replication group and the primary fails, it fails over to a read replica. This functionality is much faster than rebuilding the primary from an AOF file. For maximum fault tolerance, even against a hardware fault in an underlying physical server, launch your primary and replica clusters in different Availability Zones. Because there is no need for AOF in this scenario, you do not risk running out of disk space.

AOF ですがローカルディスクに書き込みを行う都合上、物理的な障害には対応できません。また、ディスクに書き込みを行う都合上、更新が非常に多いとローカルディスクを使い切り書き込みができなくなる事例も報告されております。この影響を回避するため、ベストプラクティスとしては AOF ではなく Multi-AZ 構成によって耐障害性を考慮頂くことをお勧めしております。
Multi-AZ 構成により十分な耐障害性が確保できることから、ElastiCache の仕様としては AOF との併用ができないような仕様となっております。
</BLOCKQUOTE>

やはりMulti-AZになったことでAOFファイルつくる必要がないという判断のようです。

早急に連絡くれたサポートに感謝！
【AWS】S3のrdbファイルからElastiCache Redisを作成する時の些細な注意点

<img src="http://nikuniku.me/wp-content/uploads/redis.png" alt="Redis" title="redis.png" border="0" width="349" height="300" />
S3にアップしたrdbファイルからElastiCacheを作成することってよくありますよね。ありますよね。

僕は今回初めて対応しましたが、たった些細な設定が漏れていた為、大ハマりしました。お世話になりました。

<h2>ドキュメント</h2>
<a href="http://docs.aws.amazon.com/ja_jp/AmazonElastiCache/latest/UserGuide/ManagingSnapshots.html" target="_blank">バックアップと復元の管理 (Redis)</a>

<BLOCKQUOTE>
RDB ファイルへの読み込みアクセスを ElastiCache に許可<br><br>

次のステップでは、Amazon S3 にコピーしておいたスナップショットファイルへの読み込みアクセスを ElastiCache に許可します。<br><br>

Amazon S3 にコピーしておいたスナップショットへの読み込みアクセスを ElastiCache に許可するには<br><br>

AWS Management Console にサインインして Amazon S3 コンソールを開きます（https://console.aws.amazon.com/s3）。<br><br>

[All Buckets] をクリックし、RDB ファイルを含む Amazon S3 バケットの名前をクリックします。<br><br>

RDB ファイルを含むフォルダの名前をクリックします。<br><br>

RDB ファイルの名前をクリックし、[Actions] ドロップダウンメニューをクリックして [Properties] を選択します。<br><br>

[Permissions] をクリックして [Add more permissions] をクリックします。<br><br>

[Grantee] ボックスに、E メールアドレス<strong>「aws-scs-s3-readonly@amazon.com」</strong>を入力します。<br><br>

[Open/Download] をクリックし、[Save] をクリックします。<br><br>

Note<br>
aws-scs-s3-readonly@amazon.com アカウントは、Amazon S3 から Redis スナップショットデータをアップロードするお客様だけが使用します。
</BLOCKQUOTE>

<h2>aws-scs-s3-readonly@amazon.comを許可</h2>
はい。これを許可してなかったので、No permission to access S3ってエラーになってましたとさ。

ドキュメント大事。

（ってかこれハマる人結構いるんじゃね）