OmniAICreator/Qiita-1.07M huggingface dataset:
【入門者向け】UiPath(RPA)でFlowchart作成

UiPath(RPAソフト)でシンプルなFlowchartを作成しました。入門者向けの1時間もあればできる簡単な内容です。
以下はUiPath関連記事です。
> - [初心者でもできるWindows10へUiPath(RPA)インストールと実行](https://qiita.com/FukuharaYohei/items/ddad329a4a7ad1f4313f)
> - [【入門者向け】UiPath(RPA)でExcel操作の基本](https://qiita.com/FukuharaYohei/items/7e83c80de05b88405c21)

#実行環境
- Windows10 Pro 64bit
- UiPath Studio Community Edition 2017.1.6522

#手順
##1. プロジェクト作成
メニューから「Start」を選択して、テンプレートから「Simple Process」を選択
![10.Start01.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/6b809078-74a7-7b52-ed35-571a61492fbf.jpeg)

プロジェクト名を入力
![10.Start02.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/31c6dded-d40a-bc0f-92b7-44588fe16863.jpeg)

##2. Flowchart定義
###2.1. 不要部分削除
Startを残して、他をすべて消します(枠ですべてを選択してDeleteキーを押して消しました)。
![20.Define01.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/13b596a4-1d23-79f2-7324-3a7c5846b542.jpeg)

###2.2. Input Dialog作成
Activitiesペインから Available -> System -> Dialog -> Input Dialog を選択して「Start」の下にドラッグアンドドロップします。
![20.Define02.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/72d91bf1-c208-3f5e-5e62-9214a1de72b0.jpeg)

作成されたInput Dialogを選択して、右側のPropertiesペインでResultの入力項目で右クリックして「Create Variable」を選択します。これで、Input Dialogで入力した値を変数として扱い、後続で使うことができます。
![20.Define03.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/36a65fe5-a4f8-79ce-428e-46aed69ccb4a.jpeg)

変数名を入力します。今回は"YourName"としています。
![20.Define04.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/4e495370-1a2e-8a2d-0004-48061f252231.jpeg)

###2.3. Message Box作成
Activitiesペインから Available -> System -> Dialog -> Message Box を選択して「Input dialog」の下にドラッグアンドドロップします。
![20.Define05.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/c87220ce-0015-c4d1-41f1-279888401cd1.jpeg)

Message boxを選択してダブルクリック。
![20.Define06.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/8232ccb2-0059-7f86-a0f6-7d4fa01451c5.jpeg)

Message boxに「"Hello" + YourName + "-san"」と入力して保存。YourName部分が変数で他は固定値です。
![20.Define07.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/f1929f0a-06f7-779d-e621-ae8e534fab7a.jpeg)

##3. 実行
「Run」ボタンを押して実行します。
最初にInput dialog画面が出るので「山田」と入力しておきます。
![30.Run01.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/534a4dd6-fd05-4660-0efb-eff9e9ef5d0f.jpeg)

入力した文字を使ったメッセージが表示されました。何ともお手軽です。
![30.Run02.JPG](https://qiita-image-store.s3.amazonaws.com/0/134273/dafecdc3-f06c-b2ee-2329-cd4225b8b377.jpeg)
NerdTreeでdotfileを表示させる設定

#概要
NERDTreeを使用する際、dotfileが表示されるようにしてみた。

##前提条件
vimと
NERDTreeをインストールしていること。

#設定方法
```:.vimrc
let NERDTreeShowHidden=1
```
.vimrcに一行追加するだけ

#変更前後の比較
カレントディレクトリにdotfileが複数ある状態でNERDTreeを開く。
<img width="1364" alt="スクリーンショット 2018-01-07 16.59.12.png" src="https://qiita-image-store.s3.amazonaws.com/0/98082/5b6b3e01-3c93-d783-a046-b97b58df7f16.png">

##変更前
通常状態で開くと、dotfileが表示されない。
（ユーザ名は黒く塗りつぶしてます。）
<img width="314" alt="スクリーンショット 2018-01-07 17.00.47.png" src="https://qiita-image-store.s3.amazonaws.com/0/98082/e48792ca-a6f9-d572-ad70-ab68f2fadc88.png">

##変更後
設定すると、dotfileが表示される。
<img width="312" alt="スクリーンショット 2018-01-07 17.02.55.png" src="https://qiita-image-store.s3.amazonaws.com/0/98082/b3545a63-3bc2-4999-2575-455f8235275b.png">

#参考
https://github.com/scrooloose/nerdtree
npmに自作ライブラリーを公開してみた

githubにライブラリーを公開するにあたり、ついでなんでnpmでインストールできると
かっこいいなー
と思いやってみるw

手順忘れないように備忘録として残しておく

# npmに登録
https://docs.npmjs.com/

開発者として登録
<img width="1055" alt="スクリーンショット 2018-01-02 18.07.59.png" src="https://qiita-image-store.s3.amazonaws.com/0/67017/d9141ae7-5da3-39ce-8aba-fca66d2772a5.png">
必要な情報を入力して
```Create an Account```をクリック

続いて、コマンドプロンプト（ターミナル）で下記を入力
```npm adduser```
こちらを入力すると
```Username: 
Password:
Email: (this IS public) ```
を聞かれるので入力すると開発者登録は完了です!!

# package.jsonの作成
package.jsonを用意することでライブラリの依存関係やライブラリ自体の情報を明確にしやすくなります。

必須なのは以下
- name
->パッケージの名前 
他のパッケージと同じものは使えません。
- version
->パッケージのバージョン 
「0.0.X」このような形式になります。


記入例：

```
{
  "name": "パッケージ名",
  "version": "X.X.x",
  "main": "主となるスクリプトファイルを記載",
  "description": "パッケージの説明文",
  "keywords": [
    "パッケージに関する単語",
    "検索で見つかりやすくなります"
  ],
  "author": "著者",
  "license": "ライセンス",
  "dependencies": {
    "依存関係のパッケージ"
  }
}
```

# ライブラリの登録
上記、package.jsonのあるディレクトリで
```npm publish```
を入力で完了です。

やってみると意外と簡単に自作ライブラリーが公開できます!!
みんなで公開してオープンソースを盛り上げて技術の向上に貢献したいですね。

参考：
https://www.monster-dive.com/blog/web_creative/20170908_001666.php
max and min method using numpy in more than 2 dimensions

```python
print("====intro.====")
A = np.random.randint(0,9,30).reshape(5,6)
print(A)
print(A.max(axis=1))
print(A.min(axis=0))
```
* e.g.

```
====intro.====
[[0 7 5 0 5 3]
 [5 1 6 4 3 4]
 [2 5 0 1 0 6]
 [8 2 1 8 3 6]
 [0 7 1 0 4 6]]
[7 6 6 8 7]
[0 1 0 0 0 3]
```
【Jenkins】さくっと動かしてみる

#Jenkinsを動かす
公式の[Jenkinsレポジトリ](https://github.com/jenkinsci/docker)をcloneしてくる。

```
git clone https://github.com/jenkinsci/docker.git
```

コンテナを立ち上げる。
方法は2通りあり、dockerコマンドを使う方法と、docker-composerを使う方法がある。
公式ドキュメントではdockerコマンドを使う方法が紹介されていたが、個人的にはdocker-composerの方が使いやすいと思う。
(方法1)

```
cd docker
docker run -p 8080:8080 -p 50000:50000 jenkins/jenkins:lts
```
(方法2)

```
cd docker
docker-compose up -d --build
```

「http://localhost:8080/」へアクセスをする。
そうするとパスワードの入力が求められるので、Jenkinsコンテナへ入ってパスワードを取得する。
<img width="997" alt="スクリーンショット 2018-01-07 16.48.49.png" src="https://qiita-image-store.s3.amazonaws.com/0/127811/1cae3838-c7ec-88eb-2829-c8d920e4d25b.png">


まず、Jenkinsコンテナの名前を取得する。

```
docker ps
```

以下の結果が得られるのでコンテナ名を確認する。

```
CONTAINER ID        IMAGE                 COMMAND                  CREATED             STATUS              PORTS                                              NAMES
a70a9c3d4b73        jenkins/jenkins:lts   "/bin/tini -- /usr..."   3 minutes ago       Up 3 minutes        0.0.0.0:8080->8080/tcp, 0.0.0.0:50000->50000/tcp   quizzical_liskov
```

コンテナ名は「quizzical_liskov」なので、これを利用してコンテナへ入る。
（方法1の場合はコンテナ名は変わります。方法2の場合はコンテナ名は「docker_master_1」です）

```
docker exec -it quizzical_liskov /bin/bash
```

パスワードをみる。

```
(コンテナの中)more /var/jenkins_home/secrets/initialAdminPassword
```

このパスワードを入力すれば、、、キマシタ！
<img width="993" alt="スクリーンショット 2018-01-07 16.50.13.png" src="https://qiita-image-store.s3.amazonaws.com/0/127811/77103eb7-a679-35ad-6f74-a0438ad9890a.png">

こだわりはないのでとりあえず「Install suggested plugins」を選択します。
そうすると、いろいろと設定をしてくれるので待ちます。5分くらい待ちました。

Adminのアカウント作成画面が出てくるのでアカウント作成を行えば、
「Jenkins is ready! Your Jenkins setup is complete.」という嬉しいお言葉が出てくるので、これでセットアップ完了です。
<img width="1213" alt="スクリーンショット 2018-01-07 17.01.06.png" src="https://qiita-image-store.s3.amazonaws.com/0/127811/8948db1f-6eb2-c2d4-a8d7-b655e74a3468.png">
webpackによる環境依存の設定ファイル

開発用の設定ファイルと本番用の設定ファイルをwebpackで切り替える方法について。

# 仕組み

```javascript:webpack.config.js
plugins: [
  new webpack.ProvidePlugin({
    config: function() {
      if (process.env.NODE_ENV === 'production') {
        return './production.js';
      } else {
        return './development.js';
      }
    }(),
  }),
],
```

```javascript:config/development.js
export const url = 'http://localhost:3000/';
```

```javascript:config/production.js
export const url = 'http://192.168.0.1:3000/';
```

```javascript:config/index.js
export const url = config.url;
```

eslintを使用している場合、"config"の記述でエラーとなるため、以下を追加する。

```js:.eslintrc
  "globals": {
    "config": true
  }
```

# 使用方法

```javascript
import Config as '../config'

export const test = () => (
  console.log(Config.url)
);
```
監視、セキュリティ

# 8章 監視
## 相関ID
- 同じ呼び出しのフローで呼び出された複数のサービス間で共通のIDを設定する
    - ログ追跡を可能にするために必要
    - イベント駆動アーキテクチャパターンの場合は特に有効
- thin共有クライアントラッパーライブラリの利用が望ましい
    - 全員が同じように下流のAPIを適切に呼び出すようにするため

## 標準化
- ログ出力の形式は標準化する
    - メトリックを集約する場合に都合が良い
    - 追跡が容易になる
    - logstash, collectd, Graphite
    
## まとめ
- サービスを分割したことによって、単一のサービスの場合と異なる課題が出てくる
- ユーザの1アクションに対して収集すべきログが複数箇所に発生するので、追跡可能性を考慮する
- サービス間の標準化を検討する

# 9章 セキュリティ
## サービス間の認証と認可
- 認証のパターン
    - 境界内のすべてを許可する
        - ネットワーク境界でのセキュリティを保証する
        - 攻撃者がネットワークに侵入すると、中間者攻撃に対する防御はない
        - リスクを考慮して採用しないと心配
    - HTTP(S)ベーシック認証
        - ユーザ名とパスワードを安全に送信するためHTTPS上での利用が望ましい
        - 複数マシンを管理する場合は、SSL証明書の管理が問題になる
        - SSL経由で送信されるトラフィックをリバースプロキシでキャッシュできない
            - LBでSSLトラフィックを終端し、背後にキャッシュを配置することで解決できる
        - クライアントがユーザ名とパスワードを持っていることしかサーバにはわからない
            - ネットワーク上の誰もが送信できる
    - SAMLやOpenID Connectの利用
        - すべてのネットワーク内トラフィックをゲートウェイ経由にする
        - すべてのサービスのアクセス制御を中央のディレクトリサーバに集中させることができる
        - クライアントのアカウントを各サービスが持つ必要がある
            - アカウントは狭い範囲で使うようにすること
            - 認証情報を安全に格納する必要がある
            - 認証のコーディングに工数が必要
    - クライアント証明書
        - 多数の証明書管理が課題になる
        - 証明書の取り消しや再発行の難しさ
        - インターネット経由で重要な情報の通信の保護の場合などに使う
    - HTTP上のHMAC
        - HMAC（Hash-based Message Authentication Code）を使ってリクエストを署名する
        - リクエストボディと秘密鍵をハッシュ化する
        - サーバ側では、ハッシュが一致したらリクエストを許可する
        - 欠点
            - 秘密鍵を変更する場合
            - 優れた既存の実装がない
            - リクエスト内容の覗き見は防いでいない
    - APIキー
        - 公開鍵と秘密鍵のペアを使う方法が一般的
        - 鍵を中央で管理する
        - ゲートウェイモデルが人気
        - システムの正確な実装が多様

##　混乱した代理の問題
- 悪意のある者が、代理サービスをだまして実行できてはいけない下流のサービスの呼び出しを実行させること
    - ex. 特定のアカウントでECサービスにログインし、別アカウントの顧客情報呼び出しを実行させる、など
- 代理サービスの信頼性の確保の問題があることを認識しておく
    - この問題は難しく、簡単な答えはない

## 暗号化は鍵がすべて
- 解決法
    - 別のセキュリティアプライアンスでデータの暗号化と復号を行う
    - 鍵が必要なときにアクセスできる別の鍵管理システムを使う(key vault)
- 独自の実装は避け、十分に調査する

## セキュリティの組み込み
- OWASPトップ10リスト
The sample of index using True or Flase array

```python
print("====intro.====")
A = np.arange(0,9,3)
print(A)
B = A[[False, True, True, False, False,True]]
print(B)

Z = np.random.randint(0,5,(10,3))
print(Z)
# solution for arrays of all dtypes (including string arrays and record arrays)
print("====all====")
A = Z[:,1:]
B = Z[:,:-1]
print(A)
print(B)
E = np.all(A == B, axis=1)
print(E)
print("====U====")
U = Z[~E]
print(U)
```
* e.g.

```
====intro.====
[0 3 6]
[0 3 3 0 0 3]
[[0 1 1]
 [2 4 0]
 [1 3 4]
 [0 4 3]
 [1 0 3]
 [3 3 0]
 [4 3 4]
 [2 2 2]
 [4 2 2]
 [1 2 0]]
====all====
[[1 1]
 [4 0]
 [3 4]
 [4 3]
 [0 3]
 [3 0]
 [3 4]
 [2 2]
 [2 2]
 [2 0]]
[[0 1]
 [2 4]
 [1 3]
 [0 4]
 [1 0]
 [3 3]
 [4 3]
 [2 2]
 [4 2]
 [1 2]]
[False False False False False False False  True False False]
====U====
[[0 1 1]
 [2 4 0]
 [1 3 4]
 [0 4 3]
 [1 0 3]
 [3 3 0]
 [4 3 4]
 [4 2 2]
 [1 2 0]]
```
# Refs.
* [NumPy配列のブールインデックス参照](https://hydrocul.github.io/wiki/numpy/ndarray-ref-boolean.html)
elastictranscoder自分用作業メモ

# 目的
s3に保存されているファイルをelastictranscoderで手動変換したい。

# 作業内容

## パイプラインを作成
[こちらのページを参考にさせていただきました。](http://blog.serverworks.co.jp/tech/2013/11/18/using-elastic-transcoder/)

## s3の状態を確認
バケットポリシー、暗号化、パブリックアクセスの設定などを開いておく必要がある。

## ジョブを作成、実行
[こちらのページを参考にさせていただきました。](https://dev.classmethod.jp/cloud/aws/amazon-elastic-transcoder-hls-versions/)

当初コンソールから設定してみたのですが
何やらエラーが出てcliの設定がローカルにあったので
コマンドから実行してみたらうまくいったのでjsonで指定するようにしました。

## 備考
jsonで拡張子を指定する際、大文字、小文字を厳密に判定する挙動でしたのでメモしておきます。
Stateless Componentを拡張する方法

Stateless Componentの初期処理などを実装したい場合の方法。
※Higher-Order Componentsを実装する。

```
import React from 'react';

const Test = props => (
  <div>
    {props.value}
  </div>
);

const TestWrapper = (StatelessComponent) => {
  class TestWrapperComponent extends React.Component {
    componentWillMount() {
      // ここに初期処理を記述する。
      this.props.testAction();
    }
    render() {
      return <StatelessComponent {...this.props} />;
    }
  }
  return TestWrapperComponent;
};

export default TestWrapper(Test);
```
Qiitaへの新規投稿

こんにちは。
Qiitaへの新規投稿の方法について（webブラウザ利用）、「新規投稿」用ボタンを押して書き始めます。

- 「新規投稿」用ボタンが表示されない場合には（下記例）、投稿方法はよく分かりません。
<img width="657" alt="スクリーンショット 2018-01-07 16.24.28.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/54617/897c8274-a223-25fd-9a8c-8c28faf6e54a.jpeg">

- その後、少し分かりました。ページ表示の横幅を広げて見てください（下記例）。
<img width="762" alt="スクリーンショット 2018-01-07 16.37.45.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/54617/85ad5ae4-9b43-b50e-cc42-ccd7d61b137d.jpeg">
vue.jsでフォームを作る

vue.js ver 2

# v-modelで値の受け渡し

```html
<div id="app">
  {{ message }}
</div>
```
```javascript
var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})
```

v-modelはelでつなげた要素の中にあるdataのプロパティと双方向でバインディングされる。

# フォームの値をvue.js以外に渡す

```javascript
var chat = new Vue({
  el: "#chat",
  data: {
    message: {
      user_id:'',
      board_id:'',
      contents:'',
    }
  },
  firebase: {
    talks: firetalks
  },
  methods: {
    addMessage: function(){
      firetalks.push(this.message)
      this.message.user_id = ''
      this.message.board_id = ''
      this.message.contents = ''
    }
  }
```

```html:index.html
<div class="form-inline" id="chat">
 <form v-on:submit.prevent="addMessage">
   <textarea v-model="message.user_id" class="hidden" value="1"></textarea>
   <textarea v-model="message.board_id" class="hidden" value=""></textarea>
   <input type="text" name="" v-model="message.contents" class="col-sm-8 form-control show_form">
   <button type="submit" name="button" class="btn btn-primary col-sm-3">送信</button>
 </form>
</div>
```
vue.jsのv-modelは別にデータを書き換えるようなメソッドを動かさなくても変更できる。ただfirebaseやrailsに値を渡したいときはmesodsを動かさないといけない。それはv-on:submit.prevent=で呼び出す。

# formの初期値をvue.jsに渡す方法

vue.jsは初期値を無視するという仕様のためよくrailsでやっているviewに初期値をしこみ、hiddenで隠して一緒にユーザーが入力した以外の値も飛ばすができない。pure jsで渡すしかなさそうだが下記の記事でまとめた。

https://qiita.com/you88/items/2051d48454038b78792d
Bootstrapのカルーセルで文字がチラつく（光る？）

## 現象
Bootstrapのカルーセルを使ってスライドショーを作成
スライドが切り替わるタイミングでaタグの文字列（リンク）が光って見える
よくよく見ると一瞬だけシャドウが付いたように文字がチラついていた

## 原因
Bootstrapの記事で同じような現象が中々見つけられなかった
ソースコード見たりして原因を探していたらCSSのTransformのバグっぽかった

[CSS Transformsで画面がちらつくときの対処法 - ゆめいろデザイン : フリーランス UIデザイナー Webデザイナー [東京]](https://yumeirodesign.jp/blog/201312/csstransforms_fixed.html)
[transformで画面がちらつく時 - Qiita](https://qiita.com/JumpeiSato/items/f7f50f6b62b5ed0761d5)

「`-webkit-backface-visibility:hidden;`」と「`backface-visibility:hidden;`」を指定
と記事に書いてあったのでやってみようとすると既にBootstrapの方で記述してくれている模様

チラついている部分のa要素に付けてみたりなどしてみても、結局変わらず・・・

ちょっと現象は違うけど、似たような状況でBodyに`-webkit-font-smoothing: antialiased;`を付けてみるといいよという記事を発見
[Safariでtransitionをかけると、文字が一瞬細くなるバグの解決法 - Qiita](https://qiita.com/sottar/items/a34664471ee9f2c62492)

やってみたけど、やはり変わらず・・・

とりあえず同じようにBodyにbackface-visibility付けてみるかーと思ったらチラつかなくなりました

ﾅﾝﾃﾞ

## 対策

```css
body {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
```

カルーセルは他のサイトでも使ってましたが、今回初めて発症しました
再現性がよく分からないですが、発症してしまったら試してみてください
dockerでプロジェクト名を指定する

## 概要
docker-compose.ymlを使ってコンテナを起動するとフォルダ名が初期値としてプロジェクト名となってしまい、フォルダ名を変えた場合に、プロジェクト名が勝手に変わってしまう。

そのため、どこで起動しても同じプロジェクト名にしたいとパラメータを調べた結果をメモしておく。

## docker-composeの場合
下記サイトを参考に、環境変数をセットする必要があるようです。

* http://docs.docker.jp/compose/reference/envvars.html

```bash:ターミナル
$ export COMPOSE_PROJECT_NAME=web && \
  docker-compose up -d
```

※「<font color=red>COMPOSE_PROJECT_NAME</font>」をセットすることで、プロジェクト名が指定できるようです。

もっと調べてみたら、「-p」オプションで指定できるようです。

* https://docs.docker.com/compose/reference/overview/

```bash:ターミナル
$ docker-compose -p web up -d
```

## 試してみる

```yaml:docker-compose.yml
version: '2'
services:
  httpd:
    image: httpd:2.4
    container_name: 'httpd'

  php:
    image: php:5.6-fpm
    container_name: 'php'

volumes:
  postgres-data:
    driver: local
  mysql-data:
    driver: local
  httpd-log:
    driver: local
```

コンテナ名を確認する。
※コンテナ名には、プロジェクト名の影響は無いみたい。

```bash:ターミナル
$ docker-compose ps 
Name               Command              State    Ports   
--------------------------------------------------------
httpd   httpd-foreground                Up      80/tcp   
php     docker-php-entrypoint php-fpm   Up      9000/tcp 
```

ネットワークの状況を確認する
※「web_」というプレフィックスが付いている(プロジェクト名が付加されている)

```bash:ターミナル
$ docker network ls
NETWORK ID          NAME                DRIVER              SCOPE
...
97c7b3be4894        web_default         bridge              local
...
```

ボリュームの状況を確認する
※「web_」というプレフィックスが付いている(プロジェクト名が付加されている)

```bash:ターミナル
$ docker volume ls
DRIVER              VOLUME NAME
local               web_httpd-log
local               web_mysql-data
local               web_postgres-data
```

## まとめ
プロジェクト名が変わると永続化しているボリュームが変わってしまうので、注意が必要。
出来る限り、プロジェクト名を意識して「-p」オプションを付けた方が無難な感じですね。
「docker-compose.yml」ファイルでプロジェクト名を定義できたらいいのに・・・できないのかな・・・？
Wio LTEで温湿度を測るまでの手順まとめ

## はじめに
IoT入門の足がかりとして、Wio LTEを使って温湿度を計測するところまでやってみたが、何箇所が躓いたところがあったので、ここにメモを残しておく。

## 環境
+ Mac OSX El Capitan(10.11.6)
+ Grove IoT スターターキット for SORACOM

## Wio LTEって
この記事を読んでるってことは、おそらくWio LTEで何かをしようと思ってる人だと思うので、あまり詳しくは書きませんが、主な特徴としては以下が上げられます。

+ Seeed社が開発しているマイコンモジュール
+ LTEモジュールが付属しているので、SIMを挿せばモバイル通信可能
+ `Arduino IDE`を使ってプログラミング＆ファーム書き込みが可能

私はソラコムが販売している[スターターキット](https://soracom.jp/products/#grovestarter_kit)を使いました。

## Lチカまでの作業
基本的には、Githubで公開されている環境構築手順がきちんとしているので、あまり困らずにLチカまでは行なえます。
[Arduino IDEのインストールとセットアップ](https://github.com/SeeedJP/WioLTEforArduino/wiki/Setup-ja)

※記事執筆時点では、動作確認用試供品として「MicroUSBケーブル」が付属してきますが、私の場合はこのケーブルが不良品でマイコンボードに刺さらず、無理に刺そうとして壊しそうになったので注意が必要かもしれません。（試供品なので、不良品対象外です）


## 温湿度計を動作させる
1. スターターキットに付属している`デジタル温湿度センサー`をGROVE（D38と書かれているソケットへ）経由で接続する。
2. Wio LTEをDFUモードで起動させる。
3. `Arduino IDE`のメニューから`ファイル`＞`スケッチ例`＞`Wio LTE for Arduino`＞`grove`＞`grove-temperature-and-humidity-sensor`を選択する。
4. 表示されたスケッチをマイコンボードへ書き込む。
5. Wio LTEを通常モード（runtime mode）で再起動させる。
6. シリアルポートが未設定の場合は、メニュー`ツール`＞`シリアルポート`＞`/dev/cu.usbmodem1411`を選択する。
7. 「シリアルモニタ」を選択し、シリアル通信ウィンドウを表示させる。 

※この「シリアルモニタの起動」で躓きました。
Vuexで再利用可能なモジュールの作り方

## 再利用可能なモジュールとは

* Vuexの[モジュール]の一種。
* シングルトンじゃないモジュール。
* OOP的に類推すると、普通のモジュールはシングルトンオブジェクトで、再利用可能なモジュールはクラス。

[モジュール]: https://vuex.vuejs.org/ja/modules.html

## 再利用可能なモジュールが役立つシーン

* コピペコードの回避
    * エラーの状態
    * ロード中/ロード済みの状態
    * これらは違う画面(モジュール)でも、storeの型が共通していることが多い。

## 再利用可能なモジュールの作り方

モジュールを再利用可能にするのは簡単で、`state`属性をオブジェクトから関数に書き換えるだけ。

```js
/**
 * 再利用可能なカウンターモジュール
 */
const counter = {
  namespaced: true,
  // stateが下記のようなオブジェクトだと、再利用できなくなるので注意
  //
  // state: {
  //   count: 0
  // },
  state() {
    return {
      count: 0
    };
  },
  actions: {
    increase({ state, commit }) {
      commit("setCounter", state.count + 1);
    }
  },
  mutations: {
    setCounter(state, newValue) {
      state.count = newValue;
    }
  }
};
```

ストアに組み込むときは、`modules`で宣言するが、キーをモジュール名にし値をモジュールにする。下記の例だと、再利用可能なカウンターモジュールを3つ作っている。それぞれ別の状態を持つ。

```js
/**
 * ストア
 */
const store = new Store({
  modules: {
    counter1: counter,
    counter2: counter,
    counter3: counter
  }
});
```

状態やアクションをコンポーネントにバインドするにはいつもどおり`mapState`と`mapActions`でできる。

```js
const app = {
  name: "app",
  computed: {
    ...mapState(["counter1", "counter2", "counter3"])
  },
  methods: {
    ...mapActions({
      increase1: "counter1/increase",
      increase2: "counter2/increase",
      increase3: "counter3/increase"
    })
  },
  template: `
    <div>
        <button @click="increase1">counter1 = {{ counter1.count }}</button>
        <button @click="increase2">counter2 = {{ counter2.count }}</button>
        <button @click="increase3">counter3 = {{ counter3.count }}</button>
    </div>
  `
};
```

ここで例示したコードは[CodePenのvuex reusing modules](https://codepen.io/suin/pen/KZyGPW)にて公開しているので実際に動作を確認できる。
ESLint v4.15.0

前 [v4.14.0] | 次 [v4.16.0]

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">ESLint v4.15.0 has been released: <a href="https://t.co/2I6huwUEBW">https://t.co/2I6huwUEBW</a></p>&mdash; ESLint (@geteslint) <a href="https://twitter.com/geteslint/status/949830295003508736?ref_src=twsrc%5Etfw">January 7, 2018</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

ESLint 4.15.0 がリリースされました。
小さな機能追加とバグ修正が含まれています。

質問やバグ報告等ありましたら、お気軽にこちらまでお寄せください。

> 🏢 [日本語 Issue 管理リポジトリ](https://github.com/eslint/eslint-jp)
> 👫 [日本語サポート チャット](https://gitter.im/eslint/eslint-jp)
> 🏢 [本家リポジトリ](https://github.com/eslint/eslint)
> 👫 [本家サポート チャット](https://gitter.im/eslint/eslint)

# 🚀 本体への機能追加

## [#9165]: messageId

ルール・プラグイン開発者向け。

従来は各検証ルールがエラーを報告する場合、`context.report({ node, message: "Oops!" })` のように、エラーメッセージを直接報告していました。この機能追加によって、次のように `messageId` を利用して、エラーメッセージを分離できるようになります。

```js:ルール
module.exports = {
    meta: {
        description: "Disallow 'foo' as identifier.",
        messages: {
            avoidName: "Avoid using variables named '{{name}}'.",
        },
        schema: [],
    },
    create(context) {
        return {
            Identifier(node) {
                if (node.name === "foo") {
                    context.report({
                        node,
                        messageId: "avoidName",
                        data: { name: "foo" },
                    });
                }
            }
        };
    }
};
```

```js:テスト
const RuleTester = require("eslint").RuleTester
const rule = require("../../../lib/rules/no-foo")

var ruleTester = new RuleTester()
ruleTester.run("no-foo", rule, {
    valid: [
        "bar",
        "baz",
    ],
    invalid: [
        {
            code: "foo",
            errors: [
                { messageId: 'avoidName', data: { name: "foo" } },
            ],
        },
    ],
})
```

エラーメッセージの i18n を行うための布石です。

詳細は[こちら](https://eslint.org/docs/developer-guide/working-with-rules#messageids)を御覧ください。

## [#9782]: CLIEngine#getRules()

エディタの拡張機能などのツール開発者向け。

`CLIEngine` クラスに、現在ロードされているルールの一覧を取得するメソッド `getRules()` が追加されました。

# 💡 新しいルール

特になし。

# 🔧 オプションが追加されたルール

## [#9752]: [indent] ignoreComments

インデント ルールにコメントを無視するオプションが追加されました。

# ✒️ `eslint --fix` をサポートしたルール

特になし。


[v4.14.0]: http://qiita.com/mysticatea/items/5a1ea63f71e51e334853
[v4.16.0]: http://qiita.com/mysticatea/items/a80b194312b830f16413
[#9165]: https://github.com/eslint/eslint/issues/9165
[#9752]: https://github.com/eslint/eslint/issues/9752
[#9782]: https://github.com/eslint/eslint/issues/9782
[#9999]: https://github.com/eslint/eslint/issues/9999
[indent]: http://eslint.org/docs/rules/indent
[xxxx]: http://eslint.org/docs/rules/xxxx

<!-- 
![JSCS Icon](http://jscs.info/favicon.ico) JSCS 互換ルールです。
-->
kubernetes登場人物まとめ

# はじめに

オーケストレーションツールであるkubernetes（クーべネティス）を勉強しようとしても、聞きなれない単語のオンパレードで、覚えることが多すぎて面喰らってしまう。
とにかく登場人物が多い。マンガのワンピース並みに登場人物が多く、パッと見ただけではよくわからない。ドラゴンボール世代には辛い。
一個一個整理したい。

# 特徴
様々なアプリケーション、ミドルウェア、ストレージなどで構成されているシステムを構築、設定、運用するのに必要な自動化を行ってくれる。
kubernetesが自動スケールや死活監視も行う。

数あるオーケストレーションツールの中でもkubernetesの場合はコンテナに特化している。
コンテナ同士の関係性の明示的な記述し、サービスディスカバリを容易に行う事ができる。

コンテナがいつどこで実行されるのか、コンテナ同士の関係性に基づいた形でのスケジューリングの管理できる。

Terraformなどのプロビジョニングツールの場合は各環境に合わせた書き方をする必要がある。
kubernetesの場合は、環境の近いを吸収してくれる。

オーケストレーションというのは複雑なものだが、
kubernetesの場合はその複雑さを抽象化、簡素化するためにkubernetesの「用語」を生み出した。（用語というか、登場人物というべきか）

kubernetesが難しいと言われている点はまさにこれ。
しかし、一度「用語」を理解してしまえば、グッと理解しやすくなる。


# Node
VMや物理サーバを指す。サーバのIPが付与される。

# Cluster
Nodeの集合体。

kubernetesのデーモンはClusterやコンテナの実行状況の管理、
kubernetesが実行されている環境の橋渡しをする。

# Pod
ユーザーから見ると、Podが1つのVM。コンテナはそこで動いているプロセスに近い。

Podはkubernetesのデプロイの最小単位。
Podは1つ以上のClusterの集合体。Node常に展開される。
Pod内で指定されたコンテナ群はすべて同時にデプロイされる。

Pod内部のコンテナはIPやポートを共有。
そのため、同じポートにバインドするコンテナを同じPodに複数載せることはできない。

また、Podは自らの情報以外を管理できない。複数のPodを制御するには、それ用のリソースが必要。
コントローラーという機能がこれを解決する。


# Label
登録された定義に基づき、自動的に初期化、デプロイされる。
一般的にランダムな名前が自動的に割り与えられる。
リソースに付与する任意の文字列。タグに近い。Labelには名前と、値がある。

何らかの作業を行う際、特定の名前と値を指定すれば該当するLabelを持つすべてのリソースに対して一括で操作することができる。

# Service
複数のPodで構成された集合体。serviceがお互いを見つける仕組み。

kubernetesでserviceを作成すると、
kubernetesが管理しているDNSサーバに必要なレコードが作成される。
ここで作った名前がPod間で使われる。

いくつかServiceの種類があるので紹介

|名前|概要|
|:--|:--|
|ClusterIP|クラスタ内で有効なDNSやVIPで複数のPodと紐付ける|
|NodePort|ClusterIP Serviceを作成。Node上の静的なポート番号で公開|
|LoadBalancer|NodePort Serviceを作成。ロードバランサを作成して紐付ける。|
|ExternalName|外部サービスを利用したい時に、DNSのCNAMEを利用。クラスタの内部向けにエイリアスを作成|
|Headless|StatefulSetを利用する際に使う。|

基本的にkubernetes内部のアクセスを処理する時に使う。

# Ingress
Podへのアクセスをhttpプロキシする。
Serviceに紐付き、通信内容をServiceにプロキシする。

# Volume
データの格納領域を指す。外部ストレージをVolumeとしてコンテナにマウントできる。

Nodeに領域を確保する場合はemptyDir Volumeを使う。
Podのコンテナは同じNode上に展開される。Volumeに書いたデータはPod間で共有できる。

ただし、Podを削除するとemptyDirは削除される。
これを回避するためにNFSやcloud storage(PersistentVolume)
)を使うことも可能。


# ConfigMap/Secret
イメージそのものにアプリケーションの設定を書き込むと、
設定変更の度に新しいイメージを作成しなければならない。
それを回避すべく、各種設定とコンテナに展開されるプログラムは切り離してデプロイでいるようにする。

kubernetesではConfigMap/Secretを利用する。

|名前|概要|
|:--|:--|
|ConfigMap|平文の設定ファイル|
|Secret|エンコードされている。ただし、kubernetesにアクセス可能なユーザなら中身が見えてしまう。※セキュアな情報を入れれる場合はRBACを使う|

# 水平スケーリングデプロイ

特徴として各Podがステート(状態)を意識しない。
完全なクローンで構成されている

# ReplicaSet
Podのスケール制御するのに使う。

templateという項目に定義されたPodの定義から、
replicasという項目で指定された個数分だけPodを作成、起動する。


（まだまだ登場人物がいるので、後ほど編集予定）
flowtypeについて

# flowとは
javascriptの型チェックライブラリ。

# flowの型定義ファイルの取得
package.jsonに記載された各ライブラリについての、flowの型定義ファイルを取得する。
取得した型定義ファイルはflow-typedディレクトリ内に格納される。
型定義ファイルが無い場合、ライブラリをimportしたときにflowの型チェックエラーとなる。

```
yarn global add flow-bin ※初回のみ実施
.\node_modules\.bin\flow-typed install
```

# flowの適用
ソースの冒頭に以下のコメントを記述するとflowの型チェックが有効となる。

```
// @flow
```

# ReactコンポーネントのPropsをflowでチェックする

type Propsの中にPropsの型を定義する。

```
import TestClass as './TestClass';

type Props = {
  name: string,
  age?: string,
  action: any,
  ...$Exact<Props>,
  testClass: TestClass,
};

const Sample = (props: Props) => (
  <div>
    {props.name}
    <button onClick={() => props.action()}>Button<\button>
    <ChildSample {...props} />
    {props.testClass.age()}
  </div>
);

export default Sample;
```

- functionはany型
- propsの展開({...props})は、...$Exact<Props>型
- 独自オブジェクト(例で言うTestClass)は、オブジェクトをimportして型定義する。
- 必須でないプロパティは、age?のように末尾に?を付ける。
- コンポーネントの引数に(props: Props)と書いて、Props型とprops変数を紐づける。

# eslintの設定

eslintを使用している場合、flowでチェックエラーとならないよう、.eslintrcを修正する。

```js:.eslintrc
  "extends": [
    ・・・
    "plugin:flowtype/recommended"　←追加
  ],
  "plugins": [
    "flowtype"
  ],
  "rules": {
    "flowtype/no-types-missing-file-annotation": 0,
    "flowtype/define-flow-type": 1,
    "flowtype/use-flow-type": 1,
    "react/prop-types": [off],
    "react/default-props-match-prop-types": [off]
  },
```
[Swift] 配列を要素数numの配列の配列に変換する

いつどこでなぜ使うのかよくわかってませんが、できてしまったので記しておきます。
多分 O(N) です。

```swift
extension Array {
    
    /// 配列を要素数が num の配列の配列にする
    ///
    /// let array = [1, 2, 3, 4, 5]
    /// let splited = array.split(num: 2)
    /// print(splited)
    /// // Prints "[[1, 2], [3, 4], [5]]"
    ///
    /// Complexity: O(N)
    func split(num: Int) -> [[Element]] {
        
        /// 配列を半分に分けて前半後半それぞれをもう一度半分に分ける
        /// これを要素数が num 以下になるまで繰り返す
        
        // countはO(N)なので定数に押さえておく
        let count = self.count
        
        // 要素数が num 以下の時　除算の回数を減らすため早期return
        if count <= num {
            
            return [self]
        }
        // 要素数が 2 * num 以下の時　除算の回数を減らすため早期return
        if count <= num * 2 {
            
            return [Array(self[0..<num]), Array(self[num...])]
        }
        
        // 前半の要素数が num の整数倍になるように分割点を求める
        let splitPoint = Int(count / num / 2) * num
        
        switch splitPoint {
            
        // 前半の要素数が num の時
        case num:
            return [Array(self[0..<num])]
                + Array(self[num...]).split(num: num)
            
        // 前半の要素数が num 以上の時
        case (num...):
            return Array(self[0..<splitPoint]).split(num: num)
                + Array(self[splitPoint...]).split(num: num)
            
        default:
            fatalError("ここには到達しない")
        }
    }
}
```
blobxferでAzure Blob Storageにファイルを一括転送する


[blobxfer](https://github.com/Azure/blobxfer)というコマンドラインツールを使用することで、rsyncのような要領でローカルファイルをAzure Blob Storageへ一括転送することができます。

## インストール

```sh
$ pip install blobxfer
```

## 転送

下記のようにアカウント情報と転送元・転送先を指定して`blobxfer`コマンドを実行すると、転送元ディレクトリの内容が一括転送されます。

```sh
$ blobxfer upload \
  --storage-account ${ACCOUNT} \
  --storage-account-key ${ACCOUNT_KEY} \
  --local-path ${DEST} \
  --remote-path ${DEST}
```

また、`--delete`オプションを指定すると、`rsync --delete`した場合と同様に転送元に存在しないファイルを転送先から削除することができます。

## 実行例

下記はローカルのsrcディレクトリの内容をAzure Blob Storageのdestコンテナへ転送する実行例です。

```sh
$ blobxfer upload --storage-account mytestaccount --storage-account-key $KEY --local-path src --remote-path dest --delete
2018-01-07 14:23:12.651 INFO -
============================================
         Azure blobxfer parameters
============================================
         blobxfer version: 1.0.0
                 platform: Darwin-17.3.0-x86_64-i386-64bit
               components: CPython=3.6.3 azstor.blob=0.37.1 azstor.file=0.36.0 crypt=2.1.4 req=2.18.4
       transfer direction: local -> Azure
                  workers: disk=8 xfer=16 md5=0 crypto=0
                 log file: None
              resume file: None
                  timeout: connect=3.1 read=12.1
                     mode: StorageModes.Auto
                  skip on: fs_match=False lmt_ge=False md5=False
        delete extraneous: True
                overwrite: True
                recursive: True
            rename single: False
         chunk size bytes: 0
           one shot bytes: 0
         strip components: 0
         store properties: attr=False md5=False
           rsa public key: None
       local source paths: src
============================================
2018-01-07 14:23:12.652 INFO - blobxfer start time: 2018-01-07 14:23:12.652387+09:00
2018-01-07 14:23:12.653 DEBUG - spawning 8 disk threads
2018-01-07 14:23:12.679 DEBUG - spawning 16 transfer threads
2018-01-07 14:23:14.389 DEBUG - 0 files 0.0000 MiB filesize and/or lmt_ge skipped
2018-01-07 14:23:14.389 DEBUG - 57 local/remote files processed, waiting for upload completion of approx. 0.2920 MiB
2018-01-07 14:23:14.406 DEBUG - attempting to delete extraneous blobs/files from: mytestaccount;core.windows.net;dest
2018-01-07 14:23:14.475 INFO - deleted 1 extraneous blobs/files
2018-01-07 14:23:14.475 INFO - elapsed upload + verify time and throughput of 0.0003 GiB: 1.474 sec, 1.5849 Mbps (0.198 MiB/s)
2018-01-07 14:23:14.475 INFO - blobxfer end time: 2018-01-07 14:23:14.475699+09:00 (elapsed: 1.823 sec)
```
R で行ごとに要素を総数で割る

R で行ごとに要素を総数で割りたい。

例えば次のような行列があったとする。

```r:R
> mat <- matrix(1:6, 3, 2)
> mat
     [,1] [,2]
[1,]    1    4
[2,]    2    5
[3,]    3    6
```

1行目は 1+4=5 なので 1/5 と 4/5、2行目は 2+5=7 なので 2/7 と 5/7　というように行ごとに `sum` した値で各行の要素を割りたい。

普通に書くとこんな感じになると思う。

```r:R
> t(apply(mat, 1, function(row) row / sum(row)))
          [,1]      [,2]
[1,] 0.2000000 0.8000000
[2,] 0.2857143 0.7142857
[3,] 0.3333333 0.6666667
```

しかし、もっと良い書き方がある。

```r:R
> mat / rowSums(mat)
          [,1]      [,2]
[1,] 0.2000000 0.8000000
[2,] 0.2857143 0.7142857
[3,] 0.3333333 0.6666667
```

こちらの方が簡潔でしかも速い。

```r:R
> library(microbenchmark)
> microbenchmark(
+   `use apply` = t(apply(mat, 1, function(row) row / sum(row))),
+   `use rowSums` = mat / rowSums(mat)
+ )
Unit: microseconds
        expr    min     lq     mean  median      uq      max neval cld
   use apply 19.159 20.645 32.06376 21.0920 21.5540 1072.263   100   b
 use rowSums  2.623  3.034  3.68557  3.5825  3.8215   16.668   100  a 
```

ちなみに列ごとだと次のようになる。

```r:R
> microbenchmark(
+   `use apply` = apply(mat, 2, function(col) col / sum(col)),
+   `use colSums` = t(t(mat) / colSums(mat))
+ )
Unit: microseconds
        expr    min      lq     mean median      uq      max neval cld
   use apply 15.303 17.0210 32.31973 17.538 18.0725 1456.862   100   a
 use colSums  8.499  8.9665 10.94210 10.182 10.6365   62.848   100   a
```

Enjoy!
C++erに送るPythonの関数引数について

# 前提

ここに書かれているのは他に解説しているサイトがあります。
Pythonの勉強のために個人的にまとめているメモ程度の情報しかありません。

ここではPython3系の話をします。

# 引数について

ここで扱うのは関数の引数についてです。
私が罠にはまったのでまとめました。

感想
「＊」が**可変長の引数**というのは何となくわかりましたが、
「＊＊」が**パラメータ可変長の引数**というのは直感的でないように思いました。

なお、詳細は下記のサイトを参照
https://qiita.com/raviqqe/items/ee2bcb6bef86502f8cc6

## 「*」はポインタではありません。

```sample.py

def foo(*hoge):
    """ 引数をプリントするだけの関数
    """
    print(hoge)

```

この場合、「引数にポインタを指定する」関数ではありません。
可変長の引数指定になります。
引数はタプルで取得できます。

```sample2.py

foo(1,2,3)
>>> (1,2,3) #実行結果　引数はタプル

```
リスト内の要素を可変長に渡す場合は”ポインタ”の実態ぽく渡せばよい

```sample2.py
bar = [1,2,3]
foo(*bar)
>>> (1,2,3) #実行結果　引数はタプル

```

## 「**」はポインタのポインタではありません。

``` sample3.py
def foo(**hoge):
   """ 引数をプリントするだけの関数
   """
   print(hoge)

```
この場合、「ポインタのポインタを渡す」関数ではありません。
パラメータ可変長引数の関数です。
ディクショナリで取得可能です。

``` sample4.py

foo(a=1,b=2,c=3)
>>> {'a':1,'b':2,'c':3} #実行結果　引数はディクショナリ
```

ディクショナリをパラメータ可変長引数に渡す場合は”ポインタのポインタ”ぽく渡せばよい

``` sample5.py

dic={'a':1,'b':2,'c':3}
foo(**dic)
>>> {'b': 2, 'a': 1, 'c': 3}
```

## デフォルト引数の罠

「ミュータブル、イミュータブルについて知っていないとはまっちゃうよ」の典型例

詳細は下記参照
https://qiita.com/yuku_t/items/fd517a4c3d13f6f3de40

デフォルト引数にイミュータブルを指定した場合

``` sample6.py

def foo(*, x="hoge"):
    """ 引数にfugaを加えて返す関数
    """ 
    x+="fuga"
    return x

print(foo())
print(foo())
print(foo())

>>>hogefuga
>>>hogefuga
>>>hogefuga
```

デフォルト引数にミュータブルを指定した場合

``` sample7.py
def foo(*, x=['hoge']):
    """ 引数にfugaを加えて返す関数
    """ 
    x.append('fuga')
    return x

print(foo())
print(foo())
print(foo())

>>>['hoge', 'fuga']
>>>['hoge', 'fuga', 'fuga']
>>>['hoge', 'fuga', 'fuga', 'fuga']

```

リストをデフォルト引数として使う場合は注意しましょう。
というかやんないほうがいい。
resourcesのarray要素からresource idsを取得する

##概要
res/values/arrays.xml 内部に drawable の array を作成した場合などに、resources の array 要素から resource ids を取得する extension です。

```kotlin:間違いの例
// drawable の resource id が返らず配列の各要素が 0 になる
val bannerImageResourceIds: IntArray =
    resources.getIntArray(R.array.banner_drawables) 
```

##使用例
```res/values/arrays.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <array name="banner_drawables">
        <item>@drawable/banner_0</item>
        <item>@drawable/banner_1</item>
        <item>@drawable/banner_2</item>
    </array>
</resources>
```
```kotlin:R.array.banner_drawablesからdrawableのid群を取得する
val bannerImageResourceIds: IntArray = 
    resources.getIds(R.array.banner_drawables)
```

##ソース
```kotlin
/**
 * Returns resource ids from the array resource id.
 */
fun Resources.getIdList(arrayResourceId: Int): List<Int> {
    with(obtainTypedArray(arrayResourceId)) {
        try {
            return (0 until length()).map { getResourceId(it) }
        } finally {
            recycle()
        }
    }
}

/**
 * Returns resource ids from the array resource id.
 */
fun Resources.getIds(arrayResourceId: Int): IntArray {
    return getIdList(arrayResourceId).toIntArray()
}

/**
 * Returns the resource id.
 * @throws IllegalStateException when the resource id does not exist.
 */
fun TypedArray.getResourceId(index: Int): Int {
    return getResourceId(index, 0).apply { if (this == 0) throw IllegalStateException("resourceId not found.") }
}
```

##あとがき
Android では Bundle でプリミティブの配列を使うことが多いので IntArray を使うケースが多いように思えます。しかし List<Int> で扱う際に toList() を呼ぶのがめんどくさいので両方作ってみました。ちゃんと作るなら、IntArray 版は生成時に List を介在させないようにしたほうがよさそうですね。
コマンドラインでsendmailの動作確認

# sendmailの動作確認のメモ

## コマンド

```
echo -e "From: <from@domain.com>\nTo: <to@google.com>\nSubject: title\n\nbody" | sendmail -t to@google.com
```

## ログ

```
/var/log/maillog
```

maillogがない場合はrsyslogを再起動してみる。

```
systemctl restart rsyslog
```

```
Failed to restart rsyslog.service: Unit not found.
```

となる場合はrsyslogをインストールして起動する。

```
yum -y install rsyslog
systemctl start rsyslog
```

アプリからメールを送った際にmaillogに以下のような警告が出る場合は

```
Authentication-Warning: localhost.localdomain: nginx set sender to
```

信頼済ユーザとして`/etc/mail/trusted-users`に`nginx`を追記する

```
echo nginx >> /etc/mail/trusted-users
```

## メモ

ゲストOS上のログでstat=Sentとなっており、送信成功しているが、メールが届かない場合はOP25Bの設定がされている可能性がある。


例）gmail

ホストOS(windows)またはゲストOSで

```
telnet smtp.gmail.com 25
```

接続できなければプロバイダによりOP25B設定がされているので587（Submissionポート）で接続する設定を行う必要がありそう。検索すると設定方法が出てきますが認証設定が必要なので少し手間がかかる。
ざっくばらんメモ_19：kaggle


###kaggle recruit challenge
[code](https://github.com/festa78/kaggle_recruit_rest)
Kernelを見て、公開されているコードなどを元に
前処理と後処理を更新。
またknnとgradient boostingを追加したensembleを構築した。
結果LB0.482（161位）まで向上。
ここから先色々パラメータをいじるも性能向上はせず。
なんでしょう？（小ネタ）

いきなりコード

```csharp:問題
static void Main(string[] args)
{
    var a = /* ここに何かが入ります */;
    var b = a;
    Console.WriteLine(b == a);
}
```

で、実行結果。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/177593/2ad26062-9914-34da-a55d-8b6cbeaa3598.png)

さて、aには何が代入されたでしょうか？

｜
｜
｜
｜
｜
｜
｜
（これぐらいスクロールすれば大丈夫かな？
｜
｜
｜
｜
｜
｜
｜

```csharp:正解
static void Main(string[] args)
{
    var a = double.NaN;
    var b = a;
    Console.WriteLine(b == a);
}
```

というわけで、正解はNaN（なん）でした。
（NaNでしょう？NaNでした。ダジャレかよ。

それはさておき、NaNも含めて等しいかを判定するにはEqualsを使いましょう。

```csharp
static void Main(string[] args)
{
    var a = double.NaN;
    var b = a;
    Console.WriteLine(b.Equals(a));
}
```
![image.png](https://qiita-image-store.s3.amazonaws.com/0/177593/9b60d7b1-c478-2706-5256-6f32ba112376.png)

正しく判定できました。
ubuntu desktop に postgresql をインストールする

この記事は、ubuntu desktop に postgresql をインストールして、Windowsマシンからアクセスできるようにする手順について記載したものです。

(1) postgresql をインストールします。
 $ sudo apt-get install postgresql

(2) pg_hba.conf ファイルを検索して、編集します。
 $ sudo find / -name pg_hba.conf
 $ sudo vi /etc/postgresql/10/main/postgresql.conf

(3) 以下の内容を追記します。
 ～
 # IPv4 local connections:
 host all all 127.0.0.1/32 trust
 host all all 192.168.179.0/24 trust  <-- これを追加(※1)

(※1) クライアント側からアクセスされるIPアドレスに対して設定しています。
　　　こちらの環境では、192.168.179.X からのアクセスを許可する設定にしています。

(4) postgresql のサービスを再起動します。
 $ sudo service postgresql stop
 $ sudo service postgresql start

(5) Windowsマシン から postgresql にアクセスする。
pgAdmin をインストールして、以下の手順で ubuntu desktop側 の postgres を追加します。
1.ファイル -> サーバの追加 をクリックします。 
![image.png](https://qiita-image-store.s3.amazonaws.com/0/157744/93da9ac7-af05-bceb-52a5-d70304afbce9.png)

2.ubuntu desktop側の情報を入力します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/157744/aa50c0f3-cdf5-6ab6-4eca-1d3d7e1b50da.png)

3.これで ubuntu desktop 側の postgres が表示されました。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/157744/337b0562-03f1-859d-6109-d63db32820f9.png)
transformを使ってアニメーションするとき平行移動translationXと縮小scaleXを同時に動かすことができない

transformは.concatienatingで同時に二つできるらしい。

平行移動と縮小を同時にアニメーションしようとしたが、縮小だけされるが、ちゃんと平行移動はされていない？






追記----------------------------------
2018/01/12

同時に動きますよと教えてもらったので、動かしてみました。


<img src="https://qiita-image-store.s3.amazonaws.com/0/197731/72f10088-0636-e0e3-7166-789679c4e013.gif" width="100">

確かに動いています。


うーん　自分のでは動いてない気がする...


少し教えてもらったものの数値を変えてみた。
まず図形が拡大縮小しているのを、縮小だけに変えてみた。

let scale = CGAffineTransform(scaleX: 0.1, y: 0.1)


<img src="https://qiita-image-store.s3.amazonaws.com/0/197731/7ccdce8b-b043-1784-05ac-f162085478e8.gif" width="100">

ちゃんと動いてる...


変形の順番を変えてみると...
v.transform = scale.concatenating(trans)
のところを
v.transform = trans.concatenating(scale)
に変えてみる


<img src="https://qiita-image-store.s3.amazonaws.com/0/197731/3678e81e-482c-b384-8450-7df9bb6c13b8.gif" width="100">


動かない！！

平行移動の
let trans = CGAffineTransform(translationX: 200, y: 200)
の部分は変更していないのに、変形の順番を変えると動かなくなっている？

平行移動する幅まで縮小されている？
エラー文まとめ（vue.js、firebase、rails、yarn）

# vue.js周り

# rails周り

## NameError - uninitialized constant Object::Something

モデルの名前を単数形にしていないときに出たエラー

## Your Yarn packages are out of date!

```
========================================
  Your Yarn packages are out of date!
  Please run `yarn install` to update.
========================================


To disable this check, please add `config.webpacker.check_yarn_integrity = false`
to your Rails development config file (config/environments/development.rb).


yarn check v1.3.2
error Lockfile does not contain pattern: "firebase@^4.8.1"
error Lockfile does not contain pattern: "vuefire@^1.4.5"
error Found 2 errors.
info Visit https://yarnpkg.com/en/docs/cli/check for documentation about this command.
```

* webpack
* vue.js
* yarn

この構成で開発していたら上記のエラーが出た。意味はyarnの中のパッケージに古いものがあるとのこと。

```
yarn install
```

でパッケージをインストールして

https://github.com/rails/webpacker/blob/master/README.md

ここにあるようにconfig/environment/development.rbに下記追加で解決

```
config.webpacker.check_yarn_integrity = false
```

## You are using the runtime-only build of Vue where the template compiler is not available.

```
vue.runtime.esm.js:574 [Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

(found in <Root>)
```

https://qiita.com/you88/items/62e0314243841dd08ccf

ここにまとめているように完全ビルドにしてねというエラー。

```
import Vue from 'vue/dist/vue.esm';
```

を冒頭に入れて解決。

## ActiveModel::UnknownAttributeError (unknown attribute 'sns_id' for Post.):

sns_idというattributeが不明というもの。このケースではrails db:migrateがうまくいってなくてカラムが追加できていなくてactive recordにsns_idが追記されていなかったのが原因だった。rails db:migrateをやり直したら直った。
railsにvue.jsを入れる（webpackerとassetpipelineの両立）

# webpackerとassetpipeline

railsにはassetpipelineと言ってjavascriptやらcssやらをまとめてくれて通信のやり取りの回数を少なくしてくれる機能があります。しかし、vue.jsはbodyのとじタグ直前でないと動かない場合もあるのでwebpackerを使っていいタイミングで読み込んでもらうようにする。

# webpackerのインストール方法

https://qiita.com/jnchito/items/30ab14ebf29b945559f6#vuejs%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB

この記事を参考にして下記をインストール

* webpacker
* vue
* yarn
* nmp

webpack導入で下記のファイルが追加される。

* app/
    * javascript/
        *  packs/
            * application.js
* config/
    * webpacker.yml
    * webpack/
        * development.js
        * environment.js
        * production.js
        * test.js
* node_modules/
* postcssrc.yml
* babelrc
* yarn.lock
* package.json

# ランタイム限定ビルドと完全ビルド

ランタイム限定ビルド・・・コンパイラがなく、Vue インスタンスの作成やレンダリング、仮想 DOM の変更などのためのコードです。
完全ビルド・・・コンパイラ入りでクライアント側でコンパイルする必要があるときに使います。templateを動かす場合は必要。

引用：http://www.aocomme.com/entry/2017/03/08/213000

デフォルトだとランタイム限定ビルドに設定されています。これは完全ビルドより速度が早いため。しかしランタイム限定ビルドはtemplateを動かすことができません。ここで引っかかった。解決策としては上記を各packファイル以下のjsファイルに記入。

```javascript
import Vue from 'vue/dist/vue.esm';
import App from '../app.vue'
```

# 読み込むタイミング

vue.jsはidで指定しているhtmlが描写された後じゃないと効かないのでbodyタグのとじタグ前に読み込む。
セブンカード以外でもnanacoオートチャージがしたい！

![chuni_nanaco.png](https://qiita-image-store.s3.amazonaws.com/0/89639/38f00196-afba-d9cb-12ec-c374069f3be7.png)


# この記事の内容
- nanacoウェブページにアクセスし, 残高確認, クレジットチャージ, クレジットカード解除を行うpythonスクリプトです.
- Seleniumを利用せず, requestsとHTMLParserのみに依存するので, AWS Lambdaでも簡単に実行できます.
- Cloudwatch Eventと組み合わせて, 毎日定時に登録済みクレジットからnanacoを(疑似)オートチャージする機能も構築できます.

# インストール

```py
pip install git+https://github.com/sawadyrr5/PyNanacoLight
```

# How to use
モジュールnanacoからNanacoクラスをインポートします

```py
from PyNanacoLight.nanaco import Nanaco
```

nanaco番号, カード番号(裏面右下に書いてある7桁の番号), クレジットチャージパスワードを渡してインスタンス化します.

```py
mynanaco = Nanaco(nanaco_number='xxxxxxxxxxxxxxxx', card_number='xxxxxxx', creditcharge_password='xxxxxxxx')
```

## プロパティ
以下のプロパティでクラスから各種情報が取得できます.

```py
.nanaco_number          # nanaco番号
.value_card             # カード残高
.value_center           # センター預かり残高
.registerd_credit_card  # 登録クレジットカード番号(下4桁以外はマスキング)
.charge_count           # 月間累計チャージ回数
.charge_amount          # 月間累計チャージ金額
```

## メソッド
以下のメソッドが使用可能です.

```py
.charge(amount=value)   # クレジットチャージを実行(valueには5000以上30000以下の範囲で1000単位で指定)
.release()              # クレジットチャージ解除
```

# 利用例: AWS Lambdaでオートチャージ機能を設定

## Lambda関数を作る

作り方の詳細は他に解説ページがたくさんあるので割愛します.
依存ライブラリを```pip install hogehoge -t .```という感じでインストールしておくのをお忘れなく.
コードはzipで固めてアップロードします.
Lambda関数の構造はこんな感じになるはずです.

![nanaco_2.png](https://qiita-image-store.s3.amazonaws.com/0/89639/af0a9999-e33d-5b57-1d3a-b7168c558909.png)

## Lambda関数

Lambda関数は以下のように書きます.
クレジットカードが未登録だったり, センター預かり残高が一杯だったり, 月間チャージ限度額を超えていたりする場合は処理中にエラーで死にますが, そのへんの考慮は今回はしません.

```py:lambda_function.py
# -*- coding: utf-8 -*-
import os
from PyNanacoLight.nanaco import Nanaco


def lambda_handler(event, context):
    nanaco_number = os.environ['nanaco_number']
    card_number = os.environ['card_number']
    charge_password = os.environ['charge_password']
    charge_threshold = os.environ['charge_threshold']
    charge_amount = os.environ['charge_amount']

    mynanaco = Nanaco(
        nanaco_number,
        card_number,
        charge_password
    )
    
    # カード残高がしきい値未満だったらクレジットチャージ
    if mynanaco.value_card < charge_threshold:
        mynanaco.charge(charge_amount)
```

## パラメータ

nanacoカード番号などは環境変数でセットしておきます.

![nanaco_1.png](https://qiita-image-store.s3.amazonaws.com/0/89639/43047255-047d-9d25-9a45-cf72a5617072.png)

## トリガーの設定

最後に, Cloudwatch Eventから定時で発火させるようにします.
発火頻度は利用状況に応じて調整しましょう.

![nanaco_3.png](https://qiita-image-store.s3.amazonaws.com/0/89639/3390cc2f-d0e0-f6ec-66a8-cae338a4bcd4.png)


以上です. それではみなさん, 素敵なnanacoライフを！
DockerのVOLUME命令によって何が起きるのか

旧題: MySQLのDBをそのままdocker imageとして保存できない理由
# 概要
DBに初期データ流し込んでそれimageとして保存したい時に、わざわざ-vオプションで手元のディレクトリに吐かせたりするのは他のところに持って行きにくいし面倒に思ったので。

* mysqlのdocker imageってコミットしても /var/lib/mysqlが初期化されてしまうのはなぜか?
* Dockerfileを読んだところ `VOLUME /var/lib/mysql` の記述があったためこのあたりについて調べてみた
* 公式イメージを使わなければ普通に実現できますよという話はそれはそれとして

# 環境
* dockerのバージョン: `Docker version 17.05.0-ce, build 89658be`
* 使ったDockerfile: https://github.com/docker-library/mysql/blob/6c414e7f38c2079c7193beae5dc7c34ee46cd6e7/5.7/Dockerfile

# そもそもVOLUME 命令についての確認
https://docs.docker.com/engine/reference/builder/#volume

* `VOLUME /abs/path` で、このパスをボリュームとする.
* ボリュームとなると他のホストやコンテナからマウント可能になる
* 具体的にはdocker run した時に新しくボリュームが作成される
    * これに関しては調査していないが恐らく `docker run -v /abs/path` と挙動は同じ
    * 手元の環境では `/var/lib/docker/volumes/` 以下に作成されていた
    * -v で手元のディレクトリをマウントさせるときと同じく実体としては共有するファイルがそのまま置かれている
* すでに作られたボリュームについて確認するコマンド
  * `docker volume ls` 既にあるボリュームのls
  * `docker volume inspect volume_name` ボリュームの情報を吐く
  * `docker container inspect container_name` Mountsの項目にどのボリュームをマウントしているのかが出る

# 結論 保存されないのではなく、volumeとして外部に保存されている
毎回違うvolumeを作るから前回の変更が保持されていない、ということなので
前回と同じvolumeを使えば良い....が毎回/var/lib/docker/volumes/db みたいなことを叩くのは面倒なので
手元のディレクトリに作るのが良さそう

# その他: docker runのオプションの-v と --mountについて
このあたりについて調べてる上でdocker runのオプションにボリューム関連のオプションが２つあることに気づきました
`-v` と `--mount`の違いについては下のページに公式からのありがたいお言葉が散りばめられています
https://docs.docker.com/engine/admin/volumes/bind-mounts/

# その他その2  Data Volume Containerについて
ボリュームとしての役割を果たすコンテナをData Volume Containerと呼ぶ(らしい)
"data volume container" inurl:docs.docker.com で検索したが出てこないので出てきた中ではかなり公式感があるドキュメントを参考に。
http://docs.docker.jp/engine/userguide/dockervolumes.html

これは、下記のようにして実現しているようです。

* `docker create -v /var/lib/mysql --name volume busybox` などでボリュームとそのボリュームをマウントするコンテナを作成(ボリュームへのひも付けが必要なだけなのでできるだけ軽量なものが望ましい)
* `docker run --volumes-from=volume mysql` のように `--volumes-from` で マウント

最初のステップで/var/lib/docker/volumes以下に新規でディレクトリが掘られて、以降はそれと紐付いたコンテナ越しにマウントすればいくつかの点で便利、みたいな話なのかと思ってます。
これを見て個人的に思った長所と気になる点(短所ではない)を書いていきます
## 長所
* 複数のボリュームをセットにして扱いたい場合はひとまとめになって便利
* /var/lib/docker/volumes/***** とか打たなくていい
* /var/lib/docker/volumes以下にデータは保存されるので手元のディレクトリ消した時にうっかりまだ使うデータ消しちゃった的な心配は減る

## 気になる点
* 無理矢理実現しているだけでは?
  * ~/.volumes/とかに切ればそれで良さそう
  * 別にコンテナ一個増えるとかはまあいいけど気になるものは気になる

# その他その3 docker volume createについて
ボリュームの名前だけでマウントする手段がない以上、これを手動で使うことあるのか???
mnistデータセット

#概要
mnistデータセットを扱うライブラリについて調べてみた。

#tensorflowの場合
ラベルがone_hot
##サンプルコード

```
from tensorflow.examples.tutorials.mnist.input_data import read_data_sets
or
from tensorflow.contrib.learn.python.learn.datasets.mnist import read_data_sets

mnist = read_data_sets('MNIST_data', one_hot = True)
print (mnist.train.images.shape)
print (mnist.train.labels.shape)
print (mnist.test.images.shape)
print (mnist.test.labels.shape)
print (mnist.validation.images.shape)
print (mnist.validation.labels.shape)

```

##結果

```
Extracting MNIST_data\train-images-idx3-ubyte.gz
Extracting MNIST_data\train-labels-idx1-ubyte.gz
Extracting MNIST_data\t10k-images-idx3-ubyte.gz
Extracting MNIST_data\t10k-labels-idx1-ubyte.gz
(55000, 784)
(55000, 10)
(10000, 784)
(10000, 10)
(5000, 784)
(5000, 10)

```

#kerasの場合
28 * 28
##サンプルコード

```
from tensorflow.contrib.keras.python.keras.datasets import mnist

((xtrain, ytrain), (xtest, ytest)) = mnist.load_data()
print (xtrain.shape)
print (ytrain.shape)
print (xtest.shape)
print (ytest.shape)
```

##結果


```
(60000, 28, 28)
(60000,)
(10000, 28, 28)
(10000,)

```

#sklearnの場合

##サンプルコード

```
from sklearn.datasets import fetch_mldata

mnist = fetch_mldata('MNIST original')
print (type(mnist))
print (mnist.keys())
print (mnist.data.shape)
print (mnist.target.shape)
```

##結果

```
<class 'sklearn.datasets.base.Bunch'>
dict_keys(['DESCR', 'COL_NAMES', 'target', 'data'])
(70000, 784)
(70000,)
```

以上。
Qt + OpenCVまとめ

Qt + OpenCVでアプリを作る際の注意点をまとめました．
# コンパイル手順
`qmake -project`
`qmake`
`make`

# バージョン確認
`qmake -v`

# バージョン変更方法
qmakeのバージョンが4になっていて，qt5から導入された文法で書かれたプログラムを実行する場合コンパイルエラーとなる場合がある．僕の場合，

```c++
connect(sender, &QObject::destroyed, this, &MyObject::objectDestroyed);
```

でエラー．(qt4では

```c++
connect(sender, SIGNAL(destroyed()), this, SLOT(objectDestroyed()));
```

と書かないといけない)

` QT_SELECT=qt5 qmake --version`を実行してバージョン情報が表示される場合はQt5がすでにインストールされているので，デフォルトのバージョンを切り替える必要がある．

`vim /usr/lib/x86_64-linux-gnu/qt-default/qtchooser/default.conf`

で

```shell
/usr/lib/x86_64-linux-gnu/qt4/bin
```
の行を

```shell
/usr/lib/x86_64-linux-gnu/qt5/bin
```

と変更することでデフォルトのバージョンを変更できる．

# include に関する設定
`#include <***>`に関する設定は(project名).proの末尾に追記する

## QApplicationクラスの利用
```shell
QT += widgets
```
を追記

## c++11コンパイラの利用
```shell
QMAKE_CXXFLAGS += -std=c++11
```
を追記

## OpenCVの利用

```shell
QT_CONFIG -= no-pkg-config
CONFIG  += link_pkgconfig
PKGCONFIG += opencv
```
を追記

またMacの場合実行ファイルは
`(プロジェクト名).app/Contents/MacOS/(プロジェクト名)`
に作られるため注意

# 実装上のハマりポイント
```cpp
class MainWindow : public QWidget
{
    Q_OBJECT
public:
    MainWindow()
//......
public slots:
    setImage(); //ボタンが押された時のslot関数

}
```
`Q_OBJECT`を書かないとSLOT関数が認識されない
    

# 参考
[Qt公式ドキュメント](http://doc.qt.io/qt-5/classesandfunctions.html)
[Qt関連資料](http://dorafop.my.coocan.jp/Qt/index.html)
[Qtプログラミング入門 densanlabs](https://densan-labs.net/tech/qt/index.html)