OmniAICreator/Qiita-1.07M huggingface dataset:
cocoapodsのリポジトリ修正


#pod installの失敗
最近cocoapodsの調子が悪い。
xcodeにライブラリーを入れようとしたらエラーを吐いたのでその対処法を書く。


xcodeからプロジェクトを作って、そのxcodeprojファイルがあるコマンドラインからPodfileを生成。

```bash
touch Podfile
```

とりあえず、AFNetworkingを入れる。

```ruby:Podfile
platform :ios, "7.0"
pod 'AFNetworking', '~> 2.0'
```

```pod install```を行う。

```bash
pod install
Analyzing dependencies
[!] There was an error reading '/Users/satoutakeshi/.cocoapods/repos/master/CocoaPods-version.yml'.
Please consult http://blog.cocoapods.org/Repairing-Our-Broken-Specs-Repository/ for more information.
```

エラーとなってしまった。

##エラーの対処法

http://blog.cocoapods.org/Repairing-Our-Broken-Specs-Repository/
を見てみる。

どうやらホームのSpecsリポジトリが壊れてしまったらしい。

libgit2のバグがあり、リポジトリが壊れてしまうらしい。

直し方がコマンドで乗っていた。
   $ sudo rm -fr ~/.cocoapods/repos/master
    $ pod setup
    
 早速実践。
 
 失敗。
 
 ```
pod setup
Setting up CocoaPods master repo
 [!] There was an error reading '/Users/satoutakeshi/.cocoapods/repos/master/CocoaPods-version.yml'.
Please consult http://blog.cocoapods.org/Repairing-Our-Broken-Specs-Repository/ for more information.
```

##エラーの解消
https://github.com/CocoaPods/CocoaPods/issues/2908

ここにcocoapodsを入れなおせというアドバイスが書かれていたので試す。
(sinaraとかアンインストールしていたけど自分はしないでやった。）

```
sudo rm -fr ~/.cocoapods/repos/master
sudo gem uninstall cocoapods
sudo gem update
sudo gem install cocoapods
pod setup
```

失敗した。
ページをもっと見よう。

どうやらpsychというライブラリーが、あるバージョンがインストールされているとそれが悪さをしてymlファイルが読み込まないそうだ。

(psychはyaml のバックエンドライブラリだそうです。)
悪さをしているバージョンをアンインストールして、別のバージョンをインストールする。

```
sudo rm -fr ~/.cocoapods
sudo gem cleanup
sudo gem install psych -v 2.0.0
sudo gem uninstall psych -v 2.0.10
```


もう一度 ```pod setup ``` をする。

```
pod setup
Setting up CocoaPods master repo

CocoaPods 0.36.0.beta.2 is available.
To update use: `gem install cocoapods --pre`
[!] This is a test version we'd love you to try.

For more information see http://blog.cocoapods.org
and the CHANGELOG for this version http://git.io/BaH8pQ.

Setup completed
```

できた！！
やった！
ATOMでプロジェクトごとにレイアウトを保存する

![画面](https://qiita-image-store.s3.amazonaws.com/0/64235/a8ccc8df-60de-699b-fcda-13cdad9f8ce9.png)

 - ディレクトリツリーをデフォルトで表示する
 - iTerm2のように、ペインのレイアウトを保存する

プロジェクトを開いた時に、画像のように最後のレイアウトから復帰する方法のメモです。

# 使うパッケージ

 - project-manager
 - save-session

この二つのpackageを使ってレイアウトをプロジェクトごとに保存できます。
packageのインストールは、Settings -> Packageから可能。

## project-manager
特に設定する項目はなし。

## save-session
いろいろチェックボックスで設定する項目がありますが、今回は

 - Restore Open Files Per Project
 - Restore Project

この二つにチェックが入っていれば大丈夫です。  
あとの設定は、何がどう対応しているのかあまり見ていないので割愛。

# 完成
project managerからprojectを開いた時、プロジェクトの最後の状態が保存されるようになりました。

ですがまだ、ATOMを起動した時に開かられる空のウィンドウを手動で消さないといけないため、ちょっと面倒な部分が残っています。
既存のpackageでなんとかできたりするのか、自分でpackageを作らないといけないのか、また調べたいと思います。
群

_GitHubに移行します_

## はじめに

この記事では代数学の群を紹介します。

## 前回の復習

[前回](http://qiita.com/t-mochizuki/items/005c2f219c72f96f677e)は直積集合と二項演算を紹介しました。

これから紹介する群は直積集合と二項演算をペアで取り扱います。つまり、演算の対象と演算をペアで取り扱います。

## 群

群とは、次の条件すべてを満たす演算の対象（直積集合）と演算（二項演算）のペアです。

- 結合律
- 単位元の存在
- 逆元の存在

群かどうかは、条件を満たすかどうかに依ります。そのため、どういう場合に条件を満たすかに関心があります。

順番にこれらの条件を見てみましょう。

### 結合律

結合律を満たす場合とは、演算による結果が演算する順番に依存しない場合です。

まずは、演算による結果が演算する順番に依存する場合を見てみましょう。`2 + 3 * 5`で確認します。

```
(2 + 3) * 5 == 2 + (3 * 5)
```

左辺は25、右辺は17です。演算による結果が演算する順番に依存します。つまり、結合律を満たしません。

次に、演算による結果が演算する順番に依存しない場合を見てみましょう。`2 * 3 * 5`で確認します。

```
(2 * 3) * 5 == 2 * (3 * 5)
```

左辺は30、右辺は30です。演算による結果が演算する順番に依存しません。つまり、結合律を満たします。

念のため、もう一つ例を見てみましょう。`5 % 3 % 2`で確認します。%はmodです。つまり、剰余を返す演算です。

```
(5 % 3) % 2 == 5 % (3 % 2)
```

左辺は0、左辺は0です。演算による結果が演算する順番に依存しません。つまり、結合律を満たします。

ここでは特定の値でのみ確認しましたが、結合律を満たすことを証明する場合には、すべての要素において結合律を満たすことを示す必要があります。しかし、ここではその証明を省略します。（足し算や掛け算の性質、もしくは、足し算や掛け算の定義によって結合律が約束されていると私は思います。つまり、結合律の証明は演算の性質、もしくは、定義に依存すると私は思います。）

### 単位元の存在

演算（二項演算）は演算の対象（直積集合）の要素を変換するモノでした。

ここで紹介する単位元は特別な要素で、この単位元とペアを組むと変換されなくなります。

単位元とペアを組むと変換されなくなるとはどういうことか、単位元とはどのようなモノか見てみましょう。

前提として、集合Gの単位元をeとし、集合Gの任意の要素をaとします。

そのような場合、この要素のペアは集合Gの直積集合の要素 (e, a) または (a, e) となります。

そして、この要素 (e, a) または (a, e) を集合Gの二項演算で変換すると a になります。

ここで気を付けて欲しいところは (e, a) を変換して a になることと、(a, e) を変換して a になることが別物だというところです。つまり、順番も大切だということです。そして、変換後は集合Gの直積集合の要素ではなく、集合Gの要素になるというところも大切です。

ここまでが一般的な話です。もう少し具体的な話を見てみましょう。自然数の直積集合とその二項演算が掛け算である場合で単位元を確認しましょう。

単位元を探すことは次の式を満たす自然数を探すことと同じです。`e * 5 = 5`または`5 * e = 5`を満たす`e`です。簡単ですよね。この式を満たす自然数は1です。

5の代わりに自然数の任意の要素を用いたとしても、この式を満たす自然数は1です。

### 逆元の存在

ここで紹介する逆元も特別な要素で、この逆元とペアを組むと単位元に変換されることになります。

逆元とはどのようなモノか見てみましょう。

前提として、集合Gの任意の要素をaとし、aの逆元をbとします。

そのような場合、この要素のペアは集合Gの直積集合の要素 (a, b) または (b, a) となります。

そして、この要素 (a, b) または (b, a) を集合Gの二項演算で変換すると単位元になります。

ここでも気をつけて欲しいところは順番も大切だというところです。

ここまでが一般的な話です。具体的な話を見てみましょう。有理数の直積集合とその二項演算が掛け算である場合で逆元を確認しましょう。

逆元を探すことは次の式を満たす有理数を探すことと同じです。`e * 5 = 1`または`5 * e = 1`を満たす`e`です。簡単ですよね。この式を満たす有理数は5分の1です。

しかし、簡単なことにこそ注意が必要です。

有理数の要素0には逆元がありません。つまり、`e * 0 = 1`または`0 * e = 1`を満たす`e`がありません。

## あとがき

参考書にある群の定義を少し紹介します。

``` 群.txt
結合律　　　：∀a, b, c ∈G, (a ○b) ○c = a ○(b ○c)
単位元の存在：∃e ∈G, ∀a ∈G, e ○a = a ○e = a
逆元の存在　：∀a ∈G, ∃b ∈G, a ○b = b ○a = e
```

Gは集合で、a, b, cは集合Gの要素、eは集合Gの単位元、○は集合Gの二項演算です。∀は要素に付け足すことで、任意の要素を意味します。また、∃は要素に付け足すことで、要素が存在することを意味します。

カンマはプログラム言語のセミコロンのような働きがあると私は思います。つまり、宣言の順番を指定する働きがあると私は思います。

単位元の存在の定義を解釈すると、「集合Gの要素eが一つあり、その一つの要素に対して、次の条件を満たす集合Gの任意の要素aがある」というような解釈になります。

同じように、逆元の存在の定義を解釈すると、「集合Gの任意の要素aがあり、その任意の要素（それぞれ）に対して、次の条件を満たす集合Gの要素bが一つある。」というような解釈になります。

厳格な定義です。この記事で私が書いた内容がむなしく感じられるほど厳格な定義です。

単位元と逆元を集合Gの直積集合の要素だと勘違いする可能性がありますが、単位元と逆元は集合Gの要素です。気を付ける必要があります。

このような感じで数学の記事をなるべく簡単な言葉で書いてみようと予定しています。

間違いに気付きましたらコメントなどで教えていただければ幸いです。

## 参考書

- [群・環・体入門](http://www.amazon.co.jp/%E7%BE%A4%E3%83%BB%E7%92%B0%E3%83%BB%E4%BD%93%E5%85%A5%E9%96%80-%E6%96%B0%E5%A6%BB-%E5%BC%98/dp/4320015959)

## 参照URL

- [群とその性質](http://www004.upp.so-net.ne.jp/s_honma/algebra/algebra11.htm)
[JavaScript]小技的な何か

# 自己定義関数

```javascript
var devour = function(target){
    //１回目の実行のみ実行される
    console.log('ゲルトが無残な姿で発見されました。');

    //devourを再定義
    devour = function(target){
        //２回目以降実行される
        console.log(target + 'が無残な姿で発見されました。');
    }
}
devour('ヨアヒム');   //ゲルト
devour('リーザ');     //リーザ
devour('ペーター');   //ペーター
```
　関数のなかで実行した関数を再定義すると、初回のみ実行したい処理をひとつの関数のなかで分離できる。  

　また、再定義後のスコープ内に再定義前のスコープ変数への参照を持っていれば、その参照を保持しているのでクロージャとしても使える。

```javascript
var visitCount = function(){
    var count = 1;
    console.log('はじめまして！　○○さん');

    visitCount = function(){
        count++;
        console.log(count + '回目の訪問です');
    }
}

visitCount();  //はじめまして！　○○さん
visitCount();  //2回目の訪問です。
visitCount();  //3回目の訪問です。
```


# 連鎖代入
JavaScriptの代入は式なので、演算結果を同じ文のなかでそのままさらに代入することができる（連鎖代入）。
複数の変数にまとめて代入することが必要な場合、以下のように書くことが出来る。

```js

var pamela = otto = 'werewolf';

console.log(pamela); // werewolf
console.log(otto);   // werewolf
```
一見便利だがスコープの観点からみればあまり好ましくない結果を生んでいる。
たとえば下記のような代入の連鎖は、グローバル空間を汚染している。

```js
// 即時関数で括ってスコープを限定！
(function () {
    var pamela = otto = 'werewolf';
})();

console.log(pamela); // undefined　→ ok
console.log(otto);   // werewolf   → 見えちゃってる
```
これは、代入演算子の評価が右結合であることによる。  
文『var pamela = otto = 'werewolf';』では、まず式『otto = 'werewolf'』が評価されてしまうため、ottoはグローバル変数として登録されてしまう。  続いて式『var pamela = otto』が評価されるため、var pamelaはグローバルスコープから見えずundefinedとなる。

連鎖代入を用いつつ、pamera・ottoともにスコープをローカルに限定するにはカンマ演算子を使う。

```javascript
// 即時関数で括ってスコープを限定！
(function () {
    var pamela, otto;
    pamela = otto = 'werewolf';

})();

console.log(pamela); // undefined
console.log(otto);   // undefined
```
node-gamepadの使い方


## はじめに
node-gamepadのREADMEが分かりにくかったのでメモ。
Macで話をするので、Winの方は準備のところを読み替えてください。
node-gamepadのところは共通かと思います。

node-gamepadのgitです↓
https://github.com/carldanley/node-gamepad

## 環境
OS : Mac 10.10.2
node : 0.10.29 (古い

## 準備
1. コントローラーを用意しましょう。
 - ここでは、PS3の標準のやつで話を進めます。
2. コントローラーをつなぎましょう
 - USBで挿してから、PSボタン押しましょう。
 - （近くにPS3本体がある時は、電源を落としておきましょう）
 - 確認は以下のソフトが便利です
 - [Joystick And Gamepad Tester](http://alphaomega.software.free.fr/joystickandgamepadtester/Joystick%20And%20Gamepad%20Tester.html)

Bluetoothのメニューバーに表示されるようになったら、USBを外しても動きます。
![bluetoothのメニューバー](https://qiita-image-store.s3.amazonaws.com/0/53437/cad7a8df-7955-280e-3adf-23f68b6fe724.png "ps3Bluetooth.png")

## node-gamepadをインストール
適当なディレクトリを作って、

```bash
npm init
npm install node-gamepad
```

公式のサンプルを参考にスクリプトを書きます

```javascript
var GamePad = require( 'node-gamepad' );
var controller = new GamePad( 'ps3/dualshock3' );
controller.connect();

controller.on( 'dpadUp:press', function() {
    console.log( 'Up' );
});

controller.on( 'dpadDown:press', function() {
    console.log( 'Down' );
});
```
動かすと、十字キー上下押したタイミングでログが出ると思います。

重要なのは、`dpadUp`とか`dpadDown`ってなに？ってところなのですが、これは、node-gamepadのパッケージ内の、`controllers/ps3/dualshock3.json`に対応表が書いてあります。この対応表jsonを参考にして、各ボタンへの処理を指定していくことが出来ます。
PicassoでWebView内の画像を設定する


[前回](http://qiita.com/alzybaad/items/9f06732664cd5cdeac73)に引き続き、今回はWebView。

HTMLはローカル、画像はWebにある場合に、Picassoのメモリキャッシュを利用してオフラインでも画像を表示できる（かもしれない）。
ディスクキャッシュはオフラインでは利用できないため、利用したい場合はアプリ側で別途保持するなどの対応が必要。

#### Android4.3以前での注意点
以降は基本的にAndroid4.4以降向け。
Android4.3以前では`WebView#loadUrl()`に渡す引数が長すぎるため、以下のエラーが発生してしまう。
**`Uncaught SyntaxError: Unexpected token ILLEGAL`**
Android4.3以前で同様の対応をするには、@kaaさんの[[Android] native→webviewへ大きめのデータを渡す](http://qiita.com/kaa/items/3f0ffabc0e8ce039b354)にあるように、分割して渡す必要がある。

#### assets内のHTML
画像を表示する要素(`div`)と画像を設定するJavascript(`loadImage`)があるだけ。

```html:assets/index.html
<!DOCTYPE html>
<html>
<head>
	<script type="text/javascript">
    	function loadImage(id, mime, base64) {
       		document.getElementById(id).innerHTML = "<img src='data:" + mime + ";base64," + base64 + "'/>";
		}
	</script>
</head>
	<body>
		<div id="image_area">
			<!-- ここに画像を表示 -->
		</div>
	</body>
</html>

```

#### Targetを実装したクラス
前回のActionBarアイコンを設定する方法同様、`Target`を実装したクラスを作成する。
読み込み完了時にBase64エンコードして上記Javascriptを実行している。`onPrepareLoad`と`onBitmapFailed`は省略。

```java:WebViewTarget
public class WebViewTarget implements Target {

	private WebView mWebView;
	private String mId;

	public WebViewTarget(WebView webView, String id) {
		mWebView = webView;
		mId = id;
	}

	@Override
	public void onPrepareLoad(Drawable placeHolderDrawable) {
	}

	@Override
	public void onBitmapLoaded(Bitmap bitmap, LoadedFrom from) {
		String base64 = toBase64(bitmap);
		String js = String.format("javascript:loadImage('%s','%s','%s')", mId, "image/png", base64);
		mWebView.loadUrl(js);
	}

	@Override
	public void onBitmapFailed(Drawable errorDrawable) {
	}

	private String toBase64(Bitmap bitmap) {
		ByteArrayOutputStream stream = new ByteArrayOutputStream();
		try {
			bitmap.compress(Bitmap.CompressFormat.PNG, 100, stream);
			byte[] bytes = stream.toByteArray();
			return Base64.encodeToString(bytes, Base64.DEFAULT);
		} finally {
			try {
				stream.close();
			} catch (IOException e) {
			}
		}
	}
```

#### 呼び出し元
assets内のHTML読み込み完了後、Picassoで画像を読み込む。
メモリキャッシュがある場合は同期的に実行されるため、`WebViewClient#onPageFinished`以降に実行しないと`Uncaught ReferenceError: loadImage is not defined`などと怒られる。

```java:MainActivity
final WebView webView = (WebView) findViewById(R.id.web);
webView.getSettings().setDefaultTextEncodingName("UTF-8");
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebViewClient(new WebViewClient() {

	private WebViewTarget mWebViewTarget = new WebViewTarget(webView, "image_area");

	@Override
	public void onPageFinished(WebView view, String url) {
		Picasso.with(MainActivity.this).load("<画像のURL>").into(mWebViewTarget);
	}
});
webView.loadUrl("file:///android_asset/index.html");

```
到底是"我" 还是"你"?



我有阅读障碍吗?常见的在微博或者知乎的某用户主页上,在关系圈的模块,会有"我关注的人力有 X 人也关注了他"这样一个表达.我就不懂了,这个"我"到底是谁,我的第一反应就是当前这个用户,因为这是他的主页,可是恰恰不是,这个"我”就是我

![未命名_meitu_000.jpg](https://qiita-image-store.s3.amazonaws.com/0/56713/deabfcb1-c9ec-4433-7dc1-91cf2ab0fbc2.jpeg "未命名_meitu_000.jpg")


为什么能够是我自己呢,这个句子的作用是提示,而给这个提示的是当前系统,作为一个第三方,它在告诉我,我关注的人里也有关注当前用户的人. 当前这个系统角色提示我的时候,为什么不是直接在页面上显示'你关注的人中也有 X 人关注他’呢?

而"我关注的人中 X人关注了他"这个话应该是我自己说出来的才对啊,或者就是没有提示的情况下,我自己搞懂了,之后发现"我关注的人中 X人关注了他",不是吗. 因为这个页面就是当前用户的主页,上面的所有东西都是他的,同时,如果页面上出现"我".我的第一反应就是当前用户啊

昨天在 twitter 上逛,哎,怎么发现他们的这个表达就比较让我好理解呢, 哈哈
![屏幕截图 2015-02-07 11.30.04.jpg](https://qiita-image-store.s3.amazonaws.com/0/56713/338014f9-e251-8dd7-ff5a-0005bdb93ad0.jpeg "屏幕截图 2015-02-07 11.30.04.jpg")


果然不是"我"啊! 是"你", 我顶这个表达!
apacheでpythonを動かすまで

# 起動停止

　macにはデフォルトでapacheが入っている。バージョンを調べる。

```bash
$ httpd -v
Server version: Apache/2.4.9 (Unix)
Server built:   Sep  9 2014 14:48:20
```
  
　起動、再起動の仕方。デフォルトは80ポートなので[ http://localhost ]。

```bash
$ sudo apachectrl start
$ sudo apachectrl stop
```

# cgiを有効にする

　cgi_moduleを有効にする。コメントになっているのではずして再起動。

```apache
LoadModule cgi_module libexec/apache2/mod_cgi.so
```

# パスを変更する

　httpd.confの中をみると、下記の設定になっている。

* コンテンツは「/Library/WebServer/Documents」
* CGIは「/Library/WebServer/CGI-Executables」

　「~/Web/doc」と「~/Web/cgi」を作って変えておく。

```apache
DocumentRoot "/Users/myname/Web/doc"
<Directory "/Users/myname/Web/doc">
...
</Directory>
<IfModule alias_module>
    ScriptAliasMatch ^/cgi-bin/((?!(?i:webobjects)).*$) "/Users/myname/Web/cgi/$1"
</IfModule>
#
<Directory "/Users/myname/Web/cgi">
...
</Directory>
```

# 確かめる

　あとは動作確認だけ。下記のようなpythonスクリプトを+xで作って「localhost/cgi-bin/test.py」にアクセスすればよい。

```test.py
#!/usr/bin/python
print 'Content-Type: text/html\n\n'
print "Hello world!"
```
【個人メモ】shellで連続した数列を得てxargsでコマンドを実行して回って行きたい

# 何がやりたいのか

そう、結論からいうと大量のサーバに対してプロビジョニングをかけたい。
で、サーバの名前の付け方が以下の感じだったとする

```
> webfront-01
> webfront-02
> webfront-03
...
> webfront-99
```

こいつらに対して、ssh uname -aを実行したい場合はどうするべきか、
というのでチョコっとしたシェルコマンド(ワンライナ)を残す。
xargsを組み合わせれば良い。

# 利用するコマンドのバージョン

GNU xargsとBSD xargsでオプション違ってて困った。
とりあえずGNU xargsを基準とする。

xargsは4.4.2
bashはは4.3.11である。

# xargsについて

```bash
> xargs -P4 -d " " -I {} ssh webfront-{} uname -a
```

- 並列度 4
- デリミタ空白
- 引数に取った値を {} に代入

という意味だ。なんてことはないが...

# echo "01 02 03 04..." をつかう

```bash
> echo "01 02 03 04 ... 99" | xargs -P4 -d " " -I {} ssh webfront-{} uname -a
```

欠点 "01 02 03" とか 書くのめんどくさい

# seqを使う

seqというコマンドがあるので、それがいいのかなと思って試してみた。

```bash
> seq -f "%02g" -s " " 1 99 | xargs -P4 -I{} -d " " ssh webfront-{} uname -a
```

欠点 seqに渡すオプションが複雑、長い。だるい。

# echo {0..n}を使う

```bash
> echo {0..9}{0..9} | xargs -P4 -I{} -d " " ssh webfront-{} uname -a
```

echo {0..9}{0..9}で、00から99までの値を吐き出してくれる。便利だ。

```bash
> echo {0..9}{0..9}
00 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99
```

echo {0..2}{0..9}とすれば、00から29までの値を吐き出してくれる

```bash
> echo {0..2}{0..9}
00 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29
```

# で、

最終的にこれらをjenkinsに入れて、日々のインフラがやってる作業を
見える化していく...
[Swift]URLスキームを使ってAppStoreのレビューページに飛ばす方法

# Apple IDを調べる
![スクリーンショット 2015-02-07 10.46.56.png](https://qiita-image-store.s3.amazonaws.com/0/26043/58316f86-8918-4ba4-796d-067929ce180c.png)
itunesConnectのアプリ詳細ページ>「その他」>「このAppについて」を押します。そうするとApple IDが表示されます。



#レビューページに飛ばす
```swift
let itunesURL:String = "itms-apps://itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?type=Purple+Software&id=XXXXX"
```
「XXXXX」の部分はApple IDが入ります。

#アプリ詳細ページに飛ばす
```swift
let itunesURL:String = "itms-apps://itunes.apple.com/app/XXXXX"
let url = NSURL(string:itunesURL)
let app:UIApplication = UIApplication.sharedApplication()
app.openURL(url!)
```
同様に「XXXXX」の部分はApple IDが入ります。
本当の素人のUNITY とC#勉強日記

ARアプリを制作したいと思い
3DSMAXで3Dを作成。
いざアプリ開発へ！と思いきや難しすぎますプログラムは･･･。
歳も歳なので忘れないように記録しながら少しずつ進みます。

つまずいた事や気づきをまずは記録。

UNITY　PRO使用の「MobileMovieTexture」モバイルムービーテクスチャを購入しました。

Unityで動画ファイルをテクスチャに貼り付けて再生させたい！の思いで
色々調べたのですが、UnityのムービーテクスチャUNity4.5では、PC向けには可能だけど
アンドロイドにビルドできないようで、安価にこの要望をかなえるにはこれしかないと思い購入。

無事テストとして作ったPlaneにでもムービーが再生！

![mobilemovie001.jpg](https://qiita-image-store.s3.amazonaws.com/0/68572/46ff4945-1ca1-f558-8678-bc292ab47675.jpeg)

おーーー！！っと思ったのもつかのま、BuildSettingをandroidにスウィッチすると
再生しません・・・。

と思ったらUnityProでお使用できる機能をandroidで使うには、androidPROアドオン162000円も購入する必要が
あるんですね。
知りませんでした。当たり前なんでしょうね・・・。

もうちょっとお金に余裕が出たら購入しようと思います。
PyCharm事始め

Qiita初投稿で自分用メモです。備忘録過ぎて役立たないと思いますがよろおねです。

[PyCharm](https://www.jetbrains.com/pycharm/) を使ってみたいなと思って、ほしい設定など調べて使えそうなところまでセットアップしました。

最新版はPyCharm4らしいです。

# 動作環境
* Mac OS X 10.9
* [homebrew-cask](http://caskroom.io/) : homebrew共々適当に入れて下さい。
* PyCharm Community Edition 4.0.4 (2015-02-07時点）

# インストール

homebrew-caskが入っている状態で

```
$ brew cask install pycharm-ce

# professional versionの場合
$ brew cask install pycharm
```

# プロジェクトを作る
起動した後に出てくるクイックメニューから`Cleate New Project`で作ります。次にインタプリタの一覧が出てきます。virtualenvの仮想環境も出してくれます。最高ですね。

#gitと連携

予めgitのローカルリポジトリをプロジェクトを開くで開けば認識してくれるっぽいです。その時はクイックスタートから`Open ...`を選択してリポジトリのフォルダを指定します。
開いた時に、pycharm(intellj?)のファイル追加する？と言われますが、すべてはずして追加しないほうがいいはず。


# 外観
`Preference` > `Appearance and Behavior` > `Theme`より行えます。暗めが好きなので「Darcula」を指定。

# カラースキーム
カラースキームは、`Preferance` > `Editor` > `Color & Font` で設定します。

デフォルトでmonokaiとか入っていますが、少ないので追加しましょう。

一から設定するのもアレなので、公開されているテーマをDL

[Color Themes](http://color-themes.com/?view=index)

ここの「Solarized Dark.」を使いました。Solarized Dark好きなんですよ

[Color Themes Solarized Dark.](http://color-themes.com/?view=theme&id=563a1a6280b4acf11273ae3f)

行い方は、ダウンロードしたjarファイルをPycharmのFile > Import Settingで読み込みます。

その後はダイアログを適当に進めて適応します。その後`Scheme Name`からインストールしたカラースキームを指定します。

ref: https://www.jetbrains.com/pycharm/help/colors-and-fonts.html

# フォント変更
これもカラースキームと同じ場所でやります。

`Color & Font` はテーマごとに設定可能ですが、デフォルトとインポートした設定は変更不可能になってます。テーマは複製可能で、複製するとフォントや細かい設定が可能です。

`Color & Font` の画面から「Save As」ボタンでテーマのコピーを作ります。名前は適当に付けます。

その後、`Font`の項目から、フォントを指定します。自分はRounded M+が好きなのでそれに設定。line heigthも設定できるので好きな様にやっておきます。

ref: https://www.jetbrains.com/pycharm/help/colors-and-fonts.html

# 行番号表示, 空白などの特殊文字の表示

これも出来ます。

`Editor` > `General` > `Appearance` より可能です。

行番号は, `Show line numbers`のチェックを入れます。

空白の表示は`Show whitespaces`です。

ref: https://www.jetbrains.com/pycharm/help/editor-appearance.html

# プロジェクトのインタプリタ環境の変更は？

`Preferance` > `Project: [project-name]` の部分で変更可能です。`Project interpreter` から変更できます。

驚いたのは、インタプリタ内に入ってるモジュールのバージョンをチェックし、最新バージョンの確認もできます。まだ確認していませんが、もしかしてアップグレードもできる？

また歯車アイコンより、virtualenvの環境を作ることが出来ます。なんかもう至れり尽くせり。

ref: https://www.jetbrains.com/pycharm/help/project-interpreter.html?search=project

# ファイルのエンコードの記述は

よくあるこれとか

```
# -*- coding: utf-8 -*-

# write code...
```

これです。自分はこちらのほうが好き。

```
# coding=utf-8

# write code...
```

これをPythonファイルを作った時に自動的に入るようにしたい。のですがどうやる？

`Preferance` > `Editor` > `File and Code Templates` より、Python Scriptの項目を選択して、右側にある入力項目で適当に変更しましょう。

ref: https://www.jetbrains.com/pycharm/help/creating-and-editing-file-templates.html?search=template

# どんどん使いたい

ひとまず、スクリプトは書けるかな？ぐらいまで設定してみました。

まず驚いたのは標準でpep8のチェックをやってくれます。便利です。素晴らしいです。

あとどのぐらいの機能があるんだろうか。[What's New(トップページだとバージョン指定で見れなかったので開発ブログのアナウンス)](http://blog.jetbrains.com/pycharm/2014/11/announcing-general-availability-of-pycharm-4/) を見たところだと、ipynbも使えるようです。なにがすごいかまだよくわかってませんが。youtubeの紹介ビデオを見て雰囲気を見ていこう。

http://youtu.be/639hcsfR4vU

Community Editionですが、有償ライセンスを買いたくなる品質ですね。

もっと早く使えばよかった＞＜
awk > 列の合計をしたい > awk '{for(i=1;i<=NF;i++){sum+=$i}; print sum/NF}'


動作環境

    CentOS 6.5


以下のデータがある時、この横方向（列）の合計を行いたい。
    1 2 3 4 5

ちなみに「列の合計」で検索しても、「ある列項目(例:2列目)を全ての行に対して合計する」ということをしている例が多く、上記の合計の方法がよくわからなかった。


ついさっき、`heliac2000`さんに教えていただいたforを使って列の合計をする方法を試した。

    indat="1 2 3 4 5"
    echo $indat | awk '{for(i=1;i<=NF;i++){sum+=$i}; print sum/NF}'

`NF`というのは列の数(5)が入る。

`sum`については0で初期化した方が安全かもしれない。ここでは省略している。

足し算できるのを確認したのは
- 整数
- 少数 (0.213など)
- Eつきの実数(1.23E-01など)
emacsでhelm

　バッファ切り替えやファイルオープンとかもhelmにできる。全て置き換えるのであれば、helm-mode。よく使うものだけ、キーバインドしておく。

```init.el
;;; helm
;; 標準を置き換え
(helm-mode +1)
;;(global-set-key (kbd "C-x b") 'helm-for-files)
;;(global-set-key (kbd "C-x C-f") 'helm-find-files)
;; helmショートカット
(global-set-key (kbd "C-x C-h h") 'helm-mini)
(global-set-key (kbd "C-x C-h r") 'helm-recentf)
(global-set-key (kbd "C-x C-h i") 'helm-imenu)
(global-set-key (kbd "C-x C-h k") 'helm-show-kill-ring)
;; helmコマンド内のキーバインド
(define-key helm-map (kbd "C-h") 'delete-backward-char)
(define-key helm-read-file-map (kbd "C-h") 'delete-backward-char)
(define-key helm-find-files-map (kbd "C-h") 'delete-backward-char)
;;(define-key helm-find-files-map (kbd "TAB") 'helm-execute-persistent-action)
;;(define-key helm-read-file-map (kbd "TAB") 'helm-execute-persistent-action)
```

　ミニバッファの保管をTABでと思ったけど、絞り込みが激しいので、TABを使わないよう慣れるていくほうが良いかもと思ってコメントへ。
bash > １つのデータを持つ複数ファイルの平均を取りたい

複数のファイル(in.XXX)がそれぞれ1つのデータを持っているとする (以下のように)。

    $ cat in.001
    3.145

in.001からin.300までのファイルの単純平均をとりたい。

```bash:avg_file_exec
    #!/bin/env bash

    for infile in $(echo $@)
    do
        work=$(cat $infile)
        indat="$indat $work"
    done

    echo $indat | awk '{for(i=1;i<=NF;i++){sum+=$i}; print sum/NF}'
```

以下のようにすれば平均が取れる。

    $ bash avg_file_exec in.*
    2.718
(.NET)Parse,TryParseの罠

#はじめに
上級プログラマーの知識としては常識(忘れている場合も多々ある :sweat: )ですが、初心プログラマにはよく陥る罠です。
この罠の知識があれば、この罠が原因で例外が発生しているのかなと想像つきます。
　正直なところ、自分自身への戒めの意味もあります :weary: 

#たまに発生する例外
　一般向けアプリを作成し、500名位に1名位の割合で、プログラム起動時、設定ファイル読み込み時に例外が発生します。開発環境で実証テストを行っても発生せず。「環境依存じゃないの？」とか「Windows Updateが当たってないんじゃないのか？」等とユーザーの環境に原因があるような事で済まされる可能性があります。

#地域設定を確認せよ
　その時、ユーザーのPCの地域設定パネルの**形式**を確認して下さい。「**日本語(日本)**」になってますか？
![1.png](https://qiita-image-store.s3.amazonaws.com/0/28247/426a211f-96d5-f35c-2e08-810921f1eeb3.png)

あるユーザさんは何故か「**アイスランド語(アイスランド)**」になってました。
**形式**がこの設定になっていると、小数点が「.」(**ドット**)でなく「,」(**カンマ**)になります。
![2.png](https://qiita-image-store.s3.amazonaws.com/0/28247/d970318b-ebdf-c45b-a4d6-e33fdac9c0ad.png)

カンの良い方ならﾋﾟｰﾝときますが、設定ファイルから読み込み処理を行う時に、小数点の解釈ができずに例外が発生するのです。

#おいおいバグじゃん :ant: 
コードは以下のようになってました

```csharp:(バグ発生コード)
var stringValue = "2.54";         //ファイルから読み込んだと仮定する
var decimalValue = default(decimal);
decimal.TryParse(stringValue, out decimalValue);
```

　上記のように簡単に文字列→数値変換を行うと、**Parse()** または **TryParse()**で解釈する文字列は、地域設定のコントロールパネルの設定に影響されます。
　初心者プログラマは気にせず上記のコードを作成しがちです。２つの引数で**Parse()**を呼び出すのは禁止にした方が良いかも知れません。

#対策
　地域設定の影響を受けないようにするためには、以下のように **InvariantCulture** を明示的に指定して、**Parse()**を行うべきです。

```csharp:(正しいコード)
var stringValue = "2.54";         //ファイルから読み込んだと仮定する
var decimalValue = default(decimal);
decimal.TryParse(stringValue ,
                 NumberStyles.Number,
                 System.Globalization.CultureInfo.InvariantCulture,
                 out decimalValue );
```
#コーディング規約に謳おう！
現場では、拡張メソッドにして、**Parsr()**や**TryParse()**は**使用禁止**を謳った方が良いと思います。

```csharp:(拡張メソッド)
/// <summary>
/// 文字列→decimal
/// </summary>
/// <param name="stringValue">文字列</param>
/// <param name="defaultValue">失敗時の数値</param>
/// <returns>解析されたdecimal値</returns>
static public decimal ToDecimal(this string stringValue, decimal defaultValue = decimal.Zero)
{
    var value = defaultValue;
    if (decimal.TryParse(stringValue, NumberStyles.Number, 
                         System.Globalization.CultureInfo.InvariantCulture, out value))
    {
        return value;
    }
    return defaultValue;
}
```
emacsのテーマ

　emacsには、デフォルトのテーマがあるので、下記のようにロードするだけで、テーマを変えられる。

```init.el
(load-theme 'wombat t)
;(load-theme 'misterioso t)
;(load-theme 'tango-dark t)
;(load-theme 'tsdh-dark t)
;(load-theme 'wheatgrass t)
```
powershellでOracleクエリ実行

powershellでクエリを実行してみた

```ps1:OracleFetch.ps1
Set-StrictMode -Version 2

# Usage: OracleFetch  (OracleConnection USER PASS SID) "select 1 a,2 b,3 c from dual" | Export-Csv foo.csv -NoTypeInformation -Encoding Default

[void][System.Reflection.Assembly]::LoadWithPartialName("System.Data.OracleClient")

function OracleConnection {
  Param($user, $pass, $sid)

  $ErrorActionPreference = "Stop"

  function ConnectionString {
    "Data Source=${sid};User ID=${user};Password=${pass};Integrated Security=false;"
  }

  New-Object System.Data.OracleClient.OracleConnection(ConnectionString)
}

function OracleFetch() {
  Param($conn, $sql, $BindParams = $null)

  $ErrorActionPreference = "Stop"

  $command = New-Object System.Data.OracleClient.OracleCommand
  $command.Connection = $conn

  if ($conn.State -ne "Open") {
    $conn.Open()
  }
  $command.CommandText = $sql

  if ($BindParams) {
    $BindParams.Keys | % {
      $param = New-Object System.Data.OracleClient.OracleParameter($_, $BindParams[$_])
      [void]$command.Parameters.Add($param)
    }
  }

  $reader = $command.ExecuteReader()
  while ($reader.Read()) {
    $obj = New-Object PSObject
    0..($reader.FieldCount-1) | % {
      $obj | Add-Member -MemberType NoteProperty -Name ($reader.GetName($_) -replace "\W", "") -Value ($reader.GetValue($_))
    }
    $obj
  }
}
```

使用例:

```
. (Join-Path $MyInvocation.InvocationName ..\OracleFetch.ps1)

$conn = OracleConnection USER PASS SID
OracleFetch  $conn "select 1 a,2 b,3 c from dual" |
  Export-Csv foo.csv -NoTypeInformation -Encoding Default
OracleFetch  $conn "select 1 a$#,2 日本語,3 c from dual" |
  ConvertTo-Csv -NoTypeInformation
$conn.Close()
```

ペンディング

* 毎レコードPSObjectを作るのは効率悪そう。利用する側の好きにやらせたい。(スクリプトブロックを渡すと、$reader をそのブロックに渡してループするなど)
* 取得した $reader は、なぜかパイプラインに渡らない。(`$reader | Get-Member` が表示されない。`Get-Member -InputObject $reader` はOKだった)
* 以下、OracleDataAdapter を使った方法は、まだ評価中。

```ps1:OracleFetch2.ps1
function OracleFetch2 {
  Param($conn, $sql)

  $ErrorActionPreference = "Stop"

  $dataSet = New-Object System.Data.DataSet

  [void](New-Object System.Data.OracleClient.OracleDataAdapter($sql, $conn)).Fill($dataSet)

  $dataSet.Tables
}
```
bash > ある範囲の行のデータを列分解する > IFS='\n'とgrepとawkの組合せ

以下の内容を持つ`all.dat`というファイルがあるとする。

    This is comment
    This is comment
    This is comment
    data start
    1 2 3 4 5
    A B C D E 
    X Y Z V W

このファイルから`data start`以降の部分を列ごとに分解したいとする。

subset_exec(名前は任意)というファイルを新規作成して以下を記載する。

    IFS='\n'
    subset=$(grep -A 5 data $1)
    echo $subset | awk '{print $1, $2}' > 1_2.dat
    echo $subset | awk '{print $1, $3}' > 1_3.dat
    echo $subset | awk '{print $1, $4}' > 1_4.dat

そして、以下を実行すると`1_2.dat`、`1_3.dat`、`1_4.dat`というファイルが生成され、それぞれ(1列と2列)、(1列と3列)、(1列と4列)のデータが格納される。

    $ bash subset_exec all.dat


`kazu056`さんに教えていただいた`IFS='\n'`を使えばこういうことができると気づいた。

`data`という行も不要の場合は、`grep -v data`を使って取り除くのでもいい。

`grep -A 5`の5というのは`data`がある行の後から5つまでということなので、ここはデータの行数に合わせて適宜修正する。data以降が全部取りたいデータの場合は、きっちりした行数(N)でなく,Nより大きい値を入れておけばいい。
Chromeアプリ：screen shareを作りたい（エラー編）

chrome extensionのdesktopcaptureを使って，自分のパソコンの画面が他のパソコンの画面でも見えるような拡張機能を作りたいと思っています。
>http://www.slideshare.net/yusukenaka52/screenshare-public

を参考資料に作ってみましたがローカル環境でも本番環境でも

> NavigatorUserMediaError {constraintName: "", message: "", name: "InvalidStateError"}

というエラーが出ました。このエラーが何を意味しているのか，そしてどうすれば解決できるのかを知りたいです。おねがいします。

基本的な構造は
サイトの"send"をクリックしたら，
　　　サイトのjavascript=>chrome拡張のbridge.js=>background.js
の順に連絡が届きます。background.jsのchrome.desktopCapture.chooseDesktopMediaで共有画面を選択し，そのchromeMediaSourceIdを
　　　background.js=>bridge.js=>サイトのjavascript
の順番で渡します。エラーが出た場所はサイトのjavascriptのnavigator.webkitGetUserMedia()です。以下実際のコードを書きます。

サイトのhtmlファイル

````index.html
<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="utf-8">
</head>
<body>
	<div id="message">send</div>
<video id="video" autoplay></video>

<script>

window.addEventListener( 'message', function ( event ){
    if ( event.data.type != 'gotStreamId' ){
        return;
    };    
   	navigator.webkitGetUserMedia(
		{
			audio: false,
			video: { mandatory: {
				chromeMediaSource: "desktop",
				chromeMediaSourceId: event.data.streamid},
				optional: [{
					googTemporalLayeredScreencast: true
				}, {
					googLeakyBucket: true
				}]
			}
		},
		function(stream){
			console.log(stream);
			document.getElementById("video").src = URL.createObjectURL(stream);
		},
		function(e){
			console.error(e);
		}
	);
});

document.getElementById("message").addEventListener("click", function(){
	console.log("1")
	window.postMessage({type:"getStreamId"}, "*");
});
</script>
</body>
</html>
````

chrome拡張のbridge.js

````bridge.js
var port = chrome.runtime.connect();

window.addEventListener( 'message', function ( event ){
    if ( event.source != window ){
        return;
    }
    if( event.data.type == 'getStreamId' ){
        port.postMessage('getStreamId', function(response){
            console.log(response);
        });
    }
});

port.onMessage.addListener( function( request, sender, sendResponse ){
    window.postMessage({type: 'gotStreamId', streamid: request.streamid}, '*');
});
````

chrome拡張機能のbackground.js

````background.js
chrome.runtime.onConnect.addListener( function( port ){
    port.onMessage.addListener( function( message ){
    	if(message == 'getStreamId'){
			chrome.desktopCapture.chooseDesktopMedia(["screen", "window"], function( streamId ){
				console.log(streamId);

				port.postMessage({streamid:streamId});
			});
    	}
	});
});
````

ブラウザはmacのchromeで，sinatraを使って作っています。
chef の include_recipe で同じレシピを2度実行する reinclude_recipe

# 課題

chef の include_recipe は２度呼んでも１度しか実行してくれない。深遠な理由があってなんとかして２回実行したい。

レシピサンプルはこんなかんじ

```rb:recipes/include_recipe.rb
node['log'] = 'foo1'
include_recipe "foo::log"
node['log'] = 'foo2'
include_recipe "foo::log"
```

```rb:recipes/log.rb
log node['log'] do
  level :fatal
end
```

log リソースが１度目の include_recipe でしか実行されない

```
$ chef-solo -c solo.rb -o foo::include_recipe
Compiling Cookbooks...
Converging 1 resources
Recipe: foo::log
  * log[foo1] action write[2015-02-06T04:04:38+09:00] FATAL: foo1
```

# やりかた

libraries として次のような monkey patch を定義する。

```ruby:libraries/reload_recipe.rb
require 'chef/dsl/include_recipe'

class Chef
  module DSL
    module IncludeRecipe
      def reinclude_recipe(*recipe_names)
        recipe_names.each {|recipe_name| run_context.instance_variable_get(:@loaded_recipes).delete(recipe_name) }
        run_context.load_recipe(*recipe_names)
      end
    end
  end
end
```

include_recipe の代わりにここで定義した reinclude_recipe を使えば２度呼べるようになる (本当は ruby にあわせて load という名前にしたかったのだが、すでに使われていたので reinclude にした)

レシピサンプルはこんなかんじ

```rb:recipes/reinclude_recipe.rb
node['log'] = 'foo1'
reinclude_recipe "foo::log"
node['log'] = 'foo2'
reinclude_recipe "foo::log"
```

```rb:recipes/log.rb
log node['log'] do
  level :fatal
end
```

２度呼ばれてる

```
$ chef-solo -c solo.rb -o foo::reinclude_recipe
Compiling Cookbooks...
Converging 2 resources
Recipe: foo::log
  * log[foo1] action write[2015-02-06T04:04:10+09:00] FATAL: foo1
  * log[foo2] action write[2015-02-06T04:04:10+09:00] FATAL: foo2
```

# おわりに

２回実行したいようなものは、レシピではなく definitions として定義するのが本筋。なので、良い子の皆は真似しないほうが良い。
selectorの色をゆっくり変化させる方法

ListSelectorなどで、パッと色を変えるのではなくゆっくりと変えるようにする方法のメモ

```xml:drawable/selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:exitFadeDuration="ミリ秒">
</selector>
```

selectorタグのexitFadeDurationでミリ秒を指定するだけ
Android Wearモジュールでフレーバーを利用する方法

Android Wearモジュールを組み込んだプロジェクトで、フレーバーを利用するとapkにWearのapkがパックされないことがあります。
そのような場合、正しくgradleを設定する必要があります。

```groovy:Build.gradle(Mobile側)
android {
    productFlavors {
        preview {
            applicationId = "com.examle.app.preview"
        }
    }
}

dependencies {
    previewWearApp project(path: ':wear', configuration: 'previewRelease')
}

```


```groovy:Build.gradle(Wear側)
android {
    publishNonDefault true
    productFlavors {
        preview {
            applicationId = "com.examle.app.preview"
        }
    }
}
```
以上です。

コツは
* Flavor名は小文字に統一する
* Mobileのdependenciesで

```groovy
{FlavorName}WearApp project(path:':{ModuleName}',configuration:'{FlavorName}Release')
```
と記述（文字列連結されている部分に注意）

* Wear側で`publishNonDefault true`を指定


以上です！
GCC から Intel OpenMP Runtime Library を利用する

### 概要
GCC の [OpenMP 実装](https://gcc.gnu.org/projects/gomp/)は、libgomp というランタイムライブラリ使ってますが、OpenMP/Clang で利用されている [Intel OpenMP Runtime Library](https://www.openmprtl.org/) に差し替えることが可能です。

まぁ、後者の README.txt には gcc compatible ですよ的なことは書いてあるので、できて当たり前なんでしょうけど。

> The following compilers are known to do compatible code generation for
> this RTL:  icc/icl, gcc.  See the documentation for more detail.

### やり方
リンク時にライブラリを指定をするだけ。Linux の場合はライブラリ名 libiomp5.so なのでこんな感じです。
`gcc -o prog -fopenmp -O2 -liomp5 source.c`

ただ、-fopenmp オプションはリンク時に自動的に -lgomp するようなので、これだと libgomp と libiomp5 が両方リンクされて気持ち悪い！という感じになります。気になる場合はコンパイルとリンクを分けて、リンク時のみ -liomp5 すれば OK です。

`gcc -c -o obj.o -fopenmp -O2 source.c`
`gcc -o prog -liomp5 obj.o`

### その他
OpenMP 仕様のサポート状況はライブラリやバージョンにより異なるので、差し替えによって挙動が変わる可能性はあります。

ただ、Intel ライブラリには for ループに関して、Work-Stealing や TSS(Trapezoid Self-Scheduling) が ~~こっそり~~ 実装されているので、差し替えることでこれらのスケジューリングアルゴリズムを試すことができます。

\#pragma omp for で schedule(runtime) を用いたうえで、実行時に環境変数 OMP_SCHEDULE を Work-Stealing の場合は `static_steal` と、TSS の場合は `trapezoidal` とそれぞれ指定します。

* Work-Stealing 
`OMP_SCHEDULE=static_steal <exec_prog>`

* TSS
 `OMP_SCHEDULE=trapezoidal[,minimum_chunk] <exec_prog>`

### あとがき
始めて Qiita を使ってみたよ。

差し替えなんてせずに最初から OpenMP/Clang 使えよというツッコミはあるでしょうけど、処理系をインストールし辛い環境の人もいますしね・・・

私の場合、Intel OpenMP Runtime Library 使ってベンチマーク取りたいけど、clang でベンチマークプログラムのコンパイルがとおらないという状況だったので :disappointed_relieved:
Scala.js v0.6試してみた


Announcing Scala.js 0.6.0 http://www.scala-js.org/news/2015/02/05/announcing-scalajs-0.6.0/

事実上のstableらしいので久しぶりにやってみる。

# tutorial

scalaのためにsbtを入れておく(brew install sbt等)

```
$ git clone git@github.com:scala-js/scalajs-tutorial.git
$ cd scalajs-tutorial
$ sbt run
```

scala本体とか色々インストールするんで最初は時間かかる

# Node.jsで実行

build.sbtに次の一行を追加

```
scalaJSStage in Global := FastOptStage
```

sbt runするにはphantom.js入れておく必要はあった。デフォルトはrhinoでクッソ遅いとのこと。

# サイズ比較

本当に最小限のhelloworldです。

```
package tutorial.webapp
import scala.scalajs.js.JSApp
object TutorialApp extends JSApp {
  def main(): Unit = {
    println("hello!");
  }
}
```


## fastOptJS

開発時のビルドモード

約2sでビルド後が138k

```
~/s/scalajs-tutorial (0.6.x) $ sbt fastOptJS
[info] Loading project definition from /Users/mizchi/sandbox/scalajs-tutorial/project
[info] Set current project to Scala.js Tutorial (in build file:/Users/mizchi/sandbox/scalajs-tutorial/)
[info] Fast optimizing /Users/mizchi/sandbox/scalajs-tutorial/target/scala-2.11/scala-js-tutorial-fastopt.js
[success] Total time: 2 s, completed 2015/02/07 3:40:17
```

## fullOptJS

productionビルド相当

約4sでビルド後が19k

```
~/s/scalajs-tutorial (0.6.x) $ sbt fullOptJS
[info] Loading project definition from /Users/mizchi/sandbox/scalajs-tutorial/project
[info] Set current project to Scala.js Tutorial (in build file:/Users/mizchi/sandbox/scalajs-tutorial/)
[info] Full Optimizing /Users/mizchi/sandbox/scalajs-tutorial/target/scala-2.11/scala-js-tutorial-opt.js
[info] Closure: 0 error(s), 0 warning(s)
[success] Total time: 4 s, completed 2015/02/07 3:42:08
```

## サイズ

```
~/s/scalajs-tutorial (0.6.x) $ la target/scala-2.11/
total 1256
drwxr-xr-x  9 mizchi  staff   306B  2  7 03:42 .
drwxr-xr-x  6 mizchi  staff   204B  2  7 03:14 ..
drwxr-xr-x  4 mizchi  staff   136B  2  7 03:30 classes
-rw-r--r--  1 mizchi  staff   138K  2  7 03:40 scala-js-tutorial-fastopt.js
-rw-r--r--  1 mizchi  staff   157K  2  7 03:40 scala-js-tutorial-fastopt.js.map
-rw-r--r--  1 mizchi  staff   242K  2  7 03:40 scala-js-tutorial-jsdeps.js
-rw-r--r--  1 mizchi  staff   144B  2  7 03:40 scala-js-tutorial-launcher.js
-rw-r--r--  1 mizchi  staff    19K  2  7 03:42 scala-js-tutorial-opt.js
-rw-r--r--  1 mizchi  staff    59K  2  7 03:42 scala-js-tutorial-opt.js.map
```

# 感想

昔はビルドに3分、出力40MBとかあったのだが、すごく軽くなっててすごい（小学生並みの感想）


実行速度とライブラリの充実次第で、今選択するの全然アリな気がする。

次は周辺ツールを探す。
iPhoneにインストールしたアプリのリクエストデータを何となく調べてみた


[RaspberryPi Wifi APを使った無線ルーターの設定](http://qiita.com/kiyotaman/items/2dbd40de0d2ec99ce77d)を作ったので、何かできないかなと思い、何となくiPhoneにインストールしたアプリのリクエスト情報をtcpdumpで追っかけてみた。

## 流れ

* iPhoneを自前APに繋ぐ
* sshでrasberrypiにログイン
* 下記のコマンドを叩く

以上、書くまでもないか

## tcpdumpを使って80を監視

```shell:bash
$ sudo tcpdump -vvv -i wlan0 -A -s 0 'tcp port 80 and (((ip[2:2] - ((ip[0]&0xf)<<2)) - ((tcp[12]&0xf0)>>2)) != 0)'
...
...
...
データが流れる...
...
...
...
...
```


**SmartNewsのPostを発見した**ので、なのでSmartNewsのapiをみてみた。


## curlでデータをPOSTしてみる

```shell:bash
# dataにポストのバイナリデータを保存して、-dでポストする
# agentを偽装してあげる必要があるみたい
$ curl -vvv --user-agent 'SmartNews' --data-binary '@data' http://www.smartne.... -o smartnews.gz

# 解凍する
$ ls -lh smartnews.gz
-rw-r--r--  1 watashi  staff   7.8K  2  7 03:27 smartnews.gz
$ gunzip smartnews.gz
$ ls -lh smartnews
-rw-r--r--  1 watashi  staff   478K  2  7 03:19 smartnews
```

postデータはk=vで、レスポンスデータはjsonだった。

## 感想
jsonでやり取りしていることろがやはり多い。
データー構造の作りやヘッダーの使い方など色々と参考になるので、時々調べてみることにしよう。
どのタイミングでどんなデータとか投げているかもわかる。
今度はinstagramを見てみようかな。
やり取りを見ると、アプリやapiの作りの勉強になるな。
何となくやってみたけど、案外面白い。

楽しいおもちゃができた！

あ、それと、暗号化って大事よねと思った。
気をつけねば。
Slackを半透明にして常に手前に表示させる

なんでもかんでも半透明にしたい願望を持つ層は一定数いると思う。私もそうだ。

![150207-0005.png](https://qiita-image-store.s3.amazonaws.com/0/42729/cdaf5c22-5b11-2406-6b19-00a1f8ba5bdd.png)

## 前置き
Afloatというツールを使う。
「ウィンドウ 半透明　mac」等でググるとすぐ出てくるツールなのだが、どれもYosemiteに対応してない。
[Yosemite で Afloat を使えるようにする](http://qiita.com/turusuke/items/be847c898d9699044034)記事を読んでインストールしても、半透明にできるアプリがほとんどない。
Finderくらいしか透明にできなかったりして残念な感じになっている。
だが、以降の手順に従えばうまくいく。

## 留意点
ブラウザ版のSlackでしかできない。
アプリ版でもできるけど、面倒な点がある。(後述)

## 手順
1. `brew cask install easysimbl`
2. [Afloat 2.4](http://mac.majorgeeks.com/mg/getmirror/afloat,1.html)をダウンロードしてインストール。
3. 1でインストールしたEasySIMBLを開いて以下のようにする。

    ![150207-0002.png](https://qiita-image-store.s3.amazonaws.com/0/42729/e1f4ba00-d5aa-ea95-732c-0b99f89535ad.png)

4. ブラウザ版Slackを開いて、メニューバーの「ウィンドウ → Keep Afloat」でウィンドウが常に手前に表示される。(control+command+A)
5. 「ウィンドウ → Adjust Effects」で開くと出てくるメニューでTransparency(透過度)を調節する。

## まとめ
ブラウザでSlackを新しいウィンドウで開く → control+command+A → Transparencyいじる

## 終わりに
我ながら、ださくてローテクな方法だと思う。
Afloatでブラウザが半透明かつ手前に表示できるようになるということを利用してるに過ぎない...
Afloatを入れる前にbrew caskでeasysimblを入れるところがポイント。
ちまたに転がってる手順書はどれも「SIMBL をダウンロード」と書いてたり、「SIMBL」と「Afloat」のバージョンを両方とも最新にすればできるという記事もあるが、どれもこれもYosemiteだとうまくいかなかった。

## 補足
おそらくここに書かれてる方法でAfloatを入れれば、Macで使う有名ドコロのアプリは半透明かつ手前表示にできるようになると思う。

## アプリ版Slackについて
Slackを起動して「Connecting...」の間にのみウィンドウメニューに「Keep Afloat」や「Adjust Effects」が表示される。
なので、素早く操作すれば半透明にできる。解除するには一旦閉じないといけない。あまりcoolじゃないし面倒。

## 参考記事
* [Always on top in MacOS Yosemite](http://www.perfectlyrandom.org/2015/01/31/always-on-top-in-macos-yosemite/)
現役学生と将来のプログラマのためのProcessing#3


#目的
現役の専門学校学生さん達にProcesingを学んでもらうために記述しています。
ついでに、将来のプログラマ、教育に関わっている人達に何かの助けになるといいな。
processingはもっと評価されていいと思う。

#前提

https://processing.org/download/?processing
![kobito.1421330011.865512.png](https://qiita-image-store.s3.amazonaws.com/0/33317/706723c5-00a7-847f-54d2-7abb6f34dfa2.png "kobito.1421330011.865512.png")

http://qiita.com/ggggnonaka/items/5d66d555a398d55f6b28

#今回の目標
アナログ時計
どこを参考にして組み上げたか、もはや忘却しています。

```PDE:clock.pde
void setup() {
  size(800,800);
  stroke(255);
  smooth();
  frameRate(30);
}

void draw() {
  background(20,20,20);
  float s = second();
  float m = minute() + (s/60.0);
  float h = hour()%12 + (m/60.0);

  translate(width/2, height/2);
  ellipse(0,0,width,height);

  noFill();
  stroke(0,255,0);

  //second
  pushMatrix();
  rotate(radians(s*(360/60)));
  strokeWeight(1);
  line(0,0,0,-height/2);
  popMatrix();

  //minute
  pushMatrix();
  rotate(radians(m*(360/60)));
  strokeWeight(2);
  line(0,0,0,-height/2);
  popMatrix();

  //hour
  pushMatrix();
  rotate(radians(h*(360/12)));
  strokeWeight(6);
  line(0,0,0,-height/3);
  popMatrix();
}
```
#Result
![スクリーンショット 2015-02-07 3.02.38.png](https://qiita-image-store.s3.amazonaws.com/0/33317/a8dd7900-1dc9-f8c6-3552-63372d8ed728.png "スクリーンショット 2015-02-07 3.02.38.png")
WordPress: DBから直接値を取得する方法（メモ）

```php:index.php
<?php
global $wpdb;
$args = array( 'posts_per_page' => -1, 'post_limits' => -1, 'post_type' => 'post' );
$wp_query = new WP_Query( $args );
?>

<?php if( $wp_query->have_posts()) : ?>
<? while($wp_query->have_posts()) : $wp_query -> the_post(); ?>

<?php
$str_result = "SELECT post_title FROM $wpdb->posts WHERE ID = ". $use_post->ID;
$var = $wpdb->get_var( $str_result );
$row = $wpdb->get_row( $str_result );
print_r( $var );
print_r( $row );
?>

<?php endwhile; ?>
<?php endif; ?>
```

グローバル変数（クラス？）の $wpdb を使うっぽい。
Adobe AIRでiOS出力だけ動かないとき

Adobe AIRでアプリを作っていって、Windows出力も、Android出力も動くけど、iOSだけスプラッシュが表示されてから動かなくなる現象の解決法です。

特に、ios-test-interpreter、ios-debug-interpreterはうごくけど、ios-test、ios-debug、ios-ad-hoc、ios-app-storeが動かない場合。

AIRのapplication.xmlでサブディレクトリを使って、initialWindowのcontentを指定するとこの現象がおきます。

```xml:ダメな例
<content>bin/flash/bin/Main.swf<content>
```

```xml:良い例
<content>Main.swf<content>
```

Main.swfはカレントディレクトリ直下に置きましょう。

OpenFL -> SWF -> AIRって出力しようとするとSWFの出力先が深いディレクトリになるので、この罠にはまりやすい。Xcodeでログ拾おうとしてもロクなエラーメッセージが出てこなくて手掛かり無しなのではまると辛い。(辛かった)
マウスオーバーで画像拡大

```
img.grow {
    -webkit-transition:0.2s ease-in-out;
    -moz-transition:0.2s ease-in-out;
    -ms-transition:0.2s ease-in-out;
    -o-transition:0.2s ease-in-out;
    transition:0.2s ease-in-out;
}

img.grow:hover {
    -webkit-transform:scale(1.2,1.2);
    -moz-transform:scale(1.2,1.2);
    -ms-transform:scale(1.2,1.2);
    -o-transform:scale(1.2,1.2);
    transform:scale(1.2,1.2);
}
```
img タグに grow と名付けたクラスを追加。そして transition プロパティで拡大・縮小したときの滑らかな動きを指定します。
「0.2s」の部分はミリ秒単位で指定できます。
速度の割合を変更したい場合は、「ease-in-out」の他にease、linear、ease-in、ease-outのいずれかのキーワード、またはcubic-bezier関数を指定することになります。

それぞれの値の意味やcubic-bezier関数について説明すると、それだけで随分長くなってしまうのでここでは省略し、続いて transform プロパティで拡大・縮小の割合を指定します。
上記の例では1.2倍に拡大させています。
縮小したい場合は、例えば scale(0.8,0.8) と指定すればＯＫ。

次に html 側の記述を紹介します。
```
<img src="/sample.jpg" class="grow"/>
```
基本的には、拡大させたい画像のタグに class=”grow” と追加するだけです。

以上で、マウスオーバー時だけでなく、マウスカーソルが画像から外れた際にも滑らかな動きで拡大・縮小させることができます。
gentoo で portage tree の sync に git を使う

## 注意

下記手順は行儀がよろしくないので、 @wjn さんの記事を参考にすることをおすすめします。

http://qiita.com/wjn/items/a3b71059211711501e35

----------------------

https://github.com/gentoo/gentoo-portage-rsync-mirror に書いてある

## 手順

1. portage-9999 にする (2.2.16 以上の必要がある)

        sudo emerge '=sys-apps/portage-9999'

2. repos.conf を変更する

        sudo $EDITOR /etc/portage/repos.conf

        # repos.conf
        [gentoo]
        location = /usr/portage
        sync-type = git
        sync-uri = https://github.com/gentoo/gentoo-portage-rsync-mirror
        auto-sync = true

3. /usr/portage を git 管理にする

        sudo rm -rf /usr/portage
        sudo eix-sync
enchant.jsとtmlib.jsを使ったゲーム作成フレームワーク「enforce」スプライトサイズ

# enchant.jsとtmlib.jsでのスプライト表示の違い
通常、オブジェクトを追加してスプライトを表示する時は下記のようになります。

```coffeescript
obj = addObject
    image: 'chara'
    x: 0
    y: 0
    width: 32
    height: 32
    animlist: [
        [100, [0]]
    ]
```
このパラメータの中の、

```coffeescript
    width: 32
    height: 32
```
は、一枚の画像データに収められたパーツを、どのサイズで切り出すかという指定なのですが、例えば32x32のサイズで画像ファイルを作り、それを、

```coffeescript
    width: 320
    height: 320
```
とやるとどうなるでしょう。
結果は、enchant.jsは32x32の画像がタイル状になった320x320のサイズのスプライトが表示されます。
画像ファイルのサイズが64x64の場合は、64x64の画像がタイル状に敷き詰められたスプライトになります。
tmlib.jsの場合はどうなるかというと、画面に表示されません。
画像ファイルのサイズを越えるサイズを指定すると、スプライトが画面に表示されなくなります。
単色塗りつぶしのスプライトや、スマートフォンのタッチイベントを受け取る透明のスプライトを使用する場合は、enchant.jsは小さめの画像が使えますが、tmlib.jsは大きめのサイズの画像を用意しておいて切り抜く形で使用する必要があります。

両方のライブラリを切り替えて使用する場合はこの点を注意してください。

---

[enforceチュートリアル一覧](http://qiita.com/digitarhythm/items/9e75c871f5ce582a4d01)
質問　ヤフオクAPI全般　マイオークション等の全件取得について

お世話になります。
ヤフオクAPIを利用してマイオークション情報を取得した際、ページ毎50件づつ取得が標準となっておりますが
全件を一括で取得する方法はないでしょうか？
件数分ページカウントをループさせるしか方法は無いでしょうか？

よろしくお願いします。
学生あるある ゲームプログラミング

# まず、学生あるあるコード
* プレイヤーが神オブジェクトになっている。
* 機能を細分化して設計されてない。
* シーン管理がswitch文で行われている。
* 基本的にコピペのコードになっている。
* 1つ関数が長い。
* 頭良く書いている。
* switch文がたくさんある。
* 他人が読むとき苦になる。
* などなどがあります。

# 解決策
## プレイヤーなどの神オブジェクトについて
* 神オブジェクトとは？
    * 1つクラスの中に様々の処理があり、1つのクラスが最強になっていることです。
* 原因
    * 細分化の仕方がわからない。めんどくさい などがあるかもしれません。
* 解決策
    * まずは、ゲームオブジェクトになるクラスに様々な機能を持たせるというイメージをしてもらうとわかやりすいかもしれません。
    * 様々な機能の作り方は、機能クラスに分けていきます。
    * ゲームオブジェクトの情報がほしい場合は、機能クラスでオブジェクトのポインターを取得してきます。
    * そうすれば、座標などが取得できます。

## シーン管理について
* switch文での管理はだめな理由
    * 1つのシーンが増えたら1つのcaseを作らなければならない。
    * それはいわゆるコピペが生まれるだけです。
* 解決策
    * シーン管理のクラスを作りそこに各シーンを登録していく形にします。
    * 現在のシーンだけの情報をシーン管理に持たせます。
    * UpdateやDrawなどですべて動く形にしていきます。 

## 基本的にコピペのコードになっている。
* 関数の中に同じ処理が複数個ある。
    * 関数分けをして引数をうまく使いましょう。
* if文が同じような判定になって、その中も同じような処理がある。
    * テーブル化をしてあげましょう。
* ハードコーディングが多い。

## 頭良く書いている。
* 自分しかわからないコードを書いてしまう。
* 処理を上から見てもよくわからない。
* 解消法
    * ある意味、ばかにコーディングしよう。 
    * 他人の気持ちになりコードを書こう。
 
# まとめ
* 色々書いてきましたが、だれかの参考になればうれしいです。
* あと、Gitを使いましょう！！
* タスク管理およびスケジュール管理を行いましょう！！

以上です。
Angular.js備忘録

自分用の備忘録です。

## angular.moduleの使い方

angular.moduleの使い方を覚えないと思わぬところでつまづきます。

サーバのRESTAPIからデータを取得するために、`$resource`を用いてAPIを叩きにいったのですが、なぜか動きませんでした。

画面に何も表示しなくなり、ブラウザのConsoleにエラーも表示されませんでした。

``` service/test.js
var TestService = angular.module('TestService',['ngResource']);

TestService.factory('Test',['$resource',function ($resource) {
            return $resource('http://localhost/api/test/:id',{},{
                  query: {method: 'GET', isArray: true},
                  show: {method: 'GET'},
                  save: {method: 'POST'},
                  update: {method: 'PUT'},
                  remove: {method: 'DELET'}
            });
      }
]);

```

Yeomenでangularの雛形を作り、$resourceの使い方を調べ、上記のようなjsを書きました。

かなり悩んだ結果動かなくなった理由は、`['ngResource']`を指定しているためでした。app.js内で既に宣言されているので、ここではいらないみたいです。

サンプルを調べると大体追加されているので、気づくのに時間がかかりました。

ついでにmoduleについて調べたんですが、
`TestService`という名前で他のmoduleも宣言していた場合、第2引数になにも指定しないと、先に宣言されたmoduleを取得しにいくらしいです。

第2引数に`[]`を指定すると、moduleの新規作成を行い、既にmoduleが存在する場合は、上書きするような挙動になるらしいです。

## 参考

[angular.moduleの落とし穴](http://qiita.com/kazunorisasaki/items/bc5bc8a797f1aec12283)
[angular.js–resourceを使う](http://www.bucyou.net/blog/1108)
JavaScriptテンプレートエンジンまとめ

# JavaScriptテンプレートエンジンまとめ

近頃、巷を騒がしているJavaScript製のテンプレートエンジンですが、開発工数の削減と保守性向上のために色々調査したのでメモ。
あくまで個人での調査なので参考程度にしかならないと思いますが、情報は随時付け足していきます。


## 目次
- [Handlebars.js](#handlebars)
- [Mustache.js](#mustache)
- [Underscore.js](#underscore)
- [JsRender](#jsrender)
- [Hogan.js](#hogan)

　
## <a name="handlebars">[Handlebars.js](http://handlebarsjs.com/)

![5158799771959296.png](https://qiita-image-store.s3.amazonaws.com/0/57442/3280b34d-0907-fa6d-ddc8-71043df87bea.png)

### 概要
- 「セマンティックテンプレート」を謳っている JavaScript テンプレートエンジン
- 拡張子はhbs

### メリット
- Gruntのプラグインのため学習コストが低い
- クライアントサイド、サーバサイド両方で利用でき、プリコンパイルも可能
- サーバーにSSI、PHP等を設定しなくても簡単なインクルードやデータを元にしたテンプレート処理が行える
- 独自関数を作って、テンプレート内に埋め込む事ができる。

### デメリット
- gulpプラグインもあるが、動作が不安定という情報もあり？
- ページ数が増えれば、コンパイルに時間がかかってしまう
- 自由度が高い分、ページが多い程分岐条件が多くなったりと複雑化しやすい。

　　
## <a name="mustache">[Mustache.js](https://mustache.github.io/)

![5027179408654336.png](https://qiita-image-store.s3.amazonaws.com/0/57442/54aebb26-cdbe-7a89-de34-7dec3c223120.png)

### 概要
- 様々な言語で開発されているテンプレートエンジン（JS以外にもRuby, Python, PHPなど）
- テンプレートタグに使用されている「{」が口ひげに似てるので、そこらへんが由来っぽい

### メリット
- 多言語で開発されているので、一度覚えれば楽かも。

### デメリット
- シンプルが故に機能が少ない＝恩恵も少ない？

　
## <a name="underscore">[Underscore.js](http://underscorejs.org/)

![5706608623484928.png](https://qiita-image-store.s3.amazonaws.com/0/57442/ab83606d-e845-0a8a-7e04-1be442f764b9.png)


### 概要
- 便利な独自メソッドを持つユーティリティライブラリ。
- Prototype.jsやRubyに見られる関数型のプログラミングをサポート。
- テンプレートAPIはテンプレートとオブジェクトのバインドを行い、その結果を出力。

### メリット
- 独自メソッドを使えるため、JSコーディングをする際に役立ちそう。
- Backbone.jsでも標準で使用されているため、今後に役立ちそう。
- テンプレート処理後にデータをキャッシュする事で処理を高速化できる。

### デメリット
- テンプレートタグが`<%= name %>`のような感じなので、コードの可読性が低くなりそう。

　
## <a name="jsrender">[JsRender](http://www.jsviews.com/#jsrender)

![5376913965056000.png](https://qiita-image-store.s3.amazonaws.com/0/57442/f6564993-cc49-477e-992b-9d4db4ad4918.png)

### 概要

- jQueryの公式プラグインのテンプレートエンジンjQueryTemplateの後継。
- jQueryTemplateは2011年4月に開発中止。
- JsRenderはテンプレートエンジンというだけでなく、JsViewsを動かすためにも必要。

### メリット
- JsViewsを用いてテンプレートとデータの関連付けを行う事で入力によりデータを容易に更新できる。
- JsObservableを用いてデータを更新する事で画面を更新できる。

### デメリット
- `<script type="text/x-jsrender">`内に
テンプレート用のHTMLを記述しなければいけないので、
コードの可読性が低くなりそう。

　
## <a name="hogan">[Hogan.js](http://twitter.github.io/hogan.js/)

![5217135594831872.png](https://qiita-image-store.s3.amazonaws.com/0/57442/b3f123e0-0b6e-723d-b609-1131bb0c5af3.png)

### 概要
- Twitter製のテンプレートエンジン
- テンプレート表記方法は独自のものではなく、オープンソースの「Mustache」の文法に沿っている。

### メリット
- jsファイルが2.5kと軽量
- 事前にコンパイルしておく事も可能
- ブラウザに読み込んで動的な処理も可能

### デメリット
- ifやelseやループが使えない。

　
## まとめ

### Googleトレンド
Googleトレンドによると最も注目されているのはUnderscore.jsのようです。（ 2015/01時点）

![5219613925179392.png](https://qiita-image-store.s3.amazonaws.com/0/57442/e3fe6700-23c6-fef7-4e12-574fcbb8a71a.png)


### 選定ポイント

個人的な意見として、テンプレートエンジンで開発を行う際には以下のポイントを見るとよさそう。（もちろんプロジェクトの規模にもよりますが）

- 容易にテンプレート化が行えるか（メンバー内でHTML側とJS側を分業できるか）
- 柔軟性に長けているか（実装方法に制限が少なく、機能拡張が行いやすいか）
- 学習コストが低いか（他者が実装に参加しやすいか）

[質問に答えるだけでテンプレートエンジンを選定してくれるサイト](http://garann.github.io/template-chooser/)もあるようです。