OmniAICreator/Qiita-1.07M huggingface dataset:
ghc-modでcabal-helper-wrapperが見つからない問題の対応

[maoeさんのこの方法](http://maoe.hatenadiary.jp/entry/2014/12/25/064900) がすごく気に入っていて `cabal` とか `ghc-mod` とかこの方法でばんばん放り込んでいたのだけど、ある日突然 Emacs でシンタックスチェックが効かなくなった。Emacsの `ghc-mode` は裏で `ghc-modi` コマンドを使っているのでこれを叩いてみれば原因を切り分けられる。

```
% ghc-modi
ghc-mod: Could not find $libexecdir/cabal-helper-wrapper

If you are a developer set the environment variable
`cabal_helper_libexecdir' to override $libexecdir[1]. The following will
work in the cabal-helper source tree:

    $ export cabal_helper_libexecdir=$PWD/dist/build/cabal-helper-wrapper

[1]: /private/tmp/cabal-install-1.22.4.0/.cabal-sandbox/libexec

If you don't know what I'm talking about something went wrong with your
installation. Please report this problem here:

    https://github.com/DanielG/cabal-helper/issues
```

`cabal-helper-wrapper` が見つからないのが原因っぽい。どうしてこうなるかは [cabal-helper](https://hackage.haskell.org/package/cabal-helper) の [cabalファイルを見る](https://github.com/DanielG/cabal-helper/blob/master/cabal-helper.cabal#L66) とわかる。

```
  X-Install-Target:    $libexecdir
```

先ほどのmaoeさんの方法でさらにlibexecも指定してやると良さげ。

```
% cabal get cabal-helper
% cd cabal-helper-0.3.4.0
% cabal sandbox init
% cabal install --bindir ~/.cabal/bin --datadir ~/.cabal/share --libexecdir ~/.cabal/libexec
```

`--libexecdir` に `~/.cabal/bin` を指定するのも考えたけど、理由があってこうしてるならやだなと思って避けておいた。ただし、このままだと `libexec` は sandbox 内を向いてしまうので、先ほど `ghc-modi` を実行した時のエラーメッセージを参考に以下を `.zshenv` に書いておいた。

```zsh
export cabal_helper_libexecdir=$HOME/.cabal/libexec
```
react-railsでReact.jsのAddonを使えるようにする

#react-railsでReact.jsのアドオンを使う
react-railsはデフォルトではReactのアドオンを使う設定にはなっていない。
アドオンを使えるようにするには各環境ごとの設定ファイル(development.rbとか)で設定を変えてやる必要がある。

```rb:config/environments/development.rbとか
Rails.application.configure do
  #railsでReactのアドオンを使用できるようにする
  config.react.addons = true # デフォルトではfalse

  #any other settings... 
end


```
最後にサーバーを再起動させたらReactのアドオンが使えるようになっている。
テスト環境とか本番環境でもアドオンを使いたかったら当然他の設定ファイルにも書き込む必要があるはず。


#余談
まずRailsでReactを使う方法がわからんのじゃ！って人は以下の2記事がすごーくわかりやすいのでそっちを見てください。

**react-railsを使ってReactのTutorialをやってみる**
http://qiita.com/joe-re/items/96f12dda4a62470d1d7c

**CoffeScript - RailsでReact.jsを始める**
http://qiita.com/mmyoji/items/ce7fef70c0c91aca793b
SpreadsheetServiceの認証方法をClientからOAuth2に切り替える

GoogleAPIのClientログインがサポート終了したため、これまでのソースで認証しようとすると下記のエラーが出てしまいます。

>Execution of authentication request returned unexpected result: 404

##これまでのソース
```csharp:program.cs
var service = new SpreadsheetsService("ApplicationName");
service.setUserCredentials("hoge@gmail.com", "password");

//対象のスプレッドシートを検索
var query = new SpreadsheetQuery();
query.Title = "spreadsheetName";

var feed = service.Query(query);
var spreadsheet = (SpreadsheetEntry)feed.Entries[0];

```

#OAuth2認証

具体的なソースは下記参照。
NuGetで「Google.Apis.Auth」を追加しておく必要があります。

下記ソース内に登場するClientId、ClientSecretはデベロッパーコンソールで取得します。
https://console.developers.google.com/project

具体的には、左メニューのAPIs&auth → Credentials → OAuth →Create new Client IDをクリックし、
Installed application、Otherを選択してOKをクリックすると作成されます。

このコンソールアプリを実行すると、ブラウザが立ち上がって認証を求められるので、認証することでAPIにアクセスできるようになります。

##直したソース

```csharp:program.cs

var clientId = "ClientId";
var clientSecret = "ClientSecret";

var userCredential = GoogleWebAuthorizationBroker.AuthorizeAsync(
	new ClientSecrets
	{
		ClientId = clientId,
		ClientSecret = clientSecret
	},
	new[] 
	{
		"https://spreadsheets.google.com/feeds" 
	},
	"hoge@gmail.com",
	CancellationToken.None,
	new FileDataStore("folderName")
	).Result;

var auth = new OAuth2Parameters
	{
		ClientId = clientId,
		ClientSecret = clientSecret,
		RedirectUri = "urn:ietf:wg:oauth:2.0:oob",
		Scope = "https://spreadsheets.google.com/feeds",
		AccessToken = userCredential.Token.AccessToken,
		RefreshToken = userCredential.Token.RefreshToken,
		TokenType = userCredential.Token.TokenType,
	};

var requestFactory = new GOAuth2RequestFactory(null, "ApplicationName", auth);
var service = new SpreadsheetsService("ApplicationName")
	{
		Credentials = new GDataCredentials(userCredential.Token.TokenType + " " + userCredential.Token.AccessToken),
		RequestFactory = requestFactory
	};
	
//更新対象のスプレッドシートを検索
var query = new SpreadsheetQuery();
query.Title = "spreadsheetName";

var feed = service.Query(query);
var spreadsheet = (SpreadsheetEntry)feed.Entries[0];

```
Processingで使用しているJFrameインスタンスにアクセス

ウィンドウの初期位置設定とウィンドウの位置取得の際に必要になったためメモ

<hr>
**補足**
この記事ではProcessing2を扱っている
Processing3では仕様が変わっている為，
ウィンドウの位置を変更する手順が異なる
<hr>

Processingで扱っているJFrameの変数名は ***frame*** なので
そこにアクセスしたらできた
ただしsetup()内でウィンドウ初期位置設定はできない(と思う)ので
サンプルコードのようにフラグを用意してあげる

```java:FrameTest.pde
//初期位置設定用フラグを宣言
boolean flag;

void setup(){
    //frameはJFrameか確認
    println(frame.getClass().getName());
    //フラグの初期値設定
    flag = false;
}
void draw(){
    //drawの最初だけ呼び出し
    if (!flag) {
        frame.setLocation(200, 200);
        flag = true;
    }

    //ウィンドウの位置を取得
    println("x location : " + frame.getLocation().x);
    println("y location : " + frame.getLocation().y);
}
```

参考URL
http://forum.processing.org/one/topic/how-to-set-the-initial-position-of-the-sketch-window.html
【Gem】kaminari で一つのページで複数のペイジング

**Controller**

```ruby
@topics = Topic.page(params[:topics_page]).per(5)
@activities = Activity.page(params[:activities_page]).per(10)
```

**View**

```ruby
= paginate @topics, param_name: 'topics_page'
= paginate @activities, param_name: 'activities_page'
```
CakePHP3 (CentOS7,Apache2.4,MariaDB10,PHP5.6)初期設定

## 前提としてVagrantでCentOS7を構築した後CakePHP3をインストール
Vagrantの構築とCentOS7のセットアップは以下のリンクをご参照ください

1部 : [vagrantの導入](http://qiita.com/yoshis2/items/5462fcef6b349f688ae9 "vagrantの導入")
2部 : [vagrant内のCentOS7セットアップ](http://qiita.com/yoshis2/items/2c8f450e61456e2df107 "vagrant内のCentOS7セットアップ")

※ 2部のセットアップでCakePHP3のインストール条件はすべて満たしている



## 上記2部での条件でCakePHP3をインストール
OS      : CentOS7
Apache  : 2.4
PHP     : 5.6.9
MariaDB : 10.0.19
CakePHP : 3.0

### 1. composer インストール
root権限に変更
> $ su

password:

### 2-1. CakePHP3プロジェクトのフォルダへ遷移
> $ cd /var/www/html


### 2-2. vagrantの場合
> $ cd /vagrant


### 3. プロジェクト作成
> $ composer self-update
> $ composer create-project --prefer-dist -s dev cakephp

### 4. CakePHP 3 フォルダ権限変更
> $ find tmp -type f -print | xargs chmod 777
> $ find tmp -type d -print | xargs chmod 777
> $ find logs -type f -print | xargs chmod 777
> $ find logs -type d -print | xargs chmod 777


### 5. APIをcomposerに追加
> $ composer require friendsofcake/bootstrap-ui:dev-master
> $ composer require google/google-api-php-client:master
> $ composer require google/apiclient
> $ composer dump-autoload


### 6. CakePHP3のマイナーバージョンアップ
> $ composer update


### 7. mariaDBの設定
cakephpでDBに接続するユーザーとスキーマの作成

ユーザー名 : cakephp3
パスワード : cakephp3
DB(スキーマ名) : cakephp3


### 8. 画面表示
以下のURLへアクセスする
http://192.168.33.10

アクセスした際にCakePHP3のホームページが表示されていれば成功です。
ln の引数の順番で迷わなくなった

# ln の引数ってどっちだっけ
正解は「第一引数がリンク元」「第二引数が作成するリンク」です．

````
ln -s [TARGET] [LINK_NAME]
````

# ln は引数１つだけで実行できる
ln に引数を１つだけ与えて実行すると，カレントディレクトリに指定したパスへのリンクを作成します．
たしかに，どのファイルへのリンクを作るかを指定しなければリンクは作れないので納得できます．

````
~/work% ls -l
合計 0

~/work% ln -s /bin/sh
~/work% ls -l
合計 0
lrwxrwxrwx 1 tn tn 7  6月  7 12:10 sh -> /bin/sh*
````

# lnコマンドを使うときの心の中
lnには少なくとも１つの引数が必要であることを知ってから，次のような順番で考えてコマンドを入力するようになったので引数の順番を間違わなくなりました．
「シンボリックリンクを作ろう」

````
$ ln -s
````
「最低限，どこへのリンクかを指定しないといけないから...」

````
$ ln -s /bin/sh
````
「ここまでで実行してもいいけれど，作成するリンクのパスを変えよう」

````
$ ln -s /bin/sh ~/bin
````
Cocos2d-jsでMMDモデル(ニコニ立体ちゃん)に踊ってもらう

Windows上でCocos2d-jsの3D機能を利用してMMDモデルを表示･VMDモーションで動かすところまでできたので、備忘録を兼ねてまとめておきます。
今回は勉強を兼ねてjs版を使用しましたが、Cocos2d-xでも同様の方法で再現できるかと思います

様々問題も残しているので、手順の中に誤りやもっといい方法がありましたらご一報ください

#ニコニ立体ちゃんをダウンロードする
http://3d.nicovideo.jp/works/td14712
今回は解凍したフォルダのMMD\\Alicia_solid.pmxとMMD Motion\\2分ループステップ1.vmdを使用します

#.pmxを.fbxに変換する
UnityとMMD4Mecanimでコンバートする
http://stereoarts.jp

* Unity上で表示できた段階で.fbxファイルと同名の.xmlが作成される(Windows版はDocument\\New Unity Project\\Assets内)
* この段階でモーション(.vmd)を設定する
* 頂点情報はデフォルトで8倍される(MMDの設定が小さいみたい)
* .fbxにした段階でテクスチャ情報が抜け落ちますが、同名の.xmlファイルに記載されています

#.fbxを.c3tに変換する
fbx-convをビルドしてできる実行ファイルで.c3tファイルに変換する
https://github.com/cocos2d-x/fbx-conv

* 実行ファイルと同じフォルダにAlicia_solid.fbxを格納する
* コマンドラインから該当フォルダに移動して"fbx-conv.exe -t -f Alicia_solid.fbx"で変換されます
* 別のモデルでは-fオプションを抜くと綺麗に表示されることがありました。モデルごとに作りがまちまちなのでしょうか？
* バイナリ形式の.c3bファイルも同じ手順で変換できますが、後述するテクスチャ情報の設定のため今回はテキスト形式で変換します

#.c3tにテクスチャの情報を書き加える
Unityで生成された.fbxファイルにはテクスチャの情報が欠けているため、.c3tファイルに変換してからテクスチャ情報を加える

* 適当なテキストエディタで開くとJSON形式になっているので"materials"の各要素を変更する
* Unityで生成した.xmlファイルから各マテリアルのidを元にテクスチャのファイル名を参照する
* 例:

```js:Alicia_solid.c3t
	"materials": [
		{
			"id": "0.hair", 
			"ambient": [ 1.000000,  1.000000,  1.000000], 
			"diffuse": [ 1.000000,  1.000000,  1.000000], 
			"emissive": [ 0.000000,  0.000000,  0.000000], 
			"opacity":  0.000000, 
			"specular": [ 0.000000,  0.000000,  0.000000], 
			"shininess":  3.200000,
			"textures": [
				{
					"id": "Alicia_hair.tga", 
					"filename": "Alicia_hair.tga", 
					"type": "DIFFUSE", 
					"wrapModeU": "REPEAT", 
					"wrapModeV": "REPEAT"
				}
			]
		}, 
		// 他のマテリアルが続く
	}
```
* typeやwrapModeについては、ひとまず表示する分にはすべて上記の設定で問題ないようです
* 手付けでもいいですが、時間がかかるので自動化してもよさそうです
* .fbxの段階から付けることもできると思いますが、fbx-convが対応しているかは検証していません

#いよいよ読み込み
フレームワークに含まれているjs-testsサンプルのSprite3DTestの描画方法そのままで表示できます
js-tests\\res\\Sprite3DTestにAlicia_solid.c3tを格納して、サンプルを変更するとこんな感じ

![alicia.jpg](https://qiita-image-store.s3.amazonaws.com/0/74630/27e9e8db-69c9-f934-336e-9767abe6b346.jpeg)

おでこのところが黒くなってしまっているのは、テクスチャの透過設定が原因のようです。
UnityやMMDでは同様の表示にならないので、回避する方法があるのかな?

該当のテクスチャ表示を消してそれっぽく背景をセッティングしたのがこちら

![alicia2.jpg](https://qiita-image-store.s3.amazonaws.com/0/74630/6408d05b-fcbb-8c98-0451-cc06982ed53c.jpeg)

#備考
* 現状モーフ表現が完全に抜け落ちています(Unityでは再現できてます)
* ひとつのモデルファイルが100Mとかいくので、PCでしか再生できません
* バイナリ形式の.c3bならファイル容量が減るのでこちらのほうが現実的かも
* MMDのフレーム設定は30FPS

#Cocos2d-jsあれこれ
* ブラウザで確認できるのがjs版の強みですが、ブラウザのキャッシュがjsファイルを掴んでしまうためしばらくはまりました
* 3D表示(Sprite3D)はブラウザで確認できません。Cocos2d-xの描画を代用しているようです
* ブラウザが使えない代わりに確認のときはCocos Code IDEの実行ツールを使用しました
* ブラウザで確認するときはFirefoxのDeveloper Editionがよさげ
* Android版にビルドする際マルチバイト文字が認識できないらしく、日本語でコメントを書くと実機で動きませんでした
Apache Ivy の自動ダウンロード

==========================


Apache Ivy を使用することで、依存ライブラリである *.jar ファイルを SCM にコミットしなくても良くなった。この流れで、ivy.jar も SCM にコミットせず、各開発者が手動ダウンロードしなくても良いようにしてみた。

需要がないだろうけど、以下にそれを晒す。

```build.properties
apache.mirror.site = http://ftp.riken.jp/net/apache
#apache.mirror.site = http://ftp.jaist.ac.jp/pub/apache
#apache.mirror.site = http://ftp.kddilabs.jp/infosystems/apache
#apache.mirror.site = http://ftp.yz.yamagata-u.ac.jp/pub/network/apache
#apache.mirror.site = http://ftp.tsukuba.wide.ad.jp/software/apache
#apache.mirror.site = http://ftp.meisei-u.ac.jp/mirror/apache/dist

# コミットしないように .gitignore や svn:ignore に追加する
target.dir = target

ivy.version = 2.4.0
ivy.dir     = ${target.dir}/vendor/ivy
ivy.lib.dir = ${ivy.dir}/${ivy.version}
ivy.url     = ${apache.mirror.site}/ant/ivy/${ivy.version}/apache-ivy-${ivy.version}-bin.zip
```

```build.xml
    <target name="-ivy" depends="-ivy.jar">
      <taskdef resource="org/apache/ivy/ant/antlib.xml"
               uri="antlib:org.apache.ivy.ant">
        <classpath>
          <fileset dir="${ivy.lib.dir}">
            <include name="*.jar" />
          </fileset>
        </classpath>
      </taskdef>
    </target>

    <target name="-ivy.jar"
            depends="-downloaded.ivy.jar"
            unless="downloaded.ivy.jar">
      <!-- 旧バージョンを削除し、指定したバージョンのivy.jarをダウンロードする -->
      <delete dir="${ivy.dir}" />
      <mkdir  dir="${ivy.lib.dir}" />

      <get src="${ivy.url}"
           dest="${target.dir}/ivy.zip" />
      <unzip src="${target.dir}/ivy.zip"
             dest="${ivy.lib.dir}">
        <patternset>
          <include name="*/*.jar" />
        </patternset>
        <mapper type="flatten" />
      </unzip>

      <delete file="${target.dir}/ivy.zip" />
    </target>

    <target name="-downloaded.ivy.jar">
      <!-- 指定したバージョンの ivy.jar をダウンロード済みか判定する -->
      <available property="downloaded.ivy.jar"
                 file="${ivy.lib.dir}/ivy-${ivy.version}.jar" />
    </target>
```

あとは次のように属性 `depends` 等でターゲット `-ivy` を実行すれば良いだけ。

```build.xml
    <target name="-main.classes"
            depends="-ivy">
        <mkdir dir="${main.classes.dir}" />
        <ivy:cachepath pathid="main.classpath" conf="runtime"/>
        <javac destdir="${main.classes.dir}" includeantruntime="false"
               encoding="UTF-8"
               debug="true" debuglevel="source,lines">
            <classpath refid="main.classpath" />
            <src path="${main.java.dir}" />
        </javac>
    </target>
```
Azure SQL データベース作成から、接続まで

# Azure SQL データベースとは？
* [一流の機能を手軽に利用できる、サービスとしてのリレーショナル データベース](http://azure.microsoft.com/ja-jp/services/sql-database/)

### Azureの「SQLデータベース」とSQL Serverは何が違う
* SQLデータベースは、クラウド用にカスタムしたSQL Server
* SQLデータベースは、サービスとして、Azureは、以下の機能を管理している
 * SQL Server用のOSとSQL Serverのインストール
 * 格納したデータは背後で3重化
 * 自動フェイルオーバー
* SQLデータベースは、PaaS見ないマネージドサービスである

### 参照：
* http://azure.microsoft.com/ja-jp/services/sql-database/
* [Azureの「SQLデータベース」とSQL Serverは何が違う？](http://www.atmarkit.co.jp/ait/articles/1406/30/news066.html)
* [SQL Serverとは](http://qiita.com/KENJU/items/cde7f5b4f4cfacf749ed)

# Azure SQL データベースを作成
### メニューからSQLデータベースを選択する
![メニューからSQLデータベースを選択する.png](https://qiita-image-store.s3.amazonaws.com/0/13451/7a481060-94e3-802a-40c5-2159d6c444cc.png)


### データベースの設定の指定
![生成するデータベースの情報を入力.png](https://qiita-image-store.s3.amazonaws.com/0/13451/655e72c5-4e45-029a-6e8e-bb2704a6dd28.png)

* 名前
    * 任意の文字列を入力する
* サブスクリプション
    * そのまま
* サービス プラン
    * 料金と関係があるので、まずは、BASICで行く
    * [サービス　プランの説明（英語）](https://msdn.microsoft.com/en-us/library/azure/dn741340.aspx)
* パフォーマンス レベル
    * そのままで行く
    * [パフォーマンス レベルについての説明(日本語)](https://msdn.microsoft.com/library/dn741336.aspx)
* 最大サイズ
    * ２GBのままで行く
    * 説明：　このプロパティは、選択したサービス レベルで許可される最大データベース サイズに設定される
* 照合順序
    * そのままで行く
    * [SQL Server 2008 R2の照合順序の使用](https://technet.microsoft.com/ja-jp/library/ms187582(v=sql.105).aspx)を参照できる
* サーバー
    * 「新しいSQLデータベースサーバー」を選ぶと、ダイアログにメニューが増える
* 「→」ボタンをクリックする

### SQL データベース サーバーの設定
![SQL データベース サーバーの設定.png](https://qiita-image-store.s3.amazonaws.com/0/13451/6a33a9b7-7657-d4ce-b17f-1e75014cf463.png)

* ログイン名
    * ログイン名はサーバーへの認証に使用されたSQLログイン
* ログインパスワードと確認
* 地域
    * 日本（東）/ 日本（西）を選べる方がいい
* MICROSOFT AZURE サービスにサーバーへのアクセスを許可する
    * 説明：このオプションは、すべての Microsoft Azure サービスがこのサーバー上の SQL データベースに接続できるようにする
* 最新の SQL DATABASE 更新 (V12) の有効化
    * 説明：SQL Database 更新 (V12) は、拡張 T-SQL の互換性、API バージョン 12、プレミアム パフォーマンスの強化を特長としている
* OKボタンをクリックして、SQLデータベースが生成される

### 作成中
![作成中.png](https://qiita-image-store.s3.amazonaws.com/0/13451/03550f57-b3a1-4866-5239-d8c6c3ab7a06.png)

# Azure SQL データベースへ接続
* firewall設定
    * DB -> 使っているDBを選べる -> ダッシュボート ->　概要の使用できるIPアドレスの管理
    * 現在のクライアントIPアドレスを追加する
![スクリーンショット 2015-06-07 10.33.28.png](https://qiita-image-store.s3.amazonaws.com/0/13451/be65d10d-16f6-e3dc-9d13-53bea9711df5.png)

* sqlcmdインストール（IE）
    * [ダウンロード](https://www.microsoft.com/en-us/download/details.aspx?id=36433)
    * [使い方](https://msdn.microsoft.com/ja-jp/library/azure/ee336280.aspx)
* windows のコマンドプロンプトを開けて、以下のコマンドを入力する
![sqlcmd.png](https://qiita-image-store.s3.amazonaws.com/0/13451/0036e691-d833-1790-7062-698add5cdff0.png)
[Angular.js] input要素のng-keyupで日本語変換候補決定のためのEnterキーをキャッチしない

[JSFiddle](https://jsfiddle.net/kjrsLjrs/4/)

input要素入力中にEnterキー押下でメソッドを呼びたいときは"ng-keyup"を使う。

ただし単純にEnterキーかどうかの判定だけだと日本語入力の変換候補決定のためのEnterキーもキャッチされてしまう。→JSFiddle上側のinput

`<input id="myInput" ng-keyup="pushEnter($event)" type="text"/>`

```すべてのEnterをキャッチ
$scope.pushEnter = function(e){
    if(e.keyCode === 13){
        //mylogic
    }
}
```

なので変換終了でフラグを立てて、そのときのEnterだったらワンクッション置くようにしておく。
→JSFiddle下側のinput

```
    // 変換終了イベントをフラグに保存
    var compositionJustEnd = false;
    var myInput = document.querySelector('#myInput');
    myInput.addEventListener('compositionend', function(){
        compositionJustEnd = true;
    });
        
    $scope.pushEnter = function(e){
        // 変換候補を決定するためのEnterだったら無視
        if(e.keyCode === 13 && !compositionJustEnd){
            // mylogic
        } else {
　　　　　　　// 次のEnterでmylogicが走る
            compositionJustEnd = false;
        }
    }
```
Wikipedia のアカウントを持とう！

常識かもしれないけど、ついこの前気づきました。
**Wikipediaはアカウントを取得、ログインして使う** といろいろ便利かも。以下とりあえず気に入ったものです。

#### \:smile: クライアント側 MathJax　（個人設定/表示/数式）

表示は遅くなるけど、数式が Tex でコピペできるようになる。
（もっと簡単に切り替えられれば便利なんだけど）

#### \:smile: ホバーカード　（個人設定/ベータ版機能）

ページへのリンクにマウスを hover すると、ページ内容の要約が表示される。

#### \:smile: 言語リンクを短縮　（個人設定/ベータ版機能）

左下の「言語」選択欄にいっぱい表示される言語を、よく使うものだけにしてくれる（**激減する！**）。
わたしなんか、日本語と英語と大阪弁しかいらないので（もちろん分からへんから）、これはとっても有難い！
Docker の基本学習 ~ コンテナ間のリンク


コンテナ間のリンク機能を調べてみた。ざっと見た感じ、同一ホスト上の他のコンテナのネットワーク情報(IPアドレスなど)が取得できるというもの。大した機能でない気がしたが、コンテナのIPアドレスは固定でないため、コンテナ間でネットワーク通信するためにはに必要な機能と思われる。ただ、リンクは同一ホスト上のコンテナ間でしか機能しないので、将来は複数ホストにまたがった方法が出てくるのかも。

(更新： 2015/11/08)
Docker 1.9 では、複数ホストにまたがる仮想ネットワーク機能が正式版としてリリースされました。
[Docker : マルチホスト間での仮想ネットワーク](http://qiita.com/Arturias/items/dd7f9e2365626dd4ad51)

# コンテナ間の通信
通常、コンテナ間でネットワーク通信をするには、ホスト側にマッピングしたポートを経由して接続をする。

例えば以下のような構成で、

![Network1.jpg](https://qiita-image-store.s3.amazonaws.com/0/79316/d4afbf88-3ca2-9a1e-881c-25612c9809d5.jpeg)

図中の Container 1 が

    docker run -d -p 12345:80 <イメージ名>
 
のように起動されていた場合、Container 2 と 3 からは

    http://10.0.0.10:12345
    
で Container 1 上の httpdにアクセスできる。

同一ホスト上の Container 2 からであれば、Container 1内に割り当てられた IPと Listenしているポートを使って

    http://172.17.0.3:80

で直接アクセスできる。

なので、同一ホスト上のコンテナ間で通信したいだけであれば、コンテナ起動時に -p を使ってポートをホスト側へマッピングする必要は無い。

# リンクとは？

同一ホスト上のコンテナ間で通信する際に、接続したい相手のネットワーク情報(IPアドレスなど）を取得する仕組み。次の２つの形で情報を取得できる。
・環境変数
・/etc/hosts ファイル

## その１
まずは、簡単のために、接続先のコンテナを -p をつけて起動してみる
(ここで起動するコンテナは、ずっと ping を送るだけで、実際にポート80や22222をListenしているわけではない)。

    docker run -d -p 80:80 -p 11111:22222 --name Container1 centos ping localhost

次に、接続元のコンテナを --link オプションを使って起動する。--link は、<接続先コンテナ名：エイリアス名>という形式で指定する。

    docker run -it --name Container2 --link Container1:c1 centos /bin/bash

接続元コンテナ内から環境変数を表示すると、エイリアス名のついた環境変数が作られて、接続先の情報が入っていることが分かる。

````
[root@6e141d314d6e /]# env | grep C1 | sort
C1_NAME=/Container2/c1
C1_PORT=tcp://172.17.0.28:80
C1_PORT_22222_TCP=tcp://172.17.0.28:22222
C1_PORT_22222_TCP_ADDR=172.17.0.28
C1_PORT_22222_TCP_PORT=22222
C1_PORT_22222_TCP_PROTO=tcp
C1_PORT_80_TCP=tcp://172.17.0.28:80
C1_PORT_80_TCP_ADDR=172.17.0.28
C1_PORT_80_TCP_PORT=80
C1_PORT_80_TCP_PROTO=tcp
````

また、/etc/hosts に接続先のエントリが追加される。

```
[root@14607f30b721 /]# cat /etc/hosts
(中略・・・)
172.17.0.28     c1 ab33c4d9897b Container1

```

## その２
その１では、コンテナ内のポートをホスト側へマッピングしたが、今度はマッピングしないで試してみる。

まずは、接続先イメージ用のDockerfileを作成する。EXPOSE でポート 80 を指定する。

```
FROM centos:6.6
RUN yum install httpd -y
ENTRYPOINT /usr/sbin/apachectl -DFOREGROUND
EXPOSE 80
```

ビルドする。

    docker build -t arturias/test .

接続先コンテナを起動。今度は -p や -P は指定しない。

    docker run -d --name Container1 arturias/test

接続元コンテナを起動。

    docker run -it --name Container2 --link Container1:c1 centos /bin/bash

環境変数を表示すると接続先の情報が見える。

```
[root@202f8d6ba925 /]# env | grep C1
C1_NAME=/trusting_mclean/c1
C1_PORT=tcp://172.17.0.26:80
C1_PORT_80_TCP=tcp://172.17.0.26:80
C1_PORT_80_TCP_ADDR=172.17.0.26
C1_PORT_80_TCP_PORT=80
C1_PORT_80_TCP_PROTO=tcp
```

接続元コンテナから httpdにアクセスしてみる(c1 は /etc/hosts に追加されたエントリ)。

    curl c1

なお、ホスト側にポートをマッピングしていないので、別ホスト上のコンテナからはhttpdにアクセスできない。

## その3
接続元から取得できるのはネットワーク情報だけでなく、接続先で定義された環境変数も取得できる。

例えば、接続先コンテナを以下のように起動。-e オプションで環境変数を２つ指定している。

    docker run -d --name Container1 -e PARAM1=100 -e PARAM2=200 centos ping localhost

接続元コンテナを起動して、環境変数を表示(今回は、env コマンドを実行してすぐに終了するようにしてみた）。

```
[ec2-user@ip-10-0-0-73 ~]$ docker run --rm --link Container1:c1 centos env
(中略・・・）
C1_ENV_PARAM1=100
C1_ENV_PARAM2=200
```
全シェイプをコレクションに格納する

## やりたいこと
PowerPointでVBAを作っていると、全シェイプに対して何らかの処理を適用したいことがよくあります。
このとき、毎回下記のようなコードを書くので、コードが長くなりがちです。特に、各シェイプに対する処理にif文などが入ると、階層も深くなりコードが見にくくなります。
これをもっと見やすく書く方法を考えます。

```vbnet:Module1.bas
Public Sub sample1()
    Dim sld As Slide
    Dim sh As Shape

    '処理ごとにこれを書く
    For Each sld In ActivePresentation.Slides
        For Each sh In sld.Shapes
            '各シェイプに対する処理
            Debug.Print sh.Name
        Next
    Next

End Sub
```

## コレクションオブジェクトを利用する
プレゼンテーション内の全シェイプを、一度コレクションに格納します。
そうすれば、全シェイプに対する処理を簡単に書けます。

```vbnet:Module2.bas
Public Sub test()
    Dim sld As Slide
    Dim sh As Shape
    Dim shCol As Collection
    
    'スライド内の全シェイプをコレクションに格納
    Set shCol = New Collection
    
    For Each sld In ActivePresentation.Slides
        For Each sh In sld.Shapes
            shCol.Add sh
        Next
    Next

    '以後は、処理ごとにこれを書く
    Call testMethod1(shCol)
    
End Sub

Private Sub testMethod1(ByRef col As Collection)
    Dim sh As Shape
    
    For Each sh In col
        '全シェイプに対する処理を書く
        Debug.Print sh.Name
    Next
End Sub
```

全シェイプに対して、複数の処理を行うときは、コレクションを利用するのがよいと思われます。
Zsh で docker-compose や boot2doker などのコマンド補完をできるようにする


## 目的

docker-compose や boot2doker でコマンド入力が面倒なので補完できないか探してたら zsh-completions を発見。
しかし README に書いてある oh-my-zsh の設定を試したらそのままでは動かなかったのでなんとかする。

- https://github.com/zsh-users/zsh-completions#oh-my-zsh

## zsh-completions　インストール

zsh と oh-my-zsh はインストール済みの前提で

```
git clone https://github.com/zsh-users/zsh-completions ~/.oh-my-zsh/custom/plugins/zsh-completions
```

## .zshrc に追記

fpath を追記したら動いた

```
dir=~/.oh-my-zsh/custom/plugins/zsh-completions/src
if [ -e $dir ]; then
    fpath=($dir $fpath)
    plugins+=(zsh-completions)
    autoload -U compinit && compinit
fi

```

shell を再起動


## 確認

補完してみる

```
$ docker-compose # ここでタブキー押す
build    -- Build or rebuild services
help     -- Get help on a command
kill     -- Kill containers
logs     -- View output from containers
port     -- Print the public port for a port binding
ps       -- List containers
pull     -- Pulls service images
restart  -- Restart services
rm       -- Remove stopped containers
run      -- Run a one-off command
scale    -- Set number of containers for a service
start    -- Start services
stop     -- Stop services
up       -- Create and start containers
```

## zsh-completions で補完できるコマンド一覧

zsh-completions/src ディレクトリ見るとわかる。

- https://github.com/zsh-users/zsh-completions/tree/master/src

```
_ack
_adb
_ag
_android
_artisan
_atach
_boot2docker
_bower
_bpython
_brew
_bundle
_cabal
_cap
_cask
_celery
_choc
_cmake
_coffee
_composer
_console
_cpanm
_debuild
_dget
_dhcpcd
_ditz
_docker
_docker-compose
_docker-machine
_docpad
_drush
_dzen2
_emulator
_exportfs
_fab
_gas
_geany
_gem
_ghc
_gist
_git-flow
_git-pulls
_git-wtf
_github
_glances
_google
_gradle
_heroku
_hledger
_httpie
_id3
_id3v2
_iw
_jekyll
_jmeter
_jmeter-plugins
_jonas
_jq
_kitchen
_knife
_language_codes
_lein
_logger
_lunar
_lunchy
_manage.py
_middleman
_mina
_mosh
_mussh
_mvn
_nl
_node
_nvm
_optirun
_pactree
_pear
_perf
_periscope
_pgsql_utils
_phing
_pkcon
_play
_port
_primus
_ps
_pygmentize
_rails
_ralio
_redis-cli
_rfkill
_rspec
_rubocop
_rvm
_sbt
_scala
_sdd
_setup.py
_showoff
_shutdown
_smartmontools
_socat
_srm
_ssh-copy-id
_subliminal
_svm
_symfony
_teamocil
_thor
_tmuxinator
_vagrant
_veewee
_virsh
_virtualbox
_vnstat
_vpnc
_watch
_wemux
_xinput
_yaourt
_zfs
```


## 参考

- https://github.com/zsh-users/zsh-completions
【AWS】CloudWatchでの監視項目まとめ



どうも、iron千葉(((( ;°Д°))))です。　


AWSでは、手っ取り早く監視ができるCloudWatchというマネージドサービスがあります。
オンプレの場合、可用性・ディスク容量等を考慮して監視サーバを導入する必要がります。
これに比べ、AWSで監視を行う場合、例えばEC2を作ったらメトリックス（CPU使用率など）が自動で取得されます。
AWSで監視を行うには、

* SNSのトピックを作る
* CloudWatchより、メトリックスを選択し閾値を設定する

のみで、とてもスマートに監視を開始できます。そして、閾値を超えた場合メールが飛んできます
オンプレでの苦労はなんだったのか！

ただし、制限事項もあります。
CloudWatchのデータは２週間保存。それ以前のデータは破棄されるのでご注意ください。それ以前のデータが欲しい場合は、[こちら](https://docs.aws.amazon.com/ja_jp/AmazonCloudWatch/latest/DeveloperGuide/US_SingleMetricPerInstance.html)を参照して取得する必要があります。
また、デフォルトで取得できる項目が決まっており、それ以上の情報が欲しい場合は、自分でスクリプトを書いてデータをCloudWatchに飛ばす必要があります。
これをカスタムメトリックスと言います。

本日は、CloudWatchにてデフォルトで取得されるもの、カスタムメトリックスが必要な項目についてまとめます。
対象はEC2,RDS,ELB等、よく使うであろうサービスに絞ってまとめます。

# EC2

## 取得可能な項目
* CPU使用率
* CPUクレジット消費数・残数（t2系のインスタンスのバーストできるクレジット）
* ディスクのread・writeのI/O数、バイト数
* ネットワークのイン・アウトの使用バイト数
* システムチェック（AWSホスト側のネットワーク、ハード等の状態と、EC2インスタンスステータスチェック状態）
* ログ監視

## カスタムメトリックスが必要な項目
* ディスク使用率
* メモリ使用率
* swap使用率
* ping監視
* プロセス監視
* ポート監視
* web監視

# EBS

## 取得可能な項目
* ディスクのread・writeのI/O数、バイト数
* read・writeにかかった秒数の合計（例：５分間に1秒のリクエストを700こなした場合、値は700となる）
* read・writeをしなかった秒数（idle）
* read・writeのキューの数（負荷などで、書き込み・読み込み待ちになったキュー数）
* IOPS時の、上限に対する利用パーセンテージ
* 消費されたIOPS数
※EC2で取得できる項目とかぶる箇所がある

## カスタムメトリックスが必要な項目
* ディスクの使用率はEC2側でカスタムメトリックスで取得が必要

# ELB

## 取得可能な項目
* バックエンドの正常・異常なホスト数（ヘルスチェック成功？失敗？）
* バックエンドへのリクエスト数
* バックエンドへのリクエストのレイテンシ
* ELBが返した、4XX、5XXのエラーコード数
* バックエンドが返した、2XX、3XX、4XX、5XX
* バックエンドとの接続失敗した数
* バックエンドへの保留中のリクエスト、キューが一杯のため拒否したリクエスト

## 取得できないもの
* ELBを通過したネットワークの容量
* ELBのCPU
* ELBのメモリ
→そもそもELBは、自動でスケールするため不要な項目


# RDS

## 取得可能な項目
* リードレプリカ利用時の、マスター側で専有しているバイナリログの容量（バイト）
* CPU使用率
* CPUクレジット消費数・残数（t2系のインスタンスのバーストできるクレジット）
* データベースへの接続数
* read・writeのキューの数（負荷などで、書き込み・読み込み待ちになったキュー数）
* 利用可能なメモリ容量（EC2では取得できないがRDSでは取得可能）
* 利用可能なストレージ容量（EC2では取得できないがRDSでは取得可能）
* MySQL、マルチAZ利用時のレプリケーションラグの秒数
* RDSのswap総容量
* 秒間あたりの書き込み操作数、読み込み操作数
* １回の書き込みにかかる平均秒数、１回の読み込みにかかる平均秒数
* １回の書き込みにかかる平均バイト数、１回の読み込みにかかる平均バイト数
* 受信時のネットワークトラフィック（バイト/秒）、送信時のネットワークトラフィック（バイト/秒）

## カスタムメトリックスが必要な項目
* マネージドサービスなのでカスタムメトリックスを利用できない
* ただし、ログはマネジメントコンソールから確認できる（ログ監視は工夫が必要）
* RDS障害時はCloudWatchでの監視以外に[イベント](http://docs.aws.amazon.com/ja_jp/AmazonRDS/latest/UserGuide/USER_Events.html#USER_Events.Messages)通知を利用しての監視が可能。様々なイベントの通知を受信できます。

# S3
* メトリクスなし
* アクセスログは有効にすることで取得できるので、アクセスに関しては自前でログを解析する必要あり



本日は以上です。
DevOps


# Tools

* バージョン管理
	* GitHub
	* Bitbucket
* 開発環境
	* Vagrant
* CI
	* Jenkins
	* Bamboo
* AMI
	* Packer
* プロビジョニング
	* Chef
	* Ansible, Fabric
* デプロイツール
	* Capistrano
	* Fabric
* テストツール
	* スモークテスト、E2Eテスト
	  * Casper
	  * Selenium
	* Unit Test
	  * nose
	  * py.test
	  * coverage
	  * mock
	* サーバ
	  * Serverspec
	* JS
	 * Jasmin
	 * Karma
	 * BrowserStack
* インスペクションツール
	* コーディングスタイル
	* 重複コード
	* 複雑度
	* カバレッジ
* ドキュメント生成
MacのVirtual　Box事始め　その1（OS間のクリップボードのコピー＆ペースト）


# MacとWinの両刀使いなワタクシ

私はiMacG3からのMac使い。けど以前勤めていた会社では社内システムがIE標準だったのでWindowsが必要だったのでBootCampでMac&Winを起動し直していた。
今はその会社も辞めてWindowsはほとんど使わなくなった。HPを作った時にIEでちゃんと出るの？を確認する程度なのでVirtualBoxでゲストOSで起動する程度。

# むう、コピー＆ペーストができん...

そんなときにURLをMacからコピーしたい。貼り付けられん。VMWareではできたぞ、VirtualBoxなぜできん？と思ったら、GuestAdditionsなるソフトが必要な模様と。

# その威力たるや

http://pc-karuma.net/virtualbox-install-guest-additions/

を見たところ、

+ ホストーゲストのOS間でコピー＆ペーストできる
+ 画面解像度がフルスクリーン、HD化される。（インストールしないと解像度低く、はみ出てた）
+ ホストOSのグラフィックカードを使うので描画が高速に。
+ ホストとの時刻の同期
+ オートログオン

 と、いいことずくめ。これははかどりそうだ。もう入れるの一択だ。

# ふむふむ、すぐインストールっす

ゲストOS（Win7）にインストールすると。

+ 本当にコピー＆ペーストできる。
+ 本当に画面が高速になる。
+ 本当にフルスクリーン、HD化された。
+ けど、Aeroはできなかった。

VirtualBoxの本気を体感できましたとさ。

# フルサイズにならなくなったら

使っているとうっかりWindowsでCmd+Cを押してしまいフルサイズを解除してしまうと1024x768の解像度になってしまった。
こういう時は、まずCmd+Fでフルサイズに戻してから、「ビュー」ー「ゲストOSの画面を自動リサイズ」すると戻ります。
Go言語@Windowsでmrubyを静的リンクする。Go 1.5

Go1.5がリリースされたので、mrubyの静的リンクを確認しましたので
語尾の修正やバージョンの書き換えなどです。

# [前回](http://qiita.com/nocd5/items/4a1ebe5dfccedd3d6e2b)までのあらすじ
**libmruby.a**のリンク方法が「なんで？」って感じのコンパイルオプションの指定だったり(`--Lmruby/lib -Wl,-lmruby`)、エラーを握りつぶしたりして何とかリンクしたnocd5であったが…

# Go 1.5で解決されるた~~かも~~！

|       |            |       |
|-------|------------|-------|
| Go    | 1.5        | 32bit |
| mruby | 71f2975    | 32bit |
| gcc   | 4.9.2(TDM) | 32bit |
| OS    | Windows8.1 | 64bit |
※ Goのリポジトリ最新でもちゃんとリンクできること確認しました
(たんに`git checkout go1.5`しわすれただけ)

上記の組み合わせで、以下の**普通**のソースコードがビルドできました！

```go:mruby_static_link/main.go

package main

// #cgo CFLAGS: -II:/FreeSpace/C/mruby/include
// #cgo LDFLAGS: -LI:/FreeSpace/C/mruby/build/host/lib -lmruby
// #include <windows.h>
// #include <mruby.h>
// #include <mruby/compile.h>
import "C"
import "unsafe"

func main() {
    mrb := C.mrb_open()
    defer C.mrb_close(mrb)
    cxt := C.mrbc_context_new(mrb)
    defer C.mrbc_context_free(mrb, cxt)

    mrb_code0 := C.CString("puts 'Hello World ' + 'From mruby.'; m = 3")
    defer C.free(unsafe.Pointer(mrb_code0))
    mrb_code1 := C.CString("puts 'hypot(m, m+1) = ' + Math.hypot(m,m+1).to_s")
    defer C.free(unsafe.Pointer(mrb_code1))

    C.mrb_load_string_cxt(mrb, mrb_code0, cxt)
    C.mrb_load_string_cxt(mrb, mrb_code1, cxt)
}
```

これはGo1.5では「Golangのcgoはwindowsでstatic-linkが上手く扱えないらしい」という問題が解決されました~~るかも~~！
【JS ・ CSS】class切り替え

#はじめに
結局使うことなくなったけど、今後使う可能性もあるのでclass切り替えについてメモ。
「[Bootstrap](http://getbootstrap.com)」の「Glyphicons」を利用しています。

#ソースコード

```html:サンプル
<a onclick="changeGlyphicon()"><span class="glyphicon glyphicon-chevron-down" aria-hidden="true" id="class_glyphicon_name"></span> さらに詳しく見る</a>

<script type="text/javascript">
  var clickNumber = 0;
  function changeGlyphicon(){
    clickNumber++;
    if((clickNumber%2)==0){	       
      document.getElementById("class_glyphicon_name").className="glyphicon glyphicon-chevron-down";
    }else{
      document.getElementById("class_glyphicon_name").className="glyphicon glyphicon-chevron-up";
    }
  }
</script>
```

#説明

今回変更したいのは`a`タグ内の`class="glyphicon glyphicon-chevron-down"`です。
なので、`a`タグ内にidを指定してあげます。(今回は`id="class_glyphicon_name"`と指定してます。)

で、本題のJSでは、`a`タグをクリックすると`onclick`で指定した`changeGlyphicon()`関数が実行されます。
中身としては、用意した初期値0のclickNumber変数をクリックされるごとに1加えていき、２で割ったとき割り切れるか、つまり余りが０か否かで判断しています。

そして、クラス名を変更するのがこちら↓

```js:
document.getElementById("指定したいid名").className="切り替えたいclass名";
```

上記のサンプルで言えば

```js:
document.getElementById("class_glyphicon_name").className="glyphicon glyphicon-chevron-up";

```

の部分です。はい、以上(*´σｰ｀)
ac-slimeでfuzzy補完の候補を出力する方法

ac-slimeでFuzzy補完の結果を選択候補に出力できると知ったので備忘録がてら記載します。

**1.設定内容**
emacsのinit.elに対して

```el:init.el
(slime-setup '(slime-repl slime-fancy slime-banner slime-fuzzy slime-highlight-edits))
(require 'ac-slime)
(add-hook 'slime-mode-hook (lambda () (set-up-slime-ac t)))
(add-hook 'slime-repl-mode-hook (lambda () (set-up-slime-ac t)))
```
のように記載します。

**2.スクリーンショット**

![スクリーンショット 2015-06-07 0.27.28.png](https://qiita-image-store.s3.amazonaws.com/0/54207/57930b5a-a297-6110-db3b-596805eabd8e.png)

pananaだけで「pathname-name」が補完候補に出ました。
React Nativeでサンプルアプリ作成


## 準備

### インストール＆プロジェクト作成

```bash
brew install node
npm install -g react-native-cli
react-native init SampleApp
cd SampleApp
open SampleApp.xcodeproj
```

### サンプルコード
```javascript:index.ios.js
/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 */
'use strict';

var React = require('react-native');
var {
  AppRegistry,
  Image,
  ListView,
  StyleSheet,
  Text,
  View,
} = React;

/**
 * For quota reasons we replaced the Rotten Tomatoes' API with a sample data of
 * their very own API that lives in React Native's Github repo.
 */
var REQUEST_URL = 'https://raw.githubusercontent.com/facebook/react-native/master/docs/MoviesExample.json';

var MOCKED_MOVIES_DATA = [
  {title: 'Title', year: '2015', posters: {thumbnail: 'http://i.imgur.com/UePbdph.jpg'}},
];

var SampleApp = React.createClass({
  render: function() {
    if (!this.state.loaded) {
      return this.renderLoadingView();
    }

    return (
      <ListView
        dataSource={this.state.dataSource}
        renderRow={this.renderMovie}
        style={styles.listView}
      />
    );
  },
  renderLoadingView: function() {
    return (
      <View style={styles.container}>
        <Text>
          Loading movies...
        </Text>
      </View>
    );
  },
  renderMovie: function(movie) {
    return (
      <View style={styles.container}>
        <Image
          source={{uri: movie.posters.thumbnail}}
          style={styles.thumbnail}
        />
        <View style={styles.rightContainer}>
          <Text style={styles.title}>{movie.title}</Text>
          <Text style={styles.year}>{movie.year}</Text>
        </View>
      </View>
    );
  },
  getInitialState: function() {
    return {
      dataSource: new ListView.DataSource({
        rowHasChanged: (row1, row2) => row1 !== row2,
      }),
      loaded: false,

      // movies: null,
    };
  },
  componentDidMount: function() {
    this.fetchData();
  },
  fetchData: function() {
    fetch(REQUEST_URL)
      .then((response) => response.json())
      .then((responseData) => {
        this.setState({
          dataSource: this.state.dataSource.cloneWithRows(responseData.movies),
          loaded: true,

          // movies: responseData.movies,
        });
      })
      .done();
  },
});

var styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'row',
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  rightContainer: {
    flex: 1,
  },
  thumbnail: {
    width: 53,
    height: 81,
  },
  title: {
    fontSize: 20,
    marginBottom: 8,
    textAlign: 'center',
  },
  year: {
    textAlign: 'center',
  },
  listView: {
    paddingTop: 20,
    backgroundColor: '#F5FCFF',
  },
});

AppRegistry.registerComponent('SampleApp', () => SampleApp);
```

### 起動
Xcode上でcmd+R
Hogan.jsの使い方サンプル


##準備
```
<script type="text/javascript" src="/js/hogan-3.0.1.js"></script>
```

##テンプレート
```
<script type="text/template" id="template">
{{#Items}}
  <span>{{item}}</span>
{{/Items}}
</script>
```


##処理

ページ読み込み時に初期表示を行っています。

```javascript
  $(function() {
    Sample.template = Hogan.compile($("#template").html());
    Sample.update();
    });
  })
```

データ取得・表示用のオブジェクト。

```javascript
Sample = {
  items: [],      // 表示するデータ
  template: null, // テンプレート格納用
  viewCount: 10,  // 1ページ表示数
  update: function () {
    $.ajax({
      type: "POST",
      url: "sample.php",
      data: { key: "value" }
    }).done(function( res ) {
      Sample.items = res;
      Sample.page(1);
    });
  },
  page: function(num) {
    var showItems = [];
    for (var i = (num - 1) * Sample.viewCount; i < num * Sample.viewCount; i++) {
      if (Sample.items[i]) {
        showItems.push(Sample.items[i]);
      };
    };
    $("#view").html(Sample.template.render({Items:showItems}));
  }
}
```

ページングは`Sample.page(ページ数);`で行います。

##Hogan.js仕様
↓の場合hogeの内容により動作が変わる。

```
{{#hoge}}
処理
{{/hoge}}
```

- bool値の場合：if文として機能
- 配列の場合：foreachとして機能

↓の場合、true/falseが反転する。!みたいなもの。

```
{{^xxx}}
処理
{{/xxx}}
```

↓hoge内のfugaを出力するが、かっこ３つ{{{}}}はテキストがそのまま出力される。
かっこ２つ{{}}の場合はHTMLエンコードされる。

```
{{#hoge}}
{{{fuga}}}
{{/hoge}}
```





（参考）
http://wata.hateblo.jp/entry/2012/06/12/003151
PHPカンファレンス関西2015

# 継続的インテグレーションとChatOpsでシステム開発・運用を効率化

## 得られるメリット

いつでも誰でも簡単な手順で実行できる
問題を素早く発見できる
早く見つけて素早く直す
プロジェクトの状況を可視化
チーム内のコミュニケーションの円滑化

## CI+ChatOpsの事例

Slack — chat
Jenkins —ci
HU-BOT
Capistrano — deploy
Pivotal Tracker or Trello — story management
Ansible — provisioning
Github — vcs
crashlytics — crash report
Vagrant — dev
Ubuntu

# エンジニア1人の状態から複数人同時開発を実現するまでにやったこと

https://www.youtube.com/watch?v=sksGA4ZgKlU

新しいことをやるときの問題あるある。解決策としては「ステークホルダーと合意する」「独断で決めない」「ヒアリングする」「調査・学習してから説明」「導入して終わりじゃなくて、カスタマイズしながらよくしていきましょう」みたいなことを言われていた。

非エンジニアには「githubの教科書」をくばった。まず教えたのはgit add commit push pull、ブランチ作成。ブランチ戦略はgithub-flow。クライアントツールはSourceTree。

スクラム実践入門がおすすめ。

# DMMプラットフォームの失敗から学ぶスクラム開発体制

https://www.youtube.com/watch?v=7Poc1wPiiwk

会議ポリシー：会議コストを見える化するとか会議はMAX8名とか。
チームリーダーがボトルネック→POO（プロジェクトオーナープロキシ）を設置。
自己組織化には時間がかかる。
スクラム屋になっていた。
スクラムコスト（プラクティスにかかる時間）が高いのでなんとかしたい。
KPTがうまくいかなかったのでYWTMに変えた。
スプリントは1週間単位、慣れてきたので今月から2週間単位にする。
カスタムタクソノミーについて説明してみる

Wordpressのデータを作っていて、カスタムフィールドだけではちょっとやりづらいなって時に、カスタムタクソノミーを使うことがわかりました。

http://kotori-blog.com/wordpress/posttype_taxonomy/

こちらとかを読むと、「タグ」みたいな概念を追加して、自分で作るデータをタクソノミーと言うようです。

「タグ」みたいなやつ、と言っても、もうちょっとよくわからなかったのですが、HTMLタグで言うと次のような感じです。

（セレクトボックスだと）

```html:sample.html
<select name="{タクソノミー}">
<option value="{スラッグ1}">{ターム1}</option>
<option value="{スラッグ2}">{ターム2}</option>

・・・

</select>
```

（チェックボックスだと）

```html:sample.html
<input type="checkbox" name="{タクソノミー}[]" value="{スラッグ1}"> {ターム1}
<input type="checkbox" name="{タクソノミー}[]" value="{スラッグ2}"> {ターム2}

・・・
```

作業していて、スラッグ？ターム？何？てなったので、こういうのを誰か説明してくれたらよかったのになと思いました。
PHPでアルゴリズムの復習

#PHPでアルゴリズムの復習

* バイナリサーチ
* リニアサーチ
* FizzBuzz
* チェインハッシュ

ここまでは終わった。

ソース↓
https://github.com/Khanashima/algorithm

PHPでアルゴリズムの復習が終わったら、Scalaをやる :fire: 
関数型プログラミングの前にアルゴリズムはやっとく
アルゴリズムの復習と同時にデザパタとSOLID原則もなんとなくなのでもっとちゃんとしたい

？？
Scalaでやれば良いじゃんとも思ったが、業務でPHPを使ってるから。
とりあえず、PHPで。
中途半端なマイグレーション

Railsで使うデータベースはマイグレーションで組み立てていきますが、状況によってはマイグレーションに失敗して、マイグレーション前でもマイグレーション後でもない闇に落ちていってしまうことがあります。

# MySQLの特性
マイグレーションの実行に失敗した場合、Railsは今までにした操作をロールバックして、マイグレーション前の状態に戻ろうとします。これはPostgreSQLやSQLiteの場合なら無事ロールバックできるのですが、MySQLの場合、`CREATE TABLE`や`ALTER TABLE`を実行すると強制的に**トランザクション外**となってしまうため、成功した操作をロールバックすることもできず、中途半端な状態のDBができあがってしまいます。

## 失敗例
マイグレーションに失敗する例としては、

* 列名の間違い（すでにある列を追加しようとした、ない列を削除しようとした、ない列にインデックスを張ろうとしたなど）
* すでにあるものと同名のテーブルやインデックスを追加しようとした
* 単純な書き間違い[^1]

などミスが大半ですが、人間はミスをするものである以上、根絶することは難しいです。

# 予防策
予防策としてはいくつか考えられますが、副作用もあります。

* そもそもMySQLではなく、DDLもロールバックできるDBエンジンを使う（これだけで選ぶほど大きな問題ではない）
* 1つのマイグレーションで1つの書き換えだけ行なって、中途半端な状態を作らせない（マイグレーションが増える）
* 先にテスト環境でマイグレーションを流して、ちゃんと通ってから開発・本番などに持っていく

# 脱出方法
では、不幸にしてマイグレーションの狭間に落ちてしまった場合は、どうすればいいのでしょうか。この場合、状況としては

* マイグレーションの進捗状況の記録（`schema_migrations`）…前のマイグレーションまで実行
* DBの状態…最新のマイグレーションの途中

ということになっています。手法としては、以下のいくつかが考えられます。

1. DBを直接叩いてマイグレーション前の状態に戻して、（誤記は修正して）もう一度`rake db:migrate`
2. マイグレーションファイルから成功した分以外を消しておいて、`schema_migrations`に手で追加、そして残りは別のマイグレーションに回す
3. マイグレーションファイルの中で成功した分ををコメントアウトして`rake db:migrate`、終了後にコメントアウトを戻す
4. 手作業でDBと`schema_migrations`を整え、成功したことにしてしまう

個人的には、（特段の事情がなければ）1がいいかなと考えています。

[^1]: 一回、`remove_index`を`drop_index`と書いてしまって動かない、ということがありました。
【solved:備忘録】cmderが起動できなかったので調べたこと

cmderを起動しようとしたら「api-ms-win-crt-runtime-l1-1-0.dll」がないから起動できないと言われたので調べてみたら以下が参考になった。

https://github.com/bliker/cmder/issues/501

![スクリーンショット 2015-06-06 22.51.26.png](https://qiita-image-store.s3.amazonaws.com/0/29152/0e7d20a5-746b-84ca-0990-961adcbdbabe.png)

こいつを入れてやったらすんなり動いた。
以上。
PlayをDockerコンテナで開発するときの構成について


最近所用で、Dockerコンテナ上でPlayを起動させる必要が出てきました。
Playアプリケーションを含んだコンテナについては、http://qiita.com/JunSuzukiJapan/items/cdc34c621a94e28c2f22 を参考にして作りましたが、一つ問題が発生しました。

# 環境
Vagrant 1.7に、 CentOS7＋Docker1.6を導入しています。RDBはVagrant内にあります。

# 問題
アプリケーション内ではRDBを利用しているのですが、当然ながらJDBC文字列には接続先の情報が必要です。

ローカル（ホスト機）で動かしているのなら、localhost/127.0.0.1でVagrantにはアクセスできます。ただ、そのままDockerに入れてしまうと当然ながら動きません。

Productionへの切り替えなども考えると、結構頭が痛い問題です。パスワードとかも当然そのまま使うわけにはいかないので、なんとか考える必要があります。

# 解決策（の提案）
この解決策として、docker にわりと最近追加されたオプションである、--add-hostパラメータが利用できます（たぶん）

```bash
$ docker run --add-host=rdb:{vagrantのIP} ~
```

こんな感じにして、接続文字列のホストの部分をこの `rdb` にしておくことで、起動時に変更することができます。

このホスト部分すらも環境変数にしてやれば、外部から両方を渡すこともできます。

# 実際の解決策
普通の解決策？としては、application-prod.confのようなものを用意して、それを利用するようにする、というのが一番楽で普通だと思います。

Dockerfileの中で起動コマンドで -Dconfig.file=./application-prod.confとしておいて、ビルドするときにこの部分を置き換えればいいでしょう。

# 常にDockerで開発 or ローカルで手早く
Dockerでビルドする時間などを考えるとそれなりに時間がかかる、ということもあり、ちょっと試す、という際にはローカルで起動する方が手っ取り早いです。

これの解決も↑で示した方法で解決できます。ローカルだと基本的にapplication.confしか見ないので、ここにローカルでの設定を書いておいてやればOKです。

# 結論
普通の解決策でOKでした。
Visual StudioでMarkdown形式の文書を作成する

今後このブログでプログラミング関連の記事を書いていくことにしました（今日の記事はプログラミング関連ではないかもしれませんが）。

最近Visual Studioを文書作成ツールとして使うようになりました。SIerに就職してからというもの、WordとかExcelが本当に嫌いになってしまったのです。特にExcel方眼紙で地獄の苦しみを味わいました。もうOfficeはこりごりです。別にMicrosoftが悪いんじゃないんだけど。金輪際使いません。

Officeを使わないなら何で文書作成を行うか。流石にメモ帳で平坦な文字列を淡々と連ねていくのは一見して文書構造が分かりにくいのでやりたくありません。

LaTeXを利用することも考えなくはなかったですが、このウェブ全盛時代にあってはちょっと不便です（実際過去には数学の勉強ノートをLaTeXで書いていたこともありましたし、大学の卒業論文はLaTeXで書きました。が、LaTeXで書いた文章をウェブに持ってくるのは中々煩わしそうでした。もしかしたらLaTeXの妙手に言わせたら違うのかもしれませんが）。

そうなるとHTMLで書くのが一番全うかと思い、それならVisual Studioを使おうということになりました。Visual Studioを使うと複数の文書をプロジェクトの構成要素として一元管理することができるので便利です。

ただ、HTMLは毎度毎度タグで囲んでいかなければならないのが結構な面倒さです。HTMLで直接書くよりはMarkdownで書いた方が良さそうです。
ということで今日はVisual StudioでMarkdown形式の文書を書く環境を整えます。

手順は以下の通り。「Web Essentials 2015.0 RC」という拡張機能をVisual Studio 2015 RCにインストールします。

1. Microsoft Visual Studio Professional 2015 RCを起動する。
2. [ツール]-[拡張機能と更新プログラム]を選択する。
3. [拡張機能と更新プログラム]ダイアログボックスが表示される。[オンライン]を選択する。
4. [Visual Studioギャラリーの選択]に"web essentials"と入力し、検索する。
5. 「Web Essentials 2015.0 RC」を選択し、[ダウンロード]を選択する。
6. [ダウンロードとインストール]ダイアログボックスが表示される。[インストール]を選択する。
7. [ダウンロードとインストール]ダイアログボックスが閉じ、[拡張機能と更新プログラム]ダイアログボックスに戻る。[今すぐ再起動]を選択する。
8. Microsoft Visual Studio Professional 2015 RCが再起動する。

Markdown形式のファイルを開いて動作を確認してみましょう。

<a href="http://f.st-hatena.com/images/fotolife/p/pizyumina/20150606/20150606105505_original.png?1433555728">![](http://f.st-hatena.com/images/fotolife/p/pizyumina/20150606/20150606105505_original.png?1433555728)</a>

これで捗ること間違いなし！！

わぁい。
２つ以上前のmigrationを取り消す


DB決めながら適当にごちゃごちゃやってみた後に必要のないmigrationが出てしまった。
最初からそんなものなかったことにしたい。
DB決めてからやれよとかは無しで。一人でやっていること前提で。

# 不要なカラム、テーブルの削除
```
rake db:migrate:down VERSION=...
```
削除します。もう使っていないのでこのままアプリを実行しても問題ないですが、rails sしてアクセスすると、

```ruby
ActiveRecord::PendingMigrationError (

Migrations are pending. To resolve this issue, run:

	bin/rake db:migrate RAILS_ENV=development

):
```

# migrationファイルの削除

```
rm <version>_hogehoge.rb
```

不要になったmigrationファイルを削除します。

バッドノウハウな気がしている。
【javascript】正規表現チェッカーつくったよ

javascriptで正規表現チェッカー作りました。
GoogleAppsScriptで実装してます。

[正規表現チェッカー](https://script.google.com/macros/s/AKfycbwQEKyxA9I_93JGgrT5a8aqjX4K1caqFDjfPnX8y9FbB8dHWg4/exec)

#使い方
targetに文字列を入力して、sourceに正規表現を書くだけ！

#使用例
以下の使用例は初期値としてランダムで与えられるので、リロードしてみてください。
##住所から都道府県名だけ抽出
![スクリーンショット 2015-06-06 21.17.55.png](https://qiita-image-store.s3.amazonaws.com/0/16535/ae1c6290-d605-5c98-ff0a-60e777c9c4c5.png)

```js
var re = new RegExp( "^(.{2}[都道府県]|.{3}県)" , "gm" );
```
参考：[【Ruby】住所から都道府県を正規表現で取り出す【正規表現】](http://qiita.com/mktakuya/items/572232fb4eeabe50a0c5)
##電話番号の形式チェック
準備中...

#ソースコード
ソースコードはこちらから見ることができます。
[Regular Expression Checker](https://script.google.com/d/1IHf6wu5xDICMY8rsMX20nqhxerY_eohtx36aT2rTG7ey9QdE2egh9vJz/edit?usp=drive_web#)

`textarea`のハイライトは、こちらのプラグインを使用しています。
[Facebookみたいにtextareaの一部を強調する](http://qiita.com/yuku_t/items/516ec6fe59b77b93edc5)

#私事
なんでGASで実装したかというと、GASのChrome ウェブストア登録機能を使ってみたかったからです。
[Regular Expression Checker](https://chrome.google.com/webstore/detail/oomiidlkbkhblcelgobdgkfiglaghfjb/publish-accepted?hl=ja&gl=JP&authuser=0)
上手くできた気がするけど、chromeにインストールできないのでもっと何か設定があるのかも…また後からちまちまやります。
MacBookAir再インストール時の設定

# MacBookAir再インストール時の設定
## Mac 初期化
```
1. Mac再起動
2. Command + r
3. ディスクユーティリティ > Macintosh HD > 除去タブ > 除去ボタンクリック
4. ディスクユーティリティ終了
5. Wifiアクセス
6. OS X を再インストール
```
※ [参考サイトはこちら](http://ezxnet.com/mac/entry11343/)
## Xcodeインストール
```
1. App Storeからダウンロード及びインストール
2. https://developer.apple.com/downloads/index.action
3. Appleログイン
4. 該当バージョンのCommand Line Tools for Xcodeダウンロード及びインストール
```
## git-completion.bash設定
```bash
$ sudo find / -name git-completion.bash
$ mkdir -p /usr/local/git/contrib/completion/
$ mv git-completion.bash /usr/local/git/contrib/completion/
```
## bash設定
```bash
$ vi ~/.bash_profile
```
```bash:~/.bash_profile
source ~/.bashrc
```
```bash
$ vi ~/.bashrc
```
```bash:~/.bashrc
# Git branch in prompt.
parse_git_branch() {
    git branch 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/ (\1)/'
}
# git settings
source /usr/local/git/contrib/completion/git-completion.bash
GIT_PS1_SHOWDIRTYSTATE=true
#export PS1="\u@\h \W\[\033[32m\]\$(parse_git_branch)\[\033[00m\] $ "
export PS1='\[\033[32m\]\u\[\033[00m\]:\[\033[36m\]\w\[\033[31m\]$(parse_git_branch)\[\033[00m\]\$ '

alias ll='ls -la'
```
```bash
$ source ~/.bash_profile
```
## homebrewインストール
```bash
$ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
$ brew update
$ brew doctor
```
## Mac Terminal のカラー設定をSolarized にする
### Solarized をダウンロード
```bash
$ git clone https://github.com/altercation/solarized.git ~/solarized
$ cd ~/solarized/vim-colors-solarized/colors
$ mkdir -p ~/.vim/colors/
$ cp solarized.vim ~/.vim/colors/
```
### Terminal の設定でSolarized プロファイルを読み込む
```
1. メニューバー ＞ ターミナル ＞ 環境設定
2. タブ ＞ 設定
3. プロファイル下部 ＞ 歯車ボタン ＞ 読み込む
4. ダウンロードしたSolarized（e.g. Solarized Dark.terminal）を選択してプロファイルにロードする（Dark, Light はお好みで）
5. ついでに、そのプロファイルをデフォルトに設定しておくといい
```
### vim カラー設定
```bash
$ vi ~/.vimrc
```
```bash:~/.vimrc
syntax enable
set background=dark
```
### GNU 版ls（gls）とかが入ってるcoreutils をインストール
```bash
$ brew install coreutils
```
### Solarized のディレクトリカラー設定ファイルを任意の場所へダウンロード
```bash
$ git clone https://github.com/seebi/dircolors-solarized.git ~/dircolors-solarized
```
### ls コマンドをgls コマンドに置換え
```bash
$ vi ~/.bash_profile
```
```bash:~/.bashrc
alias ls='gls --color=auto'
```
```bash:~/.bashrc
eval $(gdircolors ~/dircolors-solarized/dircolors.ansi-universal)
```
GitHubで複数のアカウントを使う場合のSSHの設定

GitHubでは、既に登録済みの公開鍵を、違うアカウントに設定することができないので、新しい公開鍵を作成してGitHubに登録し、gitコマンドでcloneやpushをする時に、新しい公開鍵のペアとなる秘密鍵を読み込む設定をする必要がある。リモートの追加の仕方を間違わなければそれほど難しくない。

#### 1. GitHubで新規アカウントを作成する

#### 2. 新しい公開鍵・秘密鍵を作成する

```bash
$ cd ~/.ssh
$ ssh-keygen -t rsa -C メールアドレス -f 新しい鍵のファイル名
```

#### 3. .ssh/configを以下のように設定する

```bash
Host 適当に(github-新しいアカウント名とか)
  HostName github.com
  IdentityFile ~/.ssh/new_id_rsa # 新しく作成した秘密鍵を指定
  User git
  TCPKeepAlive yes
  IdentitiesOnly yes
```

#### 4. 作成した公開鍵をGitHubに登録する

#### 5. 接続できるかチェック。

```bash
ssh -T Hostに設定した名前
```

#### 6. 新しく作成したリモートリポジトリをローカルに登録

```bash
$ git remote add origin git@<.ssh/configのHostNameの名前>:githubの新アカウント名/XXX.git
```

※ <.ssh/configのHostNameの名前>の<>は要りません。

以上。
MacのHomebrewでpyenv-virtualenv環境を作る

# Homebrewでpyenv-virtualenv環境を作る

Homebrewでpyenv-virtualenvインストール

```bash
$ brew update
# pyenv-virtualenvインストール(pyenv含まれてます)
$ brew install pyenv-virtualenv
```
```bash:~/.bashrc
if which pyenv > /dev/null; then eval "$(pyenv init -)"; fi
export PYENV_ROOT=/usr/local/var/pyenv
if which pyenv-virtualenv-init > /dev/null; then eval "$(pyenv virtualenv-init -)"; fi
```
SHELL更新

```bash
$ source ~/.bashrc
```
python2.7.9バージョンの仮想環境作成

```bash
$ pyenv install 2.7.9
```
仮想環境バージョン一覧確認

```bash
$ pyenv versions
> *system
> 2.7.9
```
python2.7.9バージョンのtest仮想環境作成

```bash
$ pyenv virtualenv 2.7.9 test
```
仮想環境バージョン一覧確認

```bash
$ pyenv versions
> *system
> 2.7.9
> test
```
プロジェクトフォルダ作成

```bash
$ mkdir -p ~/project/test
$ cd ~/project/test
```
このフォルダ配下はtestにする(.python-version が作成される)

```bash
$ pyenv local test
$ pyenv versions
> system
> 2.7.9
> *test
```
仮想環境になっているかどうか確認

```bash
(test)$ python --version
Python 2.7.9
(test)$ which python
/usr/local/var/pyenv/versions/test/bin/python
(test)$ pyenv versions
  system
  2.7.9
* test (set by /Users/jjongs08/project/test/.python-version)
```
環境削除

```bash
$ pyenv uninstall test
$ pyenv versions
> *system
> 2.7.9
```
[Swift vs C] C言語でallocateされた構造体のダブルポインタをSwiftで取得、使用する

##C言語でallocateされた構造体のダブルポインタをSwiftで取得する

C言語で書かれたソースを、Swiftのプロジェクトに組み込んでいた際にハマった、
C言語のDoublePointerの取得方法と、Swift上での値の参照方法についてメモ代わりに書きます。


例えば、以下の様な構造体をC言語で書いたとします。

```doublePointer.c

typdef struct{

float a;
float b;

}t_str:


```

これを、ダブルポインタで使用する場合は以下のようにallocateします。

```doublePointer.c

t_str** doubleP = NULL;

doubleP = calloc(sizeof(t_str*),100);

for(i=0;i<100;i++){
	dounleP[i] = calloc(sizeof(t_str),100);
}


```

これで合計10,000個のt_str型データ領域が確保できました。

これをC言語で書かれたプログラムで使用後、Swiftのプログラムに渡す際
C言語のプログラムは以下のようになります。

```doublePointer.c

t_str** DoublePointer()
{

	t_str** doubleP = NULL;

	doubleP = calloc(sizeof(t_str*),100);

	for(i=0;i<100;i++){
		dounleP[i] = calloc(sizeof(t_str),100);
	}


	/*
		何かの処理
	*/

	return t_str;
}



```

Swift側では以下のようにして変数を宣言

```Swift.swift

var swiftDoubleP = UnsafeMutablePointer<UnsafeMutablePointer<t_str>>?


```

Optinal型にし、?を付加します。

受け取り方は、

```Swift.swift

swiftDoubleP = DoublePointer()

```

とし、データの取り出し方は、少しイレギュラーで以下のようにします。

```Swift.swift


for i in 0..<100{
	for j in 0..<100{

		println(swiftDoubleP![i][j].a)
		println(swiftDoubleP![i][j].b)


	}
}

```

indexの前に!を挿入するのがミソです。

トリプルポインタもこんな感じでいけるのでしょうか。
yosemite アップデートで postgresql に接続できない


`$ rails` で接続できない。下記エラー

```
PG::ConnectionBad (could not connect to server: No such file or directory
	Is the server running locally and accepting
	connections on Unix domain socket "/tmp/.s.PGSQL.5432"?
):
```

`$ psql` で下記エラー

```
psql: could not connect to server: No such file or directory
	Is the server running locally and accepting
	connections on Unix domain socket "/tmp/.s.PGSQL.5432"?
```

こちらで解決

```
mkdir /usr/local/var/postgres/pg_tblspc
mkdir /usr/local/var/postgres/pg_twophase
mkdir /usr/local/var/postgres/pg_stat_tmp
```


http://qiita.com/ms2sato/items/10b9e9c5a98d50f5954d