OmniAICreator/Qiita-1.07M huggingface dataset:
Liferay 7 / DXPでJQueryやJQuery UIなどのライブラリをコールする方法

##Liferay 7 / DXPでJQuery + JQuery UIを使いたい
Liferay 7 / DXPから、Liferay標準のAUIがdeprecated宣言され、現在Metal.jsなどでLiferay本体側のコードは書かれ始めているが、まだライブラリなどが充実しておらず、依然deprecatedのAUIが利用されています。
カスタムポートレットなどで、独自にJavascriptライブラリを利用して開発したい場合、JQuery + JQuery UIなどのよくある組み合わせでライブラリをロードするにも、Liferay推奨のAMDローダーでのライブラリのロードが、グローバル定義をうまく扱えずにエラーになってしまうので、
いささか時代遅れなやり方ですが、scriptタグを利用してのライブラリのロードが必要な場合、```CustomJspBag```を利用した方法でロードする方法のサンプルを作成しました。

https://github.com/yasuflatland-lf/js-global-hook

DXPを利用している人は、DE30以降は、
https://github.com/liferay/liferay-blade-samples/tree/master/gradle/apps/npm/jquery-npm-portlet
のように、npmを利用してJQueryをロードして、利用できるようになったので、こちらの方法を利用してください。

ポイントは
```src/main/resources/META-INF/jsps/html/common/themes/top_js-ext.jspf``` の中になります。
[この記事にあるように](https://dev.liferay.com/develop/tutorials/-/knowledge_base/7-0/using-external-libraries)、ライブラリをglobalに露出させています。

```top_js-ext.jspf
<link href="https://code.jquery.com/ui/1.12.1/themes/ui-lightness/jquery-ui.css" rel="stylesheet">	
	
<%-- This part enable to expose JS object to global --%>
<script>
    define._amd = define.amd;
    define.amd = false;
</script>

<script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"></script>

<%-- This part disable to expose JS object to global --%>
<script>
    define.amd = define._amd;
</script>
```
Chromeの開発ツールでIonicのデバッグをしていたらメチャクチャ重くなった時

大した話ではないのと、同じ状況の人がたくさんいるとも思いにくいですが。。。

`$ ionic serve`でブラウザでデバッグしながら開発していたらログが出力されるまでに３０秒以上かかるぐらいにクソ重くなりました。
環境はMacBook、Chrome v60、Ionic3。

で、原因ですが、キャッシュが溜まっていたようです。
あとサーバも全然落としてなかったのもよくなかったっぽい。そういえば数週間動かしっぱなしだった。
ionic serveを一度止めて、クロームのキャッシュを削除して、念のためChromeを再起動。

再度`$ ionic serve`を行ったら、さくさくとログが出るようになりました。
おしまい。
API Blueprint

# 概要
既存のAPIをリニューアルすることになり、ドキュメントとしてBlueprintを採用した。blueprintをレンダリングしてくれるツール「aglio」でドキュメント作成環境を作った時のメモ。

# API Blueprint
Markdown(独自拡張？)でAPIの仕様を表現できる。
HTMLやJsonSchemaへの変換が可能。

[公式](https://apiblueprint.org/)

## 環境
ホストOS:MacOS Sierra 10.12.6
ゲストOS:ubuntu14
vagrant: 1.8.6
aglio: 2.3.0

# aglio
blueprintのフォーマットで書かれたmarkdownをHTMLに変換したり、内蔵されたサーバーで、blueprintをブラウザでpreviewしながら修正していける便利ツール。

[GitHub](https://github.com/danielgtaylor/aglio)

## インストール
nodejsをインストールしてnpmでaglio本体をインストール。
[ここ参考にしました。わかりやすいです。](http://qiita.com/seibe/items/36cef7df85fe2cefa3ea)

### aglioインストール
npmでインストール。
公式には -g オプションがあったけど、理由があってローカルにインストール。
``` $npm install aglio ```

aglioコマンドへのパスを通します。
``` PATH="$PATH"://home/vagrant/aglio/node_modules/.bin ```


### サンプル作成
```
FORMAT: 1A

# sample API ドキュメント

## すべてのサンプルを取得する [/samples]

### sample_list [GET]
サンプルのリストを返します。

+ Response 200 (application/json)
    + Attributes
        + status: false (boolean) - ステータス
        + error: internal server error. (string) - エラーメッセージ

```
sample.apibとして保存。

## 起動
``` $ aglio -i sample.apib -h 192.168.33.12 -s ```
※vagrantの設定でipを192.168.33.12にしてます。

## アクセスしてみる
ブラウザで　http\://192.168.33.12:3000/　にアクセス。
<img width="952" alt="スクリーンショット 2017-08-31 17.27.12.png" src="https://qiita-image-store.s3.amazonaws.com/0/167554/a5f9242d-8562-2e2e-0a9d-6e03283ed21b.png">

こんな感じでプレビューが見れる。
↓のコマンドでHTMLを出力する。

``` $ aglio -i sample.apib -o sample.html ```
mecab-ipadic-NEologdのインストールでエラー

#環境
Antergos Linux

#概要
形態素解析やってみたいと思ってMecabをインストール

[公式ドキュメント](https://github.com/neologd/mecab-ipadic-neologd/blob/master/README.ja.md)の通りにインストールするとなんかエラーが出た


```
[make-mecab-ipadic-NEologd] : Re-Index system dictionary
./libexec/make-mecab-ipadic-neologd.sh: line 492: /usr/libexec/mecab/mecab-dict-index: No such file or directory
```

1時間くらいいじり倒した結果とその過程をメモ

#とりあえず
エラーを読むとmecab-dict-indexがないらしいのでfindしてみよう

```shell-session
$sudo find / -name mecab-dict-index
中略
/usr/lib/mecab/mecab-dict-index
$
```
パスが違うだけでファイルはあるようだ

#推測
他の環境のことはよくわかんないけど/usr/libexec/mecabってフォルダは私の環境にはない
代わりに/lib/mecabならある
こいつを指定してあげればいいんじゃないのか

#インストールスクリプトをチェック
まず mecab-ipadic-neologd/libexec/make-mecab-ipadic-neologd.shの492行目あたりを見る

```
echo "${ECHO_PREFIX} Re-Index system dictionary"
${MECAB_LIBEXEC_DIR}/mecab-dict-index -f UTF8 -t UTF8
```

$MECAB_LIBEXEC_DIRってのがおかしい気がする
103行目に飛んでみると

```
MECAB_LIBEXEC_DIR=`${MECAB_PATH}-config --libexecdir
```
$MECAB_PATHってなんだ？

101行目辺りに

```
MECAB_PATH=`which mecab`
```
って書いてある

つまりmecab-configっていうコマンドに--libexecdirっていう引数を与えた結果がMECAB_LIBEXEC_DIR
コマンドでインストールパスを管理している的なニュアンスだろうか

#結論
私の環境では

```shell-session
$mecab-config --libexecdir
/usr/libexecdir/mecab
```
となるんだけど実際に欲しいファイルは/lib/mecabにあるので

無理やりmecab-ipadic-neologd/libexec/make-mecab-ipadic-neologd.shの103行目の

```
MECAB_LIBEXEC_DIR=`${MECAB_PATH}-config --libexecdir`
```
を

```
MECAB_LIBEXEC_DIR="/lib/mecab"
```

と書き換えたらインストールがうまくいった

#感想
まだペーペーの私にとってはなかなかハードルが高かった。
こういったことへの対処が経験値の向上に繋がっていくのかもしれないと感じた。
macでGo echoサーバーを再起動する度にファイアウォールのアラートが出るのを回避する

echoに限らない話かもしれませんが、ずっと悩んでいたのでメモ。
echoのドキュメントどおりにサーバーを作成すると、再起動の度にmacのファイアウォールのアラートが表示される。
![スクリーンショット 2017-08-31 16.47.31.png](https://qiita-image-store.s3.amazonaws.com/0/8748/0644e61d-211d-9c37-a9c7-5a9292f611bd.png)
ファイアウォールパネルから設定せよと書いてあるのだが、ファイアウォールオプションから許可にしても出続ける。

echoのドキュメントに書いてあるサンプルはこんな感じ。

```
func main() {
	e := echo.New()
	e.GET("/", func(c echo.Context) error {
		return c.String(http.StatusOK, "Hello, World!")
	})
	e.Logger.Fatal(e.Start(":1323"))
}
```

e.Startの引数を変えてあげると、アラートは出なくなった。

```
func main() {
	e := echo.New()
	e.GET("/", func(c echo.Context) error {
		return c.String(http.StatusOK, "Hello, World!")
	})
	e.Logger.Fatal(e.Start("localhost:1323"))
}
```

ずっとイライラしていたので解決方法が見つかって嬉しい。
Atomに入れているパッケージ

# パッケージ類

+ file-icons
    + ファイルのアイコンをわかりやすいシンボルにしてくれる
+ goto-definition
    + `cmd`+`alt`+`enter`で関数ジャンプ
+ highlight-column
    + カーソルに縦線を表示してくれる（インデントが深いメソッドなんかを追うときは便利）
+ highlight-selected
    + 選択した単語をハイライトしてくれる
+ japanese-menu
    + 日本語化
+ language-slim
    + slimファイルのシンタックスハイライト
+ linter（`busy-signal`、`intentions`、`linter-ui-default`）
    + `linter-rubocop`動かすためのベースパッケージ
+ linter-rubocop
    + `ruby`のリアルタイムコードチェッカー
+ minimap
    + ミニマップ
+ show-ideographic-space
    + 全角スペースを視覚化してくれる
+ advanced-open-file
    + `cmd`+`alt`+`o`でファイル検索
+ linter_coffeelint
    + CoffeeScriptのlint
    + `$HOME/coffeelint.json`を配置することでルールを[カスタマイズ](http://www.coffeelint.org/)可能
    + とりあえず`max_line_length`は`ignore`に。
+ sublime-style-column-selection
    + 矩形選択
+ project-manager
    + プロジェクト管理ツール（たまに`プロジェクトを履歴から開く`がちゃんと動作しないので）

# インターフェーステーマ
+ Native

# シンタックステーマ
+ One Dark


# 小技（将来的に別記事化？）
+ `cmd`+`shift`+`p`
    + コマンドパレット起動
+ `cmd`+`p`
    + Fuzzy Finder起動
+ `cmd`+`d`
    + 選択中のワードと同じワードを選択（同時編集可能）
+ `cmd`+`/`
    + コメントアウト/アンコメントのトグル
+ `cmd`+`shift`+`f`
    + プロジェクトフォルダ内検索
+ `ctrl`+`g`
    + 行ジャンプ
+ `alt`+マウスドラッグ
[Tips]macのsedでファイル内容を一括置換

若干直感的でなかったのでメモ。
mac(BSD)版の場合です。
LinuxなどのGNU版sedとは挙動が違う点があるので注意。

# findの場合

```shell-session
$ find . -type f -print0 | xargs -0 sed -i '' -e 's/検索文字列/置換文字列/g'

ちなみにperlを使うとこんな感じ。
$ find . -type f -print | xargs perl -pi -e 's/検索文字列/置換文字列/g'
```
-iの後に''で空文字を指定するのがミソ。
`sed -i -e 's/検索文字列/置換文字列/g'`と書くと、`hoge.txt-e`のように意図しないバックアップファイルが生成される。
GNUの場合、''空文字は指定しなくてよい。

# git grepの場合
普通のgrep、findだと対象のファイルを指定しないといけなかったりで面倒。
gitで管理しているリポジトリの中身だけでよければ、`git grep`が便利。`.gitignore`しているファイルはもちろん無視される。

```shell-session
$ git grep -l '検索文字列' | xargs sed -i '' -e 's/検索文字列/置換文字列/g'
```

ちなみに、 `git grep --no-index`とすれば、`.gitignore`しているファイルやaddしていないファイルもgrepしてくれる。
水曜ワトソンカフェ vol.2 に参加しました

# 水曜ワトソンカフェ vol.2 について
Watsonを実際にどう動かしていくか、どんな風に新しいビジネスに活用できるか…等々、多様な登壇者、参加者と共に、考え、議論する、サロンのようなイベントになります。
詳細は以下のURLを参照してください。
http://peatix.com/event/289820

# 全体的な感想
椅子や机はなく、床に座って聴講・意見交換する形式です。フォーマルではなくフレンドリーな私服で参加するとよいと思いました。アルコール・軽食の提供もあり、楽しめました。以降、登壇者２名によるお話に登場したトピックに対する個人的な雑感を書いてみます。

# Personality Insights に対する雑感
ワトソンが提供する個人特性解析サービスです。「最低3500語以上、理想では6000語以上の文章を入れると、その人を分析した情報が取得できる」というものです。ツイッターのツイート情報を入力にした事例が紹介されていました。単純でわかりやすく、マッチングをするようなサービス全般で利用できるようです。

# ストーリー解析に対する雑感
ストーリーを解析するのに、対象を３つに区切り、さらに真ん中を２つにわけるとうまくいくいう話に興味をもちました。私の理解が正しければの話ですが、この区切りは起承転結や序破急のようなものとは異なる構造的な分解であるということでした。詳細な資料が展開されましたら、再確認してみたいです。
PyTorchで遊ぶ

## インストール方法

http://pytorch.org/

に分かりやすくインストール方法が記載されていますが，備忘録のため記載．

まず「[GPU環境でKeras 2.0とOpenCV 3.2を動かせるようにする](http://qiita.com/namakemono/items/1bcbabfd139be1e170ff)」で環境を作っておきます．

```bash
pip install http://download.pytorch.org/whl/cu80/torch-0.2.0.post3-cp27-cp27mu-manylinux1_x86_64.whl 
pip install torchvision
```

## MNISTの実行

下記コマンドでGPU環境でMNISTデータを学習してくれます．

```bash
curl -kL https://raw.githubusercontent.com/pytorch/examples/master/mnist/main.py | python
```
Swift3でCoreDataをApp Extension間で共有する

もうiOS11が出そうな時期だというのに、未だにiOS10がうまく使えていない。
Share Extensionを使うアプリを作っていて詰まったところが解決できたのでメモ。

Core DataとかApp Extensionとかいうワードで検索しても、iOS9までの方法しか見つけらんなくて大変困った。
NSPersistentContainerとかSQLiteとかそういうワードでの検索が必要だったようだ。

AppExtensionを使うアプリでCoreDataを使う時、XCODEが自動生成してくれるやつのままだと、ExtensionごとにSQLiteのデータベースファイルを作ってしまうので共有できない。
保存先ディレクトリを指定できればいい。

defaultDirectoryURL()を上書きするとよいらしい。
https://developer.apple.com/documentation/coredata/nspersistentcontainer/1640597-defaultdirectoryurl

他のやり方でも出来たが、たぶんこれが正着かと


```Swift
class MyPersistentContainer: NSPersistentContainer {
    override class func defaultDirectoryURL() -> URL {
        return FileManager.default.containerURL(forSecurityApplicationGroupIdentifier: "group.XXXXXXX")!
    }
}
```
Pine64+でマイニングしてみた


マイニングはGPUでやるのが一般的。
ただ電気をかなり食う。（その割に儲からない...？）

できるだけ電気代を抑えてマイニングできないのか？と考えた結果、
ARMを積んだSBCのPine64+でモナコインマイニングを試してみた。

###Pine64+のスペック
---
・CPU Architecture
Quad-core ARM Cortex-A53 Processor@1152Mhz

・GPU Architecture
ARM Mali400MP2 Dual-core GPU

・System Memory
RAM Memory Variants: 1GB

---


5V/2AのUSBパワーで動くの１ヶ月電源を入れっぱなしでも電気代は２００円程度
(実際の消費電力はもっと低いと思われるので電気代も安いはず)
仮に１モナが50円だとすると１日１モナでも稼げれば十分もとは取れる！！


早速、モナコインを掘ってみた。
使ったマイナーは「[cpuminer-multi](https://github.com/tpruvot/cpuminer-multi)」
そのままだとPine64+で動かないのでちょっと修正。

その結果がこちら...
![スクリーンショット 2017-08-31 16.17.16.png](https://qiita-image-store.s3.amazonaws.com/0/19516/746f9111-bef8-f188-43a9-262fae52925a.png)


これだと1モナ稼ぐのに100日くらいはかかる。
いくら省電力で動くとは言っても赤字。

海外のフォーラムをのぞいて見るとARMのマイニングを試行錯誤してる人も見かけるけど
あまりいい成果は上がってない模様。
FTPの通信コネクションとSLLセッションの再利用について。

#FTPの通信コネクションの種類

- コントロールコネクション
FTPサーバにログインする際の利用者認証が必要。データコネクションを確立するためのもの。

- データコネクション
認証がないFTPクライアント(WinSCPやPhpStormといったもの)が多い。実際のデータ転送に使用するコネクション。

コントロールコネクション→データコネクションの順に接続される。

コントロールコネクションで認証が通っても、中間者攻撃などでデータコネクションをクラッカーに接続確立されると、通信内容を見られたり、ダウンロードされたりする。
この問題の解決策として、通信コネクションの両方とも認証を行えば良いが、FTPクライアントでそこまで実装しているものはほとんどない。

#SSLセッションの再利用

そこでFTPS(FTP over SSL/TLS)の場合、データコネクションは認証の変わりにSSLセッションを使いまわし、上記の問題を回避できる。コントロールコネクションでSSL認証して、データコネクションでもその合格した認証を接続に使う。
Gitでcheckoutした際に config.ブランチ名.description （説明文）を表示する

# 背景

詳細は書けないが、

チームメンバーでmasterブランチや開発共有ブランチに、別ディレクトリで作業した古い内容を、ファイルシステムでコピー＆ペーストし、直にCommit & Pushされるという事故が多発していたので、色々我慢できず、かつ割と暇だったため、この問題が少しは何とかならないかと考えてタイトルに至った。

# 結論

以下スクリプトをリポジトリの `.git/hooks/post-checkout` に追加。なかったら作る。

```bash
branch_name=`git branch | grep '^*' | sed 's/* //'` 
git config branch.$branch_name.description && exit 0
```

# 過程 tl;dr

「いやー、どうしたら事故らなくなるんだろう。自分がGitにもっと詳しくなったらいいのかなあ」

と思ってGitオブジェクトのことを調べ始めたら、hooksというディレクトリを見つけたので、
「もしかして？」
と思って調べたらあった。

そもそもの話として、あまりこの機能使われてないんじゃないかとも思ったので、利用例としてこれを見ていただければ幸い。

正直な話、ログを読まずに閉じて、
「Pushできません、助けてください」
や、
「コンフリクト起こしたんですが、後よろしくお願いします」
とぶん投げられるので、これを出したところで読まれもせずにTortoiseGitの画面を閉じられて終了だろうが、ないよりはましだと思いたい。

三十路手前での初めてのsedだったが、Vimをやってたおかげで飲み込みは案外容易だった。

# 参考資料
* [ブランチに説明を書く](http://qiita.com/yaotti/items/ef91dc0c787781024f92)
* [7.3 Git のカスタマイズ - Git フック](https://git-scm.com/book/ja/v1/Git-%E3%81%AE%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA-Git-%E3%83%95%E3%83%83%E3%82%AF)
* [Gitでcommitした時にブランチ名をcommitメッセージに自動でいれる](http://qiita.com/ykyk1218/items/4c17eef472ae8c31991f)
* [sedでこういう時はどう書く?](http://qiita.com/hirohiro77/items/7fe2f68781c41777e507)
* [UNIX & Linux コマンド・シェルスクリプトリファレンス](http://shellscript.sunone.me/exit_status.html)

# 追記
こっちを使ったほうがスマートだった？
[現在のブランチ名を取得するコマンド](http://qiita.com/usamik26/items/8aa6c3aed4b9c7dba5ca)

# 追記2 2020-02-20T15:00
この方法を使うと、説明文表示を共有できるかも（やってない。やる権限がない。現場も違う）。

* [gitのhookを全リポジトリで共有する - Qiita](https://qiita.com/k0kubun/items/5cb8209e3d1854ac2e2e)

サーバーサイドフックを組んで抑制するのもありだったな（やってない。当時の現場でも権限がなかった）。
FreeBSDでNAT64(ipfw_nat64編)

[Tayga](https://qiita.com/yamori813/items/66c94db92dcb8a93f2c8)はユーザランドでのNAT64でしたが、カーネル内でのNAT64サポートが昨年ipfwのコードとしてheadにマージされていました。先日リリースされた11.1RにもMFCされています。

Taygaのときとはちょっと構成変わっています。

![NAT64_ipfw.png](https://qiita-image-store.s3.amazonaws.com/0/104066/17b5ede7-9d32-dbca-042f-adf35ffd596a.png)

NATの口を同じサブネットに入れるとarpの解決ができなくて、通信できなくなるため別のサブネットにしています。

以下のようにAR7240でipfwを設定します。

```
#!/bin/sh
fwcmd="/sbin/ipfw"
kldstat -q -m ipfw_nat64 || kldload ipfw_nat64
${fwcmd} -f flush
${fwcmd} nat64lsn NAT64 create prefix4 10.10.9.0/24
${fwcmd} add allow icmp6 from any to any icmp6types 135,136
${fwcmd} add nat64lsn NAT64 ip6 from any to 64:ff9b::/96
${fwcmd} add nat64lsn NAT64 ip from any to 10.10.9.0/24
```

10.10.10.3のマシンで以下の設定が必要です

```
% sudo route add -net 10.10.9.0/24 10.10.10.70
```

この設定では64:ff9b::のアドレスでアクセスします。

```
hiroki:~ hiroki$ ping6 -c 1  64:ff9b::10.10.10.3
PING6(56=40+8+8 bytes) 2001:db8:12::1 --> 64:ff9b::a0a:a03
16 bytes from 64:ff9b::a0a:a03, icmp_seq=0 hlim=63 time=1.781 ms

--- 64:ff9b::10.10.10.3 ping6 statistics ---
1 packets transmitted, 1 packets received, 0% packet loss
round-trip min/avg/max = 1.781/1.781/1.781 ms
```

このAR7240のモジュールは先日ハードオフで108円の10%OFFで購入しました。100円以下でIPv6がしゃべれるとはすごい時代です。
naming > LoadLibrary | ( UnloadLibrary | FreeLibrary )

```txt:動作環境
C++ Builder XE4
```

提供されたライブラリには以下の関数がある。

- LoadLibrary()
- UnloadLibrary()

case insensitiveな検索を「LoadLibrary」に対して行うと、UnloadLibrary()も検索結果に表示される。
(case sensitiveな検索では区別はできる。)


### LoadLibrary() / FreeLibrary()

LoadとFreeとしている例はMSDNやWine APIであるようだ。

https://msdn.microsoft.com/ja-jp/library/cc429019.aspx

- LoadLibrary()
- FreeLibrary()

https://source.winehq.org/WineAPI/LoadLibraryA.html
https://source.winehq.org/WineAPI/FreeLibrary.html

(「LoadLibraryA」と末尾に「A」をつけている理由は不明)

### linux

https://log4hc.wordpress.com/2011/02/14/lsmod-insmod-modprobe-depmod-rmmod/

> モジュール関連コマンド – lsmod insmod modprobe depmod rmmod modinfo
速報 : カナダで強化学習中心の深層学習ビデオコースが無料公開

#はじめに

さすがDeepLearningブレイクの発祥の地カナダですね。
非常に珍しい強化学習のコースが組み込まれているのも特徴です。
英語苦手な方もシラバスは見れますのでチャレンジして見てください。

http://videolectures.net/deeplearning2017_montreal/

#概要

Deep Learning (DLSS) and Reinforcement Learning (RLSS) Summer School, Montreal 2017

Deep neural networks that learn to represent data in multiple layers of increasing abstraction have dramatically improved the state-of-the-art for speech recognition, object recognition, object detection, predicting the activity of drug molecules, and many other tasks. Deep learning discovers intricate structure in large datasets by building distributed representations, either via supervised, unsupervised or reinforcement learning.

The Deep Learning Summer School (DLSS) is aimed at graduate students and industrial engineers and researchers who already have some basic knowledge of machine learning (and possibly but not necessarily of deep learning) and wish to learn more about this rapidly growing field of research.

In collaboration with DLSS we will hold the first edition of the Montreal Reinforcement Learning Summer School (RLSS). RLSS will cover the basics of reinforcement learning and show its most recent research trends and discoveries, as well as present an opportunity to interact with graduate students and senior researchers in the field.

The school is intended for graduate students in Machine Learning and related fields. Participants should have advanced prior training in computer science and mathematics, and preference will be given to students from research labs affiliated with the CIFAR program on Learning in Machines and Brains.
pythonメモ：乱数生成でシードを設定するとはどういうことなのか

#動機
今年の5月頃に刊行された[「詳解 ディープラーニング Tensorflfow・Kerasによる時系列データ処理」](https://www.amazon.co.jp/dp/4839962510)を読んでいたところ、乱数を生成する部分が出てきました。

毎回同じ乱数を生成するためにシードを設定する、ということでしたが、このあたりの記述がよく分からなかったので、簡単に調べてみました。

#擬似乱数
random関数で生成する乱数は、擬似乱数なのだとか。
[擬似乱数 - Wikipedia](https://ja.wikipedia.org/wiki/擬似乱数)
そもそも擬似乱数とは、一見法則性のない乱数に見えるけれども、ある確定的な計算(決まったアルゴリズム？)によってランダムかのように算出されている数値。

擬似乱数算出の際、初期状態として設定する数値がシードだ、ということです。

このシードを同じ数値にすることで、毎回同じ擬似乱数が生成される、ということで、シードを固定した状態で何度も擬似乱数を生成してみたのですが

```Python:rand_generation.py
import bumpy as np 

rng = np.random.RandomState(100)

for i in range(10):
  print(rng.randn(5)) #randn : 標準正規分布からサンプリング 
```

生成結果：
[-1.74976547  0.3426804   1.1530358  -0.25243604  0.98132079]
[ 0.51421884  0.22117967 -1.07004333 -0.18949583  0.25500144]
[-0.45802699  0.43516349 -0.58359505  0.81684707  0.67272081]
[-0.10441114 -0.53128038  1.02973269 -0.43813562 -1.11831825]
[ 1.61898166  1.54160517 -0.25187914 -0.84243574  0.18451869]
[ 0.9370822   0.73100034  1.36155613 -0.32623806  0.05567601]
[ 0.22239961 -1.443217   -0.75635231  0.81645401  0.75044476]
[-0.45594693  1.18962227 -1.69061683 -1.35639905 -1.23243451]
[-0.54443916 -0.66817174  0.00731456 -0.61293874  1.29974807]
[-1.73309562 -0.9833101   0.35750775 -1.6135785   1.47071387]

おや、生成するたびに違う乱数だ...と思っていたのですが、2回目以降の生成では前回生成された乱数をもとに新たに生成されるようですね。
https://teratail.com/questions/15388
(こちらを参考にさせていただきました。)

上記スクリプトでは、シードを100にして長さ5の擬似乱数リストを10回生成する(つまり、乱数を50回生成している？)ということなので、毎回違うんですね。

もう一度同じスクリプトを実行すると、同じ乱数が生成されました。

シードを同じにすることで、同じアルゴリズムでいつも同じ1つ目の擬似乱数が生成される
↓
1つ目の擬似乱数に基づいて2つ目の擬似乱数が生成されるので、1つ目がいつも同じならば2つ目もいつも同じ
...

の繰り返しということですね。
毎回同じ擬似乱数が生成されるとはつまり、シードを設定した時点をスタートとして、同じ擬似乱数列が生成される、という意味なのでした。
(考えてみれば、常に同じ乱数が生成されるようでは、もはや乱数ではないですよね。)

機械学習などでも、ランダムな数値を用いて性能を評価したい場合、毎回異なる乱数を使っていると、乱数の差による性能の差なのか、パラメータなどの改善の結果なのか分からなくなってしまうことがあるということで、色々な使い道があるみたいですね。

ちなみにシードを設定しない場合は、システム時刻をシードとすることで、毎回異なるシードとなることを保証しているようですね。そんなカラクリだったのか。
https://docs.scipy.org/doc/numpy/reference/generated/numpy.random.RandomState.html
(こちらを参考にさせていただきました。)

#詳しい方がいらっしゃったら...
n番目の擬似乱数生成の際には、n-1番目の擬似乱数がシードになっているということなのでしょうか？
【レスポンシブ】PCとスマホでdivの順番を入れ替える

#はじめに
flex-boxを使います。
スマホ（タブレット）のブレークポイントを768pxとしています。

#Html
```
<div class="main">
  <div class="item1">1</div>
  <div class="item2">2</div>
  <div class="item3">3</div>
  <div class="item4">4</div>
</div>
```

#CSS
```
.main{
  display: flex;
  flex-flow: row wrap;
}
.main div{width: 50%;}
.main .item1{order: 1;}
.main .item2{order: 3;}
.main .item3{order: 4;}
.main .item4{order: 2;}/*このセルの位置を操作*/
@media (max-width: 768px) {
  .main{display: block;}
  .main div{width: 100%;}
}
```

#表示
##PC
赤いセルを右上に表示
![pc.png](https://qiita-image-store.s3.amazonaws.com/0/31261/2f8f44f0-c372-7e00-e55b-6d445edf11e6.png)

##スマホ
赤いセルを一番下に表示
![sp.png](https://qiita-image-store.s3.amazonaws.com/0/31261/e7080efb-d323-df07-1858-1690b99efb62.png)
copy.copy()とは一体

https://docs.python.jp/3/library/copy.html

> x の浅い (shallow) コピーを返します。

「どうやって」がありません。つまり本当のところ仕様が書かれてません。

> クラス独自のコピー実装を定義するために、特殊メソッド `__copy__()` および `__deepcopy__()` を定義することができます。

じゃぁ、リストにはこのメソッドがあるのでしょうか。

```py3
>>> lst = [1, 2, 3]
>>> lst.__copy__()
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
AttributeError: 'list' object has no attribute '__copy__'
```

ないじゃん。

以下は Python 3.6.1 での `copy.copy()` の実装です。

```py3
def copy(x):
    """Shallow copy operation on arbitrary Python objects.

    See the module's __doc__ string for more info.
    """

    cls = type(x)

    copier = _copy_dispatch.get(cls)
    if copier:
        return copier(x)

    try:
        issc = issubclass(cls, type)
    except TypeError: # cls is not a class
        issc = False
    if issc:
        # treat it as a regular class:
        return _copy_immutable(x)

    copier = getattr(cls, "__copy__", None)
    if copier:
        return copier(x)

    reductor = dispatch_table.get(cls)
    if reductor:
        rv = reductor(x)
    else:
        reductor = getattr(x, "__reduce_ex__", None)
        if reductor:
            rv = reductor(4)
        else:
            reductor = getattr(x, "__reduce__", None)
            if reductor:
                rv = reductor()
            else:
                raise Error("un(shallow)copyable object of type %s" % cls)

    if isinstance(rv, str):
        return x
    return _reconstruct(x, None, *rv)


_copy_dispatch = d = {}

def _copy_immutable(x):
    return x
for t in (type(None), int, float, bool, complex, str, tuple,
          bytes, frozenset, type, range, slice,
          types.BuiltinFunctionType, type(Ellipsis), type(NotImplemented),
          types.FunctionType, weakref.ref):
    d[t] = _copy_immutable
t = getattr(types, "CodeType", None)
if t is not None:
    d[t] = _copy_immutable

d[list] = list.copy
d[dict] = dict.copy
d[set] = set.copy
d[bytearray] = bytearray.copy

...
```

`copy.copy()` は組み込みデータ型においてはそれぞれ浅いコピー (と深いコピー) を実現する関数を予め辞書で保持しており、その辞書に登録されていない場合には `__copy__()`メソッドを探します。

それ以降は `pickle` モジュール絡みの規約に基づいた振る舞いをするようですが本稿の想定を越えてるので省略。ドキュメントの以下の部分に相当します。

> クラスは、コピーを制御するために pickle の制御に使用するのと同じインターフェースを使用することができます。これらのメソッドについての情報はモジュール pickle の説明を参照してください。実際、 copy モジュールは、 copyreg モジュールによって登録された picle 関数を使用します。

その点は置いておくとして、ソースコードにより、`copy.copy(lst)` は `lst.copy()` と等価と考えられます。

ちなみに Python 2系には `list.copy()` というものはなく、 `lst[:]` で代用します。古いドキュメントで2から3に移行したものだと `lst[:]` を相対的に良く見かけるかもしれません。
sedで改行を消す

## 参考

* [sed - sedで改行をスペースに置換出来ない - スタック・オーバーフロー](https://ja.stackoverflow.com/questions/23998/sed%E3%81%A7%E6%94%B9%E8%A1%8C%E3%82%92%E3%82%B9%E3%83%9A%E3%83%BC%E3%82%B9%E3%81%AB%E7%BD%AE%E6%8F%9B%E5%87%BA%E6%9D%A5%E3%81%AA%E3%81%84)
* [Man page of SED](https://linuxjm.osdn.jp/html/GNU_sed/man1/sed.1.html)

```sh:
# GNUのsedは-z, --null-dataオプションを指定すると、行の分割を\nでなくnull文字で行ないます。
sed -z 's/\n/ /g' hoge.txt
```

今回 `^M` とそれに続く改行が消したかったため以下実施

```sh:^Mはctrl-v,ctrl-mで入力
sed -z -i -e 's/^M\n//g' hoge.sql
```
[Fusion360]休憩時間にfusion360と遊ぶ。


3D PRINTERを利用するため、fusion360いじってます。
OPENSCAD より面白いし、簡単！

![f_01.JPG](https://qiita-image-store.s3.amazonaws.com/0/137182/e2e84788-c043-aac6-b5b9-b61882a5b998.jpeg)

![f_02.JPG](https://qiita-image-store.s3.amazonaws.com/0/137182/a0a815c9-2ee0-0c3b-f2d8-3e2052cee1a4.jpeg)

![f_03.JPG](https://qiita-image-store.s3.amazonaws.com/0/137182/d91cfe2f-4629-6ca7-38af-52d29d83755e.jpeg)
WebSocketをLoadBalancer経由で使う時にsocket-io-sticky-sessionを使うと、keep-aliveを有効にしているとSession ID unknownになることがある


はじめに
=========
npmの `socket-io-sticky-session` (以降、`sio-sticky`)が、stickyを有効にしたAWSのALBなどのLoadBalancerの後ろにいて、 
LoadBalancerからKeep-Alive接続される場合、`X-Forwarded-For`などのヘッダによって正しいWorkerに割り振られないことがある。

という話です。

説明
======
## 症状
`sio-sticky`は`X-Forwarded-For`などのHTTPヘッダをみてNode.jsの Webサーバ/WebSocketサーバ などにStickyに接続を振り分けてくれます。これは、SocketIOのpollingやwebsocketで使われる`sid`というSessionIDを持つリクエストを同じプロセスのNode.jsに振り分ける時に大変重宝します(sidは異なるプロセスのNode.jsで共有されないので)。

しかし、以下のような構成の場合、
ブラウザがALBのCookieをちゃんと送っていても、Stickyが上手く行かずにエラー(BadRequest: Session ID unknown)になることがあります。

![20170829_WebSocket400エラー問題の説明.png](https://qiita-image-store.s3.amazonaws.com/0/11124/75786059-7b81-7e6c-921e-05078200e8a3.png "20170829_WebSocket400エラー問題の説明.png")

## 原因
原因は、 ALB と sio-sticky の間の keep-alive 接続だと思われます。

sio-sticky は 新規のTCP接続があった時に、配下のWorker(Node.js)にその接続を渡すので、keep-aliveされたあとの2回目以降のHTTPリクエストのヘッダなどを見たりしません。
また、ALBはどのターゲットにリクエストを送るかは制御していますが、どのkeep-aliveされた接続にどのHTTPリクエストを流すかは気にしてはいないので、基本的に運任せになります。

下の図で説明しますと、

![20170829_WebSocket400エラー問題の説明.png](https://qiita-image-store.s3.amazonaws.com/0/11124/eb8ec4fd-6c40-7c5a-77c9-763491372a65.png "keep-alive.png")

* ① Browser1 と Browser2 は、異なるWorker(Node.js)に振り分けられていたとする
* ② Browser2からのリクエストがしばらくなくても、ALBとWorkerの間のTCP接続は維持される(keep-alive)
* ③ Browser1からALBにリクエストがある場合、この別のWorkerとkeep-aliveされた接続にリクエストが流されることがある。異なるworkerにリクエストが行くと、`Session ID unknown`と怒られてしまう。

というイメージです。

## 検証

sio-stickyのkeep-alive時の動作についての検証は下記を見てください。
https://github.com/mokemokechicken/socket-io-sticky-session/blob/feature/for_test_keep-alive/NOTE-keep-alive.md

ちなみに、ALBからsio-stickyへの接続は通常の設定ではkeep-aliveされますし、今回の現象も確認することができます。

さいごに
=====
sio-stickyのような仕組みだとTCP接続時に振り分けるので辛いのでしょうね。
keep-aliveを無効にするのも非効率ですし、sio-stickyなどを使わずに1つのNode.jsを直接ALBにぶら下げるのがBetterなのかなぁ、と思います。
FuelPHP 1.8.2 の使い方

PHP 8.0.2 で、FuelPHP 1.8.2 を使う方法です。

ソースのインストール
２つの方法があります。

1) zip ファイルをダウンロードして行う方法

> [FelPHP](https://fuelphp.com/)から、fuelphp-1.8.2.zip　をダウンロードして、解凍します。

2) oil コマンドをインストールして行う方法

> curl https://get.fuelphp.com/oil | sh
で、/usr/local/bin/oil がインストールされます。

> プロジェクトの作成

>```bash
oil create test
```

どちらの方法でも、

* docs
* fuel
* public
 
というサブフォルダーを含むツリー構造ができます。
それぞれ、fuelphp-1.8.2 以下と、test 以下です。

```text
$ tree -L 1
.
├── CHANGELOG.md
├── CONTRIBUTING.md
├── LICENSE.md
├── README.md
├── TESTING.md
├── composer.json
├── composer.lock
├── composer.phar
├── docs
├── fuel
├── oil
└── public
```

サーバーの起動

```bash
oil server
```

http://localhost:8000 にアクセスすると、

![fuelphp_aug3101.png](https://qiita-image-store.s3.amazonaws.com/0/179446/0418001b-d923-355f-fed4-b0a45c4d9813.png)

表示されるページは、
fuel/app/views/welcome/index.php
です。
Python zipとenumerateの使い方

python2.Xの記事を見つけてpython3.Xでも動作確認したので備忘録として書いてます

## 準備

```python:list.py
a = ['あ','い','う','え','お']
b = ['か','き','く','け','こ']
```
例えばこういうリストがあったとする。

## enumerate

```python:enumerate.py
for i,ai in enumerate(a):
  print(i,ai)
```
とすると

```text:実行結果
0 あ
1 い
2 う
3 え
4 お
```
こんな感じになる

## zip

```python:zip.py
for ai, bi in zip(a, b):
  print(ai, bi)
```
とすると

``` text:実行結果
あ か
い き
う く
え け
お こ
```

こんな感じ。ちなみに3つ以上のリストも同様にしてまとめられる。

## enumerate & zip

enumerateとzipを同時に使いたいときに

``` python:error.py
for i, ai, bi in enumerate(zip(a, b)):
  print(i, ai, bi)
```
このように書くとエラーを起こした。

```txt:実行結果
ValueError: not enough values to unpack (expected 3, got 2)
```

で、何か方法はないかと調べた結果、下のようにすれば良いらしい。

``` python:success.py
for i,(ai, bi) in enumerate(zip(a, b)): # zipのところを()で囲った
  print(i, ai, bi)
```

``` text:実行結果
0 あ か
1 い き
2 う く
3 え け
4 お こ
```

### 参考

https://www.saltycrane.com/blog/2008/04/how-to-use-pythons-enumerate-and-zip-to/
[WPF] ItemTemplateを動的に変更する

## 目的

ItemsControlでデータを表示している際に、StyleModeプロパティの値を変更することで使用しているItemTemplateを変更・反映したい。
今回は、StyleModeが1の場合は大きいフォントでName、小さいフォントでMessageを2行で表示し、StyleModeが2の場合はNameのみを小さいフォントで表示する要素を作成する。

## 方法
Window.Resourceに使いたいDataTemplateを登録し、それぞれをバインドしたStyleModeプロパティの値でItemTempateに割り当てるDataTriggerを作成する。

```xml:Mainpage.xaml
<Window.Resources>
    <ResourceDictionary>
        <DataTemplate x:Key="DataTemplate1" >
            <TextBlock Margin="5">
                <Run Text="{Binding Name}" FontSize="25"/>
                <LineBreak />
                <Run Text="{Binding Message}" FontSize="15"/>
            </TextBlock>
        </DataTemplate>
        <DataTemplate x:Key="DataTemplate2" >
            <TextBlock Margin="5">
                <Run Text="{Binding Name}" FontSize="15"/>
            </TextBlock>
        </DataTemplate>

        <Style x:Key="selectableContentStyle" TargetType="{x:Type ItemsControl}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding StyleMode}" Value="1">
                    <Setter Property="ItemTemplate" Value="{StaticResource DataTemplate1}" />
                </DataTrigger>
                <DataTrigger Binding="{Binding StyleMode}" Value="2">
                    <Setter Property="ItemTemplate" Value="{StaticResource DataTemplate2}" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ResourceDictionary>
</Window.Resources>
```

そして、使用するItemsControlでStyleとして指定する。

```xml:Mainpage.xaml
<ItemsControl ItemsSource="{Binding Data}" 
              Style="{StaticResource selectableContentStyle}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel Orientation="Vertical" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>
```

## 備考
最初、こういうことがやりたい場合はDataTemplateSelectorを使うっていう情報に当たったので頑張っていたが、なかなかうまくいかなかった。
今回の方法で実現できたものの、ひょっとすると邪道なやり方なのかもしれない。
swapファイルの作成



# 2GBのスワップを作成

```
dd if=/dev/zero of=/swap bs=1024 count=2000000
chmod 600 /swap
mkswap /swap
```

# 手動で操作

## 起動

```
swapon /swap
```

## 終了

```
swapoff /swap
```

# 自動で起動

/etc/fstabに登録

```
/swap none swap defaults 0 0
```
Azure クラウドサービスの開発時に使えるオレオレ証明書をopensslで作るワンライナー

ChromeがCNを受け入れないでSANが必須になってしまったので面倒なことになった。

```bash
openssl req \
  -newkey rsa:4096 \
  -days 3650 \
  -nodes \
  -x509 \
  -subj "/C=JP/ST=Distributed/L=Cloud/O=Cluster/CN=localhost" \
  -extensions SAN \
  -config <( cat /etc/pki/tls/openssl.cnf  \
    <(printf "[SAN]\nsubjectAltName='DNS.1:dev.mydomain.com,DNS.2:*.mydomain.jp'")) \
  -keyout server.key \
  -out server.crt ;\
openssl pkcs12 -export -out server.pfx -inkey server.key -in server.crt
```

- Centos7向け `-config`のパスを変えればだいたい大丈夫。
 - `find /etc -name 'openssl.cnf'` とかで探したり。
- SANの`DNS.*:`に続くドメインは複数指定可能。
- サブジェクトのCNは適当に。

実行したあとに出来上がるserver.pfxをインポートして使用しましょう。

ワンライナーなので一応1行でも。

```bash
openssl req -newkey rsa:4096 -days 3650 -nodes -x509 -subj "/C=JP/ST=Distributed/L=Cloud/O=Cluster/CN=localhost" -extensions SAN -config <( cat /etc/pki/tls/openssl.cnf <(printf "[SAN]\nsubjectAltName='DNS.1:dev.mydomain.com,DNS.2:*.mydomain.jp'")) -keyout server.key   -out server.crt ;openssl pkcs12 -export -out server.pfx -inkey server.key -in server.crt
```

##参考
[OpenSSL certificate with subjectAltName one\-liner \| SciSpike](http://www.scispike.com/blog/openssl-subjectaltname-one-liner/)
[Chrome58で、HTTPSの自己証明書が NET::ERR\_CERT\_COMMON\_NAME\_INVALID になる場合の対応](http://tech.torico-corp.com/blog/chrome58-https-ssl-cert-san-error/)
[SSL証明書\(pfx形式\)作成メモ \- Qiita](http://qiita.com/nntsugu/items/c4b3e5c9e0f8593a27d8)
[オレオレ証明書をopensslで作る（詳細版） \- ろば電子が詰まっている](http://d.hatena.ne.jp/ozuma/20130511/1368284304)
BlurAdmin スタートアップメモ


windowsでの設定メモです。

# install
以下のインストールガイドにそって進む
https://akveo.github.io/blur-admin/articles/002-installation-guidelines/

gitとnodejsがPCに入っていない場合には入れる。

## ソースの入手
gitでクローンするか、
```bash
git clone https://github.com/akveo/blur-admin.git
```
githubからダウンロードする。https://github.com/akveo/blur-admin

## 依存関係のセットアップ

package.jsonには不足している参照があるので以下を追加する
https://github.com/akveo/blur-admin/issues/180

```js
    "eslint-config-defaults": "9.0.0",
    "eslint-plugin-react": "7.3.0",
```

上記でPC上に展開したフォルダでコマンドプロンプトを開く。
```bash
npm install
```

## ビルド

### 開発用（デバッグする時とか）の為のビルドは以下
gulp serve


babel-eslintエラーが出る場合には、
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/8323ca5b-bc43-0f83-96bc-ab6ecff7725b.png)
C:\Users\{username}\.eslintrc ファイルを削除して再度行う




実行結果
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/52f45da9-25aa-098e-0664-eb3a42998dc7.png)


### リリース用（jsファイルとか一つのファイルにまとめる）場合は以下
gulp serve:dist


## Visual Studioでやる場合

### パッケージの復元
bower.json、またはpackage.jsonを右クリックしてパッケージの復元を選択する。
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/0c5b6834-c9c3-624b-b81a-36b0240dd510.png)


### 確認
設定時点で以下のような構造になっているかと思います。
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/428a41d4-f8a8-089e-8128-ccf355fc6a1c.png)

「全てのファイルを表示」オプションをONにすると以下のような感じ
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/e2123677-2deb-b891-ad20-a15429d10ad7.png)

### ビルド

gulpfile.jsファイルを右クリックしてコンテキストメニューからタスクランナーを選択する。
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/21e30dc9-3b3e-c639-c27a-8b0535e9365d.png)

タスクランナーが表示されない場合には以下を入れる。https://marketplace.visualstudio.com/items?itemName=MadsKristensen.NPMTaskRunner

#### 開発要にビルドを行う場合には、dev-releaseを実行する。
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/cf3abde8-3937-1cfd-9c9a-2313d49f1a91.png)

dev-releaseフォルダが作成されるので、配下のindex.htmlを実行する。
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/bd627091-c748-d25e-f6ca-545089c342f0.png)


#### リリース用をビルドする場合には、defaultを実行する。


ビルド時に、Missing binding node-sass\vendor\win32-x64-47\binding.node と表示される場合がある。
その場合には、ツール→オプション
ダイアログから、プロジェクト及びソリューション→Web Package management→外部Webツールを開き、
$(PATH)を2段めに上げる。（$(VSINSTALLDIR)\Web\Externalよりも上にする）
https://github.com/madskristensen/WebPackTaskRunner/issues/37

![image](https://qiita-image-store.s3.amazonaws.com/0/49910/8c2f8b81-bc45-db2c-aa88-18a1c7b12322.png)


Missing binding node-sass\vendor\win32-x64-51\binding.node と表示された場合には$(PATH)の階層を$(VSINSTALLDIR)\Web\External よりも下にする。


# キャッシュを無効にする場合 (IIS)

web.configに以下を追加

```xml
<caching>
  <profiles>
    <add extension=".html .js .json .css" policy="DisableCache" kernelCachePolicy="DontCache" duration="00:00:10" />
  </profiles>
</caching>
    

<system.webServer>
    <httpProtocol>
      <customHeaders>
        <!--ブラウザ キャッシュ を 無効化 する-->
        <remove name="Cache-Control"/>
        <remove name="Pragma"/>
        <add name="Cache-Control" value="no-cache, no-store, must-revalidate"/>
        <add name="Pragma" value="no-cache"/>
      </customHeaders>
    </httpProtocol>
    
</system.webServer>

 ```
[メモ]let's encryptの通知先メールを変更する

この記事は
===

* ただのメモです

概要
===

* Let's Encryptの登場でSSL証明書は無料が当たり前になりました
* ただ有効期限が非常に短いので1カ月に1回位更新する必要があります
* cronやると自動化できるんですが何らかの理由で失敗している時、期限切れが近くなってくるとメールで通知が来ます
* そのメアドは最初にユーザ登録した時のアドレスですが、変更することができます

手順
===

* 下記

```
./certbot-auto register --update-registration --email new_mail@example.com
```

終わりに
===

* 実は上記手順で本当に更新後のメアドに期限切れ通知メールが来るのかは確認できてません
* なのでこの記事は信じないでください

参照
===

* [how to change email address for certificates #3310](https://github.com/certbot/certbot/issues/3310)
Wijmo3のgridを使う

　Google日本語入力に甘やかされて生きているので客先のことえりがつらいヽ(´@ω@`)ノ
　Wijmoの話しまーす。

## Wijmoとは

　株式会社グレープシティのHTML5/Javascript製品です。→[Wijmo](http://wijmo.c1.grapecity.com/)
　HTML上でExcelライクなUIを作成したりできます。
　この会社、フォーガンシーも含め私のExcel嫌いをガンガン踏み抜くすてきな会社です（地声）エクセルがやりたいならエクセルでやれよ（地声）
　でもたぶんあれだよね、これ系の、今までExcelでやってた内容に拘るお客様、どっかの低俗SIerとかいう武器商人みたいなのに業務改善とか言われてわけもわからず発注させられちゃってるんだろうし、そういう発注を受けちゃったシステム屋を助けてくれるのがWijmoだと思うと憎む気にもなれないような……。  
　大体にして、今までExcelでやってたのと同じことを！　と言い出すお客様、そんなに業務改善を望んでいないような気がするんだよな……。経験上。不慣れなものが入るとそれだけで業務は圧迫されるし。何がどう良くなって欲しいかのイメージも特に持ってない、みたいな。

　閑話休題。
　ギョームでWijmoを使ったのでｻﾞﾗｯとした感想と忘備録。備忘録。

## grid

　[参考](http://demo.grapecity.com/wijmo/3/WidgetExplorer/?widget=Grid&sample=%E6%A6%82%E8%A6%81)
　表を作る。ソートとフィルタリングができるのはたいへんに良いことだと思う。
　angularJS知ってればそっちの方が楽じゃね？　と思ったりしますけど、取っ付きやすさコードの短さで言えばWijmoに軍配かしらといった具合。書かないで済むし。
　
## gridの入力制限

　inputTypeプロパティにnumberとかbooleanを指定してやることで割と自動で完了。booleanはチェックボックスになる。
　ただ、MySQLはboolean=tinyintになってしまうので、ちょっとこの辺りは食い合わせが悪い。postgreならそんなに腐心しなくて済んだのかもしれない。腐心ってほど悩みゃしませんでしたが。
　ドキュメントは[このへん](http://wijmo.c1.grapecity.com/docs/wijmo/webframe.html#ConfiguringColumns.html)と[このへん](http://wijmo.c1.grapecity.com/docs/wijmo/webframe.html#Wijmo~wijmo.grid.IColumn.html)を見るとデータ型の設定はわかりやすいかなと思います。
　ただ検索するとWijmo5のFlexGridの話ばっかりじゃんじゃか出てきてちょっと困りました。
　
## ページング

　grid初期化の際に`allowPaging : true,pageSize:10`とか設定してやると割と自動でページネーションが表示される。便利。
　ただ新規行追加の際、何も考えずdata.push(newRow)みたいなことをしたら一番最後のページの一番下に行追加されるというめんどっちい目に遭ったので注意。unshiftをオススメする。
　初期化時の設定項目とかはこちら:[ドキュメント](http://wijmo.c1.grapecity.com/docs/wijmo/webframe.html#GridQuickStart.html)

## 特定列の入力コントロールを変更する

### プルダウンメニュー

　[参考](http://demo.grapecity.com/wijmo/3/WidgetExplorer/?widget=Grid&sample=%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0%E3%82%A8%E3%83%87%E3%82%A3%E3%82%BF)。
　Gridの特定列(のいずれかのカラム)が選択された時にそのカラムにinputコントロールを物理的にぶちこむスタンス。ヤダ強引。
　ちなみに、ドキュメント見ながらデータ配列を`[{label:"hoge",value:"moge"}]`の形にしてみたのだけど、値をうまく取得できず……。謎い。ラベルなんか取れても困る。
　Excelをモデルにしてると考えれば表面の文字が取れてくるのはまったく自然なことで、マスタデータの表示名を表示してIDを取得〜みたいな頭のいいことはやらないで、すべてベタ書きでやると一番楽だと思います。

### カレンダー

　上記を参考に

```js
    $("<input />").width("100%").val(args.cell.value()).appendTo(
            args.cell.container().empty()).wijinputdate({
                dateFormat: 'yyyy-MM-dd HH:mm:ss'
    }).focus();
```

みたいなこと書いたら動いた。力こそパワー。

## 雑感

　個人的には、PHPとかJavaのフレームワークに組み込んでそっちのコントローラと一緒に扱うよりは、APIとajax通信でやった方が使い勝手がよい、という印象。
　ソースコードとかシステムとしてのスマートさよりも楽さの方が目立ちます。難しいこと考えなければそれなりのものがばしっと作れる。DBの正規化とか考えない方がよさそうです。
Google Analytics から PageView の多い順で パスを取得（Ruby）

Google Analytics から PageView の多い順で パスを取得したくなりました。ruby です。

なんか、 `garb` という gem もあったりするのですが、`google-api-client` を使う方法でやります。クレデンシャルとかが最初よくわからなかったのですが、斜め向かいの席の方に教えてもらい無事できましたので、備忘録です。

最初にファイル構成と流れをご紹介します。そのあとに、クレデンシャルやちょっとハマったところを書きます。


# ファイル構成

```bash
$ tree
.
├── Gemfile
├── Gemfile.lock
├── analytics_credential.json
└── ga.rb
```

こんな構成です。


# ファイル内容と流れ

```ruby:Gemfile
source "https://rubygems.org"

gem 'google-api-client'
```

```
bundle i
```

`ga.rb` が本体になります。ポイントはコメントで書いておきます。

```rb:ga.rb
require 'google/apis/analytics_v3'

CREDENTIAL_PATH = './analytics_credential.json' # これは事前に取得しておく必要があります
VIEW_ID = {VIEW_ID} # ここはそれぞれ

SCOPES = ['https://www.googleapis.com/auth/analytics.readonly']

client = Google::Apis::AnalyticsV3::AnalyticsService.new

client.authorization = Google::Auth::ServiceAccountCredentials.make_creds(
  json_key_io: File.open(CREDENTIAL_PATH),
  scope: SCOPES
)

data = client.get_ga_data(
  "ga:#{VIEW_ID}",
  (Date.today-10).strftime, # たとえば10日前からのデータ
  (Date.today).strftime,
  "ga:pageviews",
  {
    dimensions: "ga:pagePath",
    sort: "-ga:pageviews", # 降順はマイナスをつける
    max_results: 10 # 上位10件だけ取得
  }
)

data.rows.each do |row|
  p row
end
```

これで、以下のような結果を得ることができました。

```bash
$ ruby ga.rb
["/", "10430"]
["/franchises/2129", "9518"]
["/budget_1", "4288"]
["/event/44?site=app", "3403"]
["/dokuritsu_kaigyo/1932", "2347"]
["/?utm_group=G045&device=SP&creative=IF", "2122"]
["/ranking", "2044"]
["/franchises/2105", "2013"]
["/?utm_group=G009&device=PC&creative=text", "1999"]
["/lp/soc_lp?site=yahoo", "1765"]
```

# クレデンシャルはどうやって取得するのか？

これが、けっこうややこしい気がします。

- まず [console](https://console.developers.google.com) で、プロジェクトをつくります。
- そのあとに、AIP を有効化にすすんで、Analytics API を有効化します。
- そうすると以下の画面にすすめます。「認証情報を作成」というリンクが右上にありますので、そこから作成します。

![スクリーンショット 2017-08-31 13.47.45.png](https://qiita-image-store.s3.amazonaws.com/0/45822/784efeac-28ae-8c93-3e93-0bde747ec642.png)

- 以下のように設定してみます。

![スクリーンショット 2017-08-31 13.50.30.png](https://qiita-image-store.s3.amazonaws.com/0/45822/1f217007-61c1-983a-9025-5f9832060eab.png)

- 下のサービスアカウント名は任意です。JSONにチェックをつければ json が手に入ります。（役割は...ちょっと適当です。
 
![スクリーンショット_2017-08-31_13_51_12.png](https://qiita-image-store.s3.amazonaws.com/0/45822/b90a5b31-6e26-1aef-fb6b-1282b6c5457d.png)


# Google Analytics に上記で作成した、「サービスアカウントID」を登録する

上で `analytics@hoge-hoge.serviceaccount.com` といった形のサービスアカウントIDがつくられました。これをGAの対象としたい View のユーザに追加してください。

これをしないと 

```
User does not have any Google Analytics Account
```

となります。



以上です。ありがとうございました！ 🍋
REPOSITORY や TAG が <none> の Docker image を削除するワンライナー

Docker imageをpullやbuildしまくっていると``docker images``した時に``<none>``と表示された行がたまってきます。
Dockerあるあるですね。

そんなimageを一掃したい時に使うワンライナー

```sh
docker images | grep <none> | awk '{ print $3 }' | xargs docker rmi
```        


と書いてから気がついた別解。

> Dockerで<none>なイメージを一括で削除するワンライナー
http://qiita.com/DQNEO/items/e3a03a14beb616630032


さらにコメント頂いた別解。

```sh
docker images prune
```

使っていないイメージ全削除という恐ろしい説明がついていたので使用をためらっていたのですが、ちゃんとぶらさがっていない(not dangling)なイメージだけ削除してくれます。


さらに使ってない(not dangling)な container, volume, network,imageを全て削除してくれる別解

```sh
docker system prune
```


シェル芸（というほどでもない）の時代は過ぎ去ったようです。
[Android] ステートマシンでアニメーションの順次実行を制御する

あるViewに対してアニメーション①を実行し、終了したらアニメーション②を実行し、、ということを実現したいとします。ただリスナーでアニメーションの終了を検知しているとコードがネストしたり、繰り返したい場合にどうすればいいか困ったりします。

そういう場合は、`enum` でステートマシンを作ってアニメーションを実行するとコードがすっきりします。

例えば下記のコードは、あるViewに対してアニメーション `AnimState1` `AnimState2` `AnimState3` の順次実行を繰り返し行うコードの例です。

```java:SomeAnimState.java
enum SomeAnimState {
    Stop {
        @Override
        protected void start(View view) {
            changeState(view, AnimState1);
        }
    },
    AnimState1 {
        @Override
        protected void enter(View view) {
            view.setAlpha(0);
            view.animate().alpha(1.0F).setDuration(1000).setInterpolator(new LinearInterpolator()).setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    changeState(view, AnimState2);
                }
            });
        }
    },
    AnimState2 {
        @Override
        protected void enter(View view) {
            view.animate().scaleX(2.0F).scaleY(2.0F).setDuration(1000).setInterpolator(new OvershootInterpolator()).setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    changeState(view, AnimState3);
                }
            });
        }
    },
    AnimState3 {
        @Override
        protected void enter(View view) {
            view.animate().scaleX(1.0F).scaleY(1.0F).setDuration(1500).setInterpolator(new FastOutSlowInInterpolator()).setListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    changeState(view, AnimState1);
                }
            });
        }
    },
    ;

    private static SomeAnimState currentState = Stop;

    public static void startAnim(View view) {
        currentState.start(view);
    }

    public static void stopAnim(View view) {
        currentState.stop(view);
    }

    protected void start(View view) {}

    @CallSuper
    protected void stop(View view) {
        currentState.changeState(view, Stop);
    }

    protected void enter(View view) {} // 各ステートが開始した際にさせる処理をオーバーライドで記述

    protected void exit(View view) {} // 各ステートが終了する際にさせる処理をオーバーライドで記述

    protected void changeState(View view, SomeAnimState nextState) {
        if (currentState != this) return;
        currentState.exit(view);
        currentState = nextState;
        currentState.enter(view);
    }
}
```

アニメーションを開始する場合は、staticメソッド `startAnim()` を呼び出します。すると各ステートの `start()` を呼び出すようになっているので、もし `Stop` ステータスでない場合は、何もしないようになっています。

```java:アニメーションの開始
SomeAnimState.startAnim(someView);
```

同様に、繰り返しアニメーションにしている場合等でアニメーションを終了する場合は、staticメソッド `stopAnim()` を呼び出します。

```java:アニメーションの終了
SomeAnimState.stopAnim(someView);
```

> 繰り返しにしている/していないに関わらず、アニメーション実行中にActivityの終了等でViewが死ぬケースがあるので、`onDestroy()` できちんと終了を呼び出しておくと安全です。

以上
[Laravel-mix] npm run dev で sh: cross-env: command not found

##環境
CenntOS 7.3
Laravel 5.5(5.4でも同じエラーになる)
PHP 7.1.9
npm 3.10.10
node 6.11.1

WindowsのDirをDocker環境にmountしてるので
--no-bin-links つけてます。

注)2017/8/31時点での成功例です。

##現象
npm run dev
実行時に「sh: cross-env: command not found」となる。

2017/8/21の時点では
npm install cross-env --save-dev --no-bin-links
で良かったのに、8/30にはダメになってた。

##手順
1) node npm install

```command:yum
sudo yum install -y nodejs npm https://kojipkgs.fedoraproject.org//packages/http-parser/2.7.1/3.el7/x86_64/http-parser-2.7.1-3.el7.x86_64.rpm
```

2)  project作成

```command:composer
composer create-project laravel/laravel:5.5.* --prefer-dist mix
```

3) mix環境作成

■ package.json のdevDependenciesから "cross-env": "^5.0.1", を削除

```command:shell
cd mix
vi package.json             [devDependenciesからcross-envを削除]
npm -g install cross-env cross-spawn [globalに入れる]
npm install --no-bin-links  [npm ERR! Maximum call stack size exceededとなる]
npm install --no-bin-links  [再度実行]
npm rebuild --no-bin-links  [ERRになったのでrebuild]
npm run dev                 [DONE Compiled successfullyとなる筈]
```

※npm install --no-bin-links 実行時にパーミッションエラーになったら
キャッシュがよくないみたいですので全部消してやり直しました。

```command:shell
npm cache clean
rm -Rf ~/.npm
rm -Rf ./node_modules
```

追記:cross-spawnも必要でした。

参照
・[CentOS 7.3でyum install nodejsが失敗するので回避する](http://qiita.com/toshi-click/items/36e08b5c4604efa67a4a)
・[Compile assets with Laravel Mix Error on Laravel 5.4 and Node.js](https://stackoverflow.com/questions/45492017/compile-assets-with-laravel-mix-error-on-laravel-5-4-and-node-js)
・[Laravel 5.4 'cross-env' is not recognized as an internal or external command
](https://stackoverflow.com/questions/45034581/laravel-5-4-cross-env-is-not-recognized-as-an-internal-or-external-command)
git rm 取り消し編 [ コミット前 ]

#はじめに
gitを使ってバージョン管理を行っているのだが、操作を誤り、
git rm 〇〇〇.txt(ファイル名)を指定して、意図しないファイルの削除を実行してしまった。

```git add``` を間違えた時のように、```git reset``` で戻るかと思ったが戻らないので、
戻す方法を簡単にメモしておく。(自分用)

_＃そして、これから書くことは__Git__を使いこなしている方からすると、大したことではないので、
Gitを触り始めた初心者の方向けの記事となります。ご了承ください。_

### __git rm__ で__削除したファイルを復帰させる方法__ [ コミット前 ]

```
$ git checkout 〇〇〇.txt (誤って、git rmしたファイル名を指定)
```

```git checkout``` コマンドを使って、誤って削除したファイルを元の状態に戻すことができます。
IE11でTurf.jsを利用する


Turf.jsが内部でObject.assign()を利用しているため、IE ver.11ではTurfを利用できない。

Polyfillを利用することで、一応IE11でも使えるようになる。

```js:Polyfill
if (typeof Object.assign != 'function') {
  (function () {
    Object.assign = function (target) {
      'use strict';
      if (target === undefined || target === null) {
        throw new TypeError('Cannot convert undefined or null to object');
      }

      var output = Object(target);
      for (var index = 1; index < arguments.length; index++) {
        var source = arguments[index];
        if (source !== undefined && source !== null) {
          for (var nextKey in source) {
            if (Object.prototype.hasOwnProperty.call(source, nextKey)) {
              output[nextKey] = source[nextKey];
            }
          }
        }
      }
      return output;
    };
  })();
}

```

ただし、IEだと計算処理はめっちゃ遅い。
プルダウンでの画面遷移メモ

###内容
プルダウンを変更して画面遷移するメモ
option タグのvalueの値に遷移する。

```html:html
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
    $('select[name=prefecture]').change(function() {
        if ($(this).val() != '') {
            window.location.href = $(this).val();
        }
    });
});
</script>
</head>

<body>
関東：
    <select name="prefecture">
        <option value="/map/prefecture/8">茨城県</option>
        <option value="/map/prefecture/9">栃木県</option>
        <option value="/map/prefecture/10">群馬県</option>
        <option value="/map/prefecture/11">埼玉県</option>
        <option value="/map/prefecture/12">千葉県</option>
        <option value="/map/prefecture/13" selected>東京都</option>
        <option value="/map/prefecture/14">神奈川県</option>
    </select>
</body>
</html>
```
Eclipse Neon.3 (4.6.3) 上のPHPでImageMagickを動かす

#初めに

以前、Eclipse Luna SR2 (4.4.2) 上のPHPでImageMagickを動かす
http://qiita.com/fulcrum/items/dde395a62dc49133ed8f
で作り、PHPを用いて試験的にコードを書いた後、しばらく離れていたが、
久しぶりにコードを続けようとしたら横やりが入り、
そのお陰でいろいろ破壊されたらしく、コードが動かない(涙)
＃しかもバックれるし…

10日かかった。
記録の為に記載するが、誤り等あれば指摘して下さい。

動かなくなった原因は、このページの範囲では
EclipseとOSが新しくなった事で、
VC、imagick、ImageMagickの各バージョンがごちゃごちゃした事によるものだろう。
＃横やりプロジェクトの、無理矢理なパス、Pleiades付属のxamppの変な仕様、妙な設定ファイルの指示もあるが割愛。

なお、感想としては…
Windows10(に限らず新しめのWindows) +PHP+ImageMagickは結構はまると思われるので、お勧めしません…

# インストール環境 - 案外、これ重要。

Windows 7 Professional SP1 64ビット + Eclipse Luna SR2 (4.4.2)。
->
Windows 10 Pro 64bit + Eclipse Neon (4.6.3)

OS上げたのは自己都合です(爆) 何故かPHPInfoでは8.1になっとりますが。
Eclipse Neonは、そこに上げさせられた感じ -> 無意味なんだけど。
どうせなら、4.7に上げるか？と思ったけど、勝手に上げるなとか、また変な言いがかりが増えそうなんでやめておいた。

#必要な作業の概要

##0. 増えた作業

###0-1. 新しいパッケージの確保
####全部のMicrosoft Visual C++ … (visual c++ 再頒布可能パッケージ) 32bit/64bit
-> PHPInfoによるとMSVC11(Visual C++ 2012)のx86の為、、Microsoft Visual Studio 2012 (VC++ 11.0) 32bitだけで良いと思うが、こいつらもマメに上がっているので、最新入れ直した方が良いと思われ。

ここが便利。一部リンク切れ。
https://support.microsoft.com/ja-jp/help/2977003/the-latest-supported-visual-c-downloads

####ImageMagick
ftp://sunsite.icm.edu.pl/packages/ImageMagick/binaries/
より
ImageMagick-6.7.9-0-Q16-windows-dll.exe
->
ImageMagick-6.9.5-9-Q16-x86-dll.exe

PHPInfoを見て、OSがx86になってたから。

バージョンはここら見てえいやで決めた。
http://www.ownway.info/Ruby/rmagick/howtoinstall/windows#check_image_magick_version
http://funct.hatenablog.com/entry/20160601/p1

Qは8でも16でもいいでしょう。dll版の善し悪しは賛否両論有ったが、dll版にした。

####imagick
https://pecl.php.net/package/imagick
から
php_imagick-3.3.0-5.6-ts-vc11-x86.zip

バージョンはあんまり考えてない(爆)
PHPInfoから、PHP 5.6.30で有る事、MSVC11で有る事、x86で有る事、Thread Safety Enabledで有る事からこれにした。

###0-2. 古い環境の削除

ImageMagickと、MSVCのパッケージ(新しく確保できたの)は、
アプリとして削除、OSの再起動後にフォルダがあればそれも削除した。

###0-3. Microsoft Visual C++ … (visual c++ 再頒布可能パッケージ) のインストール
バージョンの古い順から、x86入れた後にx64導入、を徹底。
アプリと機能、を都度確認しながら、位の慎重さで良いと思う。

ここからが、以前とそんなに変わらない。

##1. ImageMagickのインストール

ImageMagick ImageMagick-6.9.5-9-Q16-x86-dll.exe インストール。

インストール先は、C:\ImageMagick。
-> スペース禁止なのでデフォのProgram Files配下は避けるのが無難。「-」はどうだったかな？
オプションは、デフォ+Install development headers and libraries for C and C++。

##2. 環境変数の登録

自動的に追加される事もあるが、Pathの先頭にC:\ImageMagickを追加、
MAGICK_HOMEを新設し、C:\ImageMagickを指定した。

以前はC:\ImageMagick\modules\codersを指定したけど、そうで無くて良いみたい。

なお、この時点で、プログラム一覧からImageMagick->ImageMagick Displayの起動を試して、起動しない様ならここまでで失敗している。

##3. Microsoft Visual C++ Redistributableのインストール
先にやった

##4. PECL imagickのインストール

php_imagick-3.3.0-5.6-ts-vc11-x86.zip

を展開して、

php_imagick.dll
を
C:\プレアデスのインストールディレクトリ\xampp\php\extに、

CORE_RL_bzlib_.dll、CORE_RL_glib_.dll、CORE_RL_lcms_.dll、CORE_RL_lqr_.dll、CORE_RL_magick_.dll、CORE_RL_ttf_.dll、CORE_RL_wand_.dll、CORE_RL_zlib_.dll
を
C:\プレアデスのインストールディレクトリ\pleiades\xampp\php
に、コピーする。

##5. php.iniへの記載

ファイルの最後に
[PECL]
extension=php_imagick.dll
記載。

##6. OSごと再起動

##7. 確認
PHPInfoで、imagickが表示されていれば成功。