OmniAICreator/Qiita-1.07M huggingface dataset:
xib 化した UITableViewCell を使うときの Tips

`UITableView`を使用する際、`reuseCell`を登録し、再利用することが多いと思います。
今回、`xib`化した`UITableViewCell`を`reuseCell`として使う際にハマったのでTipsを共有します。

`reuseCell`の登録を`Storyboard`上で行うか、コード上で`registerNib`して行うかでポイントが変わってきます。
要は、どこで`xib`をロードするかという話だと思っています。

# `Storyboard`で`reuseCell`登録する場合

この場合は、カスタムセルクラス側で`xib`をロードすることになります。

## カスタムセル を xib 化する

[カスタムViewをNibから初期化し、IBDesignableとIBInspectableで便利に使う](http://himaratsu.hatenablog.com/entry/ios/customview) の記事を参考にしてカスタムセルの`xib`とソースを作成します。

ポイントとしては、
* `UITalbeViewCell`の場合は、ソースに`init(frame: CGRect)`が不要
* 記事にある通り、`xib`の`File's Owner`の`class`にカスタムセルクラス名を記述する
* 同じく`xib`の設定で、カスタムセルの`class`と`Identifier`は空にしておく

## xib 化したカスタムセルを使う
使う際の手順は、

* `Storyboard`上で`UITableView`内の`cell`のクラスとして上記で作成したカスタムセルを指定する
* `Identifier`を設定する。この時、クラス名と同じIDは使えない

上記手順を行えば、あとは、`UITableView#dequeueReusableCellWithIdentifier`でIDを指定して使うことができます。

# コード上で`reuseCell`登録する場合

この場合は使う側のソースコード(`viewController`の`viewDidLoad`など)で`xib`をロードすることになります。

## カスタムセルを xib 化する

`xib`とソースの作成手順は、`Storyboard`で登録する場合とほぼ同じです。
違いは、

* `xib`の`File's Owner`の`class`を空にする
* `xib`のカスタムセルの`class`にカスタムセルクラス名を記述する。`Identifier`を空にする
* カスタムセルクラスのソースには`init?(coder aDecoder: NSCoder)`と`commonInit()`に記述した内容は不要なので削除する
 * 初期化などしたい場合は、`awakeFromNib`に記述すれば良い

## xib 化したカスタムセルを使う

使う側のソースコード、例えば`UITableViewController`の`viewDidLoad`などに下記のコードを記述することで、`xib`を`reuseCell`として使うことができます。

```swift:swift

// UITableViewControllerのviewDidLoadなど
let nib = UINib(nibName: "customCell", bundle: nil) // カスタムセルクラス名で`nib`を作成する
tableView.registerNib(nib, forCellReuseIdentifier: "customCellID") // `reuseCell`として登録する。クラス名と同じIDは使えない
```

# 最後に
`xib`化するということは、`Storyboard`も使っていると思いますので、前者の`Storyboard`で`reuseCell`登録する方がわかりがよいと思います。

`Storyboard`で登録する場合と、`registerNib`で登録する場合の違いがよくわからないまま進めてしまい、動くようになるまでけっこう時間がかかってしまいました。
この内容は`UICollectionView`でも同じことが言えると思います。

スクショがなくてわかりにくい部分があると思いますが、同じことで悩んでいる人の助けになれば幸いです。
VCSAのdnsmasqを再起動したいとき

ホスト→VC→フォワーダ
上記のように構成の時にホストから一部サイトの名前解決ができないことがあった。
その時どうやらvcsaはdnsmasq使ってるというのは突き止めて、サービス再起動しようとししたら、dnsmasq？そんなのねーよ！それおいしいのかって言われたので、記載。

VCSAログイン
$service vmware-dnsmasq restart

※備忘録
Raspberry Pi で OpenCV（リベンジ）

前回、OpenCV をインストール後、ブートできなくなってしまったので、Raspbian を再セットアップして、OpenCV のインストールに再チャレンジ

# 環境

* Raspberry Pi 2 Model B
* SDカード 16GB(Class10)

```shell-session
$ cat /etc/debian_version
8.0
$ cat /etc/issue
Raspbian GNU/Linux 8 \n \l
```

python はインストールされている

```shell-session
$ python
Python 2.7.9 (default, Mar  8 2015, 00:52:26)
[GCC 4.9.2] on linux2
```

# OpenCV のインストール

```shell-session
$ sudo apt-get update
```

```shell-session
$ sudo apt-get install libopencv-dev
```

```shell-session
$ sudo apt-get install python-opencv
```

# 動作確認

webカメラを接続

```shell-session
$ lsusb
Bus 001 Device 006: ID 046d:09a2 Logitech, Inc. QuickCam Communicate Deluxe/S7500
```

以下の記事のコードを使用して動作確認
[Raspberry Piで画像処理ライブラリ”OpenCV”使って”顔認識”試してみた](http://arkouji.cocolog-nifty.com/blog/2015/10/raspberry-piope.html)

```py:camera.py
# coding:utf-8

import cv2.cv as cv
import time

cv.NamedWindow("camera", 1)

capture = cv.CaptureFromCAM(0)

# 画像サイズの指定
cv.SetCaptureProperty(capture,cv.CV_CAP_PROP_FRAME_WIDTH,320)
cv.SetCaptureProperty(capture,cv.CV_CAP_PROP_FRAME_HEIGHT,240)

while True:
    img = cv.QueryFrame(capture)
    cv.ShowImage("camera", img)
    if cv.WaitKey(10) > 0:
        break
cv.DestroyAllWindows()
```

実行

```shell-session
$ python camera.py
```

webカメラの映像がリアルタイムに表示されるようになった

# 顔認識
上記の記事と同様に、顔認識を体験してみる

以下のサイトの手順８のファイルをダウンロードして解凍（```unzip```コマンド）

* [How to easily install OpenCV on Raspberry Pi](http://www.technolabsz.com/2013/03/how-to-easily-install-opencv-on.html)

解凍した２つのファイル

* facedetect.py
* face.xml

を Raspberry Pi 上の適当なディレクトリに保存

実行

```shell-session
$ python facedetect.py --cascade=face.xml 0
```

webカメラの映像が表示され、顔を認識すると、顔を赤線の四角で囲むことが確認できた
Raspberry Pi で OpenCV（失敗編）

これは、失敗したことを書き留めたものである。
失敗（ブートできなくなった）した原因は不明
後日、リベンジ予定



# 環境

* Raspberry Pi 2 Model B
* SDカード 16GB(Class10)

```shell-session
$ cat /etc/debian_version
8.0
$ cat /etc/issue
Raspbian GNU/Linux 8 \n \l
```

python はインストールされている

```shell-session
$ python
Python 2.7.9 (default, Mar  8 2015, 00:52:26)
[GCC 4.9.2] on linux2
```

# OpenCV のインストール

```shell-session
$ sudo apt-get update
```


```shell-session
$ sudo apt-get install libopencv-dev
```

インストールに 10 分程度かかった

```shell-session
$ sudo apt-get install python-opencv
```

OpenGL API

```shell-session
$ sudo apt-get install libgl1-mesa-dri
```

```shell-session
$ sudo reboot
```

ブートできなくなった
クラスと構造体の使い分け


VB.NETの開発中、ちょっと目を離した隙にStructureでやりくりしようとしてるプログラムが蔓延してしまった・・・
油断ならんので、今後新しい開発するときの視点に加えよう。

## MSDN 曰く



>引用元：[クラスまたは構造体の選択](https://msdn.microsoft.com/ja-jp/library/ms229017(v=vs.100).aspx)

>クラスは参照型ですが、構造体は値型です。 参照型はヒープ上に割り当てられ、メモリ管理はガベージ コレクターによって処理されます。 
値型はスタックまたはインライン上に割り当てられ、スコープの外に出たときに解放されます。 一般に、割り当てや解放は値型の方が簡単です。 ただし、大量のボックス化とボックス化解除が必要なシナリオで使用すると、参照型と比べてパフォーマンスが低くなります。 詳細については、「ボックス化とボックス化解除 (C# プログラミング ガイド)」を参照してください。

>**型のインスタンスが小さく有効期間が一般に短い場合や、型のインスタンスが一般に他のオブジェクト内に埋め込まれる場合は、クラスではなく、構造体を定義することを検討します。**

>**型が次に挙げるすべての特性を持たない場合、構造体は定義しません。**

>- プリミティブ型 (整数、倍精度浮動小数点数など) に似た単一の値を論理的に表す。
- インスタンスのサイズが 16 バイト未満である。
- 変更できない。
- 頻繁にボックス化する必要がない。

>これらの条件を 1 つ以上満たしていない場合は、構造体ではなく、参照型を作成します。 このガイドラインに従わない場合、パフォーマンスが低下する可能性があります。


特に問題がありそうな箇所について「こういうことだから、ここは構造体じゃなくてクラス使ってね」なんて指示していると、次のような言葉が返って来ました。

>「クラスって万能ですね！」

よくよく考えたら、なんでVB.NETは構造体が値型で動くんだろうか？
ややこしいし、全部連想配列にしてしまえばいいじゃん。まぁPHPは連想配列オンリーやめたおかげでパフォーマンス上がったんだけど・・・


## VS.「全部クラスでよくね？」
>引用元：[Swiftことはじめ：String?のクエスチョンマークって何？](http://shoma2da.hatenablog.com/entry/2014/06/03/233312)

>このようにSwiftではデフォルトでは変数にnilが入らないようになっており、
nilを代入したい場合は型に?を付けた型で宣言します。
>***
>#### **なんでこんな言語仕様があるの？**
>結論から言ってしまうと「コンパイル時点でnilをチェックするため」です。

>通常のnullチェックの場合、以下の様な欠点がありました。

>- nullになり得るかどうかをプログラマが考える必要がある→対応忘れが頻繁に起きる
- ほんとにnullになるかどうかは実行時にわかる→ストア配布後などにテスト漏れによるnilに起因したクラッシュが発生する
 
>こうした状況に対処できるのが今回説明しているoptional valueです。
上記の欠点についてoptional valueなら次のことが言えます。

>- nullになり得るかどうかは型で把握しているのでコンパイラが判断できる
- ほんとにnullになるかどうかはコンパイル時点でわかる

>つまり今まではプログラマが考えたり実行してテストしていたものをコンパイラという機械にまかせてしまうことができます。


なるほど、こういう考え方もあるのね。
私はプログラム書くときは、入口で弾いて値域絞るタイプだから、こういう思想はわかる。


## まとめ

コンパイラに任せる範囲、プロジェクトに用意するガイドラインの厳しさ／緩さ、プロジェクトメンバーに求める責任範囲とかと照らし合わせて、言語選定の材料になりそう。
Raspberry Pi で LAMP（２回目）


２回目なので、依存しているパッケージなどは指定せず、最低限のコマンドを実行

# 下準備

```shell-session
$ sudo apt-get update
```

```shell-session
$ sudo apt-get upgrade
```

# Apache のインストール

```shell-session
$ sudo apt-get install apache2
```

http://localhost/ で Apache が動作していることを確認

# PHP のインストール

インストールするパッケージの確認

```shell-session
$ apt-cache search php
```

PHP5 しかないようなので、

```shell-session
$ sudo apt-get install php5
```

動作確認用のスクリプトを作成

```php:/var/www/html/info.php
<?php
    phpinfo();
?>
```

http://localhost/info.php で PHP の設定情報が表示されることを確認

# MySQL のインストール

```shell-session
$ sudo apt-get install mysql-server
```

インストール中に以下の設定画面が表示される

* MySQL を管理する "root" ユーザのパスワードを設定
* もう一度パスワードを入力

インストール後、MySQL サーバにログインできることを確認

```shell-session
$ mysql -u root -p
****** (パスワードを入力)

mysql>
```

# まとめ

それぞれのバージョンは以下のとおり

```shell-session
$ cat /etc/debian_version
8.0
$ cat /etc/issue
Raspbian GNU/Linux 8 \n \l

$ apache2 -v
Server version: Apache/2.4.10 (Raspbian)
Server built:   Jan 23 2016 22:26:49
$ php -v
PHP 5.6.20-0+deb8u1 (cli) (built: Apr 28 2016 00:01:26)
Copyright (c) 1997-2016 The PHP Group
Zend Engine v2.6.0, Copyright (c) 1998-2016 Zend Technologies
    with Zend OPcache v7.0.6-dev, Copyright (c) 1999-2016, by Zend Technologies
$ mysql -V
mysql  Ver 14.14 Distrib 5.5.44, for debian-linux-gnu (armv7l) using readline 6.3
```

前回のインストール時と比べ、PHP はバージョンが上がっている。


# phpMyAdmin のインストール

```shell-session
$ sudo apt-get install phpmyadmin
```

インストール中に以下の設定画面が表示される

* 自動再設定をする web サーバ：apache2
* phpmyadmin のデータベースを dbconfig-common で設定しますか？：はい
* データベースの管理権限を持つユーザのパスワード：******
* phpmyadmin 用の MySQL アプリケーションパスワード：そのままEnter

インストール後、Apache を再起動

```shell-session
$ sudo service apache2 restart
```

http://localhost/phpmyadmin/ でログイン画面が表示され、ログインできることを確認する

本来はこれで完了のはず。


しかし、
**Not Found**
と表示される


phpmyadmin をインストール中の画面で、
自動再設定をする web サーバ：
のところで、apache2 を選択せず（スペースを押さず）、そのままEnter を押してしまったので、
Apache と連携できていない模様。

/etc/phpmyadmin/apache.conf
の内容を
/etc/apache2/mods-available/alias.conf
に追記
（これが正しい方法かは不明）

Apache の再起動

```shell-session
$ sudo service apache2 restart
```

http://localhost/phpmyadmin/
にアクセスすると、
phpMyAdmin の画面が表示され、
ユーザ名：root
パスワード：上記で設定したもの
でログインできた
Raspberry Pi で再インストール


OpenCV をインストールして reboot したら、OS が起動しなくなってしまった。。。

Raspberry Pi のロゴの画面が表示されたあと、しばらくして、ディスプレイが「No Signal」になってしまう。。。

やむなく、再インストール

# OS の再インストール

Raspberry Pi の電源を入れ、Raspberry Pi のロゴの画面で、「Shift」キーを押す。
OS を選択する画面が表示されるので、
Raspbian にチェックを入れ、
Language は日本語を選択して、「Install」をクリック


Raspbian: Downloading and extracting filesystem
という文字と、プログレスバーが表示される。
サイズは 3245 MB

初めてインストールしたときと違って、今回は、Raspbian をダウンロードしているようだ！

XXXX MB of 3245 MB (1.0 MB/sec)

約1時間後、

OS(es) Installed Successfully

「OK」をクリックするとブートする



# 基本設定

## 下準備

```shell-session
$ sudo apt-get update
```

```shell-session
$ sudo apt-get upgrade
```

## バージョン確認

```shell-session
$ cat /etc/debian_version
8.0
$ cat /etc/issue
Raspbian GNU/Linux 8 \n \l
```

### 文字コードの環境変数の確認

```shell-session
$ echo $LANG
en_GB.UTF-8
```

## Timezone の設定

「Menu」-「Raspberry Pi Configuration」-「Localisation」-「Set Timezone」

* Area: Asia
* Location: Tokyo

設定後、リブート

リブート後、時刻の表示は日本時間に変わる

### 文字コードの環境変数の確認

```shell-session
$ echo $LANG
ja_JP.UTF-8
```

文字コードの環境変数も **ja_JP.UTF-8** に変わる

しかし、Menu の日本語は文字化けしている

## 文字化け解消

```shell-session
$ sudo aptitude -y install jfbterm
```

インストール後、リブート

Menu の日本語の文字化け解消

LXTerminal のメニューも日本語になっている

## フォントの設定

### フォントのインストール
[MigMix（ミグミックス）フォント](http://mix-mplus-ipa.osdn.jp/migmix/)をインストール

```shell-session
$ sudo apt-get install fonts-migmix
```

### システムフォント

「Menu」-「設定」-「Appearance Settings」

* [MigMix 2M Bold 12] に設定

### LXTerminal のフォント

「編集」-「設定」

* [Migu 1M 12] に設定

Raspberry Pi の基本設定は完了
dockerコマンドをつかってコンテナで使用しているvolume名を取り出す

コンテナが使用していないvolumeを削除するスクリプトもあるみたいなのですが、Macだと動かないので手動で整理することにしました。

jq入っていない場合インストール。
https://stedolan.github.io/jq/

```
docker ps -a --format "{{.Names}}" | xargs docker inspect | jq -r .[].Mounts[].Name | grep -v null
```
docker tool boxではなくてdocker for macを使っていますが特に関係ないと思います。
ここから、`docker volume ls -q`との差分をとって`docker volume rm`で削除
Mac + Xamarin Studioで、クロスプラットフォーム開発環境を試す

# Xamarin Studioでクロスプラットフォーム開発

Xamarin Studioが無料になりましたね(いまさら...)。
そんなわけで、
iOSとAndroidの、クロスプラットフォーム開発を試しました。

今回は、
・インストール
・ビルド、エミュレータでの実行
以上を一通り残していこうと思います。

筆者の環境は下記の通りです。
・MacBook Pro 2015
・Mac OS X 10.11.4(El Capitan)

また、Android, iOSの開発をするので、
下記のツールをインストール済みです。
・Xcode
・Android Studio
両プラットフォームのシミュレータが動作する状態です。

## Xamarin Studioをインストール
何はともあれインストール。
下記のリンク先からダウンロードできます。
https://www.xamarin.com/studio

![スクリーンショット 2016-05-19 14.33.42.png](https://qiita-image-store.s3.amazonaws.com/0/85797/39c38f2e-b3f4-f34a-254e-1959ac8b701d.png)


（名前や会社名を入力する必要があります）

ライセンスに同意後、ポチポチすすめて行けば、
無事インストールが完了します。

![スクリーンショット 2016-05-19 14.31.55.png](https://qiita-image-store.s3.amazonaws.com/0/85797/13629158-7944-68da-63ce-50d2fb9bf5ca.png)


**Launch Xamarin Studio**を押すと、Xamarin Studioが立ち上がります。


##プロジェクト作成
###プロジェクト選択
![スクリーンショット 2016-05-19 14.38.36.png](https://qiita-image-store.s3.amazonaws.com/0/85797/2a2ba722-fe76-9a86-d5ad-27871ff7c747.png)

**New Solution...**をクリックしてください。

![スクリーンショット 2016-05-19 14.42.03.png](https://qiita-image-store.s3.amazonaws.com/0/85797/1334ed0e-d48d-e7da-1c3a-51a328acc5c4.png)

MultiplatformのForms Appを選択します。(言語はC#で行きます。)
Xamarin.Forms(フレームワーク)の、殆ど空っぽのプロジェクトが作成出来ます。
右下の**Next**を押すと、プロジェクトの設定に移ります。

###プロジェクト設定
![スクリーンショット 2016-05-19 14.50.49.png](https://qiita-image-store.s3.amazonaws.com/0/85797/4f382e29-c247-1714-664f-7e9c3d21d221.png)

とりあえず、**App Name**を入れれば次へ進めます。

**Shared Code**部分が気になる方には、以下の記事が役立ちます。
https://developer.xamarin.com/guides/cross-platform/application_fundamentals/building_cross_platform_applications/sharing_code_options/
第一階層が機能かプラットフォームかで、プロジェクトの構成が違う訳です。

今回は**Use Portable Class Library**(PCL)で開発します。
こちらのほうが、既にアプリ開発を経験している方なら進めやすいと思います。

![スクリーンショット 2016-05-19 14.56.08.png](https://qiita-image-store.s3.amazonaws.com/0/85797/90de0d59-2841-be74-d9ab-de0989d98550.png)
プロジェクト名など、適当なものを入れて、プロジェクトの作成を完了します。


##ともかくシミュレーターで動かす
とりあえず、動かしてみましょう。

### iOS
![スクリーンショット 2016-05-19 15.26.28.png](https://qiita-image-store.s3.amazonaws.com/0/85797/a1a13ea5-3db1-1067-ec78-44b4f15fc979.png)
Xcode導入済みであれば、端末を選択して、左の▶をクリックすれば、シミュレータが立ち上がって、アプリが立ち上がります。
画面に**"Welcome to Xamarin Forms!"**とでていればOK.



###Android
Androidのシミュレータを利用する場合、{{プロジェクト名}}.Droidの部分を右クリックし、
**アプリケーションを選択して開く**から、シミュレータを立ち上げることが出来ます
![スクリーンショット 2016-05-19 15.40.45（2）.png](https://qiita-image-store.s3.amazonaws.com/0/85797/47897c29-1d1b-54a6-6af7-2c1622e9cc4e.png)

なお、Androidの場合、USBデバッグがONになっている端末であれば、
同様の手順で実機でデバッグ可能です。
スワイプ（PanGesture）で標準キーボードを閉じることができるTKKeyboardControlを使ってみた件

## [TKKeyboardControl](https://github.com/cztatsumi-keisuke/TKKeyboardControl)とは
キーボードの上部から指でスーッと下に降ろすことでキーボードを閉じることができる機能を簡単に追加できるOSSです。

![keyboard_test.gif](https://raw.githubusercontent.com/cztatsumi-keisuke/TKKeyboardControl/master/Images/keyboard_test.gif)

[**TKKeyboardControl**](https://github.com/cztatsumi-keisuke/TKKeyboardControl)

よく見かけるのは、Facebookの**Messenger**やAppleの**メッセージアプリ**ですね。

[TKKeyboardControl](https://github.com/cztatsumi-keisuke/TKKeyboardControl)を使うと、そういったメッセージ系のアプリを作る際には、ぜひ実現したい機能の一つである、

**スワイプ（PanGesture）で標準キーボードを閉じれるようにすること**

が簡単に実現できるようになっています。
## 使い方
追加するソースコードは**たったの4行**なので、とても簡単に導入できます。

### 1. 導入する
CocoaPodsかマニュアルで導入することができます。
#### 1-a. CocoaPodsで導入する
以下の内容でPodfileを作成し、pod install します。
Swiftからは**use_frameworks!**が無いとエラーになりますので、ご注意を。

```Podfile:Podfile
platform :ios, '8.0'
use_frameworks!

pod 'TKKeyboardControl'
```

#### 1-b. マニュアルで導入する
下記リンクからソースコードをダウンロードし、中身の**TKKeyboardControl**ディレクトリをプロジェクトに追加してください
[https://github.com/cztatsumi-keisuke/TKKeyboardControl/archive/master.zip](https://github.com/cztatsumi-keisuke/TKKeyboardControl/archive/master.zip)

### 2. 動きを追加したいViewControllerにインポートする
動きを追加したいViewControllerに下記のコードでインポートします。

```swift
import TKKeyboardControl
```

### 3. PanGestureの動きをキーボードに付与する
ViewControllerのviewDidLoad()に下記コードを追加します。
これでキーボードをスワイプで閉じれるようになります。

```swift
self.view.addKeyboardPanningWithFrameBasedActionHandler({ (keyboardFrameInView, opening, closing) in
            // ここはPanGestureが変化するたびに呼ばれます
            }, constraintBasedActionHandler: nil)
```

### 4. deinitにObserverを解放するためのメソッドを追加
最後に、deinitに下記コードを追加して完成です。

```swift
self.view.removeKeyboardControl()
```

## PanGestureが効く始点を変更する

メッセージ系のアプリにおいて、キーボードの上部にはサンプルのようなテキストボックスを実装することがほとんどです。
その場合、**keyboardTriggerOffset**プロパティを設定して、PanGestureが効く始点をテキストボックスの上部からに変更します。

```swift
// テキストボックスの高さ
let inputBaseViewHeight: CGFloat = 40

// PanGestureが効く始点をテキストボックスの上部からに設定
self.view.keyboardTriggerOffset = inputBaseViewHeight
        
self.view.addKeyboardPanningWithFrameBasedActionHandler({ (keyboardFrameInView, opening, closing) in
            // キーボードの伸縮に合わせてテキストボックスのY座標が変化するようにする
            self.inputBaseView.frame.origin.y = keyboardFrameInView.origin.y - inputBaseViewHeight
            }, constraintBasedActionHandler: nil)
```

## マニュアルでキーボードを閉じる
マニュアルでキーボードを閉じたい場合は、下記のメソッドを使います。

```swift
self.view.hideKeyboard()
```
普通の人のためのデータ分析（3） 日本は、英国に馬を輸出？（貿易統計）

### 貿易統計をHSコード上２桁で調べてみました。

2015 年の輸出統計を少し調べてみました。
HSコードの上２桁で、01 [１類](http://www.customs.go.jp/yusyutu/2016/data/j_01.htm)です。
生体ですね。生きている動物の輸出です。

### 生体輸出の総額
まず、総額を出します。スクリプトは下記です。
3452730(単位１０００円）で、３４．５億円 
年間この金額ですので、それほど多くないですね。

使用データ
[2015_export_all.dat](https://www.dropbox.com/s/8oorjdkrxzdlzdx/2015_export_all.dat?dl=0)
[country.csv](https://www.dropbox.com/s/3i0is8lio84suw0/country.csv?dl=0)

```
T=2015_export_all.dat    # 対象となるデータ
C=01                     # hs2 hscode ２桁 
B=7                      # 上位どこまで選ぶか mbest で使用
# hs2 hscode 2桁の集計　まず全額
mcut f=Value-Year:v,hs2 i=${T} | # 価格
mselstr f=hs2 v=${C} | #hs2 コードを指定してデータを抽出
msum f=v   |  # 価格(v) で集計 
mcut f=v   # 項目を価格だけに絞る
```

### 国別ランキング
では国別のランキング出してみましょう。上位７位までで、割合を出しています。
なんと、英国がトップ

```
34.06,英国,205
24.63,オーストラリア,601
14.71,大韓民国,103
10.37,アメリカ合衆国,304
 7.07,香港,108
 6.80,中華人民共和国,105
 2.36,オランダ,207

```

スクリプト

```
T=2015_export_all.dat    # 対象となるデータ
C=01                     # hs2 hscode ２桁 
B=7                      # 上位どこまで選ぶか mbest で使用
mcut f=Value-Year:v,hs2,Country i=${T} | # 価格の項目名を v にする
mselstr f=hs2 v=${C}  | # hs2 コードを指定してデータを抽出
msum f=v k=Country  | # 国別で集計
mbest s=v%nr size=${B}  | # 価格（集計ずみ）で、B で指定した上位を抽出
mjoin k=Country K=country_code  m=country.csv f=country_name | # 国名を追加
mshare f=v:share  | # 割合を作成
mcal c='format(${share}*100,"%5.2f")' a=s | # 割合を％表示
mcut f=s,country_name,Country | # 国名、割合に限定
mbest s=s%nr size=${B}   # 順番が変わったので、もう一度並び替える
```

### 英国への輸出を詳しく見ると
HSコード 01012100 は、純粋種の馬　競馬用の種馬のようです。
金額は、約６．７億円です。
調べてみると、アイルランド人が経営する北海道の[パカパカファーム](http://eumag.jp/spotlight/e0115/) が輸出しているようです。

```
670770,−− 純粋種の繁殖用のもの,010121000
332440,−− その他のもの,010129000
59163,−− その他のもの,010619000
3000,−− 霊長類,010611000
```

使用データ
[2015_export_all.dat](https://www.dropbox.com/s/8oorjdkrxzdlzdx/2015_export_all.dat?dl=0)
[country.csv](https://www.dropbox.com/s/3i0is8lio84suw0/country.csv?dl=0)
[hs9](https://www.dropbox.com/s/yzfp2hamlzcwsij/hs9.csv?dl=0)

```
T=2015_export_all.dat    # 対象となるデータ
C1=01                    # hscode 上２桁 
C2=205                   # 国コード 205 は英国
B=7                      # 上位どこまで選ぶか mbest で使用
# hscode 9 桁 の順位
mcut f=Value-Year:v,Country,hs2,hscode i=${T} | # 価格の項目名を v にする
mselstr f=hs2 v=${C1}  | # hscode 上2桁で抽出
mselstr f=Country v=${C2}  | # Country で特定の国のデータを抽出
msum f=v k=hscode  | # hscode 9桁で、集計
mbest s=v%nr size=${B}  | # 価格（集計ずみ）で、B で指定した上位を抽出
mjoin k=hscode K=hs9 m=hs9.csv f=hs9_name | # hscode の名前を追加
mcut f=v,hs9_name,hscode | # hscode、合計金額に限定
mbest s=v%nr size=${B}   # 順番が変わったので、もう一度並び替える
```
githubで本名が暴露してしまった件

# 背景
今までずっと`git clone`しか使ったことがなかったgit初心者な僕ですが、仕事ではとりあえず必要ないけど（perforce使ってるので）、そろそろgitも使ってみようか、と思い立ったわけで。

# 何が起きたか
最初はwebで、リポジトリを作ったりbranchしてcommitしてmergeして、とやっていて、そこまでは良かった。ところが、OSXのコマンドラインからファイルをコミットした後、ふと気がつくと、githubのcomitterとして、漢字で本名（フルネーム）が表示されているではないか。OSXのアカウント情報がそのまま使われているっぽい。

たぶん誰も見てないからいいけど、さっさと直さねば。

#解決方法
これきっとPC変えたら忘れそうなので、メモっておく。

参考記事： https://git-scm.com/book/ja/v1/使い始める-最初のGitの構成
ここから大事なところを引用する。

> ### 個人の識別情報
> **Gitをインストールしたときに最初にすべきことは**、ユーザー名とE-mailアドレスを設定することです。全てのGitの> コミットはこの情報を用いるため、これは重要で、次々とまわすコミットに永続的に焼き付けられます：
> 
> ```
> $ git config --global user.name "John Doe"
> $ git config --global user.email johndoe@example.com
> ```
> 
> また、もし--globalオプションを指定するのであれば、Gitはその後、そのシステム上で行なう（訳者注：あるユーザーの）全ての操作に対して常にこの情報を使うようになるため、この操作を行なう必要はたった一度だけです。もし、違う名前とE-mailアドレスを特定のプロジェクトで上書きしたいのであれば、そのプロジェクトの（訳者注：Gitディレクトリの）中で、--globalオプション無しでこのコマンドを実行することができます。

最初にすべきことをしてませんでした…。

というわけで、早速設定。
`~/.gitconfig`ファイルが生成されていて、必要なことが書かれていることを確認。

#やり直し
とりあえず、やばいcommitを含むリポジトリをまるまる消して（特定commitのcomitterを変える手もあったんだろうけど）、同じ名前でリポジトリを作り直した。

OSXのコマンドライン上で、先ほど作業していたディレクトリに行って、その中にある`.git`ディレクトリを削除。

```
rm -rf .git
```

あとは、もう一度`git init`からやり直し。

#無事解決
OSXのコマンドラインからのcommitでも期待していたユーザ名がcomitterになっていることを確認して、一件落着。

これ忘れそうだから、別のPCでもすぐにやっといた方が良さそうだ。
GMO Yours シナジーカフェ利用時のメモ


# TL;DR
GMOインターネットグループさんが運営されているシナジーカフェ"GMO Yours"。
http://yours.gmo.jp/

先日勉強会で場所をお借りした際のメモです。ご参考までに。
公式なドキュメントではないので、利用申請や入館方法に関するGMOさんとのやり取り関連のワークフローについては割愛しています。
都度担当の方にご確認をお願いします。


# 受付について
## 受付場所と時間制限
受付場所はセキュリティゲートの外となります。
セキュリティゲートは2箇所、時間帯により利用できるゲートが変わります。
階数表記が2種類あります。左がセルリアンタワー的階数表記、()内がGMOさん的階数表記となるようです。


### 1F(2F): オフィスエントランス
GMOさんのサイトに写真付きの駅からの道順＆入館方法が記載されています。
http://ir.gmocloud.com/company/profile/access/

- エスカレーター登って右側のエントランスはホテルへのエントランスなのでご注意を(自分も間違えましたｗ)
- 19:30で閉じられてしまいます
- 19:30以降は地下タクシー寄せエントランスからの入場になります


### B1F(1F): 地下タクシー寄せエントランス

- 20:00で閉じられてしまいます
- 以降の入館はできなくなります



## 入館用ゲストカードの取り扱い

- 入館にはゲストカードが必要です
- ゲストカードの取得・返却方法は [こちら](http://ir.gmocloud.com/company/profile/access/) の下の方に記載されています。

# 会場について

## 場所・キャパ
http://ir.gmocloud.com/company/profile/access/

- 11Fです。※エレベーター表記
- 椅子が約140脚
- 立ち見OKであれば160人くらいまでいけそう

## 会場のレイアウト変更について

- 現状復帰必須です
- 写真を撮るか、レイアウト図をGMOさんから共有いただいておきましょう
- テーブルの並びは、正面向かって左から 2 2 3 2
- 床にビスが打ち込まれており、テーブルとテーブルの足の間にビスがくるように並べると現状復帰できます

## プレゼン環境について

- 会場の奥側の壁1面に、大型液晶モニターx2とプロジェクターが設置されています
- プレゼン資料の文字はかなり大きめにしないと、会場後ろの人には見えないかもしれません。登壇者の方に事前にお伝えするのもいいかもしれません
- 文字サイズが何ポイント以上あれば良さそうかは確認できたら追記します(忘れたらごめんなさい)


## 予約タイミング

- 社内外両方から利用される人気の場所です、予約は余裕をもって1~2ヶ月前にするのがオススメ
`An index signature parameter type must be 'string' or 'number'. ` というエラーが悲しいと言う話

# An index signature parameter type must be 'string' or 'number'.

型チェックが悲しいと言う話。

## 前提

```
$ tsc -V
Version 1.8.9
```

union type

```typescript
let m: {[name: number|string]: boolean};
//  error TS1023: An index signature parameter type must be 'string' or 'number'.
```

string literal type

```typescript
type RGB = 'R' | 'G' | 'B';
let m: {[name: RGB]: boolean};
// error TS1023: An index signature parameter type must be 'string' or 'number'.
```

generics

```typescript
interface Flags<T extends string> {
  [name: T]: boolean;
}
// error TS1023: An index signature parameter type must be 'string' or 'number'.
```
underscore#eachはbreakできない、lodash#eachはbreakできる

# underscore
http://underscorejs.org/#each
> It's also good to note that an each loop cannot be broken out of — to break, use _.find instead.

ループをbreakできないのでfind使うといい、って言ってる。

# lodash
https://lodash.com/docs#forEach
> Iteratee functions may exit iteration early by explicitly returning false. 

falseを返せばループが止まる、って言ってる。

# まとめ
これだけでも「lodash使お」って思うには十分だと思ってる。

統合の話とかもあるけど今どうなってるんだろ。
オブジェクト指向初心者の私がJavaScriptにも再入門 「決意表明編」 〜JavaScriptパターン 学習0日目【逃げメモ】〜

*2016/5/31 タイトルを変更しました。*

# まずは決意表明の日

## 自己紹介

はじめまして、現在なんちゃってAndroid開発者のしゃけごんです。

私は以前、VBA程度なら事務的業務で求められそうなアプリケーション（複数ワークブックを用いてグラフ付き集計ワークブックの生成など）は作成できる程度のなんちゃって技術者でした。

その小さな自信を胸に、挑んだのがHTML + CSS + JavaScriptを用いたWeb開発でした。

HTML + CSSではレスポンシヴデザインや、イマドキのFlexBoxやCSS3のアニメーションなどを理解でき、さぁこれから！という所で、JavaScriptはjQueryを用いたカンタンなDOM操作、プラグインを使用したアニメーション程度でしか触れることができず、細かなJavaScriptの言語仕様も理解しないままで、やはりここでもなんちゃって技術者となってしまったのでした。

## 自分に足りない知識「オブジェクト指向」

一度、フロントエンドをやる前にJavaのバックエンドを学ぶ講座に1ヵ月通った事がありますが、なんだかちんぷんかんぷんなままその時間を過ごして結局身につかなかった所があります。

それが **オブジェクト指向**でコードの再利用性に長けており、一旦作成してテストまで終われば、それをクラス単位で使い回すことができたり、拡張して使い回す事ができるというとても便利なものです。

ただ、その1ヵ月の研修では、Javaの言語理解とはの所で精一杯で、うまいことオブジェクト指向を身につけることができずに諦めてしまいました。

それを思い出し、今後自分の足カセになってくると思い、今まで避けて通ってきた「オブジェクト指向」と再度向き合うため半年間Javaの講座を受けました

その6ヵ月で **オブジェクト**とは、 **継承**とは、 **データの隠匿**とは、などさまざまな知識を得ることができました。ついでにAndroidアプリ開発も学び、フレームワークについても軽く学ぶことができました。その期間の最後にグループワークにて **ピアノアプリ**を作成することができました。設計主任としてドップリやらせて頂きました。

![piano054.gif](https://qiita-image-store.s3.amazonaws.com/0/126965/e62dc671-f91d-78e6-25b7-7996143db2c2.gif "piano054.gif")

実際は音も出ますよ〜。

## そして、何度目かの Hello, JavaScript Worldへ

そして今まさにJS界が賑わいを見せており、特にReact.js + FLUXのパターンでの、DOMの操作を仮想DOMで行い、描画は状態の変化があることに常に行われるといった、いわゆる「ネイティブ」に近いような描画の仕組みが現れ、俄然面白くなってきた！とワクワクしてきました！

これからJavaScriptの再入門を果たすべく、オライリー社の「[JavaScriptパターン](http://www.oreilly.co.jp/books/9784873114880/)」と「[入門React](http://www.oreilly.co.jp/books/9784873117195/)」の参考書を購入しました。

そんな私が、本を読み解きながら、ポイントや覚えておきたい事を自分なりの言葉でまとめていこうと思います。

目指せSPA技術者！

```js:とりあえず_Hello,world

var hello = function (who) {
    alert("hello, " + who);
}

var hello = new hello("world");

```

# リンク

次回はこちら

[オブジェクト指向初心者の私がJavaScriptにも再入門 「JavaScriptの基本編」 〜JavaScriptパターン 学習1日目【逃げメモ】〜](http://qiita.com/syakegon/items/d77d36ebbd701163e229)
ポートフォワードしたホストに外から接続したい

## 状況
サーバーwebでhttpdが稼働しており、ここにアクセスできるのはサーバーfirewallからだけであるとする。手元のホストfumidaiからwebにアクセスすることを考える。

fumidaiからfirewallにSSHできる場合、ポートフォワードすればよい。fumidaiの8080をfirewall経由でwebの80に向けてやる。

```
fumidai:~$ slogin -L 8080:web:80 firewall
```
```
fumidai:~$ telnet localhost 8080
Trying 127.0.0.1...
Connected to localhost.
Escape character is '^]'.
```

ここでさらに、fumidaiにアクセスできる別クライアント(mymac)から、webにアクセスさせたくなった。しかし接続できない。

```
mymac:~$ telnet fumidai 8080
Trying aa.bb.cc.dd...
telnet: connect to address aa.bb.cc.dd: Connection refused
telnet: Unable to connect to remote host
```

fumidaiを見てみると、127.0.0.1:8080でlistenしている。これでは外からアクセスできない。

```
fumidai:~$ netstat -an | lv
Active Internet connections (servers and established)
Proto Recv-Q Send-Q Local Address           Foreign Address         State      
:
tcp        0      0 127.0.0.1:8080          0.0.0.0:*               LISTEN
:
```

## 解決方法

これを解決するのに、8080を外から接続できるようにする。これにはGatewayPorts=yesをつけてポートフォワードしてやるとよい。

```
fumidai:~$ slogin -o GatewayPorts=yes -L 8080:web:80 firewall
```
```
fumidai:~$ netstat -an | lv
Active Internet connections (servers and established)
Proto Recv-Q Send-Q Local Address           Foreign Address         State      
:
tcp        0      0 0.0.0.0:8080            0.0.0.0:*               LISTEN     
:
```
```
mymac:~$ telnet fumidai 8080
Trying aa.bb.cc.dd...
Connected to fumidai.
Escape character is '^]'.
```

## 参考文献

http://tetu1984.hateblo.jp/entry/20111109/1320840582
http://srad.jp/journal/301762/ssh-port-forwarding
Java Day Tokyo 2016

http://www.oracle.co.jp/events/javaday/2016/

My company and colleagues were so nice to let me attend Java Day Tokyo 2016!
Here is a summary of all the sessions I have attended.

# Key Note: Innovate, Collaborate, with Java
- Java's future is bright and JDK 9 is on the way with many enhancements.
    - Module System
    - REPL
    - 67 JEPs
- There were demos; a drone was flying and a pepper was uploading pictures to the cloud.

# Session 1-C How Goldman Sachs works with open source (Speaker: Hiroshi Ito)
- 1/3 of the GS employee head counts are actually engineers.
- Signed the Oracle Contributor Agreement as a company.
- Has an established process for including external libraries.
- Heavy use of elastic search and private cloud.
- Released GS collections library and donated to Eclipse foundation to enable non GS employees to contribute.
- Contributed patches to Open JDK.

# Latest news with NetBeans IDE (Speaker: Geertjan Wielenga)
- Fully open source
- Nice profiler and debugger
- Aligned with new Open JDK features.
- Maven integration, with a nice dependency graph.
- WebKit API integration
    - Can immediately reflect css changes to the browser.
    - With a plug-in, can inspect an element and jump to the corresponding source code.
- Multi cursor support
- Can be used as a foundation for a desktop application.
- Nekobean is cute

# Java Concurrency, A(nother) Peek Under the Hood (Speaker: David Buck)
- Demo of how things can go wrong if concurrency is not coded against the Java memory model.
    - The JIT compiler may modify execution order.
    - Some CPUs can modify execution order.
    - Concurrency bugs can be hard to reproduce -> Heisen bug. (bug does not happen when inspecting)
- When dealing with concurrency:
    - Use a high level abstraction (i.e. use java.util.Concurrent), and avoid rolling your own.
    - Test with the same hardware/JRE/configuration as in production
- The memory for Java the language is defined, but the memory model for the JVM is still WIP.

# What HTTP/2 means to Java Developers (Speaker: David Delabasse)
- Web pages can be loaded much efficiently/faster:
    - Server can push resources before being requested by the client.
    - Compression of redundant information.
    - Etc.
- The HTTP semantics will remain the same, so an application developer gets the full benefit without additional effort.
- A HTTP/2 client is on the way for JDK (JEP 110)
- Server side support is also there (Servlet 4 spec)

# Introduction to Oracle JET (Speaker: Geertjan Wielenga)
- A collection of Javascript libraries that can make cool front ends.
- Built on Require JS and Knockout JS.
- Fully open source, hosted on GitHub.
- Lot of examples,
- There is a even GUI application builder so you don't even need to code for simple things.

I was especially excited to see the features of Netbeans IDE. I were to work on a pure Java project next time, this would definitely be the first pick. Also thought that as a clojure developer, it is important to be on top of what is happening in the Java eco system.
AWS EC2 で Let's Encrypt

**注意**
Let's encryptのクライアントがCertbotクライアントに更新されています。
使い方はさほど変わってないようですが新たに利用する人は最新の情報をご確認の上ご利用ください。

* * *

*AWS EC2*上の*nginx*で*Let's Encrypt*の証明書を取得、更新するための手順をまとめました。
*nginx*のセットアップ手順などは省略しております。

# Let's encryptクライアントをインストールする

```bash
$ sudo git clone https://github.com/letsencrypt/letsencrypt /usr/local/letsencrypt
$ sudo /usr/local/letsencrypt/letsencrypt-auto --help --debug
```

Amazon Linux はまだ正式な取扱ではないため`--debug`オプションが必要になります。

# 証明書を取得する

事前にAWSのセキュリティグループで８０ポートへのインバウンドを有効にしておき、証明書取得後に不要であれば無効に戻します。

```bash
$ sudo /usr/local/letsencrypt/letsencrypt-auto certonly --standalone -d example.com --agree-tos
```

ドメインは適宜変更してください。

# 証明書の自動更新を設定する

```bash
$ sudo vi /etc/cron.daily/letsencrypt
$ sudo chmod +x /etc/cron.daily/letsencrypt
```

以下は */etc/cron.daily/letsencrypt* の内容です。
`DOMAIN`、`WEBROOT`などは適宜変更してください。
今回はWebサーバにnginxを利用しているため`service nginx reload`しています。Apacheなどをご利用の方は適宜変更してください。

```bash
#!/bin/sh

LE_HOME=/usr/local/letsencrypt
WEBROOT=/usr/share/nginx/html
DOMAIN=example.com
LOG=/var/log/letsencrypt/renew.log

$LE_HOME/letsencrypt-auto certonly --debug --non-interactive --keep-until-expiring --webroot -w $WEBROOT -d $DOMAIN >> $LOG 2>&1
EXITVALUE=$?
if [ $EXITVALUE != 0 ]; then
    echo Automated renewal failed:
    exit 1
fi
service nginx reload
```
NSUserDefaultsのsynchronizeって忘れるよね

自分向けコードスニペット。
NSUserDefaultsのsynchronize()を呼ぶのを忘れてしまうので、下記のようなラップクラスを思いついた。

```swift
class UserDefaultsWrapper {
    private var instance: NSUserDefaults

    init(instance: NSUserDefaults = NSUserDefaults.standardUserDefaults()) {
        self.instance = instance
    }

    func defaults() -> NSUserDefaults {
        return instance
    }

    deinit {
        instance.synchronize()
    }
}
```

使いやすいかどうかはまた考えよう。
Macbook Pro 定期的なメンテナンス

他にも多くの人が書いていますが、、、定期的にやった方が良さそうなメンテナンスです。

## ほぼ毎日
- バックアップ（Time Machineで自動に)

## 数日に1度
- 再起動をする

## 月1回の頻度で、、、、

- [セーフモードで起動](https://support.apple.com/ja-jp/HT201262)：いろいろ修復してくれるようだ。以下はAppleのページより。
 1. Mac を起動または再起動します。 
 2. 起動音が聞こえたらすぐに「shift」キーを押してそのままにします。
 3. 画面に Apple ロゴが表示されたら「shift」キーを放します。
- Mac App Store → Updates
 - softwareupdate というコマンドで更新できるようだ。うっかりOSのバージョンアップをしないように使用しないことにする。
 - [mas-cli](https://github.com/mas-cli/mas)というのでコマンドラインからも更新可能なようだ。（便利そうだが、セキュリティ上の理由から使用しないことにする）
- Homebrew

```
brew update
brew upgrade
brew doctor
brew cleanup # ごくたまに
```

## 月1以下の頻度で、、、
- ディスクユーティリティ → First Aid
- Symantec LiveUpdate (ウイルス対策ソフト自体の更新)
- OCaml

```
opam update
opam upgrade
opam switch list
opam switch 4.02.3
eval `opam config env`
ocaml -version 
```

- Python

```
pip3 install --upgrade pip
```
（以前は```pip install --upgrade pip```としていた）

- Ruby

```
gem update
```

- [Microsoft Office](https://support.office.com/ja-jp/article/%E6%9B%B4%E6%96%B0%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%A0%E3%82%92%E8%87%AA%E5%8B%95%E7%9A%84%E3%81%AB%E3%83%81%E3%82%A7%E3%83%83%E3%82%AF%E3%81%99%E3%82%8B-bfd1e497-c24d-4754-92ab-910a4074d7c1): Office アプリケーション→ヘルプ→更新プログラムの確認
- Emacs: M-x package-list-packages で Ux で更新
- Zsh

```
zprezto-update
```
- 空きディスク容量が約10 GB以上であることの確認． 以下をターミナルで実行 または ディスクユーティリティ で確認

```
df -h
```

# 備考
- LaTeX関連はめったな事がない限りアップデートしないことにする（tlmgr）。スタイルファイルによって古いLaTeXしか受け付けてくれずに[クリーンインストール](http://qiita.com/tetsuo_jp/items/04a66b8f42946b5c5a5a)したことがあったから。
- OnyXなどのサードパーティソフトウェアは使わないことにする。 
- ディスク検証は必要か？

# 参考になったリンク
- [私が月に1度やってるMacのメンテナンス方法@stocker.jp](http://stocker.jp/diary/mac-maintenance/) 
- [Mac OS Xの定期的なメンテナンス方法](http://inforati.jp/apple/mac-tips-techniques/system-hints/how-to-maintain-mac.html)
macでtex環境を削除


tex環境をクリーンインストールしたくなり、まずすべて削除することにしました。その作業メモです。

# 1. MacTeXをアンインストール
[公式ページの説明](https://tug.org/mactex/uninstalling.html)

設定ファイルの場所を確認します。

```/usr/local/texlive/2015/texmf.cnf
% (Public domain.)
% This texmf.cnf file should contain only your personal changes from the
% original texmf.cnf (for example, as chosen in the installer).
%
% That is, if you need to make changes to texmf.cnf, put your custom
% settings in this file, which is .../texlive/YYYY/texmf.cnf, rather than
% the distributed file (which is .../texlive/YYYY/texmf-dist/web2c/texmf.cnf).
% And include *only* your changed values, not a copy of the whole thing!
%
TEXMFHOME = ~/Library/texmf
TEXMFVAR = ~/Library/texlive/2015/texmf-var
TEXMFCONFIG = ~/Library/texlive/2015/texmf-config
```

これらのディレクトリ・ファイルを削除します。

```bash
$ rm -rf /usr/local/texlive
$ rm -rf ~/Library/texmf
$ rm -rf ~/Library/texlive
```

GUI applications を消します。

```bash
$ rm -rf /Applications/TeX
```

Uninstalling the TeX Distribution Data Structure

```bash
$ sudo rm -rf /Library/TeX/
```

関連アプリケーションもアンインストールします。

```bash
$ brew uninstall ghostscript
$ brew uninstall --force imagemagick
```

# 2. basictexをアンインストール
Homebrew-Cask の basictex がインストールされているかを調べます。

```bash
$ brew cask list | grep basictex
basictex
```

アンインストールします。

```bash
$ brew cask uninstall basictex
```

#3. これをやることになったわけ
LaTeX環境をtlmgrでアップグレードしたら古いスタイルファイルの組版ができなくなったため。
Node.js と Route53 で DDNS を運用する

# 前提条件

- Route53でHostedZoneを登録してある
- そのZONE_IDを取得してある
- そのHostedZoneを操作する権限を持つIAMユーザを作成してある
- IAMユーザのアクセスキーとシークレットキーを取得してある

必要な権限は下記の通りです。Actionは4つ、ResourceはHostedZoneを指定します。

```json
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "route53:GetHostedZone",
                "route53:ListResourceRecordSets",
                "route53:ChangeResourceRecordSets",
                "route53:GetChange"
            ],
            "Resource": [
                "arn:aws:route53:::hostedzone/Z1XUEXAMPLEWR1"
            ]
        }
    ]
}
```

# IDとキーを保存した環境変数ファイルを作成する

DDNSを実現するには HostedZoneのZONE_ID、IAMユーザのアクセスキーとシークレットキーをスクリプト内で参照する必要があります。これらをハードコーディングしたくないので、環境変数として渡すためのファイルを作成しておきます。

```:.api_keys
# DDNS 
ROUTE53_ZONE_ID=Z1XUEXAMPLEWR1
IAM_DDNS_KEY=AEXAMPLEEXAMPLEU3C7Q
IAM_DDNS_SECRET=YxEXAMPLEEXAMPLEEXAMPLEEXAMPLEEXAMPLEYss
```


# Dockerコンテナを作成する

Node.jsが動けばなんでもよいのですが、Dockerで準備するのが楽なのでそのようにします。

```:Dockerfile
FROM node:latest
MAINTAINER flny flny@example.com

RUN npm install nice-route53 \
                external-ip
CMD /bin/bash
```

Route53を操作するために [nice-route53](https://www.npmjs.com/package/nice-route53) を、自身のグローバルIPを知るために [external-ip](https://www.npmjs.com/package/external-ip) を それぞれnpmでインストールしています。

docker build と docker runでNode.jsが動作するコンテナを作成します。

```sh
$ docker build -t ddns <Dockerfileのあるディレクトリ>
$ docker run -itd --env-file .api_keys --name ddns ddns
```

# スクリプトを記述する

```js:sendDdns.js
#!/usr/bin/env node

var ExtIP = require('external-ip'),
    Route53 = require('nice-route53')
;

var configMap = {
        zoneId  : process.env.ROUTE53_ZONE_ID,
        iam_key : process.env.IAM_DDNS_KEY,
        iam_sec : process.env.IAM_DDNS_SECRET,
    },
    getIP = new ExtIP(),
    r53 = new Route53(
        {accessKeyId :     configMap.iam_key,
         secretAccessKey : configMap.iam_sec}
        ),
    onReceiveIp, sendRecord
;


sendRecord = function(ip) {
    var aRec = {
        zoneId : configMap.zoneId,
        name   : 'foo.example.com.',
        type   : 'A',
        ttl    : 3600,
        values : [ip]
    };
    console.log(aRec);
    r53.setRecord(aRec, function(err, res) {
        if(err) throw err;
        console.log(res);
    });
    
};


onReceiveIp = function(err, ip) {
    if(err) {
        throw err;
    }
    sendRecord(ip)
}


getIP(onReceiveIp);
```

1. getIPでグローバルIPアドレスを取得して、
2. それを元にAレコードを作成し、
3. r53.setRecordでAレコードをupsertする

という流れです。パッケージのおかげで楽ちんですね。

# 動作を確認する

```
# ./sendDdnsRec.js
{ zoneId: 'Z1XUEXAMPLEWR1',
  name: 'foo.example.com.',
  type: 'A',
  ttl: 3600,
  values: [ '110.233.x.x' ] }
{ changeId: 'C316EXAMPLE9ZO',
  url: '/change/C316EXAMPLE9ZO',
  status: 'PENDING',
  submittedAt: Tue May 24 2016 15:47:34 GMT+0000 (UTC) }
```

コンテナ上で スクリプトを実行すると、うまくいけば status: 'PENDING' のレスポンスが返ります。'PENDING'という記述ですが Aレコードは既に登録されています。

以上
canvasでマスクをかける


デモ：http://mo49.tokyo/qiita/20160504/mask.html

## パスでマスクをかける

マスクをかけたい画像の直前に `clip()`を書けば、
その部分だけにマスクをかけられる。
（枠にはマスクがかかっていない）

```javascript:index.js
// パスでマスク
// 枠
ctx.drawImage(imgAry[0], 0, 0, canvas.width, canvas.height);

// 円
ctx.beginPath();
ctx.arc(150, 150, 100, 0, Math.PI * 2, false);
ctx.clip();

// 背景
ctx.drawImage(imgAry[1], 0, 0, canvas.width, canvas.height);

```

> [clip() メソッド](http://www.html5.jp/canvas/ref/method/clip.html)

## 画像でマスクをかける

`ctx.globalCompositeOperation = 'destination-in';`を記述した直後の画像で合成する。
canvas全体に影響を与えるので、一部だけにマスクをかけたい場合は、
もう一枚canvasを用意する必要がある。

```javascript:index.js
// 画像でマスク
ctx.drawImage(imgAry[1], 0, 0, canvas.width, canvas.height);
ctx.drawImage(imgAry[0], 0, 0, canvas.width, canvas.height);

ctx.globalCompositeOperation = 'destination-in';
ctx.drawImage(imgAry[2], 50, 50, 200, 200);
```

> [globalCompositeOperation プロパティ](http://www.html5.jp/canvas/ref/property/globalCompositeOperation.html)
カルーセルライブラリslick


カルーセルの王道ライブラリ
↓具体的な使い方やデモは本家のサイトから
[slick - the last carousel you'll ever need - Ken Wheeler](http://kenwheeler.github.io/slick/)



高さが変わってしまう場合は・・・

```sass:scss
$slick-height: 90px;
$slick-width: 288px;

.multiple-items{
    width: $slick-width;
	height: $slick-height;
    margin: 0 auto;
}
.slick-list,
.slick-track{
	width: $slick-width;
	height: $slick-height;
}
```

矢印の色は・・・

```sass:scss
.slick-prev:before,
.slick-next:before{
    color: skyblue;
}
```

矢印をオリジナルの画像にする場合は・・・

```sass:scss
.slick-arrow{
	&:before{
		opacity: 0;
	}
}
.slick-next{
	background-image: url(../img/arrow_right.png);
}
.slick-prev{
	background-image: url(../img/arrow_left.png);
}
```


> 参考
[レスポンシブに強いカルーセルスライダーslickの使い方](http://gimmicklog.main.jp/jquery/549/)
[【jQuery】レスポンシヴにも対応したクオリティの高いカルーセル・スライダー［slick］の使い方。](http://on-ze.com/archives/2563)
【逃げメモ】JavaScriptでオブジェクト指向

#逃げメモとは…
色々な言語に手を出してはある一定の所まで進むと「ワカラナイ」となり「きっと向いてないんだ…」となりがちになってしまう私ですが、できれば **逃げ出す前にメモだけでも…** という、また明日挑戦するかもしれない自分に対して書き残すメモを始めようと思います。

# JavaScriptのクラス宣言

発端は、最近Javaを勉強していて、 **オブジェクト指向**に少し慣れてきたので、「じゃあJavaScriptでクラスを書いてみるとどうなるんだろう？」という **少し進んでは別の門を叩いて初心者に戻る**という悪行の一環から始まりました。

JavaScriptのわかりづらい点として **function記述で色んな事をカバーしている**所があるようで、クラス宣言とコンストラクタ宣言さえも`function`で宣言してしまうなんとも見づらい仕様で、

```html:オブジェクト指向
<script>
 (function(ns) {

	//クラス宣言とコンストラクタ宣言
    function classA() {
    	this.name = "tsumori"; //名前プロパティ

    }

	//プロトタイプ宣言で関数の宣言
    classA.prototype = {

    	getName: function(message) {
       		return message + this.name;
       	}
  	}

	//オブジェクト生成
   var a = new classA();
  
   console.log(a.getName("welcome "));// welcome a

	//windowオブジェクトに追加
   ns.a = a;
 }(window));

  console.log(window.a);

</script>
```

JavaScript作法として、newはすべきでない等の話があるようなので、正しくJavaScriptを学ぶためにもちゃんとした本を読もうと思いました。
Zybo > Chronicles blog 24 > 作成したAXI4 peripheral関連のvhdファイル

MicroZed Chronicles リスト http://adiuvoengineering.com/?page_id=285
@ Adam Taylor blog
https://forums.xilinx.com/t5/Xcell-Daily-Blog/The-Zynq-PS-PL-Part-Four-Adam-Taylor-s-MicroZed-Chronicles-Part/ba-p/428548

作成したAXI4 peripheralに関して、機能追加しようという説明がある。

関連ファイルを開く。Vivadoでの作業となる。

> The first thing to do is open the Vivado project and the block diagram that contains the peripheral we created. Right click on the peripheral and select the “Edit in IP Packager option.” This will open the IP Packager view in a new window which enables you to edit and update the peripheral.

2つのファイルがある。

- Adams_Peripheral_v1_0.vhd – Top Level architectural files where you would define user I/O that leaves the module.
 
- Adams_Peripheral_V1_0_S00_AXI.vhd – RTL file, which contains the functional AXI interface including the four registers initially created.
 
vhdの文法を勉強しないといけない。

1800ページあるZynq Technical Reference Manualの通読を停止して、vhdの勉強をするか悩む。
Zybo > Chronicles blog 23 > use AXI interface > XSDK側の作業 > system.mss編集 / Rebuilding the project

MicroZed Chronicles リスト http://adiuvoengineering.com/?page_id=285
@ Adam Taylor blog
https://forums.xilinx.com/t5/Xcell-Daily-Blog/The-Zynq-PS-PL-Part-Three-Adam-Taylor-s-MicroZed-Chronicles-Part/ba-p/425154

AXI4のperipheralをVivadoで作成して、XSDKでreporisotryを更新した後の作業。

> The next step is to open the System.MSS file and customise the BSP to use the drivers generated in the peripheral creation process instead of the generic drivers.

[Board Support Package Settings]において[Overview]->[drivers]項目の一覧のDriverをAdams_Peripheral(作成したもの)を選択。

> Re-building the project ensures that the driver files are loaded into the BSP.

以上でlibsrc以下のBSPにAXI4 peripheral関連のファイルが追加される。
Zybo > Chronicles blog 23 > use AXI interface > XSDK側の作業 > repositories更新 

MicroZed Chronicles リスト http://adiuvoengineering.com/?page_id=285
@ Adam Taylor blog
https://forums.xilinx.com/t5/Xcell-Daily-Blog/The-Zynq-PS-PL-Part-Three-Adam-Taylor-s-MicroZed-Chronicles-Part/ba-p/425154

Vivadoでperipheralを作成して、XSDKにexportする。その後?、XSDK側で以下のようにrepositoriesの更新が必要とのこと

> It is also necessary to update the repositories defined within the design to include the IP repository that contains the peripheral. To do this we select the <font color=red>Xilinx tools option</font> and then <font color=red>repositories</font> and <font color=red>add the new repositories</font> as either local or global. For this example I have chosen local.

...

> Add in the peripheral directory created by Vivado and rescan the repositories. We can now re-build the project to recreate the files needed in the BSP to support software development.

xparameters.h fileに以下のような記載があるとのこと。

```xparameters.h
/* Definitions for driver ADAMS_PERIPHERAL */
#define XPAR_ADAMS_PERIPHERAL_NUM_INSTANCES 1

/* Definitions for peripheral ADAMS_PERIPHERAL_0 */
#define XPAR_ADAMS_PERIPHERAL_0_DEVICE_ID 0
#define XPAR_ADAMS_PERIPHERAL_0_S00_AXI_BASEADDR 0x43C00000
#define XPAR_ADAMS_PERIPHERAL_0_S00_AXI_HIGHADDR 0x43C00FFF
```
技術英語 > Everything's been planned [to the letter]. / curved in stone

@ Star Trek Voyager > LIFESIGNS

メンバーを裏切って敵のグループに加わったセスカと極秘に通信をしているクルー。セスカに船の破壊工作を指示されて戸惑っていると、セスカから

> Nothing worried.
> Everything's been planned <font color=red>to the letter</font>.

http://eow.alc.co.jp/search?q=to+the+letter&ref=sa

> adhere to the letter of the law
法律に一字一句厳密に従う


計画が綿密に練られている、ということなのだろう。

<hr>
関連して思い出したのは

curved in stone

http://ejje.weblio.jp/content/carved+in+stone

curving（彫金）という時計の部品に彫りを入れていく職人の番組が深夜テレビで１０年ほど前にあった。
curved in stoneは「石に刻まれている」から転じてnot changeableという意味なのだろうか。
macの容量を食う"sleepimage"削除+対策


macの容量が少なくなってきたので空き容量を確保しようと思い、
[**GrandPerspective**](http://grandperspectiv.sourceforge.net)という何が容量を使っているかを、分かりやすく表示してくれるアプリで調べたところ...

**/private/var/vm/sleepimage**というファイルが*4GB*ほど食っていた。
そのファイルをゴミ箱に入れようにもアクセス権がない。

どういうファイルなのか調べると、
**スリープ時等に電源が切れてしまうと、RAMのデータを避難させる領域らしい。**

まぁとりあえずいらないかなということで削除です。

### 削除

ターミナルで
`sudo rm /private/var/vm/sleepimage`
と打ち込めば削除できます。

### 対策
このファイルが二度と生成出来ないようにするには
`sudo pmset -a hibernatemode 0`

生成するようにするには
`sudo pmset -a hibernatemode 3`
羽生さんが、プログラマーになる日

## 羽生さん、叡王戦に参戦する

http://www3.nhk.or.jp/news/html/20160522/k10010531101000.html

羽生さんが、ニコニコ動画が主催する叡王戦に参加するそうだ。NHKのニュースにも羽生さんが叡王戦に参加すると報じられた。
羽生さんが、コンピュータと対戦する可能性があるだけでNHKのニュースになるなど、羽生さんのニュースバリューというのは凄いものがあるなと思った。

## 羽生さん、コンピュータ対戦の対策について語る

羽生さんはそれでは、どのように対策を行なうのだろうか？そのヒントになる動画を見つけた。第二回将棋電王戦で、次のように答えている。

羽生善治三冠インタビュー　第2回将棋電王戦(2013年01月29日投稿)
http://www.nicovideo.jp/watch/1359446708

中盤3分ぐらいから。

(コンピュータと)対戦するとしたらどのような対策を取りますか？という質問に答えて


> (コンピュータと対戦することになったら？)それに合わせた勉強はしないといけないんだろうなとは思っています。
そこはこう人間のプロ棋士と対戦する時と同じ所もあるんですけど、こう、**プログラムだったらプログラムそのものがどういう風に出来ているか** って言うような将棋の研究とは全く違うことをやる必要があるんじゃないかなと思っています。はい。

と語っている。この中で注目したいのは、

1. 人間のプロ棋士と対戦するのと同じ発想では駄目だ
1. プログラムそのものがどういう風に出来ているということを理解しなければならない

という風に考えているという点だ。

つまり、彼はコンピュータ将棋を人間の頭脳強化版とは考えておらず、プログラム(あるいはコンピュータそのもの)の成り立ちから理解することで勝機が生まれると考えている。

## 羽生さん、プログラマーになる

多分、彼に時間があったら将棋プログラム書き始めると思う(それがタイトルのプログラマーになるに繋がるのだが)。
将棋プログラムを書きながら、将棋プログラムがどのように成り立っているかとか、機械学習をどのように利用しているかとか、どの局面に評価関数はどのような値になるかとかを実装しながら学んでいくんじゃないかなと思っている。
多分、コンピュータ将棋ではコンピュータの気持ちになりきるのが大事で、この盤面ではコンピュータはこのように感じているとか、この局面ではコンピュータはどのような思考パターンを取り入れている見たいなことをアルゴリズムに照らしあわせて感じていく能力が必要になっていくのではないだろうか？

コンピュータと対戦するとなったらプログラムがどういう風に出来ているかまで掘り下げて考えようとするのが羽生さんの面白いところだ。

## [追記]羽生さん、朝日新聞のインタビューに答える。

最近、羽生さんは朝日新聞のインタビューに答えてこう言っている。

http://www.asahi.com/articles/ASJ5S61P0J5SUCVL023.html

(1分20秒くらいから)ソフトと対決することになったら？

>例えば将棋のソフトと言って全部同じじゃなくてかなり個性がある。
もし仮に、本当にそういう(対戦する)状態には、うーん、 **将棋の勉強というよりもプログラムそのものに対する理解を深める必要** はまあ間違いなくあるなと言うふうには思っています。

という風に語っており、その将棋そのものよりも、プログラムが将棋をどのように理解しているか(要するはアルゴリズムはどうなっているか)に興味あるように思える。多分羽生さんは、**コンピュータから見た時に盤上はどのように見えるか** に興味があるんじゃないかと思う。

プログラマーが一人ナビゲートについて、いまコンピュータはどのように盤面を見ていますとか、耳打ちする対戦方法があっても良いのかも知れない。自動車レースのラリーにおけるナビゲーターみたいな役回り。最近の機械学習を実装したプログラムでは開発者すらコンピュータがどう考えているかわからないかも知れないけど。

## その他、本の紹介

コンピュータの気持ちでいえば、山形浩生の「コンピュータのきもち」という本は面白い。コンピュータ入門書ではなく、コンピュータがどのように考えているかを類推しながらコンピュータの動作原理を覚えていくという変わった本だ

[新教養としてのパソコン入門 コンピュータのきもち](http://www.amazon.co.jp/dp/4756141587)

コンピュータ将棋のアルゴリズムの本といえば、こちらの[人間に勝つコンピュータ将棋の作り方](http://www.amazon.co.jp/dp/4774153265/) が詳しい。min-max原理に始まって、機械学習を用いた評価関数自体のパラメーター調整の話まで、将棋アルゴリズムがどのように進化していったかを知ることが出来る。良くコンピュータは秒間に何億手も読めるので強い見たいな説明をされるが、それよりも(盤上の局面を評価する)評価関数をどう作るかが肝だったことが分かる。
Rubyのエラーメッセージに表示されるファイル名をiTermからRubyMineで開く

超便利。

1. コマンドラインから呼び出せるようにランチャーを作成

```
Tools -> Create Command-Line Launcher
```

2. iTermで設定

iTerm -> Preferences -> Profile -> Advanced -> Semantic History

で `Run command as` に

```
/usr/local/bin/mine \1:\2
```

を設定
### 参考

https://youtrack.jetbrains.com/issue/RUBY-18105
javascript

# 動的に要素追加

```js
function add(args)
{
	for(var i=0; i<=args.length; i++) {
	    var div_element = document.createElement("div");
	    div_element.innerHTML = i;
	    var parent_object = document.getElementById("test");
	    parent_object.appendChild(div_element);
	}
}
</script>
</head>
  
<body>
 
<div>
<button onclick="add([1,2,3]);">test add</button>
</div>
 
<div id="test">
</div>
 
</body>
</html>
```
Unreal Engineのエディタ言語設定

# Unreal Engineのエディタ言語設定

## 日本語 -> 英語
**[エディタの環境設定]を開く**
1. [編集]を選択する
2. [エディタの環境設定]を選択する
![lang_001.png](https://qiita-image-store.s3.amazonaws.com/0/111261/f5bb15d5-264e-4a0f-5d77-3557942afff3.png)

**[地域＆言語]を変更**
1. [地域＆言語]を選択する
2. [Editor Culture]のリストを選択する
3. [英語(English)]を選択する
![lang_002.png](https://qiita-image-store.s3.amazonaws.com/0/111261/b395e786-a5e6-06ae-9626-5dc64ab6994a.png)

## 英語 -> 日本語
**[Editor Preferences]を開く**
1. [Edit]を選択する
2. [Editor Preferences]を選択する
![lang_004.png](https://qiita-image-store.s3.amazonaws.com/0/111261/ec9bea12-4dea-0031-d19f-4db8b4b9a151.png)

**[Region & Language]を変更**
1. [地域＆言語]を選択する
2. [Editor Culture]のリストを選択する
3. [Japanese(日本語)]を選択する
![lang_003.png](https://qiita-image-store.s3.amazonaws.com/0/111261/066c1659-67c7-acc6-2a1c-fd05b4fa59cc.png)
Spring Boot で大きいサイズのファイルをアップロードする

`Spring Boot`で大きいサイズのファイルをアップロードします。
アップロードの仕方はググればなんとなく出てくるので、下記のソースは特に説明しません。
`SweetAlert`は何かリッチなダイアログですが、コードがブロッキングされない、モーダルにしても状況によっては裏が触れる等、多少注意が必要です。
`SweetAlert`で使用している`dialog`要素や、`multipart/form-data`は`HTML5`の機能になりますので、`HTML5`対応のブラウザが前提です。
あ、あと`jQuery`にも依存してます。


```upload.html

    <form id="upload_file" enctype="multipart/form-data">
    	<div id="search-upload">
    		<input id="file-select" type="file" name="file" />
 			<span id="upload" class="button button01 btn" onclick="return false;">アップロード</span>
 		</div>
 	</form>

<script>

// 「アップロード」ボタン押下
$(document).on('click', '#upload', function() {

	// 確認メッセージ
	swal({
		title : "",
	    text : "ファイルをアップロードしてよろしいですか？",
	    type : "warning",
	    allowOutsideClick : "true",
	    showCancelButton : "true",
	    cancelButtonText : "閉じる"
	}, function() {	
		formData = new FormData($('#upload_file').get()[0]);
		formData.append("param1", $("#param1").val());
		
		// アップロード要求
		$.ajax({
	        url: "/upload",
	        method: 'post',
	        data: formData,
	        processData: false,
	        contentType: false,
	        cache: false,
	        timeout: 300000,
	        
	        // アップロード成功
	        success: function (Result) {
	            // 成功時の処理
	        },
			error: function(XMLHttpRequest, textStatus, errorThrown) {
	            // エラー時の処理
			}
		})
	});
});

</script>
```

``` UploadController.java

    // ファイルアップロード
	@RequestMapping(value="/upload", method=RequestMethod.POST, consumes = "multipart/form-data")
    public String upload(@RequestParam("file") MultipartFile file,
    					 @RequestParam("param1") String param1) {

        return "SUCCESS";
    }

```

さて、問題はファイルサイズが大きくてファイルがアップロードできないことでした。
ググると`application.properties`（もしくは`application.yml`)でサイズ制限を解除しろと散々出てくるし、公式でもそのやり方が出てくるのですが、設定しても一向にアップロード出来ません。

``` application.properties
multipart.max-file-size=100MB
multipart.max-request-size=100MB
```

``` application.yml
multipart:
    maxFileSize: 100MB
    maxRequestSize: 100MB
```

色々試した結果、以下の`Configuration`クラスを作ることで解決しました。

``` MultiPartConfigure.java
import javax.servlet.MultipartConfigElement;
import org.springframework.boot.context.embedded.MultipartConfigFactory;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;

@Configuration
public class MultiPartConfigure {

	@Bean
    public MultipartConfigElement multipartConfigElement() {
        MultipartConfigFactory factory = new MultipartConfigFactory();
        factory.setMaxFileSize("100MB");
        factory.setMaxRequestSize("100MB");
        return factory.createMultipartConfig();
    }
}
```

結局プロパティファイルでなぜ駄目だったかはわからず。。