OmniAICreator/Qiita-1.07M huggingface dataset:
【Android】ButtonやSpinnerの背景のSelectorに画像付きdrawableを使う

## 概要
ButtonやSpinnerなどの背景に画像付きdrawableを使いたいときのメモです。

## 結論
- selectorのdrawableにlayer-listを使う

## サンプルコード

selector

```xml:drawable/selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/default"
        android:state_pressed="false"/>
    <item
        android:drawable="@drawable/pressed"
        android:state_pressed="true"/>
</selector>
```

押下前のdrawable

```xml:drawable/default.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="rectangle">
            <solid android:color="@color/default" />
            <corners android:radius="@dimen/radius" />
            <stroke
                android:width="@dimen/stroke_width"
                android:color="@color/gray" />
        </shape>
    </item>
    <item android:right="@dimen/spacing_nomal" >
        <bitmap
            android:src="@drawable/ic_arrow_down"
            android:gravity="right"/>
    </item>
</layer-list>
```

押下後のdrawable（solidの色を変えてるだけ）

```xml:drawable/default.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="rectangle">
            <solid android:color="@color/pressed" />
            <corners android:radius="@dimen/radius" />
            <stroke
                android:width="@dimen/stroke_width"
                android:color="@color/gray" />
        </shape>
    </item>
    <item android:right="@dimen/spacing_nomal" >
        <bitmap
            android:src="@drawable/ic_arrow_down"
            android:gravity="right"/>
    </item>
</layer-list>
```

## 参考
- [Drawable Resources | Android Developers]
(https://developer.android.com/guide/topics/resources/drawable-resource.html)
Swift3×EurekaでNavigationBarが出ない

#なんやねん...

Swift3でEurekaを使う際、`Storyboard`にくっつけた`NavigationBar`が出なくて小一時間詰まりました。

# 解決方法

どうやら、`Navigation Controller`を使わないとダメらしいです。`Storyboard`に`NavigationBar`をくっつけるだけでは出ません。なので`Editor > Embed In > Navigation Controller.`とかをして、下記のように`Navigation Controller`をくっつけてください

<img width="382" alt="スクリーンショット 2017-05-07 22.23.29.png" src="https://qiita-image-store.s3.amazonaws.com/0/135794/e79e1da8-4f35-73eb-5a68-dc3bcc83531b.png">


# 無事出ました

<img width="281" alt="スクリーンショット 2017-05-07 22.23.10.png" src="https://qiita-image-store.s3.amazonaws.com/0/135794/f3212a7a-d03c-32d2-0f35-517255a2e4ad.png">


# 2017/05/15 追記

その後、同じ手順でやってみたら、なんとできませんでした！なぜ、この前できたのか謎です。

```swift
@IBOutlet weak var NavigationBar: UINavigationBar!
```

```swift
self.view.addSubview(NavigationBar)
```

上記のようなやり方で改めてできたんすけど、そーしたら次はバーにテーブルが隠れちゃうんだよね。解決策模索中

![スクリーンショット 2017-05-15 15.55.13.png](https://qiita-image-store.s3.amazonaws.com/0/135794/c36adb32-2ce4-157c-84a5-1dce8fe76dd2.png)





# 参考

[Swift×Eurekaで簡単に設定画面を作る](http://qiita.com/seiya_orz/items/4a6884eb8ad9b7a61f2b)

[Storyboard Navigation Bar #481](https://github.com/xmartlabs/Eureka/issues/481)

[Swift3×EurekaでNavigationBarが出ない](http://off.tokyo/blog/2017/05/07/swift3xeureka%E3%81%A7navigationbar%E3%81%8C%E5%87%BA%E3%81%AA%E3%81%84/)
メモ: Raspberry pi (raspbian-jessie) の初期設定

Raspberry pi (raspbian-jessie) の初期設定
==============================================
今さらながら、Raspberry pi の初期設定は、毎回結構つまるので、自分向けにメモ

無線設定 (GUI)
-------------------------------------------------
無線の設定は、GUIで実施 (もちろん、CLIでも可能だが、無駄につまる)
右上のほうに、LAN設定のアイコンがあるため、そこで選択する。

パスワードの変更及びCLIに切り替える
----------------------------------------------------------
注: 私は、CLIで使用することを好むので、いつもCLIに切り替えています。

1. Menu -> Preferences -> Raspberry Pi Configuration　を選択
* Password: Change Password
* CLIにチェック

キーボードの修正 
-----------------------------------------------------
以下のコマンドを入力する。

```
sudo /usr/bin/raspi-config
```

選択画面が表示されるため、以下のように選択
5 Internationalisation Options を選択 <br>

* Change Timezone　を選択
Asia Tokyo を選択 <br>

* Change Keyboard Layout
Generic 105-key (Intel) -> Other -> Japanese -> Japanese -> The default for the keyboard Layout -> No compose -> No <br>

* Configure local ()
-> en_GB.UTF-8 UTF-8のチェックを外す。
-> ja_JP.UTF-8 UTF-8にチェックをつける。 <br>

日本語フォントのインストール
------------------------------------------------------------------------------
1. 以下のコマンドを入力してください。

    ```
    sudo apt-get install ttf-kochi-gothic xfonts-intl-japanese xfonts-intl-japanese-big xfonts-kaname
    ````

2. 日本語を入力するためのメソッドをインストール

    ```
    sudo apt-get install uim uim-anthy
    ```

3. jfbtermをインストール

    ```
    sudo apt-get install jfbterm
    reboot
    jfbterm
    ```

    注: rebootしないと反映されない

Boot Optionを変更
-----------------------------------------
以下のコマンドを入力する。

```
sudo /usr/bin/raspi-config
```

以下を選択

1. 3 Boot Options を選択
2. B1 Desktop / CLI
3. B1 Console

ラズパイのファームウェアを最新化する
--------------------------------
以下のコマンドを入力

```
sudo rpi-update
reboot
```

パッケージ管理ツールを最新版にする
----------------------------------
以下のコマンドを入力

```
sudo apt-get update
sudo apt-get upgrade
```

テキスト編集用にvimをインストール
-------------------------------
以下のコマンドを入力

```
sudo apt-get install vim
```

新規ユーザを追加
----------------------------------
* ユーザ追加
以下のコマンドを入力 ($userが追加したいユーザ名)

```
sudo adduser  $user
```

パスワード以外は、スルーで「Enter」を押す (メルアドとか住所を打つ必要はない)

* pi(デフォルトユーザ)と同じgroupにする
以下のコマンドを入力

```
group pi
```

表示された項目をメモ
以下のコマンドを入力　($userは、上記で追加したユーザ名)

```
sudo usermod -G pi,adm,dialout,cdrom,sudo,audio,video,plugdev,games,users,netdev,input,spi,i2c,gpio $user
reboot
```

ssh接続のためのIPアドレス確認
---------------------------------------
以下のコマンドを入力

```
ip addr show
```

ssh接続ならば、気にしなくても良いが、コンソール接続ならば、再起動毎に以下のコマンドを打たないと、日本語にならない。

```
jfbterm
```
Gitとブロックチェーンの関係

ひょんな拍子に、Bitcoinやブロックチェーンについて調べ始めたのですが、すでに使っているものの中に、ほぼ同じようなものがあることに気づいてしまいました。

なお、この文章は「Gitは知っているけど、ブロックチェーンは何か知らない」というような人を前提としています。また、自分自身の理解が不十分な部分もありますので、マサカリも大歓迎中です。

# TL; DR

* （広義には）Gitツリーもブロックチェーン
* Bitcoinには、分散系で取引履歴を改ざんされない仕組みがある
* マージ不能なフォーク

# Gitの根っこはブロックチェーン

最近、よく話題となっている「ブロックチェーン」ですが、基本的には以下の2点が基本となる仕組みです。

* 変更内容をブロックという単位にまとめて、ブロックのハッシュ値を取る
* 1つ進んだブロックには、前のブロックのハッシュ値を含める

こうすることで、「チェーンの途中だけ書き換えることはできず、もし書き換えようとすればそれ以降全てのブロックを書き直す必要がある」という性質を持つこととなります。

…ん？こんな性質をどこかで見たことがある、という気がしたのですが、それはGitでした。

Gitで古い履歴を書き換えようとすれば[`git filter-branch`というコマンド](http://qiita.com/Spring_MT/items/f60c391b5dbf569a1d12)の出番ですが、これは書き換えた以降の履歴も全てハッシュ値が変わってしまいます。実際、Gitのコミットには[このように](https://git-scm.com/book/ja/v2/Git%E3%81%AE%E5%86%85%E5%81%B4-Git%E3%81%AE%E5%8F%82%E7%85%A7)、**前のコミットのハッシュ値**が含まれていますので、ハッシュ値でつながった、ある意味ブロックチェーンに相当するものです。

# Gitとブロックチェーンの違い
それでは、Gitツリーとブロックチェーン[^1]の違いとはどこにあるのでしょうか。目立つところでは2つあります。

## チェーン自体の管理方法
Gitの場合、`git clone`というコマンドに象徴されるように、ローカルにあるGitツリーは、クローン元となるツリーとは（参照する関係はあるけれども）基本的に**別のツリー**です。複数人で同じGitリポジトリからクローンして、それぞれに別の編集を加えていっても、あとでマージすればかまわないので、特に問題はありません。

一方で、ビットコインのブロックチェーンは**世界中に1本だけ**です。もちろん、理論上はGitのように別なブロックチェーンを作ることもできるかもしれませんが、他の人はそのチェーンをビットコインだと認めないので、実質的には意味をなしません（関連した話を後述します）。

## ハッシュ値の計算方法
Gitでは、ハッシュ値はふつうにハッシュ関数を1度通すだけです。なので、`filter-branch`などで全部書き換えということも（少々の時間はかかりますが）現実的に実行可能です（そもそもGitは速度重視に作られたバージョン管理システムです）。

一方で、ビットコインのブロックチェーンでは、ブロックのハッシュ値として、「ある値以下の」ハッシュ値を要求するようになっています。もちろん、暗号用のハッシュ関数で狙った値を生成するなんて芸当は不可能なので、「数撃ちゃ当たる」方式でひたすら生成を続けて目的の値を探すほか、手段はありません。条件を満たすハッシュを見つけた人には先着1名でビットコインが発行されますが、これを「採掘」といいます。

そして、ビットコインでは「いちばん長いブロックチェーンを信用する」ということになっているので、偽のブロックチェーンを作る攻撃をしようとすれば、「51%攻撃」といって、残りの採掘者全てを上回る計算能力を用意する必要が出てきます。ただ、それだけの能力があれば正規に採掘しても利益が出る、と言うかたちでさらに攻撃のインセンティブを下げています。

# マージできないフォーク
Gitのフォークは後でマージすることができますが、ブロックチェーンの場合「別な取引履歴がある」こと自体が問題ですので、通常はフォークさせられません。

## 偶発的なフォーク
ビットコインでは、1%にもならない確率なのですが、ブロックの採掘が2つほぼ同時に行われてしまって、有効なブロックが両方に続いてしまうことがあります。こうなった場合は、さらに次のブロックを採掘していって、先に次がつながったほうが生き残ることとなります。

## 意図的なフォーク
ブロックチェーンを構成するプログラムにもバグが発見されるなどの事情で、ときおりブロックチェーンのプロトコルを変更することがあります。これが**ハードフォーク**で、通常は修正版の方だけブロックチェーンをつなぐ作業が続けられて、元のブロックチェーンは見捨てられることで、事実上消滅することとなります。

### フォークして生き残るケース
ところが、そうは問屋がおろさなかったフォークの事例がありました。[Ethereum](https://www.ethereum.org/)という、「ブロックチェーン上でチューリング完全なシステムを動かして、スマートコントラクトを実現する」というプロジェクトがあって、その上で「The DAO」という、「管理者のいない投資ファンド」のようなプロジェクトが進められていました。

ところが、このThe DAOのシステムにバグがあって、大量のEther（Ethereum上の通貨）がハッカーにより移動されてしまったのでした。The DAOのシステム上、犯人がそのEtherを得られるまでには時間の余裕があったので、Ethereumのコミュニティは「The DAO関連のEther移動をすべてなかったことにする」ためにハードフォークを行うことを決断しました。

しかしながら、「このような理由でフォークするのは間違っている」と考えた一部の人達が、もとのEthereumのブロックチェーンをつなぐことにして、そちらに[Ethereum Classic](https://ethereumclassic.github.io/)と名付けました。できた当初はEthereum側の一部関係者から51%攻撃を仕掛けて崩壊させる、という話も飛び出しましたが、Classic側が取引所に上場されるなど一定の人気を確立してしまったために、両者が共存する状態が定着しています。

EthereumもClassicも、The DAOのフォーク前は同じブロックチェーンだったので、フォーク前に存在したEtherは、フォーク後には同量のETH（本家のEther）とETC（ClassicのEther）が存在する状態となりました。

[^1]: 基本的に、Bitcoinのブロックチェーンを前提として話を進めます。
Docker Root Dir を /var/lib/docker から /foo/bar/docker へ変更する方法

linuxの場合`/etc/docker/daemon.json`でパス(`graph`)を指定すると変更できる。

---

`dockerd`を停止して、設定ファイルを編集する。

```shell-session
$ sudo service docker stop
$ mkdir /foo/bar/docker
$ sudo vi /etc/docker/daemon.json
```

設定ファイルの詳細は[こちら](https://docs.docker.com/engine/reference/commandline/dockerd/#linux-configuration-file)を参照のこと。今回はRoot Dirを変更したいだけなので下記の通り。`daemon.json`が存在しない場合は新しく作る。

```/etc/docker/daemon.json
{
	"graph": "/foo/bar/docker"
}
```

設定を変更したら`dockerd`を再起動する前に`/var/lib/docker`から新しいディレクトリへファイルをコピーする。`rsync`を使うといいらしいけど詳しくはggってください。

コピーが終わったら`dockerd`を再起動して設定内容を確認。

```shell-session
$ sudo service docker start
$ docker info | grep 'Docker Root Dir'
Docker Root Dir: /foo/bar/docker
```
dockerのlinkオプションがレガシーなので、コンテナ間で名前解決できるようにネットワークを用意する

dockerコマンドの`--link`オプションはすでに非推奨です(https://docs.docker.com/engine/userguide/networking/default_network/dockerlinks/ )。しかし、`--link`オプションを使わないコンテナ間名前解決の方法はあまり知られていないようです。

その方法を調べたので、ここに紹介します。

# 前提環境
```console
$ sw_vers
ProductName:	Mac OS X
ProductVersion:	10.11.6
BuildVersion:	15G1421
$ docker --version
Docker version 17.03.1-ce, build c6d412e
```

# docker-compose版を追加しました
コンテナをいくつか用いる場合、docoker runでいちいち手動で操作するのは手間がかかりすぎます。docker-composeコマンドを使いましょう。本記事の中では、順を追って手順を説明しています。その操作をdocker-compose.ymlとしてまとめたものを用意しました。 `docker-compose up`とコマンドを打つと今回と同じ構成が実現できます。
 https://gist.github.com/tamanobi/cfef34197d531945872173fcb0906cf5

# 結論
dockerコマンドの `--link` オプションを使わずに、コンテナ間名前解決をするには、Dockerネットワークを作成し、そこにコンテナを参加させる。

* ブリッジネットワークを作成(`docker network create my_network`)
* 各コンテナをネットワークに参加(`docker run --net my_network` --name app )

# 例示
NginxとPHPのDockerイメージを使って実演します。

ホストOSの `localhost:8080` にアクセスしたら、Nginxコンテナの80番へ、そこからPHPアプリケーションコンテナの80番へリクエストが行くようになります。

## NginxとPHPのオフィシャルイメージを利用する
NginxとPHPのDockerイメージは以下のものを利用します。

* https://hub.docker.com/_/php/
* https://hub.docker.com/_/nginx/

```console
$ docker pull nginx
$ docker pull php
```

## Dockerネットワーク作成
`my_network`という名前でBridgeネットワークを作成します。

```console
$ docker network create my_network
```

## PHP
PHPコンテナを`ap1`という名前で80番ポートを露出させて立ち上げます。テスト用のアプリケーションを作成するため、一旦シェルを起動します。 `my_network`へ参加させるのを忘れずに。

```console
$ docker run --rm -itd --name ap1 --expose 80 --net my_network php /bin/sh
```
### アプリケーションを作成・起動
```console
$ docker ps | grep php
096c8fe51cff php  "docker-php-entryp..."  1 minutes ago   Up 1 minutes  80/tcp  ap1
$ docker attach 096c8fe51cff
```

コンテナ内部にアプリケーションを作成し、起動します。アプリケーションが立ち上がったら、<kbd>Ctrl+P</kbd>, <kbd>Ctrl+Q</kbd>でコンテナを落とさずにコンテナ外に出ます。

```console
# cat << EOF > ./app.php
echo "Accessed from Nginx";
EOF
# php -S 0.0.0.0:80 /app.php
Listening on http://0.0.0.0:80
Document root is /
Press Ctrl-C to quit.
```


## Nginx
ホストOSの8080番ポートを、Nginxコンテナの80番ポートに転送します。動作確認には、ホストOS(Mac)のブラウザで
 `http://localhost:8080` にアクセスします。

PHPコンテナへプロキシするための設定をphp.confとして用意します。

```sh
$ mkdir ./nginx
$ cat << EOF > ./nginx/php.conf
server {
    listen 80 default_server;
    listen [::]:80 default_server;

    # ap1
    location / {
        proxy_pass http://ap1;
    }
}
EOF
$ docker run -d --net my_network -p 8080:80 -d -v `pwd`/nginx/:/etc/nginx/conf.d/ nginx
```

## 動作確認
`localhost:8080` にアクセスして `Accessed from Nginx` と表示されれば成功です。

<img width="289" alt="スクリーンショット 2017-05-07 21.51.06.png" src="https://qiita-image-store.s3.amazonaws.com/0/38967/aa8c2777-38d6-4336-62a1-3d339f5623c4.png">

# まとめ
dockerコマンドの `--link` オプションを使わずに、コンテナ間名前解決をするには、Dockerネットワークを作成し、そこにコンテナを参加させれば良い。

名前は、runコマンドの`--name`オプションで決められる。

ここまでの操作は手作業で行っていましたが、複数コンテナの起動にはdocker-composeコマンドを利用します。紹介したネットワークへの参加などは`docker-compose.yml`に書けば自動化できるのでおすすめです。

# 参考資料
https://docs.docker.com/engine/userguide/networking/
SwiftのIntは範囲を超過するとどうなるか

##SwiftのIntは範囲を超過するとどうなるか

以前、C++言語やC#の場合は、最大値から１足すと最小値になり、最小値から１引くと最大値になる。これはビット反転により発生し、パフォーマンスの理由からこのチェック機構を走らせないことがあることを書きました。

http://qiita.com/daisukeokaoss/items/5615cd59a1432d8b96ee

では、Swiftの場合は、最大値を超えたり、最小値を下回ったりした場合にどうなるか。
SwiftのPlaygroundでちょっと実験してみることにしました。

```
import UIKit
var maximum = Int.max
var maxPlusOne = maximum + 1
```

Int.maxによって、Intにおいての最大値を取得することができます。
６４ビットのMacなので、Int.maxは9223372036854775807です。

以下のエラーが出ました

```
file:///Users/daisuke/Documents/MyPlayground.playground: error: Playground execution aborted: error: Execution was interrupted, reason: EXC_BAD_INSTRUCTION (code=EXC_I386_INVOP, subcode=0x0).
The process has been left at the point where it was interrupted, use "thread return -x" to return to the state before expression evaluation.
```
エラーが返されましたね。
では、以下のコードも走らせてみます。

```
import UIKit
var minimum = Int.min
var minMinusOne = minimum - 1
```

以下のエラーが出ました

```
file:///Users/daisuke/Documents/MyPlayground.playground: error: Playground execution aborted: error: Execution was interrupted, reason: EXC_BAD_INSTRUCTION (code=EXC_I386_INVOP, subcode=0x0).
The process has been left at the point where it was interrupted, use "thread return -x" to return to the state before expression evaluation.
```

つまり、Swiftでは、範囲を超えた場合は、デフォルトでエラーが返されることになります。
では、Playgroundではなく、iOSのプロジェクトで同じコードを走らせた場合はどうなるでしょうか。
プロジェクトを作成し、viewDidLoadに記述して走らせてみます。

```
import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        var maximum = Int.max
        var maxPlusOne = maximum + 1
        print(maxPlusOne)
        // Do any additional setup after loading the view, typically from a nib.
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}
```

以下のエラーが出てコンパイルできませんでした。

```
/Users/daisuke/Documents/sample/Sample/Sample/ViewController.swift:17:34: Arithmetic operation '9223372036854775807 + 1' (on type 'Int') results in an overflow
```
事前に整数オーバーフローになることがわかっている場合は、コンパイル自体ができないんですね。
では、今度は数値を入力して、実行時に整数オーバーフローを起こしてみます。

```
import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        

        // Do any additional setup after loading the view, typically from a nib.
    }

    @IBOutlet weak var IntField: UITextField!

    @IBAction func executeIntegerOverflow(_ sender: Any) {
        var maximum = Int.max
        var maxPlusOne = maximum + atoi(IntField.text)
        print(maxPlusOne)
    }


    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}
```
今度は、IntFieldに"1"を入力してボタンを押してみました。
今度は実行時エラーになりましたね。

ちょっとエラー文がコピペできないんですが、Swiftの場合は、整数オーバーフローはランタイムとコンパイル時にチェックされることがわかります。
パフォーマンスは多少悪くなりそうですが、この方がモダンなのかな？
Git(GitHub)+VPS(Vultr)で自動デプロイ環境構築

自分用のメモとして。

# やりたいこと
- ローカルで開発
- GitHubのリポジトリーにpush、同時にVPSのリポジトリーにもpush
- VPSに自動デプロイされる:raised_hands:

# 環境
- ローカル
    - OS：OSX El Capitan
    - Git：[GitHub](https://github.com/)
- VPS
    - [Vultr](https://www.vultr.com/)
        - CentOS 7.3.1611
        - Nginx 1.13.0
        - Git 1.8.3.1

# Git（GitHub）
あらかじめ「testing」というリポジトリーを作成しておきます。

# VPS（Vultr）
configファイルを使って、SSH接続できるようにしておきます。
以下は記述例です。

```text:~/.ssh/config
Host vultr
  HostName 12.34.56.789
  Port 22
  User hoge
  IdentityFile ~/.ssh/id_rsa
```

# リポジトリー
オーソドックスなやりかたとして、リポジトリーを2つ用意します。

- **ノンベアリポジトリー**（ローカルリポジトリー）
    - ワークツリーある。
    - チェックアウトとかマージとかできる。
- **ベアリポジトリー**（リモートリポジトリー）
    - ワークツリーない。
    - チェックアウトとかマージとかできない。
    - いわゆる更新管理用。

これがややこしいのですが、VPSには両方のリポジトリーを置きます。
ディレクトリー構造としては以下になります。

```text
var
└── www
    ├── html
    │    └── testing (ノンベアリポジトリー)
    └── testing.git (ベアリポジトリー)
```
ベアリポジトリーは公開する必要がないので、`/var/www`配下にしています。

# 流れ

ローカルのリポジトリー → ①GitHubのリポジトリー「testing」
↓
②VPSのベアリポジトリー「testing.git」
↓
VPSのノンベアリポジトリー「testing」（公開される）

※①と②は同時にpushします。

# 手順

まず、GitHubから「testing」を`/var/www/html`にcloneします。

```bash
cd /var/www/html
git clone https://github.com/{username}/testing.git
```
cloneしたリポジトリーをもとに、ベアリポジトリー「testing.git」を`/var/www`に作成します。

```bash
cd /var/www
git clone -bare /var/www/html/testing testing.git
```
つぎに、ベアリポジトリー「testing.git」のhooksを設定します。

```bash
cd /var/www/testing.git/hooks
vi post-update
```
```bash:post-update
#!/bin/sh
(cd /var/www/html/testing && git --git-dir=.git pull origin master)
```
ファイルに実行権限をつけて、動くか確認します。

```bash
chmod a+x post-receive
./post-receive
```
さいごに、GitHubからローカルに「testing」をcloneして、configファイルを編集します。
cloneする場所はホームディレクトリー直下の「git」フォルダー配下にしています。

```bash:~/git/testing/.git/config
[remote "origin"]
  url = https://{username}@github.com/{username}/testing.git
  url = ssh://user@hostname:port/var/www/testing.git ←この行を追加
  ...
```
user、hostname、portは、VPSのものです。
ローカルの`~/.ssh/config`にあわせて変更してください。

# 補足
1人だけで作業するのであればこれで問題ないと思います。
が、複数人でデプロイしあうには不十分なので、[Netlify](https://www.netlify.com/)などをご検討ください。

# 参考
- [SourceTreeでGit psuh（プッシュ）するとサーバー環境に自動でデプロイ！](http://tsudoi.org/weblog/?p=4441)
- [gitでシンプルなデプロイ環境を作る](http://qiita.com/zaburo/items/8886be1a733aaf581045)
- [Gitのbareリポジトリとnon-bareリポジトリ](http://syossan.hateblo.jp/entry/2016/01/08/120940)
- [gitで自動デプロイ環境構築(bare,hook)](http://www.takunoko.com/blog/git%E3%81%A7%E8%87%AA%E5%8B%95%E3%83%87%E3%83%97%E3%83%AD%E3%82%A4%E7%92%B0%E5%A2%83%E6%A7%8B%E7%AF%89barehook/)
Node Express のルート・ハンドラーとミドルウェアの設定

Node.js の Expressフレームワークの特徴の一つとして、ルート・ハンドラー と ミドルウェア設定がある。この二つの機能を試して備忘録です。

## サーバー側のコード
ミドルウェア設定は、イベントが発生した時に共通して実行されるコールバック・ルーチンです。そして、ルート・ハンドラは、指定したURLアドレスをリクエストすると、コールバックされるルーチンです。ルート・ハンドラーの app.getの第一パラメータの '/user/:id' の ':id' は、このURL部分は、req変数へセットされます。 実際の動きは、実行結果を参照ください。

~~~
// Expressフレームワーク                                                                           
var express = require('express');
var app = express();

// ミドルウェアの設定                                                                              
app.use(function (req, res, next) {
    console.log('Time:', Date.now());
    console.log("URL = ", req.url);
    next();
});

// ルート・ハンドラーの設定                                                                        
app.get('/user/:id', function (req, res, next) {
    console.log('User ID:', req.params.id);
    next();
}, function (req, res, next) {
    res.send('User Info');
});

// ルートのみ設定                                                                                  
app.get('/company/:id', function (req, res) {
    console.log('Company ID:', req.params.id);
    res.send('Company Info');
});

// イベント待機                                                                                    
app.listen(3000);
~~~

## クライアント側コード
GET要求を実行します。 以下のコードのURLの /user/0123ae0 の user に続く部分は前述の :id に該当します。 

~~~
var http = require("http");
url = 'http://192.155.208.116:3000/user/0123ae0'
console.log("url: ", url);

// GETの要求処理                                                                                   
http.get(url, function(res){
    console.log("応答コード: ", res.statusCode);
    res.setEncoding('utf8');
    // GETの応答処理                                                                               
    res.on('data', function(chunk){
        console.log("応答BODY: ",chunk);
    });

}).on('error', function(e) {
    console.log("エラー発生: ", e.message);
});

~~~
以下同様に、company に続く部分が サーバー上で id へセットされます。

~~~
url = 'http://192.155.208.116:3000/company/45983750'
~~~


## 実行結果 user
クライアント側の実行結果

~~~
$ ./e40_client.js
url:  http://192.155.208.116:3000/user/0123ae0
応答コード:  200
応答BODY:  User Info
~~~

サーバー側の実行結果で、User ID にセットされている事がわかります。
~~~
Time: 1494159120433
URL =  /user/0123ae0
User ID: 0123ae0
~~~


## 実行結果 company
クライアントの実行結果

~~~
$ ./e41_client.js
url:  http://192.155.208.116:3000/company/45983750
応答コード:  200
応答BODY:  Company Info
~~~
同様にCompanyコードが取得できています。

~~~
Time: 1494159133404
URL =  /company/45983750
Company ID: 45983750
~~~

## 参考資料
* [Express ガイド ミドルウェアの使用](http://expressjs.com/ja/guide/using-middleware.html)
Propertyに動的にアクセスする

各種Fwを自作してたりすると、Propertyに動的にアクセスするための手段がしばしば必要になります。
PropertyInfo.SetValue/GetValueでも実現できるのですが、実行速度がｲﾏｲﾁなのでDelegateを作成することをよくやります。


##通常
Delegate.CreateDelegateを利用して、Propertyのgetter/setterをFunc/Actionとして取得します。

```csharp
public static Func<TObj, TProp> GetGetter<TObj, TProp>(string propName)
    => (Func<TObj, TProp>)
        Delegate.CreateDelegate(typeof(Func<TObj, TProp>),
            typeof(TObj).GetProperty(propName).GetGetMethod());

public static Action<TObj, TProp> GetSetter<TObj, TProp>(string propName)
    => (Action<TObj, TProp>)
        Delegate.CreateDelegate(typeof(Action<TObj, TProp>),
            typeof(TObj).GetProperty(propName).GetSetMethod());
```


##PCLの場合
PCLではDelegate.CreateDeleagteメソッドがないため、少しアクセス方法が変わります。

```csharp
public static Func<TObj, TProp> GetGetter<TObj, TProp>(string propertyName)
    => (Func<TObj, TProp>)
        typeof(TObj).GetTypeInfo().GetDeclaredProperty(propertyName).GetMethod
                    .CreateDelegate(typeof(Func<TObj, TProp>)));

public static Action<TObj, TProp> GetSetter<TObj, TProp>(string propertyName)
    => (Action<TObj, TProp>)
        typeof(TObj).GetTypeInfo().GetDeclaredProperty(propertyName).SetMethod
                    .CreateDelegate(typeof(Action<TObj, TProp>)));
```

なお、作成したDelegateは適宜Cacheしておきましょう。
また、Propertyにはgetter/setterがない場合もあるので、目的によってはPropertyInfo.CanRead/CanWriteプロパティーを利用してアクセスできるかを確認するのも必要になるかもしれません。
Python 3 での Unicode に関する備忘録

# Unicode 文字の名前を取得する

[unicodedata.name()](https://docs.python.jp/3/library/unicodedata.html#unicodedata.name) を使用する。

```py
>>> import unicodedata

>>> unicodedata.name('s')
'LATIN SMALL LETTER S'
>>> unicodedata.name('す')
'HIRAGANA LETTER SU'
>>> unicodedata.name('🍣')
'SUSHI'
>>> unicodedata.name('🍣🍣')
TypeError: name() argument 1 must be a unicode character, not str
```

# 名前から Unicode 文字を取得する

[unicodedata.lookup()](https://docs.python.jp/3/library/unicodedata.html#unicodedata.lookup) を使用する。

```py
>>> import unicodedata

>>> unicodedata.lookup('LATIN SMALL LETTER S')
's'
>>> unicodedata.lookup('HIRAGANA LETTER SU')
'す'
>>> unicodedata.lookup('SUSHI')
'🍣'
>>> unicodedata.lookup('SUSI')
KeyError: "undefined character name 'SUSI'"
```

また `\N{名前}` というエスケープシーケンスを使用して Unicode 文字を指定することもできる。

```py
>>> '\N{SUSHI}'
'🍣'
>>> '\N{SUSI}'
SyntaxError: (unicode error) 'unicodeescape' codec can't decode bytes in position 0-7: unknown Unicode character name
```

# Unicode 文字のエスケープシーケンスを取得する

[str.encode()](http://docs.python.jp/3.6/library/stdtypes.html?highlight=encode#str.encode) を使用する。第 1 引数には `unicode-escape` を指定する。

```py
>>> 's'.encode('unicode-escape')
b's'
>>> 'す'.encode('unicode-escape')
b'\\u3059'
>>> '🍣'.encode('unicode-escape')
b'\\U0001f363'
```

返り値は [bytes](http://docs.python.jp/3.6/library/functions.html#bytes) 型である。ここでエスケープシーケンスについて補足説明する。

## \u について

`\u3059` のように `\u` の後ろに 4 個の 16 進数が続くエスケープシーケンスは、[基本多言語面](https://ja.wikipedia.org/wiki/%E5%9F%BA%E6%9C%AC%E5%A4%9A%E8%A8%80%E8%AA%9E%E9%9D%A2) のいずれかに含まれる文字に該当する。最初の 2 桁が面番号を、後半の 2 桁がその面の中でのインデックスを表す。

## \U について

`\U0001f363` のように `\U` の後ろに 8 個の 16 進数が続くエスケープシーケンスは、基本多言語面より上位の面に位置する文字に該当する。なお左端の数字は必ず 0 である。

## 文字列の len について

```py
>>> type('🍣')
<class 'str'>
>>> len('🍣')
1
>>> len('\U0001f363')
1
>>> len('寿司')
2
```

Unicode 文字列の長さは文字数を表す。

対して str.encode() の返り値は bytes 型なので、長さはバイト数を表す。

```py
>>> import binascii

>>> encoded = '🍣'.encode('unicode-escape')
>>> encoded
b'\\U0001f363'
>>> type(encoded)
<class 'bytes'>
>>> len(encoded)
10
>>> binascii.b2a_hex(encoded)
b'5c553030303166333633'  # 16 進数に変換するとたしかに 10 バイト

>>> '🍣'.encode('UTF-8')
b'\xf0\x9f\x8d\xa3'  # 4 バイト
>>> len('🍣'.encode('UTF-8'))
4
```

# Unicode 正規化

任意の形式で [正規化](https://ja.wikipedia.org/wiki/Unicode%E6%AD%A3%E8%A6%8F%E5%8C%96) するには [unicodedata.normalize()](https://docs.python.jp/3/library/unicodedata.html) を使用する。第 1 引数に正規化形式を指定する。

```py
>>> import unicodedata

>>> po = 'ポ'
>>> po_nfc = unicodedata.normalize('NFC', po)
>>> po_nfc 
'ポ'
>>> po_nfd = unicodedata.normalize('NFD', po)
>>> po_nfd
'ポ'
>>> po_nfc == po_nfd
False
>>> len(po_nfc)
1
>>> len(po_nfd)
2

>>> unicodedata.normalize('NFD', 'ポ') == unicodedata.normalize('NFKD', 'ﾎﾟ')
True
>>> unicodedata.normalize('NFC', 'ポ') == unicodedata.normalize('NFKC', 'ﾎﾟ')
True

>>> unicodedata.decomposition('ポ')  # decomposition() は分解マッピングを返す。
'30DB 309A'
>>> 'ポ' == unicodedata.normalize('NFC', '\u30DB\u309A')
True
```

# 参考

* <i class="fa fa-fw fa-book"></i>[入門 Python 3](https://www.oreilly.co.jp/books/9784873117386/)
  * 「7.1.1 Unicode」 
* [Unicodeの特殊な文字 “結合文字列”](http://tama-san.com/combining_character_sequence/)
firefoxのWeb Extensionsのtabs APIのtips

Web Extensitons でfirefoxのアドオンを作って、詰まった諸々をメモ

https://github.com/thrakt/load-nexttab-firefox
https://github.com/thrakt/hatenabookmark-show-count-firefox

## `tabs`はbackgroundでしか動かない

`permissions`でtabsを追加しても、`background`で動かしているスクリプト配下でしか`browser.tabs`は見えない。

https://developer.mozilla.org/ja/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Background_scripts

## 未読タブを識別する方法はないっぽい

firefoxは開いたタブをセッションとして保存でき、再起動時に同じタブを開いた状態で再開できる。しかし、再開時は開いていないタブは未読み込み状態になる。これを識別する方法が見つからなかった。

https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs/TabStatus

一度開いたタブは`complete`になってしまう。作ったアドオンでは、グローバル変数に実際に読み込んだタブを記録してなんとかしましたが、どうだろう……。

## `tabs.onCreated`は起動時に全タブで呼ばれる

https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs/TabStatus

`tabs.onCreated`はタブの作成時に発行されるイベントですが、起動時に全タブで呼ばれます。起動時は呼ばなくていいんだけど、起動後に新しいタブを追加した時は呼びたい、みたいな時に困る。

DOMの`load`イベント的な、ブラウザの起動処理が終わった後に呼ばれる物が欲しかったんだけどないっぽい。`runtime.onStartup`で行けるかと思ったら、本当に起動時に呼ばれてしまうので意味がない。

挙動を見たところ、次の順で呼ばれる。

* `runtime.onStartup`
* `tabs.onCreated` 全タブ
* `tabs.onActivated`

`tabs.onActivated`はタブ移動時に毎回呼ばれますが、起動時にも1度呼ばれます。なので、`tabs.onActivated`で一回だけイベントリスナへの追加をすれば先述の挙動は作れる。これでとりあえず解決。

https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs/onActivated

## `tabs.onActivated`は読み込み前に呼ばれる

`tabs.onActivated`はタブの読み込み完了前に呼ばれます。タブ作成時の`tab.url`は`about:blank`なので、ここに依存する処理を書くと困る。

タブの作成時の動きとして、

1. `tab.url`が`about:blank`で、`tab.status`が`complete`
2. `tab.url`が開くURLになり、`tab.status`が`loading`
3. 読み込み完了後、`tab.status`が`complete`になる

となる。なので、`tabs.onUpdated`で呼ばれるようにして、読み込み完了後に処理するようにする。

```js
browser.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  if (tab.status === 'complete' && tab.url.startsWith('http')) {
    // something to do
  }
});
```

という感じ。
RailsプロジェクトにRSpecを導入(ほぼ最小構成)

### Gemfileに記述
---
rspecとテストデータ生成に使うfactory_girlを導入
ほぼ最小構成。

```rb:Gemfile
group :development, :test do
  gem 'rspec-rails', '~> 3.5'
  gem "factory_girl_rails"
end
```

### RSpec初期化
---
インストールコマンドを打って初期化、ヘルパーを生成します。

``` $ bundle exec rails generate rspec:install ```

```rb:result
      create  .rspec
       exist  spec
      create  spec/spec_helper.rb
      create  spec/rails_helper.rb
```

### 使ってみる 
---
``` $ rspec spec/* ```


### コラム
---
#### 結果出力の設定
.rspecに ``` --color ``` を追加しておく
テストの成否を緑/赤で表示するようになり、赤（失敗時）のみ詳細を出すようになる
レシートをデータベースに保存して家計簿的な感じにしたい その1 データベース設計

データベースの勉強をしたい！＋ひとり暮らしだしお金の動きを把握しなきゃ...＝タイトルの発想に行き着きました。
昔からレシートは取っておく派でしたので、データはいっぱいあります。
今はバイクが欲しいので、買うまでのプランとか作るところまでしたいなーと思ってます。

今回はデータベース設計です。

#データベース設計
データは基本集めたレシートのみを使う予定なので、レシートをいい感じに保存したいです。
データベースは全然の素人ですが、手持ちの知識で頑張って考えました。（数時間かかった気がする）

###レシートテーブル
|レシートID|日時|店舗ID|支払金額|支払い方法ID|
|---|---|---|---|---|
|どのレシートか|いつ買ったか|どの店舗か|実際に払った金額|電子マネー使用回数とか見たい|
割り勘とかのレシートもあるので、払った文を支払金額として入れます。（実際古い割り勘時の払った額とか覚えてないけど）
合計金額は他のテーブル使えば出せるので。

###店舗テーブル
|店舗ID|店名ID|店舗名ID|
|---|---|---|
|どの店舗か|コンビニの名前とか|◯◯店とか|
店舗限らず、どの店で多く買ってるかも見れればなーと。
違う店名で店舗名かぶるかな−と思って店舗名テーブル作りましたが、かぶらなそう...

###店名テーブル
|店名ID|店名|
|---|---|
|どの店名か|店名文字列|

###店舗名テーブル
|店舗名ID|店名|
|---|---|
|どの店舗名か|店舗名文字列|

###商品個数テーブル
|レシートID|商品ID|個数|
|---|---|---|
|どのレシートか|どの商品か|いくつ買ったか
これはほぼどの商品も１個だと思うので、あんま意味ない気もしてます...

###商品金額テーブル
|レシートID|商品ID|金額|
|---|---|---|
|どのレシートか|どの商品か|いくらか
この商品関係でかなり悩みました。
金額は、１個あたりの値段です。

###商品テーブル
|商品ID|商品名|
|---|---|
|どの商品か|商品名文字列|
分類とかもつけるかは決めかねてますが、とりあえず無しで行きます。

###支払い方法テーブル
|支払い方法ID|支払い方法|
|---|---|
|どの支払い方法か|支払い方法文字列|

#次回の予定
実際にデータベースを作ってみたいと思います。
使うRDBMS？は、MySQLの予定です。（無難みたいなので）
変なところがありましたら、教えていただけるとうれしいです。
失礼します。:walking_tone1:
unityでＶRアプリを作ろう　その2

# 目次

- 環境

- インストール

- プロジェクト作成

- 動かしてみる

- VRアプリを作ってみる


# プロジェクト作成

![プロジェクト作成.png](https://qiita-image-store.s3.amazonaws.com/0/155640/fc1a9f24-1499-a414-1e29-2f262b5f7af0.png)

プロジェクト名：testとした
3Dプロジェクトで作成。

->Create Project


## VRSDKをインポート
Assets > Import Package > Custom Package. で GoogleVRForUnity.unitypackageを選んでインポートする

![vrsdk.png](https://qiita-image-store.s3.amazonaws.com/0/155640/97363f94-1d35-12da-efc5-99e144024479.png)


全部はいらないとおもうが、いれとく。Import。

# ビルド設定

[file]->
[Build setting]

- android を選択 Switch Platform

- Player Setting 
InspectorでOtherSetting [Virtual Reality Supported]をチェック
Cardboadを選択する

![inspector.png](https://qiita-image-store.s3.amazonaws.com/0/155640/0a51933c-afb9-2a32-8b35-6e16ec9c70fc.png)

- package name をつける。(com.ドメイン.プロジェクト名) サンプルなら適当でもいい

- Minimum API levelをAndroid 4.4 "kitkat" (API level19)に変更


# 動かしてみる
sdkがないといわれたら
androidsdk
https://developer.android.com/studio/index.html
をインストール
Unity>preference>Externall tools>SDK部分にインストールした場所を入力
例：/Users/＊＊＊/Library/Android/sdk


Unable to list target platforms. Please make sure the android sdk path is correct. の解決方法は以下を参考にいたしました。
http://qiita.com/niusounds/items/bcbeee622b2114b4016e

実機でうごいた
![Screenshot_2017-04-29-22-14-41.png](https://qiita-image-store.s3.amazonaws.com/0/155640/33c67744-ab20-0f0a-82d3-3c660a94baa5.png)
unityでＶRアプリを作ろう　その1

# 概要

VRアプリを作ってみたい。そんなことを思って書いてみた。
自分用のただのメモとして書いてきます。


# 目次

- 環境

- インストール

- プロジェクト作成

- 動かしてみる

- VRアプリを作ってみる


# 環境

- MacBookPro(macOS Sierra)
- android 7.0
- VR(Cardboard、ハコスコなどみれるもの)
- Unity 5.6.0b11
- Google VR SDK for Unity
- Android SDK(Android Studioから）
# インストール

- VRアプリを作るためにUnityとVR用のSDKをインストールします。(macを使っているので、windowsを使ってる人はそれ用に置き換えて。)


### Google VR SDK for Unity

https://developers.google.com/vr/unity/

ここからDownload the [Google VR SDK for Unity.]をクリック->[Download SDK]でダウンロードする。(とりあえずダウンロード ファイル名：GoogleVRForUnity-2.unitypackage）

この中で、
>Using the native integration requires the Unity 5.6 beta. The Google VR SDK requires Unity 5.2.1 or later.

(ネイティブインテグレーションを使用するには、Unity 5.6ベータ版が必要です。Google VR SDKには、Unity 5.2.1以降が必要です。)

と書いてあるので
Unityは5.6β以上をインストールする。

### Unity

https://unity3d.com/jp/unity/beta

からUnityDownloadAssistant-5.6.0b11.dmgをダウンロードしてインストーラに従ってインストール。
今回はUnity 5.6.0b11(2017/3/12現在最新)を使用する。








![インストーラ.png](https://qiita-image-store.s3.amazonaws.com/0/155640/42a783a0-cae0-b568-d7f9-32f46b124300.png)

-> Unity DownloadAssistant.app をクリック

->“Unity Download Assistant.app”はインターネットからダウンロードされたアプリケーションです。開いてもよろしいですか?
->開く
->Continue
->Continue
->Agree
->必要なものをインストール
今回は以下をインストールした

- Unity 5.6.0b11 (本体)

- Standard Assets (標準でついている素材)

- Example Project (サンプル)

- Android Build Support (アンドロイド用ビルド)


->Continue
->Continue
リクルートWEBサービスとContent-Typeについて

リクルートWEBサービスでJSONを取得した場合のContent-Typeがなぜかapplication/jsonではなくtext/javascriptになっているという話です。

#リクルートWEBサービスについて
[リクルートWEBサービス](https://webservice.recruit.co.jp/about.html)はリクルートが提供しているWeb APIサービスです。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/176811/a8d2829d-80e1-5c50-a62e-5264ade51378.png)

左上青色欄に記載されているAPIはおそらくリクルート内製のもので、リクエストやレスポンスの形がおおよそ統一されています。
レスポンスの形式にはXML,JSON,JSONPの３種類が選択ができます。
旅行検索やグルメ検索などのAPIが提供されており、
メールアドレスを登録してAPIキーを発行してもらうだけで誰でも簡単に利用できます。

左側灰色欄に記載されているAPIは少し勝手が違うようで、リクエストやレスポンスの形が少し異なります。

本記事では青色欄にあるAPIのレスポンスのContent-Typeを確認していきます。

#XMLデータ取得
ここでは[Restlet Client - REST API Testing](https://chrome.google.com/webstore/detail/restlet-client-rest-api-t/aejoelaoggembcahagimdiliamlcdmfm)というChrome拡張機能を使って青色欄APIにリクエストを投げます。
デフォルトの戻り型がXMLなので、普通にリクエストを投げます。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/176811/db7e89e3-89cd-2c6b-662c-13b13176e78e.png)
APIキーは一応塗りつぶしています。
レスポンスのボディを見ると、XML形式で返ってきていることが分かります。
Content-Typeはapplication/xmlとなっています。
調べてみると、[XMLのContent-TypeはRFC7303でapplication/xmlが推奨されている](http://toricor.hatenablog.com/entry/2016/01/08/155511)らしいです。

#JSONデータ取得
続いてJSON形式の戻り値を取得します。
リクエストの末尾に&format=jsonを追加してJSON形式のレスポンスを要求します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/176811/cce2c625-e36d-5b92-328d-f282378d6100.png)
まずレスポンス右側のボディを見ると、なにやらJSONらしきデータが返ってきてはいるのですが、ごちゃごちゃとしていて見辛いです。Restlet Clientは通常JSONで返されたデータを整形して表示してくれるのですが、このデータはなぜか整形してくれていません。
レスポンス左側のContent-Typeを見てみると、「text/javascript」となっています。

調べてみると、[JSONのContent-TypeはRFC4627で「application/json」と定められている](http://www.ietf.org/rfc/rfc4627.txt)ようです。
つまり、Content-Typeが合っていないためにRestlet ClientがJSONとして認識できていないため整形が効いていないようです。

ちなみにリクルートWEBサービスの灰色欄にあるイベントサーチAPI(ATND BETA)なんかはJSONを要求した場合Content-Typeをapplication/jsonにして返してくれているようで、整形もちゃんと効いています。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/176811/bd1dcdb0-4eb0-56fc-0b08-3f66e240b036.png)


#JSONPデータ取得
最後に、リクエストの末尾を&format=jsonpにしてJSONP形式のレスポンスを要求します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/176811/849025da-f541-4100-8b85-bcf074d79c64.png)
ボディにはJSONPらしきものが入っていて、Content-Typeはtext/javascriptとなっています。
調べてみると、JSONPは[RFCではContent-Typeの規定が定められておらず](http://www.wdic.org/w/WDIC/JSONP)、[かつてちゃんと規定しようと動きがあったものの結局定まらないままtext/javascriptが巷で使われている](https://en.wikipedia.org/wiki/JSONP#Security_concerns)という状態のようです。
なのでJSONPのContent-Typeに関しては正しくはないにせよ間違ってはいなさそうです。
整形してくれないのは単にRestlet Clientが対応していないだけでしょう。

#まとめ
取得データ型とそのContent-Typeをまとめるとこうなります。

|  |XML |JSON  |JSONP  |
|---|---|---|---|
|リクルートWEBサービス(青)  |application/xml |text/javascript |text/javascript |
|RFC  |application/xml |application/json  |規定なし |

Content-Typeが正しく設定されていないとアプリが想定通りの動作をしてくれないことがあるのでご注意を。
Commit hash から GitHub の Pull Request を開くコマンドラインツール whichpr を作った

## なにこれ

コミットハッシュから GitHub の Pull Request を開くコマンドラインツールを作りました。

レポジトリはこちら: https://github.com/pocke/whichpr


## 欲求


`git blame` で変更がどのコミットで行われたのかを知ることが出来ても、より詳細な情報を知るために「どの Pull Request でそのコミットがなされたか」を知りたい場合があります。
このツールはそのような場合に Pull Request を素早く開くために作成されました。


## Installation

Go で書かれているので、`go get` でインストールします。

```bash
go get github.com/pocke/whichpr
```


## Usage

コミットハッシュ値`XXXXXXX`がコミットされた Pull Request を開くには、以下のようにします。


```bash
$ whichpr open XXXXXXX
```

このコマンドを実行すると、Pull Request がブラウザで開かれます。

### Vim integration

また、whichpr は下記を`.vimrc`に追加することで Vim プラグインとして動作します。

```vim
set rtp+=~/path/to/pocke/whichpr/

" キーバインドを設定したい場合の例
nnoremap <F5> :call whichpr#open()<CR>
```

`:call whichpr#open()`を呼び出すことで、その行が最後に変更された Pull Request を開くことが出来ます。


なお、Vim 連携のコードは8行しかありません。
https://github.com/pocke/whichpr/blob/master/autoload/whichpr.vim
他のエディタでも同様の機能を実装するのは簡単だと思います。



## 認証

初回利用時には認証が必要です。
GitHub のユーザー名、パスワードを聞かれるので、入力して下さい。


## Alternative

http://qiita.com/awakia/items/f14dc6310e469964a8f7

上記記事の方法を使うことでも同様のことが行なえますが、whichpr とは以下の違いがあります。


- API リクエストの有無
    - 上記記事の方法では API リクエストを行いませんが、whichpr ではリクエストを行います。
- squash merge への対応
    - 上記記事の方法では squash merge には対応出来ないが、whichpr では API リクエストを行うため対応しています。
    - squash merge の場合コミットメッセージに Pull Request number が入らないことがあるため、 API リクエストを行わないと Pull Request number を取得できません。
        - 例) https://github.com/bbatsov/rubocop/commit/4430501c3da3d7248e464345296e6f88eafc87db
Marx - 最小限のコードで小奇麗にできるCSSライブラリ

# Bootstrapはすてき

私はBootstrapを使って管理画面を何個か実装してきました。Bootstrapは小奇麗な画面を作れますし、広く使われていて安心感があります。

---

# 一方でBootstrapには疑問も

Bootstrapにはパネル・フォーム・ボタングループ等の便利なコンポーネントが含まれていますが、所詮は管理画面ですから、便利にしても売上につながるわけではありません。

また、`<a class="btn btn-primary">` のようにデザインのためのクラスを細かく指定するのも無駄だと感じていました。

---

# Marx

そこで紹介したいのが、[Marx](https://mblode.github.io/marx/)です。

<a href="https://mblode.github.io/marx/">
![image.png](https://qiita-image-store.s3.amazonaws.com/0/179154/d13f530f-ebb6-15ce-b668-a87d0bbd9d3f.png)
</a>

---

以下が、公式ページに載っているテンプレです。
なんと**クラス指定は１個もありません**。
`<main>`、`<nav>`、`<ul>` などのHTML5標準のタグを使うだけで、そこそこ格好いい画面を作れます。

```
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>Marx Template</title>

  <!-- Marx CSS -->
  <link rel="stylesheet" href="css/marx.min.css">
</head>

<body>
  <!-- main is the container -->
  <main>
    <!-- Navigation -->
    <nav>
      <ul>
        <li><a href="#"><b>First</b></a></li>
        <li><a href="#">Second</a></li>
        <li><a href="#">Third</a></li>
        <li><a href="#">Fourth</a></li>
      </ul>
    </nav>

    <!-- article -->
    <article>
      <h1>Article</h1>
    </article>

    <!-- aside -->
    <aside>
      <h1>Aside</h1>
    </aside>

    <!-- section -->
    <section>
      <h1>Section</h1>
    </section>

    <!-- footer -->
    <footer>
      <p>&copy; Matthew Blode 2016</p>
    </footer>
  </main>

</body>
</html>
```

---

もちろん、実際の開発ではいくつかクラスを追加していく必要があるでしょう。

そのうちやっぱりBootstrapのコンポーネントが欲しいと思うかもしれません。

しかし、最初はMarxでスモールスタートも良いのではないでしょうか？
後からクラスを追加するのは簡単ですから。
mmap時の権限エラー

# 事象
ファイルをopenして、mmapで読み込もうとしてもエラーになってしまった。errnoで確認すると、コード13エラーであった。

# コード

```c:test.c
#include <unistd.h>
#include <sys/stat.h>
#include <sys/mman.h>
#include <stdio.h>
#include <fcntl.h>
#include <errno.h>

int main(void)
{
        int number;
        int fd = open("test.txt", O_WRONLY);
        struct stat stbuf;
        char *addr;
        if(fstat(fd, &stbuf) == -1){
                printf("error\n");
        }
//        printf("stbuf.st_size: %ld\n", stbuf.st_size);
        addr = mmap(NULL, stbuf.st_size, PROT_READ, MAP_PRIVATE, fd, 0);
        number = errno;
        if(addr == MAP_FAILED){
                printf("print error code: %d\n", number);
        }

        close(fd);
        return 0;
}
```

## 実行結果
```
print error code: 13
```
13は参考(5)によると権限エラー

# 原因
`open` するときの権限が間違っていた。
(1)にある通り、以下。コード中では書き込み権限で `open` していたが、mmapでは読み取りで開いていた。

```
引き数 prot には、マッピングのメモリー保護をどのように行なうかを指定する (ファイルのオープンモードと矛盾してはいけない)
```

## 対処
`open` 関数の第二引数を `O_RDWR` にした

# 参考
(1)Man page of MMAP https://linuxjm.osdn.jp/html/LDP_man-pages/man2/mmap.2.html

(2)O_WRONLY https://linuxjm.osdn.jp/html/LDP_man-pages/man2/open.2.html

(3)IBM Knowledge Center - mmap() - メモリーのページのマップ https://www.ibm.com/support/knowledgecenter/ja/SSLTBW_2.2.0/com.ibm.zos.v2r2.bpxbd00/mmap.htm

(4)errnoでエラーを確認する - Qiita http://qiita.com/ota42y/items/b2f59d7a82c550648677

(5)errnoの値の定義を探す - Qiita http://qiita.com/h2suzuki/items/0cc924cdd9d5c6d47448

(6)Gaucheからmmapを使ってみる１ - びぼうろく http://d.hatena.ne.jp/herrmrnmrm/20120922/1348338227
nvcc fatal   : The version ('80100') of the host compiler ('Apple clang') is not supported

#MacBookProでCUDAコンパイルしようとした所エラーが出たのでその対処法について
エラー内容
nvcc fatal   : The version ('80100') of the host compiler ('Apple clang') is not supported

OSをsierraに変えた事で，以前まで問題なかったMacBookProでCUDAのコンパイルができなくなりました．

原因を探した所，CUDAがコンパイルする際に関連しているXcodeのライブラリが，最新版だとCUDA側が対応していない様子です．
>$ clang --version
Apple LLVM version 8.1.0 (clang-802.0.42)

そこで，[appleのDeveloper](https://developer.apple.com/download/more/)サイトからv7.3.1のCommand Line toolsをダウンロードしてインストールします．

<img width="500" alt="commandlinetools.jpeg" src="https://qiita-image-store.s3.amazonaws.com/0/179772/3502bb51-3194-c7a6-3610-0d4ea30c7ae3.jpeg">

インストールが終わったら，
>$ sudo xcode-select --switch /Library/Developer/CommandLineTools

のコマンドで，バージョンを差し替えることで，

>$ clang --version
Apple LLVM version 7.3.0 (clang-703.0.31)

とバージョンを落とす事ができ，これで無事コンパイルできました．

MacでCUDAを使うには2014年前後のMacBookProしかハードがないため，このエラーに当たる人がそもそも少ないのでしょうか・・・
golangの配列/連想配列で困ったこと

[jsonbase](https://github.com/intelfike/jsonbase)とか言うjsonを簡単に扱うためのライブラリを自作しましたが、配列と連想配列を同じ様に扱ったら困ったので書きます。

結論からいうと、アドレスの取り出しの可否という違いがありました。

# サンプル
## 配列

```go
ar := []int{10, 20, 30}
mp := map[int]int{0: 10, 1: 20, 2: 30}
```
機能的には同一のものを用意。

そこからポインタを取り出す。

```go
ar := []int{10, 20, 30}
arp := &ar[0]
*arp++
fmt.Println(arr) // [11 20 30]
```
https://play.golang.org/p/EQu0GN8aTA

普通ですね。
配列の要素のポインタを取り出して値を書き換えると、配列の要素が書き換わります。

## 連想配列
次に連想配列です。

```
mp := map[int]int{0: 10, 1: 20, 2: 30}
arp := &mp[0]
*arp++
fmt.Println(mp) // tmp/sandbox429707758/main.go:7: cannot take the address of mp[0]
```
https://play.golang.org/p/z3QOBxq7FY

結果がエラーになりました。
Map(連想配列)からはアドレスを取り出せないみたいです。

### エラーが起きないように調整

```
mp := map[int]int{0: 10, 1: 20, 2: 30}
arp := mp[0]
arp++
fmt.Println(mp) // map[0:10 1:20 2:30]
```
https://play.golang.org/p/913B93j-Vr

当たり前ですが、無意味でした。
いろいろ試しましたが、連想配列では値コピーでしか値を取り出せないため、アドレスを取得することができませんでした。

最初からアドレスを格納すれば？という話ですが、自作のjsonbaseはencoding/jsonパッケージを使っているので自動的に値として連想配列に格納されます。

# まとめ

この仕様がなければ、jsonbaseでSetやGetのたびに再帰的にたどるのではなく、子要素をたどるたびにそのポインタを取り出して操作するという非常に単純なものにできました。
連想配列の仕組み的にこうするしかなかったんでしょうかね。

再帰的に連想配列の値を取得して、その値をポインタ変数の値として格納しなおした新しい連想配列を返す、みたいなライブラリがどこかにないかな...とか思ったりしています。
reflect必須ですね。
Vagrantで立てたCentOSにLAMP環境を構築する

Vagrantで立てたCentOSにLAMP環境を構築します。

[環境]
Windows10
Vagrant 1.9.4
VirtualBox 5.1.22
CentOS 6.4
Apache 2.2.15
MySQL 5.1.73
PHP 5.3.3

## 1. VagrantでCentOSを立てる
こちらの記事を参考にしてください。

[VagrantでWindows10にCentOSを立てる](http://qiita.com/sanotyan1202/items/aa146e5fe3b22d68c6b3)

## 2. Apacheをインストールする
yumを使ってApacheをインストールします。

```　bash:CentOS
$ sudo yum install httpd
```

### private_networkを有効にする
vagrant upを実行したディレクトリのVagrantfileのprivate_networkのコメントを外します。

```ruby:Vagrantfile
config.vm.network "private_netowork", ip: "192.168.33.10"
```
private_networkを有効にすると、ホストPCとゲストPC(Vagrantで作成した仮想環境)の間でだけで有効なプライベートIPが割り振られます。
Vagrantfileを変更したら、ホスト側でreloadコマンドを実行します。

```bash
$ vagrant reload
```

### Apacheの実行
private_networkを有効にしたらApacheを起動します。

```bash:CentOS
$ sudo service httpd start
```
ホスト側のブラウザで192.168.33.10にアクセスして、Apache2 Test Pageが表示されたら成功です。

## 3. MySQLとPHPをインストールする
どちらもyumでインストールできます。

```bash:CentOS
$ sudo yum install php

$ php -v   # バージョンが表示されたらOK
```

```bash:CentOS
$ sudo yum install mysql-server

$ sudo service mysqld start  # 正常にスタートされたらOK

```
以上でLAMP環境が整いました。

## 4. 共有フォルダ設定
VagrantではホストPCとゲストPCの間で共有ディレクトリを設定することができます。
これにより、作成したファイルをscpコマンドでコピーする手間を省くことができます。
VagrantfileのSynced_folderのコメントを外します。

```ruby:Vagrantfile
config.vm.synced_folder "../data", "/vagrant_data"
```
第1引数でホスト側、第2引数でゲスト側のディレクトリを指定します。
ゲスト側のディレクトリは自動で作成されますが、ホスト側は自作しないといけないので注意してください。
Vagrantfileを書き換えたのでreloadコマンドを実行します。

```bash
$ vagrant reload
```
### 共有フォルダにシンボリックリンクを設定する
共有ディレクトリにシンボリックリンクを設定することで作成したファイルをすぐに公開することができます。

```bash:CentOS
$ rm -rf /var/www/html

$ ln -fs /vagrant_data /var/www/html

$ sudo service httpd start
```
ホスト側で共有ディレクトリにPHPファイルを作成してみましょう。

```php:../data/index.php
<?php
  echo "Hello World!";
```
ブラウザで192.168.33.10にアクセスし、Hello World!が表示されたら成功です。
Node.js Express で HTTPSを利用するパターン

Node.js Expressフレームワークで、HTTPSサーバーを起動する方法の忘備録です。

## Express HTTPサーバーを起動するパターン

~~~
// Expressフレームワーク
var express = require('express');
var app = express();

// ルート設定
app.get('/rest', function (req, res) {
  res.send('Hello World!');
});

// イベント待機 
app.listen(3000);
~~~


## Express HTTPSサーバーを起動するパターン
事前準備として、DNS名を取得して証明書を取得しておきます。HTTPSサーバーと通常のHTTPサーバーとの違いは、HTTPSサーバー起動の部分です。

~~~
// Expressフレームワーク                                                                           
var express = require('express');
var app = express();

// HTTPSサーバー起動                                                                               
var fs = require('fs');
var https = require('https');
var options = {
  key:  fs.readFileSync('../lets_encript.key'),
  cert: fs.readFileSync('../lets_encript_fullchain.crt')
};
var server = https.createServer(options,app);

// ルート設定                                                                                      
app.get('/rest', function (req, res) {
    res.writeHead(200);
    res.end("Hello World.");
});

// イベント待機                                                                                    
server.listen(3000);
~~~

## 参考資料

* [4.x APIリファレンス app.listen](http://expressjs.com/ja/4x/api.html#app.listen)
* [ガイド ルーティング](http://expressjs.com/ja/guide/routing.html)
sudo docker runを実行して生成するファイルの所有者やグループを実行中のユーザのものにする

`sudo docker run`コマンドを実行してコンテナ内で作られるファイルを、`-v`オプションを利用して、ホスト側のディレクトリに書き出している場合、その所有者はrootユーザとなるようです。

毎回`chown`コマンドを使って、所有者を書き換えるのも手ですが、コンテナの実行をrootではなく、実行中のユーザにする方法があるようなので、それを試して見ました。

# 環境
ubuntu 16.04

# `-u`オプションと`id`コマンドとバッククォートを組み合わせる

以下のようなコマンドを実行すると

```
sudo docker run -u `id -u`:`id -g`
```

結果的には以下のようなコマンドを実行したものとして、処理されます。(`1000`という文字は、ご利用の環境によって違うものとなる可能性もあります。)

```
sudo docker run -u 1000:1000
```

この`1000`という文字は`id -u`というコマンドの出力結果となっています。

試しにターミナルで以下のコマンドを実行してみてください。

```
id -u
```

「1000」などの出力結果が得られると思います。この出力された「1000」という文字が、上記のコマンドの一部として利用されている、という仕組みです。

`-u`オプションを利用すると、コンテナを実行するユーザを指定できます。今回の例では上記コマンドの出力で得られた`1000`が`-u`オプションに渡され、結果的に実行ユーザと同じユーザのファイルが`-v`オプションで指定したホスト側ディレクトリに作成されます。

# 拝見した情報源

## ulrichschreiner/sphinx (Docker Hub)

https://hub.docker.com/r/ulrichschreiner/sphinx/

使用方法に記述されていた`-u`オプションが今回の記事のきっかけとなりました。

```
alias sphinx="docker run -u `id -u`:`id -g` -it --rm -v `pwd`:/doc ulrichschreiner/sphinx"
```

## Docker run リファレンス

http://docs.docker.jp/engine/reference/run.html#run-user

`-u`コマンドの説明が書かれています。

> -u="", --user="": ユーザ名または UID を指定する命令。オプションでグループ名や GUID を指定

`-u`と書く代わりに`--user`と書いても動作するようですね。

```
sudo docker run --user `id -u`:`id -g`
```

## Linuxコマンド集 - 【 id 】 ユーザーIDやグループIDを表示する：ITpro

http://itpro.nikkeibp.co.jp/article/COLUMN/20060227/230799/

`id`コマンドについて解説されています。今回は現在のユーザの情報を利用しました。

> 指定したユーザーIDやグループのIDを表示する。何も指定しないと現在のユーザーの情報が表示される。

## 日時をファイル名に付けるには 

http://www.atmarkit.co.jp/flinux/rensai/linuxtips/240datefilename.html

バッククォートで囲まれた部分が、コマンドの実行結果に置き換わることが、この記事から解釈できます。

> バッククオートを使用すると、コマンドの出力を文字列として扱うことができる。
Mecab - UnicodeDecodeError: 'utf8' codec can't decode byte

```py
import MeCab
tagger = MeCab.Tagger('')

tagger.parse('') # これ重要！！！！

text = u'MeCabで遊んでみよう!'
node = tagger.parseToNode(text)
while node:
    print(node.surface + '\t' + node.feature)
    node = node.next
```

参考：
https://shogo82148.github.io/blog/2015/12/20/mecab-in-python3-final/
openFrameworksによるSonicPiとのOSC通信

openFrameworksによるSonicPiとのOSC通信のメモ
sendMessage()のwrapInBundleをfalseに設定しなければいけない。

https://github.com/enkatsu/SonicPiOSC

```cpp
//--------------------------------------------------------------
void ofApp::setup(){
    // HOSTは"127.0.0.1" PORTは4557
    sender.setup(HOST, PORT);
}

//--------------------------------------------------------------
void ofApp::mousePressed(int x, int y, int button){
    ofxOscMessage message;
    message.setAddress("/run-code");
    message.addStringArg("from oF");
    message.addStringArg("play :C4");
    sender.sendMessage(message, false);
}
```

これでマウスをクリックしたらC4の音がなるはず。
Spring Bootでファイルアップロード(MultipartFileを利用しない)

今回実装するのは以下のような機能です。
・写真をアップロードするAPIを作成する
・MultipartFileを利用せず、バイナリでデータを受け取る
・Java経由で指定ディレクトリにファイルを出力する
・ファイル名は年月日時分秒を自動採番(アップロード元の名前は利用しない)
・バイナリの情報を取得して画像の圧縮形式(拡張子)を取得する
この部分は以下の情報を参考にさせていただきました。
→[バイナリーデータから画像の種類を判別する](http://nodamushi.hatenablog.com/entry/20110121/1295572551)

## 修正するファイル
![1.png](https://qiita-image-store.s3.amazonaws.com/0/110457/ad292d48-0504-633b-538c-7a35dfb5c815.png)

**Controller**

```java:com.example.UsersController.java
@RequestMapping(path = "/users/upload", method = RequestMethod.POST)
public void upload(InputStream req) throws IOException {

	ByteArrayOutputStream byteos = new ByteArrayOutputStream();
	byte[] buf = new byte[1024];
	int size = 0;
	while ((size = req.read(buf, 0, buf.length)) != -1) {
		byteos.write(buf, 0, size);
	}

	String filename = DateTimeFormatter.ofPattern("yyyyMMddHHmmssSSS").format(LocalDateTime.now());
	Path uploadfile = Paths.get("Users/demo-kusa/image" + filename
			+ "." + getFormat(byteos.toByteArray()));

	try (OutputStream os = Files.newOutputStream(uploadfile, StandardOpenOption.CREATE)) {
		os.write(byteos.toByteArray());
	} catch (IOException ex) {
		System.err.println(ex);
	}
}
```

**ImageTypeCheck.javaはリンク元の記事を参照**
(私は少し手を加えていますが、このままでも動作はしました)
[ImageType.java](http://d.hatena.ne.jp/nodamushi/files/ImageType.java)

バイナリデータを送付する場合、curlなどhttpクライアント系コマンド、javascriptで作り込み、RESTクライアントなどいくつか手段がありますが、今回はPostmanを利用しました。

![2.png](https://qiita-image-store.s3.amazonaws.com/0/110457/8f8aa0e9-d68b-9751-7ef7-d72570934598.png)

ここまで書いて、ControllerにおいてIOExceptionをtry、throwsさせていることに気が付きました。後日リファクタリングします。目的があるとは言ってもByteArrayOutputStreamを経由することで無駄にリソースを消費しているため、見直します。。
[github kaikusakari/spring_crud](https://github.com/kaikusakari/spring_crud)