OmniAICreator/Qiita-1.07M huggingface dataset:
AWSのCUIクライアント「AWS CLI」のセットアップ方法

## 「AWS CLI」とは？

「AWS Command Line Interface」の略であり、AWSをCUIで操作するツールです。

## AWS CLIを使うきっかけ

S3にファイルをフォルダごとアップロードしたかったためです。
Safariからだとフォルダごとアップロードできないのですが、AWS CLIを使えばできます。

## 環境

- OS：macOS High Sierra 10.13.1

## セットアップ

### Pythonとpipのインストール

Python製なので動作にPython、インストールにpipが必要です。

私はpyenv-virtualenvを使い、AWSのPython環境を構築しました。
私が以前書いた[この記事](https://qiita.com/uhooi/items/b2f3a121b2e9dac6a256#pyenv-virtualenvのインストール)が参考になります。

```bash
$ pyenv install 3.5.0
$ pyenv virtualenv 3.5.0 aws
$ pyenv rehash
$ pyenv global aws
```

### AWS CLIのインストール

```bash
# AWS CLIをインストールする
$ sudo pip install awscli

# バージョンを確認する
$ aws --version
aws-cli/1.14.36 Python/3.5.0 Darwin/17.2.0 botocore/1.8.40
```

### アクセスキーの作成

AWS CLIからAWSを操作するにはアクセスキーが必要です。

以下へアクセスします。
https://console.aws.amazon.com/iam/home?#/security_credential

[セキュリティ認証情報に進む]をクリックします。
<img width="757" alt="awscli-setup_1_edited.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/138245/f03ee9e0-2819-8b67-5f09-ab6149eedad5.jpeg">

「アクセスキー（アクセスキー ID とシークレットアクセスキー）」をクリックします。
<img width="821" alt="awscli-setup_2_edited.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/138245/6b33f17d-3692-a54c-f68b-5db79b360818.jpeg">

[新しいアクセスキーの作成]をクリックします。
<img width="818" alt="awscli-setup_3_edited.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/138245/86c12ace-2dd9-14b7-73b6-f8e1a6f86f22.jpeg">

[キーファイルのダウンロード]をクリックします。
<img width="759" alt="awscli-setup_4_edited.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/138245/fe33e559-a47a-1507-523c-644cbb7dcab4.jpeg">

「rootkey.csv」がダウンロードされます。

### AWS CLIの初期設定

アクセスキーの情報などをAWS CLIに登録します。

「Default region name」は自分のリージョンを入力します。私は「アジアパシフィック（東京）」なので「ap-northeast-1」と入力しました。
「Default output format」は「json, text, table」の3種類から選択します。私は「json」にしました。

```bash
# AWS CLIの初期設定を行う
$ aws configure
AWS Access Key ID [None]: {rootkey.csvのAWSAccessKeyId}
AWS Secret Access Key [None]: {rootkey.csvのAWSSecretKey}
Default region name [None]: ap-northeast-1
Default output format [None]: json
```

これでAWS CLIからAWSが操作できるようになりました。
`aws s3 ls` でバケットの一覧が表示されれば、セットアップが正常に完了しています。

複数のアカウントを登録する場合、以下の記事が参考になりました。
https://qiita.com/ryuzee/items/e3ce493f132f1981f57a

## 参考リンク

- [AWS CLI のインストールと設定 - Amazon Kinesis Data Streams](https://docs.aws.amazon.com/ja_jp/streams/latest/dev/kinesis-tutorial-cli-installation.html)
- [AWS CLIのインストールから初期設定メモ - Qiita](http://qiita.com/n0bisuke/items/1ea245318283fa118f4a)
- [AWS CLI 環境変数チートシート - Qiita](https://qiita.com/n-oshiro/items/4a7774ee6e1d11bb55d2)
dockerコンテナ内のマウント先のファイルやディレクトリ名が文字化けする

# 環境
* Docker：version 17.12.0-ce
* docker-compose：version 1.8.0
* 使用イメージ：Ubuntu 16.04

# 状況
普段GoogleMusicを使って音楽を聞いているんですが、アプリの改悪などでストリーミング再生が出来ない時があり(1曲ダウンロードが終わるまで待ちぼうけ)、交雑した電車内では結構辛い。
そこで、[Subsonic](http://www.subsonic.org/pages/index.jsp)でメディアサーバを構築しようとしていたところ、マウント先のディレクトリが文字化けしてしまい、サービスからファイルと認識されなかった。(IDタグも無効)

docker-compose のVolumesでホストのディレクトリをコンテナ先でマウントした

![SnapCrab_NoName_2018-2-13_21-38-53_No-00.png](https://qiita-image-store.s3.amazonaws.com/0/37268/4aa5e142-5ee7-b6ff-71cd-a4d8909281fd.png)

コンテナに入って、マウントポイントでlsをしたら文字化け
![SnapCrab_NoName_2018-2-13_21-28-37_No-00.png](https://qiita-image-store.s3.amazonaws.com/0/37268/a03b6b51-f7b8-5000-b36e-b89aee579481.png)


# 解決
Dockerfileに以下のコマンドを追加

```bash:Dockerfile
RUN locale-gen en_US.UTF-8
ENV LANG en_US.UTF-8
ENV LANGUAGE en_US:en
ENV LC_ALL en_US.UTF-8
```
その後、再度イメージをビルド

```bash:bash
docker-compose build
docker-compose up -d
```

確認すると日本語で表示された(コンソールの設定が適切ではなく文字が綺麗に表示されていません)。めでたし
![SnapCrab_NoName_2018-2-13_21-48-0_No-00.png](https://qiita-image-store.s3.amazonaws.com/0/37268/0fed7a7f-0ac1-2776-da7b-c04ac7aeb924.png)
ブラウザー拡張機能（アドオン）開発メモ

最近、（主にFireFox対象だったが）ブラウザ拡張機能（アドオン）を開発する機会があった。その際に参考にしたとっかかりのURLなどを、未来の自分のためのメモとして残しておく。
## とっかかり
**ドキュメントの入り口(FireFox)**
https://developer.mozilla.org/ja/Add-ons/WebExtensions
**ドキュメントの入り口(Chrome)**
https://developer.chrome.com/extensions

※以下は主にFireFoxベースで確認した。互換性注意して実装すれば、対応ブラウザは広がる

##最初に試してみるべきチュートリアル
**初めての拡張機能**
https://developer.mozilla.org/ja/Add-ons/WebExtensions/Your_first_WebExtension
**2つめの拡張機能**
https://developer.mozilla.org/ja/Add-ons/WebExtensions/Walkthrough

## ちょっと試してみたら全体の理解の為に見るべきページ
**拡張機能の中身**
https://developer.mozilla.org/ja/Add-ons/WebExtensions/Anatomy_of_a_WebExtension

##　デバッグ
**FireFoxでのデバッグ**
https://developer.mozilla.org/ja/Add-ons/WebExtensions/%E3%83%87%E3%83%90%E3%83%83%E3%82%B0

## API等利用出来ないと思ったら見るべき権限周り
**Permissons**
https://developer.mozilla.org/ja/Add-ons/WebExtensions/manifest.json/permissions

## 互換性
**各ブラウザでのAPI提供**
https://developer.mozilla.org/ja/Add-ons/WebExtensions/Browser_compatibility_for_manifest.json

## 多分良く使うストレージAPI
**storage API**
https://developer.mozilla.org/ja/Add-ons/WebExtensions/API/storage
**ストレージ、オプションページ、ボタンがまとめて学べるサンプル**
https://github.com/mdn/webextensions-examples/tree/master/forget-it

## サンプル中でよく使われるPromise関連を理解する
**Promise**
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Promise
**Using Promise**
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Using_promises

これぐらいとサンプルコードを見て試せば、徐々に色々と作れるようになるはず。
C | Python > マイナス値のmodulo(%)演算 > C:マイナスを返す | Python:プラスを返す

[Pythonで一定時間ごとに処理を実行する](https://qiita.com/kurogelee/items/0e5fd8b6a1d1f169179a)
の実装で以下のmodulo(%)演算はマイナス値が返ると思っていた自分がいました。

```
next_time = ((base_time - time.time()) % interval) or interval
```

### C

https://ideone.com/cgMjRc

```c
#include <stdio.h>

int main(void) {
	int val = -3;
	printf("%d\n", val % 5);
	return 0;
}
```

```txt:run
-3
```

### Python 3.5

https://ideone.com/CMgBPa

```py
val=-3
print(val % 5)
```

```txt:run
2
```

### 備考

Pythonをよく使う人は知っていることなのかもしれない。

https://docs.python.org/3/reference/expressions.html
下記の赤文字は強調のため色付けした。
> The % (modulo) operator yields the remainder from the division of the first argument by the second. The numeric arguments are first converted to a common type. A zero right argument raises the ZeroDivisionError exception. The arguments may be floating point numbers, e.g., 3.14%0.7 equals 0.34 (since 3.14 equals 4*0.7 + 0.34.) <font color=red>The modulo operator always yields a result with the same sign as its second operand (or zero)</font>; the absolute value of the result is strictly smaller than the absolute value of the second operand
【React Native】react-native-fbsdk キーハッシュ取得 (Android)

## デバック用
MainApplication.javaにKeyHashを吐き出すログを仕込む。

```
import android.content.pm.PackageInfo;
import android.content.pm.PackageManager;
import android.content.pm.Signature;
import android.util.Base64;
import android.util.Log;
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
```


```
    @Override
    public void onCreate() {
        super.onCreate();

        // Add code to print out the key hash
        try {
            PackageInfo info = getPackageManager().getPackageInfo(
                    "com.plentyusa.remote.junkichitest",
                    PackageManager.GET_SIGNATURES);

            for (Signature signature : info.signatures) {
                MessageDigest md = MessageDigest.getInstance("SHA");
                md.update(signature.toByteArray());
                Log.d("KeyHash:", Base64.encodeToString(md.digest(), Base64.DEFAULT));
            }
        } catch (PackageManager.NameNotFoundException e) {

        } catch (NoSuchAlgorithmException e) {

        }
    }
```

## リリース用

YOUR_RELEASE_KEY_ALIAS：.keystore作成した時のエイリアス


```
keytool -exportcert -alias YOUR_RELEASE_KEY_ALIAS -keystore YOUR_RELEASE_KEY_PATH | openssl sha1 -binary | openssl base64
```

### .keystoreのエイリアス確認方法
YOUR_RELEASE_KEY_PATH：.keystoreのパス
YOUR_RELEASE_KEY_PASSWORD：.keystoreのパスワード
```
keytool -v -list -keystore YOUR_RELEASE_KEY_PATH -storepass YOUR_RELEASE_KEY_PASSWORD
```
go1.10のtest2jsonを試してみた

# 1行でまとめ

test2jsonは、テストレポートをjsonで出力してくれるやつだった。

# go1.10でのtestingパッケージ新機能

go1.10の[Draft Release Notes](https://tip.golang.org/doc/go1.10)を読んでいたら「test2json」なるgo toolsが出るよと書かれていたので試してみた。

# test2json試してみた。

リファレンスは[こちら](https://tip.golang.org/cmd/test2json/)

@chimatter氏の[go get go1.10rc2 で気楽に 1.10 を試す](https://qiita.com/chimatter/items/016ea5e6a578e9b105b7)を頼りに go1.10rc2をインストールしたあと、足し算と簡単なテストを書いてみる。

``` calc.go
package main

func Add(x int , y int) int {
	return x + y
}
```

``` calc_test.go
package main

import (
	"testing"
	"github.com/stretchr/testify/assert"
)

func TestAdd(t *testing.T) {
	testCases := []struct {
		x int
		y int
		ans int
	}{
		{1, 2, 3},
		{3, 4, 7},
	}
	for _, test := range testCases {
		assert.Equal(t, Add(test.x, test.y), test.ans, "test fail.")
	}
}
```

通常、goのテストを叩くときは

```
$ go test .
```

とコマンドを実行すればいいのだが、 test2json 経由で結果をjson出力したい場合はこのようになる。

```
$ go1.10rc2 test -json .
{"Time":"2018-02-13T21:29:12.168347168+09:00","Action":"run","Package":"_/Users/dproject21/rc_test","Test":"TestAdd"}
{"Time":"2018-02-13T21:29:12.168552203+09:00","Action":"output","Package":"_/Users/dproject21/rc_test","Test":"TestAdd","Output":"=== RUN   TestAdd\n"}
{"Time":"2018-02-13T21:29:12.168569401+09:00","Action":"output","Package":"_/Users/dproject21/rc_test","Test":"TestAdd","Output":"--- PASS: TestAdd (0.00s)\n"}
{"Time":"2018-02-13T21:29:12.168574805+09:00","Action":"pass","Package":"_/Users/dproject21/rc_test","Test":"TestAdd","Elapsed":0}
{"Time":"2018-02-13T21:29:12.168585837+09:00","Action":"output","Package":"_/Users/dproject21/rc_test","Output":"PASS\n"}
{"Time":"2018-02-13T21:29:12.168590911+09:00","Action":"output","Package":"_/Users/dproject21/rc_test","Output":"ok  \t_/Users/dproject21/rc_test\t(cached)\n"}
{"Time":"2018-02-13T21:29:12.168598287+09:00","Action":"pass","Package":"_/Users/dproject21/rc_test","Elapsed":0}
```

ちなみに、2018/2/13時点で

```
$ go test -json .
```

と叩くと、「そんなフラグねーよ」と怒られるのでお気をつけください。
HumHub Tips

## 概要
HumHubのTipsです。

## 関連
- [HumHubというCMSを使ってSNSを秒で作る](https://qiita.com/Esfahan/items/974687234566ef6b069d)

## Module.phpで定義したプロパティを呼び出す方法
モジュールのModule.phpで定義したプロパティは、モデルの中で以下のように呼び出すことができます。

### `$minimumUsernameLength`を定義して呼び出してみる

モジュールのファイルで定義
protected/humhub/modules/user/Module.php

```php
<?php
namespace humhub\modules\user;

use Yii;

/**
 * User Module
 */
class Module extends \humhub\components\Module
{
    /* snip */

    /**
     * @var int minimum username length
     * @since 1.2
     */
    public $minimumUsernameLength = 4;
```

モデルで呼び出す
protected/humhub/modules/user/models/User.php

```php
$userModule = Yii::$app->getModule('user');
echo $userModule->minimumUsernameLength; // 4
```
サークルプログレスバーのSampleをVueに移植してみた

# 背景

CodePenが埋め込めるということなのでやってみたくなった

# 成果物

<p data-height="265" data-theme-id="0" data-slug-hash="qxjGvM" data-default-tab="js,result" data-user="sqrt3" data-embed-version="2" data-pen-title="Vue.js SvgCircleProgressBar" class="codepen">See the Pen <a href="https://codepen.io/sqrt3/pen/qxjGvM/">Vue.js SvgCircleProgressBar</a> by Takafumi Inamitsu (<a href="https://codepen.io/sqrt3">@sqrt3</a>) on <a href="https://codepen.io">CodePen</a>.</p>
<script async src="https://production-assets.codepen.io/assets/embed/ei.js"></script>

# 参照

[Radial Progress Meters (CSS/SVG)](https://codepen.io/xgad/post/svg-radial-progress-meters)
Vue.jsで style scoped な単一ファイルコンポーネントのcssをオーバーライドする

```:こちらのサイトを参考にしました
https://medium.com/vuejs-tips/override-scoped-css-de4275119b87
```

単一ファイルコンポーネントを作る時、
style scoped として CSSの影響範囲をコンポーネント内に収めるわけですが、
コンポーネント外部から内部のスタイルを変更したい場合があります。

```html:Box.vue
<template>
  <div class="box">
    <div class="message">
      <slot></slot>
    </div>
  </div>
</template>

<script>
export default {
  name: 'box'
}
</script>

<style scoped>
.box {
  display: inline-block;
}

.box .message {
  background-color: orange;
  padding: 1em;
}
</style>

```

前提として、Boxコンポーネントは登録済みです。

```javascript:main.js
import Vue from 'vue'
import App from './App.vue'
import Box from './Box.vue'

Vue.component('box', Box)

new Vue({
  el: '#app',
  render: h => h(App)
})

```

次のようなテンプレートを記述したとします。

```html:App.vue
<template>
  <div id="app">
    <box class="green">.green</box>
    <box class="green override">.green.override</box>
    <span class="parent"><box class="green">.parent .green</box></span>
  </div>
</template>

<script>
export default {
  name: 'app',
  data () {
    return {
    }
  }
}
</script>
<style scoped>

</style>
```

この時の表示は以下のようになります。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5557/f8063908-dba5-a7df-0d3d-f24d1aef9500.png)

ここで、ボックスの色をオレンジから緑に変えたいとします。

この時のHTML（１つめのボックス部分）はこのようになっています。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5557/bddfa81a-8d15-ce3d-34ac-d60df8801e6c.png)


単純に１つめのボックスに対してCSSを記述してみます。

```html:App.vueの一部
<style scoped>
.green .message {
  background-color: green;
}
/* or */
.box .message {
  background-color: green;
}
</style>
```

まとめて２つ書きましたが、scopedされているため、このどちらも作用しません。

次のように属性セレクタをつけることで作用させることができますが、
セレクタに用いる属性値を事前に知ることはできません。

```css:
.green .message[data-v-1461803c] {
  background-color: green;
}
/* or */
.box[data-v-1461803c] .message[data-v-1461803c] {
  background-color: green;
}
```

scoped スタイルで入れ子のセレクタが必要なら、CSS に対して >>> オペレータを使用する必要があります。

```:引用元
https://vue-loader.vuejs.org/ja/features/scoped-css.html
```

と引用元に記載されているのを参考に次のようにしてみますが、やはり効果がありません。

```css:
.green >>> .message {
  background-color: green;
}
```

どうやらセレクタは期待通りに動作しているようです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5557/b7231724-5c16-6b33-6ae4-799057d53378.png)

しかし、CSSの適用順によってうまく効果が出ていないことがわかります。

どちらも詳細度が同じ為、順序が優先されています。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5557/2089d8a5-3981-995b-6b41-a72f14892908.png)

```:詳細度確認
https://specificity.keegan.st/
```

１つ目のボックスのようにクラス１つでは詳細度が足りないため、２つ目のボックスのようにクラスを２つ付けます。

```html:
    <box class="green override">.green.override</box>
```

これに対して、次のようにCSSを記述することで詳細度を上げ、指定を優先させることができます。

```:css
.green.override >>> .message {
  background-color: green;
}
```

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5557/13634e54-135d-f515-663d-50490b030c39.png)

または、３つ目のボックスのように親要素をつけることでも実現できます。

```html:
<span class="parent"><box class="green">.parent .green</box></span>
```
```css:
.parent .green >>> .message {
  background-color: green;
}
```

これで、望みどおりのスタイルが適用できました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5557/1ee6ba7d-91ce-065c-0d33-050151187970.png)
リモート サーバーから予期しない応答が返されました: (413) Request Entity Too Large。

# 問題
WCFサービスをアクセス時下記のエラーになります。

```
 リモート サーバーから予期しない応答が返されました: (413) Request Entity Too Large。
```

#解決方法
サービス側　Web.configのsystem.serviceModelセクションに下記の設定を追加

```xml:Web.xml
 <system.serviceModel>
    <bindings>
      <basicHttpBinding>
        <binding maxReceivedMessageSize="2147483647">
        </binding>
      </basicHttpBinding>
    </bindings>
...
</system.serviceModel>

```

#参考資料
https://forums.asp.net/t/2105419.aspx?WCF+error+The+remote+server+returned+an+error+413+Request+Entity+Too+Large+
elasticsearch6.1.2 -> 6.2.0にするときはご注意を

# はじめに
こんにちは。StreetFighter大好きエンジニアの @mizai です。
(ちなみに、SF5では、バイソンでスーパープラチナリーグまで行きました。)

今、自分のチームでは、とあるクローラのリビルドを行っています。

こんな感じのシステム構成
![スライド1.PNG](https://qiita-image-store.s3.amazonaws.com/0/98909/16202891-47ec-9a8f-ed62-0c4303452cd5.png)

クローラサーバもElasticsearchも
CentOS7

そこで起こった問題/解決方法を伝えていければなぁと思います。

# 今回のトラブル
Elasticsearch(以下、ES)をバージョンアップしようとしたら、できなくて焦った！！

# 経緯
ES6.1.2でシステムを作っていた。
ある日、6.2.0になっていることに気づいた。
「ESのバージョンアップ、早いなぁ！」と思いながらもバージョン上げたくなって、公式ドキュメントの手順通り作業実施。
(6.2.0にアップデートしたのは、ES新バージョンがでた当日ということは内緒ですｗ)

公式手順
https://www.elastic.co/guide/en/elasticsearch/reference/current/rolling-upgrades.html

「ふむふむ、まぁ yum updateして、入れているプラグイン消して、再インストールしたらいいのね」

ってことで yum update は無事終了。
そして、プラグインを消そうとしたとき！！！

```
$ sudo /usr/share/elasticsearch/bin/elasticsearch-plugin remove analysis-icu

Exception in thread "main" java.lang.IllegalArgumentException: plugin [analysis-icu] is incompatible with version [6.2.0]; was designed for version [6.1.2]
        at org.elasticsearch.plugins.PluginInfo.readFromProperties(PluginInfo.java:224)
        at org.elasticsearch.plugins.PluginsService.getPluginBundles(PluginsService.java:329)
        at org.elasticsearch.plugins.RemovePluginCommand.execute(RemovePluginCommand.java:89)
        at org.elasticsearch.plugins.RemovePluginCommand.execute(RemovePluginCommand.java:67)
        at org.elasticsearch.cli.EnvironmentAwareCommand.execute(EnvironmentAwareCommand.java:86)
        at org.elasticsearch.cli.Command.mainWithoutErrorHandling(Command.java:124)
        at org.elasticsearch.cli.MultiCommand.execute(MultiCommand.java:75)
        at org.elasticsearch.cli.Command.mainWithoutErrorHandling(Command.java:124)
        at org.elasticsearch.cli.Command.main(Command.java:90)
        at org.elasticsearch.plugins.PluginCli.main(PluginCli.java:48)
```

「えええええ！！なにこれ！！！」
と思って焦りました。
エラーのスタックトレースから、ソースコードを見てみたもののよくわからず、、、

「ES消して、再インストールしたら行けんじゃね？」と思って、

`yum remove elasticsearch`

「お！よし、消えた！」

`yum install elasticsearch`

「おおお！ちゃんと入った！」

プラグインインストール！！
`$ sudo /usr/share/elasticsearch/bin/elasticsearch-plugin install analysis-icu`

おおお！ちゃんと入ったー！！

# 結論
ということで、ES消して、再インストールしたらちゃんと最新バージョンになりました。

# 補足
`yum remove elasticsearch`をしたときに、必要な設定ファイルはバックアップ取ってくれてました。

こんな感じ

```
インストール容量: 31 M
上記の処理を行います。よろしいでしょうか？ [y/N]y
Downloading packages:
Running transaction check
Running transaction test
Transaction test succeeded
Running transaction
Stopping elasticsearch service... OK
  削除中                  : elasticsearch-6.2.0-1.noarch                                                                                                      1/1
警告: /etc/elasticsearch/jvm.options は /etc/elasticsearch/jvm.options.rpmsave として保存されました。
警告: /etc/elasticsearch/elasticsearch.yml は /etc/elasticsearch/elasticsearch.yml.rpmsave として保存されました。
Deleting log directory... OK
Deleting plugins directory... OK
  検証中                  : elasticsearch-6.2.0-1.noarch                                                                                                      1/1

削除しました:
  elasticsearch.noarch 0:6.2.0-1

完了しました!

```

# 最後に
正しいやり方かどうかはわかりませんが、少しでも誰かの参考になれば。
最新の次元圧縮法"UMAP"について

#はじめに

こんにちは！
皆さん次元圧縮手法といえばどのようなものを思いつきますか？
PCA,Isomap,t-SNEなどでしょう。
こちらの記事が大変よくまとめられています。
[高次元データの次元削減および2次元プロット手法](https://qiita.com/TomHortons/items/2064870af3f3f7f2b209)

今日ご紹介したいのは**UMAP**という次元削減手法です。
論文がarXivに2018年2月9日に上がったばかりの手法です。
なんと、t-SNEと同程度の次元削減を数倍の速さでできてしまいます。
論文については、リーマン幾何学と代数トポロジーを背景にされているようなのでじっくり読み込んで後日まとめたいと思います。
興味のある方はこちらからどうぞ
[UMAP: Uniform Manifold Approximation and Projection for Dimension Reduction](https://arxiv.org/pdf/1802.03426.pdf)

#使ってみよう
なんと早くもライブラリが公開されています。
ひとまず使ってみましょう。

### インストール
```
pip3 install umap-learn
```

使い方は基本的にscikit-learnと同じです。
MNISTを使ってt-SNEと比較してみました。
[t-SNEによるイケてる次元圧縮&可視化](https://qiita.com/stfate/items/8988d01aad9596f9d586)

公式GitHubには書いてあるのですが、

```
from scipy.sparse.csgraph import connected_components
```
を書かないとエラーが出てしまいます。

```reduction.py
import umap
from sklearn.datasets import load_digits
from scipy.sparse.csgraph import connected_components
import matplotlib.pyplot as plt
import matplotlib.cm as cm
from sklearn.manifold import TSNE
import time

def main():
    digits = load_digits()
    digits.target = [float(digits.target[i]) for i in range(len(digits.target))]

    # UMAP
    start_time = time.time()
    embedding = umap.UMAP().fit_transform(digits.data)
    interval = time.time() - start_time
    plt.scatter(embedding[:,0],embedding[:,1],c=digits.target,cmap=cm.tab10)
    plt.colorbar()
    plt.savefig('umap.png')

    # t-SNE
    plt.clf()
    start_time2 = time.time()
    tsne_model = TSNE(n_components=2)
    tsne = tsne_model.fit_transform(digits.data)
    interval2 = time.time() - start_time2
    plt.scatter(tsne[:,0],tsne[:,1],c=digits.target,cmap=cm.tab10)
    plt.colorbar()
    plt.savefig('tsne.png')

    print('umap : {}s'.format(interval))
    print('tsne : {}s'.format(interval2))

if __name__ == "__main__":
    main()
```

出力結果がこちらです。
**t-SNE**
![tsne.png](https://qiita-image-store.s3.amazonaws.com/0/182836/bfcd6465-7fb7-9c6b-291e-d07a9c2b7a85.png)
**UMAP**
![umap.png](https://qiita-image-store.s3.amazonaws.com/0/182836/8b9df586-a585-0198-0b66-c76cd8f97754.png)

UMAPの方がよりはっきり分かれている印象ですね。

驚くべきは実行時間の差です。

```
umap : 5.383596897125244s
tsne : 34.21198582649231s
```

なんと僕の出力結果では６倍以上の速度を計測しました。


大変興味深いですね。
数学の復習をしながら論文を読んで、解説記事を更新したいと思います。
相対パスでtarを作るときにハマった恥ずかしい失敗

[tar コマンドで絶対パスのアーカイブはダメ絶対](http://tesiri.hateblo.jp/entry/2015/02/22/090248)に書かれているように、
`-C`オプションを使って相対パスでtarを作るべし、とある。

これを見て必死に以下のようにコマンドを打ったが・・・

~~~bash:誤
$ tar cf foobar.tar -C /home/hoge /home/hoge/foobar
tar: メンバ名から先頭の `/' を取り除きます
~~~

・・・なんで？？


正しくは下記のように、***圧縮対象を`-C`で指定したディレクトリからの相対パスを指定***しないと無意味!!
(`-C`はあくまでディレクトリを変更するだけ)

~~~bash:正
$ tar cf foobar.tar -C /home/hoge foobar
~~~


私はオプションの順番が違うのかな、などと10分近く時間を使ってしまった。
おお恥ずかしい。
RubyのNokogiriでXMLをパースする

サンプル

```ruby
require 'nokogiri'

count = 0
File.open("./source.xml", 'r') do |f|
  xml = Nokogiri::XML(f)
  item_nodes = xml.xpath('/xpath/to/contents')
  item_nodes.each do |elem|
    count += 1
  end
end

puts count #=> ex. 100
```

* `Nokogiri::XML`にFileクラスのオブジェクトを渡す。
* 要素の探索はXPathを使う
* xpathメソッドの返り値は`Nokogiri::XML::NodeSet`のオブジェクトで、Enumerable

XPathの指定方法は
https://qiita.com/rllllho/items/cb1187cec0fb17fc650a
を参考にしました。

以上です。
C++ Builder > code page > 1252 > used by default in the legacy components of Microsoft Windows in English

```txt:動作環境
C++ Builder XE4
```

https://edn.embarcadero.com/article/39387
のQC# 67686

Description(抜粋):
>...
>Internally, Lowercase() and UpperCase() are not initializing the ECX register (which is used to hold the target codepage for the new string memory) when calling System.@LStrSetLength(), so whatever random value was already in ECX gets used as the codepage.

Steps:
> uses AnsiStrings; var astr : AnsiString; ustr : UnicodeString; cp: Word; begin astr := AnsiStrings.LowerCase('ABCDE'); cp := StringCodePage(astr); // <-- expected 0 or 1252, got random value instead ustr := astr; // <-- conversion to UTF-16 fails, ustr ends up with empty data end;

code page 1252は何か。

https://en.wikipedia.org/wiki/Windows-1252
> Windows-1252 or CP-1252 (code page – 1252) is a 1 byte character encoding of the Latin alphabet, used by default in the legacy components of Microsoft Windows in English and some other Western languages (other languages use different default encodings).

英語版のWindowsにおいて使われているデフォルトのコードページなのだろう。

日本語版でテストしても不具合の再現は難しいかもしれない。

LowerCase()もしくはUpperCase()を使用したときにLStrSetLength()がコールされ、それによる不具合が発生しているのだろうか。

- [c++ builder > Assertion failed: (vbFlag && (errPtr->ERRcInitDtc >= ...](https://qiita.com/7of9/items/1ac1d0ca8e0c0c365ee3)
Unity Animations ふわふわする文字を作りたい

##「Congratulations!」をずっとふわふわさせる演出にしたい！
とサンプルゲーム作り終わったあとに思ったので、どうしようか考えました。
具体的には、「下から上に上がってきた後に、真ん中らへんでふわふわさせたい」です。

**【方法１】**
①２つのアニメーションを作る。１つは下から上にいくやつ。　２つめは真ん中から上下にふわふわループするやつ。
②２つとも残しておくと文字が重なってしまうので、１個目のやつを1.0f後に消す。（SetActive()使うよ）

**【方法２】**
①Invokeメソッドを使って「文字を消すメソッドを呼び出」す。
②その後にふわふわエフェクトが動き始めるように、時間差で２個目を.SetActive(true)で表示する。

~~方法２でDestroyメソッドを使ってみたかったけど、Destroy(gameObject);のgameObjectにオブジェクト名入れたのにエラー起きるんだけどなんでー？状態になったのでやめた。~~
簡単な方法１でやろうね！

---

まずシーンを管理するManagerゲームオブジェクトを作って、そこにDeleteLatterスクリプトを作ってアタッチ。DeleteLatterスクリプトは以下のように書く。

```:DeleteLatter.csharp

public class DeleteLatter : MonoBehaviour {

	public GameObject Congratulations;
	public GameObject Effect;

	void DeleteLetters(){
		Congratulations.SetActive (false);
	}

	void AddEffect(){
		Effect.SetActive (true);
	}



	// Use this for initialization
	void Start () {
		//1.0f後に非表示にする
		Invoke("DeleteLetters",1.0f);
		//1.0f後に表示する
		Invoke("AddEffect",1.0f);

		
	}

	(省略)
}
```

Invokeメソッドで1.0f後にSetActiveをfalseにしたいので、スクリプト側からいじれるようにpublic GameObject　Congratulationsでコンポーネントを作成。（キレイにまとまるから）DeleteLettersメソッドでSetActive(false)の処理をさせるようにして、Startメソッド内でInvokeメソッドを使い、開始から1.0f後にDeleteLattersメソッドが処理されるように記述した。AddEffectメソッドも同様。
![congratulationsMovie.gif](https://qiita-image-store.s3.amazonaws.com/0/234198/92bf7e0b-cc4b-6b3d-a0fd-358b7b0723f4.gif)
SoftEtherの「WAN高速化機能(UDPアクセラレーション)」、どこのポートを開けたら速くなる？

# 結論
- UDP 40000-44999
- TCP 5555(などの、リッスンに使用するTCPポート)
- UDP 8888(などの、リッスンに使用するUDPポート)

## あらまし
softether/PacketiXは、最新バージョンになってから、（SoftEther独自のVPNプロトコルで接続を行うならば）WAN高速化機能（UDPアクセラレーション機能）が利用可能だ。
初回のみhttps接続で通信を行い、接続確立後は生存確認の為にhttpsを投げ合い、他はUDPで通信するという機能とのこと。
https://www.softether.jp/1-product/11-vpn/41-new/3

>VPN 接続が一端確立されると、両者は互いに UDP パケットを物理的に送り合い、UDP による疎通が可能であるかどうかを検証します。

お前どこ見とんねん。

で、フォーラムにこのような記事。
Ports used for UDP acceleration
http://www.vpnusers.com/viewtopic.php?t=9224

ソレに対して、softetherはデフォルトでここのポート見てるよというソース。
https://github.com/SoftEtherVPN/SoftEtherVPN/blob/1e17c9bcfd7e7b31756aa5389bcbff76c2c9c88a/src/Cedar/UdpAccel.h#L139


## SoftEther ServerがWindowsに存在し、エフェメラルポートを設定する必要がある場合
Ephemeralポートとして利用されるポートの範囲を変更する
http://d.hatena.ne.jp/itotto/20100412/1271082708

# あとがき
気づいたかも知れないが、この記事は私用のメモである。
asp.net core 発行時にnode_modelesのファイルが消える件



発行時に以下のようなメッセージが出て発行が失敗する事がありました。

```
npm install
- moment@2.20.1 node_modules\moment
- angular2-router-loader@0.3.5 node_modules\angular2-router-loader
- moment-timezone@0.5.14 node_modules\moment-timezone
node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js --env.prod
```

## 原因

プロジェクト直下にある以下のファイルが影響していました。
npm-shrinkwrap.json

JS追加時に、package.jsonにJSを追加しかしておらず、npm-shrinkwrap.jsonには追加したJSへの参照が無い状態でした。

この状態でnpm install　を行った場合、npm-shrinkwrap.jsonにないJSパッケージは削除されるようです。

ということで、以下コマンドを走らせnpm-shrinkwrap.jsonを再作成しました。
`npm shrinkwrap`

今度はJSが消えることなく発行が成功しました。



[npm WARN install Couldn't install optional dependency: Unsupported](https://github.com/npm/npm/issues/9204)
axiosをrailsと通信するときにとりあえずやっておくこと

# 環境
* rails (5.2.0.rc1)
* @rails/webpacker (3.2.1)
* axios (0.17.1)

rails, axiosは導入済みとします

**2018/3/2**
systemテスト時にcsrf-tokenが取れなくてエラーになったのでaxiosのREADMEを眺めていたら
インスタンス作成時にオプションで指定すればいいだけだったのでそのように修正
csrf-tokenもない場合の考慮を入れました

**2018/5/14**
検索などgetでネストしたパラメータをaxiosで送ろうとしたら

```javascript
axios.get('items', {
  params: {
    search: {word: "hoge"},
    page: 1
  }
})
```

```log
Started GET "/items?search=%7B%22word%22:%22hoge%22%7D&page=1"
Parameters: {"search"=>"{\"word\":\"hoge\"}", "page"=>"1"}
```

上記のようにエスケープされてしまい params[:search][:word] が出来ませんでした
ということで、axiosはパラメータのパーサーを上書き出来るようなので下記を追加したところ

```bash
yarn add qs
```

```javascript
import qs from 'qs'

const instance = axios.create({
  ...略

  paramsSerializer: (params) => {
    return qs.stringify(params, {arrayFormat: 'brackets'})
  }
```

```log
Started GET "/items?search%5Bword%5D=hoge&page=1"
Parameters: {"search"=>{"word"=>"hoge"}, "page"=>"1"}
```

良い感じになりました

# 成果物

```javascript:app/javascript/packs/axios.js
import axios from 'axios'
import qs from 'qs'

const tokenElement = document.querySelector('meta[name=csrf-token]')
const instance = axios.create({
  headers: {
    'X-Requested-With': 'XMLHttpRequest',
    'X-CSRF-TOKEN': (tokenElement) ? tokenElement.content : null
  },

  paramsSerializer: (params) => {
    return qs.stringify(params, {arrayFormat: 'brackets'})
  }
})

export default instance
```

一旦AxiosRootでオリジナルをインポートしてから、extendsした新しいAxiosクラスにhadersを定義するという感じです
後は拡張したファイルを使う場所でimportして使うだけです

```javascript:app/javascript/packs/items.js
import Vue from 'vue/dist/vue.esm'
import axios from './axios'

export default {
  name: 'ItemList',

  props: {
    url: {
      type: String,
      required: true
    }
  },

  data () {
    return {
      items: []
    }
  },

  created () {
    this.asyncItems()
  },

  methods: {
    asyncItems () {
      axios.get(this.url).then(response => {
        this.items = response.data
      }).catch(error => {
        console.log(error)
      })
    }
  }
}
```

# 参照

https://github.com/axios/axios/issues/391
https://qiita.com/sukechansan/items/738b4bdaffc07c337a70
Slackbotを配布するための、OAuth認証をするためのスクリプト

SlackBotを配布するためにはSlackのoauth.accessAPIを叩く必要がありますが、サーバを用意するのも面倒だったため、スパッとGoogle Apps Scriptで書きました。
Google Apps Scriptを新規で作成して、そのファイルのURLをOAuth & PermissionsのRedirect URLsに追加します。
Google Apps Scriptの中身は下記のClientIDとClientSecretを編集したあとコピペしてください。
これでSlackBotを配布する準備ができました。簡単。

```
var CLIENT_ID = "YOUR CLIENT_ID";
var CLIENT_SECRET = "YOUR CLIENT_SECRET";

function doGet(request) {
  try {
    var payload = {
      "client_id": CLIENT_ID,
      "client_secret": CLIENT_SECRET,
      "code": request.parameter.code
    };
    UrlFetchApp.fetch("https://slack.com/api/oauth.access", {
      "method": "post",
      "contentType": "application/x-www-form-urlencoded",
      "payload": payload
    });
    return HtmlService.createTemplateFromFile("result").evaluate();
  } catch(error) {
    // error handling
  }
}
```

result.html（oauth認証成功後に表示させるHTML）

```
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    認証が成功しました。
  </body>
</html>
```
pythonでローカルwebサーバを立ち上げる

#概要
pythonで検証用のwebサーバを起動する方法です。
ローカル上で動作確認をしたいので、pythonの標準ライブラリでwebサーバを立ち上げてHTMLの表示まで。

#環境
Mac Sierra 10.12.6
python3.5

##pythonのインストール
[pythonのインストール](https://qiita.com/bgg0u/items/935cf187aec5cf144558)


#webサーバの起動
ターミナルの任意の場所で以下を実行

```shell
$ python -m http.server 8000
Serving HTTP on 0.0.0.0 port 8000 (http://0.0.0.0:8000/) ...
```

【python2.7の場合】※2系と3系でモジュール名が変わっているので注意

```shell
$ python -m SimpleHTTPServer 8000
```
となります。

起動できたらお使いのブラウザから
http://localhost:8000
を開きましょう。

<kbd><img width="1614" alt="スクリーンショット 2018-02-13 16.49.59.png" src="https://qiita-image-store.s3.amazonaws.com/0/216762/39ace900-8abd-8656-1237-4b8dd6f21d1f.png"></kbd>

実行したディレクトリが表示されます。
確認ができたら``Ctrl+c``でwebサーバを閉じます。

##ドキュメントルートの作成
今度はpythonスクリプトでwebサーバを起動します。
まず、ドキュメントルートとなるディレクトリを作成しましょう。
ディレクトリを作成したらその中に以下を作成します。

＊simpleserver.py・・・webサーバ起動用スクリプト

```simpleserver.py
import http.server
import socketserver

PORT = 8000
Handler = http.server.SimpleHTTPRequestHandler

with socketserver.TCPServer(("", PORT), Handler) as httpd:
    print("serving at port", PORT)
    httpd.serve_forever()
```

【python2.7の場合】

```simpleserver.py
import SimpleHTTPServer
import SocketServer

PORT = 8000
Handler = SimpleHTTPServer.SimpleHTTPRequestHandler
httpd = SocketServer.TCPServer(("", PORT), Handler)

print "serving at port", PORT
httpd.serve_forever()
```

＊index.html・・・ブラウザに表示するHTMLファイル

```index.html
<html>
<body>
successfully！
</body>
</html>
```

今度はpythonスクリプトでwebサーバを起動します。

```shell
$ python simpleserver.py
```

http://localhost:8000
を開いて``successfully！``が表示されればOKです。

が、このままではあまりにも寂しいので、形だけでもホームページを置こうと思います。

https://aperitif.io/
☝️ここからサンプルをもらう

HEADER、CONTENT、FOOTERあたりを適当に選択します。
右上のGENERATEをクリック👉file.zipがインストールされる

これの解凍した中身を先ほど作成したドキュメントルートに置きましょう。
で、仮で作ったindex.htmlを削除してtemplate.htmlをindex.htmlにリネームします。
で、またアクセスすると👉http://localhost:8000

<img width="1388" alt="スクリーンショット 2018-02-13 19.05.18.png" src="https://qiita-image-store.s3.amazonaws.com/0/216762/d2013e3c-dad0-3760-945e-acacd5236e95.png">

画面が表示されるようになりました。
[CocoaPods] pod setup がイマイチ上手くいかない件

#動作環境

macOS Sierra バージョン　10.12.6



#何が起きたか

MacOS SierraにてSwiftでiOSアプリ開発を進める際、CocoaPodsを使ってオープンソースライブラリをインストールする必要があった。
早速、CocoaPodsの公式サイト（https://cocoapods.org/app）よりダウンロードして展開・インストールを行い、CUIコマンドツールをインストール。
ここまでは完了したのだがその次、


```terminal
$ pod setup
```


を実行して初期設定を行いたいのだが、下記のようなエラーが発生する。


```terminal

$ pod setup
usage: dirname path
Setting up CocoaPods master repo
  $ /Users/ユーザー名(人によって違うのでこう書いてます)/Downloads/installer
  etc/CocoaPods.app/Contents/Resources/bundle/bin/git -C
  /Users/ユーザー名/.cocoapods/repos/master fetch origin --progress
  fatal: Unable to find remote helper for 'https'
[!] CocoaPods was not able to update the `master` repo. If this is an unexpected issue and persists you can inspect it running `pod repo update --verbose`


```
というエラーが発生。CocoaPodsのmasterに原因があり？




#試したこと
CocoaPodsのGitのmasterを一度削除し、

```terminal

$ pod setup

```

をもう一度実行するも同様のエラーをはく

上記のコマンドはhttps://github.com/CocoaPods/Specs をcloneしているだけなので、手動で行うことにした。

```terminal

git clone https://github.com/CocoaPods/Specs.git /Users/ユーザー名/.cocoapods/repos/master --progress

```

を実行するが、やはりダメだった。


#最終的に解決した方法
CocoaPodsだが、自分のダウンロードフォルダに展開し、そこからApplicationフォルダに移動させていた。その際に、ダウンロードフォルダに入っているCocoaPods.appを消していなかった。
よってこれを削除し、

```terminal

$ pod setup

```
を実行すると、

```terminal

$ pod setup

Setting up CocoaPods master repo
  $ /Applications/CocoaPods.app/Contents/Resources/bundle/bin/git -C /Users/ユーザー名/.cocoapods/repos/master fetch
  origin --progress
  remote: Counting objects: 161, done.        
  remote: Compressing objects: 100% (148/148), done.        
  remote: Total 161 (delta 107), reused 0 (delta 0), pack-reused 0        
  Receiving objects: 100% (161/161), 17.60 KiB | 0 bytes/s, done.
  Resolving deltas: 100% (107/107), completed with 46 local objects.
  From https://github.com/CocoaPods/Specs
     8f038f0..6d6fe31  master     -> origin/master
  $ /Applications/CocoaPods.app/Contents/Resources/bundle/bin/git -C /Users/bitman/.cocoapods/repos/master
  rev-parse --abbrev-ref HEAD
  master
  $ /Applications/CocoaPods.app/Contents/Resources/bundle/bin/git -C /Users/bitman/.cocoapods/repos/master reset
  --hard origin/master
  HEAD is now at 6d6fe31 [Add] APMServices 1.6.1
Setup completed
$

```

これでセットアップは完了。


#原因
ダウンロードフォルダとApplicationフォルダにアプリの重複があったことが原因だった。
SwiftのImageLiteralで画像名をちょっとだけ変更したい場合

```swift
let iv = ImageView()

iv.image = [イメージリテラル]
//iv.image = #imageLiteral(resourceName: "hoge")
```

コメントアウトすると文字列になるので、その状態でresourceNameを操作してコメントアウトを戻せばいい
gz形式でS3に飛んで来たものをlambdaで処理する

S3をトリガーにlambdaを作成していたのですがファイル形式がgzだったのでうわぁぁあってなってたら先輩が冷静に解決してくれたのでメモ_φ(･_･

### ソースコード

``` index.js

const aws = require("aws-sdk");
const s3 = new aws.S3();
const zlib = require("zlib");

exports.handler = (event, context, callback) => {
  const params = {
    Bucket: "BucketName",
    Key: event.Records[0].s3.object.key
  };
  s3.getObject(params, (err, getData) => {
    if (err) {
      callback(err);
    } else {
    	const body = getData.Body;
      	zlib.gunzip(body, (err, data) => {
        	if (err) {
          	callback(err);
        	} else {
        	// 解凍したデータ
         	const stringData = data.toString("utf-8");
          	callback(null);
        	}
      });
    }
  });
};

```

zlibはもともと入っているモジュールらしく特に追加で必要なものはないので意外と簡単で便利でした
fastavroをつかったavroデータの書き込み


BigQueryなどでデータを突っ込むときにavroファイルを作りたい。
avroだと自動スキーマ認識でネストしたテーブルが作れる。

avro(avro-python3)はJava likeなインタフェースなので、Cythonで書かれたfastavroを使いたい

#### サンプルコード

```python3
import fastavro

schema = {
    'name': 'Root',
    'type': 'record',
    'fields': [
        {'name': 'a', 'type': 'string'},
        {
            'name': 'b',
            'type': {
                'type': 'array',
                'items': {
                    'type': 'record',
                    'name': 'B',
                    'namespace': 'root',
                    'fields': [
                        {'name': 'c', 'type': 'string'},
                        {'name': 'd', 'type': ['double', 'null']},
                        {'name': 'e', 'type': ['null', {'type': 'array', 'items': 'int'}]},
                    ],
                },
            },
         },
    ],
}

with open('foobar.avro', 'wb') as out:  # 追記するときは mode='aw'
  writer = fastavro.write.Writer(out, schema, sync_interval=1000, codecs='deflate')

  # loop
  record = {'a': 'aaa', 'b': [{'c': 'ccc', 'd': 123, 'e': [1, 2, 3]}]}
  writer.write(record)

  # 最後にフラッシュしないと最後までデータが書き込まれない(sync_intervalごとに自動flush)
  writer.flush()
```

あとは、avscファイルやconfig.pyなどにスキーマ定義しておけばよい

#### 参照
- https://avro.apache.org/docs/1.8.2/gettingstartedpython.html
- https://github.com/tebeka/fastavro/blob/master/tests/test_fastavro.py
- http://www.mwsoft.jp/programming/python/python3_avro.html

BQで対応可能なavroフォーマット
- https://cloud.google.com/bigquery/docs/loading-data-cloud-storage-avro
UITapGestureRecognizer のシングルタップとダブルタップを共存させる方法

いつも忘れて検索するのでメモ

1. 最初に結論 
    - **singleTapGesture.require(toFail: doubleTapGesture)** を実行する。

2. サンプルコード
    * require toFail が追加される以外は通常と同じ。

    ```swift:共存
    //  シングルタップの GestureRecognizer を someView に追加する。
    let singleTapGesture = UITapGestureRecognizer(target: self, action: #selector(MyViewController.onTap(gesture:)))
    singleTapGesture.numberOfTapsRequired = 1
    someView.addGestureRecognizer(singleTapGesture)
    
    //  ダブルタップの GestureRecognizer を someView に追加する。
    let doubleTapGesture = UITapGestureRecognizer(target: self, action: #selector(MyViewController.onTap(gesture:)))
    doubleTapGesture.numberOfTapsRequired = 2
    someView.addGestureRecognizer(doubleTapGesture)

    //  両方を有効にするために必要
    singleTapGesture.require(toFail: doubleTapGesture)
    ```
    * セレクタはそれぞれの GestureRecognizer で分けるのもありだが、同一にする場合は gesture.numberOfTapsRequired で判定。

    ```swift:セレクタの例
    @objc fileprivate func onTap(gesture: UITapGestureRecognizer) {
        if gesture.numberOfTapsRequired == 1 {
            // シングルタップ時の動作
        }
        else if gesture.numberOfTapsRequired == 2 {
            // ダブルタップ時の動作
        }
    }
    ```

3. 補足
    * 逆``doubleTapGesture.require(...``だと正しく動作しない。
    * ``singleTapGesture.require(...`` と ``doubleTapGesture.require(...`` の両方があってもだめ。
 
    ```swift:正しく動かない例
    (略)
    singleTapGesture.require(toFail: doubleTapGesture)	//	必要
    doubleTapGesture.require(toFail: singleTapGesture)	//	不要・あると動かない。
    ```
WebDriverでテキストを得るとCSSが適用された値が得られる（が、edgeはならない）


CSSで"text-transform: uppercase"が指定されたDOMに対して、WebDriverでtextを得たら大文字が得られる。

以下にあるように仕様のようである。

https://w3c.github.io/webdriver/webdriver-spec.html#get-element-text
> The Get Element Text command intends to return an element’s text “as rendered”

しかし、edge(Microsoft Edge 41.16299.15.0)だと、小文字が得られた（いずれ直るのかもしれないが）。
NEMのTransactionからSender(送り主)の情報を取得する

# はじめに
　NEMのTransactionにはSender(送り主)の情報が含まれてません。NEMアプリを作っているとSenderの情報を使いたくなる時がありますが、この時に一手間必要で、以前に少し手間取ったのでここにその方法を纏めます。

# 方法
　Transactionに含まれるsignerを使用し、
APIパス

```
/account/get/from-public-key?publicKey={signer}
```

を叩きます。返ってきたjsonにSenderの情報が含まれています。
# 解説
　signerはトランザクションを作成したアカウント(=Sender)の公開鍵です。
また、上記のAPIパスは公開鍵からアカウントの情報を取得することが出来るものです。
よって、トランザクションに含まれるsignerを利用して、公開鍵からSenderの情報を取得することが可能となります。

#参考
https://www.pr1sm.com/crypto-coin/nem-nis-api-documentation-in-japanese/
Anaconda環境にpipでパッケージをインストールする

自分はpythonをAnaconda環境で使っています。
Anaconda環境にパッケージをインストールするためには、

```shell:
$ conda install <パッケージ名>
```
を実行するだけでOKですが、インストールしたいパッケージによってはPyPIにしかアップロードされておらず、このコマンドではインストールできない場合があります。

しかし、そこで、

```shell:
$ pip install <パッケージ名>
```
を実行すると、デフォルトの環境にインストールされてしまいAnaconda環境で使うことができません。

自分はこの状況に何度か遭遇して、その度に解決方法をwebで探すということをしたので、自分用の備忘録&自分のような初心者の方のために、ここに解決方法をまとめておこうと思います。

尚、OSはmacを使用しています。


# 1. Anaconda環境を確認する
```shell:
$ conda info -e
```
このコマンドを実行すると、自分が構築したAnaconda環境の一覧を表示できます。

# 2. Anaconda環境をactivateする
```shell:
$ source activate <インストールしたいAnaconda環境>
```
先程表示したAnaconda環境の中からパッケージをインストールしたい環境を選択し、*<インストールしたいAnaconda環境>*に入力してこのコマンドを実行すると、選択したAnaconda環境がactivateされます。
尚、Windowsでは、

```shell:
$ activate <インストールしたいAnaconda環境>
```
だそうです。

# 3. pipでパッケージをインストールする
```shell:
$ pip install <パッケージ名>
```
Anaconda環境がactivateされた状態で通常通りpip installコマンドを入力すると、選択したAnaconda環境にパッケージをインストールできます。

# 参考サイト
以上の各ステップは以下のサイトを参考にしました。
http://creata.hatenablog.com/entry/2016/12/18/174533
http://datalove.hatenadiary.jp/entry/python/anaconda/how-to-install-3rd-party--module-into-anaconda
https://conda.io/docs/user-guide/tasks/manage-pkgs.html#installing-non-conda-packages
Project Euler 27「二次式素数」

問題の意味がなかなか理解できずパニックになったのは内緒。

## Problem 27 「二次式素数」
オイラーは以下の二次式を考案している:
n^2 + n + 41.
この式は, n を0から39までの連続する整数としたときに40個の素数を生成する. しかし, n = 40 のとき 402 + 40 + 41 = 40(40 + 1) + 41 となり41で割り切れる. また, n = 41 のときは 412 + 41 + 41 であり明らかに41で割り切れる.
計算機を用いて, 二次式 n^2 - 79n + 1601 という式が発見できた. これは n = 0 から 79 の連続する整数で80個の素数を生成する. 係数の積は, -79 × 1601 で -126479である.
さて, |a| < 1000, |b| ≤ 1000 として以下の二次式を考える (ここで |a| は絶対値): 例えば |11| = 11, |-4| = 4である.
n^2 + an + b
n = 0 から始めて連続する整数で素数を生成したときに最長の長さとなる上の二次式の, 係数 a, b の積を答えよ.

```python
def hoge(num_a, num_b):
    f = lambda n, a, b : n ** 2 + a * n + b
    lst_prime = set() # 判定済みの素数格納用
    ans, max_cnt = 0, 0
    for a in range(-num_a + 1, num_a):
        for b in range(-num_b + 1, num_b):
            n = 0
            while True:
                x = f(n, a, b)
                if x in lst_prime or check_prime(x):
                    lst_prime.add(x)
                    n += 1
                else:
                    break
            if max_cnt < n:
                max_cnt = n
                ans = a * b
    return ans

def check_prime(n): #素数判定用関数
    if n < 1:
        return False
    else:
        for i in range(2, (n//2)):
            if n % i == 0:
                return False
        return True

print(hoge(1000,1001))
```

特に捻りもなく問題通りに愚直スタイル。ちょっと遅い。
Swift4とSwift3が混在するライブラリたちをCocoaPodsで何とかする

# やること
XCode9では、Swift4.0とSwift3.2が利用できます。
オープンソースのライブラリはアップデートの状況がマチマチなので、
プロジェクトがSwift4.0なのに、利用したいライブラリがSwift3.2系しかなかったりする場合がままあります。

CocoaPodsでパッケージ管理を行う場合で、
プロジェクトのSwiftバージョンに関わらず、それぞれのライブラリが対応しているSwiftバージョンでコンパイルされるように、
そしてそれをPodfileで管理できるように設定していきます。

# 前提

#### 知識

* CocoaPodsの環境が整っている
* XCodeを使える

#### 筆者の環境

* macOS sierra
* CocoaPods 1.3.1
* XCode 9

# 結論

恐らく色々な方法があると思いますが、ここでは**「デフォルトをSwift3.2として、Swift4に対応しているライブラリを個別に書き出す」**ようにします。

Podfileで、以下のように書きます。

```Podfile
source 'https://github.com/CocoaPods/Specs.git'
use_frameworks!

platform :ios, '9.0'

def install_pods

pod 'Some-Swift4-Library1'
pod 'Some-Swift4-Library2'
pod 'Some-Swift3-Library1'
pod 'Some-Swift3-Library2'

target 'SomeProject' do
  install_pods
end

swift4_names = [
  'Some-Swift4-Library1',
  'Some-Swift4-Library2'
]

post_install do |installer|
    installer.pods_project.targets.each do |target|
        target.build_configurations.each do |config|
            if swift4_names.include? target.name
                config.build_settings['SWIFT_VERSION'] = "4.0"
            else
                config.build_settings['SWIFT_VERSION'] = "3.2"
            end
        end
    end
end

```

「pod install」を実行して、恙無く完了すれば成功です。


## ポイント

「swift4_names」で定義したライブラリ名だった場合には、ライブラリのビルド設定にて SWIFT_VERSION=4.0 を設定しています。


## 本当にライブラリ毎にSwiftバージョンが設定されているかの確認方法

「pod install」を実行した後に、『{プロジェクト名}.xcworkspace』を開いて、Podsプロジェクトを覗きます。

Swift4で指定したライブラリ、指定していないライブラリが、それぞれ正しい「Swift Language Version」が設定されていればOKです。

* swift4指定したライブラリ例 
<img width="1142" alt="swift4指定したライブラリ例" src="https://qiita-image-store.s3.amazonaws.com/0/55620/d71013a5-c69f-02b9-0c29-007bcdf8dd9f.png">


<br/>

* swift3指定したライブラリ例
<img width="1141" alt="swift3指定したライブラリ例" src="https://qiita-image-store.s3.amazonaws.com/0/55620/ee25c3b9-6b4b-c4ab-6b45-3a2868ed14b5.png">

### 補足

Podfileで定義せずに、XCodeより同『Swift Language Version』の項目を手動で変更することでも、ライブラリ毎にSwiftバージョンを切り替えることができます。

ただしその場合は、「pod install」等でのリビルドの毎に、デフォルト設定に戻ってしまいますので、
Podfileで一元的に管理する方がよいです。
M5StackでWi-Fi Scanner 

M5StackでWi-Fi Scannerを動かしてみました。

arduino-esp32　の example の WiFiScan　を M5STACK の LCDで表示するようにしてみた。。


```arduino
#include <M5Stack.h>

// the setup routine runs once when M5Stack starts up
void setup(){

    // Initialize the M5Stack object
    M5.begin();

    // LCD display
    M5.Lcd.printf("Wi-Fi SSID Scanner");

    // Set WiFi to station mode and disconnect from an AP if it was previously connected
    WiFi.mode(WIFI_STA);
    WiFi.disconnect();
    delay(100);

}

// the loop routine runs over and over again forever
void loop() {

    // WiFi.scanNetworks will return the number of networks found
    int n = WiFi.scanNetworks();

    M5.Lcd.fillScreen(BLACK);
    M5.Lcd.setCursor(0,0);
    if (n == 0) {
        M5.Lcd.println("no networks found");
    } else {
        M5.Lcd.print(n);
        M5.Lcd.println(" networks found");
        for (int i = 0; i < n; ++i) {
            // Print SSID and RSSI for each network found
            M5.Lcd.print(i + 1);
            M5.Lcd.print(": ");
            M5.Lcd.print(WiFi.SSID(i));
            M5.Lcd.print(" ");
            M5.Lcd.print(WiFi.channel(i));
            M5.Lcd.print("CH");
            M5.Lcd.print(" (");
            M5.Lcd.print(WiFi.RSSI(i));
            M5.Lcd.print(")");
            M5.Lcd.println((WiFi.encryptionType(i) == WIFI_AUTH_OPEN)?" ":"*");
            delay(10);
        }
    }

    // Wait a bit before scanning again
    delay(5000);
}

```
angular

# Angularで作成されたサイト
https://qiita.com/Yamamoto0525/items/5a0459712deada850b85#%E3%81%A9%E3%82%93%E3%81%AA%E3%82%B5%E3%83%BC%E3%83%93%E3%82%B9

# ビルド関係
* Angularのモジュール分割、共有、遅延  
https://qiita.com/gaaamii/items/93b8da53b22273eadb02

* directive
https://qiita.com/biga816/items/fea04c9e70600b528882

* プロダクションビルド

```
ng build --prod --environment=xx
```

・Node
https://www.npmjs.com/package/websql
・Angular
https://libraries.io/bower/ng-websql
・W3C
https://www.w3.org/TR/webdatabase/
・TypeScript
https://eapyl.github.io/article/Use-WebSQL-and-IndexedDB-in-Typescript-25-November-2016.html
Cordovaのチュートリアルをやってみる 第五回

# 使用したもの(環境)
 1. cordova
 1. visualStudioCode
 1. windows10
 1. Android
 

---

# チュートリアルを訳しながらやってみる
チュートリアルのページは下記。

[Module 6: Avoiding the 300ms Click Delay](http://ccoenraets.github.io/cordova-tutorial/avoid-300ms-delay.html)

前回のチュートリアル。

[Cordovaのチュートリアルをやってみる 第四回](https://qiita.com/tokky_se/items/6c3cd3e3adbd4435d678)

環境構築については別途まとめてあるので下記参照。

[cordova&VSCodeで環境を構築するまでの右往左往メモ。](https://qiita.com/tokky_se/items/346429d234c91bece11d)

---


# Module 6: Avoiding the 300ms Click Delay
the 300ms Click Delayとは?  
参考になるページ:[スマホwebサイトのクリック遅延を簡単解消！](https://qiita.com/igtm/items/0d421d3284c8ff1cc7aa)
と言うか上記ページに全部書いてあります。

[参考動画](https://www.youtube.com/watch?v=AjUpiwvIa5A)  
[参考ページ](https://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay)  

OSやブラウザのアプデで対応しているようで、私の動作環境では遅延を確認することができませんでした。

1\. iOSデバイスまたはiOSエミュレータでアプリケーションをテストする：[ヘルプ]ボタンをタップし、ダイアログが表示されるまでに遅延を確認します。

この遅延は、オペレーティングシステムがおよそ300ms待っているために、ユーザーがターゲットを再度タップする（そしてダブルタップを実行する）かどうかを確認するために発生します。

2\. index.htmlに次のスクリプトタグを追加します。

```html  
<script src="lib/fastclick.js"></script>
```

FastClickは、Financial Timesによって構築されたオープンソースライブラリです。詳細はこちら。

3\. app.jsでは、devicereadyイベントハンドラ内にFastClickを登録します。

```js 
FastClick.attach(document.body);
```

4\. アプリケーションをテストする：[ヘルプ]ボタンをクリックします。メッセージはすぐに表示されるはずです。

---

# 参考URL

[Module 6: Avoiding the 300ms Click Delay](http://ccoenraets.github.io/cordova-tutorial/avoid-300ms-delay.html)

[Cordovaのチュートリアルをやってみる 第四回](https://qiita.com/tokky_se/items/6c3cd3e3adbd4435d678)

[cordova&VSCodeで環境を構築するまでの右往左往メモ。](https://qiita.com/tokky_se/items/346429d234c91bece11d)

[スマホwebサイトのクリック遅延を簡単解消！](https://qiita.com/igtm/items/0d421d3284c8ff1cc7aa)

[参考動画](https://www.youtube.com/watch?v=AjUpiwvIa5A)  

[参考ページ](https://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay)
Laravel Eloquentの `first()` `get()` の違い


# get

複数のレコードを取得

### 関連Qiita
https://qiita.com/shosho/items/5ca6bdb880b130260586#%E5%85%A8%E4%BB%B6%E3%82%92%E5%8F%96%E5%BE%97%E3%81%99%E3%82%8B


# first

単一レコードを取得

### 関連Qiita
https://qiita.com/shosho/items/5ca6bdb880b130260586#%E4%BB%96%E3%81%AE%E3%82%AD%E3%83%BC%E3%82%92%E4%BD%BF%E3%81%86first
Laravel5.6へのアップグレード

# 要約

Laravel5.5.32から5.6.3へのアップグレード時に、composer.jsonを簡単に書き換えて
`composer update`したら失敗。
公式ちゃんと見ようね。


# 失敗

```diff
    "require": {
        "php": ">=7.0.0",
        "fideloper/proxy": "~3.3",
-        "laravel/framework": "5.5.*",
+        "laravel/framework": "5.6.*",
        "laravel/tinker": "~1.0"
    },
```

`composer update`を実行

```
In trustedproxy.php line 66:
                                               
  Undefined class constant 'HEADER_CLIENT_IP' 
```
エラーとなる

# 成功

```diff
    "require": {
-        "php": ">=7.0.0",
-        "fideloper/proxy": "~3.3",
-        "laravel/framework": "5.5.*",
+        "php": ">=7.1.3",
+        "fideloper/proxy": "~4.0",
+        "laravel/framework": "5.6.*",
         "laravel/tinker": "~1.0"
    },
```

`composer update`で無事終了。

あとは`composer test`して動けばok

# 参考

- [Upgrade Guide - Laravel - The PHP Framework For Web Artisans](https://laravel.com/docs/5.6/upgrade)
- [php - Upgrading Laravel 5.5 to 5.6 error - Stack Overflow](https://stackoverflow.com/questions/48594851/upgrading-laravel-5-5-to-5-6-error)