OmniAICreator/Qiita-1.07M huggingface dataset:
リネーム情報しか載せてないパッチ(コミット差分)を基に patch コマンドを適用しても、何もしてくれない。

なぜならば ```patch``` コマンドにとって リネーム(rename) 情報は ```garbage = ゴミ``` に相当し

差分適用の対象外だから。

リネーム情報しか載せていないパッチ、というのは以下のようなパッチだ。

```some.patch
diff --git a/appAdmin/moduleX/logic.txt b/appAdmin/moduleX/renamedLogic.txt
similarity index 100%
rename from appAdmin/moduleX/logic.txt
rename to appAdmin/moduleX/renamedLogic.txt
```

ここから下は備忘的なものになるので、有益なるのは ```man patch``` や [Man page of PATCH](https://linuxjm.osdn.jp/html/GNU_patch/man1/patch.1.html#index) になるかもしれない。

## 備忘録

### 環境

* MacOSX - 10.12.5
* git - 2.11.0
* patch - 2.5.8

以下のようなプロジェクトがあるとする。

```
project
|
|── patchDir ── 001_rename.patch
|── .git
|
├── appAdmin
│   └── moduleX
│       └── logic.txt
└── appCustomer
    └── moduleX
        └── logic.txt
```

2 つの ```logic.txt``` のファイル内容は全く同一とする。

### 操作

今、 ```appAdmin/moduleX/logic.txt``` > ```appAdmin/moduleX/renamedLogic.txt``` へ

リネーム、コミットした。

```
project
|
|── patchDir ── 001_rename.patch
|── .git
|
├── appAdmin
│   └── moduleX
│       └── renamedLogic.txt
└── appCustomer
    └── moduleX
        └── logic.txt
```

```git diff``` より直前コミットとの差分からパッチファイルを作成した。

```patchDir/001_rename.patch
diff --git a/appAdmin/moduleX/logic.txt b/appAdmin/moduleX/renamedLogic.txt
similarity index 100%
rename from appAdmin/moduleX/logic.txt
rename to appAdmin/moduleX/renamedLogic.txt
```

### あることを考えた

上記のパッチファイルを書き換えて、

```appCustomer/moduleX/logic.txt``` > ```appCustomer/moduleX/renamedLogic.txt```

にできるかどうか。つまり

```patchDir/001_rename.patch
diff --git a/appAdmin/moduleX/logic.txt b/appAdmin/moduleX/renamedLogic.txt
similarity index 100%
rename from appAdmin/moduleX/logic.txt
rename to appAdmin/moduleX/renamedLogic.txt
```

↓

```patchDir/001_rename.patch
diff --git a/appCustomer/moduleX/logic.txt b/appCustomer/moduleX/renamedLogic.txt
similarity index 100%
rename from appCustomer/moduleX/logic.txt       << ココを appAdmin > appCustomer へ
rename to appCustomer/moduleX/renamedLogic.txt  << 同上
```

へ書き換えた後 ```patch -p1 < patchDir/001_rename.patch``` したら

```appCustomer/moduleX/logic.txt``` > ```appCustomer/moduleX/renamedLogic.txt```

になってくれるか。

### 検討結果

できないようで。

実際に

```
$ patch -p1 < patchDir/001_rename.patch
patch: **** Only garbage was found in the patch input.
```

こんなエラーが出る。```patch``` にて ```garbage``` しか見つからんと。せんかたない。

```man patch``` からするに、パッチ内 ```rename``` の情報は ```garbage = ゴミ``` 

なので、差分適用の対象外になる(```patch``` がパッチ適用してくれる対象から外れる)と。

## 蛇足

```git apply(or am)``` でどうにかリネームのみのパッチ適用ができるらしい。記事が膨れるのでまた。

## 関連記事

http://qiita.com/ymatsukawa/items/c5c06c06f98359547935
fish + peco で git の色んなものを楽に選択する

gitのブランチやファイル、コミットのハッシュ、タグをpecoで楽に選択できるプラグインを作ってみました
github: [peco_select_git_misc](https://github.com/tamanugi/peco_select_git_misc)

## インストール

```
fisher tamanugi/peco_select_git_misc 
```

## 使い方

細かい関数に分かれているので、それぞれ適当なキーバインドに割り当てて使用してください

```fish:config.fish
function fish_user_key_bindings
  bind \cx\cb peco_select_git_branch
  bind \cx\cf peco_select_git_file
  bind \cx\cs peco_select_git_file_with_status
  bind \cx\ct peco_select_git_tag
  bind \cx\ch peco_select_git_hash
end
```

各関数の実行結果は既存のコマンドバッファに追加するようになっています

![peco_select_git_misc.gif](https://qiita-image-store.s3.amazonaws.com/0/55219/65ddf646-7daa-7426-9fd6-b061a1d4b55b.gif)
Crosstool-ngをUbuntu14.04にインストールする

BareMetalで遊ぶRaspberry Piという書籍を参考に環境構築した時の話。
Crosstool-ngをビルドするところで３０分くらいハマったところのメモ。

```bash

git clone git://crosstool-ng.org/crosstool-ng
cd crostool-ng
git checkout crosstool-ng-1.20.0
./bootstrap
./configure --prefix=/home/segfo/cross
checking build system type... x86_64-unknown-linux-gnu
checking host system type... x86_64-unknown-linux-gnu
checking for a BSD-compatible install... /usr/bin/install -c
checking for grep that handles long lines and -e... /bin/grep
checking for egrep... /bin/grep -E
checking for a sed that does not truncate output... /bin/sed
checking whether sed understands -r -i -e... yes
checking whether ln -s works... yes
checking for gcc... gcc
checking whether the C compiler works... yes
checking for C compiler default output file name... a.out
checking for suffix of executables...
checking whether we are cross compiling... no
checking for suffix of object files... o
checking whether we are using the GNU C compiler... yes
checking whether gcc accepts -g... yes
checking for gcc option to accept ISO C89... none needed
checking how to run the C preprocessor... gcc -E
checking for ranlib... ranlib
checking for gobjcopy... no
checking for objcopy... objcopy
checking for absolute path to objcopy... /usr/bin/objcopy
checking for gobjdump... no
checking for objdump... objdump
checking for absolute path to objdump... /usr/bin/objdump
checking for greadelf... no
checking for readelf... readelf
checking for absolute path to readelf... /usr/bin/readelf
checking for gperf... gperf
checking for absolute path to gperf... /usr/bin/gperf
checking for bison... bison
checking for flex... flex
checking for makeinfo... makeinfo
checking for cut... cut
checking for stat... stat
checking for readlink... readlink
checking for wget... wget
checking for tar... tar
checking for gzip... gzip
checking for bzip2... bzip2
checking for patch... /usr/bin/patch
checking for bash >= 3.1... /bin/bash
checking for GNU awk... /usr/bin/gawk
checking for GNU make >= 3.80... /usr/bin/make
checking whether /usr/bin/make sets $(MAKE)... yes
checking for make 3.81... no
checking for GNU libtool >= 1.5.26... no
configure: error: could not find GNU libtool >= 1.5.26
```
ここでなんやねんコレって成った。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/e78330f0-9e75-45c4-6361-21a23629ee3b.png)


![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/803d1268-553b-a70d-2d89-3f7268b63f03.png)

> sudo apt-get install libtool-bin

これで
> ./configure&&make &&make install

できるようになった
Maya 2017はPythonが2.7.11になったからpipが入っているんじゃないか？

[**pip**](https://pypi.python.org/pypi)は2系だと **2.7.9から標準インストール** されています。

そしてMaya 2017のPythonのバージョンは **2.7.11** です。

```python
import maya.cmds as cmds
cmds.about(version=True)
# 結果: u'2017' # 

import sys
sys.version_info
# 結果: sys.version_info(major=2, minor=7, micro=11, releaselevel='final', serial=0) # 
```

![scripteditor01.png](https://qiita-image-store.s3.amazonaws.com/0/102581/1570df21-055e-a727-f93d-4b9204c6ccc2.png)


古事記にもそう書かれている。

- Maya の Python  
http://help.autodesk.com/view/MAYAUL/2017/JPN/?guid=GUID-C0F27A50-3DD6-454C-A4D1-9E3C44B3C990
- VFX Reference Platform (Visual Effects Society Technology Committee)  
http://www.vfxplatform.com/

てことは2017にはpipは入ってるんでしょうか？

# 入ってないです

入ってないです

`Lib > site-packages`　を見ると、Pythonではpipが置かれているのですが、
![pip.png](https://qiita-image-store.s3.amazonaws.com/0/102581/98f8f71c-1e24-f380-03f8-2e4064f0027a.png)

Mayaインストールフォルダ以下の　Lib > site-packages　にはありません
![mayapython_pip.png](https://qiita-image-store.s3.amazonaws.com/0/102581/97145d88-d92c-ea8d-7fc8-afc3629b93c1.png)

検索してもないのです
![search.png](https://qiita-image-store.s3.amazonaws.com/0/102581/806cab69-2ab5-f285-2fd6-25d0d8d1d2b2.png)

ｼｭﾝ...

# まとめ

入ってないんです

## 参考

ないんだったら入れよう、というのがこちらの過去記事です(▼)
pipってなんだい　という方もどうぞ。

- Mayaでのパッケージ管理 - mayapyにpipを入れてみるよ  
http://qiita.com/it_ks/items/664f56d5e203ec005ca4
コルーチンで平均値のリアルタイム計算

- コルーチンは停止・再開することができる関数
- yieldで停止
- yieldの戻り値に値をsendして再開

```py:average.py
#!/usr/bin/python                                                                                                                                                                                                  

def average():
    total = 0.0
    count = 0.0
    average = 0.0
    while True:
        # コルーチンのポイント
        # - yieldでaverageを生成して関数が停止
        # - sendから値を受け取るとそれをvalueに代入して関数が再開
        value = yield average 
        total += value
        count += 1.0
        average = total/count

avg = average()
avg.next()
print avg.send(10.0)
print avg.send(20.0)
print avg.send(30.0)
```

- 結果

```
10.0
15.0
20.0
```
[JavaScript] 負数の四捨五入がExcelと合わない問題

# はじめに

## 背景と概要

- 要件
    - JavaScriptを使用して小数n桁の四捨五入を行う
    - 計算結果はExcelと合わせること

JavaScriptのMathオブジェクトでは小数n桁の指定ができません。
JavaScriptライブラリを使用できない事情があり、関数を作ることにしました。

この際、**負数の計算で、JavaScriptとExcelの結果に差異が発生してしまいました。**
この問題を解決するまでの知見を共有します。

## 前提バージョン

- ECMA Script 2015

# 問題点

まずは、こんなコーディングをしてみました。
数値と端数処理桁数を受け取り、四捨五入した結果を返す関数です。

```js:JavaScript
function myRound(number, pricision) {
    var _pow = Math.pow(10, pricision);
    return Math.round(number * _pow) / _pow;
};
```

正の数値では期待どおり動作しましたが、負数の場合には以下のような計算結果となりました。

| 元の値 | JavaScript | Excel |
|:-:|:-:|:-:|
| -5.4 | -5 | -5 |
| -5.5 | **-5** | -6 |
| -5.9 | -6 | -6 |

Excelの計算と異なってしまっており、要件を満たせません。

# 解決策と得られた知見

JavaScript(Math)とExcelでは、負数の四捨五入の仕様が異なりました。
[MDN - Math.round()](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Math/round)

すなわち0.5を丸める「向き」が、マイナス方向か、ゼロ方向かの違いです。

- Excelはマイナス方向に丸め処理するため、-5.5 → -6
- JavaScriptはゼロ方向に丸め処理するため、-5.5 → -5

という訳です。

コードを以下のように修正したところ、Excelと同じ計算結果となりました。

```js:JavaScript
function myRound(number, pricision) {
    var _sign = (number < 0) ? -1 : 1;
    var _pow = Math.pow(10, pricision);
    return Math.round((number * _sign) * _pow) / _pow * _sign;
};     
```

負数の切り捨て・切り上げの場合も同じ原理で、JavaScriptとExcel関数では結果が異なります。
[MDN - Math.floor()](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Math/floor)
[MDN - Math.ceil()](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Math/ceil)

なお、Javaの場合も、MathクラスとBigDecimalクラスでは負数の端数処理の向きが逆になります。
[Javaの負の数の切り捨て・四捨五入にはご注意！](http://sho-ishi.hateblo.jp/entry/20090513/1242225724)

ということで、**負数の端数処理については、「向き」に気をつけましょう！**

# 参考にさせていただいた記事

[JavaScript Math.roundをオーバーロードして小数点以下X桁を指定して四捨五入する](http://qiita.com/standard-software/items/728ca4026c65ce278cdf)
ハッシュテーブル(Hash Table)を簡単に理解しよう

ハッシュテーブルは普段色々な名前でよく出て来ると思うが、例えばpython/swiftのdictionary, JSON, PHPの配列、java/c++のhashmapなど
これはコンピューターの中でどうやって実現したのだろうかを説明しようと思う
##ハッシュテーブルの特徴##
###一つ値に対して唯一のキー###
あれ？逆じゃない？と思う人いると思うが、実はハッシュテーブルを作るとき違う値を同じキーに配ってしまう場合もある、それは「衝突」と呼ぶ。
衝突はあとで説明する。
###追加と呼び出しが早い###
ハッシュテーブルも配列系のデータ構造の一種類として、他の二つは配列とリンクリストになる。
・配列は値を呼び出す時アドレスさえあれば一瞬で終わるが、一つの値を追加・削除すると、他の値も詰めてきて、引っ越さないといけない
・リンクリストは追加が早いが（最後尾に入るから）、呼び出す時入ってるデータを一つづつ確認しないといけない
・ハッシュテーブルは、追加する時ハッシュ関数を回してキーからアドレスを得て、他の値に影響しない上で、呼び出す時キーさえあれば、アドレスもキーからわかってきて、すぐ値を尋ねられる。

##原理##
###流れのイメージ###
####key ====ハッシュ関数をかける====> H(key) ====アドレスGET====> (key|value)####
こんな流れです（wikipediaの画像）
![image.png](https://qiita-image-store.s3.amazonaws.com/0/169507/0dcaa908-03fc-181e-5e0e-c352061ed36f.png)

###ハッシュ関数###
それではハッシュ関数はどんなものだろうか
**簡単にいうと：どんなキーがきてもとりあえず重複のない数字に変換するメソッド**
####例:####
input = [23, 7, 11, 4, 10]　　（キー）
これは明らかに5を割ってその余を取れば重複がなさそう
Hash関数 h(key) = n mod 5
Hash後 [3, 2, 1, 4, 0]　　（ H(key) ）

####ハッシュテーブルに使うハッシュ関数はこの三つを要求されている####
・わかりやすさ
・アドレスを平均的に配る
・キーの重複を避ける

####よく使われるハッシュ関数####
1. キーが数字の場合、一次方程式をとる：H(key) = a·key + b
2. キーが数字の場合、それらのキーは規律あるかどうかを探ぐり、重複の少ない一部を取る
3. キーが数字の場合、そして規律もなさそうで、キーを二乗を取って、二乗した結果の真ん中の一部をとる。（二乗した結果の真ん中の部分は数字全体と関係あるので、重複を避けられる）
4. キーを何等分して、それを全部加算する
5. 乱数関数を用いる
6. テーブルの長さを割って、余をとる

色々紹介したと思うが、実際使う時ハッシュ関数は**重複なければなんでもいい**

###ハッシュテーブルの例###

**データ：**

|名前|小嶋陽菜|柏木由紀|前田敦子|
|:---:|:----:|:----:|:----:|
|成績|76|78|66|80|

これを`名前->成績`の形のハッシュテーブルを作ると
`名前の略語のアルファベット順の和`というハッシュ関数を使おう

|名前|小嶋陽菜|柏木由紀|前田敦子|
|:---:|:----:|:----:|:----:|
|名前の略語|KH|KY|MA|
|アルファベット順|11 8|11 25|13 1|
|H(key)| 11+8|11+25|13+1|
|アドレス|19|36|14|
|成績|76|78|66|

こんな感じ
##衝突##
###例:###
しかし、さっきと同じハッシュ関数を用いて、今回まゆゆもテスト参加することになったら、

|名前|小嶋陽菜|柏木由紀|前田敦子|渡辺麻友|
|:---:|:----:|:----:|:----:|:----:|
|成績|76|78|66|80|

ハッシュする時はこうなってしまう

|名前|小嶋陽菜|柏木由紀|前田敦子|渡辺麻友|
|:---:|:----:|:----:|:----:|:----:|
|名前の略語|KH|KY|MA|WM|
|アルファベット順|11 8|11 25|13 1|23 13|
|H(key)| 11+8|11+25|13+1|23+13|
|アドレス|19|<font color="red">36</font>|14|<font color="red">36</font>
|成績|76|78|66|80|
**これは「衝突」と言います**
###衝突解消###
1. バイヤスを追加する H(key) => H(key) + di(開番地法)
    - 線形プローブ di = 1, 2, 3, … , m-1
    - 二次プローブ di=1^2,-1^2,2^2,-2^2, 3^2, … , ±(k)^2
    - 乱数
    
2. ダブルハッシュ（もう一回ハッシュ関数をかける）。重複解消のが目的なので、違う関数を用いるが、同じ関数をもう一回かけるか、どちらでも構わない
3. 連鎖法。重複になったキーをリンクリストの型でアドレスの最後尾に追加する

ここも色々紹介したが、実際使う時**キーの重複を解消できればなんでもいい**

---
いかがでしょうか
TextViewの文字の色、大きさ、フォントを変える方法 

[ここを参考にした](https://off.tokyo/blog/textview%e3%81%a7%e6%96%87%e5%ad%97%e3%81%ae%e8%89%b2%e3%82%84%e3%82%b5%e3%82%a4%e3%82%ba%e3%80%81%e3%83%95%e3%82%a9%e3%83%b3%e3%83%88%e3%82%92%e5%a4%89%e3%81%88%e3%82%8b%e6%96%b9%e6%b3%95/)
ニフクラのAPIを使ってファイアウォールに接続端末のIPの穴を開ける

# 動機

*いらいらしてやった。後悔はしていない。*

というのは冗談ですが、「開発環境をニフティクラウドに置いていて外出先からテザリングで使う」ようなケースがあるかどうかはわからないので置いて置いて。

いつもとは違う環境からニフクラのサーバーにログインしようとして、「FWに穴が空いてなくてログインできない！どうしよう！」というケースは障害の時とか急いでいる時に限ってよくあるものです。
そういう時に限ってコントロールパネルにはアクセス元IPで制限がかかっており、外出先などからは操作できないようにしてあるもので、急いでいるのに会社の同僚に頼んでFWにIP許可制限を入れてもらうなんて時間のロスが発生したりしなかったりするかもしれません。

そんな時でも、ニフティクラウドのAPIは使えるので、ファイアウォールのIN許可設定に今の自分の端末がサーバーにアクセスする時に使うIPを設定しちゃえるわけです。（アクセスキーとシークレットアクセスキーだけ控えておけば）

# 作ったもの

[Gist](https://gist.github.com/conhumi/723336de65fa8d2fa30eef966966a199)

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

import hashlib
import hmac
import base64
import requests
from datetime import datetime

ACCESS_KEY = u'12345678901234567890'
SECRET_KEY = u'1234567890abcdefghijklmnopqrstuvwxyzABCD'

region = 'east-1'
fw_group_name = 'hogehoge'
port = 22

src_ip = requests.get('https://httpbin.org/ip').json()['origin']
endpoint = 'https://' + region + '.cp.cloud.nifty.com/api/'
date = datetime.now().isoformat(timespec='milliseconds') + 'Z'

params = {
        'Action':'AuthorizeSecurityGroupIngress',
        'GroupName':fw_group_name,
        'IpPermissions.1.IpProtocol':'TCP',
        'IpPermissions.1.FromPort':port,
        'IpPermissions.1.ToPort':port,
        'IpPermissions.1.IpRanges.1.CidrIp':src_ip,
        'IpPermissions.1.Description':'SetCurrentIpToFW.py',
        'AccessKeyId':ACCESS_KEY,
        'SignatureVersion':0,
        'Timestamp':date
        }
string_to_sign = params['Action'] + params['Timestamp']

params['Signature'] = base64.b64encode(
        hmac.new(
            SECRET_KEY.encode('utf-8'), 
            string_to_sign.encode('utf-8'), 
            hashlib.sha1
            ).digest()
        )
resp = requests.get(url=endpoint, params=params)

print(resp.content)
```

# 使い方

1. 必要なライブラリを `pip install` します。（私は `requests` だけで十分だったみたいです)
2. `ACCESS_KEY` と `SECRET_KEY` にそれぞれアクセスキーとシークレットキーをニフクラのコンパネから取得して設定します。
3. `region`, `fw_group_name`, `port` を適切に設定します。
4. `src_ip` は実行環境がインターネットにアクセスするGlobalなIPを取って来ていますが、任意のIPを手打ちしてもOKです。
5. 諸々を設定したら実行します。
6. 実行結果の見辛い XML の中に True の文字があったら成功です。
    7. エラーが出たら頑張ってデバッグしてください。

# 参考
http://cloud.nifty.com/api/rest/authenticate.htm
http://cloud.nifty.com/api/rest/AuthorizeSecurityGroupIngress.htm
util.promisify()でcallbackスタイルの関数をpromise化

# util.promisify()でcallbackスタイルの関数をpromise化
node.jsがv8になり、util.promisifyが追加されました。
この機能は、callbackスタイルをpromiseに変換する機能となります。
以下で、試して見たいと思います。

# 注意事項
+ node.jsのcallbackスタイルの関数であること。`(error, value) => ...`(calback関数の最初の引数はerrorである必要があります。)
+ callbackを最後の引数としていること。

# util.promisify()を試す
以下の処理は、カレントディレクトリにあるtext.txtを出力するだけの処理です。
その中で、fs.readFileをutil.promisifyでpromiseに変換した上で、async/awaitを使用して同期処理の様に扱っています。


```js
'use strct';

const fs = require('fs');
const util = require('util');

const readFileAsync = util.promisify(fs.readFile);

const filePath = './test.txt';

async function promisifyTest() {
    try {
        const text = await readFileAsync(filePath, {encoding : 'utf8'});
        console.log(text);
    } catch (error) {
        console.log(error);
    }
}

promisifyTest();
```

# 参考
[Node.js v8.1.1 Documentation](https://nodejs.org/dist/latest-v8.x/docs/api/util.html#util_util_promisify_original)
chromeでCloud9を使う際、キーバインドを設定してもブラウザのショートカットが優先されるときの解決

Cloud9は気軽に環境が作れて便利ですよね。

ただキーバインドをemacsなどに設定しても`Ctrl n`で新しいウインドウが作成されてしまったりと、
ところどころブラウザのショートカットが優先されてしまうことがあります。

そんなときはChromeのアプリとして起動にすれば、ショートカットが無効化されます。

Cloud9のプロジェクト画面で、`その他のツール`→`デスクトップに追加`→`ウインドウとして開くにチェック`です。

画面もすっきりして見やすくなります。
SSL付きのgitlab page の作り方 （自分用メモ）

# gitlab page を使うと、独自ドメイン、SSL付きのpage を簡単に作成可能


**ブラウザだけで、作業ができるように書き換えました。**

gitlab page で簡単に、HTMLページをアップできるので、通常のHTMLのページを gitlab に移動するときに便利です。
ドメインを割り当てることも可能ですし、SSLをつけることも可能です。
ドメイン維持費を除けば全部無料なので便利です。


**gitlab のサンプルは、これです。**
https://pages.gitlab.io/plain-html/

**ざっくりと、やること一覧**

 * gitlab にアカウントをつくる
  * project (仮にhoge ) をつくる
 * https://{ユーザ名}.gitlab.io/{プロジェクト名} 　　ページ公開だけならここまで
 * 独自ドメインを割り当てる（ドメインもっている前提）
  * gitlab でドメインを使えるようにする
  * ドメインでCNAME割り当てる
 * SSL割当
 

## gitlab にアカウントをつくる
* https://gitlab.com/users/sign_in から登録
* ログインして、New Project から、プロジェクト（レポジトリ作成）
 * project 名hoge（仮の名前、お好きなのをつくってください。）
 * Import project from　で、Repo by URL をクリックして下記をいれて、plain_html をコピー
 
``` 
   https://gitlab.com/pages/plain-html.git
```
 * http://{ユーザ名}.gitlab.io/hoge　でページをみることができます。**ssl** なしです。
 
**public 以下がページのデータです。ブラウザだけで、編集、アップロードできます。まずはこれでなんとかなります。**

## http://{ユーザ名}.gitlab.io/hoge　に独自ドメイン名 hoge.ドメイン名を割り当てる
* gitlab で、ドメイン割り当てをします。project -> settings -> pages で New Domain です。まずは、Domain だけ入れて、create new domain 
* ドメインで、CNAME で、hoge.{ドメイン名}に、{ユーザ名}.gitlab.io/ を割り当てます。（ドメインのゾーン情報が編集できることが前提です。）
 * http://hoge.{ドメイン名}　でページをみることができます。
 **ssl なし** です。

## hoge.ドメイン名 でSSL(let's encrypt )を取得
* https://zerossl.com/ で作成です。online tools -> start にすすみます。
    * hoge.ドメイン名を、いれて、Accept は２つとも、チェックで、HTTP verificationチェックのままで、next
    * www まで含むのをつくりますかと聞いてくるので、No にしておき、CSRができるのを待ちます。
    * CSR ができたら、Next にすすみます。
    * private key ができますが、コピーしなくていいようです、Next にすすみます。
    * Verification　用のファイルがあるので、ダウンロードしておき、public/.well-known/acme-challenge をつくってから、アップロードします。
    * ファイルのアップロードがweb上から見れることを確認して、Next にすすみます。
    * cert（２こ連続、注意） と private keyが生成されるのでコピーします。
    * gtlab の settings->pages で、hoge.ドメイン名を選び、削除します。（しなくていいならいいのですが、）再度つくり、そのときに、cert と key をいれます。cert は、２個つながっているので注意です。
Windows 10でmsys2のsshdを起動したら、authorized_keysを読んでくれず、Permission deniedが返る

[Qiitadonの1トゥート](https://qiitadon.com/@igrep/82143)にとどめておけるレベルの小さな内容ですが、ちゃんと環境情報とともにメモしておきます。

# 環境情報

- Windows 10 Pro 64bit ver. 1703
- OpenSSH_7.5p1, OpenSSL 1.0.2k  26 Jan 2017
- msys2-runtime 2.7.0-1

# 起きた問題・対応

上記のトゥートからのコピペです。

http://moguno.hatenablog.jp/entry/2015/09/06/134835 を参考にWindowsでsshdを設定してみたんですが、なぜか公開鍵認証しようとするとPermission deniedされるんで変だなぁと思っていたんですが、
`sshd_config`の

```
AuthorizedKeysFile	.ssh/authorized_keys
```

となっていたところを`/c/Users/.../.ssh/authorized_keys`みたいなフルパスに変えて再起動したらいけました。
どうもホームディレクトリーがちゃんと認識されてないみたいで。。。
in_array();の覚書

twitter風システムの構築を勉強してて色々と悩んだところなのでメモ

```php:in_array.php
$sql = 'SELECT文';
$rows = get_array($link,$sql);//配列取得のユーザ関数

$in = array();//空の配列
$i = 0;
foreach($rows as $value){
    $in[] = $value[$key];
}

foreach($rows as $value){
    if(in_array($rows[$i]['user_id'],$in)){
        //$rowsのuser_idが$inにあればここの処理
    }else{
        //なければこちらの処理
}
```
プログラミング教育必修化「学習クラブ設立」について

# はじめに
　2020年から始まる小学校段階におけるプログラミング必修化。その授業で興味を持った児童がより詳しく学習することが出来る「学習クラブ」の設立を政府が後押ししているという記事が産経ニュースから公開された([記事はこちら](http://www.sankei.com/politics/news/170609/plt1706090003-n1.html))
　今の小学生は数十年先の私の後輩になるかもしれない人たちであるため、この記事に関して感じたことを記そうと思う。


# 学習クラブの設立
　学習クラブの設立自体は私は**賛成**である。主な理由は以下の通り。

* プログラミングに興味を持った児童に学習環境を提供できる
* 多人数と意見交換を行える

一つずつ説明していこうと思う。

### プログラミングに興味を持った児童に学習環境を提供できる
 プログラミングを学ぶ上では学習環境の構築が必須である。環境を整えることは初学者には難しい他、勝手にPCに変なものをダウンロードされたくないと考える親もいることだろう。学校の授業でプログラミングを学習したのに、その場の授業でしかプログラミングに触れられないのというのは児童の学習意欲を削ぐことになると考えられる。
　しかし、学習クラブでは教材をインターネットで提供することを想定しているため、あやしいソフトでないことが分かる他、学習を始めやすくなると考えている

### 多人数との意見交換を行える
　開発を行う上で意見交換というのは非常に大事なことであると考える。自分が、相手がどういう意図を持ってこのようなコードを書いたのかを児童同士で意見交換させることが出来れば大きな成長と理解が生まれると考えている。また、「見やすいコード」を目指す意思を持たせることが期待できる。




以上の賛成意見とは一方、「これはどうなんだろう」と思う面もあったのでこれも記載する。

> 各地域の引退したシステムエンジニアら、プログラミングに詳しい人に指導

　具体的にどのような学習環境で指導をするのかは不明ではあるが、指導するのが引退したSEというのは少々不安を覚える。もちろん**引退したSEの知識や技術を疑っているわけではない**ことは理解して頂きたい。
　IT業界は、流行り廃れが激しいものである。今(2017/06/14現在)引退済みのSEが当時扱っていた開発環境やプログラミング言語と、学習クラブで利用する学習環境とプログラミング言語は大きく違うものであり、指導者側も新しい環境を扱えなければならない。そのため、高齢のSEらに新たな学習環境やプログラミング言語を使いこせるようにさせるのは難しいと考える。優秀なIT人材を確保したいのならば、お金を払って現役のSEに指導させた方が良いと考える。


# おわりに
　今回は、将来後輩になるかもしれない今の小学生のプログラミング教育必修化に関連した「学習クラブ」について意見を記述した。社会人一年目のひよっ子が何を偉そうにと言われるかもしれないが、もし良かったら他の人の意見も伺いたいと思う。
Moodleサイトのデフォルト設定

#local/defaults.phpを使ったサイトデフォルト設定
Moodleには指定のファイルを作成することによりデフォルト設定を変更することができる。

##config.phpに設定を記載することとの違い
config.phpに`$CFG->hoge = 'hage';`と記載することで設定を指定することも可能となっているが、こちらの方法とは以下の点で違いがある。

  - $CFGを記載する方法と違って、WebUIで変更不可能な強制設定ではない
  - あくまでサイトデフォルト設定の上書きであって現在の設定値を変更するものではない

このため、この方法はMoodleの初回インストールでconfig.phpが作成された直後でDBの初期化・各種モジュールのインストールが開始される前に指定のファイルを作成しておく必要がある。
（インストール後に作成しても意味があまりないように思う）

##記載方法
###Yes/Noのようなブール値を取る場合
```php:local/defaults.php
// ログインを強制
$defaults['moodle']['forcelogin'] = true;

// メッセージングを無効
$defaults['moodle']['messaging'] = false;
```

###特定の値を選択 / Textで指定する場合
```php:local/defaults.php
// コースのセクション数
$defaults['moodlecourse']['numsections'] = 16

// ユーザクオータ
$defaults['moodle']['userquota'] = 1048576000;

// 週の始まり
$defaults['moodle']['calendar_startwday'] = 0;  // Sunday

// duのパスを指定
$defaults['moodle']['pathtodu'] = '/usr/bin/du';

// サポート連絡先
$defaults['moodle']['supportname'] = 'Moodleサイト管理者';
```

###複数のチェックボックスから選択 / 複数選択出来るリストの場合
```php:local/defaults.php
// ユーザフィールドを隠す
$defaults['moodle']['hiddenuserfields'] = array('icqnumber', 'skypeid', 'yahooid', 'aimid','msnid');

// ユーザ一覧で表示する情報
$defaults['moodle']['showuseridentity'] = array('idnumber'=>1, 'email'=>1, 'department'=>1);
```

##備考
MoodleのCoreの場合は$defaults配列の一次元目を`moodle`に、モジュール等の場合は`enrol_self`、`workshop`、`assignsubmission_file`などのように記載するが命名規則が怪しい。
Rubyのメソッド定義場所を調べる

参考
[【Ruby】どこでメソッド定義されているかを調べる - ふわふわRuby on Rails](http://d.hatena.ne.jp/zucay/20130225/1361798829)


```rb
インスタンス変数.method(:メソッド名).source_location
```
[バッチファイル] ファイル名に含まれる日付を更新する

”ほげほげ計画書_20170605.docx”のようにファイル名に含まれる日付だけを更新したいときに役立つバッチファイルの紹介です。

## バッチファイル本体

```bat:date_update.bat
@echo off
rem *****************************************************************
rem ファイル名に含まれる日付を今日の日付に更新するバッチファイル
rem 前提条件
rem - ファイル名の後ろ8文字(YYYYMMDD)を今日の日付に更新する
rem *****************************************************************

:LOOP_START
if "%1" == "" goto LOOP_END
set filename=%~n1

rem %date 日付(YYYY/MM/DD)の'/'(スラッシュ)を取り除く
set today=%date:/=%

rem 後ろ8文字を今日の日付に更新
copy %1 %filename:~0,-8%%today%%~x1

shift
goto :LOOP_START

:LOOP_END
exit
```

## 使い方
・date_update.bat (アイコン) に対象のファイルをドラッグすると、今日の日付に更新されたファイルが作成されます。
・元のファイルが要らない場合、copy を rename に変えればOK
・複数ファイルを選択してドラッグしてもOK
Common LispからPythonを呼び出す備忘録

[burgled-batteries](https://github.com/pinterface/burgled-batteries)なるCommon LispにPythonを埋め込むことのできるライブラリを見つけたので試してみました．その備忘録です．

# 環境
```shell-session:
$ ros --version
roswell 17.5.8.78
$ ros run -- --version
SBCL 1.3.18
$ python --version
Python 2.7.13
```
`burgled-batteries`のインストールはroswellから簡単にできます．

```shell-session
$ ros install burgled-batteries
```

# Common LispからPythonの呼び出し
以下のモジュールから関数を呼び出してみます．

```python:hello.py
#!/usr/bin/env python
# -*- coding: utf-8 -*-

def hello(name):
    print "Hi, {}! This is Python.".format(name)
```
以下，SBCLのREPLです．

```cl:CLからPythonの関数を実行
* (ql:quickload :burgled-batteries)
To load "burgled-batteries":
  Load 1 ASDF system:
    burgled-batteries
; Loading "burgled-batteries"
...
(:BURGLED-BATTERIES)
* (in-package :burgled-batteries)

* (startup-python) ;; Pythonインタプリタを起動
* (import "sys") ;; sysモジュールをインポート

0
* (run "sys.path.append('./')") ;; インポート時になぜかカレントディレクトリを検索しないので追加
                                ;; runは埋め込み文字列を現在のインタプリタで実行する

* (import "hello") ;; helloモジュールをインポート

* (run "hello.hello('Kojiro')") ;; hello.helloを呼び出し
Hi, Kojiro! This is Python.
```

埋め込むだけでなく関数として定義して呼び出すこともできます．

```cl:CLでPythonの関数を定義して呼び出し
* (defpyfun "hello.hello" (name)) ;; hello.pyのhelloをhello.helloとして定義

HELLO.HELLO
* (hello.hello "Kojiro") ;; 普通に呼び出せる
Hi, Kojiro! This is Python.
```
RailsコードリーディングTips

# RailsコードリーディングTips

## Railsの開発環境構築
vagrant + virtualboxで環境を構築することができます。
詳細は以下を参照してください。

- [rails-dev-box](https://github.com/rails/rails-dev-box)
- [Rails Guides](http://guides.rubyonrails.org/contributing_to_ruby_on_rails.html)

## 単体テスト
単体テストの実行を通して、実際のメソッドの挙動を簡単に確かめることができます。
Railsではユニットテストフレームワークとして[Minitest](https://github.com/seattlerb/minitest)を利用します。

### 単体テスト実行
単体テストの実行は

- activesupport
- activerecord
- ...

の単位でします。それぞれの`bin`配下にあるrubyスクリプトの`test`を実行することで単体テストが実行されます。
例えばactivesupportの場合は`activesupport/bin/test`、activerecordの場合は`activerecord/bin/test`です。

例えばactivesupportの単体テストは以下のコマンドで実行することができます。

```
cd activesupport
ruby bin/test
```

引数を渡すことで特定ファイルのみを実行することもできます。

```
cd activesupport
ruby bin/test test/autoload_test.rb
```

オプション`-v`を渡すことでテストの状況を表示することもできます。

```
cd activesupport
ruby bin/test test/autoload_test.rb
```
※ 他のオプションについては[こちら](https://github.com/seattlerb/minitest/blob/master/lib/minitest.rb#L173)で確認することができます。
Gitリモートmasterで進んだ差分を途中から切り分けた開発ブランチに取り込む

#概要
自分的gitメモ。
masterから切り分けたブランチで開発を進めていたらいつのまにかmasterが進んでいてローカルで開発を進めていたものにmasterで進んだ差分を取り込む必要が出てきた。

#状況
masterコミット３の状態から開発ブランチを切って、開発を進めてたけど。
リモートリポジトリでいつのまにかmasterがmasterコミット5まで進んでいた。。。開発ブランチで進めていたことに影響するコミットです。さあ、困ったぞ。

```
現状のコミット状況。

---------------------------
#リモートmasterブランチとの差分

○○○　masterコミット5
○○○　masterコミット４
---------------------------
#ローカルdevブランチでの開発

○○○　devコミット5
○○○　devコミット４
○○○　devコミット３
○○○　devコミット２
○○○　devコミット１
○○○　masterコミット３
○○○　masterコミット２
○○○　masterコミット１
```

```
このかたちに持っていきたい

○○○　masterコミット5
○○○　masterコミット４
○○○　devコミット5
○○○　devコミット４
○○○　devコミット３
○○○　devコミット２
○○○　devコミット１
○○○　masterコミット３
○○○　masterコミット２
○○○　masterコミット１
```

#手順

gitのlogを確認してみる。

```
$ git log --oneline

○○○　devコミット5
○○○　devコミット４
○○○　devコミット３
○○○　devコミット２
○○○　devコミット１
○○○　masterコミット３
○○○　masterコミット２
○○○　masterコミット１
```

まずは、開発しているブランチ(=dev)から、masterブランチに切り替えてmasterプルしてくる。

```
$ git checkout master
$ git pull origin master
```

```
$ git log --oneline

○○○　masterコミット5
○○○　masterコミット４
○○○　masterコミット３
○○○　masterコミット２
○○○　masterコミット１
```

devブランチにmasterブランチをmergeする。

```
$ git checkout dev
$ git merge master
```

一応、gitのログを確認する。

```
$ git log --oneline

○○○　masterコミット5
○○○　masterコミット４
○○○　devコミット5
○○○　devコミット４
○○○　devコミット３
○○○　devコミット２
○○○　devコミット１
○○○　masterコミット３
○○○　masterコミット２
○○○　masterコミット１
```

リモートmasterにpushして差分の変更が終了。

```
$ git push origin dev
```
Raspberry pi debian package

Raspberry pi 3向けのアプリ配布にapt-getを利用しようとパッケージ化にチャレンジした。必要なファイルを用意して、sudo debuild -us -ucを実行したところ、lintianがエラーを出力する。
例えば、

Now running lintian...
:
E: conductorlite: helper-templates-in-copyright
E: conductorlite: extended-description-is-empty
:

上記の"conductorlite"は作ろうしているパッケージの名称。

簡単なpythonプログラムを配布しようとしているだけなのにチェックが厳しく難しい。ここでは、3点ほどわかった点を掲載しておきます。

(1) helper-templates-in-copyright

　copyrightファイルにテンプレートの要素が残っているとのエラーメッセージらしい。が、どこが間違っているのかわかりにくい。私のケースは、

Upstream Author(s):

　　name \<mail address>

　の"(s)"が残っていたところがエラーでした。作者は1名だけなのでこれを削除して、

Upstream Author:

　　name \<mail address>

　としたところ、エラーは消えました。
　言うまでもなく、上記のnameと\<mail address>はここでのサンプルです。また、インデントにはタブを使う必要があり、このあたりも厳しくチェックされます。


(2) extended-description-is-empty
　
　こちらは比較的簡単。controlファイルのDescription:に詳細説明が必要というエラーです。詳細説明はタブでインデントをつけて記載する必要があります。下記の例では2行目が"extended-description"に相当します。

Description: The home automation system for raspberry pi
　　Remote control and programable timer software.

(3) パッケージ名

　パッケージ名はcontrolファイルのPackageの部分に名称を記載します。下記は例。

Package: conductorlite

　一方で、パッケージを行うために、ディレクトリにはパッケージ名+"-バージョン番号"という名称をつけます。バージョン番号とパッケージ名の区切りには"-"（ハイフン）を使うのでパッケージ名には"-"を使うべきではないようです。

例：
conductorlite-0.1.3
AWS SDK for PHP v3でEndpointArnを取得するまでの道のり

AWS SNSを使ってMobile Pushするときに必要な技です。

* `createPlatformEndpoint`は登録済みの`Token`を渡すと発行済みの`endpointArn`を返します。
* しかし、`endpointArn`に対して`CustomUserData`がセットされてる場合、`Token`と`CustomUserData`が完全一致しない限り`createPlatformEndpoint`が失敗(`Aws\Sns\Exception\SnsException`)します。
* `endpointArn`に紐づく`CustomUserData`を知るには`getEndpointAttributes`を使いますが`endpointArn`が必要です。
* `Token`から`endpointArn`を知る方法は`createPlatformEndpoint`しかありません。

**そう、缶切りは缶詰の中にはいっているのです(´・ω・`)**

[公式ドキュメント](http://docs.aws.amazon.com/ja_jp/sns/latest/dg/mobile-platform-endpoint.html)によるとExceptionをキャプチャして解析する必要があるみたいなのでEndPointArnを取得するメモを残します。

```php:
try {
    $platform = $client->createPlatformEndpoint([
        'PlatformApplicationArn'    => '*****',
        'Token'                     => '*****',
    ]);
    $endpointArn = $platform['EndpointArn'];
}catch(Aws\Sns\Exception\SnsException $e){
    $message = $e->getMessage();
    if( !preg_match('#^.+(<ErrorResponse\s.+?</ErrorResponse>)#s',$message,$match) ) throw $e;
    $xml = new SimpleXMLElement($match[1]);
    $message = $xml->Error->Message;
    if( !preg_match('/Endpoint (arn:aws:sns[^ ]+)/',$message,$match) ) throw new Exception($message);
    $endpointArn = $match[1];
}
```
.git 等隠れファイルやディレクトリへの Web サーバー側からのアクセスを禁止 (Apache & Nginx)


Git submodule を使った開発と、自動デプロイをしたいという要件がでてきた。

Submodule を使う場合、 `git fetch && GIT_WORK_TREE=[WEB領域] git checkout -f` なんて git ディレクトリを外に出すような芸当はできないので、 .git ディレクトリを Web 領域に入れないといけない場合があります。

そんな時、 Apache & Nginx で、.git ディレクトリや、 git 関連のファイルを Web 上からはアクセス出来ないようにしてもらうための設定 config です。

# Apache の設定

## RedirectMatch で行う方法

.git ディレクトリやファイルを禁止


```
RedirectMatch 404 /\.git
```

ディレクトリ内全てを 404 表示

```
RedirectMatch 404 /
```

おまけ：「.」で始まる隠れファイル全部を隠す。

```
RedirectMatch 404 /\..*$
```


## mod_access で行う方法

httpd.conf の 480行目辺りにある `<Files ~ "^\.ht">` な設定の後ぐらいに書いておいても良いかもです。


```
# .git から始まるファイルへのアクセスを禁止
<Files ~ "^\.git">
    Order allow,deny
    Deny from all
</Files>

# .git/ フォルダ以下のファイル・ディレクトリへのアクセスを禁止
<Directorymatch "^/.*/\.git/">
    Order deny,allow
    Deny from all
</Directorymatch>
```

# Nginx の設定

.git ディレクトリやファイルのアクセス禁止。

```
server {
# 省略
	
	location ~ /\.git {
	    return 404;
	}
}
```

隠しファイル全体 (.htaccess, .git .svn など) アクセス禁止

```
server {
# 省略
	
	location ~ /\. {
	    return 404;
	}
}
```
Amazon LinuxにIPAフォントをインストールして、Ghostscriptのcidfmapに登録する

# IPAフォントとは
https://ja.wikipedia.org/wiki/IPA%E3%83%95%E3%82%A9%E3%83%B3%E3%83%88

# インストール
```shell-session
$ yum install -y ipa-gothic-fonts
$ yum install -y ipa-mincho-fonts
```

# フォントを設定する
```shell-session
$ vi /etc/ghostscript/<バージョン>/cidfmap.local
```
```shell-session:cidfmap.local
/IPAMincho     << /FileType /TrueType /Path (/usr/share/fonts/ipa-mincho/ipam.ttf) /CSI [(Japan1) 6] >> ;
/IPAGothic     << /FileType /TrueType /Path (/usr/share/fonts/ipa-gothic/ipag.ttf) /CSI [(Japan1) 6] >> ;

/Ryumin-Light /IPAMincho ;
/Ryumin-Medium /IPAMincho ;
/GothicBBB-Medium /IPAGothic ;
/HeiseiKakuGo-W5 /IPAGothic ;
/HeiseiMin-W3 /IPAMincho ;
/MSGothic /IPAGothic ;
/MSMincho /IPAMincho ;

```
Amazon LinuxにImageMagick6の最新版を入れる

# remiレポジトリを追加
```shell-session
$ rpm -Uvh http://rpms.famillecollet.com/enterprise/remi-release-6.rpm
```
# CentOS-Baseリポジトリを追加
```shell-session
$ vi /etc/yum.repos.d/CentOS-Base.repo
```
```shell-session:CentOS-Base.repo
[base]
name=CentOS-6 - Base
mirrorlist=http://mirrorlist.centos.org/?release=6&arch=x86_64&repo=os
gpgcheck=1
enabled=0
gpgkey=http://mirror.centos.org/centos/RPM-GPG-KEY-CentOS-6
```

# 古いパッケージを削除
```shell-session
$ yum remove -y libtiff
$ yum remove -y graphviz
$ yum remove -y libwebp libwebp-devel
$ yum remove -y ImageMagick ImageMagick-devel ImageMagick-libs
```

# 新しいパッケージをインストール
```shell-session
$ yum install -y libtiff --enablerepo=remi,epel,base --disablerepo=amzn-main
$ yum install -y graphviz --enablerepo=remi,epel,base --disablerepo=amzn-main
$ yum install -y libwebp libwebp-devel --enablerepo=epel --disablerepo=amzn-main
$ yum install -y ImageMagick6 ImageMagick6-devel ImageMagick6-libs --enablerepo=remi,epel,base
```
Reactコンポーネントのスタイルを切り替えるにはどうしたらいいですか？

これは「コードを書いていて困ったときに、suinがチャットで質問に答えたり相談に乗る[suinのプログラミング相談室(仮)](https://help.suin.io/)」で頂いた質問と僕の回答の要約です。

## 質問

Reactで同じコンポーネントに違うスタイルを当てるにはどのようにしたらいいですか？ ABテストを考えていて、ある条件ではスタイルAを、別の条件ではスタイルBを当てられるようにしたいです。

## suinの回答

CSSで解決する方法と、Reactで解決する方法の2つが考えられます。

### CSSで解決する方法

例えば、ReactのAppモジュールでは`app`クラスを決め打ちにしておいて、ReactがレンダリングされるDOMを`class="red"`や`class="blue"`で囲めば、`.red .app`、`.blue .app`でそれぞれ別のスタイルが適用できます。React外の技術でアプローチするパターンですね。

```html
<div class="red">
    <div id="root"></div>
</div>

<div class="blue">
    <div id="root"></div>
</div>
```

```js
class App extends React.Component {
    render () {
        return <div className="app">App!</div>
    }
}

ReactDOM.render(<App />, document.getElementById('root'))
```

```css
.red .app {
    color: red;
}

.blue .app {
    color: blue;
}
```

## Reactで解決する方法

Reactでやる場合は、コンポーネントの設定値をコンポーネント使う側から渡せるようにします。

```js
class App extends React.Component {
    // 属性情報のバリデーション
    static propTypes = {
        taste: React.PropTypes.string.isRequired
    }
    
    // 親からXML属性で受け取れるようにする
    constructor (props) {
        super(props)
        this.state = {...なにかあれば...}
    }

    render () {
        console.log(this.props) // ここで taste 属性があるはず
        
        // ここでスタイルを切り替える
        const className = this.props.taste === 'red' ? 'red-app' : 'blue-app'
        
        // たしかこれでいいはず
        return <div className={className}>App!</div>
    }
}

// コンポーネントを使う側
ReactDOM.render(<App taste="red" />, document.getElementById('red-app'))
ReactDOM.render(<App taste="blue" />, document.getElementById('blue-app'))
```

```html
<div id="red-app"></div>
<div id="blue-app"></div>
```


```css
.red-app {
    color: red;
}

.blue-app {
    color: blue;
}
```

### PHP(サーバサイド)側で動的にスタイルを指定する場合

ちなみに、サーバサイドでスタイルを動的に指定する場合はこうです。まず、PHP側では動的に`data-taste`を書き出すようにします。

```php
<?php
$taste = $someCondition ? 'red' : 'blue';
echo '<div id="app" data-taste="' . $taste . '"></div>';
```

サーバサイドのロジックによって

```html 
<div id="app" data-taste="red"></div> 
```

などが描画されます。


JSではそれを受け取れるようにします。


```main.js
const element = document.getElementById('#app')

console.log(element.dataset)
console.log(element.dataset.taste) // あるはず

const dataset = JSON.parse(JSON.stringify(element.dataset)); // Object.assignがSafariではうまくいかないため
ReactDom.render(<App {...dataset} />, element);

```

ちなみにこのテクは、僕が作った[Qiita Widget](https://qiita-widget.suin.io/)で使っています。このへんのコードです→https://github.com/suin/qiita-widget/blob/master/src/main.js#L10

## 回答に対しての反応

おお、今か書いて下さったdatasetで切り替えるのが良さそうです！ Safariでダメなのも知らなかったです。
SSHの接続情報を設定ファイルに記載して簡単にSSH接続 mac版

# SSHコマンドが簡略化できる
SSHコマンドで毎回サーバーに接続するのが面倒な時はSSHの設定ファイルに接続情報を設定しておくと便利です。

```
#通常のSSHの接続
ssh ec2-user@xxx.xx.xx.xx -p 50022 -i 鍵のパス
```

```
#設定ファイルを書いた場合 たったこれだけで接続できます
ssh ec2-xxsite
```
## 設定ファイルがあるか確認する
```
cd ~/.ssh
ls　ーl
```
configというファイルがあるか確認。

## 設定ファイルがなければ作る
```
chmod 700 .ssh
touch ~/.ssh/config
```
※sudoが必要ならつける

## 設定ファイルの編集
```
cd ~/.ssh
open .
```
finderが開くので、configを右クリックでtextediterなどで編集

## 設定ファイルの内容

```
# Aサーバーの場合
Host server_a
　　　　　HostName xxx.xx.xx.xx
　　　　　User usernameA
　　　　　IdentityFile ~/.ssh/鍵ファイルのパス
　　　　　Port 20022
　　　　　TCPKeepAlive yes
　　　　　IdentitiesOnly yes

# Bサーバーの場合
Host server_b
　　　　　HostName xxx.xx.xx.xx
　　　　　User usernameB
　　　　　IdentityFile ~/.ssh/鍵ファイルのパス
　　　　　Port 20022
　　　　　TCPKeepAlive yes
　　　　　IdentitiesOnly yes
```


```
#たったこれだけでserverAに接続できます
ssh server_a
```
gitbook-extを使ってGitBookのminify

**追記[2017-06-15]: プラグイン。**
[GitBookのHTMLをminifyするplugin - Qiita](http://qiita.com/hiroki_uchida/items/dc36694effe6d6869e96)

---

GitBookは標準でminifyに対応していないのとpluginも今のところないみたいなので、今回はGitBookのminify用に作られたコマンドラインツール`gitbook-ext`を使ったやり方です。
HTML、CSS、JSがminifyされます。

## gitbook-extのインストール

npmを使ってグローバルにインストール

```bash
$ npm install gitbook-ext -g
```

## 手順

1. 通常通りビルド
2. gitbook-extを使ってminify


```bash
# 1. 通常通りビルド
$ gitbook build

# 2. gitbook-extを使ってminify
$ gitbook-ext minify _book
```

# 参考

- [gitbook-ext](https://www.npmjs.com/package/gitbook-ext)
【Python Kivy】デザインテーマの変更について

#ことの発端
チェックボックス（CheckBox）を作成していたところ、背景をどんなに変更しても、見づらい、、、![プレゼンテーション1.png](https://qiita-image-store.s3.amazonaws.com/0/178673/21d89d92-e810-3642-b0f0-a2f7299268d8.png)

丸が、、、見えない、、、

#どうすればいいの？
調べたところ、このサイトに書いてありました（http://code.tiblab.net/python/kivy/design_theme）。

>方法は次の3つをどれか、または、いくらかを駆使することで出来る。
>
>・デザイン用イメージを置き換える
>デザイン画像は＜KIVY_DATA_DIR＞/images/defaulttheme-0.pngにある。
>例：C:\Program Files\Python27\Lib\site-packages\kivy\data\image\defaulttheme-0.png

>・基本kvファイルを変更する
> ＜KIVY_DATA_DIR＞/style.kv"を変更する
>例：C:\Program Files\Python27\Lib\site-packages\kivy\data\style.kv

>・リソース参照パスを追加する
>kivy.resources.resource_add_path()で自分のリソースファイルを追加する

ふむふむ。

#とりあえずの結論。
~~defaulttheme-0.pngをイラレかフォトショで編集すればよくね？ってなりましたとさ。~~

~~なにか良い案があったら教えてくれるとありがたいです、、、~~
（2017/6/15 更新）
dario_okazaki様、ご指摘ありがとうございます。

checkboxのパラメータ「background_radio_normal」、「background_radio_down」をいじることで解決できました。![プレゼンテーション1.png](https://qiita-image-store.s3.amazonaws.com/0/178673/150b2b24-ca83-9aa6-54a5-5c121cc4afa1.png)

ご助言ありがとうございます！！！
ServiceNow アプリケーションを作成する その３

[前回](http://qiita.com/Kisaragi13/items/cd2eb97100c103a675ef)はアプリケーションにテーブルを追加した。今回も引き続きテーブルを追加するが、前回と違い**拡張テーブル**を作成する。
インスタンスのビルドタイプはIstanbul。

# 拡張テーブルとは
拡張テーブルとは、ServiceNowに既にある別のテーブルをコピーして（引き継いで）、それを拡張したものを指します。引き継げる内容はカラムだけでなく、フローやメール通知設定、スクリプトなども含まれます。公式が言うには、デフォルトで入っているタスクテーブルはその汎用性から様々なテーブルに拡張されているとのこと。要件によって使い分けるようにしましょう。
![image.png](https://developer.servicenow.com/app_store_learn_dev_platform_intro_istanbul_app-store_dev_portal_learning_images_ExtendTableDecision.png)

# 拡張テーブルを追加する
今回は**機器利用申請**テーブルを追加する。

ServiceNow Studioを開く
![image.png](https://qiita-image-store.s3.amazonaws.com/0/175688/8a266416-ca83-efd0-37d0-cd14e7ff57c7.png)

ショートカットキー『 **Ctrl + Shift + C** 』
「**Data Model**」タブから「**テーブル**」を選択し「**作成**」ボタンをクリックする。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/175688/58369225-07cd-93e5-7e01-2708675f53b7.png)

ラベル、名前に加えて拡張テーブル欄に「**タスク**」と入力し、「**送信**」ボタンをクリックする。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/175688/9b9a68ea-5b12-ba39-1c24-bad6ebc34d65.png)

タスクテーブルから様々なカラムがコピーされたことを確認することが出来る。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/175688/370e3425-06bc-2f0a-c774-b9179172c067.png)

# その他
説明は割愛しますが、以下のカラムを本テーブルに追加しています。もし本記事を元にサンプルアプリケーションを作成している方がいらっしゃいましたら追加しておいて下さい。

| 列ラベル | 列名 | タイプ | 最大長 | 参照 |
|:-----------------|:------------------|:------------------|------------------:|:------------------|
| 種類 | type | 文字列 | 40 | |
| コスト | cost | 通貨 | 40 | |
| 貸出希望日 | needed_from | 日付 | 40 |  |
| 返却予定日 | needed_until | 日付 | 40 |  |
| マーケティングイベント | marketing_event | 参照 | 32 | マーケティングイベント |


# Next
次回は今まで作成した各テーブルのユーザインタフェースを整理します。
> - [ServiceNow アプリケーションを作成する その４](http://qiita.com/Kisaragi13/items/72490c9e790bde68cbff)

# 関連記事
> - [ServiceNow アプリケーションを作成する その１](http://qiita.com/Kisaragi13/items/c5f3a0f42b703affea01)
> - [ServiceNow アプリケーションを作成する その２](http://qiita.com/Kisaragi13/items/cd2eb97100c103a675ef)

# 参考サイト
> 『ServiceNow Wiki (Product Documentation) - System Dictionary 』 ※ カラムの辞書エントリに関する説明
> http://wiki.servicenow.com/index.php?title=System_Dictionary#Modifying_Dictionary_Entries
> 『ServiceNow Developers ― Training』
https://developer.servicenow.com/app.do#!/training/landing
Flask で JSON ファイルを読む

次のプログラムの入力ソースを、MariaDB から JSON に変更。

[flask で MariaDB を使う](http://qiita.com/ekzemplaro/items/a5e38772e0fa94323da6)

## フォルダー構成

```text
$ tree
.
├── data
│   └── cities.json
├── json_read.py
└── templates
    ├── hello.html
    └── layout.html
```

```py3:json_read.py
# --------------------------------------------------------------------
#	json_read.py
#
#						May/10/2019
#
# --------------------------------------------------------------------
from flask import Flask, render_template
import sys
import json

app = Flask(__name__)

@app.route('/')
def hello():
	name = "皆さんこんにちは"
	return name


@app.route('/json_pp')
def json_pp():
	file_json = "data/cities.json"
	fp_in = open (file_json,encoding='utf-8')
	json_str = fp_in.read()
	fp_in.close()
	dict_aa = json.loads(json_str)
#
	rows = []
	for key in sorted (dict_aa.keys()):
		unit = dict_aa[key]
		unit['id'] = key
		rows.append(unit)
#
	return render_template('hello.html', title='json', cities=rows)

#
if __name__ == "__main__":
	app.run(host='0.0.0.0',debug=True)
# --------------------------------------------------------------------
```

```json:data/cities.json
{
  "t0921": {
    "name": "宇都宮",
    "population": 41295,
    "date_mod": "2003-8-12"
  },
  "t0922": {
    "name": "小山",
    "population": 38756,
    "date_mod": "2003-5-15"
  },
  "t0923": {
    "name": "佐野",
    "population": 71294,
    "date_mod": "2003-6-8"
  },
  "t0924": {
    "name": "足利",
    "population": 27138,
    "date_mod": "2003-7-21"
  },
  "t0925": {
    "name": "日光",
    "population": 74682,
    "date_mod": "2003-4-19"
  },
  "t0926": {
    "name": "下野",
    "population": 82951,
    "date_mod": "2003-10-14"
  }
}
```

## サーバー起動

```bash
python json_read.py
```

## クライアント

[http://localhost:5000/json_pp](http://localhost:5000/json_pp)

にアクセスする。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/e2ef38dd-3ccd-6cbd-a6b3-d6df41f7c02f.png)


## 確認したバージョン

```text
$ flask --version
Python 3.12.3
Flask 3.0.2
Werkzeug 3.0.1
```
Visual Studio / WPF > link > Application.Current | App.Current > 同じ

```txt:動作環境
Windows 7 Pro (32bit)
Microsoft Visual Studio 2017 Community
```

[Windows GUIプログラミング入門5 画面レイアウト(2)、画面遷移(1)](http://qiita.com/Kosen-amai/items/f2451acb2addd221193f)
を元に学習中。

```
// メイン画面を表示する
App.Current.MainWindow.Show();
```

`App.Current`という指定のコードがある一方で、`Application.Current`指定のコードもgoogle検索などで見つかる。

何が違うのか。

https://stackoverflow.com/questions/20877490/what-is-the-difference-between-an-app-and-application-in-c-net

どちらも同じようだ。

MSDNで参照する場合はApplication.Currentの方を見ることでよさそう。
https://msdn.microsoft.com/ja-jp/library/system.windows.application.current(v=vs.110).aspx
proxy下のwindowsにanacondaでtensorflowとopencv3を入れる

後輩のwindowsにtensorflowを導入した際のメモ。

私のproxy環境下だと .condarc に ssl_verfyを無効にする行を書かないとうまくいかなかったのでメモを共有。

2017/6/14時点で tensorflowがpython3.6に対応してなかったので、python3.5の仮想環境を作って、そこに入れた。

## 0. anacondaをダウンロード・インストールをする

python3.6版を入れた

## 1. 以下の環境変数を設定する

* HTTP_PROXY = http://proxy-server:8080
* HTTPS_PROXY = https://proxy-server:8080

## 2. `.condarc`ファイルを設定する

```bash
$ echo > .condarc
$ start .condarc
```

```bash:.condarc
proxy_servers:
  http: http://proxy-server:8080
  https: https://proxy-server:8080
ssl_verify: false
```

ssl_verfyを設定しないとうまくいかなかった！！！

## 3. python3.5環境を作る（tensorflowを入れるため）

```bash
$ conda create --name tf35 python=3.5
$ activate tf35
$ conda install numpy scipy matplotlib scikit-learn
```

ブラウザからtensorflow1.1.0を落としてきた
https://storage.googleapis.com/tensorflow/windows/cpu/tensorflow-1.1.0-cp35-cp35m-win_amd64.whl

ダウンロードしたフォルダに移動して pipでインストール

```bash
$ cd Download
$ pip install tensorflow-1.1.0-cp35-cp35m-win_amd64.whl
```

これで完了。

以降、tensorflow環境にするには、以下のコマンドでできます。

```bash
$ activate tf35
```

>追記：opencv3のインストール
>
```
conda install --channel https://conda.anaconda.org/menpo opencv3
```
Visual Studio / WPF > 22 多窗口作业练习说明 > .DialogResult | error:Window_Closed()におけるDialogResultの代入

```動作環境
Visual Studio 2017 Community (以下VS)
Windows 7 Pro (32bit)
```

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

### 10:28頃

win.ShowDialog();の戻り値ではなく、
win.Result;を後から取得している。

実際には.Resultではなく、.DialogResultというプロパティを取得するようだ。

```MainWindow.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace _170526_t1910_winResult
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            InputWindow inpWin = new InputWindow();
            inpWin.ShowDialog();
            Nullable<bool> res = inpWin.DialogResult;
            if (res == null)
            {
                MessageBox.Show("null");
            } else if (res == true)
            {
                MessageBox.Show("true");
            } else
            {
                MessageBox.Show("false");
            }
        }
    }
}
```

```InputWindow.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace _170526_t1910_winResult
{
    /// <summary>
    /// InputWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class InputWindow : Window
    {
        public InputWindow()
        {
            InitializeComponent();
        }

        private void Window_Closed(object sender, EventArgs e)
        {
            // DialogResult = true;
        }

        private void OkButton_Click(object sender, RoutedEventArgs e)
        {
            DialogResult = true;
        }
    }
}
```

### 補足

Window_Closed()においてDialogResultに値を代入しようとするとエラーが出た。

> System.InvalidOperationException: 'Window を作成し、ダイアログとして表示した後でのみ DialogResult を設定できます。'
Visual Studio / WPF > Form > Windowの最大化、最小化をできなくする > ResizeMode="NoResize" | ToolWindow

```txt:動作環境
Windows 7 Pro (32bit)
Microsoft Visual Studio 2017 Community
```

### 「最大化、最小化」付き

![2017-06-14_17h29_13.png](https://qiita-image-store.s3.amazonaws.com/0/32870/daad8029-582f-27cc-96fa-364e714ee421.png)


### 方法1 > ResizeMode="NoResize"

参考: https://stackoverflow.com/questions/339620/how-do-i-remove-minimize-and-maximize-from-a-resizable-window-in-wpf

ResizeMode="NoResize"
をWindowに入れる。

```MainWindow.xaml
<Window x:Class="_170614_t1700_listBoxDesign.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:_170614_t1700_listBoxDesign"
        mc:Ignorable="d"
        ResizeMode="NoResize"
        Title="MainWindow" Height="350" Width="525"/>
```

![2017-06-14_17h31_23.png](https://qiita-image-store.s3.amazonaws.com/0/32870/339e4193-bb9e-7313-5340-94064278c661.png)

### 方法2 > ToolWindow

[Windows GUIプログラミング入門5 画面レイアウト(2)、画面遷移(1)](http://qiita.com/Kosen-amai/items/f2451acb2addd221193f)
> WindowのWindowStyleプロパティは最小化ボタン・最大化ボタンが無いToolWindowに設定します。

![2017-06-14_17h33_01.png](https://qiita-image-store.s3.amazonaws.com/0/32870/d37a8ca3-e46b-137b-398d-415b096fd2d0.png)

- 角丸でない
- xボタンが小さい
Intel Euclid Development Kit 触ってみた

#他のPCやスマホのブラウザからWi-Fi経由で動作の確認

まずはマニュアルに沿って、ブラウザからのアクセスを行います。
Euclidを起動後、PCのWi-FIのホットスポットの設定画面を開き「EUCLID_XXXX」という名前を探して選択します。
初期パスワードは「12345678」。
接続後、ブラウザを開き「10.42.0.1」にアクセス。
これでEuclidの画面にログインできました。Scenarios（以下シナリオ）画面が開きます。

![Scenarios.png](https://qiita-image-store.s3.amazonaws.com/0/49845/5bf80291-c112-b12d-8fe7-87a596c9ad3f.png)
#センサーの実行
シナリオ画面にはデフォルトで９つのプリセットが用意されています。

- 6DOF
- 6DoF-Person
- ArduinoCA
- ArduinoPersonFollower
- Camera
- PersonView
- PersonView
- TurtlebotCA
- TurtlebotDepthFollower
- TurtlebotPersonFollower

それぞれの機能は追って説明するとして、
とりあえず、Cameraを実行して確認します。
Cameraの再生ボタンを押すと、確認メッセージがでますので、**OK**を押します。
無事に実行すると、Cameraのシナリオが緑になります。
![Scenariosplay.png](https://qiita-image-store.s3.amazonaws.com/0/49845/2f90072d-4edb-84a3-8088-335677926f72.png)
#センサー画像の確認
シナリオ実行後、上のメニューの**Monitor**を押します。
画面に映ると特になにも表示されていませんが、ここで、どんな画像を取得しているかを確認できます。（シナリオ実行後にしか確認できません）
Monitor画面では、デフォルトで７つのプリセットが用意されています。

- color　RGB画像
- depth　深度画像
- fisheye　魚眼画像
- person　人の認識画像
- imu　本体の傾きや加速度？
- trajectory　本体の３次元的な位置？
- teleop　ロボットの操作に使うのかな？

![Monitor.png](https://qiita-image-store.s3.amazonaws.com/0/49845/2ba739f4-730f-7f16-8375-9a7981868211.png)

ひとまず値は取れてるのが確認できました。

#実行の終了とEuclidの終了
シナリオ画面に戻り、先ほどのCameraが緑色になっているので、停止ボタンを押します。これで実行は終了。
Euclidの終了はPowerを選択し、プルダウンメニューからShutdownを選択します。
Bash on WindowsへのSPTK(Speech Signal Processing Toolkit)導入方法

#概要
SPTK（Signal Processing Toolkit）という音声信号処理のツールのBash on Windowsへの導入方法を説明する．

#用意するもの
- Bash on Windows(導入方法は[ここ](http://qiita.com/makky0620/items/67e0d534e16d1e9723da)を参考にしてください)
- SPTK-3.10.tar.gz([ここのサイトからDL](http://sp-tk.sourceforge.net/))

#手順
1. SPTK-3.0.tar.gzを解凍する
`tar xfvz SPTK-3.10.tar.gz`

2. インストールする
`$ cd SPTK-3.10`
`$ ./configure`
`$ make`
`$ sudo make install`

#注意
- 私は初めに[このサイト](http://aidiary.hatenablog.com/entry/20120701/1341126474)を参考に導入しようとしましたが．うまくいきませんでした．原因はSPTKのバージョンが3.5であったためだと思います．なのでバージョンの確認はしっかりと．
- 今のところxgrコマンドで波形とかを出力する方法を見つけることができていません．私はPythonのmatplotlibにてプロットしています．