OmniAICreator/Qiita-1.07M huggingface dataset:
Sketchでイラストレーターのスウォッチデータを使う方法

イラストレーター（イラレ、Illustrator）で、カラーパレットを作ったのでそれをSketchでも使いたい！例えば、

* 最近、社内でデザインガイドライン作った！
* イラストレーター色の管理をするようにした！

でも、Sketchに移行しようと考えている...とかとか。
そんな時のために、Sketchでイラストレーターのスウォッチデータを使う方法があります

# イラストレーターで作ったカラーパレットを出力する

イラストレーターで作ったカラーパレットを「スウォッチライブラリ交換用として保存」で保存します。この時の拡張子は 「*.ase」になります

## スウォッチライブラリ交換用として保存

<img width="437" alt="スクリーンショット 2015-11-27 0.22.22.png" src="https://qiita-image-store.s3.amazonaws.com/0/21321/3fd5b10e-c7f3-c782-1fda-ab63897149a1.png">

## スウォッチをライブラリとして保存

<img width="536" alt="スクリーンショット 2015-11-27 0.22.53.png" src="https://qiita-image-store.s3.amazonaws.com/0/21321/d3a92b1f-7028-55e6-0dec-ce7134fc49ac.png">


* ase は、Adobe Swatch Exchange の略らしいです

# ase ファイルをclrファイルに変換する

ase ファイルをclrファイルに変換します。clrファイルをSketchでは使います。

## ColorTools を利用して変換する

ColorTools というのがあります。

* https://github.com/ramonpoca/ColorTools
* https://github.com/ramonpoca/ColorTools/releases

## releases から ColorTools-0.2.zip をダウンロード

<img width="945" alt="スクリーンショット 2015-11-27 0.50.28.png" src="https://qiita-image-store.s3.amazonaws.com/0/21321/046da164-906e-c676-e522-30941ee9af12.png">


## ColorToolsの使い方

デスクトップに ColorTools-0.2.zip を解凍
こんな感じに配置します。作った color_ai.ase を


<img width="430" alt="スクリーンショット 2015-11-28 14.40.40.png" src="https://qiita-image-store.s3.amazonaws.com/0/21321/bc7f9c64-c64f-9604-04d3-2cda74f59a88.png">


## ターミナルで作業する

いわゆる黒い画面です。
起動したら、下記のようなコマンドを実行すると、`color_ai.clr` というファイルが生成されます

```
$ cd Desktop/ColorTools-0.2
$ ./Ase2Clr color_ai.ase
```

### 注意

`clr`という拡張子のファイルは、`NSColorList` というMac OS X のデータのファイルになります。
NSColorListについては、Appleのドキュメントに詳しく書いてあるので参考に。

https://developer.apple.com/library/mac/documentation/Cocoa/Reference/ApplicationKit/Classes/NSColorList_Class/

# Sketchに登録する

作った color_ai.clr をSketchに登録します

## 登録方法

パレットを登録 | 登録方法
------- | --------
<img width="244" alt="スクリーンショット 2015-11-27 1.01.42.png" src="https://qiita-image-store.s3.amazonaws.com/0/21321/e38b2c61-1bb4-5258-f1db-9544c612ba80.png"> | メニューの View -> Show Colors でカラーパレットを表示して登録可能になります


## 登録したら利用してみる

利用してみる | 利用方法
------- | --------
<img width="444" alt="スクリーンショット 2015-11-27 1.02.06.png" src="https://qiita-image-store.s3.amazonaws.com/0/21321/1d176f43-db8a-4642-4bf4-d15e31bf2fe5.png"> | 登録されたら普通に利用できます

# 実は...

このclrは、`NSColorList` ということで、Apple純正のアプリケーションであれば大体使えます。

## Keynote

読み込んで普通に実際に使える

<img width="580" alt="スクリーンショット 2015-11-29 10.14.59.png" src="https://qiita-image-store.s3.amazonaws.com/0/21321/6cd14004-16ca-de76-600b-0d8159e20ebb.png">

# まとめ

色をチームで管理する時には、どうしてもバラバラになりやすいですが、スウォッチデータや、clrファイルを用意すれば多少は管理しやすくなるハズ...
gitの改行コード自動変換

gitの改行コード自動変換についてです。

投稿の経緯は、現場でPushしたコードの全行で改行コードの差分が出たことで原因を探る、ということがあったことです。

以下はインストーラーでの設定画面です。
![git_config.png](https://qiita-image-store.s3.amazonaws.com/0/92805/b0010ed7-5e3c-3a02-f3bc-573f7a8f1c4c.png)

設定値の詳細は下記の投稿を参照。
http://qiita.com/shuhei/items/2da839de8803cb335f86

ここで、作成される「.gitconfig」ファイル内の設定「autocrlf」には、
「true」「input」「false」の３種類が設定されます。

しかし、設定自体を削除することも可能で、設定がない場合は「false」となります。

現場では、上記のように、設定を記述しないことで差分が出なくなりました。
理由は分かっていないので引き続き調査します。
長い間運用を続けてきたプロジェクトの改善をして考えたこと

これはMynet Advent Calendar 2日目の記事です。

3年以上運用してきたプロジェクトにJenkisを導入するなどフローを整理して、そこそこうまく回るようになりました。

その際、いろいろと考えたことがあったのでまとめてみました。

## 導入前のプロジェクトの状況

+ Javaのプロジェクトを個々のPCでビルド
+ リポジトリはSVNのmaster一本運用
+ サーバーの更新はSCP経由でファイルアップロード
+ リリースはサーバー内のシェルスクリプト

## プロジェクトの問題点

+ ビルドに時間がかかる
+ ブランチという考えがない
+ サーバーの更新がエンジニアの手が開いてる時のみ
+ 更新作業がたるい

## じゃあ○○（お好きなツール名を入れてください）を導入だ！とはならない

「誰が」「何を」「どのように」使うかを想定しないツールは、使われなくなるか一部の人しか使えなくなります。

なので何か新しいツールを導入する場合、人によってスタンスはいろいろあるとは思いますが私はだいたい以下の手順を踏みます。

1. 想定利用者へ各職種ヒアリング
2. 表面上見えてる問題から問題の本質の精査
3. 解決のプランを費用・工数・利用難易度を軸に複数作る
4. 最小機能でテストできる状況を作る（作れない方法はそもそも案から捨てる）
5. 実行
6. 周知
7. レクチャー・リファレンスの整備

### 想定利用者へ各職種ヒアリング

ツールを利用する役職の人へ、今どんな使い方をしているか、なぜそうなっているか、どうなっているのが理想かをヒアリングします。

大抵プロジェクトの状態が固定化されている理由は、

+ 時間の問題（工数）
+ 人の問題（スキル・習熟度）
+ 環境の問題（費用含む）

の3つに集約されるので、そこを中心にヒアリングして何が出来て何が出来ないのかを把握しないとそもそもツールを導入することができません。

### 表面上見えてる問題から問題の本質の精査

例えば「ビルドに時間がかかる」という問題ですが、ビルド時間の短縮だけを考えるならスペックのいいPC一台用意すれば最低限解決はします。

ですが、本当に困っているのが「ビルド中エンジニアの手が止まる」ことであるなら、短縮はできなくてもエンジニアの利用するPC以外でビルドができれば解決する問題だったりします。

### 解決のプランを費用・工数・利用難易度を軸に複数作る

プロジェクトで使える人・金・時間は有限です。

それを無視してプランを作っても無駄ですし、1案だけ作って提案して却下されるとそれまで考えてきた時間が無駄になるため複数案だします。

大抵その中で修正・組み合わせすれば妥協点は見えてきますし。

### 最小機能でテストできる状況を作る

いきなりでかい改善をするのではなく、プランを個々のタスクに置き換え、一つづつ解決したらテストできる状況を作ります。

これが出来ない状況だと、なにか問題を見えないふりをしているか対象とする問題が大きすぎる場合がほとんどです。

### 実行・周知・レクチャー・リファレンスの整備

これはそのままですね。

基本的にプロジェクトの人は入れ替わるという前提で、資料を整備するのは最低限です。

さらにツール利用しないメンバーにも「○○というタスクは今まで☓☓さんしかできなかったがエンジニアチームの誰でもできるようになったので手が開いてる人に依頼してください」と伝えるだけでも日々の作業はだいぶかわります。

## 最後に、具体的に何やったかのまとめ

+ リポジトリをGithubに変更し、git-flowの導入
+ 画像リポジトリを用意し、サーバー上で直接更新作業ができるように
+ Jenkinsを導入し、ビルド・リリース作業を誰でもできるように（利用者はエンジニアを想定）

これだけ？という感じですが、いきなり大きく変更すると現場が追いつけないので、上記の内容もかなり時間を使ってちょっとずつ進めました。

ソーシャルゲームの開発現場なので、日々の運用が最優先です。

まだまだやりたいこと、考えていることは多いですが無理の無い範囲で少しづつ環境をストレスフリーにできればいいなぁと思いながら日々運用しています。
React Native - iOS開発のはじめの方

今日はiOSアプリをビルドしてみます。

必要な環境は下記になります。（2015年12月2日時点です。バージョンごとに変わっていくので、[オフィシャル](https://facebook.github.io/react-native/docs/getting-started.html)を参考にしてください。

* OSX
* Homebrew
    * flowとwatchmanの使用を推奨
* Node4.0以上(Node5.0以上の場合はnpm2を推奨。npm3は遅いから）
* iOSアプリはXcode7以上

私の環境は下記になります。npm3を使っていますが、現時点で[やや問題](https://github.com/facebook/react-native/issues/4296)があるようです。オフィシャルのドキュメント通りにnpm2の使用した方がいいかもしれません。

```
$ npm --version
3.3.6
$ node --version
v5.0.0
$ brew --version
0.9.5 (git revision 5ddbed; last commit 2015-10-30)
$ watchman --version
3.7.0
$ flow version
Flow, a static type checker for JavaScript, version 0.18.1
```

## 開発環境の構築

1) 下記のコマンドでReact Nativeのプロジェクト作成。

```
$ npm install -g react-native-cli
$ react-native init ReactNativeAdvent2015
```

2) Xcodeを立ち上げて、ReactNativeAdvent2015/ios/ReactNativeAdvent2015.xcodeprojをOpenする。

3) XcodeでBuild, Runすれば下記の画面が立ち上がる。
![firstios.png](https://qiita-image-store.s3.amazonaws.com/0/13663/d94ce92a-f2a9-4025-aa54-fda237089269.png)

3) 任意のエディタでindex.ios.jsを開いてコーディング開始。command-RでJSを再読み込み。

## JSファイルの配信の仕組み

XcodeでBuild, Runするとターミナルがたちが上がり、バックグランドでServerが起動します。このサーバ経由でJSファイルをロードします。AppDelegate.mを開くとjsCodeLocationを指定する箇所があり、ここを変更することで配信元の変更ができます。

```
# in AppDelegate.m
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
```

デフォルトではlocalホストで配信し、イントラネットで手持ちのマシンのIPに設定すれば配信できます。

```
# in AppDelegate.m
jsCodeLocation = [NSURL URLWithString:@"http://192.168.1.25:8081/index.ios.bundle?platform=ios&dev=true"];
```

同様に外部サーバからも配信可能です。main.jsbundleをreact-nativeコマンドを使用して作成し、これをアップロードします。
```
$ react-native bundle --out /tmp/main.jsbundle --minify
```

一例ですが、Google Driveにアップロードし、Google Driveの[ホスティング機能](https://support.google.com/drive/answer/2881970?hl=en)を使って配信するにはAppDelegate.mを下記のように変更します。(FileIDは適宜変更してください)

```
jsCodeLocation = [NSURL URLWithString:@"https://www.googledrive.com/host/[fileID]?platform=ios&dev=true"];
```

アップロードするファイルごとにfileIDが変わってしまうのを防ぐためには[ファイルを上書き](http://blogger-hints-and-tips.blogspot.jp/2013/08/replace-google-drive-file-with-new-version.html)します。ファイルのバージョン管理もされるので戻すことも簡単です。

このようにJSファイルの配信はとても簡単です。Xcodeでライブラリをリンクさせる等の変更を加えなければ、このJSファイルの変更だけでアプリの変更ができてしまいます。これはユーザによるテスト時にとても有効です。Production環境の運用はファイル自体の大きさが1M近くもあることもあり、モバイル環境ではやや厳しいかもしれません。(4G環境なら平気だと思いますが,低速のエリアをカバーすると難しくなりそうです）

以上で、iOS開発のはじめの方を終わります。明日はAndroid編をお届けします。
knockoutでのViewModelの書き方

    この記事は、knockout.js Advent Calendar 2015の２日目の記事です。 先に１日目に目を通すことを推奨しています。
    knockout , knockout-es5 , knockout.punches環境を想定しています。

knockoutのViewModelの要件はとてもシンプルです。
要件は、

* ViewModelがObjectであること

だけです。

この手のライブラリ・フレームワークにありがちな、オレオレクラス(たとえば [Ember](http://guides.emberjs.com/v2.2.0/object-model/classes-and-instances/)、[React](https://facebook.github.io/react/docs/reusable-components.html)、[Vue](http://jp.vuejs.org/api/#Vue-extend))の独自実装方法を__勉強しなくてOK__です。

ViewModelがObjectであればいいだけなので、

```js:script.js
var vm = {
    myName: "山田",
    age: 1
};
```

[このように](http://jsfiddle.net/MKGaru/4Lhsfbs4/)、Objectリテラルを用いて書いてもいいですし、
<br>

```js:script.js
function VM(){
    this.myName= "山田";
    this.age= 1;
};
```
[このように](http://jsfiddle.net/MKGaru/onzbL3bd/)、Functionとしても書けます。
このため、[ECMAScript6,ES2015](http://js-next.hatenablog.com/entry/2014/11/01/034607)や、[TypeScript](http://www.typescriptlang.org/)などのAltJSと相性がとてもいいです。

これをTypescriptのClassで書くと

```ts
class VM{
  public myName="山田";
  public age=1;
}
```
となります。
今からでも間に合うUnity5のuGUI入門

Unity 4.6から新しいUIシステム「uGUI」が使えるようになりました。[^1]
これまでUnityの組み込みUIはOnGUIなどイマイチ感が拭えませんでしたが、これからはNGUIなどのプラグインを別途導入しなくとも良さそうです。[^2]
この記事ではUnity5を使ってnGUIの使い方と全体像を簡単に紹介します。[^3]

## まずは前準備
1. 新しいプロジェクトを作成
2. 「Directional Light」今回は使わないので削除
3. 「Main Camera」の「Clear Flags」を「Solid Color」にして背景を単色に変更
4. 「Game」タブのちょっと下をクリックして「Free Aspect」に解像度を変更
![figure1.png](https://qiita-image-store.s3.amazonaws.com/0/39587/dd12ff45-6b53-9ae7-07a9-2e7bd3c28bc8.png)
(ここまででこんな感じ)

## 画像を表示してみる
1. プロジェクトにpng画像を追加 [^4]
2. 追加したpng画像を選択し「Inspector」の「Texture Type」を「Sprite (2D and UI)」へ変更
3. 「Hierarchy」の「Create」から「UI」「Image」
4. 作られた「Hierarchy」の「Image」を選択
5. 「Inspector」の「Source Image」追加したpng画像を選択
6. 「Inspector」の「Pos X」と「Pos Y」の両方を0、「Width」と「Height」をpng解像度に合わせて設定
![figure2.png](https://qiita-image-store.s3.amazonaws.com/0/39587/f001b72c-47cc-ee26-d5f9-849b73c52dee.png)
(ここまででこんな感じ)

## ボタンイベントを使ってみる
1. 「Hierarchy」の「Create」から「UI」「Button」
2. 作られた「Hierarchy」の「Button」を選択
3. 「Inspector」の「Pos X」を0、「Pos Y」を100
4. 「Hierarchy」から「Button」左に三角マークをクリックし子要素として表示された「Text」を選択
5. 「Inspector」の「Text」を"button"から"ボタン"へ
6. 「Project」の「Create」から「C# Script」をクリックしファイル名を「ButtonClick」へ
7. 「Hierarchy」の「Create」から「Create Empty」をクリックし"Script"と命名
8. 「ButtonClick」をダブルクリックで開きスクリプトを後述のように編集
9. 「ButtonClick」をドラッグし"Script"へドロップ
10. 「Hierarchy」から「Button」を選択
11. 「Inspector」の「On Click()」右下の「＋」をクリックし、「Hierarchy」の"Script"をドラッグし追加された入力欄へドロップ
12. 「Inspector」の「On Click()」下「No Function」をクリックし「ButtonClick」の「OnClick」を選択
13. Unityを再生して「Game」タブ内のボタンをクリックすれば「Console」タブへ「click me」と表示されます！

```csharp:ButtonClick.cs
using UnityEngine;

public class ButtonClick : MonoBehaviour
{
    public void OnClick()
    {
        Debug.Log("click me");
    }
}
```

![figure3.png](https://qiita-image-store.s3.amazonaws.com/0/39587/9e5826d5-19e9-a607-30c7-90ec91d35955.png)
(ここまででこんな感じ)

## 全体像を見てみる
使うのはそう難しくありませんね
全体がどう組み合わさっているかHierarchyを見てみます

```yaml:hierarchy
Main Camera : 今回は特に関係ないです
Canvas      : 子にUI要素(画像とかボタンとか)を持ちます
  - Image   : 画像を表示。親にCanvasが必要
  - Button  : ボタンイベントを発火。親にCanvasが必要
    - Text  : テキストを表示。フォント設定可。親にCanvasが必要
EventSystem : マウス操作、タッチ操作、キーボード操作などから発生するイベント処理を担当
Script      : 今回はボタンイベントの受け口として使いました
```

## まとめ
これからUnityで開発を行うのであればUIシステムをuGUIにするのが良さそうです！[^5]
スプライトパッカーなどUI関連の部分も標準提供されているので、何かと楽です。


[^1]: [Unity 4.6 リリースノート](http://unity3d.com/jp/unity/whats-new/unity-4.6 "Unity 4.6 リリースノート") Features: "New UI System"

[^2]: [NGUI](https://www.assetstore.unity3d.com/jp/#!/content/2413 "NGUI")は使い勝手の良いUIフレームワークで、長らくUnity開発者の間で広く使われててきた有料アセットです。こちらの[NGUI関連記事](http://gamesonytablet.blogspot.jp/2014/02/nguiunity.html "NGUI関連記事")がとても面白いので合わせてご紹介します

[^3]: Unity5.2.1p4 を使って動作確認しています

[^4]: [unity-chanの素材](http://unity-chan.com/download/releaseNote.php?id=UnityChanLicenseLogo)を使わせて頂きました

[^5]: もし既にNGUIを使っているなら無理して引っ越す必要はないかも。例えばNGUIのUICamera.genericEventHandler相当がuGUIには見当たらないなど移行は簡単ではなさそう。
PostgreSQLでHello World!!

これは、[PostgreSQL Advent Calendar 2015](http://qiita.com/advent-calendar/2015/postgresql)のDay2の記事です。

今回は、PostgreSQL経由で、**Hello World**のCプログラムを書いてコンパイルして実行してみたいと思います。
PostgreSQLの接続ポートだけ開いているようなサーバ上でHello Worldしたいときに使えるテクニックです！！


以降のSQLは、すべて**スーパーユーザ**で実行してください。

```plpgsql
-- Hello Worldのソースを保存するテーブルを作成します。
CREATE TABLE hello_source (line serial, code text);

-- Hello WorldのCプログラムの実行結果を保存するテーブルを作成します。
CREATE TABLE hello_result (output text);

-- COPY FROM stdinで、Hello Worldのソースをhello_sourceテーブルに保存します。
COPY hello_source (code) FROM stdin;
#include <stdio.h>

int main(void)
{
    printf("Hello World !!\n");
    return 0;
}
\.

-- COPY TO PROGRAMで、Hello Worldのソースを/tmp/hello.cに保存し、gccでコンパイルします。
COPY (SELECT code FROM hello_source ORDER BY line) TO
  PROGRAM 'tee /tmp/hello.c; gcc -o /tmp/hello /tmp/hello.c';

-- Cプログラムを実行し、その結果をhello_resultテーブルに蓄積します。
COPY hello_result FROM PROGRAM '/tmp/hello';

-- 実行結果を確認してみましょう！！
SELECT * FROM hello_result;
```

### 注意
この例から分かるように、[スーパーユーザ](http://www.postgresql.jp/document/current/html/role-attributes.html)は、PostgreSQL上のすべての操作だけでなく、**任意のOSコマンドまで実行できてしまう非常に危険なユーザ**です。例えば、リモートからのスーパーユーザのログインを拒否するように[pg_hba.conf](http://www.postgresql.jp/document/current/html/auth-pg-hba-conf.html)を設定するなど、安易にはスーパーユーザが使われないようにしましょう！
業務系エンジニアがiPhoneアプリ開発エンジニア（iOSエンジニア）になる方法（Part１）

# はじめに
 この記事を読んでためになりそうな方

- 業務系エンジニアからiPhoneアプリ開発者になりたい人
- WEBエンジニアからiPhoneアプリ開発者になりたい人
- iPhoneアプリ開発に興味がある人
 
# 著者の経歴（過去）
- 業務系システムエンジニア
- JAVAエンジニア
- Oracle使い

# 著者の経歴（現在）
- iOSエンジニア

　ざっくり言うと業務系システム開発に１０年以上関わってきました。
　iPhoneが大好きでしたが、当時は業務系システムに携わっていて、iPhoneのアプリを開発したいな〜〜〜でも若くないしiOSエンジニアに転身できるかな？と思っていました。そんな業務系システムエンジニアの著者がどのようにしてiOSエンジニアに転身したかを何回かに分けて書きたいと思います。今回はPart1です。

# Macを買う
現在（2015年12月時点）では、iPhoneアプリ開発はMacでするのが基本です。
開発環境は、基本的にMacですので、Macを買いましょう。
業務系システムは、Windowsがまだ主流ですが、iPhoneアプリ開発はMacです。

私もWindows使いだったので、Macを使いこなせるかな？
とMacを購入前は不安でしたが、全く問題なかったです。
ですので、Windowsを使いこなせている業務系エンジニアの方は、全く心配ないと思います。

どのMacを買ったらいいの？？？

今、販売されているMacであれば何を購入しても問題なく開発できると思いますが、iOSエンジニアは、Mac book,Mac book pro,Mac book Airなどノート型のMacを使っている人が多い気がします。

まずはMacを買うがファーストステップです。

# 参考書選び
次に、Macを買ってみたけど、iPhoneアプリ開発ってどうすんの？？？

iPhoneアプリの開発言語は何？など超基本的なことから学んでいくことになると思います。ネットの記事なども参考になりますが、体系的なまとめられた書籍を購入することをオススメします。ネットの記事は断片的なことが多いので、最初は体系的にまとめられた書籍をオススメします。最新記事はネットの方が早いのでその辺は使い分けるといいと思います。

# オススメの参考書
最初からオライリーの書籍など難しいものを買うと挫折の原因になってしまうので、最初は無理をせずに超基本的なことから書いてある以下の書籍をオススメします。
システム開発経験者でもiOSの基礎的なところから学んだほうがいいと思います。

- XcodeではじめるSwiftプログラミング
http://goo.gl/TBcwIs

- 詳細! Swift 2 iPhoneアプリ開発 入門ノート Swift 2 + Xcode 7対応
http://goo.gl/ft9OGR

# Swift、Objective-Cどちらを学べばいい？？？
結論から言うと、プロとしてやっていきたいのであれば、現在（2015年12月時点）では、どちらもです。現在は、Objective-CからSwiftへの移行期だからです。

しかし、今後は主流になっていくのはSwiftなので、今からiOS開発をするのであればSwiftからやるのがいいと思います。ただし、Objective-Cのことも知っていたほうが断然いいです。


# 最後に
Part1では、iPhoneアプリ開発のはじめの一歩について書かせていただきました。次回以降は、より具体的な内容を書いていきたいと思います。

（株）スマートデバイス・テクノロジーでは、iOSエンジニアの仲間を募集しています。
iOSエンジニアに育成する研修制度があります。
興味がある方は、こちらをご覧ください。
https://www.wantedly.com/companies/smartdt
http://recruit.smartdt.jp/
autoclosureというマニアックで少し面白い機能

## autoclosureとは
Swiftにはautoclosureという機能があります。  

どういう機能かと言うと、下のように呼び出し側で渡した値をメソッド内ではクロージャーとして使えるものです。

```swift
method(1)

func method(@autoclosure closure: () -> Int) {
    closure() // → 1
}
```

@autoclosureを使わない場合は下のように書く必要があります。

```swift
method({ return 1 })

func method(closure: () -> Int) {
    closure() // → 1
}
```

## autoclosureが使われている所
上の説明だけだと「これは何が嬉しいの??」という感じなので実際に使われているところを紹介します。

使われているところはSwiftの標準メソッドです。
具体例としては&&演算子があります。

## &&演算子とautoclosure
Swiftでは&&演算子はグローバルな関数です。

```swift
public func &&<T : BooleanType, U : BooleanType>(lhs: T, @autoclosure rhs: () throws -> U) rethrows -> Bool
```

+-*/ など全ての演算子も同様です。

```swift
func +(lhs: Int, rhs: Int) -> Int
func -(lhs: Int, rhs: Int) -> Int
func *(lhs: Int, rhs: Int) -> Int
func /(lhs: Int, rhs: Int) -> Int
```

&&の両辺は引数なので、&&を普通に実装すると常にアプリがクラッシュします。

```swift
// autoclosureを使わない場合の&&の実装内容(予想)
func &&(left: Bool, right: Bool) -> Bool {
    if !left { return false }
    return right
}

let value: Int? = nil
// これは&&の1つ目の条件がtrue/falseに関わらず2つ目の条件は実行されるのでクラッシュする
let result = (value != nil && value! == 1)
```

これを回避する為には、&&の2番目の引数をクロージャーにして遅延実行する必要があります。

```swift
func &&(left: Bool, right: () -> Bool) -> Bool {
    if !left { return false }
    return right()
}

let value: Int? = nil
let result = (value != nil && { value! == 1 })
```

これで落ちなくはなりましたが、&&の右側に常に{}を付けるのはめんどくさいです。
しかし@autoclosureを使えば引数を自動でクロージャーに変換してくれるので{}を省略できてすっきりできます。

```swift
func &&(left: Bool, @autoclosure right: () -> Bool) -> Bool {
    if !left { return false }
    return right()
}

let value: Int? = nil
let result = (value != nil && value! == 1)
```

## autoclosureの細かい仕様
autoclosureを使ったメソッドの引数の型はクロージャーの戻り値の型と等しくなります。

```swift
method(1) // → closureの戻り値がIntなので引数の型はInt型

func method(@autoclosure closure: () -> Int) {
    print(closure()) // 1
}
```

クロージャーの引数はVoidにする必要があります。

```swift
// closureの引数を指定するとコンパイルエラー
func method(@autoclosure closure: (Int) -> Int) {
    print(closure()) // 1
}
```

## 参考URL
[Closures](https://developer.apple.com/library/prerelease/ios/documentation/Swift/Conceptual/Swift_Programming_Language/Closures.html#//apple_ref/doc/uid/TP40014097-CH11-ID94)
Node.jsをWindowsでビルドする


# モチベーション「Node.jsにcontributeしたい」

 Node.js Adventcalendar 1日目の[Node.js へのcontributeの仕方 - from scratch](http://yosuke-furukawa.hatenablog.com/entry/2015/12/01/093433)を読んで、Node.jsへcontributeしたい気持ちが高まりました。

## testへのcontributeがオススメ

「コントリビュートの出発点」にオススメされているのがtestへのcontributeです。

    testへのコントリビュートもまた盛んである。OS によってはコケたり、またタイミングが悪いとコケたりするコードのことを不安定なテスト、 flaky test と呼んでいて、これを撲滅する活動が盛んだからだ。

    test フォルダ以下に {フォルダ名}.status という名前のファイルが有り、そこを見るとどれが flaky でどれが flaky じゃないかがわかると思う。

    これを直すとかなり感謝されるし、取り込まれる可能性が最も高いコミットだとおもう。

    また、 lib/ や src/ を修正したらほぼ確実に test/ を書くことが求められるので、常に test を書くクセが付くはずだ。

    ここをコントリビュートの出発点にして欲しいと Node 学園祭に来た Rod Vagg も懇親会の二次会で言っていたので、間違いないだろう。

Rod Vagg オススメ！:smiley:

## WindowsにFLAKYテストがある
[status](https://github.com/nodejs/node/blob/master/test/parallel/parallel.status)を見るとWindowsのテストが`FLAKY`です。

```
[$system==win32]
test-debug-no-context                : PASS,FLAKY
test-tls-ticket-cluster              : PASS,FLAKY
```

では、Windowsでビルドしてみましょう。

# VMWare Fusion上のWindowsでビルド

手元のPCがMacです。VMWare Fusion上のWindowsでビルドしてみます。

[GithubのREADME](https://github.com/nodejs/node)の手順で進めます。

## 準備

必要なもの

- VisualStudio Community 2015
- Python2
- git

[VisualStudio Community 2015](https://www.visualstudio.com/)をインストールします。

[Chocolatey](https://chocolatey.org/)を使ってPythonをインストールします。
管理者権限のコマンドプロンプトで

```
choco install python2
```

pythonへのPATHはシステム環境変数に設定されます。
一回ログインし直します。

gitもchocolateyでインストールします。

```
choco install git.install
```

## ビルド

```
git clone git@github.com:nodejs/node.git
cd node
```

続いて

```
vcbuild nosign
```

数十分後、次のメッセージが出ればビルド成功です。

```
     ライブラリ C:\Users\shigeru.nakajima\node\Release\node.lib とオブジェクト C:\Users\shigeru.nakajima\node\Release\node.exp を作成中
  コード生成しています。
  コード生成が終了しました。
  node.vcxproj -> C:\Users\shigeru.nakajima\node\Release\\node.exe
```

ビルドしたexeファイルを実行してみます。

```
> Release\node.exe -v
v6.0.0-pre
```

## ビルド失敗
VisualStudio Community 2015をインストールしていても、次のエラーでビルドできないことがあります。

```
> vcbuild nosign
Looking for Visual Studio 2015
Looking for Visual Studio 2013
Failed to find Visual Studio installation.
```

### 原因
vcbuild.batは[vcvarsall.batの有無](https://github.com/nodejs/node/blob/master/vcbuild.bat#L116)でVisualStudioの有無を見分けます。

`C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC`を見ると、`vcvarsall.bat`がありません。

![CTdAifnUEAAF4Fx.png-large.png](https://qiita-image-store.s3.amazonaws.com/0/15964/e370da6f-7028-083e-dfc2-647259603833.png "CTdAifnUEAAF4Fx.png-large.png")

vcvarsall.batは、Visual StudioのVisual C++用セットアップをするとできます。

### 対策
#### Visual C++用セットアップ

`ファイル(F)` > `新規作成(N)` > `プロジェクト(P)`から`テンプレート` > `Visual C++` > `Install Visual C++ 2015 Tools for Windows Desktop`を選びます。

#### 参考リンク

[C++/Visual Studio 2015 プログラミング](http://y-okamoto-psy1949.la.coocan.jp/booksetc/introvcpp/On_vs2015/)
「探求のパラドックス」を避ける

古代ギリシャの哲学の中に、現代にも通じるような古くて新しい問題が含まれていることがあります。今回は、そんな問題の1つである「探求のパラドックス」について考えてみます。

# 探求のパラドックスって？
プラトンが説いたパラドックスなのですが、

> 物事を探求するとして、その物事を知っていればそもそも探求する必要が生じない。逆に、その物事を知らなければ探求することもできない。

というような内容です。

# プログラムを書く上で
ただし、プログラムを書くにあたっては、「必ずしも探求しなくていい」という点は最大の違いです。標準関数や演算子など、知っていれば探求せずに書くことができます。

## 知らなければ探せない
とはいえ、逆向きの「知らなければ探求のしようもない」という部分は、プログラミングにあたっても健在です。最初からあった機能を知らないばかりに、手間をかけて自分で実装して、挙句にはバグを発生させて…となってしまっては全く意味がありません。

ということで、こちらは何とかして避けないといけません。

# 回避するための手法
## リファレンスを通読しておく
まずは、使う言語やライブラリのリファレンスにはひと通り目を通しておきましょう。丸暗記する必要はありませんが、「こんなのがあったかな」と思えるようになれば、あとで探すこともできます。

## 「世界観」をつかむ
複数の言語を使ってみると、標準ライブラリのなかにほぼ同じ機能、あるいは似たような機能のものが存在することがわかると思います。また、最近は言語ごとにライブラリのリポジトリを作ってあることも多いので、どんなものがあるのかざっとのぞいておくと、「Rubyのgemには○○があったけど、似たようなのはnpmにあるかな」というように、「あるかも」という感覚を身につけることができます。

## アンテナを広げておく
ほとんどのプログラミング言語はチューリング完全なので、（速度を無視すれば）理論上はどの言語でも実装できる機能は同じです。また、多くの言語には他言語のライブラリを呼び出すような機構が存在します。ということで、自分の使っている言語に限らず、バインディングあるいはコード書き換えで他言語の魅力的なライブラリが使えるようになることもあるので、他言語でも気になるものはチェックしておいたほうがいいでしょう。
HTTP/2 GOAWAY, その使い方

> Go away, and never come back
> --- a creature living in cave

HTTP/2 には GOAWAY フレームがあります.  [RFC 7540](https://tools.ietf.org/html/rfc7540#section-6.8) によると接続を切る場合には送信せよとあります.  ペイロードにはピアが開始したストリーム ID で何かしら処理をしたものの最大値を設定します (last-stream-id).  このようなものを一体何のために使うのでしょうか.

HTTP/2 では一接続上にたくさんのリクエストをのせることができます.  基本的に持続的接続となって HTTP/1.1 のときよりも接続時間は長くなることを想定しています.  接続はタイムアウトによって切られることもありますが, 自発的に切る場合もあります.  自発的に切る場合の例としてはコネクションエラーなど致命的なエラーで続行不可能になるケース, とサーバーのメンテナンスやロードバランシングの目的などで新たに接続をしてほしい, とピアに伝えるようなケースがあります.

どちらもこの接続はもう＜すぐ＞終わりだよ, というシグナルですが, これを受け取ったエンドポイントにとって気になるところはどのリクエストまで処理した (中途半端な状態も含めて) のでしょうか, ということです.  処理が途中あるいは完全に処理されたリクエストについては, それが冪等性のあるメソッド (e.g., GET) 以外の場合, 新しい接続上で再度リクエストして安全かどうかはわかりません.  last-stream-idは, どのリクエストは安全に再試行できるかどうかをピアに伝える役を果たすのです.  last-stream-id 以下のリクエストで冪等性のないメソッドについては再試行は無理です, と RFC に書かれています.

エラーで自発的に接続を切る場合は, 処理 (途中) の最大のストリーム ID を含んだ GOAWAY を送信して送信終わったら接続を切ればいいです.  ピアの GOAWAY を行儀よく待つ必要はほとんどありません.  なぜならこのエラーはほとんどの場合, ピアのプロトコル実装のバグが原因で起こるものであり, バギーな実装に何を期待することもできないからです.

メンテナンスやロードバランシング目的で GOAWAY を使う場合は少し注意深くなる必要があります.  HTTP/2 は非同期プロトコルなのです.  GOAWAY を受信したエンドポイントは新たにストリームを開くことは許可されていません.  問題は GOAWAY を送信してからピアに届くまでの間にすでに新しいストリームを開く HEADERS が飛行中かもしれないし, 遅延の間にピアはどんどん HEADERS フレームを生成しているかもしれません.  もちろん last-stream-id の値を送信しているのでクライアントは新しい接続でこれら迷子のストリームの面倒を見ることはできるのですが, もっとうまくやる方法が RFC に書かれています.

これは graceful shutdown のやり方です.  GOAWAY を送信するエンドポイントをサーバーとしましょう.  サーバーは, (話の間が持たないので) そろそろ接続を切りたいと思った場合, いきなり現時点での正直な last-stream-id を送らずに 2^31 - 1 という値を last-stream-id として送信します.  last-stream-id は 31 bit unsigned integer なのでその最大値です.  これはクライアントに "まもなくこの接続でリクエストができなくなる" ということを知らせるという効果があります.  そして少なくとも 1 RTT の後, 本気の last-stream-id を持った GOAWAY をクライアントに送信するのです.  前項に書いたものよりも再試行のストリームは減るはずです.  サーバーは GOAWAY を送った後も既存ストリームでクライアントと通信しつづけることができます.  [nghttp2](https://nghttp2.org) の nghttpx プロキシーはこの graceful shutdown を実装しています (1 RTT ではなく 1 秒程度待つようになっています).

非同期プロトコルなので GOAWAY を送った後に新たにストリーム HEADERS が届く場合もあります. その ID が last-stream-id よりも厳密に大きい場合, 受信したエンドポイントはまるで何も届かなかったかのように無視せよ, と RFC に書かれています.  ID が last-stream-id と同じか小さかった場合はどうするのでしょう.  last-stream-id はサーバーが何かしら処理を始めた ID を入れるので前述の 2^31 - 1 以外のケースだとありえないはずですが, 無視してもいいでしょう.  不安なら last-stream-id に入れる値は 2^31 - 1 以外では必ず処理を開始した ID にするように気をつけることです.
カスタムイベント配信機能 自作EventDispatcherクラスを作る

### なぜ作るのか
自作クラスに実装する方法がわからなかったので、自作しました。最低限の実装ですが、ある程度使えるかなとおもいます。これがないとイベント処理は面倒なので個人的には必須な処理です。

### 今回のゴール
今回は、自作のクラスにイベント配信機能をつけるために、親クラスとしてEventDispatcherを用意します。
そして、小クラスで継承して使うところまで紹介します。

コードはGithub上にあります、[こちらをご参照ください](https://github.com/SuguruSasaki/event-dispatcher-js)。


### EventDispatcherを作る

必要な処理は3つあります。「リスナーの登録」「イベントの発火」「リスナーの削除」。最低限これだけあればとりあえず大丈夫です。メソッド名は以下の通りです。

+ addEventLister
+ dispatchEvent
+ removeEventListener

実際に各実装を見ましょう
リスナーの登録処理です。プロパティの「listeners」は連想配列です。stateがイベント名です。イベント名をキーにして配列に登録します。

```EventDispatcher.js
// isCaptureはとりあえず用意しただけです。
function addEventListener(state, callback, isCapture){
   if(!this.listeners[state]) this.listeners[state] = [];
   this.listeners[state].push(callback);
}
```

次にリスナー削除です。
Array.some関数を使っていますが、このままでは重複したものが削除できないバグがあるようです。
[こちらを参照](http://qiita.com/_shimizu/items/b8eac14f399e20599818)ください。とりあえずはこのまま。

```EventDispatcher.js
function removeEventListener(state, callback){
   if(!this.listeners[state]) return;
     var self = this;
     this.listeners[state].some(function(v, i){
         if(v == callback) self.listeners.splice(i, 1);
     });
}
```

最後にイベントの発火処理、eはEventインスタンスです。dataはリスナーに渡す引数です。


```EventDispatcher.js

function dispatchEvent(e, data){
    var observers = this.listeners[e.type];
    for(var i = 0; i < observers.length; ++i){
        observers[i](data);
    }
}
```

これで完了です。

### 継承
今回は[Ajax通信するクラス](https://github.com/SuguruSasaki/event-dispatcher-js/blob/master/src/AjaxLoader.js)をサンプルで用意しています。
このAjaxLoaderはEventDispatcherを継承しています。
今回はこちらの情報を元に継承を実現しています。[参考サイト](https://gist.github.com/yoshimuraYuu/3301790)

```AjaxLoader.js
module.AjaxLoader.prototype = module.Inherit.inherit(module.EventDispatcher.prototype);
module.AjaxLoader.constructor = module.AjaxLoader;
```

イベントの発火処理は、下記のようにカスタムイベントを作成し実行します。

```AjaxLoader.js
var e = new Event("onLoadComplete");
this.dispatchEvent(e, data);
```


### サンプル
実際に使う場合は、以下のように使えます。<b>onLoadComplete</b>と<b>onLoadError</b>が今回発火させるカスタムイベントです。

```javascript
var loader = new module.AjaxLoader();
loader.addEventListener('onLoadComplete', onLoadComplete, false);
loader.addEventListener('onLoadError', onLoadError, false);
loader.load("ここにパスを渡します。");

// 読み込み完了時のコールバック
function onLoadComplete(data){
   console.log(data);
}

// 失敗時のコールバック
function onLoadError(){
   console.log(arguments);
}
```
SeleniumをDartから使う

#SeleniumをDartから使う
##Seleniumとは
ブラウザを自動操作するツールです。
ブラウザを使ったWebアプリのテストを自動化できます。
Dartを含めた大体の言語がSeleniumに対応しています。
##インストール
selenium-server-standaloneとchromedriverをインストールします。

```bash
brew install selenium-server-standalone
brew install chromedriver
```

##実際にSeleniumでWebアプリのテストをする
ボタンを押すとHelloと表示されるWebアプリをテストしようと思います。

```html
<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8">
    <title>selenium_example</title>
    <link rel="stylesheet" href="styles.css">
</head>

<body>

  <button id="button">ボタン</button>
  <div id="div"></div>
  <script async src="main.dart" type="application/dart"></script>
  <script async src="packages/browser/dart.js"></script>
</body>
</html>
```

```dart
import 'dart:html';

void main() {
  ButtonElement button = querySelector('#button');
  DivElement div = querySelector('#div');
  button.onClick.listen((e){
    div.text = 'Hello!';
  });
}
```

###Seleniumの起動
chromedriverコマンド

```bash
chromedriver
```

下のような出力があるはずです。

```bash
[mac:~ riku$ chromedriver
Starting ChromeDriver 2.20.353124 on port 9515
Only local connections are allowed.
```

この時`on port 9515`のようにChromeDriverのポートが表示されるので控えておきます。

###Dartプロジェクトの編集
まずはpubspec.yamlにwebdriverを追記します。

```yaml:pubspec.yaml
dependencies:
  webdriver: any
```

Seleniumを使ってブラウザを操作するDartコードはこんな感じです。

```dart:test.dart
import 'package:webdriver/webdriver.dart';
void main() {

  //このuriのportはChromeDriverのポート
  var uri = Uri.parse('http://127.0.0.1:9515');
  WebDriver.createDriver(uri: uri).then((WebDriver driver) {
    //テストしたいWebアプリを起動
    driver.get('http://localhost:63342/selenium-example/web/index.html')
        .then((_) => driver.findElement(new By.id('button')))
        .then((WebElement button) => button.click())
        .then((_) => driver.findElement(new By.id('div')))
        .then((WebElement div) => div.text)
        .then((text) => print(text));//Hello!
  });
}
```

ポイントは
1. `WebDriver.createDriver(uri:'http://127.0.0.1:ChromeDriverのポート')`でWebDriverを取得する
2. `driver.get('テストしたいWebアプリ')`でページを表示
3. `driver.findElement(new By.id('~~'))`でDOM要素を取得できる
unittestスイートと組み合わせることでテストを自動化できます。

以上です。
最近話題の片目3DをProcessingで試してみた



#概要

最近話題の**「片目3D」**や**「GIFに２本線で浮き出て見える」**と言った技術を自分でジェネレートするとどう見えるのかシミュレーションしてみました。
 
#参考リンク

・[なにこれすごい「アニメGIFに縦線2本を入れるだけで裸眼で3D化」](http://matome.naver.jp/odai/2141900540292318601)
・[試してみて!!裸眼で３D?!　GIF画像に縦線2本を入れるだけで３D化できることが判明！！](http://matome.naver.jp/odai/2140219071950392601)
・[ルパン三世のOPに隠された技術！片目で見るとなんと立体映像に！](http://grapee.jp/105172)

#実行方法
[OpenProcessingで実行](http://www.openprocessing.org/sketch/245953)
または お手元のProcessing環境で

- 1. Processingの作業ディレクトリを作成
- 2.下記ソースコードをディレクトリ名と同じファイル名.pdeとして保存
- 3.Processing上で実行

#ソースコード

```java:line3d.pde
float d = 0;
int SPEED=4;
int BAR_WIDTH = 25;
int MARGIN = 200;

void setup() {
  size(600, 600);
  rectMode(CENTER); 
  smooth();
}

//  影用
float saveX, saveY;

void draw() {
  background(128); 
  drawBackgroundBorder();

  //  オブジェクト描画
  float z = (d % 180) / int(90 /SPEED);

  if (z < 1) {
    drawDia();
    drawLeftBar();
    drawFrame();
    drawRightBar();
  } else if (z < 3) {
    drawLeftBar();
    drawFrame();
    drawDia();
    drawRightBar();
  } else if (z < 5) {
    drawLeftBar();
    drawFrame();
    drawRightBar();
    drawDia();
  } else if (z < 7) {
    drawLeftBar();
    drawFrame();
    drawDia();
    drawRightBar();
  } else if (z < 9) {
    drawDia();
    drawLeftBar();
    drawFrame();
    drawRightBar();
  }
  d += 0.5;
}

void drawDia() {
  float x = width / 2 + sin(radians(d)) * 30;
  float y = height / 2 + cos(radians(d * 2)) * 50;
  float s = abs(sin(radians(d))) * 500;

  //  着地した際の座標を記録
  if (d % 180 < 1) {
    saveX = x;
    saveY = y;
  }

  float rotation = radians(d * SPEED);

  //  影の描画
  fill(0, 128);
  noStroke();
  pushMatrix();
  translate(saveX, saveY);
  rotate(rotation); 
  rect(0, 0, s * 0.6, s / 10);
  popMatrix();

  //  オブジェクトの描画
  fill(255);
  stroke(0);
  strokeWeight(1);
  pushMatrix();
  translate(x, y);
  rotate(rotation); 
  rect(0, 0, s * 1.2, s / 5);
  ellipse(0, 0, s / 10, s / 10);

  //  焦点のずれ
  stroke(128);
  float w = abs(sin(radians(d)));

  noFill();
  strokeWeight(w * w * w * 5);
  stroke(0, 64);
  rect(0, 0, s * 1.2, s / 5);
  ellipse(0, 0, s / 10, s / 10);

  noFill();
  strokeWeight(w * w * w * 10);
  stroke(0, 32);
  rect(0, 0, s * 1.2, s / 5);
  ellipse(0, 0, s /10, s / 10);
  popMatrix();
}

void drawBackgroundBorder() {
  //  背景（地面）
  int slopeWeight = 5;
  strokeWeight(slopeWeight);
  stroke(192);
  float offset = d * SPEED % 10;
  int slopelength  = height / slopeWeight/2;
  for (int i = 0; i <slopelength; i++) {
    line(0, i*2*slopeWeight + offset, width, i*2*slopeWeight + offset);
  }
}

void drawFrame() {
  noFill();
  strokeWeight(50);
  rect(width / 2, height / 2, width, height);
}

void drawLeftBar() {
  drawBar(MARGIN);
}
void drawRightBar() {
  drawBar(width - MARGIN);
}
void drawBar(int position) {
  fill(0);
  stroke(0);
  strokeWeight(1);
  rect(position, height / 2, BAR_WIDTH, height);
}
```
100サイト以上のクローラ・スクレイパを効率的に作る方法

# 概要
* 急遽100サイト以上のクローラを作ることになりました。
* サイトの数だけプログラムを書いていると保守で死ぬ😱ため **ソースコードを書かなくても大量のクローラ・スクレイパを作成できる方法** を探しました。
* といっても、何もせずにクローリングできるわけではなく、要は **サイト構成に依存する部分は別ファイルに外出しして、ソースコードは少なくしようぜ!** という話です。
* ハードコーディングを辞めることで、普段ソースコードを書かない人でもクローラ作成できるというメリットもあります👼


## 1. XPathを使う

### XPathとは
* [XML Path Language](https://ja.wikipedia.org/wiki/XML_Path_Language)の略
* XML文章の中の特定の要素や属性の位置を指定するためのルール
* これを使えば、サイトの構成ごとに異なる「どの要素を抽出するか」のルールのみ外部ファイルにもたせて、それを読み込むことで **処理の大部分を共通化できる😊** 
* [XPath はW3Cで規定されている](http://www.w3.org/TR/xpath/)ため、対応しているツールがたくさんありエコシステムに乗れるのも魅力

### XPathの記述ルール
* [XPath Cheat Sheet](http://blog.bangboo.com/sub/xpath.html)
* [ツール開発講座 〜第4回 XPathを調べてみよう〜｜元溥帝のまったりブログ](http://ameblo.jp/putei1724/entry-11463291925.html)



### お目当ての要素のXPathを取得する方法

* 自分でXPathを書いてもいいですが、[ChromeはデベロッパーツールでかんたんにXPathを取得できます](http://ptech.g.hatena.ne.jp/noromanba/20120528/1338307299)
* ほかにも、ブラウザの拡張ツールなどでお手軽にGUIでXPathを取得できます。
* オススメはChrome拡張の「[XPath Helper](https://chrome.google.com/webstore/detail/xpath-helper/hgimnogjllphhhkhlmebbmlgjoejdpjl?hl=ja)」。[オープンソースなので理解・拡張がしやすい](https://github.com/google/xpaf/tree/master/chrome)。

<img width="50%" alt="XPath Helperを使い2015年の総ストック数を取得するXPathを取得する" src="https://qiita-image-store.s3.amazonaws.com/0/25820/09edaf0d-bbe9-443c-70a0-f940148c8a64.png">
* [XPath HelperをMacで使うときのショートカットキー | ダーフク.com](http://www.dafuku.com/2014/08/xpath-helper-mac-shortcut-key.html)

### XPathを使ったスクレイピング
* 各言語にXPathに対応したライブラリがあるため、それを使ってXPathで指定した要素を取得します。
* ハマり所としては、ChromeやFireFoxなどのブラウザのデベロッパーツールでXPathを取得すると、[元のソースコードに存在しない`<tbody>`タグが勝手に挿入される](http://weblog.nabetama.com/post/28559395608/yokohamarb%E3%81%AE%E4%BA%88%E5%AE%9A%E3%82%92%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%97%E3%83%88%E3%81%A7%E7%A2%BA%E8%AA%8D%E3%81%99%E3%82%8B)というブラウザの仕様があります。(たぶん、`<tbody>`タグが合ったほうが表示上都合が良いのでブラウザが勝手に挿入してる)

## 2. 正規表現を使う
* XPathの弱点は、javascriptやメタデータなどブラウザに表示されない要素を取得しにくい点です。
* この点を補うために、htmlをまるっとただの文字列として扱い、正規表現で取りたい要素を取得します

### お目当ての要素を取得できる正規表現を取得する方法
* 自分で書くしか思いつきませんでした。。が、正規表現が正しいかチェックできるツールは各言語いろいろあるようです。
* [PyRegex (Python)](http://www.pyregex.com/)
* [Rego (Go)](http://regoio.herokuapp.com/)
* [Rubular (Ruby)](http://www.rubular.com/)
* [ブラウザから手軽にチェックできる正規表現テストツールまとめ](http://nelog.jp/regular-expression-online-tools)



### 正規表現を使ったスクレイピング
* こちらも各言語で実装されている正規表現メソッドに従い抽出処理を書きます


## 3. 外部サービスを使う
* [Kimono](https://www.kimonolabs.com/) → [**サービス終了しました**](http://jp.techcrunch.com/2016/02/16/20160215palantir-acquires-kimono-labs-for-its-web-scraping-service/)
<img width="50%" alt="kimono でスクレイパ作成中の画面" src="https://qiita-image-store.s3.amazonaws.com/0/25820/f4f10617-de77-878d-abe0-22b7e53a7546.png">

 * かんたんにクローラ・スクレイパを作成できるWebサービス。
 * まだbetaだったり、料金体系が不明だったりで今回は採用を見送りました。が、限られた回数しか行わないようなクローリング・スクレイピングだったらこれで十分かもしれません😊


# まとめ
* サイト固有の情報はなるべく外出しして、ソースコードの行数は少なくしたい👼
* XPathを使えば、特定の要素を一意に記述できる。ツールも充実してる👍
* 正規表現を使えば、XPathで取得しにくい変数の値も取得できる。
* 今回は取得した値をDBなどに入れやすい形に変換する部分は省きましたが、枠組みができていれば変換処理も極力共通化できそう。。
* お気づきの点がございましたら、気軽にコメントください!

# 参考
* [iQONを支えるクローラーの裏側](http://www.slideshare.net/TakehiroShiozaki/iqon-54979883) ←調査の上でいちばん参考になりました。どうもありがとうございます!
* [iQONを支える、400サイトのクローラーの裏側 | 株式会社VASILY(ヴァシリー)](http://tech.vasily.jp/crawler/)
8桁表示で素数日や連続素数日を探す

よく「今日は素数の日だ」なんて話を聞いて気になったので探してみることにしました。

## 素数日とは

素数日とはyyyymmddで数値にした時に素数となる日付のことと定義します。
例えば2015年11月27日は20151127が素数なので素数日です。

素数は無限にありますので、素数日も無限にあると期待されます。


## 普通に探す

とりあえず2015年の素数日を探してみましょう。
こんな感じでしょうか？

```rb
require 'prime'
require 'date'

puts [*Date.new(2015, 1, 1).upto(Date.new(2015, 12, 31))].flat_map{|d|
	Prime.prime?(d.strftime('%Y%m%d').to_i) ? [d.to_s] : []
}
```
```
2015-01-11
2015-01-31
2015-02-27
2015-03-03
2015-03-27
2015-04-11
2015-05-13
2015-08-21
2015-10-11
2015-10-31
2015-11-27
2015-12-21
2015-12-27
```

13日、意外と少ないです。実はここ100年では1923年と並んで素数日の数が最小の年なんですね。（明日使える豆知識1）
多い時は30日以上あるのでかなり偏っていることがうかがえます。

## 双子素数日

ところで、[双子素数](https://ja.wikipedia.org/wiki/双子素数)といって、差が2の素数の組はよく研究対象になります。というわけで差が2日の双子素数日を探してみましょう。

```rb
require 'prime'
require 'date'

[*Date.new(2015, 1, 1).upto(Date.new(2020, 12, 31))].flat_map{|d|
	Prime.prime?(d.strftime('%Y%m%d').to_i) ? [d] : []
}.each_cons(2) {|d1, d2|
	puts d1, d2, "\n" if (d2-d1).to_i == 2
}
```
```
2016-04-01
2016-04-03

2016-10-19
2016-10-21

2017-03-01
2017-03-03

2017-09-01
2017-09-03

2019-02-27
2019-03-01

2020-01-09
2020-01-11

2020-01-21
2020-01-23

2020-07-21
2020-07-23
```

思ったよりありますね。ちなみに双子素数が無限にあるかどうかは未解決問題なので、双子素数日も無限にあるかどうかは不明です。月またぎでイレギュラーなものもあるのでなんとも言えませんが…

## 三つ子素数日

さらに[三つ子素数](https://ja.wikipedia.org/wiki/三つ子素数)というものを考えてみます。三つ子素数とは`(p, p+2, p+6)`または`(p, p+4, p+6)`の形のもので、`(p, p+2, p+4)`の形ではありません。なぜならばこの場合、必ず3の倍数を含むからです。

しかしながら、（当日・2日後・4日後）という素数日は存在の可能性があります。月や年の変わり目を含めば良いからです。

```rb
require 'prime'
require 'date'

[*Date.new(2015, 1, 1).upto(Date.new(2100, 12, 31))].flat_map{|d|
	Prime.prime?(d.strftime('%Y%m%d').to_i) ? [d] : []
}.each_cons(3) {|d1, d2, d3|
	if (d2-d1).to_i == 2 && (d3-d2).to_i == 2
		puts d1, d2, d3, "\n"
	end
}
```
```
2085-06-29
2085-07-01
2085-07-03

2087-04-29
2087-05-01
2087-05-03
```
というわけで、残念ながら次は2085年のようなので生きてるうちには拝めなさそうです（明日使える豆知識2）。

最後にタイトルにある連続素数日ですが、これも素数の場合は普通にはありませんね。`(n, n+1)`は必ずどちらかが2の倍数だからです。しかし、素数日の場合は月や年をまたげるのでした。31日（or2月29日）だけ起こる可能性があります。

```rb
require 'prime'
require 'date'

[*Date.new(2015, 1, 1).upto(Date.new(2025, 12, 31))].flat_map{|d|
	Prime.prime?(d.strftime('%Y%m%d').to_i) ? [d] : []
}.each_cons(2) {|d1, d2|
	puts d1, d2, "\n" if (d2-d1).to_i == 1
}
```
```
2017-08-31
2017-09-01

2018-07-31
2018-08-01

2020-12-31
2021-01-01
```
というわけで、次は2017年らしいです。ちなみに`20201231-20210101`は年をまたいだ連続素数日になります。これは1987-88シーズン以来33年ぶりの出来事です。（明日使える豆知識3）

## まとめ
素数日、というものを定義して簡単に分布を調べてみました。結構多いなというのが印象です。コードとしては偶数の日を調べる必要はないし、最後の方はすべての日付を調べる必要がないので、もうちょっと高速に探す方法に直せそうです。
今さらtcshのキーバインドから抜けられない人にささげるbashのヒストリ検索キーバインド

なんか思いつきでアドベントカレンダー作ったら、すでに12月1日が残り12分なのでかっとばしていくよ！

世の中Linuxとか流行ってて標準シェルがbashだけど、「おらぁtcsh育ちでキーバインドが慣れねえだぁ」っていうひと、けっこう多いはず。そうじゃない人はｶｴﾚ！　まあbashはもともとインタラクティブシェル向けじゃないからね（炎上）。

なかでもいらつくのが、

````
$ hogefugar
something
$ hoge[ESC-p]
````

とやってもデフォルトで過去のhogefugarが出てきやがらないところ！

そんなときは /etc/inputrc に以下の呪文を書こう！

````
$if Bash
"\en": history-search-forward
"\ep": history-search-backward
$endif
````

これでESC-p・ESC-nを使って入力した文字から始まるコマンドヒストリをたどれるよ！

やった！　2分前に書き終わった！
Elixirとは

Elixirについて語る時に「Ruby風な」といった言葉が使われるのをそこかしこで見てきました。
「Ruby風な」という謳い文句は、Rubyの熱狂的なファンたちの注意を引きます。それ自体が悪いことだとは思いませんが、Rubyist達が「ElixirはRubyではなかった」と落胆している様子は見るに堪えません。

Eixirを形容する言葉としてそれが適しているかについて、考える余地がありそうです。

一見するとRubyとElixirのコードは似ています。

```ruby:greet.rb
def greet(name)
  "Hello, #{name}"
end
```

```Elixir:greet.ex
def greet(name) do
  "Hello, #{name}"
end
```

とは言え、いくら関数定義の字面が似ていても、そもそもRubyとElixirはプログラミング言語のパラダイムが異なります。
両者の違いは書けば書くほど身に染みるのですが、以下の例を見ればその違いが一目瞭然です。

```rb:map.rb
["john", "tom"].map {|name| name.uppercase }
```

```elixir:elixir.ex
Enum.map(["john", "tom"], fn(name) -> String.uppercase(name) end)
```

Rubyはオブジェクトのクラスを見て、Array#mapというインスタンスメソッドを呼び出しています。
言うまでもなくこのカラクリはElixirにはありません。metaprogrammingでもしない限り、「Ruby風に」記述することはできません。
(逆に言えば、metaprogrammingさえすればRubyっぽく書けると思う)

僕は「ElixirにとってRubyは取るに足らないものだ」と言いたいのではありません。
作者であるJose valimはRailsやrackのコミッターですし、 ElixirがRubyから受けた影響が少なくないのは明白です。
ElixirがErlangの単なる方言ではないことを証明するのに必要なものの多くも、Rubyのエコシステムに由来するものだと見て取れます。

ただ、もしこれからElixirを始める人がいるのなら、「Ruby風な」という言葉について今一度考えてみて欲しいのです。
Erlangと、Rubyを含むこれまでのあらゆる巨人の肩の上に立っているのがElixirなのであって、「単なるRuby風な関数型言語」でもなければ「単なるErlangの方言」でもありません。
C++でintなtype_indexを生成する

## `std::type_index`では何が問題か
大量の型を管理するには遅そうです。

```cpp
#include <typeindex>
#include <map>
#include <iostream>

int main(){
    // 型をシーケンシャルなidに変換したい.
    std::map<std::type_index, int> type_index_map;
    int next_index = 0;

    // 生成に累計で O(log(n) * n) 時間が掛かる.
    type_index_map[typeid(int)] = next_index++;
    type_index_map[typeid(void)] = next_index++;
    type_index_map[typeid(const char*)] = next_index++;

    // 照合で O(log(n)) 時間掛かる.
    std::cout << "int         mapped -> " << type_index_map[typeid(int)] << std::endl;
    std::cout << "void        mapped -> " << type_index_map[typeid(void)] << std::endl;
    std::cout << "const char* mapped -> " << type_index_map[typeid(const char*)] << std::endl;

    return 0;
}
```

```
int         mapped -> 0
void        mapped -> 1
const char* mapped -> 2
```

## `template`関数で静的な`int`型変数をラップする
コストがインクリメントとコンパイル時に型ごとに生成される関数コールのみになりなりました。

```cpp
#include <typeindex>
#include <map>
#include <iostream>

int create_next_id(){
    static int i = 0;
    return i++;
}

template<class T>
int id(){
    static int i = create_next_id();
    return i;
}

int main(){
    // 型をシーケンシャルなidに変換したい.
    std::cout << "int         mapped -> " << id<int>() << std::endl;
    std::cout << "void        mapped -> " << id<void>() << std::endl;
    std::cout << "const char* mapped -> " << id<const char*>() << std::endl;
    std::cout << "int         mapped -> " << id<int>() << std::endl;

    return 0;
}
```

```
int         mapped -> 0
void        mapped -> 1
const char* mapped -> 2
int         mapped -> 0
```

## 注意するべき点
- `create_next_id()`内の`static`変数を外に出すときに翻訳単位に注意する。
- `id<T>()`の最初の呼び出し順序によって実行ごとの`int`値の一意性がないため、実行時に依存しない初期化を必ず伴わせる。
- `template`なクラス内で`create_next_id()`, `id<T>()`を持つ事によりクラスごとで照合結果の一意性が損なわれる。
- ただし意図的に分離して相違なクラス間で比較結果を不正なものにしたい場合はメリットになる。
- 定数時間にこだわる場合は関数コールのコストが`inline`化されているかどうかに注意すること。
ハロー!! Office UI Fabric

# ハロー!! Office UI Fabric

今年の9月頃にMicrosoftが[Office UI Fabric](http://dev.office.com/fabric/what-is-fabric)というUIフレームワークをオープンソースで公開しました(ライセンスはMIT License)。今年公開されたOSSプロダクトなので、ここは思い切ってAdvent Calendarの形でOffice UI Fabricがどんなものであるか見てゆこうと思います。

Office UI Fabric(以下"OfficeUI"と表記)のソースコードはGitHubで公開されています。

 * [OfficeDev/Office-UI-Fabric](https://github.com/OfficeDev/Office-UI-Fabric)

また、開発者向けのサイトも公開されています。

 * [Office UI Fabric](http://dev.office.com/fabric)

それから手前味噌で恐縮ですが、OfficeUIの簡単な使用レポートをQiitaで公開しています。

 * [MicrosoftのOffice UI Fabricを試してみる](http://qiita.com/furandon_pig/items/7e84e7efe97a289bef0b)

今日は第1日目ということもあり、Hello,World的な簡単なアプリ(というかWebサイト)をOfficeUIで作成するサンプルを紹介してみます。

## Office UI Fabric？

OfficeUIといっても今ひとつピンと来ない人もいるかと思います。OfficeUIは[Bootstrap](http://getbootstrap.com)と同じ立ち位置のWeb UIフレームワークです(まさにキャラ(用途)がかぶっているとも言える……)。

個人的な感想では、Bootstrapはファンシーな印象をうけるUIで、OfficeUIはそれよりも少しカッキリした(まさにオフィスアプリ的な)印象を受けます。

## Office UI Fabricの配布物

[http://dev.office.com/fabric/getting-started](http://dev.office.com/fabric/getting-started)にOfficeUI配布物の取得手順が解説されています。CDN経由で必要なファイルが読み込めるようなので、今回はこれを利用してみましょう。

## Hello,World的なサンプル

簡単なHello,World的サンプルを作成してみました。ボタンを押すとalert()でダイアログを表示するというものです。

```html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>ハロー!! Office UI Fabric</title>
    <link rel="stylesheet" href="//appsforoffice.microsoft.com/fabric/1.0/fabric.min.css">
    <link rel="stylesheet" href="//appsforoffice.microsoft.com/fabric/1.0/fabric.components.min.css">
  </head>
  <body>
    <!-- ボタンを表示する -->
    <div class="ms-Grid-col ms-u-sm6 ms-u-md8 ms-u-lg12">
      <button class="ms-Button ms-Button--primary" onclick="alert('ハロー!! Office UI Fabric')">
        <span class="ms-Button-label" id="mylabel">ハロー!! Office Ui Fabric</span>
      </button>
    </div>
  </body>
</html>
```

実行結果は以下のようになります。

![officeui001.png](https://qiita-image-store.s3.amazonaws.com/0/61137/25d724bd-6449-0c47-423e-3da74534e2dd.png)

というわけで、思ったよりも簡単にOfficeUIを試してみることができました。

## まとめ

オープンソースとして公開されているOffice UI Fabricでごく簡単なサンプルを作ってみました。
明日以降の記事では、OfficeUIの各コンポーネント(ボタン、テキストボックス等々)の使い方やハマり所を解説していければと思います。
hubotにスコア機能を追加してチームのモチベーションアップをした話

この記事は [慶應義塾大学SFC村井&徳田研 Advent Calendar 2015](http://www.adventar.org/calendars/1053) の1日目の記事です。

----

慶應義塾大学湘南藤沢キャンパス略してSFCの村井研究会では、フリープランのSlackを使ってコミュニケーションを取っています。
村井研究会は内部で更に数十名ごとの研究グループに分かれているのですが、研究会全体でのアナウンスを #general で行ったり、研究グループごとのチャンネルを作っています。

# hubot
Slackにはいくつかのbotがいます。
チームが作られた時はいくつかボットが立っていたのですが、Integrationの数の制約などで最終的に2つくらいになっています。

## logbot
フリープランのSlackではメッセージの保存数が10000件までのため、それより過去のログを遡れるように常時ログを取り続けるbotがいます。
![image](https://qiita-image-store.s3.amazonaws.com/0/33754/6b26ddb1-983b-dc4a-c04c-55278bcf1b79.png)

hubot-slackを使用していますが、privateなメソッドを叩いてeditedされたメッセージも記録します。記録したメッセージはSolrに投げられ、コマンドやWebサイトから検索することが可能です。

ソースコードはGitHubで管理しています。
https://github.com/sfc-arch/rg-slack-logger

## archbot
hubotの汎用的なボットです。出前の弁当集計など細かい便利スクリプト群をGitHub上にpushするとherokuへ自動デプロイされます。

このソースコードもGitHubで管理しています。
https://github.com/sfc-arch/archbot

# スコア機能
archbotの機能の中でも、頻繁に使うのがスコア機能です。
チームのコミュニケーションでその人が良いと思ったら「++」（インクリメントの意味）をすることでその発言をした人にスコアを加算することが可能です。
<img width="240" alt="Screenshot 2015-12-01 23.13.03のコピー.png" src="https://qiita-image-store.s3.amazonaws.com/0/33754/2ce4f504-09c6-a60f-ad84-df4abfa6ad85.png">

スコアリングのメッセージ判定は[この部分](https://github.com/sfc-arch/archbot/blob/master/scripts/score.coffee#L8)で行っていて、ニックネームが指定されない場合は直前の発言者を扱ったり、++++++++など記号をより連続することで多くのスコアを加算できます。

```coffeescript
if match = msg.message.text.match(/^([a-z0-9_-]+)?\s*(\+{2,})\s*([a-z0-9_-]+)?$/)
```

このスコアは1週間ごとにルームに通知&リセットされ、1位の人は（メッセージ上で）表彰されます。

<img width="332" alt="Screenshot 2015-12-01 23.12.53のコピー.png" src="https://qiita-image-store.s3.amazonaws.com/0/33754/e1368277-c769-e39d-58ca-3c3935069d8d.png">

実際にこの機能によって、チームの動きや誰が頑張ったかが伝わり、メンバーのモチベーションにも繋がっています。
（「--」でスコアを減算させる機能もありましたが、不利益を与えかねないということでなくなりました）

# おわりに
チームのコミュニケーションでhubotを使っている場合は、スコアリングされると自分が評価されたと文面的に見ることができるためモチベーションを上げるのに良いと思います。

今日の [慶應義塾大学SFC村井&徳田研 Advent Calendar 2015](http://www.adventar.org/calendars/1053) は研究室内でのSlack利用の事例紹介をしただけで終わってしまいましたが、次回以降はもう少しコアな話をしていきたいと思います。（参加者が少ないので複数回執筆予定）
crystal コンパイラもサボりたくなる時

# 問題
crystal のコードを試しに書いていて、早速以下のような問題にぶつかりました。

```rb
class Test
  def a
    b.new
  end
end
```
この a というメソッドの中では定義されていない b という変数を参照しているので java や c の感覚では当然コンパイルエラーになるはずのものです。ですが、驚いたことに実はこれはコンパイルに通ってしまいます。crystal は型チェックをしてくれるのではなかったのでしょうか？これが通ってしまっては行けないのでは？

では、実際にインスタンスを作成してみたら実行時エラーが出てしまうのでしょうか？

```rb
class Test
  def a
    b.new
  end
end
Test.new.a #=> undefined local variable or method 'b'
```

実はこうするとコンパイルエラーがちゃんと出ます。これは一体どういうことでしょうか？
今度はためしに `Test.new.a` をメソッドの中に定義して実行されないようにしてみます。

```rb
class Test
  def a
    b.new
  end
end

def c
  Test.new.a #=> OK
end
```
今度はまたコンパイルに通るようになりました。c をグローバルコンテキストから呼ぶとまたエラーになります。
では `if false` だとどうでしょうか。

```rb
class Test
  def a
    b.new
  end
end

if false
  Test.new.a #=> NG
end
```
これはコンパイルエラー。

では `a` を呼ばなかったらどうなるでしょうか？

```rb
class Test
  def a
    b.new
  end
end

Test.new #=> OK
```
コンパイル、通ります！

じゃあ、今度はクラスコンテキストからだと？

```rb
class Test
  def a
    b.new
  end
  Test.new.a #=> NG
end
```
エラー！

# つまりどういうこと？
どうやら、どこからも使われていないメソッドはコンパイルの対象に含まれないようです。
グローバルコンテキストないしはクラスコンテキストからコードを再帰的に辿って行って、実際に使われているコードを洗い出してコンパイルしているのではないでしょうか。上記に書いた以外にもクラス継承を挟んでみたり、super で呼び出してみたりしましたが、実行時にメソッドが使われない場合は一貫してコンパイルスルーされました。バイナリのサイズを小さくするための工夫でしょうが、びっくりしますね。

驚いたので勢いで記事をかきました。
誰も教えてくれないKiller Moveが2個な理由

# はじめに

3年くらい前にはてなダイアリーに書いたものですが、個人的にお気に入りな記事だったのでサルベージして加筆修正してみました。

強いコンピュータチェスやコンピュータ将棋のプログラムには、思わぬ細かいところに重要な工夫があったりします。
この記事は、その重要な工夫の一つである、Killer Moveの実装方法の話です。

# Killer Moveとは

皆様ご存じのとおり、βカットした手を覚えておいて兄弟局面でもオーダリングの上位で試してみる、という手法です。

最近誰も彼もが読んでいる(?)Stockfishの実装でも、βカットした取る手以外の指し手を以下のような形で記録します。

```cpp
    if (ss->killers[0] != move)
    {
        ss->killers[1] = ss->killers[0];
        ss->killers[0] = move;
    }
```

この実装には以下の2つのポイントがあります。

- Killer Moveを保持する数は、1個でも3個以上でもなく2個。
- 保存する条件は、`ss->killers[1] != move` は無しで `ss->killers[0] != move` だけ。

これらについての考察を自分は見たことが無いのですが、実はどちらにもちゃんと理由があります。

# 解説

まず、Killer Moveのリストに入る可能性のある手を、以下の2つに分類してみましょう。

- 入っているとうれしい指し手（良いKiller Move）
- 入っていてもうれしくない手（悪いKiller Move）

良いKiller Moveとなるのは、以下の条件を満たす手です。

- 多くの兄弟局面で合法手、かつ、多くの兄弟局面でβカットを発生させる程度に良い手

悪いKiller Moveとなるのは、以下の条件のうちのいずれかを満たす手になります。

- 多くの兄弟局面でβカットを発生させない手（特定の状況下でのみ良い手）
- 多くの兄弟局面で非合法手

これを元にKiller Moveのリストで保持すべき手の数を考えてみましょう。


まず、Killer Moveを1手しか保持しない場合。
これの弊害は簡単で、良いKiller Moveを保持していてもたまたまβカットしなかった局面があったときに、悪いKiller Moveで置き換えられてしまい、その後の探索でまた良いKiller Moveが出現するまで「あまりKiller Moveの効果が発揮されない」という状態が発生します。


次に、2手保持した場合。
上記の現象が起こった場合、Killer Moveのリストは↓こうなります。

 - ss->killers[0] ← 悪いKiller Move
 - ss->killers[1] ← 良いKiller Move

この状態で次の兄弟ノードの探索に入ると、まず悪いKiller Moveが先に探索されます。
ただし、悪いKiller Moveは、その定義通り、βカットが発生する可能性や、そもそも合法手である可能性が低いです。
また、仮にβカットされた場合も、`ss->killers[0] != move`の条件によりKiller Moveのリストは更新されません。

βカットが発生しなかったとすると、次に、良いKiller Moveが探索されます。
この手でβカットが発生する確率はそれなりに高い[要出典]です。
そして、βカットが発生すると、Killer Moveのリストが更新されて↓こうなります。

- ss->killers[0] ← 良いKiller Move
- ss->killers[1] ← 悪いKiller Move

これでまた「良いKiller Moveでβカットせず、他の手でβカットした局面」が出現するまでは、良いKiller Moveの地位は安泰です。
この動作になるために、`ss->killers[1] != move`という条件は入れてはならないのです。


更に、良いKiller Moveでもβカットしなかった場合、その局面はそもそもβカットしない可能性がかなり高い[要出典]です。
その場合、Killer Moveのリストは更新されないため、良いKiller Moveは保持され続けます。


つまり、2手保持する実装で、一度発見した良いKiller Moveが失われるには、以下のような手順が必要になるのです。

- 良いKiller Moveでβカットが発生せず、かつ他の指し手でβカットが発生。
- その後更に、まだ残っている良いKiller Moveでβカットが発生する前に、Killer Moveでβカットせず、他の指し手でβカットが発生。

この手順の発生する確率がとても小さい[要出典]為に、3個以上保持するメリットが薄いのです。
また、3つもKiller Moveで上位に持ってくる事になると、その分他の指し手が後回しになるというデメリットも発生します。


そんなわけで、Killer Moveが2個であることや、1つ目の手としか重複チェックをしない（キュー構造になっている）ことには合理的な理由があったのです。
LPIC勉強メモ


1. 自分の所属グループを表示するにはgroupsコマンドを使う。
2. ファイル作成時にアプリケーションが指定するパーミッションが666
3. ディレクトリ作成時指定するパーミッションが777
4. umaskコマンドでの変更は子プロセスでのみ有効に成る
5. SUIDはパーミションに4000もしくは所有者にsを付与する
　　SUIDの使用例としては/usr/bin/passwdがある
　　passwdコマンドで/etc/shadowファイルの書き換えを実行時どのユーザが実行した場合でもroot権限で実行されるようになっています。
6. スティッキービットが特定のディレクトリに対してアクセス権が許可されていてもファイルの削除はおこえないよう保護する設定です。
　　chmod 1000　ファイルもしくはchmod o+t
rails+react構成でbrowserify-rails使おうとしたらハマった


## 趣旨

フロントreactのサーバrailsのアプリ作成中に軽い気持ちでbrowserifyを導入しようとしたらハマった話。
※根本的に間違ってる可能性は大いにあるのだが、同じ構成でやる時の注意点として残します

## 使ったライブラリとか

#### gem
* rails(4.2.4)
* react-rails(1.4.2)
* browserify-rails(0.9.3)

#### jsライブラリ
* browserify(10.2.6)
* browserify-incremental(3.0.1)
* reactify(1.1.1)
* coffeeify(1.2.0)

## やろうとしたこと

reactとcoffeescriptでアプリを実装しようとした。
（ファイルは```.js.jsx.coffee```な拡張子）

最初はsprocketsにコンパイル任せてたらうまくいってた。

#### しかし、、、

ファイル分割したりして、
「requireつかいて〜な〜」って思い立ってbrowserifyを入れたのが運の尽き。

```components/commentBox.js.jsx.coffee
Commet = require('./comment').Comment

class CommentBox extends React.component
	render: ->
		`<Comment />`
```
```components/comment.js.jsx.coffee
class Comment extends React.component
	render: ->
		`<div>コメントだよ</div>`

module.extends = Comment
```

みたいなことをやろうとして、下記エラーが立ちはだかる。。。

```
xxx/components/comment.js.jsx.coffee:13

    return <div>
           ^
ParseError: Unexpected token
```

なエラーが治らず、盛大にはまりました。ﾋﾞｸﾄﾓｼﾈｰ

## 解決策

```initializer/asset.rb
Rails.application.config.browserify_rails.commandline_options = [
  "-t [coffeeify --extension .coffee]",
  "-t [reactify --extension .jsx.coffee]",
  "--extension .js.jsx.coffee"
]
```

な感じにしたら行けました。少なくとも上のような簡単なコードは通った。

## 参考にしたもの

[Can't render browserified JS on server side](https://github.com/reactjs/react-rails/issues/181)
[Railsでbrowserifyとreact](http://qiita.com/mmyoji/items/8022ecc0cf4fcddd02ca)