OmniAICreator/Qiita-1.07M huggingface dataset:
React Native環境構築

# 環境
* VMWare
* Ubuntu 16 (64bit)

# Javaのインストール

```bash
$ sudo add-apt-repository ppa:webupd8team/java
$ sudo apt update
$ sudo apt install oracle-java8-installer
```

# Android Studioのインストール
```bash
$ wget https://dl.google.com/dl/android/studio/ide-zips/3.0.1.0/android-studio-ide-171.4443003-linux.zip
$ mv android-studio-ide-171.4443003-linux.zip /usr/local/
$ cd /usr/local/
$ unzip android-studio-ide-171.4443003-linux.zip
$ cd android-studio/bin/
$ ./studio.sh
```

# 32bit用ライブラリのインストール
[参考](https://developer.android.com/studio/install.html?hl=ja)
※**lib32bz2-1.0**はなくなっているので、インストールできません。

```bash
$ sudo apt-get install lib32z1 lib32ncurses5 lib32stdc++6
```

# lib32bz2-1.0のインストール
[参考](https://qiita.com/routetheta/items/03a2c1aa3183291303fa)
```bash
$ sudo dpkg --add-architecture i386
$ sudo apt-get update
$ sudo apt-get install libbz2-1.0:i386
```

# Android Studioのバグ対応
[参考](https://ubuverse.com/android-emulator-does-not-launch-in-ubuntu-16-10/)
[Issue](https://issuetracker.google.com/issues/37075150)
つい最近まで更新されてる。Acceptedだからそろそろ直るのかな？

```bash
$ cd ~/Android/Sdk/emulator/lib64/libstdc++
$ mv libstdc++.so.6 libstdc++.so.6.bak
$ ln -s /usr/lib/x86_64-linux-gnu/libstdc++.so.6 libstdc++.so.6
```

# nodejs, yarnのインストール

```bash
$ curl -sL https://deb.nodesource.com/setup_9.x | sudo bash -
$ curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
$ echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
$ sudo apt-get update
$ sudo apt-get install nodejs build-essential yarn -y
# yarn globalでいれたパッケージへパスを通す。
$ echo "export PATH=(yarn global bin):$PATH
```
build-essentialは必要だったかな？まあいいか。

# react-nativeのインストール

```bash
$ yarn global add react-native-cli
```

# プロジェクト作成

```bash
$ react-native init AwesomeProject
```

# Android Virtual Devise作成
[参考](https://qiita.com/routetheta/items/03a2c1aa3183291303fa)
ここで、sampleって名前で作ったとして次

# EmulatorでAndroid起動
の前に、opengl3を使用しない設定。
[参考](https://qiita.com/kkoba84/items/dfa23f87b0c94d0a6935)

```bash
$ echo "export SVGA_VGPU10=0" >> ~/.bashrc
```
詳しくないけど、emulatorはopengl3に対応していないから2を使うようにしましょうねってことかな。

```bash
$ ~/Android/Sdk/tools/emulator -avd sample
```

# アプリ起動
```bash
$ cd AwesomeProject
$ react-native run-android
```

# 感想
これmacで用意したら簡単だったりしないだろうか。。。
Chrome extensionで英和翻訳のサンプルを作成してみました。

**いつの間にか本家からchrome extentionが出ていたようなのでこちらを使うと良いです:bow:**

https://chrome.google.com/webstore/detail/google-translate/aapbdbdomjkkjkaonfhkkikfgjllcleb?hl=ja

---

javascript勉強中のものです。
Chromeエクステンションを触ったことがなかったので、基本ぐらいは知っておきたいと思い、勉強しながら作成して見ました。

**注意**
ちょっと勉強して、あとはググりながら作成したものですので、いろいろダメな部分もあると思いますが、間違っていましたら指摘して欲しいです。

# 作成したサンプル
英和翻訳したい部分を選択し、右クリックからGoogle翻訳のページをポップアップするChrome拡張です。
![wOxpNeqJp3.gif](https://qiita-image-store.s3.amazonaws.com/0/142910/f7bedbb6-faf1-9d08-1c18-303f9948c7f6.gif)

---

# 内容

```:フォルダ構成
/
├ background.js
├ content.js
├ icon.png
└ manifest.json
```

```json:manifest.json
{
    "manifest_version":2,
    "name":"English-Japanese",
    "version":"1.0",
    "content_scripts": [{
        "matches": ["<all_urls>"],
        "js": ["content.js"]
    }],
    "background":{
        "scripts": ["background.js"]
    },
    "permissions":[
        "contextMenus"
    ],
    "icons":{
        "16":"icon.png"
    }
}
```

```javascript:background.js
'use strict';

chrome.contextMenus.create({
    title: "English-Japanese",
    contexts: ["all"],
    type: "normal",
    onclick: function(){
        chrome.tabs.getSelected(null, function(tab) {
            chrome.tabs.sendRequest(tab.id, {}, function(response) {
                console.log(response.selectedText);
            });
        });
    }
});

```

```javascript:content.js
'use strict';

chrome.extension.onRequest.addListener(
    function(request, sender, sendResponse) {
        const selectedText = window.getSelection().toString();
        const win = window.open(
            `https://translate.google.com/?hl=ja#en/ja/${encodeURIComponent(selectedText)}`,
            'window1',
            'width=600,height=500,scrollbars=yes'
        );

        // 親ウィンドウを閉じたら、子ウィンドウも閉じる
        window.addEventListener('unload',function(e){
            win.close();
        });

        sendResponse({selectedText:selectedText});
    }
);

if(window.opener && location.href.startsWith('https://translate.google.com/?hl=ja#en/ja/')){
    // 親ウィンドウが存在する(=子ウィンドウの)場合で、Google 翻訳(英和)のページだった場合
    const res = document.getElementById('gt-res-wrap');
    const src = document.getElementById('gt-src-wrap');
    document.body.innerHTML = '';
    document.body.appendChild(res);
    document.body.appendChild(src);
}
```

覚えると役に立つ場面がくると思いますので、勉強できてよかったです。
最後まで読んでいただきありがとうございました。
Hyperledger ComposerのModel File作成時のTips #変数の初期値と入力制限

# Hyperledger Composerとは
オープンソースのブロックチェーンであるHyperledger Fabricの開発フレームワークです。開発者は、ブロックチェーンの基盤技術をあまり意識する必要がなく、ブロックチェーン上の参加者定義やトランザクションなどのサービス開発に集中することができます。

# Model Fileとは
Hyperleger Composerのネットワーク上の参加者`participant`や、参加者が取引や作用する資産`asset`を定義するファイルです。[Modeling Language](https://hyperledger.github.io/composer/reference/cto_language.html)という書き方で記述します。

# 本Tips
`participant`や、`asset`にはString型やDouble型などのプロパティを設定できます。

String型を使う場合には、`participant`や`asset`が不適切なデータを保有して、ブロックチェーン上に追加されないように、デフォルト値の設定や入力制限をかけたい場合があります。

それらは、以下の記述で実現できます（assetを例にしています）。

```
asset SmapleAsset identified by assetId {

  o String assetId

  //デフォルト値なし、入力制限なし
  o String assetName
  
  //デフォルト値の設定
  o String ownerName default = "test-user" 

  //正規表現による入力制限の設定　ex)"2018/01/01-2018/12/31" 
  o String validityPeriod regex=/((20|[2-9][0-9])[0-9]{2}\/(0[1-9]|1[0-2])\/(0[1-9]|[12][0-9]|3[01]))-(20|[2-9][0-9])[0-9]{2}\/(0[1-9]|1[0-2])\/(0[1-9]|[12][0-9]|3[01])/  
  
}
```
postgres_fdwを使って同一インスタンス内でデータ移行する

異るPostgreSQLサーバ間のデータ移行では、pg_dump等のダンプツールを使うことが多い。しかし、同一インスタンス内の異なるDB間でデータを移行する時は、pg_dumpとかを使うと一度ファイルに吐かないといけなかったりして面倒なのでFDWを使ってデータを移行してみる。

今回の例では、同一PostgreSQLインスタンス内の異るDB間でのデータ移行だが、異るPostgreSQLサーバ間のデータ移行にも応用することも可能なはず。FDWを使って移行すれば、

* 移行元には何もしなくて良い
* ファイルに吐く必要もない
* 全部SQLで可能
    * データのクレンジング、変換等も楽
    * 異るスキーマ、テーブル定義への移行も楽

とかのメリットがある。

# 環境準備
移行先、移行元のDBを作成する。

```sql
CREATE DATABASE src_db;
CREATE DATABASE dst_db;
```

移行元となるテーブルを作成する。

```sql:移行元DB
CREATE TABLE hoge (c int);
INSERT INTO hoge SELECT generate_series(1,10000);
```

# 移行手順
データ移行は、出来るだけPostgreSQLの機能を使って楽に移行してみる。まずは、postgres_fdwの登録と外部サーバの準備。

```sql:移行先DB
-- postgres_fdwモジュールの登録
CREATE EXTENSION postgres_fdw;
-- 外部サーバの作成
-- 同一PostgreSQLインスタンスなのでhostはlocalhost、portは同じ。接続先DBには移行元DBを指定する
DO $$
BEGIN
EXECUTE 'CREATE SERVER src_server FOREIGN DATA WRAPPER postgres_fdw OPTIONS(' ||
	'port' || '''' || current_setting('port') || ''', ' ||
	'dbname ''src_db'', ' ||
	'host ''localhost'')';
END
$$;
-- ユーザマッピングの作成
CREATE USER MAPPING FOR public SERVER src_server;
```

次に、一時的に外部テーブルを作成するスキーマを移行先DBに作成する。そして、その一時スキーマに移行元のスキーマ情報をインポートしてから、実際のテーブルにデータをロードする。

```sql:移行先
-- 一時スキーマの作成
CREATE SCHEMA tmp;
-- スキーマ情報のインポート
IMPORT FOREIGN SCHEMA public FROM SERVER src_server INTO tmp;
-- 移行先のテーブル作成
CREATE TABLE hoge (like tmp.hoge);
-- データ移行
INSERT INTO hoge SELECT * FROM tmp.hoge;
-- 一時スキーマの削除
DROP SCHEMA temp;
```

# さいごに
SQLだけでデータを移行することができました。FDW＋IMPORT FOREIGN SCHEMA便利。

ちなみに、最後に実行したINSERT・・・SELECTはFDWを介して、SELECTが移行元（自分自身のsrc_db）へ透過的に実行されています。

```sql
EXPLAIN ANALYZE VERBOSE INSERT INTO hoge SELECT * FROM tmp.hoge;                                                  
                                                          QUERY PLAN                                                           
-------------------------------------------------------------------------------------------------------------------------------
 Insert on public.hoge  (cost=100.00..197.75 rows=2925 width=4) (actual time=96.531..96.531 rows=0 loops=1)
   ->  Foreign Scan on tmp.hoge hoge_1  (cost=100.00..197.75 rows=2925 width=4) (actual time=1.898..58.106 rows=10000 loops=1)
         Output: hoge_1.i
         Remote SQL: SELECT i FROM public.hoge
 Planning time: 0.234 ms
 Execution time: 97.508 ms
(6 rows)

Time: 104.242 ms

```
HTTP Proxy経由でSSH接続する方法(Mac)

質問されたのでまとめておく。

WindowsではPuttyやTeraTermなどを使ってHTTP Proxy経由でのSSH構成をGUIから設定できる。一方、MacではせっかくTerminalがあるのでsshコマンドのオプションで同様のことを実現したい。
ネット上ではconnect-proxyなどを使う方法などが紹介されているが、Macには（多分）ncコマンドが初期導入されているので、コンポーネントの追加導入なしにHTTP Proxy超えが可能。


```bash:基本文例
$ ssh -o ProxyCommand='nc -X connect -x <ProxyServer>:<Proxy Port> %h %p' <ユーザー>@<接続先IP>
```

```bash:秘密鍵およびポート番号を指定した際の接続例
# 秘密鍵ファイル: ~/.ssh/id_rsa_xxx
# プロキシサーバー：proxy.yyy.com
# プロキシサーバーのポート番号: 8080
# SSH接続先サーバーのユーザー: root 
# SSH接続先サーバーのIPアドレス: zzz.zzz.zzz.zzz
# SSH接続先サーバーのポート番号（デフォルトは22）: 20022
$ ssh -i ~/.ssh/id_rsa_xxx -o ProxyCommand='nc -X connect -x proxy.yyy.com:8080 %h %p' root@zzz.zzz.zzz.zzz -p 20022
```

```bash:.ssh/configに記述した際の接続例
$ cat .ssh/config
# 秘密鍵ファイル: ~/.ssh/id_rsa_xxx
# プロキシサーバー：proxy.yyy.com
# プロキシサーバーのポート番号: 8080
# SSH接続先サーバーのユーザー: root 
# SSH接続先サーバーのIPアドレス: zzz.zzz.zzz.zzz
# SSH接続先サーバーのポート番号（デフォルトは22）: 20022
Host osc01
    Hostname zzz.zzz.zzz.zzz
    User root
    Port 20022
    ProxyCommand nc -X connect -x proxy.yyy.com:8080 %h %p
    IdentityFile ~/.ssh/id_rsa_xxx

$ ssh osc01
```
LICENSEファイルの中身を一つにまとめてくれるEditor拡張


GitHub等からAssetsを持ってきて、アプリをリリースする時などにLICENSEファイルをまとめるのがめんどくさいなぁと思ったりしませんか？僕は数回やってめんどくさいと思いました。

なのでEditor拡張でAssets配下の"LICENSE"ファイルを検索して"Assets/USE_ASSETS_LICENSE"にまとめるようにしてみました。

これで、ライセンス表記をする際に"Assets/USE_ASSETS_LICENSE"からtextを読んでもいいですし、開いてコピペでもいいと思います。良しなに使っていただければと思います。

```csharp:
public static class CreateUseLicenseFile
    {

        private const string USE_LICENSE_FILE = "use_assets_license_file";
        private const string fileName = "USE_ASSETS_LICENSE";

        [MenuItem("Assets/Create/Used LICENSE File")]
        static void CreateUsedLICENSEFile()
        {
            System.Text.StringBuilder builder = new System.Text.StringBuilder();

            string[] files;
            string assetPath = Application.dataPath + "/" + fileName;

            AssetDatabase.MoveAssetToTrash(assetPath);

            files = AssetDatabase.FindAssets("LICENSE");
            foreach (var guid in files)
            {
                if (Path.GetFileName((AssetDatabase.GUIDToAssetPath(guid))) == "CreateUseLicenseFile.cs" ||
                    Path.GetFileName((AssetDatabase.GUIDToAssetPath(guid))) == fileName) continue;
                var path = AssetDatabase.GUIDToAssetPath(guid).Substring("Assets".Length);
                StreamReader reader = new StreamReader(Application.dataPath + path);
                builder.Append(reader.ReadToEnd()).AppendLine();
                reader.Close();
            }

            string text = builder.ToString();

            if (AssetDatabase.LoadAssetAtPath(assetPath, typeof(UnityEngine.Object)) != null && EditorPrefs.GetInt(USE_LICENSE_FILE, 0) == text.GetHashCode())
                return;

            System.IO.File.WriteAllText(assetPath, text);
            EditorPrefs.SetInt(USE_LICENSE_FILE, text.GetHashCode());
            AssetDatabase.Refresh(ImportAssetOptions.ImportRecursive);
        }
    }
```

こういう拡張があったら二番煎じですみません。。。

最近、作り始めたフレームワークの中に入れています。もし、ご興味のある方は是非。
https://github.com/MizoTake/MomijiFramework/blob/master/Editor/CreateUseLicenseFile.cs
WxBeacon2をRaspberry Pi 3につないで部屋の状態を可視化

#背景
ウェザーニューズのサービスの一つとしてウェザーレポートという機能があり、お天気を投稿するとポイントが貰え、2000pt貯めるとWxBeacon 2というデバイスがもらえます。気温、湿度、騒音などなどを測定してスマホで表示出来る優れもの

https://weathernews.jp/smart/wxbeacon2/

中身はオムロンの2JCIE-BL01です。

<img src="https://qiita-image-store.s3.amazonaws.com/0/160730/b41ae7a4-be87-d838-f0f9-b6928f3cbae0.jpeg" width=50%>


今回、3年がかり（サボってたのもあるけど、毎日レポート送れば半年ぐらいで貯まるかな？）で2000pt貯めてもらえたのでRaspberry Piに繋いでデータベースに蓄積してグラフを表示するとかいろいろ遊んでみます。

#Raspberry Pi 3にWxBeacon 2を接続
BLE使って通信しているので、Raspberry Pi 3ならば内蔵のBluetoothで接続できます。オムロンが[サンプルのプログラム](https://github.com/OmronMicroDevices/envsensor-observer-py)公開しているのでこちらを利用します。


##python-bluezの導入

pythonからBluetoothを使えるようにする

```
$ sudo apt-get install python-bluez
```

##CSV出力してみる

プログラムの実行

```
$ sudo ./envsensor_observer.py
```

logフォルダにcsvが出力・・・されない

>Environment Sensor (2JCIE-BL01) must be configured as a beacon broadcaster (IM/EP).

どうやらセンサの設定をビーコンモードに切り替える必要があるようです．
[Omron 環境センサ(2jcie-bl01)の設定をBroadcasterに変更してアドバタイズパケットから情報を取得してみるテストまで](https://qiita.com/komde/items/7209b36159da69ae79d2)
こちらを参考に，スマホから設定をGeneral Broadcaster 2にします．

再度試したところうまく値が出力されました．

#データをinfluxDBに書き溜める
##fluentd forwarderのインストール

```
$ sudo pip install fluent-logger
```

##influxDBのインストール

[公式ドキュメント](https://docs.influxdata.com/influxdb/v1.4/introduction/installation/)を参考にインストールします

```
curl -sL https://repos.influxdata.com/influxdb.key | sudo apt-key add -
source /etc/os-release
test $VERSION_ID = "7" && echo "deb https://repos.influxdata.com/debian wheezy stable" | sudo tee /etc/apt/sources.list.d/influxdb.list
test $VERSION_ID = "8" && echo "deb https://repos.influxdata.com/debian jessie stable" | sudo tee /etc/apt/sources.list.d/influxdb.list
test $VERSION_ID = "9" && echo "deb https://repos.influxdata.com/debian stretch stable" | sudo tee /etc/apt/sources.list.d/influxdb.list
```

```
sudo apt-get update && sudo apt-get install influxdb
sudo service influxdb start
```

##conf.pyの書き換え

設定ファイルを適宜書き換えます．FalseになってるところをTrueに，DBのIPアドレスやDBの名前を設定します．

##Grafanaの導入

今回のメイン？influxDBのデータを読み込んでカッコイイグラフをブラウザで表示出来ます．

```
sudo apt-get install apt-transport-https curl
curl https://bintray.com/user/downloadSubjectPublicKey?username=bintray | sudo apt-key add -
```

```
echo "deb https://dl.bintray.com/fg2it/deb jessie main" | sudo tee -a /etc/apt/sources.list.d/grafana.list
```

```
sudo apt-get update
sudo apt-get install grafana
sudo service grafana-server start
```

localhost:3000にアクセスしてログイン画面が出ることを確認します(admin/admin)でログイン出来ます
influxDB,Grafanaと収集プログラムはsystemdで自動起動するようにしとくと便利です．

#データ収集

収集プログラムを起動します．

```
$ sudo ./envsensor_observer.py
```

5分毎にinfluxDBにデータが蓄積されていくはずです．


#Grafanaでグラフィカル表示

Grafanaにログインします．New Dashboardから新しいダッシュボードを作成します。

グラフを選びます。
<img src="https://qiita-image-store.s3.amazonaws.com/0/160730/64db8407-d4c9-4dc6-7a54-48d975ea80b6.png" width=50%>

作成されたグラフを選んでEdit.MetricsのSQLを以下のようにします。humidityの部分は測定値の表示したい項目を選びます。
その他グラフタイトルや単位(Unit)などを適宜設定します。
<img src="https://qiita-image-store.s3.amazonaws.com/0/160730/aab070b6-0273-f9f4-89e5-083ef40533bf.png" width=70%>

設定進めていくとこんな感じでイケてるグラフが出来上がります。
<img src="https://qiita-image-store.s3.amazonaws.com/0/160730/10bf401f-341b-9c71-c96a-412be418f9aa.png" widht=50%>
SyncTex で2時間消費…VSCode で SyncTex を適用するときの注意点

修士論文を執筆する際，Visual Studio Code の拡張機能 LaTeX Workshop を使用していました．バージョンは 1.19.2 です．
VSCode で .tex 形式での文書を作成するときには SyncTex という機能を使えます．
この機能がよくわからずしょうもないことで2時間も消費してしまったので，ここに記録として置いておこうと思います．

# SyncTex の機能
そもそも SyncTex を使うことで何ができるのかというと，編集中の .tex の現在のカーソル位置から PDF 文書側の該当位置にジャンプすることができるようになり，編集している行が今どのようになっているのかをすぐに確認できます．これはカーソル位置で右クリックをし，SyncTex from cursor を選択することでジャンプできます．
また，PDF 側からのジャンプも可能であり，View LaTeX PDF file in new tab を選択し，表示された PDF 文書内の検索したい文字列にマウスポインタを重ねて `Ctrl + 左クリック` をすると，該当する .tex ファイルの該当箇所にジャンプしてくれます．
これは .tex ファイルとコンパイル後に出力された .pdf ファイルを SyncTex というコマンドにより紐づけされることで実現されています．

私はこの .tex ファイル側から PDF ファイル側にジャンプするという機能を実行することはできたんですが，逆の PDF ファイル側から .tex ファイル側へのジャンプが実行できなかったのです．それは .tex ファイルまでの絶対パスの中に日本語で設定したフォルダが存在していたのが原因でした．
```
[21:46:25] Executing synctex with args edit,-o,22:224.01326315789473:442.4257894736841:c:\Users\User_name\Dropbox\paper\shuron\main.pdf
[21:46:25] SyncTeX to file c:\Users\User_name\Dropbox\paper\shuron\survey.tex
```
上記のように，`shuron` の部分を `修論` などという全角の日本語入力になっていたため，文字化けしてしまい正常に動作しなかったということです．アルファベットに修正することで，やっと動きました．

# まとめ
やはりフォルダ名やファイル名に日本語入力もしくは全角入力をすることは絶対にしないほうが良いことがわかりました．これは今回の件のみに限らず，プログラミングをする際や日常生活におけるフォルダ作成であっても常に注意をしておくべきだと感じました．

あと，VSCode では絶対パスに全角日本語が入力されていた場合動作しなかったのですが，TexWorks ではジャンプすることができました．自分以外に少なくとも1人はこの現象に陥っている方がいらっしゃると思います．その方の手助けになれば幸いです．
高速なべき乗の計算

『[Essential Algorithms: A Practical Approach to Computer Algorithms](https://www.safaribooksonline.com/library/view/essential-algorithms-a/9781118612101/)』にべき乗の計算を高速にする方法について書かれていた。

ナイーブに計算すると、べき乗の計算は乗数が増えたときに遅くなる。次のべき乗の基本的な法則を活用して、これを解消できる。

* $A^{2 \times M} = (A^M)^2$
* $A^{(M + N)} = A^M \times A^N$

例として挙げられていたものは、$7^6$ の計算である。まずは、次のような計算をする。

* $7^1 = 7$
* $7^2 = (7^1)^2 = 49$
* $7^4 = (7^2)^2 = 49^2 = 2401$

ここで $7^6 = 7^4 \times 7^2$ だから、$49 \times 2401 = 117649$ が答えとなる。

素直に $7 \times 7 \times 7 \times 7 \times 7 \times 7$ とすると、7回の乗算が必要だけど、この方法だと乗算が3回しか発生しない。

この実装を Python で書いてみたけど、あまり速くはならなかった。うーん、なんでだろう。

```python
#!/usr/bin/env python2

import collections


def my_pow(x, y):
    n_powered = collections.OrderedDict({})

    idx = 1
    mult = x
    while idx < y:
        n_powered[idx] = mult

        mult = mult * mult
        idx = idx * 2

    rev_keys = sorted(n_powered.keys(), reverse=True)

    result = 1
    for key in rev_keys:
        if key <= y:
            result *= n_powered[key]
            y -= key

    return  result


def naive_pow(x, y):
    result = 1
    for i in range(y):
        result *= x
    return result


print my_pow(7, 10000)
print naive_pow(7, 10000)
```
ターミナルからのgithub操作(随時追加予定)

ターミナルからgithubを操作する方法を箇条書きで書いています。

完全に自分のメモ書きなので、順番とかはありません。

#herokuへのpush

・git add .
・git commit -m "コミット内容"
・git push heroku master 
もしくは
git push heroku (ブランチ名):master
・heroku run rake db:migrate 
・heroku open
rails キーワード検索とプルダウン検索の両方を一つのメソッドで実装

#検索機能にはいろんな種類が。。。
webアプリを作成していると、検索機能を作ることがよくあると思いますが、キーワードだけで検索とかはあまりないですよね。。。どちらかというと、キーワードもあるけど、こちら側で用意した項目でプルダウンで選んで検索することも多いと思います。
二つメソッド作ればよくない？とも思うんですが、コントローラーが太るので一つに集約します。
そういう場合のやり方をメモります。

#作りたいもの
##プルダウンからできるもの
問題を検索する機能で、授業は国語、算数、理科、社会のどれかに属します。
プルダウンでこの４つの科目のうちのどれかを検索すると、対応した問題が表示されます。
ex国語＝＞文学史や漢字、算数＝＞掛け算、文章題

##キーワード検索からできるもの
この問題は直接、問題名を検索することもできます。「文学史」と打ち込めば文学史が表示されるようにします。

#実装MVC

##Model
![スクリーンショット 2018-01-30 20.49.22.gif](https://qiita-image-store.s3.amazonaws.com/0/147990/cb50dc12-453e-b7a6-3d59-e8a34d37fc0c.gif)

```ruby:problem.rb
validates :problem_name, presence:true
validates :submit_name, presence:true
#problem_nameとsubmit_nameは確実になければいけないようにする
```

##View
```ruby:search.html.erb
 <%= form_tag(comics_search_path, method: "get") do %>
    <%= text_field_tag :keyword , params[:keyword],placeholder: "作品名・サークル名など"%>
 <% end %>
#キーワード検索するタブを作る

<%= form_tag(comics_search_path, method: "get") do %>
 <%= select_tag "submit_name", options_for_select([["国語", "国語"],["算数","算数"],["理科","理科"],["社会","社会"]]) %>
<% end %>
#プルダウン検索バー生成

<%= @submits_searched %>
#検索結果出力場所
```
*公式
railsにおけるプルダウン検索view
select_tag "カラム名", options_for_select([["画面表示したい名前","データの実際の値"],["画面表示したい名前","データの実際の値"]])

##Controller

```ruby:problem_controller
def search 
submit_name_ids = Submit.where("submit_name = ?", params[:submit_name]) .pluck(:id)
#プルダウンで選ばれたsubmit_nameと同一のsubmi_nameを持つレコードを取得し、そのidを全て列挙する

problem_name_ids = Submit.where("problem_name LIKE (?)", "#{params[:problem_name]}").pluck(:id)
#キーワードで検索された名前と同じproblem_nameと同じproblem_nameを持つレコードのidを全て列挙する

@submit_searched = Submit.where("submit_id IN (?) or submit_id IN (?)", submit_name_ids, problem_name_ids)
#submit_name_idsかproblem_name_idsに当てはまるものをsubmitテーブルから探して、
#@submit_searchedに代入。

```

#改善したいところ
データの中身が文字列になってしまっているので、数値データを入れた方が検索が早くなるのではと考えています。。。。
そこもいずれ書いてきます。
herokuのPostgresql row数を圧迫するdjango_admin_logを削除

# HerokuのPostgresqlが圧迫 → django_admin_logテーブルが原因でした
Heroku上でDjangoアプリを開発・運用しているのだが，自分が利用している以上にPostgresqlのRow数が増えていることに気がついた．
無料で利用できるRow数は10000(?)で，4000Rowぐらい利用していた．
体感的には1000Rowないぐらいだったので，原因究明と解決に取り組んだ．

簡潔に結論を述べると原因は，django_admin_logテーブル（admin操作の履歴？）が3000Row以上占めていた．これは実際にアプリで使用しているテーブルにて，全件削除・既存データから読み込みを複数回繰り返したことが原因だった．
このテーブルを全件削除することで，問題に対処できた．

以下が操作手順である．

## postgresqlのinstall
heroku上のPostgresqlを操作するには，ローカルにpsqlコマンドのインストールが必要だった．
ここはhomebrewで対応

```bash
brew install postgresql
```

## postgresql on heroku の操作
続いて，terminalからherokuコマンドで，heroku上のPosｔgresqlの操作を行う

```sh
heroku pg:psql
# record数確認
SELECT T2.relname , T2.reltuples FROM pg_stat_user_tables AS T1 INNER JOIN pg_class AS T2 ON T1.relname = T2.relname ORDER BY T2.relname;
#--> django_admin_log のRow数が圧倒的に多いことに気付く

# 削除
DELETE * FROM django_admin_log;
```


# 参考URL
- [各テーブルのRow数確認](https://ameblo.jp/smd310/entry-11377740731.html)
- [heroku上のPostgresqlの操作](https://stackoverflow.com/questions/24939591/how-to-get-tables-from-postgresql-in-heroku)
任意のレイヤー名をtoggleする

レイヤーを検索し、指定したレイヤー名のものがあれば非表示に、無ければ作成するアクションを実行します。



```javascript

#target photoshop
if(app.documents.length){ //ファイル開いているか
app.activeDocument.suspendHistory("【ヒストリーに表示する項目名】","main()");
}
function main(){
myClipname="Clipping_View"; //【検索するレイヤー名】

myLayer = app.activeDocument.layers;
    try{myTest=myLayer[myClipname]; //指定のレイヤーがあるか
        if(myTest.visible){myTest.visible=false;}else{myTest.visible=true;} //あったら表示非表示切り替え
    }catch(e){
        app.doAction ("【アクション名】", "【アクションのあるフォルダ名】"); //なかったら作成するアクション実行
    }
}
```

改造すると、任意のレイヤー名を探してオン／オフできます。

```javascript

#target photoshop
/*
<javascriptresource>
<name>★付き特定レイヤートグル</name>
<category>YPresets</category>
</javascriptresource>
*/
if(app.documents.length){ //ファイル開いているか
app.activeDocument.suspendHistory("★付き特定レイヤートグル","main()");
}

function main(){
myClipname="★"; //レイヤー先頭符号
myLayer = app.activeDocument.layers;

var length = myLayer.length;
for(var i = 0; i < length; i++){
    var layer = myLayer[i];
    if(layer.name.indexOf(myClipname) === 0){
          if(layer.visible){layer.visible=false;}else{layer.visible=true;} //あったら表示非表示切り替え
        
         }
    }  
}
```
HTMLとCSSとWebデザインが身につく本を読みました。

# 読んだ本の感想と、それを元に作ったサイトの紹介

## 読んだ本
[HTML&CSSとWebデザインが1冊できちんと身につく本 kindle版](https://www.amazon.co.jp/gp/product/B0746F9XKD/ref=oh_aui_d_detailpage_o00_?ie=UTF8&psc=1)
著者：服部 雄樹

## 感想
**非常に読みやすく、進めやすい。**
HTML,CSS等に初めて触れるという方はここから始めるのは比較的オススメできるんじゃないかと思います。

テーブルにナビゲーションにiframe、グリッド等をサンプルを作りながら学べます。

また、ページ作成もフルスクリーンページ、シングルカラム、２カラム、レスポンシブと幅広く学ぶことが出来るため、一冊で学ぶ量としても凄く良かったです。

ただ、**これ１冊でレスポンシブをすべて対応できるというわけではありません。**

例として、１ページ分だけレスポンシブ対応をするので、それを参考にしつつ、自らCSSを書いていくことになるかと思います。

その自ら考えて作ってみるという展開も個人的には満足です。(捉え方次第ですが。)

また、デザインする上での考え方といったところも何箇所かで説明されていますので、全体を体系的に学べるかと思います。

## 作成したサイト
[ke1taの台所](https://ke1ta.me/ke1tas-kitchen/index.html)

こちらでは上記の本をもとに作ったサイトです。
デザインはすべて自作です。その為、多少文字のぼやけ等もあるかと思います。

また、レスポンシブの対応もportfolioページを除き、すべて自作です。
iframeのレスポンシブ対応や、グリッドの対応等で学んだことは別途投稿しようと思います。

ps.Gitも使いました。
リーンキャンバスの考え方で学ぶ経営学


# リーンキャンバスの考え方で学ぶ経営学

## リーンキャンバスとは何か
9つの質問に答えるだけで自分たちのビジネスがビジネスとして成立か確認でき、確かめたい仮説を明確にするツール

## 仮説検証
* 正解を最初から狙うものでは無い
* 何が一番わからないかを特定し、確かめる行動に変化させるもの
* 正解を狙うものではなく、次の行動を知る方法

## スタートアップに
1. 問題と解決策の選択は正しいか
1. 解決策の製品は市場に受け入れられるか
1. そのビジネスは大きく成長するか

## リアルオプション戦略
* 目的不確実性の低いステージには少ない金額でチャレンジする戦略

# Problem Solution Fitの仮説
## Solution Fit
*
### Market Fit
* 投資よりも利益が大きくなる理由を述べる

### Growthの仮説
* 最初から真似することができない要素
* 成長するごとに真似しづらくなる要素

### 仮説がクリアでないと学べない
* 書きづらい場所は不安で確かめないといけない部分

### 1 Problem
ウォンツじゃなくてニーズを書く提供したいものではなく、顧客が求めているものをかく
* ウォンツ(欲しいもの): 手段
	- モテたい: 服が欲しい

* ニーズ(必要なもの): 目的
	- モテたい: モテたいそのもの

### 1 顧客
具体的なイメージをする、ペルソナの設定をすると良い

#### 市場の玉ねぎ構造
* TAM: 潜在市場全て
* SAM: そのうち想定する課題を抱えている市場
* SOM: さらにそのうち自分たちの顧客として獲得可能な市場

### 2 なぜあなたから提供を受けるのか
SWOTの分析をすると良い
* あなただからできる理由
* あなたにかけているものは
* なんで今それをやるの
* ライバルや驚異は何

### 3 なぜ、あなたから提供を受けるのか？
* 既存と比べてQCDでどれで勝っているか
#### 選ぶ戦略で難易度が異なる
* 小さなビジネスだとすぐになくなる、大きなビジネスだと難しいが長く続く
* 大きなサービスは大きすぎて対応に時間がかかるからその間に戦う
#### 世界にとって固定的に必要とされるようなものかどうか
こんな世界を作成すれば世界に必要とされるから、このサービスは生き残る！というものを考える



### 3 どんな解決策を提供するのか？
解決策を後回しにしないと、ニーズを逆算してしまい、ニーズの思い込みが強くなる

* 大きなものと、大きなものをくっつけるケースが多い。くっついているだけではユーザは来ない
 - Googleカレンダー、Slackを合わせたら便利じゃね？ (開発コストが膨大)

* 100得ナイフは作るな。本当に重要、必要なものだけを提供しなければ遅くて使い勝手が悪い
 - ソフトウェアの2割程度しか使われていない場合が多い

## タグラインを決める
機能の説明をするだけでは訴求しない
顧客にはどのようなニーズがあって、どのように関わっているかを、短いメッセージで伝えるものをタグラインと言います

### 6.コスト構造に向けて単価感を把握する
外部に頼んでCPA, CPIを作成する



### コストはどんな構造をしているのか
固定費: 施設、仮検証をおこなる人件費、サーバ代など
お客さん毎にかかるコスト

### ひとりの顧客はいくら利益をもたらすか
#### ユニットエコノミクス: かけた費用より、得る利益が大きいか確認する指標
* CAS(顧客獲得コスト) : LTV(顧客生涯価値) の比率で表現される
> https://medium.com/@tumada/%E3%82%B9%E3%82%BF%E3%83%BC%E3%83%88%E3%82%A2%E3%83%83%E3%83%97%E3%81%AE%E3%81%8A%E9%87%91%E3%81%A8%E6%8C%87%E6%A8%99%E5%85%A5%E9%96%80%E8%AC%9B%E5%BA%A7-%E3%83%A6%E3%83%8B%E3%83%83%E3%83%88%E3%82%A8%E3%82%B3%E3%83%8E%E3%83%9F%E3%82%AF%E3%82%B9-unit-economics-cac-ltv-53112185fbcd

#### LTV(顧客生涯価値)の考え方
* ソーシャルゲームの場合、最初は退会立がかなり多いがそのあとは少しずつ減っていく。それは二つのLTVを加算する

### ユニットエコノミクス
* ユニットエコノミクスの仮説を持たないで、ユーザを集めてからビジネスを検証すると、お金を払うほどユーザは熱狂してるかわからないため、難易度が高くなる
現在のユーザ数、ひとり当たりの売り上げを見て広告を打つのか、打たないのか判断する

? 全くの最初はどの程度レバをかければ良いのか話からない。
* 最初投資をしてもらう段階で指標を出すからそのときに決める

大きな仮説の確からしさをその想定数から検証すること



##### ベンチャーと八百屋の違い
* 最初はお客さんがいないから赤字、使用する人数が多くなれば無限にお金が手に入る企業はベンチャー


### それにいくらかけますか？
* 大きな仮説の確からしさをその想定数から検証すること
* それにいくらかけるか。それを超えなかったらサービスをやめる or サービスの方向転換
* よければ資金調達

## 7 競合優位性はどうして作られるか
* 模倣できない価値: コアコンピタンス
* 本当に良いサービスなら強豪に模倣される

1. 顧客に利益をもたらす
1. 競合会社に真似できない
1. 複数領域への展開可能

* どこに投資するかが重要
* 使いやすいUIにします！ あとで参入する大手よりもUIにお金をかける


* デリッシュキッチンは分散型メディアのコンサルで儲けているから、クックパッドとは正確な意味で競合しない



## 後半のポイント
1. 顧客を惹きつけるキーフレーズをどこに投げるか
1. ユニットエコノミクスはどの程度なのかを想定する
1. 蓄積される資源に集中投資する

* コアコンピタンスが弱い会社を作ってしまうと、二番煎じの大手にあっさり持ってかれる

### 過去の経営者から学べ
* リーンキャンパスが書きづらかったところ、をどうやったら書けるのか次のアクションに持っていくこと
Choreonoidで重心ヤコビアンを解く

前回はChoreonoidのライブラリを使用して運動学計算を行いました.今回は重心ヤコビアンを解いてみたいと思います.

## 環境
OS: ubuntu 16.04 LTS
version: choreonoid-1.6.0

## サンプルコード
```cpp
#include <iostream>
#include <cstring>

#include <cnoid/Body>
#include <cnoid/JointPath>
#include <cnoid/Jacobian>
#include <cnoid/BodyLoader>
#include <cnoid/Link>

using namespace std;
using namespace cnoid;

int main()
{
	BodyLoader bodyloader;
	
	string model_path("/usr/share/choreonoid-1.6/model/SR1/SR1.body");
	BodyPtr robot = bodyloader.load(model_path.c_str());

	JointPathPtr leg = getCustomJointPath(robot, robot->link("LLEG_ANKLE_R"), robot->link("RLEG_ANKLE_R"));

	robot->calcForwardKinematics();

	MatrixXd J_com(3, robot->numJoints());
	calcCMJacobian(robot, leg->baseLink(), J_com);

	std::cout << leg->baseLink()->name() << std::endl;
	std::cout << leg->numJoints() << std::endl;
	std::cout << J_com << std::endl;

	return 0;
}

```

重心ヤコビアンは，支持脚足裏が面に接地しているという条件のもと，ロボットの重心と関節間のヤコビアンのことを指し，これを用いることで別途得られる所望の重心運動の変位から全身関節運動への導出が出来るようになります．choreonoidでは重心ヤコビアン以外にも角運動量ヤコビアンなども実装されています．

詳細な理論などは論文を参照することをお勧めします.
http://www.mi.ams.eng.osaka-u.ac.jp/member/sugihara/pub/robomech02-1.pdf
http://www.mi.ams.eng.osaka-u.ac.jp/member/sugihara/pub/jrsj_cog.pdf

コードの説明です．重心ヤコビアンは一行関数を呼び出すだけで計算ができます．第一引数にはBodyクラスのインスタンス，第2引数にはベースリンク，第3引数は参照引数になっており，事前にサイズを初期化した行列を入れておきます．ここに重心ヤコビアンの計算結果が格納されます．重心と関節間のヤコビアンなのでサイズは3×ロボットの自由度になります．

```cpp
void calcCMJacobian(Body* body, Link* base, Eigen::MatrixXd& J)
```

ですが，その前の準備が必要で，そのためにgetCustomJoitPath関数を呼び出します.ここでは左脚が床面に接地している状態で重心の変位量を入れた時の重心ヤコビアンを計算するとします．(このやり方であっているのかはわからないんですがシミュレータで逆行列といて動かした時はそれっぽい動きをしてました)

上記コードを実行すると計算結果が出てきます.でかい行列が表示されて見辛いですが...重心運動が変位した時これの逆行列解いて計算することで関節運動の変位量が出てくるんですが正則行列ではないので擬似逆行列を解く必要がありますね.

## まとめ
重心ヤコビアンを解いてみましたが正直これだけじゃわからないので次は逆行列まで解いてPuluginとして実装してchoreonoid上で動かしてみようと思います
Python で iterator の次の値を取得しながら走査したい

# やりたいこと

Ruby での

```rb
(1...10).each_cons(2).to_a
#=> [[1, 2], [2, 3], [3, 4], [4, 5], [5, 6], [6, 7], [7, 8], [8, 9]]
```

を Python でやりたい。

# 方法 1

```py
import itertools

numbers = range(1, 10)
it1, it2 = itertools.tee(numbers)
next(it2)
list(zip(it1, it2))
# [(1, 2), (2, 3), (3, 4), (4, 5), (5, 6), (6, 7), (7, 8), (8, 9)]
```

# 方法 2

list や range など subscriptable (添え字にアクセス可能) なオブジェクトならこの方法がシンプルでした。(@shiracamus さん、ありがとうございます :bow:)

```py
numbers = range(1, 10)
list(zip(numbers, numbers[1:]))
# [(1, 2), (2, 3), (3, 4), (4, 5), (5, 6), (6, 7), (7, 8), (8, 9)]
```
Unityで、画面外（カメラ外）に出たかどうか判定する


## 画面外に出る対象物にSpriteRendererコンポーネントをアタッチ

![image.png](https://qiita-image-store.s3.amazonaws.com/0/37406/875d2ed3-98a1-eb67-8769-e92ec51d00df.png)



## 画面外に出る、たとえばキャラクターや弾等で、下記スクリプトを実装

```c#
:Player.cs


void Update(){

	if (!GetComponent<SpriteRenderer>().isVisible)
	{
	    Debug.Log("画面外");
	}

}
```

## 味噌はこれ

**isVisible**

## 注意点

* ただし、Gameビュー、Sceneビュー両方を開いていると、Sceneビューのサイズをつかっているような挙動をするので注意



```c#

 //このオブジェクトがGameViewのみで描画されているか判定用に、
        void OnWillRenderObject()
        {

#if UNITY_EDITOR

            // Debug.LogError("isVisible:::::camera:" + Camera.current.name);

            if (Camera.current.name != "SceneCamera" && Camera.current.name != "Preview Camera")
#endif
        }
```
Python (SymPy) で完全数、友愛数、婚約数、双子素数を求める

# はじめに

この記事は [博士の愛した数式](http://www.shinchosha.co.jp/book/121523/) を愛した僕の備忘録です。作中に登場した数に関する概念を [SymPy](http://www.sympy.org/en/index.html) を使って計算してみます。

# コード

# 準備

```py
import sympy


def sum_divisors_except_itself(n):
  '''
  自分自身を除く正の約数の和を返す。
  '''
  return sum(sympy.divisors(n)[:-1])


def sum_divisors_except_one_and_itself(n):
  '''
  1 と自分自身を除く正の約数の和を返す。
  '''
  return sum(sympy.divisors(n)[1:-1])
```

# 完全数

完全数 （perfect number）とは、その数自身を除く約数の和がその数自身と等しい自然数のこと。

```py
results = []
for n in range(1, 10000 + 1):
  if n == sum_divisors_except_itself(n):
    results.append(n)

results
# [6, 28, 496, 8128]
```

# 友愛数

友愛数 （amicable numbers） とは、異なる 2 つの自然数の組で、自分自身を除いた約数の和が互いに他方と等しくなるような数のこと。

```py
results = []
for m in range(1, 10000 + 1):
  n = sum_divisors_except_itself(m)
  if n >= m:
    continue
  if sum_divisors_except_itself(n) == m:
    results.append((n, m))

results
# [(220, 284), (1184, 1210), (2620, 2924), (5020, 5564), (6232, 6368)]
```

# 婚約数

婚約数 （betrothed numbers） とは、異なる 2 つの自然数の組で、1 と自分自身を除いた約数の和が互いに他方と等しくなるような数のこと。

```py
results = []
for m in range(1, 10000 + 1):
  n = sum_divisors_except_one_and_itself(m)
  if n >= m:
    continue
  if sum_divisors_except_one_and_itself(n) == m:
    results.append((n, m))

results
# [(48, 75), (140, 195), (1575, 1648), (1050, 1925), (2024, 2295), (5775, 6128)]
```

# 双子素数

双子素数 （twin prime) とは、差が 2 である 2 つの素数の組のこと。

```py
results = []
for m in sympy.primerange(sympy.prime(2), 10000 + 1):
  n = sympy.prevprime(m)
  if m - n == 2:
    results.append((n, m))

results
# [(3, 5), (5, 7), (11, 13), (17, 19), (29, 31), (41, 43), (59, 61), (71, 73), (101, 103), ..., (9857, 9859), (9929, 9931)]
```
ElasticBeanstalkアプリケーションのエラーログをTypetalkに流したかったときの作業ログ

Typetalk使いに向けてざっくりとのこしておく

## 前提 

- ElasticBeanstalkアプリケーションがデプロイ済み
- Serverless Frameworkもインストール済み
- Golang及びDepもインストール済み

## 1. ElasticBeanstalkのCloudWatch ログストリーミングを有効にした
マネジメントコンソールから対象のEnvironmentを開き、 設定 > ソフトウェア設定 を開く

ログのストリーミングを有効にして適用する

<img width="549" alt="スクリーンショット 2018-01-30 15.36.19.png" src="https://qiita-image-store.s3.amazonaws.com/0/43642/c2a47751-0473-e6af-9c9b-41d29dc6f31b.png">


CloudWatchにログストリームが作成され、Environmentで出力されたログが送信されてくる
<img width="492" alt="スクリーンショット 2018-01-30 15.36.36.png" src="https://qiita-image-store.s3.amazonaws.com/0/43642/12dec469-5b2b-fe60-0b6e-11fc5a718d2a.png">

## 2. CloudWatchログをTypetalkにPOSTする関数をつくって登録した

せっかくなのでちょっと前にサポートされた go と serverless frameworkで
ありがたいテンプレートを使った　感謝

```
    sls create -u https://github.com/serverless/serverless-golang/-p goserverless
```

そしてありがたいライブラリを使う
aws-lambda-go-eventはめんどくさいStructの定義をしてくれてる感謝
go-typetalkも面倒なPOST部分を簡単にかける感謝

```
    import(
        "github.com/aws/aws-lambda-go/lambda"
        "github.com/nulab/go-typetalk/typetalk"
        "github.com/eawsy/aws-lambda-go-event/service/lambda/runtime/event/cloudwatchlogsevt"
    )
```

適当にメッセージを組み立ててPOSTする部分を実装　かんたん

```
    messages := make([]string, len(event.Records))
    for i, record := range event.Records {
       messages[i] = record.LogEvent.Message
    }
    
    // TypetalkのPOSTサイズ上限があるので長い分は抜く
    r := []rune(strings.Join(messages, "\n"))
    message := fmt.Sprintf("```\n%s\n```", string(r[0:3900]))
    
    // 追いかけやすいように便利なまとめ機能にもいれる
    options := typetalk.PostMessageOptions{}
    options.TalkIds = []int{talkId}
    
    client := typetalk.NewClient(nil).SetTypetalkToken(token)
    
    client.Messages.PostMessage(ctx, topicId, message, &options)
```

ビルドしてAWSにデプロイ

```
    sls deploy
```

## 3. CloudWatchログをLambda関数へストリーミングさせた

ここからLambdaサービスへのストリーミング開始を選んで設定

<img width="680" alt="スクリーンショット 2018-01-30 15.36.58.png" src="https://qiita-image-store.s3.amazonaws.com/0/43642/3e5fea13-c81e-9604-d26d-f8c959afaa1f.png">

Lambda 関数 : さっきデプロイした関数
ログ形式 : とりあえずその他


### 4. TypetalkにログがPOSTされた
ストリーミングが開始されると、Lambda関数が実行され、Typetalkにアプリケーションのログが流れた

実際に動かしているものはもう少し小細工してあるけど、そこらへんを簡潔にしてコードを置いたのでTypetalk使い達の参考になれば。
https://github.com/katsut/typetalk-awslogs

流すだけならわりとかんたんにできた
Beautiful Soup > elem.aの.aは何なのか > htmlのAタグなのだろう

```txt:動作環境
GeForce GTX 1070 (8GB)
ASRock Z170M Pro4S [Intel Z170chipset]
Ubuntu 16.04 LTS desktop amd64
TensorFlow v1.2.1
cuDNN v5.1 for Linux
CUDA v8.0
Python 3.5.2
IPython 6.0.0 -- An enhanced Interactive Python.
gcc (Ubuntu 5.4.0-6ubuntu1~16.04.4) 5.4.0 20160609
GNU bash, version 4.3.48(1)-release (x86_64-pc-linux-gnu)
scipy v0.19.1
geopandas v0.3.0
MATLAB R2017b (Home Edition)
ADDA v.1.3b6
BeautifulSoup 4.4.1
```

[MemoryEnhancer > MEDC > test_get_list_180130.py > GitHub上のMarkdownファイル名(*.html.md)リストを取得する | GitHub REST API v3 | JSONモジュール | BeautifulSoup](https://qiita.com/7of9/items/a02ed74c95a136423143)
のコメントにて教えていただいたBeautifulSoupのコードが分からなかった。

```py
import requests
from bs4 import BeautifulSoup

IN_URL = "https://github.com/yasokada/TechEnglish_170903/tree/master/data"

res = requests.get(IN_URL)
if res.status_code == requests.codes.ok:
    soup = BeautifulSoup(res.text, 'lxml')
    for elem in soup.find_all('td', class_='content'):
        if elem.a and elem.a.text.endswith('html.md'):
            print(elem.a.text)
```

`elem.a`の`.a`とは何か?

[公式サイト](https://www.crummy.com/software/BeautifulSoup/bs4/doc/)を「.a」で検索しても検索結果が多すぎて該当記事にはたどり着かない。

タグと考えて以下を見つけた。
https://www.crummy.com/software/BeautifulSoup/bs4/doc/#tag
> Tag
> ```soup = BeautifulSoup('<b class="boldest">Extremely bold</b>')
tag = soup.b
type(tag)
```

このコードでは`soup.b`という記述により[Bタグ](http://www.htmq.com/html/b.shtml)を読み取っているようだ。

同様に教えていただいたコードの`elem.a`ではAタグを読取るということのようだ。find_all()でAタグが見つからない場合、Noneになる。
読取り対象の`/data`の一部は以下のようになっている。
TDタグ内の要素にAタグが見つかった場合、そのテキストのうちhtml.mdで終わるものをprintする、という処理のようだ。

```html
...
<td class="content">
            <span class="css-truncate css-truncate-target"><a href="/yasokada/TechEnglish_170903/blob/master/data/10.html.md" class="js-navigation-open" id="4c209532a5ed8fa078d0b0e1528eb501-49445b32d8a945e33b1e546d14758149333ea7b6" title="10.html.md">10.html.md</a></span>
          </td>
```

(追記 2018/01/31)
https://www.crummy.com/software/BeautifulSoup/bs4/doc/
の以下の行以降に例があった。
> Here are some simple ways to navigate that data structure:

```html
soup.title
# <title>The Dormouse's story</title>

soup.title.name
# u'title'

soup.title.string
# u'The Dormouse's story'

soup.title.parent.name
# u'head'

soup.p
# <p class="title"><b>The Dormouse's story</b></p>

soup.p['class']
# u'title'

soup.a
# <a class="sister" href="http://example.com/elsie" id="link1">Elsie</a>

soup.find_all('a')
# [<a class="sister" href="http://example.com/elsie" id="link1">Elsie</a>,
#  <a class="sister" href="http://example.com/lacie" id="link2">Lacie</a>,
#  <a class="sister" href="http://example.com/tillie" id="link3">Tillie</a>]

soup.find(id="link3")
# <a class="sister" href="http://example.com/tillie" id="link3">Tillie</a>
```
FireFoxでちらつき(FOUC)が起こる 

## 要約
 - 原因: bodyでcss読み込みを行ったため
 - 対策: 色々あるが今回はheadにcssを移動して解決

## 背景
UIを今風に実装したかった。

 - UIのパーツ毎にテンプレートファイル(html)を分ける
 - 同じ粒度でCSSファイルを分ける
 - 各テンプレートファイルにlinkタグを埋め込む
 - 結果としてbodyでCSSが五月雨式に読み込まれる
 - これぞHTTP/2の為せる業

↓こういうのがたくさんあるイメージ

```html:parts1.html
<link rel=stylesheet href="parts1.css"> /* パーツ毎にcss読み込み */
<div class="parts1">
...
</div>
```

メリット

 - 必要最小限のcssを読み込める
 - linkタグの管理が楽

## 症状と原因

bodyでcssを読み込むような実装をしてみたところ、FireFoxでちらつきが発生。

原因は、CSSが当たる前のDOMや画像が一瞬表示されていたため。

これはFOUC(Flash of Unstyled Content)と呼ばれている。

FireFoxは他のブラウザと異なり、bodyに挿入されたlinkタグを非同期で読み込む仕様らしい。

## 対策

幾つかの方法がある

### (a) おまじない

以下のように空のscriptタグを読み込ませることでブロッキングできる。

```html:parts1.html
<link rel=stylesheet href="parts1.css">
<script> </script>/* おまじない */
<div class="hoge">
...
</div>
```

### (b) JS頼み

スタイルシートの読み込みが完了するまで要素を隠す処理をJSで書く。

全てをJSで解決する今風なやり方。

### (c) bodyで読み込むのは諦める

headでcssを読み込んだ場合は同期的に読み込まれるので、ちらつきは起こらない。

JSを殆ど使用しないアプリを使っていたため、JSを書きたくなかった。今回はこの方法を取った。

## 参考文献

The future of loading CSS
https://jakearchibald.com/2016/link-in-body/

Bodyに&lt;link rel=stylesheet>を入れてCSSをロードする未来
https://qiita.com/memolog/items/846a0bec2515cdcd721b
【Python】--versionの出力先が2系と3系で違う問題

Pythonの `python --version` をたたいた際に、2系と3系で出力先が違う。
そのためシェルでパイプしようとしたときに出力結果をうまく流せず困った。

### 確認

まずは、2系と3系の出力先を調べてみる。

#### Python2系の場合

```shell
# Pythonのバージョンを確認
$ python --version
Python 2.7.14

# 標準出力を除外 ➠ 出力あり
$ python --version 1>/dev/null
Python 2.7.14

# 標準エラー出力を除外 ➠ 出力なし
$ python --version 2>/dev/null
```

#### Python3系の場合

```shell
# Pythonのバージョンを確認
$ python --version
Python 3.6.4

# 標準出力を除外 ➠ 出力なし
$ python --version 1>/dev/null

# 標準エラー出力を除外 ➠ 出力あり
$ python --version 2>/dev/null
Python 3.6.4
```

### 結果

#### Python2系は、**標準エラー出力**
#### Python3系は、**標準出力**
とそれぞれ出力されている。

つまり出力をsedとかにパイプしたい場合は、
`python --version 2>&1 | sed` のように標準出力へまとめてあげれば、
2系と3系のどちらも対応ができそう。
よく使うコマンド集

# 通常コマンド
## cd パス
その場所に移動（絶対パス、相対パス）
パス：絶対パス 相対パス ../ ホームディレクトリ（起点）
## touch ファイル名
空ファイルを作成
## cat ファイル
ファイルの内容を確認
## ls
今の場所のフォルダを確認
## ls -a
隠しファイルも確認
## 途中まで入力して + tab
サジェスト
## mkdir フォルダ名
フォルダを作成
## pwd
カレントディレクトリ（作業中のディレクトリ）を確認
## grep
find ./ -type f -print | xargs grep -l '検索したいワード'


# gitコマンド
## 資料
https://qiita.com/2m1tsu3/items/6d49374230afab251337
http://commte.net/blog/archives/5251
https://qiita.com/fukumone/items/73e1a9a62c5e4454263b
https://qiita.com/suzukihi724/items/3fcfb891f5768293404c
http://tech.pjin.jp/blog/2015/11/24/git-command-matome-list-100/
https://qiita.com/mountcedar/items/682743c95fd3b8fc274b
https://qiita.com/2m1tsu3/items/6d49374230afab251337

## git resetでHEADの位置を間違えて変えてしまったとき
https://qiita.com/tbaba/items/af563deac65d1b12de49

## 過去バージョンに戻す
http://d.hatena.ne.jp/murank/20110327/1301224770

https://qiita.com/samurairunner/items/7812749493554208aeae
https://qiita.com/UmedaTakefumi/items/af2e38068616d982f489
http://www.anvariation.com/git-get-previous-file/
http://jsstudy.hatenablog.com/entry/Checkout-with-Git


## git config --global user.email "abc@gmail.com"
## git config --global user.name "my name"
初期設定

## git clone <URL>
cdで移動してからクローン

## git log l- 10
ログを表示する

## q
ログの表示などから抜ける

## :wq
マージバック後に何もコミットしない

## git checkout
`git checkout [ブランチ名]`
ブランチ作成（あれば移動）

`git checkout -b ブランチ名`
ブランチ作成して切り替える

## git add .
indexに上げる

## git add -A
全ての変更ファイルをindexに上げる

## git diff
変更ファイルのdiff

## git commit
### git commit -m "コミットメッセージ"
変更内容をコミット

### git commit -m "コメント1行目" -m "コメント2行目" -m "コメント3行目…"
複数行コミット

### git commit --amend -m "書き換えたいコミット"
直前のコミットの書き換え

## ローカル 
### git branch
ローカルブランチを表示

### git branch --delete ローカルブランチ
ローカルブランチを削除

## リモート
### git branch -r
リモートブランチを表示

### git remote -v
リモートリポジトリを確認

### git checkout -b ローカルブランチ origin/リモートブランチ
リモートブランチからローカルブランチを作成する

### git push --delete origin リモートブランチ（git push origin :リモートブランチ）
リモートブランチを削除

## git branch -a（git branch --all）
全てのブランチを確認

## git status
現在のブランチの状態

## git merge
### git merge マージしたいブランチ
マージ先のブランチ（masterやreleaseブランチ）に移動してコマンド
必ずコミットが済んでいる状態にマージする

### git merge --no-ff マージしたいブランチ
fast-forwardの関係であっても、必ずマージコミットを作る
http://d.hatena.ne.jp/sinsoku/20111025/1319497900

## git fetch
フェッチ

## git tag タグ名
現在のブランチの直前のコミットに対してtagを作成

## git pull origin ブランチ
プル

## git push origin ブランチ
プッシュ

## git reflog
headの遷移logを確認

## git reset HEAD@{x} --hard
戻りたいHEADの位置に戻る


# svnコマンド
## 資料
https://qiita.com/konweb/items/6effd36aab551b2d6b8f

## おすすめ
svnはトータスSVNがわかりやすい
win環境が使用できない場合はコマンド

## svn st
ステータス表示

## svn log -l 10
ログ

## svn ci -m 'コミットメッセージ' && svn up
コミット

## svn up
SVN更新

## ブランチ作成

## マージ

## マージのテスト
Linq の Aggregate メソッドのオーバーロードごとの挙動まとめ

#はじめに

System.Linq.Enumerable クラスの [Aggregate](https://msdn.microsoft.com/ja-jp/library/system.linq.enumerable.aggregate.aspx) メソッドで、どの呼び出し型を使用したらよいか迷ったとき、つぎの表で解決できると幸いです。Linq を便利に使いたい！
#挙動
| 呼び出し型 | 列挙元の要素の型 | 初期値の型 | 処理Funcで列挙される型 | 結果の型 |
|:--|:--|:--|:--|:--|
| [Enumerable.Aggregate<br>&lt;TSource&gt;](https://msdn.microsoft.com/ja-jp/library/bb548651.aspx) | TSource | TSource<br>列挙元の先頭要素 | TSource<br>列挙元の要素の2つ目から | TSource |
| [Enumerable.Aggregate<br>&lt;TSource, TAccumulate&gt;](https://msdn.microsoft.com/ja-jp/library/bb549218.aspx) | TSource | TAccumulate | TSource<br>列挙元すべて | TAccumulate |
| [Enumerable.Aggregate<br>&lt;TSource, TAccumulate, TResult&gt;](https://msdn.microsoft.com/ja-jp/library/bb548744.aspx) | TSource | TAccumulate | TSource<br>列挙元すべて | TResult |

##引数指定
■ 処理Func (func) :
 Func &lt; 処理前の蓄積（最初は初期値）(TAccumulateかTSource), 列挙された要素(TSource), 処理結果とする蓄積(TAccumulateかTSource) &gt;

```C#:ラムダ式
(処理前の蓄積, 列挙されてきた列挙元の要素) => { return 処理結果とする蓄積; }
```

■ 結果変換処理Func (resultSelector) :
 Func &lt; 蓄積(TAccumulate), 結果(TResult) &gt;

```C#:ラムダ式
(蓄積) => { return 結果; }
```


#どの呼び出し型にするか悩む原因？の考察
基本的には「初期値 -> 列挙元全要素を要素ごとに処理 -> 結果」となる処理ですが、Enumerable.Aggregate&lt;TSource&gt; だけは、列挙元の要素のうち最初のひとつが初期値とされ、2個目の要素から処理Funcが呼び出される（要素がひとつだけなら、そのひとつの要素がそのままが返される）点で他と異なることが、（私にとっては）理解しづらかった原因かも。。
DatadogからみたCPU脆弱性パッチのパフォーマンス影響

SaaS型運用監視サービスを提供するDatadog社のブログで
監視サービス事業者からみた、CPU脆弱性パッチの影響についての調査結果が報告されています。
Datadogが監視している数百万コアのデータに基づいた大規模な分析により、パッチの広範な影響を確認することができます。

**The Meltdown/Spectre saga: The impact across millions of cores**
https://www.datadoghq.com/blog/meltdown-spectre-cpu/

読み間違え等あるかもしれないので正確な内容は原文を参照いただければと思いますが、以下抜粋して記載します。

* パッチの影響は system.cpu.system(CPUがカーネル空間で費やす時間の割合) メトリックで最も顕著だった
    * プログラムがシステムコールを行う度に、Kernel page-table isolation によってオーバーヘッドが発生するため 
* 1月3日以降、監視対象ホストのsystem.cpu.systemの平均値は大きく上回って増加した
    * 9日後、メトリックの値は通常の値に戻った
    * 恐らく初期パッチのパフォーマンス問題に対処するためのアップデートがリリースされたため
* 平均的な影響は比較的小さい(CPU使用率への影響は1%未満)が、非常に多くのコアで影響がはっきりと観測されている
    * カーネル空間でより普段から多くの時間を費やしているCPUは4%～5%の影響がある 
* クラウドのインスタンスタイプ別に見た場合、system.cpu.systemのスパイクはコンピューティング最適化および汎用インスタンスで最も顕著
    * メモリ最適化インスタンスでも、これらほどでないにしろ、影響ははっきりと検出されている
ローカルからリモートのDockerホストにdockerコマンドを投げる

# 目的

リモートにあるDockerホストに対してローカルのDockerクライアントからアクセスする。

イメージ的には、

```
------------------------------                                --------------
|ローカル端末(dockerクライアント)| ------($docker hogehoge)------>| Dockerホスト|
------------------------------                                --------------
```

とする。

# 前提

- Ubuntu 16.04
- Docker 17.09.0-ce
- DockerホストのIPアドレスは`192.168.56.102`

# 手順


## docker.serviceファイルの修正
あまりお行儀がよくないけれども、直接 docker.serviceを修正する。

```
# vim /lib/systemd/system/docker.service
```

### 修正ポイント
```text:修正前
ExecStart=/usr/bin/dockerd -H fd://
```

```text:修正後
ExecStart=/usr/bin/dockerd -H tcp://0.0.0.0:2376 -H fd://
```

## dockerdの再起動

dockerデーモンの再起動を行う。

```
# systemctl daemon-reload
# systemctl stop docker
# systemctl start docker
```

## 動作確認

先ほど設定した`0.0.0.0:2376`でListenしてくれているかを`netstat`を使って確認する。


```bash:netstatによる確認
# netstat -ntap | grep :2376
tcp6       0      0 :::2376                 :::*                    LISTEN      4315/dockerd
```

ローカルのマシンからコマンドを投げてみる。
`-H tcp://IPアドレス:ポート番号`でリモートのソケットに接続できる。

```bash:動作確認
$ docker -H tcp://192.168.56.102:2376 info
Containers: 0
 Running: 0
 Paused: 0
 Stopped: 0
Images: 2
Server Version: 17.09.0-ce
Storage Driver: aufs
 Root Dir: /var/lib/docker/aufs
 Backing Filesystem: extfs
 Dirs: 2
 Dirperm1 Supported: true
~~~~略~~~~
```

どうやら動いているようだ。
以下のようにすることでdocker-composeもリモートサーバにお願いできる
```bash:リモートでdocker-compose
$ docker-compose -H tcp://192.168.56.102 up -d
```
Alibaba Cloud で CloudMonitorAgentをインストールしてみる

#AgentのInstall
ECSを作成した後、インスタンスにログインしましょう。コンソールにはVNCが用意されていますがSSHログインでもどちらでも構いません。
ターミナルに入ったら以下の呪文を実行します。

```
sudo bash -c "wget -e 'http_proxy=jpcmsproxy.aliyun.com:8080' -O /tmp/cloudmonitor.tar.gz 'http://cms-download.aliyun.com/release/1.2.17/linux64/agent-linux64-1.2.17-package.tar.gz' && \
mkdir /usr/local/cloudmonitor && \
tar -xf  /tmp/cloudmonitor.tar.gz -C /usr/local/cloudmonitor && \
/usr/local/cloudmonitor/wrapper/bin/cloudmonitor.sh install && \
/usr/local/cloudmonitor/wrapper/bin/cloudmonitor.sh start"
```

あとは実行を見守りましょう。

```
--2018-01-30 17:42:39--  http://cms-download.aliyun.com/release/1.2.17/linux64/agent-linux64-1.2.17-package.tar.gz
jpcmsproxy.aliyun.com (jpcmsproxy.aliyun.com) をDNSに問いあわせています... 100.100.80.184
jpcmsproxy.aliyun.com (jpcmsproxy.aliyun.com)|100.100.80.184|:8080 に接続しています... 接続しました。
Proxy による接続要求を送信しました、応答を待っています... 200 OK
長さ: 116843938 (111M) [application/octet-stream]
`/tmp/cloudmonitor.tar.gz' に保存中

100%[====================================================================================================================>] 116,843,938 8.42MB/s 時間 18s

2018-01-30 17:42:59 (6.15 MB/s) - `/tmp/cloudmonitor.tar.gz' へ保存完了 [116843938/116843938]

Detected RHEL or Fedora:
Installing the cloudmonitor daemon..
Starting cloudmonitor...
Waiting for cloudmonitor....
running: PID:10739
```


完了したらステータスを確認してみます。

```
sudo /usr/local/cloudmonitor/wrapper/bin/cloudmonitor.sh status
cloudmonitor is running: PID:10748, Wrapper:STARTED, Java:STARTED <実行結果
```

ちゃんと実行されているようです。
Google Homeとの連携で利用するFirebase Databaseのセキュリティ設定

# はじめに

半額セール！？この機会を逃す手はない！と購入を決めたGoogle Home Mini。

[Google Home、IFTTT、Firebase、Node.js、irMagicianを使ってシーリングライトを音声操作する](https://qiita.com/miso_develop/items/c2008235cb4a8567cfa9)
の記事を参考に、Google Home→IFTTT→Firebaseを経由して、Realtime Databaseの更新イベントをフックしているラズパイから、家電操作などができるようになりました（ありがとうございます）。

その際、誰もがFirebaseのDatabaseに書き込める状態というのに一抹の不安を感じたので、Databaseのセキュリティ設定について、少しあがいてみることにしました。

# Firebaseの設定

## データ

FirebaseのDatabaseは、[参照先の記事](https://qiita.com/miso_develop/items/c2008235cb4a8567cfa9#firebase%E3%81%AE%E8%A8%AD%E5%AE%9A) 同様、以下のように作成しています。

```
プロジェクト名-xxxxx
 └ googlehome
 　 └ word: ""
```

第三者にwordの値を更新されてしまうと困るので、この書き込みを制限することが目標です。

しかし、[参照先の実装](https://qiita.com/miso_develop/items/c2008235cb4a8567cfa9#indexjs%E3%81%AE%E5%AE%9F%E8%A3%85) のように、Realtime Databaseの更新イベントのフック処理を

```js
var firebase = require("firebase");

var config = {
//省略
};
firebase.initializeApp(config);

const path = "/googlehome";
const key = "word";
const db = firebase.database();
db.ref(path).on("value", function(changedSnapshot) {
  const value = changedSnapshot.child(key).val();
  if (value) {
    //省略（wordの値に応じた家電操作など）

    db.ref(path).set({[key]: ""}); //wordの値をクリア
  }
});
```

とする場合、googlehome以下に対して書き込み権限が必要となるようで、さて、どうしようかなと...。

## ルール

そこで、以下のようにルールを設定しました。

```js
{
  "rules": {
    ".read": false,
    ".write": false,

    "googlehome": {
      ".read": true,
      ".write": true,
      "word": {
        ".validate": "(auth != null || newData.val() === '')"
      }
    }
  }
}
```

こうすることで、wordの値に文字列を設定するには認証が必要となります。また、googlehome以下に書き込み権限があるので、上記フック処理もそのままの実装で動作します。（ルール内で、誰でも空文字を設定できるようにしているのは、フック処理内でwordの値をクリア可能とするためです）

# Firebaseの認証

残りはIFTTT→Firebaseの連携で認証を追加すれば終わりです。簡単に対応するため...、まずは [GoogleHomeとiftttとDialogflowとfirebaseとLINEBOTとラズパイを使って子供と音声によるLINE交換をしてみる（後編）](https://qiita.com/nk-tamago/items/31ee5b70c6003fb97ee4) 内の [FirebaseのRESTによる認証](https://qiita.com/nk-tamago/items/31ee5b70c6003fb97ee4#firebase%E3%81%AErest%E3%81%AB%E3%82%88%E3%82%8B%E8%AA%8D%E8%A8%BC) を参考に、データベースのシークレットを利用して認証することにしました。

## Webhooksレシピ

IFTTTのWebリクエストのURLの最後で、auth=に続けてデータベースのシークレットを指定します。

![auth.png](https://qiita-image-store.s3.amazonaws.com/0/60193/4fb3f185-c27a-6531-ed68-ffb06201ae1c.png)

# おわりに

やらないよりはマシ程度の内容かなとは思いますが、多少は不安を払拭できたとも思っています。ちょっとした修正で対応できますし...。

Firebaseの認証で利用したデータベースのシークレットは、すでに非推奨の方法ですので、時間が出来たらOAuth2も試してみようと思います。