OmniAICreator/Qiita-1.07M huggingface dataset:
Laravel 5.4 の Ajax で array なバリデーションメッセージをインデックス付きで表示する

多分 Laravel 5.2 以上で使えるけど、動作確認は5.4のみ。

```json:post.json
{
  "value": [1, "z", 3]
}
```

```php:resources/langs/ja/validation.php
<?php
return [
  // :
  // :
  'attributes' => [
    'value.0' => 'Value の1番目',
    'value.1' => 'Value の2番目',
    'value.2' => 'Value の3番目',
  ]
];
```

```php:validator.php
$v = \Validator::make($request->all(), ['value.*' => 'integer']);
$v->errors(); // ['value.1' => ['Value の2番目は整数で指定してください。']]
```

マジかよ。

と思ったけど、 [PHP 7 からは即時関数が使える](http://qiita.com/shin1x1/items/b11cd22210fbb3305255)らしい。勝った。

```php:resources/langs/ja/validation.php
  'attributes' => (function () {
    $attributes = [];

    for($i = 0; $i < 100; $i++) {
      $n = $i + 1;
      $attributes["value.$i"] = "Value の$n番目"
    }
    
    return $attributes;
  })()
```

マジかよ。

というわけでもっとスマートな方法を私は募集しています！
CentOSにProxy経由でslコマンドを入れる（EPELパッケージ導入）

# EPELのパッケージをProxy経由で取得する

CentOSにslを入れたい。

```
#yum install sl

読み込んだプラグイン:fastestmirror
Loading mirror speeds from cached hostfile
 * base: download.nus.edu.sg
 * extras: centos.usonyx.net
 * updates: centos.usonyx.net
何もしません
```

CentOSの素のレポジトリにslが入っていない。
EPELをレポジトリに追加すればslが取得できるはずである。

```
#yum install epel-release
インストール:
  epel-release.noarch 0:7-9
完了しました!
```

レポジトリを追加したのでslをインストールする。


```
#yum install sl
・・・
sl-5.02-1.el7.x86_64.rpm       FAILED
http://mirror01.idc.hinet.net/EPEL/7/x86_64/s/sl-5.02-1.el7.x86_64.rpm: [Errno 14] HTTP Error 407 - Proxy Authentication Required
他のミラーを試します。
sl-5.02-1.el7.x86_64.rpm       FAILED
https://epel.mirror.angkasa.id/pub/epel/7/x86_64/s/sl-5.02-1.el7.x86_64.rpm: [Errno 14] curl#22 - "HTTP returned error"
他のミラーを試します。
sl-5.02-1.el7.x86_64.rpm       FAILED
https://mirror.pregi.net/epel/7/x86_64/s/sl-5.02-1.el7.x86_64.rpm: [Errno 14] curl#22 - "HTTP returned error"
他のミラーを試します。

Error downloading packages:
  sl-5.02-1.el7.x86_64: [Errno 256] No more mirrors to try.
・・・・
```

プロキシに阻まれslが取得できない。

/etc/profileの末尾をみる
```
http_proxy=http://username:password@proxy:port
```
ちゃんと書いてある。
尚、usernameには@が含まれているが%40にエンコードされている。

```
curl www.yahoo.co.jp
```
yahooが返ってくる。


/etc/yum.repos.d/epel.repoの
[epel] セクション末尾に
proxy=http://username:password@proxy:port
を追加する

```
#yum install sl
インストール  1 パッケージ

総ダウンロード容量: 14 k
インストール容量: 17 k
Is this ok [y/d/N]: y
Downloading packages:
Delta RPMs disabled because /usr/bin/applydeltarpm not installed.
sl-5.02-1.el7.x86_64.rpm                                   |  14 kB   00:01
Running transaction check
Running transaction test
Transaction test succeeded
Running transaction
  インストール中          : sl-5.02-1.el7.x86_64                            1/1
  検証中                  : sl-5.02-1.el7.x86_64                            1/1

インストール:
  sl.x86_64 0:5.02-1.el7

完了しました!
```

インストールできた。

```
# sl
                                                  (  ) (@@) ( )  (@)  ()    @@
                                             (@@@)
                                         (    )
                                      (@@@@)

                                    (   )
                                  ====        ________                __________
                              _D _|  |_______/        \__I_I_____===__|_________
                               |(_)---  |   H\________/ |   |        =|___ ___|
                               /     |  |   H  |  |     |   |         ||_| |_||
                              |      |  |   H  |__--------------------| [___] |
                              | ________|___H__/__|_____/[][]~\_______|       |
                              |/ |   |-----------I_____I [][] []  D   |=======|_
                            __/ =| o |=-~O=====O=====O=====O\ ____Y___________|_
                             |/-=|___|=    ||    ||    ||    |_____/~\___/
                              \_/      \__/  \__/  \__/  \__/      \_/
```

参考：
http://www.sysarchitects.com/using-proxy-access-epel-internal-network
htmlとcssのみでメニューを固定表示する方法


先日、友人からコーディングについて聞かれました。
どうやらローカルPCだけで情報を整理して一覧表示できるようなシンプルなページを作りたい模様。情報の更新やページのカスタマイズも自分でするとのとこなので、今回はとことんシンプルな方法で再現する方法を提案しました。もちろん、デメリットもありますがね。。。

今回の相談内容は次のとおり

- 左にメニュー、右にコンテンツを表示させたい
- メニューは表示させる場所を固定

この相談に対して回答した内容を備忘録的に書き残していこうと思います。

## htmlの準備

htmlから作っていきました。

ここではbodyタグ内に書いたコードだけを載せていきます。実際にはhead内でcssファイルをリンクさせたりする必要がありますよ

```html:sample.html

<div class="menu">
  <ul>
    <li><a href="#menu01">menu01</a></li>
    <li><a href="#menu02">menu02</a></li>
    <li><a href="#menu03">menu03</a></li>
    <li><a href="#menu04">menu04</a></li>
    <li><a href="#menu05">menu05</a></li>
  </ul>
</div>
<div class="main">
  <div class="box" id="menu01">
    <h2>menu01</h2>
    <p><a href="#">ここに本文が入ります</a></p>
    <p><a href="#">ここに本文が入ります</a></p>
    <p><a href="#">ここに本文が入ります</a></p>
  </div>
</div>

```

menuクラスの付いたdivを左側に、mainクラスの付いたdivを右側に表示するようにします。

## cssを作っていく

htmlでのマークアップが終わったので、次はcssを作っていきます。
今回は『position: fixed』を使って見た目を作っていきたいと思います。
とりあえず解説前にコードを紹介。

```css:sample.css

.menu {
  width: 320px;
  position: fixed;
  top: 0px;
  z-index: 100;
}

.main {
  width: 860px;
  margin: 0 auto;
}

```

これだけ
ちょっとだけ解説

mainクラスのdivは幅860pxで指定し左右中央揃えにしています。
これは簡単ですよね。

問題はmenuクラス。普段、positionプロパティを使わない方だとちょっと戸惑うかもしれません。順を追って解説していきます。

まずmenuクラスの幅を320pxに設定します。

次にpositionプロパティを使い、menuクラスのついたdivの表示させる位置をしてします。
positionの値がfixedなので、表示の位置は絶対配置になります。
表示される位置の基準はウィンドウの左上が基準になります。
（後述するプロパティで基準の位置を変えることが出来ます）

topプロパティを使い、表示させる位置を決めていきます。ちなみにleftやright、bottomと言ったプロパティもありますよ。

『position: fixed』を使ったときにセットで使うのがz-indexプロパティ。
これは重なり順を決めるプロパティです。
PhotoshopやIllustratorで言うところのレイヤーみたいなもんですね。
これを使わないと、menuクラスのdivとmainクラスのdivが同じ階層で表示しようとするので、ブラウザの幅を狭くしたときにトラブルのもとになるのでご注意を！
z-indexの値が大きいほど上に重なって表示されるので、今回は値を100にしています。ちなみに初期値は1です。

## 完成！

これで要望通りのことができるhtmlとcssを作りました。
mainクラスの中に多くの情報が書き込まれてブラウザでスクロールする必要が出てもmenuクラスは常に左上に表示され続けます。

ここでひとつ。。。
一般的に２カラムのレイアウトを作るときは『float: left』や『display: box』なんかを使うことが多いと思います。これらで制御したときは横並びで表示されています。しかし今回の方法は違います。

今回の方法だと **横並びに表示されているように見える** だけ。
ブラウザの幅が狭くなると、menuとmainが重なって表示されます。
ブラウザの幅がどんな状態でも常に横並びというわけにはいかないんです。

使う言語や記述する内容をとことんシンプルにした結果のデメリットが「重なって表示されることがある」なんです。

個人的にはあまり使わない『position: fixed』
常に表示させておきたいものがあるときは使える手法かもしれません。
Firebase の Dynamic Links でアプリが開けなくなる現象の解決方法

## Dynamic Links ってなに？

- https://firebase.google.com/docs/dynamic-links/?hl=ja

Web ページの URL を開こうと思いきや、いつの間にかアプリが開いているっていうあれです。Amazon のアプリをインストールしてると、Amazon のサイトの商品を表示しようとしたらアプリが開いてる事あると思うんですけど、あんな感じのことが簡単に実現できます。iOS/Android とプラットフォームをまたがって利用できるので便利ですね。

## アプリが開けなくなる現象ってなに？

以下 iOS の話です。

Dynamic Links を使うと、Firebase のコンソールでで設定してリンクを発行してもらえます。この URL を開くとアプリが開いたり AppStore が開いたり切り分けしてくれるわけですね。

で、なんかいまの段階で設定が足りてないのかどうか知りませんけど、たとえばアプリからアプリを開くと左上に `Safari に戻る` みたいなリンクが出るじゃないですか？ で、Dynamic Links 経由でアプリを開くいた場合、左上に `Safariに戻る` 右上に `goo.gl` というのがでるんですよ。

|![IMG_0174.PNG](https://qiita-image-store.s3.amazonaws.com/0/3336/8da3752f-8d22-94b4-e691-29f466ca6895.png)|
|:--|
|Dynamic Links で開くとこうなる|

そんでもってうっかり右上の `goo.gl` をタップするとハマります。アプリがインストールされていても、Dynamic Links 経由のリンクが AppStore にしか遷移しなくなります。アプリを再インストールしたり再起動したりクッキー消したりしてもダメ。詰んだ。

## どうやって解決するのか

Dynamic Links の URL が `https://app_code.app.goo.gl/u9DC` だった場合、Safari で `https://app_code.app.goo.gl` にアクセスします。そうすると 400 That's an error とか Google のロゴが表示されるんだけど、無視して画面をスクロールします。するとあら不思議、画面の上にあなたのアプリを開くリンクが表示されるんですね。これをタップしたら復活します。

|![IMG_0175.PNG](https://qiita-image-store.s3.amazonaws.com/0/3336/6e40085b-6cd6-5bb6-c328-952c01e2eab4.png)|
|:--|
|スクロールするとこうなる|

いやあ、よかったよかった。結構難しいもんですね。

## なんでこうなん？

iOS の場合は Dynamic Links の裏側の仕組みは Universal Links を使ってて、その Universal Links の仕様です。

あんまりちゃんと調べてないのだけど、Universal Links の動きはここのサイトがわかりやすかったです。

- [知ってる？iPhoneのSafariでリンクを開くと、アプリが強制的に起動する時の対処方法](http://mobilelaby.com/blog-entry-ios-app-disable-universal-link.html)
Gitで特定のディレクトリだけcloneする方法

gitで複数のプロジェクトファイルを管理していた場合などに、特定のディレクトリ配下だけcloneしたい場合などあると思います。そんな時に便利なgitの使い方があったので紹介します。

## git cloneする
```
git clone リポジトリのURL
```
※既存でgitリポジトリがある場合スキップ

## configを編集する
.gitのあるディレクトリに移動して

```
git config core.sparsecheckout true
```
このコマンドを実行することで
.git/configのファイルに`sparsecheckout = true`が追加される。

## checkoutしたいディレクトリを指定
.git/info/の配下に**sparse-checkout**というファイルを追加する。

```
vi .git/info/sparse-checkout
```
checkoutしたいディレクトリのパスを記述する。
ちなみに`!パス`とすることで除外することもできるようです。
例)sparse-checkout

```
/html
!/html/css
```
こんな感じのはず。

## 設定をリポジトリに反映させる

```
git read-tree -m -u HEAD
```
これで指定したディレクトリのみがリポジトリにある状態になったかと思います。

普通に`git pull`するだけでもいけそうな気がする

##　補足
### branchを変更したい場合
複数branchがあったとして、`git branch`をしても
`git read-tree -m -u HEAD`を実行した時のbranchしか表示されない。

~~なので.git/configからbranchを書き換える必要がある。
```
[branch "master"]
	remote = origin
	merge = refs/heads/master
```
こんな感じで書いてある箇所があるので、このケースであればmasterと書いてある箇所を書き換えれば良い。
こんなことをしなくても~~
```
git branch --set-upstream-to=origin/ブランチ名 ブランチ名
```
これでブランチが追加される。

それでもbranchが表示されないかもしれないですが、
`git checkout ブランチ名`でいけると思います。
そして`git pull`！！

　参考サイト
* [Git 特定のフォルダのみcloneする](http://qiita.com/icoxfog417/items/8b16681213d0fd33602c)
* [git sparse checkout で一部のサブディレクトリだけを clone せずに pull/checkout する](https://mseeeen.msen.jp/git-sparse-checkout/)
* [Gitで他のリポジトリから一部のファイルのみをcloneする方法](http://dxd8.com/archives/223/)
rake db:schema:dump に非常に時間がかかる問題の対策

# 事象
データベースにMySQLを使っている際、`rake db:schema:dump`に非常に時間がかかりフリーズしているようにみえる。
`rake db:migrate`でも最後に`db:schema:dump`が実行されるため同様の事象が発生する。

# 解決方法
先に解決策を書くと、一時的な対応(MySQLを再起動するまでの間)であれば以下のクエリを実行してから `rake db:schema:dump`を実行すれば良い(MySQLのSUPER権限が必要)。

```sql
SET GLOBAL innodb_stats_on_metadata = 0;
```

または永続化したい場合は設定ファイルに以下の設定を追加して再起動する。

```text:my.cnf
innodb_stats_on_metadata = 0
```

# 原因
外部キー制約を取得するために実行している以下のクエリが遅いことが原因である。
https://github.com/rails/rails/blob/4ee42379cc30a07a7d47b7be8c710dba0efa407a/activerecord/lib/active_record/connection_adapters/abstract_mysql_adapter.rb#L396

このクエリが遅い理由については以下のサイトが詳しい。
[innodb_stats_on_metadata に要注意 &middot;  takus&#39;s blog](http://blog.takus.me/2013/12/21/innodb-stats-on-metadata/)
[innodb_stats_on_metadata=1でディスク容量激増とCPU負荷が発生 | IsaB](https://blog.isao.co.jp/innodb_stats_on_metadata1_diskfull_cpubusy/)

要約すると`innodb_stats_on_metadata = 1`の場合に`INFORMATION_SCHEMA`にアクセスすると統計情報を更新するため遅くなるということらしい。
MySQL 5.6.6からはこのオプションはデフォルトでOFFになるようなので、明示的に指定指定ない限りこの問題に遭遇することはないと思われる。
UiPathでRPAを実践してみる(6) ～画像処理について知る～

この記事ではUiPathの持つ面白い機能の一つである、画像認識について書いていきます。

##処理完了を待つために使う
例えば、Aというページを表示するために平均して数秒が必要だったとします。
この時に何もしないと、ページの表示が終わる前にデータを入力しようとして、誤作動を起こすことが有ります。
解決策として、真っ先に考えるのは数秒を待つ(Delay)事です。もちろん、UiPathでは処理を待つ実装を行うことができます。
下記の場合は、Webページにテキストを入力する処理ですが、入力前(Delay before)に5秒待つ(5,000msを指定)、処理となっています。
<img width="658" alt="キャプチャ(1).PNG" src="https://qiita-image-store.s3.amazonaws.com/0/154110/0b058aa7-83f3-519b-da63-9b1545bb9005.png">
悪くは無いのですが読込完了までにはに5秒以上かかるかもしれませんし、逆に早くページが表示された場合は時間の無駄ですよね。
というわけで、この様なケースでは**ページ読込が完了したことが分かる情報**をUiPathに認識させることにします。
例えばですが…Webページで有効なのは一般的にfaviconと思われますが、ご自身で有効だと思われるものであれば、何でも構いません。
では、どの様に認識させるかという点になりますが…ここで有効なのは、`Find Image`または、`Wait Image Vanish`です。
意味はそのままで、`Find Image`は対象の画像を探す。`Wait Image Vanish`はその逆で、検索対象の画像が消えるのを待つ処理になります。
どちらも、待ち時間の間に画像が表示される(または消える)事が確認できたら、次の処理に進みます。
タイムアウトの時間はデフォルトで30,000ms(30秒)ですが、TimeoutMSで変更は可能です。条件に当てはまらなかった場合は、例外をThrowします。必要に応じてcatchすると良いかと思います。また、画像の認識にはAccuracyというプロパティで精度が設定できます。これは、1を完全一致として0.1～1までの間で設定できます。デフォルトは0.8なので、これも必要性に応じて上げ下げしましょう。
<img width="809" alt="キャプチャ(2).PNG" src="https://qiita-image-store.s3.amazonaws.com/0/154110/7286864a-0ad7-a312-0b18-874039d802a4.png">


##リモートデスクトップ等、他のマシンの処理を実行するために使う
前回はセレクタについて書いてみました。癖のある記述ではありますが、誤作動を防ぐためにとても重要ですね。
ところが、このセレクタにも弱点があります。それは、リモートデスクトップ等で繋いだ他のマシンはセレクタでは認識出来ない、という点です。(ディスプレイ情報が転送されているだけですので、当たり前と言えばそれまでですが…)
というわけで、ここでも画像認識が活躍する事になります。
この様なケースで便利なのが、`Recording`の`Citrix`です。
<img width="323" alt="キャプチャ(3).PNG" src="https://qiita-image-store.s3.amazonaws.com/0/154110/1d85c6ae-c863-260e-630e-bf63b2fdfa0c.png">
では早速、使っていきましょう。まずは、基本のクリックから。
何かの画像をクリックするには、Click Imageを使っていきます。
![キャプチャ(4).PNG](https://qiita-image-store.s3.amazonaws.com/0/154110/bc891764-9a68-e17f-364a-4f3b3686c93c.png)
クリックしたい画像を範囲で選択して、save&exitで下記の様なシーケンスが自動で出来上がります。
![キャプチャ(5).PNG](https://qiita-image-store.s3.amazonaws.com/0/154110/94a2c9da-827b-6d44-6dc4-119cddcab258.png)
ここで、一つ注意点があります。クリックをするアイコンについては余白を含めない様にしましょう。
Windowsでは下記の様に、クリックされているアイコンは背景色が変わるので、余白を含めてしまうと正しく画像を認識してくれないことが有ります。
![キャプチャ(6).PNG](https://qiita-image-store.s3.amazonaws.com/0/154110/0a691346-22cf-091c-3f3c-8a358c9595c5.png)

次回はOCRについて書いてみたいと思います…
Visual Studio 2015 Express インストールメモ


2017年6月29日:Windows10 SDK のインストール失敗を追加
2017年6月28日:新規作成

## インストール

### ダウンロード
- [Visual Studio Express 2015インストール - インコのWindowsSDK](http://gurigumi.s349.xrea.com/programming/visualcpp/install2015_1.html)
    - 最初の方に「1. マイクロソフトのWebサイト」があり、そこのリンクからダウンロードできる(日本語版)
        - ダウンロードしたファイル「wdexpress_JPN__1301450956.1498627081.exe」

- [Visual Studio Express - Visual Studio Community の試用](https://www.visualstudio.com/ja/vs/visual-studio-express/?rr=https%3A%2F%2Fwww.google.co.jp%2F)
  - 下の方に「Express 2015 for Windows Desktop」というリンクがある(英語版)
      - ダウンロードしたファイル「wdexpress_ENU__1301450956.1498627081」

### インストール
上記でダウンロードしたファイルを実行する。

### オフライン用インストーラの作成
上記でダウンロードしたファイルに、コマンドラインからlayoutオプションを指定することで、オフライン用のインストーラを作成することができる。
以下のコマンドで「downloads」フォルダに作成される。
```
wdexpress_JPN__1301450956.1498627081.exe /layout ./downloads
```
※完了まで1時間以上かかる



## アンインストール
以下の手順で「Visual Studio 2013 以降(2013, 2015, 2017)」のアンインストールができる。
また、レジストリの削除も行なってくれる。
環境によるが、10分～30分程度の時間がかかる。

0. [Releases · Microsoft/VisualStudioUninstaller](https://github.com/Microsoft/VisualStudioUninstaller/releases)から「TotalUninstaller.zip」をダウンロードする。
1. 任意のフォルダに解凍する。
2. 管理者権限でコマンドプロンプトを開く。
3. 解凍したフォルダに移動し、「Setup.ForcedUninstall.exe」を実行する。
4. 「Y」を入力しEnterを押すと、アンインストールが始まる。



## 備考
### Expressには「devenv.exe」がない
> 補足：「No devenv file in Microsoft visual Express 10」によると、Visual Studio Expressの場合、Devenv.exeは存在しません。代わりに、vcexpress.exeやvbexpress.exeやwdexpress.exeなどになるようです。

参考：[コマンドラインによりプロジェクトをビルドする: .NET Tips: C#, VB.NET](http://dobon.net/vb/dotnet/vs/devenv.html)


### Windows10 SDK (10.0.14393) のインストール失敗
「セットアップは完了しました。」と表示されても私の環境では「Windows10 SDK (10.0.14393) のインストール失敗」が発生していた。
OSがWindows7 64bitだったので、調べてみると以下のような記述がありました。

> 略
> Windows7 Home PreminumではHyper-Vが実行できないのでインストールできないのが正常で、インストールオプションに出てきてしまうことが間違いのような気がします。
>なお、32bit環境にインストールしようとしたらオプションに表示されないようです。
> 略

参考：[Visual Studio 2015 RCのインストールが一部失敗します](https://social.msdn.microsoft.com/Forums/vstudio/ja-JP/dcc35a55-9641-4353-adbf-8f24f2e9d445/visual-studio-2015-rc?forum=vsgeneralja)

「Windows10 SDK」のインストールに失敗しても、起動などには問題ないようです。




## 参考URL
- [Visual Studio Express 2015インストール - インコのWindowsSDK](http://gurigumi.s349.xrea.com/programming/visualcpp/install2015_1.html)
- [Visual Studio Express - Visual Studio Community の試用](https://www.visualstudio.com/ja/vs/visual-studio-express/?rr=https%3A%2F%2Fwww.google.co.jp%2F)
- [VisualStudio|YUKIBE33のブログ](http://yukibe33.wp.xdomain.jp/%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%A0/visualstudio/)
- [Visual Studio 2015 with Update 3 日本語版ダウンロード](https://ameblo.jp/so-cyan4995/entry-12175131487.html)
- [Visual Studio Uninstaller でvisual studio 2015 を完全アンインストール - Qiita](http://qiita.com/yizumi1012xxx/items/b13314c12d5dec627ad7)
- [コマンドラインによりプロジェクトをビルドする: .NET Tips: C#, VB.NET](http://dobon.net/vb/dotnet/vs/devenv.html)
- [Visual Studio 2015 RCのインストールが一部失敗します](https://social.msdn.microsoft.com/Forums/vstudio/ja-JP/dcc35a55-9641-4353-adbf-8f24f2e9d445/visual-studio-2015-rc?forum=vsgeneralja)
Ansibleの実行対象AWSアカウントを事前にチェックして事故防止


#はじめに
AnsibleでAWSリソースを操作する場合、気をつけなければいけないのが対象アカウント間違いです。
これはaws cliでも同じですが、作業前に`aws configure list`で確認するしかなく、ヒューマンエラーが起こりやすいです。

そこで、Ansibleで現在有効になっているプロファイルと実行対象のAWSアカウントを比較し、違っていたらタスクをfailさせ、予期せぬアカウントに対するAnsible実行を抑止します。


#前提
- aws cliがインストールされている必要があります。
- credential情報は環境変数か`aws configure`でセットしてある必要があります。

#sample


##ディレクトリ構成

```bash:ディレクトリ構成
site.yml
roles/
|--account_check/
|  |--tasks/
|  |  |--main.yml
hosts/aws    #inventory
host_vars/
|--localhost.yml
```

##inventory

今回はaws cliをlocalhostで実行するので、下記のようなインベントリファイルを用意します。

```bash:hosts/aws
[aws]
localhost
```

##vars

こんな感じに変数を定義します。今回はhost_varsで定義しました。


```yaml:host_vars/localhost.yml
---
my_vars:
  aws:
    common:
      account_id: 'XXXXXXXXXXXX'
```

##Role

`shell`モジュールでaws cliにより現在のプロファイルでセットされているAWSアカウントIDを取得し、varsに設定されているアカウントID（実行対象）と比較して違っていたらfailさせます。

`failed_when`でfailさせてもいいのですが、カスタムメッセージを出したほうがわかりやすいので`fail`モジュールを利用します。

```yaml:roles/account_check/tasks/main.yml
---
- name: AWSアカウントID取得
  shell: >-
    aws sts get-caller-identity \
     --query 'Account' \
     --output text
  check_mode: no
  changed_when: false
  register: aws_id

- name: AWSアカウントIDチェック
  fail:
    msg: "Target AWS account is wrong!!"
  check_mode: no
  when: aws_id.stdout != my_vars.aws.common.account_id
```

##site.yml

tagsに`always`を指定することで、タグを指定しての実行においても必ず実行されるようになります。

```YAML:site.yml
---
- name: account_check
  hosts: localhost
  connection: local
  roles:
    - role: account_check
  tags:
    - always
    - account_check
```

##実行
```bash:Command
$ ansible-playbook -i hosts/aws -l localhost site.yml
```


#まとめ
このRoleを一番最初に実行すると、万が一対象アカウントとプロファイルのアカウントが違う場合、後続タスクが実行されないので安全です。

#参考
##AnsibleでAWSリソースを管理するシリーズ
- [VPCをAnsibleで作成する](http://qiita.com/tomohiko_isobe/items/c245bedfa6966305eb10)
- [IAMユーザをAnsibleで管理する](http://qiita.com/tomohiko_isobe/items/5ae6f15f52a2d20e2635)
- [AWSのセキュリティグループをAnsibleで管理する](http://qiita.com/tomohiko_isobe/items/7342b8ba874d997c5c6c)
- [EC2をAnsibleで管理する](http://qiita.com/tomohiko_isobe/items/163b23d5a0e566aaa159)
- [ec2_group_factsモジュールをAnsible2.2で使えるようにする](http://qiita.com/tomohiko_isobe/items/8684b4dc8f99793e5cf8)
- [RDSをAnsibleで管理する](http://qiita.com/tomohiko_isobe/items/7ce42217e177f0c6b7ec)
- [AnsibleでRoute53を管理する](http://qiita.com/tomohiko_isobe/items/85c5513314a64f2392ba)
JavaScriptでAPIのデータを参照

はじめての投稿

APIの使い方がわからないので参考ページを参照して実行してみた。できた！やった！
メモまで

index.html
test.js
を作成して、ChromeのJavascriptコンソールにて確認

```index.html
<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="utf-8">
	<title>Javascriptの練習</title>
</head>
<body>
	<script src=test.js></script>
</body>
</html>
```

```test.js
var script = document.createElement('script');

script.src = "https://randomuser.me/api?callback=jsonData"
document.body.appendChild(script);
document.body.removeChild(script);

//コールバックされたJSONデータの読み込み
function jsonData(data) {
    console.log(data);
}
```

## コンソールの結果
ランダムでいろいろな情報を返してくれる
例）
![sample.png](https://qiita-image-store.s3.amazonaws.com/0/20632/cac12c42-968d-ccc4-29d2-b7b775c6504a.png)

## 参考　
[面倒な手続き不要！「Web API」の超お手軽活用術をJavaScriptコード付きで一挙大公開！ - paiza開発日誌](http://paiza.hatenablog.com/entry/2016/06/21/%E9%9D%A2%E5%80%92%E3%81%AA%E6%89%8B%E7%B6%9A%E3%81%8D%E4%B8%8D%E8%A6%81%EF%BC%81%E3%80%8CWeb_API%E3%80%8D%E3%81%AE%E8%B6%85%E3%81%8A%E6%89%8B%E8%BB%BD%E6%B4%BB%E7%94%A8%E8%A1%93%E3%82%92JavaScript)
Silex でお手軽に constructor injection を実現する方法


# 前提
下記のようなコントローラクラス・ルーティングがあって、指定のルートが呼ばれた際（＝コントローラクラスがインスタンス化されるとき）にコンストラクタ引数に入っているクラスを勝手にインスタンス化して入れてほしい。

```php
<?php

namespace App\Api\Controller;

use Symfony\Component\HttpFoundation\Request;
use App\Api\Service\PingService;

// controller class
class PingController extends ControllerBase
{
    private $pingService;

    public function __construct(
        PingService $pingService
    ) {
        $this->pingService = $pingService;
    }

    public function get(Request $request)
    {
        $id = $request->get('id', 1);
        return $this->returnJsonResponse([
            'ping' => $this->pingService->getPing(),
            'pong' => $this->pingService->getPong($id),
        ]);
    }
}

// routing
$silexApplication->get('/api/ping', 'App\Api\Controller\PingController::get');
```

# PHP-DI を使う
そこで、`PHP-DI` という上記のようなことを手っ取り早く実現するためのライブラリがあるので `composer require` で入れる。

```
composer require php-di/php-di
```

# コンテナビルダー
下記のような `ContainerBuilder` というシングルトンなクラスを作る。
パフォーマンスに影響があるようなので、本番向けにはキャッシュの設定などをしたほうが良さそう（公式は `APC` を使うことを推奨している模様。なお、PHP5.5以降では `APCu` ですね）。

```php
<?php

namespace App;

use DI\Container;
use Doctrine\Common\Cache\ApcuCache;

class ContainerBuilder
{
    public static function getInstance()
    {
        static $instance;
        if (!($instance instanceof Container)) {
            $builder = new \DI\ContainerBuilder();
            $cache = new ApcuCache();
            $builder->setDefinitionCache($cache);
            $builder->writeProxiesToFile(false);
            $instance = $builder->build();
        }
        return $instance;
    }
}
```

# コントローラリゾルバ
標準で使っているリゾルバ（Silex 2.x では `Symfony\Component\HttpKernel\Controller\ControllerResolver`)を継承したクラスを作り、`instantiateController()` をオーバーライドする。
デフォルトではただ単に `new $class()` として、渡された名前のコントローラクラスをインスタンス化しているだけなので、PHP-DI の機能を使い解決させる。

```php
<?php

namespace App;

class ControllerResolver extends \Symfony\Component\HttpKernel\Controller\ControllerResolver
{
    protected function instantiateController($class)
    {
        $di = ContainerBuilder::getInstance();
        return $di->make($class);
    }
}
```

# Silex\Application に上記のクラスを渡してやる
下記のようにして Application インスタンス（実態は `pimple` によるDIコンテナ）に上記で作ったコントローラーリゾルバのインスタンスを入れる。

```php
<?php

namespace App;

use Silex\Application;

$app = new Application();
$app['resolver'] = new ControllerResolver();
```
格変化による日付の表現の違い

# 格変化 - 国で変わる表現の違いについて
## 月名
英語や日本語での January や 1月 という表現はどんな場合でも単語は変化しない。

しかしロシア語、チェコ語、ポーランド語、フィンランド語などの一部の言語では「格変化」という語形の変化がある。
https://ja.wikipedia.org/wiki/%E6%A0%BC%E5%A4%89%E5%8C%96

「○月」を下記の2通りで表現する場合、格変化によりそれぞれ表現方法が異なる。

- 単独で「○月」と書く場合
- 年日などと合わせて「○年○月」「○月○日」と書く場合
	
例. フィンランド語の「1月」(http://whitebear0930.net/archives/5097 より) 

|日付の形式|表現|
|:--|:--|
|○月|tammikuu|
|○年○月など|tammikuuta|

Androidではこの表現を行うために 月名の日付形式として**「L」**パターンを用意している。
「L」であれば単独で使用する場合の月名が、「M」で単独で使用しない場合の月名が取得できる。

例. フィンランド語「1月」

|日付形式|表現|
|:--|:--|
|MMM|tammikuuta|
|MMMM|tammikuuta|
|LLL|tammi|
|LLLL|tammikuu|

単独で使用する & 省略形 の月名を取得したい場合は LLL を使用する。
MMM では省略形は取得できないことに注意。
格変化を持たない言語(英語、日本語など)では L は M と同じ扱いとなる。

## 曜日
曜日にも格変化があるため、単独で使用する場合の曜日用に「**c**」が用意されている。

例. フィンランド語「水曜」

|日付形式|表現|
|:--|:--|
|E, EE, EEE|ke|
|EEEE|**keskiviikkona**|
|EEEEE|K|
|EEEEEE|ke|
|c, cc, ccc|ke|
|cccc|**keskiviikko**|
|ccccc|K|
|cccccc|ke|

## 補足
### 日付形式のフォーマット
よく忘れるので付録。
何の文字を何個使うとこうなる、という例が細かく記載されている
[android.icu.text.SimpleDateFormat](https://developer.android.com/reference/android/icu/text/SimpleDateFormat.html) の表が分かりやすいと思う。

### Androidの日付パース用クラス
Androidで日付を表示する際に yyyy/MM/dd などの日付形式を使用してパースするクラスは色々ある。

- [java.text.SimpleDateFormat](https://developer.android.com/reference/java/text/SimpleDateFormat.html)
- [android.text.format.DateFormat](https://developer.android.com/reference/android/text/format/DateFormat.html)
- [android.icu.text.SimpleDateFormat](https://developer.android.com/reference/android/icu/text/SimpleDateFormat.html) (API 24-)
- [java.time.format.DateTimeFormatter](https://developer.android.com/reference/java/time/format/DateTimeFormatter.html) (API 26-)

Androidのバージョンによっては使用できるものが増えている。
API 24 (Android 7.0) からはICU(International Components for Unicode)対応版の android.icu.text パッケージが追加された。

API 26 (Android 8.0) からはJava 8で実装された java.time パッケージが追加された。
> Qiita : Java8の日時APIはとりあえずこれだけ覚えとけ
http://qiita.com/tag1216/items/91a471b33f383981bfaa

java.text.SimpleDateFormat はJava版とAndroid版で挙動が異なっているのでAndroidで開発する際にはJava版との動作の違いに注意
> Qiita : Android と Java では SimpleDateFormat の書き方がこう違う
http://qiita.com/arai-wa/items/272c9a09386872b8c643

[java.text.SimpleDateFormat](https://developer.android.com/reference/java/text/SimpleDateFormat.html) のリファレンスを見ると、日付形式のパターン表に L と c は記載されてないけどちゃんと使えます。
論文: Convolutional Neural Networks for Sentence Classification


# 論文: Convolutional Neural Networks for Sentence Classification

http://www.aclweb.org/anthology/D14-1181

## 概要

+ CNNを使ってdocument classificationをやってみた
+ word2vecが予想以上にうまくいっていることがわかった

## 内容

### CNN for Text

テキストは単語の並び。まず、単語のその分散表現で表してその上でCNNをする。

> I have a dream .

という文章に対して、windowが3のCNNを行うと`<BOS> I have`、`I have a`、`have a dream`、`a dream .`、`dream . <EOS>`それぞれに対して同じフィルターがかかり、非線形の活性化関数を通る。式で書けば

$${\bf c_i} = f(W{\bf x_{i:i+h}}+{\bf b})$$


ここで、${\bf x}$はword2vecで学習された単語の分散表現。

この結果
$$
	{\bf c} = [{\bf c_1}, {\bf c_2}, {\bf c_3}, \cdots, {\bf c_{T-h+1}}]
$$
がこの層の出力になる。プーリングをして一つのベクトルにする。
プーリングは各特徴量に対してその最大のものをとる**max-over-time**を使う。

### モデルの種類

+ **CNN-rand**: 単語の分散表現を全てランダムに初期化して学習する。
+ **CNN-static**: 単語の分散表現をword2vecで初期化して、学習はしない。word2vecにない単語はランダムに初期化
+ **CNN-non-static**: 単語の分散表現をword2vecで初期化して、fine-turningする。word2vecにない単語はランダムに初期化
+ **CNN-multichannel**: 単語の分散表現はword2vecで初期化して、二つにコピーする。一つはfine-turningして、もう一つは学習しない。二つを両方とも入力として扱う。

これらを比較して、word2vecの汎用性、fine-turningの効果、multichannelの効き具合を検証する。

### 結果と議論

ランダムに初期化されて学習したCNN-randはword2vecで初期化されて学習しなかったCNN-staticよりも結果がよくない。word2vecは特定のタスクのみではなく多様なタスクで使えるものなのではないか？
fine-turningにより、もっと精度が上がる。

#### Multichannel vs. Single Channel

思ったよりもmultichannelの効果がなかった。
もっと実験が必要。

#### Static vs. non-Static

staticとnon-staticの比較では、non-staticの方が全体的にいい。
タスクによって最適な単語の表現は変わる。例えば、元々の分散表現では*bad*は*good*に近い。これは、文法的に近いから。これに対して、感情分析のタスクではこれらの単語は遠くになければならない。感情表現のタスクの中でfine-turningされた分散表現では、*bad*は*terrible*など、*good*は*nice*などに近くなる。
swagger スタブを立てる手順

# swagger-codegenの設定
$ git clone https://github.com/swagger-api/swagger-codegen
$ cd swagger-codegen
$ mvn clean package
$ java -jar modules/swagger-codegen-cli/target/swagger-codegen-cli.jar generate \
-i http://petstore.swagger.io/v2/swagger.json \
-l nodejs-server \
-o samples/server/petstore/nodejs

----------------------------------------------------------------------------------

自分の環境ではcloneに失敗してしまったため、以下のURLからzipファイルでダウンロードを行った。
Swagger Codegen 2.2.0
https://github.com/swagger-api/swagger-codegen/releases

APIを記述したyamlファイルを、swagger-codegen-2.2.0の直下に配置。
（今回はswagger.yamlを配置）

# スタブサーバの生成
上記のコマンドを元に、実際に以下のコマンドを実行した。
$ java -jar modules/swagger-codegen-cli/target/swagger-codegen-cli.jar generate -i swagger.yaml -l nodejs-server -o samples1/server
$ cd samples1/server
$ npm init
$ npm install
$ node index.js
Your server is listening on port 10010(http://localhost:10010)
Swagger-ui is available on http://localhost:10010/docs
⇒ http://localhost:10010/docs にアクセスし、何か文字を入れて、
[try it out!]ボタンを押下するとスタブのデータが出力される。


参考：
https://github.com/swagger-api/swagger-codegen/wiki/Server-stub-generator-HOWTO#nodejs
https://news.mynavi.jp/itsearch/article/devsoft/2541
CUPSを使ったUbuntu16.04LTSでのプリンタの設定

今回、FujiXeroXのDocuPrint3000というプリンタの設定をした際にUbuntuの設定からプリンタの設定をしようと思いましたがうまくいかなかったですがやり方を教えてもらったので備忘録として以下に記します。

#1.CUPSのインストール

```
sudo apt-get install cups
```

アップデートしてきた人の中にはもしかしたら既にインストールされているパターンもあると思いますのでその場合はこの項目は省略できます

念の為、サービスを開始させておきましょう

```
sudo service cups start
```

#2.localhost:631を開く
ブラウザからlocalhost:631と入力してプリンタの管理画面を開きます
もし開かない場合はCUPSを再起動させましょう

```
sudo service restart cups
```

#3.プリンタの追加
その後、管理(Administration)のタブを選択してプリンターの追加をクリック

![Screenshot from 2017-06-28 12-55-36.png](https://qiita-image-store.s3.amazonaws.com/0/129065/31f99ef3-3253-6249-487f-a7519ba95d54.png)

プリンターの追加の画面に映るので

- ローカルプリンター
- 発見されたネットワークプリンター
- その他のネットワークプリンター

から自分のプリンタの対象になっているものを選択しましょう
その後、続けるをクリックすると新しいプリンターの項目に映るので

- 名前
- 説明
- 場所
- 共有

の項目を適宜設定しましょう
その後はプリンタメーカーの項目を選択し、プリンタの追加をクリックすることで完了となります

終わったらテストページの印刷をしましょう
それでも不具合があればどこかで作業手順を誤ったかこの方法が適していないかのどちらかだと思います。

#参考
http://qiita.com/ma2shita/items/481d8f6625469e1defe2
MySQL Manual 読書会(１回目)(第 1 章 一般情報)

MySQLのManualを読んで気になったところのメモを残していきます。

## [1.8 MySQL の標準への準拠](https://dev.mysql.com/doc/refman/5.6/ja/compatibility.html)

[SQL 標準](https://ja.wikipedia.org/wiki/SQL)についての記述があり、マニュアルでは、SQL92,SQL99,SQL:2003,SQL:2008に対応していると書いてあります。機能一覧を眺めている限りよく使っているものも多いです。あとは、[HANDLER インタフェース](https://dev.mysql.com/doc/refman/5.6/ja/handler.html)というものがあり、これにより拡張をサポートしているようです。

普段は使用しないのですが、[W3C XPath 標準をサポートする XML 機能を実装しています](https://dev.mysql.com/doc/refman/5.6/ja/xml-functions.html)だそうなので、実はXPathが使えるようです。

### SQL モードの選択

`sql_mode システム変数`に値をセットすることによって、異なる[SQLモード](https://dev.mysql.com/doc/refman/5.6/ja/sql-mode.html)をサポートしている。厳密に標準に準拠するANSI、トランザクションテーブルに値を指定したとおりに挿入できない場合にステートメントを中止するSTRICT_TRANS_TABLESなど様々なモードがあります。

ぱっと探した感じ、[この設定](http://www.songmu.jp/riji/entry/2015-07-08-kamipo-traditional.html)がおすすめなようです。
LaTeXで数理計画（数理最適化）問題を記述する環境

# 概要
LaTeXで、数理計画（数理最適化）問題を、

![aae.png](https://qiita-image-store.s3.amazonaws.com/0/171222/619e1add-4df4-8d31-3423-8fb1ac6253d1.png)

のように記述するための、mpproblem環境（`\begin{mpproblem} ... \end{mpproblem}`）というものを作りました。

# 特徴
- 問題名（上記の例では(P)）と、縦棒を出力
- 問題の中身は、amsmathパッケージのalignatを使用可能
    - 複数の式の記述が可能
    - 数式番号の個別付与、相互参照が可能
- nameref（hyperref）パッケージを使えば、問題名(P)は相互参照可能


# サンプルコード

```MPProblem_excerpt.tex
\documentclass[12pt, a4paper, papersize, dvipdfmx]{jsarticle}

% ---- Preamble -------------------------------------------------------------- %
% -------- Packages ------------------------------------------------------ %
% AMS
\usepackage{amsmath}

% Ref
\usepackage{nameref}

% -------- Environments -------------------------------------------------- %
% New Environments
\newcounter{mpproblem}[section]
\renewcommand{\thempproblem}{\thesection.\arabic{mpproblem}}
\makeatletter
\newenvironment{mpproblem}[1]%
{%
    \protected@edef\@currentlabelname{#1}%
    \par\vspace{\baselineskip}\noindent%
    \ifx#1\empty %
    \else \refstepcounter{mpproblem}$($#1$)$ %
    \fi%
    \hfill%
    $\left|%
    \hfill%
    \hspace{0.00\textwidth}%
    \@fleqntrue\@mathmargin\parindent%
    \begin{minipage}{0.86\textwidth}%
    \vspace{-1.0\baselineskip}%
}%
{%
    \end{minipage}%
    \@fleqnfalse%
    \right.$%
    \par\vspace{\baselineskip}\noindent%
    \ignorespacesafterend%
}%
\makeatother
\newcommand{\mpprobref}[1]{$($\nameref{#1}$)$}

\newenvironment{mpproblem*}%
{%
    \begin{mpproblem}{}%
}%
{%
    \end{mpproblem}%
    \ignorespacesafterend%
}



% ---- Text ------------------------------------------------------------------ %
\begin{document}

問題名あり。
%
\begin{mpproblem}{$P$}
\label{mpprob:P}
\begin{alignat}{2}
 &\text{minimize}   & \quad  c^\top x  &        \label{eqn:P_Obj}     \\
 &\text{subject to} & \quad  Ax        &\geq b  \label{eqn:P_Con-Eq}  \\
 &                  & \quad  x         &\geq 0. \label{eqn:P_Con-Non} 
\end{alignat}
\end{mpproblem}

問題名なし。
%
\begin{mpproblem*}
\begin{alignat}{2}
 &\text{minimize}   & \quad f(x)  &        \label{eqn:FG_Obj}    \\
 &\text{subject to} & \quad g(x)  &\leq 0. \label{eqn:FG_Con-Eq} 
\end{alignat}
\end{mpproblem*}

nameref（hyperref）パッケージを使えば、
問題名\mpprobref{mpprob:P}は相互参照可能。

\end{document}
```

もうちょっと詳しいサンプルコードをGitHubで公開しました。
https://github.com/samuelladoco/LaTeXEnvMPProblem
プログラミング言語とは

### プログラミング言語とは、コンピューターに対して指示を行う際に使われる言葉です。
英語・日本語・中国語などのように様々な言語があるようにコンピューターの世界にも様々な言語があります。
例えば
ツイッターのようなサービスを作る言語と
パズドラのようなゲームを作る言語は全く違います。
学ぶ言語によって難易度や、作れるものが違うので注意が必要です。

では、プログラミング入門する際にどの言語を学べばいいのでしょうか？？？
ズバリおすすめは
## Ruby
です

なぜRubyがおすすめなのかはそのとっつきやすさにあります
次のコード(プログラミング言語のこと)を見てください

```ruby:test.rb
puts 'プログラミングを始めるよ'
```

```java:Test.java
class Test{
  public static void main(String[] args){
    System.out.println("プログラミングを始めるよ");
  }
}
```

これはどちらもコンピューターに「プログラミングを始めるよ」と出力するように指示しています。

どうでしょう？？？
どちらが簡単に見えますか？？？


明らかにRubyですよね
このようにとてもシンプルなコードであることがRubyの大きな特徴です。
さらにシンプルでありながら非常に強力であることもその特徴です
**楽天市場**
**Twitter**
**クックパッド**など
名だたるサイトでRubyは使用されています。
ぜひ、一緒にRubyの世界へ一緒に踏み込んでみましょう！
Raspberry Pi 2 Model BにJenkinsをインストールする

# 環境
- Raspberry PI 2 Model B
- RASPBIAN JESSIE LITE (2017-06-21)


# インストール
```bash
wget -q -O - https://pkg.jenkins.io/debian-stable/jenkins.io.key | sudo apt-key add -

sudo apt update
sudo apt install jenkins
```

# 設定変更
```bash
# remoteからアクセスするために
HTTP_HOST=0.0.0.0

# reboot
sudo systemctl restart jenkins
```

# 参照
http://www.duskborn.com/installing-jenkins-on-raspberry-pi-2/
https://pkg.jenkins.io/debian-stable/
http://docs.ansible.com/ansible/intro_installation.html#latest-releases-via-apt-debian
【 Node.js 】Apache Cordova「インストール」～「Hello World！」まで

#はじめに
__Cordova__を__インストールした際の手順__を__Qiita__に書き残しておく:point_up:

>__Apache-Cordova <font color="red">(略称:Cordova[コルドバ])__</font>
モバイルアプリケーション開発用のフレームワーク_(オープンソース)_で、
HTML,CSS,JSを使って、マルチプラットフォーム向けのアプリケーションを作成することができます。


#インストール環境
- __Windows 10__
- __node (v7.2.1)__
- __npm (4.0.5)__


_※ Node.jsの環境を事前に準備していただく必要があります。
まだ、インストールされていない方はこちらの記事をご覧ください。_
>__From Qiita__
[【Node.js】Nodistを使ってNode.jsのバージョンを切り替える [for Windows]](http://qiita.com/Futo23/items/0825aa96088c5ff0906b)


# インストール方法

##### __1. コマンドプロンプトを立ち上げ、下記コマンドを実行します。__

```
$ npm install -g cordova
```

_Cordovaは、さまざまなプロジェクトで活用できるので、グローバルオプション```-g```をつけてインストールを行います。_

>_-g_ オプションをつけると、global設定されているnode.jsのバージョンでインストールされます。

>```
C:\User\〇〇〇\src> nodist ls
(x64)
> 7.2.1 (global: 7.2.1)
  8.1.0
  8.1.2
```

_-g オプションを付与してインストールした場合のインストール先 (ファイルパス) は、下記コマンドで調べることが可能です。_

>```
$ npm -g root
```
__・出力結果__
例. C:\Program Files\Nodist\bin\node_modules

#### __2. cordovaが正常インストールできたらバージョンを確認します。__

```
$ cordova -v
7.0.1
```

上記コマンドを実行し、バージョンが出力されればOKです！

#### __3.新規プロジェクトを作成します。__

下記コマンドを実行するだけで、プロジェクトファイルが生成されます。

```
$ cordova create HelloWorld // 新規プロジェクト作成
```

```
$ cd HelloWorld // ディレクトリ移動
```

__・新規プロジェクトのディレクトリ構成__

```
.
├── .npmignore
├── cofig.xml
├── <DIR> hooks
├── package.json
├── <DIR> platforms
├── <DIR> plugins
├── <DIR> res
└── <DIR> www
```

| File / Directory | 概要 |
|---|---|
|__<font color="black">.npmignore</font>__|npmパッケージを登録する際の除外ファイルを記載|
|__<font color="red">config.xml</font>__|アプリケーションの様々な挙動をコントロールできる設定ファイル (Global)|
|__<font color="red">hooks</font>__|Cordovaコマンドをカスタマイズする際に利用するフック|
|__<font color="black">package.json</font>__|プロジェクトで使用するパッケージ一覧、バージョンを管理|
|__<font color="red">platforms</font>__|プラットフォーム毎で生成されるフォルダを管理|
|__<font color="red">plugins</font>__|cordovaプラグインのフォルダを管理|
|__<font color="red">res</font>__|リソースファイルを管理 (icon, img, etc)|
|__<font color="red">www</font>__|各プラットフォームに展開されるテンプレートファイル (HTML, CSS, JS)|

#### __4. プラットフォームの追加__
ここでは、アプリケーションを実行するプラットフォームの追加を行います。(ex.Android)

```
$ cordova platform add android
```

インストールが完了したら、```ls```コマンドを用いて、追加されたプラットフォームの確認を行います。

```
$ cordova platform ls
```

>__・出力結果__

>```
Installed platfomrs:
  android 6.2.3
Available platfomrs:
 blackberry10 ~3.8.0 (deprecated)
 browser ~4.1.0
 webos ~3.7.0
 windows ~5.0.0
```

__5. エミュレーターで実行(動作確認)__
実機がないので、エミュレーターにて動作確認を行ってみたいと思います。

```
$ cordova emulate android
```

無事、Androidのエミュレーターが起動しました。


![image.png](https://qiita-image-store.s3.amazonaws.com/0/180432/41176ab0-493a-48e4-679f-b0612da7ee1b.png)


# おわりに
さて、次回は、CordovaアプリのWebView部分をCrossWalkに置き換える方法について、
検証を交えながら、書きたいと思います。

最後までお読みいただき、ありがとうございました。
App.config で「'configuration' 要素が宣言されていません」の警告が出る場合

!['configuration' 要素が宣言されていません](https://qiita-image-store.s3.amazonaws.com/0/114618/d2513b92-8921-65af-c613-47ba6c141893.png)

プロジェクトの「対象のフレームワーク」が catalog.xml で判定できない場合、
スキーマが読み込まれず、XMLの検証(validation)が出来ないため警告となるようです。

catalog.xml は「管理者として実行」したエディタで修正する必要があるので、
対象としたフレームワークの Developer Pack や Targeting Pack のインストールに失敗していると考えた方が良さそうです。


## 手作業での修正

「対象のフレームワーク」が ".NET Framework 4.6.1" の場合に警告が表示される際の修正例。
警告は消えますが、他に影響があるかもしれません。
修正は自己責任で。


### パスの確認

catalog.xml のフォルダは、Visual Studio の設定で変更可能なので、次の手順で設定を確認します。

Visual Studio 2013の場合

1. [ツール] メニューの [オプション]
2. [テキスト エディター] - [XML] - [その他] 
3. [スキーマ]項目


次のような設定になっていると思います。
>"%VsInstallDir%¥xml¥Schemas"


### catalog.xml の修正

テキストエディタを「管理者として実行」で起動。
前段で確認したパスの catalog.xml を開く。

Associationタグの condition属性を修正します。

```xml:修正前
<Association extension="config" schema="%InstallRoot%/xml/schemas/%LCID%/dotNetConfig.xsd" condition="starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v4.5.') or $TargetFrameworkMoniker = ''" />
```

```xml:修正後
<Association extension="config" schema="%InstallRoot%/xml/schemas/%LCID%/dotNetConfig.xsd" condition="starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v4.5.') or starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v4.6.') or $TargetFrameworkMoniker = ''" />
```

こんな感じになれば良いかと。

```xml:catalog.xml
  <Association extension="config" schema="%InstallRoot%/xml/schemas/dotNetConfig20.xsd" condition="starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v2.')" />
  <Association extension="config" schema="%InstallRoot%/xml/schemas/dotNetConfig30.xsd" condition="starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v3.0')" />
  <Association extension="config" schema="%InstallRoot%/xml/schemas/dotNetConfig35.xsd" condition="starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v3.5')" />
  <Association extension="config" schema="%InstallRoot%/xml/schemas/dotNetConfig40.xsd" condition="starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v4.0')" />
  <Association extension="config" schema="%InstallRoot%/xml/schemas/dotNetConfig45.xsd" condition="$TargetFrameworkMoniker = '.NETFramework,Version=v4.5'" />
  <Association extension="config" schema="%InstallRoot%/xml/schemas/%LCID%/dotNetConfig.xsd" condition="starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v4.5.') or starts-with($TargetFrameworkMoniker, '.NETFramework,Version=v4.6') or $TargetFrameworkMoniker = ''" />
</SchemaCatalog>
```


## 参考

- [app config - How to solve "The 'configuration' element is not declared" warning message in C#.net - Stack Overflow](https://stackoverflow.com/questions/25518995/how-to-solve-the-configuration-element-is-not-declared-warning-message-in-c/32591962#32591962)
- [MSDN スキーマ キャッシュ](https://msdn.microsoft.com/ja-jp/library/ms255821.aspx)
directx11のアプリケーションにimguiを導入した際のメモ

directx11のアプリケーションにimguiというオープンソースのGUIフレームワークを導入したときのメモです
https://github.com/ocornut/imgui
## とりあえず動かすには？
directx11のサンプルプロジェクトにある`imgui_impl_dx11.{h,cpp}`を自分のプロジェクトに取り込んで、初期化等すればとりあえず動く
### 初期化
ウィンドウハンドルとdirectx11のデバイス、デバイスコンテキストを渡せば初期化完了
`ImGui_ImplDX11_Init(g_hWnd, g_pd3dDevice, g_pImmediateContext);`
### 描画前準備
imguiのウィジェットを描画登録する前(ゲームループの初めとか)に↓を記述する

これがないとクラッシュする

`ImGui_ImplDX11_NewFrame();`
### ウィンドウに文字列を表示する
Beginの第一引数がウィンドウを識別するIDになっており、Endされるまでは、Beginで指定したIDのウィンドウにウィジェットが追加される

```
ImGui::SetNextWindowSize(ImVec2(320, 100), ImGuiSetCond_Once);
ImGui::Begin("hoge", &show_another_window);
ImGui::Text("fugafuga");
ImGui::End();
```
### 描画
Presentが実行される前に↓
`ImGui::Render();`
### 後処理
解放は忘れずに
`ImGui_ImplDX11_Shutdown();`
## 以下は少しでも躓いた所
### 描画されるけどマウスで操作できない
ウィンドウプロシージャで`ImGui_ImplDX11_WndProcHandler`を呼び出す
サンプルでは↓のように使われていた

```
if (ImGui_ImplDX11_WndProcHandler(hWnd, msg, wParam, lParam))
        return true;
```
### SetNextWindowSizeでサイズを指定しているが変更されない
定義は↓のようになっており、第二引数でサイズを設定する条件を指定できるようだった
`ImGui::SetNextWindowSize(const ImVec2& size, ImGuiSetCond cond)`

全部で4種類の条件が設定できる

|条件|説明|
|:--|:--|
|ImGuiSetCond_Always|常に設定する|
|ImGuiSetCond_Once|アプリケーションを起動する度に一度だけ設定する|
|ImGuiSetCond_FirstUseEver|設定ファイルがない場合に設定する(一度設定すると設定ファイルが作成されるので、以降はファイルの内容が反映される)|
|ImGuiSetCond_Appearing|表示/非表示の切り替え時のみ設定する(イマイチ用途が不明)|

これらの条件の内`ImGuiSetCond_FirstUseEver`を最初に使っていたので、アプリケーションを起動しなおしてもサイズが設定されなくなっていた
### 日本語フォントを読み込んでいるはずなのに表示されない
最初はこのように読み込んでいた

```
ImGuiIO& io = ImGui::GetIO();
io.Fonts->AddFontDefault();
io.Fonts->AddFontFromFileTTF("c:\\Windows\\Fonts\\meiryo.ttc", 18.0f, NULL, io.Fonts->GetGlyphRangesJapanese());
```

実装を追っていないが、`AddFontDefault`を抜くと日本語フォントで表示された

```
ImGuiIO& io = ImGui::GetIO();
io.Fonts->AddFontFromFileTTF("c:\\Windows\\Fonts\\meiryo.ttc", 18.0f, NULL, io.Fonts->GetGlyphRangesJapanese());
```
### 半角文字はデフォルトのままにしたかった
上記の方法で読み込むと、半角英数までメイリオフォントになってしまい、少し見づらかった

↓のようにすると、日本語フォントのみを上書きしてくれる

```
ImGuiIO& io = ImGui::GetIO();
ImFontConfig config;
config.MergeMode = true;
io.Fonts->AddFontDefault();
io.Fonts->AddFontFromFileTTF("c:\\Windows\\Fonts\\meiryo.ttc", 18.0f, &config, io.Fonts->GetGlyphRangesJapanese());
```
### 一部の日本語が？と表示される
以下のQiitaを参考に解消
http://qiita.com/benikabocha/items/a25571c1b059eaf952de
URLについている？とか&とか#とかなんだっけって時に見るやつ

## URLにある?で始まって&でつながってるやつ　パラメータ・クエリ

```
//例
http://qiita.com?tags=WordPress
```

絞り込みとかに使うやつ

## URLにある#から始まってるやつ　ハッシュ・アンカー

```
//例
http://qiita.com#header
```

ページ遷移、ページ内で特定の場所に移動するときに使うやつ
logrotateが動いてるのか確認したいときに実行するコマンド

logrotateが動いているか確認する方法をよく忘れるのでメモ。
環境はUbuntu

```bash:command

cat /var/lib/logrotate/status
```

logrotateをDryRunしたい場合

```bash:command
logrotate -d /etc/logrotate.d/nginx 
```

```shell-session:result
reading config file /etc/logrotate.d/nginx
considering log /var/log/nginx/access.log
  log does not need rotating
considering log /var/log/nginx/error.log
  log does not need rotating
not running postrotate script, since no logs were rotated
not running last action script, since no logs will be rotated
```

目的のものを無理やりローテートさせるには、statusファイルの日付を前日などに書き換える。
古いMacでubuntu14.04をデュアルブートしたい時のエラー

古いMacをもらったが，この記事http://qiita.com/zaburo/items/c650cda45c858fe856a9 に従ってSIPを解除しようとしたが，csrutilコマンドでSIPが解除できない．

色々ネットを見たらリカバリーOSのVerが古く、csrutilコマンドが使えなかった。
SieeraのインストールUSBを作成して、USBブートしてリカバリーモードに入ってcsrutilコマンドでSIPを解除した．

SIPの解除の問題は，古いMacはUSBブートからしか解決できなさそう...
whereとfind_by/findの違い

ド基礎だけど、RailsのActiveRelationにピンと来ていなかった頃に、わからなかった話。
先輩方がチャットでささっと説明しててなるほど！と思ったので残しておきます:slight_smile:

# User.where(id: 1)　と　 User.find_by(id: 1)/User.find(1) の違い

どちらも、DBからデータを取ってきたい処理なのは確か。具体的にどう違うのか？
whereの方は、複数条件をつけて探すことができる、みたいなぼやっとした違いしか頭にうかばなかった。

## whereを使う場合
where句を使うと、常にActiveRelationなので、遅延評価が行われる。
つまり、即座にSQL文が発行されて実行されるわけではない。
返される値のクラスは、`ActiveRecord_Relation`になる。

```rb:
[1] pry(main)>　User.where(id: [1])
#=> [#<User id: 1, email: "xxxxxx@sample.co.jp", created_at: "2017-03-30 01:56:31", updated_at: "2017-06-20 04:50:23"] 
```
```rb:
[7] pry(main)> User.where(id: 1).class
=> User::ActiveRecord_Relation
```

## find_by もしくは、find を使う場合
即座にSQLを実行して、オブジェクトそのものを返す。
返される値のクラスは、ここでは`User`になる。即座にSQLが実行されていることがわかる。

```rb:
[1] pry(main)>　User.find_by(id: 1)
#=> [#<User id: 1, email: "xxxxxx@sample.co.jp", created_at: "2017-03-30 01:56:31", updated_at: "2017-06-20 04:50:23"] 

[2] pry(main)>　User.find(1)
#=> [#<User id: 1, email: "xxxxxx@sample.co.jp", salt: nil, created_at: "2017-03-30 01:56:31", updated_at: "2017-06-20 04:50:23"] 

```

```rb:
[3] pry(main)> User.find_by(id: 1).class
  User Load (0.5ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 1], ["LIMIT", 1]]
=> User(id: integer, email: string, created_at: datetime, updated_at: datetime)

[3] pry(main)> User.find(1).class
  User Load (0.5ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 1], ["LIMIT", 1]]
=> User(id: integer, email: string, created_at: datetime, updated_at: datetime)

```

# 参考
この人の説明はわかりやすい。
<https://stackoverflow.com/a/9574674>
古いAndroidエミュレータでプロキシ設定する

# はじめに

Android 4.x でデバッグしたいので実機ではなくエミュレータでサクッと試験しようと思ったらインターネットにつながらなくてはまったので解決方法をメモしておきます。

Android 7.1.1 (25) のエミュレータだとサクッとネットにつながったんだけど。

# 環境

- Windows 10 Pro
- Android Studio 2.3.3

- emulator: Android 4.3

# 手順

主に [スマホアプリのHTTPS通信をBurp Suiteで確認 | セキュリティ | DoRuby](https://doruby.jp/users/r357_on_rails/entries/Burp-Suite-HTTPS-SSL-ios-android) の手順通り。

- Windowsマシンにプロキシを立てる。
  - Burp Suite Free Edition 1.7.23 をダウンロードし、起動
  - Proxy -> Options で Proxy Listeners -> Add -> Bind to port: 8080, Bind to address: All で。
  - ![image.png](https://qiita-image-store.s3.amazonaws.com/0/39221/8b59f6db-f92d-f2eb-294f-bacdf94a9e22.png)
- エミュレータを作って起動する
    - ![image.png](https://qiita-image-store.s3.amazonaws.com/0/39221/3fd21bbf-3d58-7c4e-787f-8a016ed1e429.png)
- プロキシを設定する
    - Settings -> WIRELESS & NETWORKS -> More... 
    - Mobile networkds -> Access Point Names -> T-Mobile US
    - Proxy: 10.0.2.2, Port: 8080
    - ![image.png](https://qiita-image-store.s3.amazonaws.com/0/39221/e9d5858c-40fd-98a5-d4d0-38add5e00134.png)
- 証明書インストール
    - ブラウザで http://burp/ にアクセス
    - ![image.png](https://qiita-image-store.s3.amazonaws.com/0/39221/6a53f447-3c2e-e646-1183-ba41fe724dac.png) ![image.png](https://qiita-image-store.s3.amazonaws.com/0/39221/469f4c2d-eed3-c14c-2a3c-7c3fc7acfc73.png)
    - CA Certificat タップで証明書ダウンロード
    - ダウンロードした証明書(cacert.der)の拡張子を crt または cer に変更する
        - これをしないと下記でインストールできない。参考⇒[スマホへのBurpの証明書のインストール - DARK MATTER](http://io.cyberdefense.jp/entry/2016/05/12/%E3%82%B9%E3%83%9E%E3%83%9B%E3%81%B8%E3%81%AEBurp%E3%81%AE%E8%A8%BC%E6%98%8E%E6%9B%B8%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB)
        - ![image.png](https://qiita-image-store.s3.amazonaws.com/0/39221/8caa2739-0cc0-2803-0d2f-f4f8c63d0514.png)
    - Settings -> PERSONAL -> Security 
    - Install from SD card
    - ![image.png](https://qiita-image-store.s3.amazonaws.com/0/39221/f243998d-739e-78e9-faad-0b24c0be7188.png)
- アプリからネット接続してみる
    - 無事通信できた。↓はブラウザ経由でTwitterのログイン画面を表示できたところ。
    - ![image.png](https://qiita-image-store.s3.amazonaws.com/0/39221/e1cfc0f4-b296-451a-f654-c50676b86cd2.png)
backlog API を使う④　～backlogプロジェクトユーザにコメントを通知する～

#1、環境
php4.5
windows7

#2、必要な情報
**公式サイト**
https://developer.nulab-inc.com/ja/docs/backlog/api/2/add-comment/

**メソッド**

```ruby:
POST
```

**URL**

```ruby:
/api/v2/issues/:issueIdOrKey/comments 
```


backlogの課題にコメントとユーザーに通知をする為に必要な情報は、以下となります。

|パラメーター名 |内容|
|:-----------------|:------------------|
| apiKey             |APIキー（[backlog API を使う①](http://qiita.com/d2cdot-mmori/items/56c6abc1526fc2b13aef)参照）|
| issueIdOrKey        | コメントしたい課題番号 |
| content           | コメント内容 |
|notifiedUserId[]|コメントの通知を受け取るユーザーID（[backlog API を使う③](http://qiita.com/d2cdot-mmori/items/d2697778b6765d994bd1)参照）|


#3、コード

```ruby:
<?php
/**************************
* backlogの課題にコメントを送信しユーザーに通知する
***************************/
$issueIdOrKey = "HOGE-12"; // コメントしたい課題番号
$backlog_api_key = "作成したAPIキー";
$comment = "コメント";
$notifiedUserId_001 = "コメントの通知を受け取るユーザーID（1人目）";
$notifiedUserId_002 = "コメントの通知を受け取るユーザーID（2人目）";

$comment_url = "https://xxx.backlog.jp/api/v2/issues/".$issueIdOrKey."/comments?apiKey=".$backlog_api_key;
$params = array(
  'content' => $comment,
  'notifiedUserId[0]' => $notifiedUserId_001,
  'notifiedUserId[1]' => $notifiedUserId_002
);
$comment_url = $comment_url . "&".http_build_query($params, "", "&");
$comment_headers = array('Content-Type: application/x-www-form-urlencoded');
$context = array('http' => array(
  'method' => 'POST',
  'header' => $comment_headers,
  'ignore_errors' => true
));
$response = file_get_contents($comment_url, false, stream_context_create($context));
```


#4、レスポンス例
```ruby:成功時レスポンス例
{
  "id": 117039xxxx,
  "content": "コメントテストです。",
  "changeLog": [],
  "createdUser": {
    "id": 107376xxxx,
    "userId": "mori",
    "name": "バックログのユーザー名",
    "roleType": 2,
    "lang": null,
    "mailAddress": "xxxx@xxxxxx.co.jp",
    "nulabAccount": null
  },
  "created": "2017-06-28T03:00:56Z",
  "updated": "2017-06-28T03:00:56Z",
  "stars": [],
  "notifications": [
    {
      "id": 8057xxxx,
      "alreadyRead": false,
      "reason": 2,
      "user": {
        "id": 10738xxxx,
        "userId": null,
        "name": "通知先のバックログのユーザー名",
        "roleType": 1,
        "lang": null,
        "mailAddress": "xxxxxxxxxx@xxxx.co.jp",
        "nulabAccount": null
      },
      "resourceAlreadyRead": false
    }
  ]
}
```

```ruby:失敗時レスポンス例
{
  "errors": [
    {
      "message": "Undefined resource. /api/v2/HOGE-12/comments",
      "code": 6,
      "moreInfo": ""
    }
  ]
}
```

成功すれば、バックログの課題にコメントと特定ユーザーへの通知が確認できると思います！

以上です。