OmniAICreator/Qiita-1.07M huggingface dataset:
PyCallを使ってscikit-learnコードを動かしてみた。

追記

この記事よりも[PyCall.jlでPyTorch使ってDeep Learningする](https://qiita.com/yatra9/items/0a1a9a5ba19e9efe08c0)のほうが内容が豊富です。
追記終わり。

----

JuliaからPythonを呼ぶにはPyCallを使えばいいらしいので、Scikit-learnのサンプルコードを試しに移植してみました。いくつか修正は必要ですが、ほとんどそのまま動く印象です。

ここでは、移植に際して必要な変更点を最初に列挙します。そのあとにコード全文を載せました。

オリジナルのサンプルコードはアヤメデータの可視化です。

http://scikit-learn.org/stable/auto_examples/datasets/plot_iris_dataset.html

# モジュール呼び出しの変更(Python -> Julia)

## 1. matplotlib(Python)はPyPlot(Julia)から呼び出す.

変更前(Python)

```Python
import matplotlib.pyplot as plt
from mpl_toolkits.mplot3d import Axes3D
```

変更後(Julia)

```Julia
using PyPlot
```

注）`plt.`は必要なくなります。

## 2. Pythonモジュールの読み込みにPyCallを使う

変更前(Python)

```Python
from sklearn import datasets
from sklearn.decomposition import PCA
```

変更後(Julia)

```
using PyCall
@pyimport sklearn.datasets as datasets
@pyimport sklearn.decomposition as decomposition
```

## その他の変更箇所
### Python -> Julia
* インデックス
    * Python:0-base
    * Julia:1-base
* 最初の２つの要素のスライス
    * Python:`array[:2]` <= 右端を含まない
    * Julia:`array[1:2]`<= 右端を含む

### NumPy -> Julia
* `ndarray`はJulia nativeの`Array`に変換される。
* １次元配列からの最大値の取得
    * Python:`array.max()`
    * Julia:`maximum(array)`

### PyCall
https://github.com/JuliaPy/PyCall.jl

* `@pyimport`でインポート出来るのはモジュールのみ
    * Pythonのクラス、関数、変数の直接の読み込みは出来ない
    * `from xxx import yyy`の構文は使えない（たぶん）
* Pythonオブジェクト`o`のメソッド/アトリビュートへのアクセスにはJuliaのsymbolを使う。
    * Python : `o.attribute`
    * Julia : `o[:attribute]`


# コード全文
```Julia
# Code source: Gaël Varoquaux
# Modified for documentation by Jaques Grobler
# License: BSD 3 clause

using PyCall
using PyPlot
@pyimport sklearn.datasets as datasets
@pyimport sklearn.decomposition as decomposition

# import some data to play with
iris = datasets.load_iris()
X = iris["data"][:, 1:2]  # we only take the first two features.
y = iris["target"]

x_min, x_max = minimum(X[:, 1]) - .5, maximum(X[:, 1]) + .5
y_min, y_max = minimum(X[:, 2]) - .5, maximum(X[:, 2]) + .5

figure(2, figsize=(8, 6))
clf()

# Plot the training points
scatter(X[:, 1], X[:, 2], c=y, cmap=PyPlot.cm[:Set1],
            edgecolor="k")
xlabel("Sepal length")
ylabel("Sepal width")

xlim(x_min, x_max)
ylim(y_min, y_max)
xticks(())
yticks(())

# To getter a better understanding of interaction of the dimensions
# plot the first three PCA dimensions
fig = figure(1, figsize=(8, 6))
ax = Axes3D(fig, elev=-150, azim=110)
X_reduced = decomposition.PCA(n_components=3)[:fit_transform](iris["data"])
ax[:scatter](X_reduced[:, 1], X_reduced[:, 2], X_reduced[:, 3], c=y,
           cmap=PyPlot.cm[:Set1], edgecolor="k", s=40)

ax[:set_title]("First three PCA directions")
ax[:set_xlabel]("1st eigenvector")
ax[:w_xaxis][:set_ticklabels]([])

ax[:set_ylabel]("2nd eigenvector")
ax[:w_yaxis][:set_ticklabels]([])
ax[:set_zlabel]("3rd eigenvector")
ax[:w_zaxis][:set_ticklabels]([])

```
【Flutter】Androidアプリのリリースビルドをしてみる

FlutterでAndroidアプリのリリースビルドをしてみたのでメモです。
詳細 & 最新情報は [Preparing an Android App for Release - Flutter](https://flutter.io/android-release/) を参照してください。

## 環境
- Flutter 0.1.5
- Dart 2.0.0-dev.28.0

## 手順

### 1. keystore作成
いつも通りに作ります。
（参考） [Sign Your App | Android Studio](https://developer.android.com/studio/publish/app-signing.html)

### 2. key.properties作成

```java:android/key.properties
storePassword=<password from previous step>
keyPassword=<password from previous step>
keyAlias=key
storeFile=<location of the key store file, e.g. /Users/<user name>/key.jks>
```

### 3. build.gradle編集

まず `android` の上にkeystoreの設定を追記します。

```diff:android/app/build.gradle
+def keystorePropertiesFile = rootProject.file("key.properties")
+def keystoreProperties = new Properties()
+keystoreProperties.load(new FileInputStream(keystorePropertiesFile))

android {
```

次に `buildTypes` をこのように書き換えます。

```diff:build.gradle
-buildTypes {
-    release {
-        // TODO: Add your own signing config for the release build.
-        // Signing with the debug keys for now, so `flutter run --release` works.
-        signingConfig signingConfigs.debug
-    }
-}
+signingConfigs {
+    release {
+        keyAlias keystoreProperties['keyAlias']
+        keyPassword keystoreProperties['keyPassword']
+        storeFile file(keystoreProperties['storeFile'])
+        storePassword keystoreProperties['storePassword']
+    }
+}
+buildTypes {
+    release {
+        signingConfig signingConfigs.release
+    }
+}
```

### 4. APKをビルド

Flutterプロジェクトのルートディレクトリに移動後、以下のコマンドを実行します。
普段開発しているときは画像未使用の簡素なアプリなのにapkサイズが30MBくらいあるのですが、リリースビルドでは9.2MBになっていました。

```
$ flutter build apk
Initializing gradle...                                1.0s
Resolving dependencies...                             8.1s
Running 'gradlew assembleRelease'...
Skipping AOT snapshot build. Fingerprint match.
Built build/app/outputs/apk/release/app-release.apk (9.2MB).
```

ちなみにインストールするときはflutterコマンドを使います。（adbでもインストールできます）

```
$ flutter install
```

Macを使っている場合はこれで生成したapkのディレクトリをFinderでシュッと開けます。

```
$ open build/app/outputs/apk/release/
```

## ハマったこと

dart2を使っている場合はビルドするときに `--preview-dart-2` オプションをつけないと起動直後に例の真っ赤な心温まる画面（エラー画面）が出ます。

```
$ flutter build apk --preview-dart-2
Initializing gradle...                                0.7s
Resolving dependencies...                             0.8s
Running 'gradlew assembleRelease'...                 16.6s
Built build/app/outputs/apk/release/app-release.apk (9.5MB).
```

このことがドキュメントに書いてなかったのでPR出してみました。
https://github.com/flutter/website/pull/907

## 補足
Flutterで作ったアプリということを忘れていつも通りにGenerate Signed APKやろうとしたら出来なくて調べてたらFlutterで作ってたことを思い出して公式ドキュメントにたどり着きました。
必要最低限の部分だけメモしているので詳細 & 最新情報は [Preparing an Android App for Release - Flutter](https://flutter.io/android-release/) を参照してください。（大事なことなので2回）
上記公式ドキュメントの変更履歴は [History for android-release-build.md - flutter/website](https://github.com/flutter/website/commits/master/android-release-build.md) で確認できます。

## リンク
Preparing an Android App for Release - Flutter
https://flutter.io/android-release/
Moodle Formのeditor上でファイルをアップロードして保存する方法

# editorのハマりポイント

mformのeditor上でD&D等で画像をアップロードする場合、何も設定せずにmformを定義すると画像アップロードが出来ない。

# 今回やりたいこと

<img width="883.5" alt="2018-03-25_0142.png (41.6 kB)" src="https://img.esa.io/uploads/production/attachments/8158/2018/03/25/4181/4cb37f1a-5884-402a-87a7-542f1ae917af.png">

# 対応方法の概要

editor上でアップロードされた画像をMoodle File API経由でファイルを保存(draftからの昇格)し、pluginfile.phpのURL(draftfile.phpから呼び出さないようにする)に書き換える。

このため、formクラスをコールした後にファイルを受け取りFile APIに投げ込む処理を追加する。

# 対応

## form定義(edit_hoge_form.php)

``` php:edit_hoge_form.php

public function get_options() {
        return [
            'trusttext' => true,
            'context' => $this->_customdata["context"]
        ];
}

public function definition() {
    $mform = $this->_form;

    // 途中省略

    $mform->addElement('editor', 'intro_editor', '問題文', ['rows' => 5], $this->get_options());
    $mform->setType('intro_editor', PARAM_RAW);
}
```

この段階で、editorに画像アップロード自体出来るようになるが、draft扱いで保存されており正式にFile APIで保存されていない。このため、File APIを使ってきちんと保存させる必要がある。

## 書き込み処理の追加

まず、書き込み対象のDBレコードを取得する。

``` php
$data = $DB->get_record('hoge', ['id' => 1]);
```

次に、Prepare処理を行う。先程取得した`$data`を`file_prepare_standard_editor`関数の第一引数にする。

``` php:edit.php
$mform = new edit_hoge_form();

$mform->set_data(
    file_prepare_standard_editor(
        $data,
        'intro',
        $mform->get_options(),
        $context,
        'mod_hoge',
        'fileareaname'
    )
);

if ($mform->is_cancelled()) {
    redirect(new \moodle_url('view.php', ['id' => $cm->id]), "キャンセルしました。", 3);
} else if ($data = $mform->get_data()) {
    $data_intro = file_postupdate_standard_editor(
        $data,
        'intro',
        $mform->get_options(),
        $context,
        'mod_hoge', // コンポーネント(プラグイン名)
        'fileareaname', // filearea(任意の値)
        $itemid // itemid(任意の値)
    );
```

この段階で、指定したファイルエリアとitemidでファイルが保存される。pluginfile.phpでのURLに置換済みの物は

``` php
    $question->intro = $data_intro->intro;
```

で取得出来る。この値をDBレコードに保存するなどする。

# 結果

editorでアップロードした画像をFile APIで保存し、表示出来るようになった。

<img width="518.25" alt="2018-03-25_0207.png (31.1 kB)" src="https://img.esa.io/uploads/production/attachments/8158/2018/03/25/4181/b81f2936-f85b-47ae-ac06-5d083351c400.png">
kerasでcos類似度レイヤーを作る


## 環境
- keras (2.1.4)
- tensorflow-gpu (1.3.0)

## cosレイヤー作る

実際に書くのは 1-cos(x) のタイプ
ここでは10次元のベクトル2つのcos類似度?を求めます

Sequentialじゃなくてfunctional APIでモデル構築

```python
from keras.models import Model
from keras.layers import Input, Dot, Reshape, Lambda
import keras.backend as K

import numpy as np

input_dim = 10
input_a = Input(shape=(input_dim, 1))
input_b = Input(shape=(input_dim, 1))

# --------------------------------------------------------------
# ここで 2入力のcos類似度レイヤーを定義しています
# --------------------------------------------------------------
cos_distance = Dot(axes = 1, normalize=True)([input_a, input_b]) # ここで cos(x)
cos_distance = Reshape((1,))(cos_distance)
cos_similarity = Lambda(lambda x: 1-x)(cos_distance) # ここで 1-cos(x) （こっちのほうが使いやすい的な）


model = Model(inputs=[input_a, input_b], outputs=[cos_similarity])

v1 = np.random.uniform(-1,1,10).reshape(1, 10, 1)
v2 = np.random.uniform(-1,1,10).reshape(1, 10, 1)

[[y]] = model.predict([v1, v2])
print("model: ", y)

def cos_sim(v1, v2):
    return 1-(np.dot(v1, v2) / (np.linalg.norm(v1) * np.linalg.norm(v2)))

cs = cos_sim(v1[0].reshape(10), v2[0].reshape(10))
print("numpy: ", cs)
```

出力はこんな感じ

```
model:  0.6803855
numpy:  0.6803854938830672
```

正しくcos類似度を求めるレイヤーが作れましたっ


## 蛇足

参考にしたissueにある、mergeを使った書き方（古い）（需要ない）

```python
from keras.models import Model
from keras.layers import Input, merge, Reshape, Lambda
import keras.backend as K

~~
~~

cos_distance = merge([input_a, input_b], mode='cos', dot_axes=1) # ここで cos(x)
cos_distance = Reshape((1,))(cos_distance)
cos_similarity = Lambda(lambda x: 1-x)(cos_distance) # ここで 1-cos(x) （こっちのほうが使いやすい的な）

~~
~~
```

> UserWarning: The `merge` function is deprecated and will be removed after 08/2017. Use instead layers from `keras.layers.merge`, e.g. `add`, `concatenate`, etc.

はい。

## 追記

`Input(shape=(input_dim, 1))` じゃなくて `Input(shape=(input_dim,))` もおっけい(当たり前っちゃ当たり前かも)

```python
from keras.models import Model
from keras.layers import Input, Dot, Reshape, Lambda
import keras.backend as K

import numpy as np

input_dim = 10
input_a = Input(shape=(input_dim,))
input_b = Input(shape=(input_dim,))

# --------------------------------------------------------------
# ここで 2入力のcos類似度レイヤーを定義しています
# --------------------------------------------------------------
cos_distance = Dot(axes = 1, normalize=True)([input_a, input_b])
cos_distance = Reshape((1,))(cos_distance)
cos_similarity = Lambda(lambda x: 1-x)(cos_distance)


model = Model(inputs=[input_a, input_b], outputs=[cos_similarity])

v1 = np.random.uniform(-1,1,10).reshape(1, 10)
v2 = np.random.uniform(-1,1,10).reshape(1, 10)

[[y]] = model.predict([v1, v2])
print("model: ", y)

def cos_sim(v1, v2):
    return 1-(np.dot(v1, v2) / (np.linalg.norm(v1) * np.linalg.norm(v2)))

cs = cos_sim(v1[0].reshape(10), v2[0].reshape(10))
print("numpy: ", cs)

```

## 参考
https://github.com/keras-team/keras/issues/2672

## いじょうっ！

最後まで読んでくださってありがとうございますっ
（よかったらいいねくださいっ！励みになります！！！！！）

twitter: https://twitter.com/namahoge
.htpasswdファイルを作成する

すごく簡単に.htpasswdファイルが生成できて感動。

```
htpasswd -c .htpasswd ユーザ名
```

`-c`は`create a new file`の略。新しくファイルを生成する。後は設定するパスワードの入力が求められて入力するだけ。

もしくは、

```
htpasswd -c -b .htpasswd ユーザ名 パスワード
```

とすれば、対話形式のパスワード入力が省かれる。
SSH接続のコマンドを省略


サーバにSSH接続する時に毎回下記のコマンドを打つのが面倒くさい。

```
$ ssh -i id_rsa sampleuser@xxx.xxx.xxx.xxx
```

`~/.ssh/config`ファイルに設定を書く。

```
Host hoge
  User sampleuser
  Port 22
  HostName xxx.xxx.xxx.xxx
  IdentityFile ~/.ssh/id_rsa
```

これでシンプルなコマンドで接続できるようになる。

```
$ ssh hoge
```
【Flutter】iOSとAndroidのアプリアイコンを一括生成する

Flutterアプリを作るときに、用意したアプリアイコンをiOS用とAndroid用のアプリアイコンとして一括生成（変換）する方法です。

## 結論
コマンドラインツールの `flutter_launcher_icons` を使う。

## 環境
- Flutter 0.1.5
- Dart 2.0.0-dev.28.0
- flutter_launcher_icons 0.2.0

## 手順

### 1. flutter_launcher_icons Plugin追加

pubspec.yaml に `flutter_launcher_icons` を追加する。

```yaml:pubspec.yaml
dev_dependencies: 
  flutter_test:
    sdk: flutter
    
  flutter_launcher_icons: "^0.2.0"
  
flutter_icons:
  image_path: "icon/icon.png" 
  android: true
  ios: true
```

### 2. アイコン準備

前述の `image_path` で指定したパスに用意したアイコンを置く。
今回の例だと、`icon/icon.png`

### 3. 一括生成実行

ターミナルで下記を実行する。

```
$ flutter pub get
$ flutter pub pub run flutter_launcher_icons:main
```

## 変更ファイル一覧

一括生成コマンド実行後に変更されたファイル一覧です。

```
+1 -1 M android/app/src/main/AndroidManifest.xml
+0 -0 M android/app/src/main/res/mipmap-hdpi/ic_launcher.png
+0 -0 M android/app/src/main/res/mipmap-mdpi/ic_launcher.png
+0 -0 M android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
+0 -0 M android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
+0 -0 M android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
+0 -0 A icon/ic_launcher.png
+71 -0 A ios/Podfile
+1 -1 M ios/Runner.xcodeproj/project.pbxproj
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-20x20@1x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-20x20@2x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-20x20@3x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-29x29@1x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-29x29@2x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-29x29@3x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-40x40@1x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-40x40@2x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-40x40@3x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-60x60@1x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-60x60@2x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-60x60@3x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-76x76@1x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-76x76@2x.png
+0 -0 A ios/Runner/Assets.xcassets/AppIcon.appiconset/AppIcon-83.5x83.5@2x.png
+56 -0 M pubspec.lock
+5 -0 M pubspec.yaml
```

## リンク
flutter_launcher_icons | Dart Package
https://pub.dartlang.org/packages/flutter_launcher_icons

How to change the application launcher icon on Flutter? - Stack Overflow
https://stackoverflow.com/questions/43928702/how-to-change-the-application-launcher-icon-on-flutter
mallocを作ったよ


sbrkでシンプルなmallocを実装しているのはネット上でいくつか見つけたんだけど、sbrkとmmapと両方使っている実装はそれなりに手の込んだものばかりな気がしたので、両方使う単純なmallocを作ってみた。

できたものは[<こちら>]( https://github.com/s0sasaki/MemoryAllocator)に置きました。

僕のようにC言語学ぶためにmalloc自作する人は他にもいると思うので、メモも兼ねて参考になった資料を紹介しておきます：

[メモリー管理の内側](https://www.ibm.com/developerworks/jp/linux/library/l-memory/index.html)

 - とても単純なmalloc、freeの実装。
 - sbrkのみ利用。
 - データブロックのヘッダはリスト構造ではない。

[Write a simple memory allocator](https://arjunsreedharan.org/post/148675821737/write-a-simple-memory-allocator)

 - 単純なmalloc、free、realloc、callocの実装。
 - sbrkのみ利用。
 - データブロックのヘッダはリスト構造。
 - スレッドセーフ。
 - 英語。

[malloc(3)のメモリ管理構造](http://www.valinux.co.jp/technologylibrary/document/linux/malloc0001/)

 - glibcのmallocの実装の紹介。
 - 詳しい解説。
PHP bindParam()の落とし穴とbindValue()メモ

恥ずかしながらあまり意識したことがなかったのでメモ。

# bindParam()

基本的な使い方は以下のような感じ。
プレースホルダに変数内の値をバインドする。

```php
$sql = 'SELECT name, calories
        FROM fruit
        WHERE calories < :PARAM';
$sth = $dbh->prepare($sql);

$param = 150;
$sth->bindParam(':PARAM', $param, PDO::PARAM_INT);

$sth->execute();          // :PARAM には150がバインドされる
```


ここでの変数`$param`は、`$param`内の値がバインドされるわけではありません。
ここでがバインドされるのは`$param`の**参照値**です。

そのため、実際に発行されるSQLでは、`$sth->execute()`が実行されたとき、`$param`に格納されている値が採用されて実行されます。


つまり、以下のように参照値をバインドした後に値を変えた場合、後で代入された値が使用されます。


```php
$sql = 'SELECT name, calories
        FROM fruit
        WHERE calories < :PARAM';
$sth = $dbh->prepare($sql);

$param = 150;
$sth->bindParam(':PARAM', $param, PDO::PARAM_INT);
$param = 200;

$sth->execute();          // :PARAM には200がバインドされる
```

意識していないと、パラメータが期待していない値でSQLを発行してしまう場合があります。


# bindValue()
一方、`bindValue()`は、変数内の値をバインドします。

```PHP
$sql = 'SELECT name, calories
        FROM fruit
        WHERE calories < :PARAM';
$sth = $dbh->prepare($sql);

$param = 150;
$sth->bindValue(':PARAM', $param, PDO::PARAM_INT);
$param = 200;

$sth->execute();          // :PARAM には150がバインドされる
```
アマゾンの欲しいものリストの合計を出すブックマーク

# アマゾンのほしいものリストの合計を出す
調べた限りアマゾンのほしいものリストの合計を出すブックマークはいくつか存在するが、アマゾンの仕様の変更のせいか上手く動かなかった。
なので2018年3月25日現在動くプログラムを示す。

```javascript
javascript:var total=0,r=document.getElementsByClassName("a-price-whole");for (var i = 0; i < r.length; i++) {total += parseInt(r[i].innerHTML.replace(",", ""));}alert("計" + r.length + "点で￥" + total.toLocaleString());
```
# 使い方が分からない人向け

- 適当なページをブックマークする
- ↑で保存したブックマークを右クリックして編集
- 名前は適当に”総額”、URLを消して↑に挙げたjavascriptに書き換え保存する

![image.png](https://qiita-image-store.s3.amazonaws.com/0/122949/bd04d06d-968e-93d4-c6eb-6ef83e5e553d.png)

- ↑で決めたブックマーク名を欲しいものリストのページクリックする

![image.png](https://qiita-image-store.s3.amazonaws.com/0/122949/33278e1a-5836-c4e7-e19e-ab1ccb96b64a.png)

こんな感じで総額が出る
docker-compose run で 起動されたコンテナが名前解決されなかったのがされるようになる話

# 概要
## いままで

up したコンテナから run したコンテナに名前解決できなかった。

up した時を想定して run したコンテナに繋がって欲しいときもあるはず。


## これから

1.20.0 から入るオプション `--use-aliases` を使うことで解決できるようになる模様


https://github.com/docker/compose/releases/tag/1.20.0

> Added the `--use-aliases` flag to `docker-compose run`, indicating that
network aliases declared in the service's config should be used for the
running container

Docker for Mac にバンドルされてる composeは1.18.0なのでまだオプションが使えない（2018/03/25現在）（他の環境は知らない）


# 確認

## docker-compose のバージョン

```bash
$ docker-compose version
docker-compose version 1.18.0, build 8dd22a9
docker-py version: 2.6.1
CPython version: 2.7.12
OpenSSL version: OpenSSL 1.0.2j  26 Sep 2016
```


## docker-compose.yml

```bash
version: '2'
services:

  alpine1:
    image: alpine
    container_name: alpine1
    command: sh -c "while true;do sleep 1; ping alpine2;done"

  alpine2:
    image: alpine
    container_name: alpine2
```

## これまで


### 挙動

#### alpine1をupで立ち上げた時

```bash
$ docker-compose up alpine1
Starting alpine1 ... done
Attaching to alpine1
alpine1    | ping: bad address 'alpine2'
alpine1    | ping: bad address 'alpine2'
.
.
.
```

#### alpine2をrunで立ち上げる

```bash
$ docker-compose run --rm alpine2 /bin/sh
```

#### alpine1の状況

```bash
.
.
.
alpine1    | ping: bad address 'alpine2'
alpine1    | ping: bad address 'alpine2'
.
.
.
```



## これから

###　compose@1.20.0に更新する

```bash
$ curl -L https://github.com/docker/compose/releases/download/1.20.0/docker-compose-`uname -s`-`uname -m` -o /usr/local/bin/docker-compose
$ chmod +x /usr/local/bin/docker-compose
$ docker-compose version
docker-compose version 1.20.0, build ca8d3c6
docker-py version: 3.1.3
CPython version: 3.6.4
OpenSSL version: OpenSSL 1.0.2n  7 Dec 2017
```

### 挙動

#### alpine1をupで立ち上げた時

```bash
$ docker-compose up alpine1
Starting alpine1 ... done
Attaching to alpine1
alpine1    | ping: bad address 'alpine2'
alpine1    | ping: bad address 'alpine2'
.
.
.
```

#### alpine2をrunで立ち上げる

```bash
$ docker-compose run --rm --use-aliases alpine2 /bin/sh
```

#### alpine1の状況

```bash
.
.
alpine1    | ping: bad address 'alpine2'
alpine1    | ping: bad address 'alpine2'
alpine1    | PING alpine2 (172.19.0.3): 56 data bytes
alpine1    | 64 bytes from 172.19.0.3: seq=0 ttl=64 time=1033.162 ms
alpine1    | 64 bytes from 172.19.0.3: seq=1 ttl=64 time=24.807 ms
alpine1    | 64 bytes from 172.19.0.3: seq=2 ttl=64 time=0.115 ms
alpine1    | 64 bytes from 172.19.0.3: seq=3 ttl=64 time=0.105 ms
alpine1    | 64 bytes from 172.19.0.3: seq=4 ttl=64 time=0.084 ms
.
.
```

名前解決できるようになった。嬉しい。
嬉しかったので確認がてら書き留めた。

# 参考

* [Dockerのブリッジ・ネットワークでのコンテナ間名前解決がどうなっているのか見てみた](https://qiita.com/drafts/677b1f5c89dcbe520344)
  * docker-composeの構成と、元々名前解決の記事として大変為になりました
* [compose@1.20.0](https://github.com/docker/compose/releases/tag/1.20.0)
[Swift] イニシャライザをthrowsにする

今知ったんですが、Swiftではイニシャライザもthrowsにすることができます。

```swift
struct Hoge {
    
    let hoge: Int
    
    init(hogeString: String) throws {
        
        guard let hoge = Int(hogeString) else {
            
            throw NSError(domain: "Hoge", code: 1, userInfo: nil)
        }
        
        self.hoge = hoge
    }
}
```
Apache NiFi を使って Google Cloud Storage にデータを蓄積しよう


Google Cloud Dataflow は、　ETL などのデータ処理を行い、GCP のマネージドサービス間のデータのフローを構成するサービスです。今回は、NiFi で生成したデータを、Google Cloud Storage (GCS) に書き込むフローを試してみました。

- GCE 上にインスタンスを作成 

```
マシンタイプ: n1-standard-4
HTTP/HTTPS トラフィックを許可する
ネットワークタグ: nifi
```

- ファイアウォールの設定
NiFi はデフォルト ８０８０ 番ポートを利用するので、ポートをオープンにします
![ss 2018-03-25 0.40.21.png](https://qiita-image-store.s3.amazonaws.com/0/42406/4f3df649-97b0-6331-d2d1-922cdbb64777.png)

- GCS 用のサービスアカウントキーを作成
 + API とサービスの認証情報から、認証情報を作成をクリック
![ss 2018-03-24 12.38.15.png](https://qiita-image-store.s3.amazonaws.com/0/42406/18b17f66-dbce-f2d3-0451-88903a479268.png)
 + 任意のサービスアカウント名を入力
![ss 2018-03-24 12.40.51.png](https://qiita-image-store.s3.amazonaws.com/0/42406/a11a6186-5775-acbb-3083-b2cb90999eeb.png)

- Java, NiFi　のインストール、起動
作成した インスタンス に ssh 接続し、下記の要領でインストール、起動します

```
sudo apt-get update
sudo apt-get -y install openjdk-8-jdk
sudo sh -c "echo 'export JAVA_HOME=/usr/lib/jvm/java-8-openjdk-amd64' >> /etc/profile.d/jdk.sh"
sudo sh -c "echo 'export PATH=\$JAVA_HOME/bin:\$PATH' >> /etc/profile.d/jdk.sh"
source /etc/profile.d/jdk.sh
wget https://archive.apache.org/dist/nifi/1.4.0/nifi-1.4.0-bin.tar.gz
tar zxvf nifi-1.4.0-bin.tar.gz
cd nifi-1.4.0/bin
./nifi.sh start
```

- Apache NiFi の UI にアクセス
http://[ipaddress]:8080/nifi にアクセス
![ss 2018-03-24 23.53.15.png](https://qiita-image-store.s3.amazonaws.com/0/42406/ab78f8ca-178b-daa2-f1ab-979dd4c01628.png)

- フローの作成
NiFi では下記のように Processor と呼ばれる箱を組み合わせてフローを定義していくが、今回は、 GenerateFlowFile と、 PutOCSObject を使用してみます。
![ss 2018-03-24 23.56.19.png](https://qiita-image-store.s3.amazonaws.com/0/42406/7702d1d4-ea5d-ff51-1c76-14d25998a454.png)

- PutOCSObject をダブルクリックし、　GCS　に データを書き込む為に、下記を設定を変更する

```
GCP Credentials Provider Service : 
Project ID : <GCP のプロジェクトID>
Bucket : <GCS のバケット>
```

![ss 2018-03-24 12.13.19.png](https://qiita-image-store.s3.amazonaws.com/0/42406/3f3afd70-dae8-4422-8af5-b354eaa931fb.png)

- GCP Credentials Provider Service の設定
PutOCSObject Processor をダブルクリックし、GCP Credentials Provider Service の右に矢印をクリックして、歯車マークをクリック
![ss 2018-03-24 12.13.54.png](https://qiita-image-store.s3.amazonaws.com/0/42406/c5348c2a-4538-cf9b-da23-2c1c2c9070f2.png)

- Properties タブをクリックし、Service Account JSON に、作成したキー （JSON 形式）　をペースト
![ss 2018-03-24 12.13.42.png](https://qiita-image-store.s3.amazonaws.com/0/42406/ccaeb47e-136d-651d-db00-fae9cfdc186b.png)


- PutOCSObject Processor をダブルクリックし、GCP Credentials Provider Service の右に矢印をクリックして、雷マークをクリックし、Enable 状態にします
![ss 2018-03-24 12.13.54.png](https://qiita-image-store.s3.amazonaws.com/0/42406/c5348c2a-4538-cf9b-da23-2c1c2c9070f2.png)

- 全ての Processor を実行して、GCS にデータが書き込まれていることを確認
![ss 2018-03-24 12.17.44.png](https://qiita-image-store.s3.amazonaws.com/0/42406/7efcf3de-0cb2-ac6f-510a-95c02a55662a.png)

Apache NiFi には、GCP のマネージドサービス用の Processor がまだまだ少ないので、（というか、GCS関連しかない）この辺りが充実されれば、色々展開できると思われます。

少し、はしょって書いているので、不明な点があれば、 [@kkitase](http://twitter.com/kkitase) まで。

以上
Angular コンポーネントのテスト（sample6 / 入出力を伴うコンポーネントのテスト）

目次：[Angular コンポーネントのテスト](https://qiita.com/ringtail003/items/cdd7c5427c4836857b7e) 

---

この章では `@Input` `@Output` デコレータを利用したコンポーネントのテストについて説明します。

# コンポーネントの作成

まずテストを書くためのコンポーネントを作成します。

このコンポーネントは string型の name を受け取ります。
テンプレートにはボタンがひとつあり、クリックすると greet イベントを発生させます。

```shell
$ ng generate component sample6
```

```diff
// sample6.component.ts

import {
  Component,
+  EventEmitter,
+  Input,
  OnInit,
+  Output
} from '@angular/core';

@Component({
  selector: 'app-sample6',
  templateUrl: './sample6.component.html',
  styleUrls: ['./sample6.component.css']
})
export class Sample6Component implements OnInit {
+  @Input() name: string;
+  @Output() greet = new EventEmitter<string>();

+  click() {
+    this.greet.emit(`Hello ${this.name}!`);
+  }
  ...
}
```

```diff
// sample6.component.html

- <p>
-   sample6 works!
- </p>

+ <span name="name">{{name}}</span>
+ <button type="button" (click)="click()">greet</button>
```

# `@Input` の検証

```diff
// sample6.component.spec.ts

+ import { By } from '@angular/platform-browser';

+  it('@Input の検証', () => {
+    component.name = 'foo';
+    fixture.detectChanges();
+
+    const element = fixture.debugElement.query(By.css('[name=name]')).nativeElement as HTMLSpanElement;
+    expect(element.textContent).toBe('foo');
+  });
```

# `@Output` の検証

EventEmitter は emit（イベントの発生）と subscribe（イベントの受け取り）の2つのメソッドを持っています。
subscribe にコールバック関数を渡す事でイベントの発生を検証する事ができます。

> Angular v5.2.8 **event_emitter.ts**
> https://github.com/angular/angular/blob/5.2.8/packages/core/src/event_emitter.ts

```diff
// sample6.component.spec.ts

+  it('@Output の検証', () => {
+    component.name = 'bar';
+    let message: string;
+
+    component.greet.subscribe(data => message = data);
+
+    const button = fixture.debugElement.query(By.css('button')).nativeElement as HTMLButtonElement;
+    button.click();
+
+    expect(message).toBe('Hello bar!');
+  });
```

> 公式ドキュメント **Component with inputs and outputs**
> https://angular.io/guide/testing#component-with-inputs-and-outputs

---

[目次に戻る](https://qiita.com/ringtail003/items/cdd7c5427c4836857b7e)
Angular コンポーネントのテスト（angular/cli で生成されるコンポーネントのテストコード）

目次：[Angular コンポーネントのテスト](https://qiita.com/ringtail003/items/cdd7c5427c4836857b7e)

---

angular/cli でコンポーネントを作成すると一緒にテストコードも生成されます。雛形とも言えるこのコードには、基本的なコンポーネントのテストが書かれています。まずはコンポーネントを作成し、テストコードを見て見ましょう。

```shell
$ ng new project1
$ cd project1
$ ng generate component sample1
```

```TypeScript
// sample1.component.spec.ts

import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { Sample1Component } from './sample1.component';

describe('Sample1Component', () => {
  let component: sample1Component;
  let fixture: ComponentFixture<Sample1Component>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ Sample1Component ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(Sample1Component);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});
```

# 雛形のテストコードを理解する

## 一つ目のbeforeEach

```TypeScript
beforeEach(async(() => {
  TestBed.configureTestingModule({
    declarations: [ Sample1Component ]
  })
  .compileComponents();
}));
```

### TestBed

TestBed はテスト用の環境に関するメソッドを提供します。
`TestBed.configureTestingModule()` でテスト用のモジュール情報を設定し `compileComponents()` でそのモジュールに含まれるコンポーネントをコンパイルします。

コンパイル対象のコンポーネントは declarations で定義します。
コンポーネントがモジュールやサービスに依存している場合や、別のコンポーネントやディレクティブを所有している場合はそれらもコンパイル対象となります。

### async

よく見ると処理全体は async という関数で囲われていますね。
これはコンポーネントのコンパイルが非同期で行われるためです。

async は非同期処理の終了を待って次の処理に移るための関数です。
処理全体を囲うことで、beforeEach の次のプロセスに移る時にコンパイルが完了している事を保証できます。

## 二つ目のbeforeEach

```TypeScript
beforeEach(() => {
  fixture = TestBed.createComponent(Sample1Component);
  component = fixture.componentInstance;
  fixture.detectChanges();
});
```

`TestBed.createComponent()` は、コンポーネントを作成しそのコンポーネントにアクセスするための ComponentFixture オブジェクトを返却します。

`fixture.componentInstance` はコンポーネントに紐付いたクラスを参照するためのプロパティです。具体的には Sample1Component クラスのインスタンスを参照します。

`component.Fixture.detectChanges()` はクラスが持つプロパティをテンプレートに反映します。

## it('should create')

```TypeScript
it('should create', () => {
  expect(component).toBeTruthy();
});
```

おなじみの [Jasmine](https://jasmine.github.io/) のテストスイートですね。
コンポーネントの作成が正常に完了すると変数 component はコンポーネントに紐付いたクラスを参照しているので、値が空でない事を検証しています。

# Testing Utility APIs

TestBed や async など、テストに関する機能を提供する一連のオブジェクトや関数群を **Testing Utility APIs** と呼びます。
このユーティリティを使用する事で、テスト用の環境を生成し、アプリケーションをブラウザで実行させるのと同じように、テスト環境で動作をシミュレートできます。

コンパイルされたコンポーネントには ComponentFixture を通してアクセスする事ができ、クラスのプロパティを検証したり、HTML要素の値を検証したり、といったテストが可能になります。

> 公式ドキュメント **Testing Utility APIs** 
> https://angular.io/guide/testing#testing-utility-apis

---

次の記事：[sample1 / フォームに含まれない単体のHTML要素のテスト](https://qiita.com/ringtail003/items/62182c1bc63efcdc7038)
Angular コンポーネントのテスト

# はじめに

Angular のテスト、難しくないですか？
TestBed とか async とか見慣れないものがたくさん出てきて、何をどう使えばいいのか迷いますよね。

公式ドキュメントの説明が長くて読むのにひと苦労なのと、その割にあまりテストのサンプルは載っていません。
ネットでサンプルのテストコードを探すといろいろなパターンのコードが出てきて混乱します。
つぎはぎで作った理解の浅いテストコードは使い回しが効かず、謎のコンパイルエラーがどうにも解決できなくなります。

何か実装するためにはそれを検証するためのテストが必要で、実装が書けたのにテストを書くのが異常に遅いという状況が続いてイライラしていました。せめてコンポーネントの基本的なテストだけでもササッと書けるようになりたいですよね。

私は Angular の開発経験が浅く、技術力も情報量も圧倒的に不足しています。
冒頭から何ですが、Angular の仕組みについて詳しい方が素敵なマニュアルを書いてくれるのをとても期待しています。
この記事はそれまでのつなぎで、自分用のまとめとして書いたものです。

ソースコードは https://github.com/ringtail003/angular-testing にアップしています。
また、記事の内容に間違いがありましたら、編集リクエストをいただけると大変助かります。

# 前提条件

この記事は以下の環境で検証しています。

* node v9.9.0 (npm v5.6.0)
* angular/cli v1.7.3

本文中に記載している Angular の Github リポジトリへのリンクは、2018年3月時点での最新安定版 v5.2.8 を参照しています。

# 目次

- [angular/cli で生成されるコンポーネントのテストコード](https://qiita.com/ringtail003/items/04730dfe8ba727a720ee)
- [sample1 / フォームに含まれない単体のHTML要素のテスト](https://qiita.com/ringtail003/items/62182c1bc63efcdc7038)
- [sample2 / Template driven Form を利用したコンポーネントのテスト](https://qiita.com/ringtail003/items/9dc5e811f6d8d373279b)
- [sample3 / Reactive form を利用したコンポーネントのテスト](https://qiita.com/ringtail003/items/06de6e759d0b5768313f)
- [sample4 / サービスが注入されたコンポーネントのテスト](https://qiita.com/ringtail003/items/72b821b7bfbae9fd875b)
- [sample5 / ネストしたコンポーネントのテスト](https://qiita.com/ringtail003/items/baf47ce2a768bdadb0d8)
- [sample6 / 入出力を伴うコンポーネントのテスト](https://qiita.com/ringtail003/items/6c4d527b1ec3558a8c7f)

# おまけ

## テスト実行時にブラウザが起動しないようにする

angular/cli で作成したアプリケーションで `npm test` を実行するとブラウザが起動します。
Chrome ヘッドレスブラウザを使うと cli だけで完結するので便利です。

```diff
// package.json
"scripts": {
  ...
+   "test:dev": "npm test -- --browser ChromeHeadless",
}
```

```shell
$ npm run test:dev
```

## カバレッジ

さらにカバレッジがオプションひとつで簡単に出力できます。
出力先は {ROOT_DIRECTORY}/coverage です。

```diff
// package.json
"scripts": {
  ...
-   "test:dev": "npm test -- --browser ChromeHeadless",
+   "test:dev": "npm test -- --browser ChromeHeadless --code-coverage",
}
```
Play Framework勉強めも　データベースについて①

（参考）勉強してる書籍
https://www.amazon.co.jp/Play-Framework-2%E5%BE%B9%E5%BA%95%E5%85%A5%E9%96%80-Java%E3%81%A7%E3%81%AF%E3%81%98%E3%82%81%E3%82%8B%E3%82%A2%E3%82%B8%E3%83%A3%E3%82%A4%E3%83%ABWeb%E9%96%8B%E7%99%BA-%E6%B4%A5%E8%80%B6%E4%B9%83/dp/4798133922/ref=cm_cr_srp_d_product_top?ie=UTF8

#データベースについて
そもそもデータベースとは？は以下参照。
https://www.sejuku.net/blog/8763#i-4
アプリケーションを作成するに当たってデータベースの設計はかなり重要。

##H2について
プレイフレームワークでは、H2（H2 Data Base Engine）と呼ばれるデータベースプログラムが組み込まれている。

#データベースを使用するための設定について
##application.confの設定方法
まずは、アプリケーションがDBを使用出来るようにする。設定方法は以下の通り。

```
設定項目＝値
```
###application.confに追記するコード
・#から始まっているコードはコメント
・以下のコードを追加する

```
db.default.driver=org.h2.Driver
db.default.url="jdbc:h2:mem:play"
ebean.default="models.*"
```

###設定項目の解説
追加してない部分も含めて解説。

```
db.default.driver
```
→データベースアクセスのために、利用するドライバを指定するものです。ここでは一般的にJavaのクラスを指定する。

```
db.default.url
```
→データベースのアクセス先を示すURLを指定する。「jdbc.〇〇」という形で指定する。

```
db.default.user
```
→H2では使用しないが、クライアント・サーバ方式のデータベース利用の際用いる。利用者名を記載する。

```
db.default.password
```
→H2では使用しないが、クライアント・サーバ方式のデータベース利用の際用いる。パスワードを記載する。

```
ebean.default
```
→O/Rマッパーに関する内容を記述する。

##データベースを呼び出すための設定方法
データベースの呼び出し方法は大きく２パターンある。
・ドライバファイルに記述する方法
→データベースにアクセスするファイル 
http://www.atmarkit.co.jp/ait/articles/0106/26/news001.html 

・ビルドツールを使用する方法
→ドライバへのアクセスも含め、自動でアプリケーションが動く状態にするツール 
（ビルドとは）https://qiita.com/Mura-Mi/items/225825cc3715dc04d923 

**プレイフレームワークは「sbt」というビルドツールを使って、データベースのアクセスに必要なツールをダウンロードする。**

##設定追記方法
以下の様に、アプリケーションで使用している項目を、seqの後でカンマで区切って記載する。

```
libraryDependencies ++= Seq(項目1,項目2・・・・・)
```

###設定追記後のsbtのコードの内容

```
name := "PlayApp"

version := "1.0-SNAPSHOT"

libraryDependencies ++= Seq(
  javaJdbc,
  javaEbean,
  cache
)     

play.Project.playJavaSettings
```

#データベースの作成について
プレイアプリケーションでは、Modelクラスに具体的なテーブルの内容を定義する事で
実行時に自動的にテーブルを用意する事が出来る。

##Modelクラスの作り方
appというフォルダ内に、modelsというフォルダを作成する。
フォルダ内にMessage.javaというファイルを作成する。

###記載方法
```java
public class クラス名 extends Model{
//保管するフィールドの定義
}
```

###コード全体
```java
package models;

import java.util.Date;

import javax.persistence.*;
import javax.validation.*;

import play.data.validation.*;
import play.db.ebean.*;

@Entity//①
public class Message extends Model{//②

	@ID//③
	public Long id;
	public String name;
	public String mail;
	public String message;
	public Date postdate;
}
```
①エンティティクラスである事を記述する。
（エンティティクラスについて参考）http://itdoc.hitachi.co.jp/manuals/link/cosmi_v0870/APKC/EU070254.HTM
②Modelというクラスを継承する事で、データベースとしての機能を保有する事が出来る。
③@IDと書かれた下にあるフィールドがプライマリキーとして扱われる。

##その他クラスの変更
Application.java

```java
package controllers;

import play.*;
import play.mvc.*;

import views.html.*;

public class Application extends Controller {
    //ルートにアクセスした際のAction
    public static Result index(){
      return ok(index.render("データベースのサンプル"));
    }
}
```

index.scala.html

```
@(msg:String)


@main("Sample page") {
  <h1>Hello!</h1>
  <p>@msg</p>
}
```

##表示結果
<img width="193" alt="スクリーンショット 2018-03-24 23.25.54.png" src="https://qiita-image-store.s3.amazonaws.com/0/229025/74e6b9cd-dfbe-428d-be03-227065ac9e6f.png">
python関係のお勉強

◆初稿　2018-03-24(Sat)　Written by Zepher.
# はじめに
Python言語を使った開発環境には、有用な環境が整っているようだ。
特に、注目のデータ分析環境としてはうってつけなわけで。
とりま、手を動かしてみる。
# 内容
　１．Anacondaのインストール
　２．JupyterNotebookを使ってみる
　３．Numpyを試してみる
　４．Pandasを試してみる
　５．matplotlibを試してみる
## １．Anacondaのインストール
https://www.anaconda.com/download/
Anacondaのインストール
Anaconda3 5.1.0(64bit)
## ２．JupyterNotebookを使ってみる
　JupyterNotebookという環境でpythonを動作させる
　セルと呼ばれる単位にプログラムを記述すると、
　セル単位で実行させることが可能
## ３．Numpyを試してみる
　Numpyを使うと、行列計算が簡単にできる

```python:numpy.py
# coding: utf-8
# In[2]:
print("Python")
# In[4]:
import numpy as np
# In[5]:
arr = np.array([3,5,8])
arr
# In[7]:
arr = np.array([[3,5,8],[2,4,9]])
arr
# In[8]:
arr.shape
# In[108]:
arr = np.random.rand(2,3)
arr
# In[109]:
arr = np.array([1,2,3])
arr = arr * 5
arr                
# In[110]:
arr1 = np.array([[1,2,3],[2,3,4]])
arr2 = np.array([[3,4,5],[4,5,6]])
arr = arr1 + arr2
arr
```
```text:実行結果
Python

array([3, 5, 8])

array([[3, 5, 8],
           [2, 4, 9]])

(2, 3)

array([[0.51725257, 0.22628297, 0.04245807],
           [0.66186709, 0.11924214, 0.23291323]])

array([ 5, 10, 15])

array([[ 4,  6,  8],
           [ 6,  8, 10]])
```

## ４．Pandasを試してみる
　Pandasを使うと、データベースを簡単に記述できて、
　かつ、CSVとしてエクスポートしたり、逆にインポート
　したりできる


```python:pandas.py
import numpy as np
import pandas as pd
df = pd.DataFrame([["Akira", "Jessi", "Li"],
                  ["Japan", "USA", "China"],
                  [23,25,22],
                  ["1/2","3/8","9/1"]] ).T
df.columns = ["name", "country", "age", "birthday"]
df.index = [1,2,3]
print(df)
df.to_csv("temp.csv")
dft=pd.read_csv('temp2.csv')
print(dft)
```
```text:実行結果
           name country age birthday
    1     Akira   Japan  23      1/2
    2     Jessi     USA  25      3/8
    3        Li   China  22      9/1

           name country  age birthday
    0     Akira   Japan  23      1/2
    1     Jessi     USA  25      3/8
    2        Li   China  22      9/1
```
## ５．matplotlibを試してみる
　matplotlibを使うと、簡単に綺麗なグラフを描ける
　タイトルや軸ラベル、凡例もしっかり表現可能


```python:plot1.py
import matplotlib.pyplot as plt
%matplotlib inline

import math
import numpy as np
x = np.linspace(0,5*math.pi)
y=np.sin(x)
plt.plot(x,y)
plt.show()
```
![output_1_0.png](https://qiita-image-store.s3.amazonaws.com/0/141812/0d369737-d3af-775f-239c-cc5e6ea3695e.png)


```python:plot2.py
plt.title('Sin Graph')
plt.xlabel('X-Axis')
plt.ylabel('Y-Axis')
plt.plot(x,y,label='sin')
plt.legend()
plt.show()
```
![output_2_0.png](https://qiita-image-store.s3.amazonaws.com/0/141812/208bf597-723c-b3fc-bbdf-1a9bef635518.png)
Ruby on Rails 学習日記

railsの学習個人メモ
随時更新するつもり
現在学習のもの

- [Progate Ruby on Rails5 学習コース]() 
- [Ruby on Rails チュートリアル：実例を使って Rails を学ぼう](https://railstutorial.jp/)

# コマンド
オプションとかもいろいろあるが詳しくは[Railsドキュメント](http://railsdoc.com/rails)を参考

```ruby
rails new appname 
#appname作成
```

```ruby
rails generate model modelname
rails g model modelname # 省略
#modelname作成
#generateは省略してgでもできる

```

```ruby
rails server
rails s #省略
#開発用のサーバー起動
#serverは省略してsでもできる
#サーバーを終了するときはctrl D
```

```ruby
rails console
rails c #省略
#コンソールを起動
#consoleは省略してcでもできる
#consoleを終了するときはctrl D
```

# メソッド
## モデルの生成、保存、削除
### new
newメソッドにカラム名と値ををハッシュで渡すことで値を設定してモデルオブジェクトを生成することができる。

```ruby
item = Item.new(name: "アイテム1", price: "100") 
```

### save
saveメソッドで保存する。
saveメソッドを呼び出した際にバリデーションに失敗すると、Railsでは自動的にエラーメッセージが生成されるようになっているらしい。
item.errors.full_messagesの中に、エラー内容が配列で入ります。

```ruby
# 変数itemにItemのデータが入っている状態
item.save
# バリューエラーがあった場合
item.save
=> fales
item.errors.full_messages
=> ["バリデーションメッセージ"]
```

### destroy
レコードを削除する

```ruby
# 変数itemにItemのデータが入っている状態
item.destroy
```


## モデルの検索

### all
全てのレコードを取得する

```ruby
items = Item.all
```

### find
IDで検索する
```ruby
item = Item.find(:id)
```

### find_by
ID以外のカラムで検索する

```ruby
item = Item.find_by(name: "アイテム1")
```

## ルーティング

### get
データを取得する処理
データベースを変更しないアクション

### post
データベースを変更しないアクション


# バリデーションの書き方
modelに書く
@shunhikita さんの[Railsバリデーションまとめ](
https://qiita.com/shunhikita/items/772b81a1cc066e67930e)がとてもまとまっていました。


```models/item.rb
validates :検証カラム, {検証内容}
# 例 nameが空の場合
validates :name, {presence: true}
# nameの値が存在するかどうかをチェック
```

# 変数

## flash

ページ上に1度だけ表示されるメッセージ
フラッシュが表示された後、ページを更新したり、別のページに移動したりすると、フラッシュは表示されなくなる。

```items_controller.rb
flash[:notice] = "表示したいメッセージ"
```

```items/index.html.erb
<%= flash[:notice] %> 
```
[iOS]tweakのdebからhookしているメソッドを探す

iOSのjailbreak tweak開発で一番時間がかかると言っても過言でないのがhookするメソッド探しです。

基本的には自分でheaderダンプしてlogしかけて想定している動作なのか探していく事になるか、他人の公開されているソースを見ることになると思います。（tweak名 githubとかでググれば出るはずです）

しかし、ソースを公開していないtweakの場合はdebからhookしているメソッドを探すことができます。
以下に手順を書きます。debの入手方法ですが、repositoryのURLを漁ったりすればすぐに手に入るはずです。（そのうち書きます）

# 手順

## debのextract

`$ ar -x name.deb`

でdebを解体します。

```
control.tar.gz
data.tar.xz
debian-binary
```

といったファイル群が出てくると思います。

## dataのextract

`$ tar xf data.tar.xz`

でdataの中身を取り出します。

`$ Library/MobileSubstrate/DynamicLibraries/name.dylib`

というディレクトリ構成でdylibが取り出せると思います。

## dylibのextract

dylibの実態は7zipアーカイブなので

`$ brew install p7zip`

とかで7zipをいれて

`$ 7z x Library/MobileSubstrate/DynamicLibraries/name.dylib`

で解凍します。

## objc

`__TEXT__objc_methname`というファイルが取り出せたら、これの中身を見ます。
大体の場合はテキストエディタとかで開けるはずです。
ここにhookしているメソッドが羅列されています。
babelをゼロコンフィグで扱う


nodeのツールでbabelを使いたい場合、もちろんbabelrcを書く必要がありますが、面倒です。
また、`presets`と`plugins`の更新に時間を取られたくありません。
ので、自分でライブラリを公開するときは`babel-preset-zero`を用いて痛みを軽減しています。

```
yarn add --dev babel-cli babel-preset-zero
```

[akameco/babel-preset-zero: babelrc for zero config](https://github.com/akameco/babel-preset-zero)

## Usage

```
{
  "presets": ["zero"]
}
```

## How

babel-preset-zeroが何をしているのかと言えば、`babelrc`は普通にjsをかけるのでnpmの依存を解析したり、環境変数を見たりして使うpresetを自動的に判定します。

例えば、基本公開はnode v6以上で公開したいですが、test環境はで不要です。
なのでテストでは`currnet`でビルドするようにします。

```
const envTargets = isTest ? { node: 'current' } : { node: '6' }
```

また、`flow-bin`がある場合のみ`babel-presets-flow`が有効になりようにすることも可能です。
依存に`react`があれば`babel-presets-react`を有効化等が指定なしで出来ます。

```
hasAnyDep('flow-bin') && require.resolve('babel-preset-flow'),
```

## メリット
`babel-preset-zero`を使う場合は、これだけ管理すればよくなり、管理が楽です。

## まとめ
もし`babel-presets-zero`の設定に気に食わないところがあればPR歓迎です。また、自分で`presets`を自分で用意してもよいと思います。

[akameco/babel-preset-zero: babelrc for zero config](https://github.com/akameco/babel-preset-zero)
skiftを使ってfasttextをscikit-learnのように扱う（python）

## fasttextをscikit-learnのように扱いたい

scikit-learnを始めって触った時に、とても使いやすかったので、これのfasttext版ないのかな〜、と思ってたら、[shaypal5/skift](https://github.com/shaypal5/skift)というまさにこれっていうのがありました。

基本的にREADME.rst見たらできるんですが、一点ハマったので同じことにハマる人が困らないよう書き残しておきます。

## はまりどころ

```python
import pandas as pd
from skift import FirstColFtClassifier
from sklearn.cross_validation import train_test_split
from sklearn.metrics import mean_squared_error

df=pd.read_csv('/path',names=['lbl','txt'])
y = df['lbl']
X = df[['txt']]
X_train, X_test, y_train, y_test=\
train_test_split(X,y,test_size=0.3)

sk_clf = FirstColFtClassifier()
sk_clf.fit(X_train, y_train)
y_pred = sk_clf.predict(X_test.values.tolist()) # ここ！
rf_mse = mean_squared_error(y_test, y_pred)
print('MSE:', rf_mse)
```

`sk_clf.predict()`に思考停止でX_testを入れてたら

```bash
AttributeError: 'float' object has no attribute 'find'
```
というエラーが出てきて無為に時間を過ごしてしまったのですが、ここには二重list形式で入れるべきだったんですよね。よしなにdfのままやってくれよ、と思うのですが。

よって、`X_test.values.tolist()`こんな感じでこっちから歩み寄る必要があります。
新しいGA「gtag.js」を使うとGoogle Optimize実践まで超簡単だった

## やりたいこと

gtag.jsを使用しているサイトで、Google Optimizeをやりたい。

実際導入して見たら、思った以上に簡単でした。
導入の調査を開始した直後はGoogle Tag Managerの導入も必要そうで、少し億劫に感じていました。

> 別に他に広告などでGTMが必要な場面はないからなぁ
なんだかすごそうなOptimizeだけサクッと試したいのに・・。

という方は多いと思います。

## 状況/環境

- Google Tag Managerを使っていない
- analytics.jsからgtag.jsにアップデートした
- gtag.jsによるトラッキングは正常。Google AnalyticsでPVなどを見ている
- マーケティングの観点からOptimizeでA/Bテストをやりたい

## 方法

gtag.jsのみをインストールしている状態

```
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-99999999-9"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-99999999-9', {});
</script>

```

↑を↓のようにします。

```
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-99999999-9"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-99999999-9', {
    'optimize_id': 'GTM-AAAA9AA'
  });
</script>

```

追加されたのは、下から3行目の `'optimize_id': 'GTM-AAAA9AA'` だけ。
この`GTM-AAAA9AA`は[Optimizeのアカウント管理画面](https://optimize.google.com/optimize/home/#/accounts)で「コンテナID」と表示されているものです。

## フリッカー対策

Optimizeを実践すると、ページロード完了時に一瞬オリジナルのページが表示され、その後テスト用のページになります。
それの対策として、`page_hiding_snippet` と呼ばれるコードがあります。

用は、ページを表示するまでに一瞬の間を置くだけのコードです。
これは以下の様にgtag.jsに上に設置します。

```
<!-- Page hiding snippet (recommended)  -->
<style>.async-hide { opacity: 0 !important} </style>
<script>(function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;h.start=1*new Date;
h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')};
(a[n]=a[n]||[]).hide=h;setTimeout(function(){i();h.end=null},c);h.timeout=c;
})(window,document.documentElement,'async-hide','dataLayer',500,
{'GTM-AAAA9AA':true});</script>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-99999999-9"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-99999999-9', {
    'optimize_id': 'GTM-AAAA9AA'
  });
</script>

```

`window,document.documentElement,'async-hide','dataLayer',500,
{'GTM-AAAA9AA':true}` の `500` のところを調整すると「間」が調整できます。
ユーザーに違和感を感じさせないギリギリでいつも生きていきましょう。

## 完了

あとはOptimizeの管理画面で、テストを作成・実施します。

以上がgtag.jsを使用している画面でのGoogle Optimizeの利用方法です。
導入だけでみると驚くほど簡単でした。

皆さんもぜひ！

## 参考
以下のページが日本語訳されれば、みんな幸せになれる気がします！！
[Deploy Optimize using gtag.js](https://support.google.com/optimize/answer/7513085)
SQLアンチパターンon Rails Ⅱ部（物理設計）

# はじめに
SQLアンチパターンをRailsの文脈で読み解いていきます。
この記事では、Ⅱ部 データベース物理設計のアンチパターン（9~12章）を取り上げます。

# リンク
- [SQLアンチパターンon Rails Ⅰ部（論理設計）](https://qiita.com/eduidl/items/8620787ffaf2b18922bf)
- [SQLアンチパターンon Rails Ⅲ部（クエリ）](https://qiita.com/eduidl/items/f6383517dea9ad13c6ce)
- [SQLアンチパターンon Rails Ⅳ部（アプリケーション開発）](https://qiita.com/eduidl/items/c39e9df63c990196fcdd)

# 本文
## 9. ラウンディングエラー（丸め誤差）
特にお金とか無限の精度のがあるものは、`Float`型ではなく、`Decimal`型にしましょうという話。
私も一回踏みました。

```rb
class CreateProduct < ActiveRecord::Migration[5.1]
  def change
    create_table :products do |t|
      t.decimal :price, precision: 10, scale: 2
    end
  end
end
```

のように全体の桁数`precision`と小数点以下の桁数`scale`を指定するだけです。

## 10. サーティワンフレーバー（31のフレーバー）
enumを`CHECK`制約で管理するのはよくないという話。
とはいえ、Railsを使っている上で、そこまでないかと。私は、

```rb
class Bug
  enum status: %i[new in_progress fixed]
end
```

みたいなことをします。
[Enumerize](https://github.com/brainspec/enumerize)等のgemを使ったり、配列でなくHashだったり、`config`とか使って定数化したり、色々なバリエーションは考えられます。
私はまだこれで困ったことはありません。

勿論enumをテーブルで管理すれば、列挙子に廃止ステータスを持たせて、既存のレコードについては許容しつつ、新たに割り当てることはできないようにする等、色々と柔軟にできることは確かです。
それだって、Validationで何とかできるかもしれませんが。あまり綺麗にな設計にはならなそうです。

## 11. ファントムファイル（幻のファイル）
S3のようなクラウドストレージを使うこともあると思いますし、賛否あるでしょう。
ファイルを直接DBにいれるなら、

```rb
t.binary :file, limit: 15.megabytes
```
みたいにすればいいわけですね。

S3を使うのなら、[fog](https://github.com/fog/fog)と[CarrierWave](https://github.com/carrierwaveuploader/carrierwave)を使えばいいのではないでしょうか。

## 12. インデックスショットガン（闇雲インデックス）
indexの張りすぎも張らなさすぎにも注意という話。
`add_index`と`index: true`等indexの貼り方さえ押させておけば、特にRailsに特化したことはなさそう。
あと、`t.references`すると勝手にindex張られるとか。
Dockerでapache2起動

#Dockerでapache2起動

##環境
Tiny core linux
docker 17.12.1
##概要
Dockerの勉強の一環としてapache2をDockerfileから立ち上げました。
その時の事を忘れないように残しておきます。

### Dockerfileの作成

環境変数の設定ができておらず、FOREGROUNDで起動できないという失敗を繰り返し、以下のDockerfileを何とか作成しました。


```text:Dockerfile
FROM ubuntu

MAINTAINER hoge

ENV APACHE_RUN_USER www-data
ENV APACHE_RUN_GROUP www-data
ENV APACHE_PID_FILE /var/run/apache2.pid
ENV APACHE_RUN_DIR /var/run/apache2
ENV APACHE_LOG_DIR /var/log/apache2
ENV APACHE_LOCK_DIR /var/lock/apache2

RUN apt-get update && \
    apt-get install -y apache2

EXPOSE 80
CMD ["apachectl", "-D", "FOREGROUND"]
```

コピペでも動くと思うので試してみてください。

### Dockerfileでビルド
Dockerfileのある階層に行って以下のコマンドを打ってビルドしてください。
ビルドする際に分かりやすいようにタグにhogeという名前をつけています。

```shell:コマンド
docker build -t hoge .
```

### apatch2起動
以下のコマンドでビルドして作成したイメージからapatch2を起動します。

```shell:コマンド
docker run -p 8000:80 -d hoge
```

以上です。
[余談]力学

最短力学
http://robo.mydns.jp/Lecture/PDF/Mech...

桜美林大の方が作成。全体で約２０ページほどである。
総合的な復習用のメモとして使える。
項目
　1　はじめに
　2　運動の法則
　3　運動の積分
　4　具体的な力と運動
　5　大きさがある物体の運動
　6　解析力学

機械学習やディープラーニング等の学習に際して学んできた微分積分や、線形代数、ひいては、ラグランジュ等の細かいテクニック等に関して、学問としての興りに立ち返ってみるいい機会になるかもしれないと思い目を通した。
まだ全く読み終わっていないので、きちんと時間をとって読んでみたい。
また、時間の取り扱いに関しても新しい概念も習得ができるのではないかと期待をしている。
PHPで、Google Clientを作成する（サービスアカウント）

#目的
PHPで、Googleサービスに接続する際に作成した内容のメモ。
サービスアカウントを使用するパターンです。

#サービスアカウント
Google Cloud Platform から使用するプロジェクトを選択し、APIサービスの認証情報からサービスアカウントを作成し、jsonキーを用意します。

#Google APIs Client Library for PHP
GitHub [Google APIs Client Library for PHP](https://github.com/google/google-api-php-client)

```
composer require google/apiclient:^2.0
```
でインストール。

#Google Clientの作成
```
require_once 'vendor/autoload.php';

define('CREDENTIALS_PATH', 'サービスアカウントキーのファイルパス');

putenv('GOOGLE_APPLICATION_CREDENTIALS='.CREDENTIALS_PATH);
$client = new Google_Client();
$client->useApplicationDefaultCredentials();

$client->addScope(Google_Service_Sheets::SPREADSHEETS);
$service = new Google_Service_Sheets($client);
```
以上。
golang 日付・時刻


###Go言語での現在日時の取得

time パッケージをインポート

```golang
import "time"
```


```golang
t := time.Now()
fmt.Println(t)           // => "2015-05-05 07:23:30.757800829 +0900 JST"
fmt.Println(t.Year())    // => "2015"
fmt.Println(t.Month())   // => "May"
fmt.Println(t.Day())     // => "5"
fmt.Println(t.Hour())    // => "7"
fmt.Println(t.Minute())  // => "23"
fmt.Println(t.Second())  // => "30"
fmt.Println(t.Weekday()) // => "Tuesday"
```


###任意のフォーマットに変換するには
```golang
const layout = "2006-01-02 15:04:05"
fmt.Println(t.Format(layout)) // => "2015-05-05 07:53:54"
```
上記layoutを適当な日時に変更しても動作はしない

上記layoutの　日時には何か意味があるのか・・？？

答えは単純にアメリカ式表記の順番で1,2,3・・・を並べた時の順番とのこと

"1月2日午後3時4分5秒2006年"
「RapidAPI」でAPIコールの実装を効率化

1. HPにアクセス：https://rapidapi.com/
<img width="1356" alt="file.png" src="https://qiita-image-store.s3.amazonaws.com/0/243652/560b09cf-8dea-7ce5-0219-97205c8d6e56.png">

2. コール対象のアプリとメソッドを選択（例：Slack）。すると、画面右側にコードが生成される。
<img width="1356" alt="file.png" src="https://qiita-image-store.s3.amazonaws.com/0/243652/d4ad22a1-2489-5b54-e497-28d4b58c370e.png">

3. 「Test Function」をクリックすると、レスポンスが表示される。
<img width="1356" alt="file.png" src="https://qiita-image-store.s3.amazonaws.com/0/243652/06280cff-bd98-af9c-260a-c360508d66c1.png">

4. 対象ファイルに組み込む。
<img width="1121" alt="file.png" src="https://qiita-image-store.s3.amazonaws.com/0/243652/b3a48dbe-bd49-4e63-0aa3-6354ee48c8eb.png">

5. ブラウザのデバッグ機能で、期待通りに処理が実行されていることを確認できる
<img width="1359" alt="file.png" src="https://qiita-image-store.s3.amazonaws.com/0/243652/74c601de-7771-f387-0e11-b63f3fc4c830.png">

6. 記事の例はJavascriptだが、他にも複数の言語が用意されている。
<img width="360" alt="file.png" src="https://qiita-image-store.s3.amazonaws.com/0/243652/ae314798-29f5-3908-54ea-938f0f431a65.png">

7. C#だとこんな感じ
<img width="413" alt="file.png" src="https://qiita-image-store.s3.amazonaws.com/0/243652/e0300393-4840-a963-c4ce-37f833057eae.png">

8. 「RapidAPISDK」ライブラリは、「Dashboard」＞「My Apps」でインストール方法を確認できる。
<img width="1356" alt="file.png" src="https://qiita-image-store.s3.amazonaws.com/0/243652/8f3d36ad-6795-240a-b0bb-12c5bc4b1fda.png">