OmniAICreator/Qiita-1.07M huggingface dataset:
【UniRx】AddTo とは何かまとめてみた

## 概要
UniRxの`AddTo`とは何かについてまとめてみました！
少しでもお役に立てればと思います！

## UniRxの基本的な考え方
`AddTo`について説明する前にUniRxの基本的な考え方を軽く押さえたいと思います。
### IObserverとIObservable
UniRxでは、イベントメッセージを発行する側(`IObserver`)とイベントメッセージを購読する側(`IObservable`)に分けられます。
今回取り上げる`AddTo`はこのうちイベントメッセージを購読する側(`IObservable`)にて用いられるメソッドとなります。
イベントメッセージを購読する際に必要なメソッドが`Subscribe`です。

### Subscribe
`Subscribe`とはイベントメッセージを購読する側(`IObservable`)にて使われるメソッドで、メッセージの受け取り時に実行するを関数を登録します。

``` C#
this.UpdateAsObservable()
            .Where(l => Input.GetMouseButtonDown(0))
            .Subscribe(l => Hoge());
```

例えば上記だと、マウスがクリックされたときにHoge()を実行するように`Subscribe`メソッドで登録しています。

## 本題
### AddToとは
`AddTo`とは`Subscribe`と対になって用いられ、`AddTo`の引数に指定されたオブジェクトが破棄されたタイミングで`Subscribe`によるイベントメッセージの購読を終了するメソッドです。

また、Rxでは購読を生成することを`Subscribe`と呼ぶのに対して、購読を終了することを`Dispose`と呼びます。


そのため、`Subscribe`によって生成されたサブスクリプションに対して`AddTo`を行うと「`AddTo`の引数に指定されたオブジェクトの破棄タイミングで`Dispose`する」とも言えます。

### AddToの使い方
`Subscribe`の後に`AddTo()`の引数に紐付けるGameObjectを指定します。すると、指定したGameObjectが`Destroy`されたタイミングで処理は停止します。

``` C#
Observable.Timer(TimeSpan.FromSeconds (2))
          .Subscribe (_ => Hoge())
          .AddTo (this);
```

### AddToが必要な理由
上記の処理に`AddTo()`がない場合、アプリが起動している間止まること無く実行されます。スクリプトがアタッチされたGameObjectが削除されても止まりません。購読者がいない間も購読が続く状況になり兼ねないのです。
処理的に無駄だったり、無いものにアクセスしようとするためNullアクセス例外が発生したりします。
`Subscribe`とセットで用いられるのはこのためです。


### AddToの注意点
`OnCompleted`が発行されるわけではない点に注意が必要です。
`OnCompleted`は「ストリームが完了したためこれ以降メッセージを発行しない」ということを通知するメッセージです。

## まとめ
`AddTo`を忘れると無駄な処理に繋がるので、UniRxを用いる際は忘れずに！
UniRx面白いので他のテーマでも書いてみたいです！

## 参考
- [UniRxを使ってコードを見やすくする](https://uguisudani-media.com/unirx/)
- [UniRx入門 その1](https://qiita.com/toRisouP/items/2f1643e344c741dd94f8#2onnext%E3%81%A8subscribe)
- [UniRxのシンプルなサンプル その6(購読の停止)](https://qiita.com/Marimoiro/items/819ddb3e68aab7ee3b95#addto)
時報をGoolge Homeに喋らせる(明るい時だけ)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/77444/c238baa7-fffa-431e-014d-565c41c871ee.png)


ラズパイとGoogle Homeを使って30分に一回、時報をGoogle Homeで喋らせるようにしてみました。Macだとこういう機能がありますが、Macなしでできると便利かなと思ってやってみました。寝ているときに鳴ると困るので、照度センサーを使って明るいときだけ発動するようにしました。

#使用機材
- 照度センサー： [BH1750](https://www.amazon.co.jp/gp/product/B011IGZD7E) (I2Cインターフェース)
- Raspberry PI
- Google Home Mini

照度センサーの使用方法は[Raspberry Pi3で照射量を取得する（BH1750FVI）](https://qiita.com/ksk8/items/0af11fe3827244be554d)を参考にさせていただきました。

#配線図
![BH1750_ブレッドボード.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/77444/c7a69523-cbb0-5afd-3566-77226b752bf2.png)


ADDRをGNDに落とすと、I2Cのアドレスは0x23になります。

#現在時刻の取得
現在時刻はシェルコマンドで取得して、Pythonスクリプト経由でGoogle Homeへ投げます。

```bash:/home/pi/programs/now.sh
hh=$(date "+%k")
mm=$(date "+%-M")

if [ ${mm} = "0" ]; then
    text=${hh}時です。
else
    text=${hh}時${mm}分です。
fi

python3 /home/pi/programs/say.py ${text}
```

#明るいときだけGoogle Homeを喋らせる
照度センサーから明るさ(ルクス)を元に、明るいときだけGoogle Homeを喋らせるます。あらかじめgoogle-home-notifierをセットアップしておきます。セットアップ方法は[こちら](https://qiita.com/yuppejp/items/64f7769015c8245ee451)を参考にしてください。

```python:/home/pi/programs/say.py
import smbus
import sys
import os

def say(text):
    # 明るさが30ルクス以上の場合に発話する
    if lux() > 30:
        os.system('curl -X POST -d "text=' + text + '" http://pi@raspberrypi0.local:8091/google-home-notifier')

def lux():
    bus = smbus.SMBus(1)
    addr = 0x23
    data = bus.read_i2c_block_data(addr, 0x11)
    lux = data[1] * 10
    return lux

if __name__ == '__main__':
    args = sys.argv
    text = args[1]
    say(text)
```

#cronに設定する
毎時0分と、30分にシェルスクリプトを起動します。明るいときだけと言っても、深夜に鳴るとさすがにウザいので、7時〜24時の間だけ動作するようにcronを設定します。

```bash
$ crontab -l
0,30 0,7-23 * * * /home/pi/programs/now.sh
```

これで完成です。

#参考
- [Raspberry Pi3で照射量を取得する（BH1750FVI） - Qiita](https://qiita.com/ksk8/items/0af11fe3827244be554d)
- [BH1750FVIデータシート](https://www.mouser.com/ds/2/348/bh1750fvi-e-186247.pdf)
- [LINEからGoogle Homeを喋らせる - Qiita](https://qiita.com/yuppejp/items/64f7769015c8245ee451)
VIVE Hand Tracking SDKをAndroidスマホで使ってみる

# 概要
先日発表されたViveでハンドトラッキングが可能なVIVE Hand Tracking SDKですが
ViveだけでなくAndroidのスマホにも対応しています
今回はこのSDKとUnityを組み合わせて使う方法を紹介します

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">ハンドトラッキングのSDKはVive FocusとAndroidのスマホも対応しておりますので、ぜひ試してください。<br><br>動作環境： <a href="https://t.co/TbRyAXVHCQ">https://t.co/TbRyAXVHCQ</a><br>SDK： <a href="https://t.co/AcY4BL9P74">https://t.co/AcY4BL9P74</a> <a href="https://t.co/xMtMbYavIM">https://t.co/xMtMbYavIM</a></p>&mdash; VIVE サポート＠日本 (@ViveJapanSup) <a href="https://twitter.com/ViveJapanSup/status/1117697952762355713?ref_src=twsrc%5Etfw">2019年4月15日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

# SDKの入手
https://developer.vive.com/resources/knowledgebase/vive-hand-tracking-sdk/
こちらのページの下部からSDKをダウンロードします
<img width="448" alt="スクリーンショット 2019-05-04 16.06.18.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105021/2cc3fe9a-74b7-c20f-1796-f7843eb1db06.png">

この中の「Hand Tracking SDK Unity Sample.unitypackage」と「Hand Tracking SDK Unity.unitypackage」を使います
<img width="351" alt="スクリーンショット 2019-05-04 16.17.22.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105021/eaf36d5f-0d17-5a9d-4ab1-114a3db316e5.png">


# Unityへのインポート＆セッティング
Unityでプロジェクトを開き、Androidがビルドできる状態にしておきます
そして、先ほどの「Hand Tracking SDK Unity Sample.unitypackage」と「Hand Tracking SDK Unity.unitypackage」をインポートします
<img width="148" alt="スクリーンショット 2019-05-04 16.22.46.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105021/0925d7a7-de55-7da9-670e-38974ac80e30.png">

Project Settingsを開き下記の設定をします。
- XR SettingsからVirtual Reality SupportedをON
- Virtual Reality SDKsにCardboardを設定
- デフォルトのままだとビルドできないので、Pacakge Nameを適当な名前に変更
- Cardboardを使うので、Minimum API Levelを「Android 5.0」以上に設定
<img width="359" alt="スクリーンショット 2019-05-04 16.41.01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105021/065c756b-93b0-83ed-1327-8f5919cc1df6.png">
<img width="364" alt="スクリーンショット 2019-05-04 16.41.22.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105021/208f2973-dc9a-027b-065b-990f9079c19b.png">

# ビルド
「Sample」というシーンがあるのでこれをビルドします
<img width="623" alt="スクリーンショット 2019-05-04 17.03.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105021/1106556b-0f0f-687f-b95e-cbac534922f3.png">

端末でインストールし、カメラのパーミッションを許可します
左手のトラッキングは緑の点、右手のトラッキングは青い点で表示されます
![hand.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105021/4f4291b6-8208-4611-9120-2c4790c09e2e.gif)

# 解説
トラッキング自体はカメラにアタッチされたGestureProviderで行い
表示をHandRendererで行なっているようです。
ですので、表示のカスタマイズはHandRendererを元に改造していけばできると思います。

また、Z方向へのトラッキングはあまり行われず、基本的には平面上のトラッキングのようです。

手の座標だけでなくジェスチャーの認識にも対応してますので
実装次第ではスマホVRコンテンツの新たな表現として使えそうです

# 参考サイト
- [VIVE Hand Tracking SDKとDaydreamを組合せてみた](https://qiita.com/shiena/items/c080f33de08080023243)
- [VIVE HAND TRACKING SDKドキュメントサイト](https://developer.viveport.com/documents/sdk/en/vivehandtracking_index.html)
昔作ったサインはVGAのLinuxカーネルパッチを供養する

# はじめに

その昔、NAS組み立てキットの[玄箱HG](https://www.kuroutoshikou.com/product/old_series/old_case/old_case_kurobako/old_case_kurobako_select/kuro-box_hg/)があり、有志のDebian化キットで普通のLinuxとして動作しました。玄箱HGはディスプレイ出力端子がないのでリモート接続しかできなかったのですが同じ時期にUSBをVGA出力に変換する[サインはVGA](http://www.kairen.co.jp/japanese/usbvga/usb20svgawh.html)が出たのでこの2つを組み合わせてデスクトップPC化を目指したのでした。

# 何が問題だったのか

サインはVGAが出た時は既にsisusbとしてLinuxドライバがあったのですが、以下の問題により動作しませんでした。

1. 複数のデバイスIDに未対応
1. ppc(big endian)未対応

1つ目は製品のカラーバリエーションでデバイスIDが異なり、ドライバに定義されていないものは認識されません。
2つ目は玄箱HGのCPUはppcでbig endianなのでデータの格納順番が異なり正常にディスプレイ表示できません。

2つ目はどうやって見付けたのか忘れてしまったのですがグラフィックドライバなので`printk`とカーネルログだけで調べた記憶があります。

# パッチ本体

パッチ対象のカーネルはDebian/etchの2.6.18-rc4です。
これでコンソールとX Window Systemは表示されたのですが一部のカラーモードで表示がおかしかったので不完全かXのドライバにも問題あったのかもしれません。

```diff
diff -ru a/drivers/usb/misc/sisusbvga/sisusb.c b/drivers/usb/misc/sisusbvga/sisusb.c
--- a/drivers/usb/misc/sisusbvga/sisusb.c	2006-07-30 15:15:36.000000000 +0900
+++ b/drivers/usb/misc/sisusbvga/sisusb.c	2006-07-31 00:08:10.000000000 +0900
@@ -76,6 +76,16 @@
 
 DEFINE_MUTEX(disconnect_mutex);
 
+#ifdef __BIG_ENDIAN
+static void
+correct_endianness_buffer(u16* data, const int length)
+{
+	int i;
+	for (i = 0; i < length; i++)
+		*(data+i) = cpu_to_le16(*(data+i));
+}
+#endif
+
 static void
 sisusb_free_buffers(struct sisusb_usb_data *sisusb)
 {
@@ -411,6 +421,10 @@
 			memcpy(buffer, kernbuffer, passsize);
 			kernbuffer += passsize;
 
+#ifdef __BIG_ENDIAN
+			if ((len & 3) == 0)
+				correct_endianness_buffer((u16 *)buffer, thispass/2);
+#endif
 		}
 
 		retry = 5;
@@ -906,9 +920,13 @@
 			if (userbuffer) {
 				if (get_user(swap32, (u32 __user *)userbuffer))
 					return -EFAULT;
-			} else
+			} else {
 				swap32 = *((u32 *)kernbuffer);
 
+#ifdef __BIG_ENDIAN
+				swap32 = ((swap32 << 16) & 0xffff0000) | ((swap32 >> 16) & 0xffff);
+#endif
+			}
 			ret = sisusb_write_memio_long(sisusb,
 							SISUSB_TYPE_MEM,
 							addr,
@@ -1259,7 +1277,11 @@
 
 					userbuffer += 4;
 				} else {
+#ifdef __BIG_ENDIAN
+					*((u32 *)kernbuffer) = ((swap32 << 16) & 0xffff0000) | ((swap32 >> 16) & 0xffff);
+#else
 					*((u32 *)kernbuffer) = swap32;
+#endif
 					kernbuffer += 4;
 				}
 				addr += 4;
@@ -3435,6 +3457,9 @@
 
 static struct usb_device_id sisusb_table [] = {
 	{ USB_DEVICE(0x0711, 0x0900) },
+	{ USB_DEVICE(0x0711, 0x0901) },
+	{ USB_DEVICE(0x0711, 0x0902) },
+	{ USB_DEVICE(0x0711, 0x0920) },
 	{ USB_DEVICE(0x182d, 0x021c) },
 	{ USB_DEVICE(0x182d, 0x0269) },
 	{ }
```

玄箱HGとサインはVGAでコンソール出力したもの
![9025316_31.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/8995/09a836e4-47ad-eafa-eae1-b1330468110e.jpeg)


# リンク

* [玄箱HG](https://www.kuroutoshikou.com/product/old_series/old_case/old_case_kurobako/old_case_kurobako_select/kuro-box_hg/)
* [サインはVGA](http://www.kairen.co.jp/japanese/usbvga/usb20svgawh.html)
* [Bug 7000 - patch for correct endianness to sisusb](https://bugzilla.kernel.org/show_bug.cgi?id=7000)
小ネタ：欠陥の混入、テストレベル、工程の責務

#1. はじめに
欠陥は後工程で摘出するほどコストが膨らむため早期に摘出するのが理想です。とはいえ欠陥の種類によって早期に見つけられるものや後工程で初めて顕在化するものがあります。例えばコンパイラのwarningや静的解析ツールで見つかる欠陥はコーディング～ビルドの工程で見つけられますがエラー処理の欠陥はエラーの状況を準備しシステム動作を行うことで見つかるかもしれません。

「この手の欠陥はこの工程で摘出する」という工程の責務を定義しようと思い[JSTQB FLシラバス(Version 2018)](http://jstqb.jp/dl/JSTQB-SyllabusFoundation_Version2018.J02.pdf)を読んだところ「2.2 テストレベル」の節にテストレベルごとに整理されていました。そこで責務はシラバスをご参照いただくこととし、ここでは欠陥の混入やテストレベルの補足をします。

#2. 欠陥の混入
[ソフトウェアの信頼性(G.J.マイヤーズ、訳:有澤 誠)](https://www.kindaikagaku.co.jp/information/kd0037.htm)にソフトウェアの開発とは変換の繰り返しであることが説明されておりそのモデル図を以下に引用します。この本が出版されたのは1977年ですが変換の繰り返しというのは現在でも変わらないです。
> ![ソフトウェアの信頼性_fig.2.1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221758/9bd3e093-bb30-3521-6ecb-c30974fb0029.png)

ソフトウェアの開発は要求→目標→高レベル設計→低レベル設計→プログラムというように大きな塊を段階的に詳細化しながら進行します。これら変換の過程で発生するエラー(誤り)が漏れや曖昧、間違い[^1]といった欠陥(フォールトまたはバグ)を誘発します。以下に一例を示します。

- 漏れ：条件の漏れ、機能(振る舞い)の漏れ、性能のような非機能要件の漏れ
- 曖昧：複数の担当者のあいだで認識の相違を招く表現
- 間違い：要求の間違い、要件の間違い、仕様の間違い、コーディングの間違い

プログラムの欠陥を実行し顕在化すると故障となります。

#3. テストレベル
プログラムに限らず仕様書のような中間成果物も変換の過程で欠陥が入り込むため設計[^2]の欠陥は設計の工程で検証し摘出します[^3]。コーディングの欠陥はコーディングの工程で摘出するほか段階的にテストを行い除去します。
![vmodel-level-phase.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221758/274d0214-c8f9-fc44-3bc3-8f0f7ba9fe02.png)

複数のシステムで構成されるシステムでは統合テストはコンポーネント統合テストとシステム統合テストの2つの異なるテストレベルがあります。システム統合テストはシラバスによると「システムテストの後、または実行中のシステムテスト活動と並列に行う」とあり、前者の例を以下に図解します。
![vmodel-two-sub-system.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/221758/1674c4ba-8ac2-d3f6-cf62-d91694ce9638.png)

[^1]: [間違いだらけの設計レビュー](https://www.nikkeibp.co.jp/atclpubmkt/book/15/245560/)に倣うと「漏れ、曖昧、誤り」ですが本稿ではJSTQB FLシラバス「1.2.3 エラー、欠陥、および故障」のエラーという意味で「誤り」を用いているため「間違い」としています。
[^2]: ソフトウェアの設計だけでなくテストの設計も含みます。
[^3]: レビューを行ったりモデルやプロトタイプを作って確認したりします。
go mod initの実行時にgo: modules disabled inside GOPATH/src by GO111MODULE=auto; see 'go help modules'の対処方法

# なにこれ

`go: modules disabled inside GOPATH/src by GO111MODULE=auto; see 'go help modules'` の表示に良く出くわす自分用のメモ

👇みたいな状況


```sh
[hh@h-pc server]$ go mod init
go: modules disabled inside GOPATH/src by GO111MODULE=auto; see 'go help modules'
```

# 対処方法
`GO111MODULE=auto`と設定されているのがダメらしいので以下を実行する。

```sh
export GO111MODULE=on

go mod init
```
php-master-changes 2019-05-04

今日はテストの修正、pdo_firebird のメモリリークの修正があった！

# 2019-05-04
## peter279k: Fix undefined variable, and remove unused test-pdo
- https://github.com/php/php-src/commit/ba0913a2e56c2d5f43b0f06373a79e33702e0f58
- [7.4~]
- テストの未定義変数利用箇所を修正し、不要ファイルの削除

## cmb69: Fix memory leak exhibited by bug_aaa.phpt
- https://github.com/php/php-src/commit/ae21dc46da5126fb37b2b487760c558f3e8263f8
- [7.4~]
- ext/pdo_firebird で、メモリリークの修正

## cmb69: Re-add common PDO tests to Firebird test suite
- https://github.com/php/php-src/commit/e4757ecc801695b099d7e72fd2bd4ce7d9d97825
- [7.4~]
- ext/pdo_firebird で、[前日の修正](https://qiita.com/sj-i/items/7edb8bab9b0e332c22ab#kallez-rewrite-pdo_firebird-tests-to-not-depend-on-extinterbase)の際に誤って削除していたファイルの復活
- あとテストに使ってた定数を他の PDO のテストにあわせて修正
例外処理について解説！

# 例外処理とは
- 意図しないエラー（例外）が発生したときに備えて、自分なりの処理を設定したり、メッセージを表示させたりと何かしらの対策をしておくことです。

## エラー（例外）が発生する事例
- 読み込むファイルが存在しない
- データベースの処理においてSQL文の構文エラー
- 0で割り算をした　など

## 例外処理の書き方
```php
<?php

try {

//例外が発生する可能性があるコード

throw new 例外クラス名(引数)

}catch(例外クラス名 例外を代入する変数名){

//例外が発生した場合に行う処理

}

//エラーが発生しなければ続く通常の処理
```
### 解説
上記について解説します。

### 「throw new 例外クラス名(引数)」とは
- 例外が発生することを例外を投げる（スローする）といいます。
- `throw new 例外クラス名(引数)`でインスタンスを作成しています。

### 「例外クラス名」とは
- phpには最初から定義済みの例外クラスがいくつかあります。
 - (例)「Exceptionクラス」
- ここでは、その例外クラス名を定義します。

### 「例外を代入する変数名」とは
- 例外処理ではcatchしたときにインスタンスを変数に代入します。
- `throw new 例外クラス名(引数)`でインスタンスを作成して、`catch(例外クラス名 例外を代入する変数名)`でインスタンスを変数に代入しています。

## コード例

```php
<?php

function division($int1,$int2) {
    try {
        if($int2 == 0) {
      
            throw new Exception('0で割れません');
        }
        return $int1 / $int2;


    } catch(Exception $e) {

        echo "例外処理が発生しました";
        echo "<br>";
        echo $e->getMessage();

    }
}

echo division(10,0);

```

```php:実行結果
例外処理が発生しました
0で割れません
```
## 解説
- 例外が発生する可能性がある箇所を`try{}`に書きます。
- `throw new Exception()`で例外を投げます。
- 例外が投げられた時の処理を`catch(){}`に書いていきます。

### getMessage()メソッドとは
- 例外メッセージを取得するインスタンスメソッドです。
- 例外メッセージは、インスタンスを作成するときに第一引数に指定した文字です。
- 上記の場合、`0で割れません`が例外のメッセージです。
Bulma+Vue.jsでメニューをトグルさせる

BulmaにもBootstrapなどと同様にNavbarとそのモバイル向けのトグルメニューがあるが、以下の記載のとおりその実装のJSは勝手にやってねというスタイルになっている。

<blockquote cite="https://bulma.io/documentation/components/navbar/#navbar-menu">
  <p>The Bulma package does not come with any JavaScript. 
  Here is however an implementation example, which toggles the class is-active on both the navbar-burger and the targeted navbar-menu, in Vanilla Javascript.</p>
</blockquote>
<a href="https://bulma.io/documentation/components/navbar/#navbar-menu"><cite>Navbar | Bulma: Free, open source, & modern CSS framework based on Flexbox</cite></a>

Vanilla.jsのサンプルがあるがこれをそのままvueのコードに混ぜるわけにはいかない。
というわけで、同じスタイルで書けば動くやつをこしらえたのでメモしておく。

```vue
<template>
  <nav class="navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand">
      ...

      <a
        role="button"
        class="navbar-burger burger"
        :class="{ 'is-active': isActive }"
        aria-label="menu"
        aria-expanded="false"
        @click="toggleMenu"
      >
        <span aria-hidden="true" />
        <span aria-hidden="true" />
        <span aria-hidden="true" />
      </a>
    </div>

    <div class="navbar-menu" :class="{ 'is-active': isActive }">
      ...
    </div>
  </nav>
</template>

<script>
export default {
  data() {
    return {
      isActive: false
    }
  },
  methods: {
    toggleMenu(e) {
      this.isActive = !this.isActive
    }
  }
}
</script>
```

~~`@onclick="toggleMenu"` としてやって `e.currentTarget` を使うことでもとのサンプルコードよりかなりシンプルになる。~~

~~Pluginにすれば？という気もするが、[@nuxtjs/bulma](https://www.npmjs.com/package/@nuxtjs/bulma)というやつが標準であるものの、これはほとんど何もやってくれず、[Issue #187](https://github.com/nuxt-community/modules/issues/187)によると[Buefy](https://buefy.org/)がおすすめされたのち放置されてたりするのであまり頑張ってメンテしていく雰囲気ではなさそう。これだけのやつを別で作るのも小さすぎるし競合しないか心配だしで微妙。~~

~~Buefyは便利っぽいけど自分がやりたいことはこれだけなので、これだけのために入れるには大きいしToo muchという感じがする。
一応実装はされているぽい: https://buefy.org/documentation/dropdown~~

アホだった。こんな大袈裟なことしなくても普通にdataに状態持たせてclassをbindすれば終了でした…。ということで修正。
GNU GLOBAL(gtags) セットアップ

GNU GLOBALのセットアップ方法をメモする。

# GNU Global(gtags)とは

複数のソースファイルから関数や、変数の定義元／参照元を検索、移動することができるツール
https://www.gnu.org/software/global/global.html

# インストール
**環境** 
ubuntu18.04
amd64

```
$ sudo apt install global_6.6.2-1_amd64.deb
$ global --version
global (GNU GLOBAL) 6.6.2
Copyright (c) 1996-2017 Tama Communications Corporation
License GPLv3+: GNU GPL version 3 or later <http://www.gnu.org/licenses/gpl.html>
This is free software; you are free to change and redistribute it.
There is NO WARRANTY, to the extent permitted by law.

```

# vimプラグインとして入れる

(ⅰ) NeoBundleを使わない方法

```
$ mkdir ~/.vim/plugin
$ cp /usr/share/vim/addons/plugin/gtags.vim ~/.vim/plugin
```

(ⅱ) NeoBundleで入れる方法

```
NeoBundle 'vim-scripts/gtags.vim'
```

## vimの設定を少しカスタマイズ

Gtagsで検索結果が複数ヒットすると、QuickFixリストで一覧表示してくれる。
Quickfixリストの操作を簡単にするために、とりあえず次の設定を.vimrcに追加した。

### QuickFixリストにジャンプするキーバインドを追加

```
nnoremap [o :copen<CR>
```

### QuickFixリストからファイルがオープンされたら、それをタブで開くようにする設定

```
set switchbuf+=usetab,newtab
```
Googleフォームで送られてきた画像をSlackで表示する方法

Googleフォームで画像を送ることって結構あると思います。
それで、Googleフォームが送られた際にSlackに飛ばすのですが、そのままの設定だと画像のファイルIDしか表示されなかったので、なんとか出来ないかと試しました。
# Googleフォーム→Slack

[Googleformからのslack通知設定方法](https://qiita.com/pchan52/items/574e930a3cc42cf7f8b9)

こちらの記事を参考に作成。ただ、トリガーの部分だけが今と若干違うので注意が必要。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391656/6facc3f8-f6ac-47d6-7063-ef644373e6a0.png)
この画面に飛んだら、トリガーを追加を押す。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391656/9063df30-ff2f-f542-f33a-183220b4967d.png)
実行したいタイミングを設定して保存すれば、トリガーの設定はOK

余談ですが、Googleフォームからスクリプトエディタに飛ぶ際に、複数アカウントでログインしていると結構な割合で編集することが出来ないのですが、GoogleChromeのシークレットモードにして作業すれば何も問題無いので、オススメです。

# Googleドライブの権限設定

アップロードした画像はGoogleドライブにアップロードされます。
フォルダは任意の場所に移動することは可能ですが、デフォルトではルートディレクトリに作成されます。
【フォームのディレクトリ】→【質問のディレクトリ】という構造になっています。

ディレクトリを選択し右クリックして、共有リンクの発行をしておきます。これによって、後から追加された画像についても共有リンクの許可がおりるようになります。

# スクリプトエディタの設定

```Go:コード.gs
      case "キャラクターデザインイラスト":
        img = response;
        break;
```

imgが受け取ったファイルIDになります。
共有されたリンクが発行された画像は、下記のURLで見ることが可能になります。

```
http://drive.google.com/uc?export=view&is=[ファイルID]
```
なので、Slackに飛ばす際にURL＋ファイルIDにすればSlack側で表示されるようになります。

```
"\nキャラクターデザインイラスト:http://drive.google.com/uc?export=view&id=" + img
```

これでSlackでGoogleフォームから送られてきた画像を確認することが出来るようになりました。
ただ、これだと画像が複数枚来た時の対応が出来ません。

# 複数枚来た時の対応方法
```Go:コード.gs
  var img_array = img.split(',');
  var count = img_array.length;
  var img_url = "";
  for(var i=0;i<count;i++)
  {
    img_url+="http://drive.google.com/uc?export=view&id=" + img_array[i] + "\n";
    
  }
```
画像が複数枚設定された時は[画像ID,画像ID]と、カンマ区切りで値がやってきます。なので、一度split関数を使い、配列にします。
その後に全て読み込み、URLと改行コードを入れてStringに追加していき、img_urlをSlackに飛ばしてあげれば確認することが出来ます。

以上です。GoogleフォームとSlackで便利な生活を！

#参考記事
[Google Drive に保存した画像を直接呼び出せるURLの取得](https://qiita.com/arribux/items/0394968fa318d9309d33)
Eclipse 2019-03(4.11）でJDK12（Java12）をコンパイルする方法

Eclipse 2019-03をインストールしただけではJDK12の記法のコンパイルができなかったので、
対応方法を知見として残す。

同じ事象が発生しているかをググった。Eclipseのコミュニティで質問が見つかった。（英語サイト）
http://marketplace.eclipse.org/marketplace-client-intro?mpc_install=4540402

対応方法を要約すると
上記のURLの[Install]をEclipseのMarket Placeにドラッグ＆ドロップして、プラグインをインストールすればよい。

EclipseにMarket Placeのメニューが見つからなかったときには以下の方法でインストールする。

Market Place プラグインのインストール方法
https://qiita.com/hshimo/items/6a8cefb5d8cee536d661

以上
【今更聞けない】Strong Parameters とは

#概要
railsを勉強してると出てくる[Strong Parameters]強いパラメータ？
「コントローラーの下の方に書いて置けばいいんでしょ」位の知識しかなかったので、
今回改めて、必要性について調べてみました。

#Strong Parametersとは
**マスアサイメント**脆弱性を回避するためにrails4以降に提供されるようになった機能

#使い方
マスアサイメントとはRailsにもともと備え付けられている機能で、
1つのモデルに対するフィールドのまとめ設定の事を言います。
例えばrails3以前はStrong Parametersは無く下記のような記述が可能でした。

```ruby
@book = Book.new(params[:book])

@book = Book.find(params[:id])
@book.update_attributes(params[:book])
```

しかしこのような[new/update_attributes]のようなマスアサインメント系のメゾットでは
無条件に全てのフィールドを上書きしてしまう為、
悪意のあるユーザが自身に管理者権限を付与するなどシステムを自由に操作できてしまう危険性があったのです。

そこで提供されたのでがStrong Parametersです。
フィールド値の一括設定に先立ってあらかじめ設定可能な値を明示的に宣言しておくことで
脆弱性を回避できます。

```ruby
def new
  @book = Book.new(book_params)
end

private

def book_params
  params.require(:book).permit(:title, :price, :publish)
end
```


#参考
https://www.amazon.co.jp/dp/4774188832/ref=asc_df_47741888322633217/?tag=jpgo-22&creative=9303&creativeASIN=4774188832&linkCode=df0&hvadid=295719984664&hvpos=1o1&hvnetw=g&hvrand=9441933408723917670&hvpone=&hvptwo=&hvqmt=&hvdev=c&hvdvcmdl=&hvlocint=&hvlocphy=1009307&hvtargid=pla-525481406608&th=1&psc=1
Linuxでhttpsプロトコルでもgithubのパスワードを毎回尋ねられないようにする

他の手順がsshだったり、Personal Access Token使っていなかったりしたので、書きました。

Personal Access Tokenをrepoにチェックを入れて生成する。

https://github.com/settings/tokens

~/.netrc に、以下の通りログインIDとトークンを書き込む。パスワードにトークンを書き込む。

```
machine github.com
login 74th
password 0123456789abcdef0123456789abcdef01234567
```

一応、自分以外閲覧不可にしておく。

```
chmod 600 ~/.netrc
```
Chrome(クローム)の拡張機能でwebページで特定の文字にハイライトを付ける機能を自作したい。


例えばTwitterのタイムラインで「おはよう」というツイートがあれば、
おはようという単語の背景だけ色を変更するという感じです。

![コメント 2019-05-05 160402.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/410757/ae8c9fbf-e270-4577-d26d-7cfe2487aa37.jpeg)


これだけならCTRL+Fで済むのですが、複数の単語にその処理をしたく、他の単語を追加したくなった時に追加できるようにもしようと思っています。

・試行錯誤して何とかmanifestファイルの作成
・拡張機能の反映（指定した要素の色変更）

等は出来たのですが、
自分の調べた方法では既存ページに

```index.html
<span>おはよう　こんにちは　こんばんは</span>
```
という文字列があった場合

```script.js
$('span').css('background', 'red')
```
とすると

「おはよう～こんばんは」の文字列の背景色が変更します。

この場合「おはよう」だけの色を変更するにはどうすればいいのだろう・・・。

なんだかんだ調べてるうちにこうなった

```script.js
//span.stの部分はGoogle Chrome Developer Tools　
//Chromeの検証機能

$('span.st').each(function(){
let txt = $(this).text();
     $(this).html(
         txt.replace(/JavaScript/g,'<span style="background:yellow">JavaScript</span>')
   );
});

```

復習として振り返ってみる。



```script.js
$('span.st').each(function(){

});
```
$('span.st')で要素を取得

.eachで繰り返し処理。
今回は「JavaScript」で検証したので、複数回出てくる「JavaScipt」という文字列を何回も取得するためなのかな

次はここ

```script.js

let txt = $(this).text();
     $(this).html();
 
```

・変数宣言
今はES6なのでvarではなくlet使用
変数txtに$(this).text();を代入することで
要素をテキストとして取得（今回はspan.stの部分)

続いて$(this)　
progateでも学んだけどイマイチわかってない。。
今回みたいに同じ要素が複数ある場合に便利みたい？？
正直今でもよく分かってない・・
ちなみに気を付ける事として、thisは　''　で囲まない事！
理解できた時に追記します。。

```script.js
// $(this)が正解　$('this')は不正解！
```

んで次

```script.js

      $(this).html(
      txt.replace(/JavaScript/g,'<span style="background:yellow">JavaScript</span>')
   );

```

ここは自分なりに分かりやすくて.html()を使うことで$(this)に入ってる要素を
HTMLとして取得して、txt.replaceで置換してる。
今回はJavaScriptって文字が見つかったらそこにHTMLのタグを付け加えて色を変更しているって事。


初心者なりに調べまくってたどり着いた結果ですので、間違っている解釈あれば教えていただけると嬉しいです。

#今後追加していくかもしれない実装機能

・複数の単語に対応
・単語ごとに色変更

以上の2つをpopup内で処理できるようにしていきたい


ちなみにソースはこちら
https://github.com/Variax-Guitar/test
AWS Cloud9（Amazon Linux）にPHP7.3をインストールして開発環境を作る手順書

## はじめに

PHP7.3をインストールして開発環境をつくる手順書です。

PHP7.3をインストールする前に、AWS Cloud9でWEBアプリを開発するための最低限の準備を済ませる必要があります。Webサーバ(httpd)を立てて、ブラウザからアクセスできる状態にしてください。※下記URLのAWS Cloud9の設定方法を確認・設定ください。

参考：[AWS Cloud9でWEBアプリを開発するための環境構築メモ「AWSCloud9環境作成」→「WEBサーバ起動/確認」まで](https://qiita.com/gomiryo/items/75ff20f820bea6ec81e6)

WEBサーバへアクセスすることができることを確認したら、左下のbashウィンドウで下記のコマンドを実行してください。

## インストール

```bash

# パッケージを更新（念の為）
sudo yum update -y

# phpのバージョン確認
rpm -qa | grep php

# php5.6を一式アンインストール
sudo yum remove php56*

# PHP7.3を一式インストール
sudo yum install php73*

# リンク削除 → 貼り直し
sudo unlink /usr/bin/php
sudo ln -s /etc/alternatives/php7 /usr/bin/php

```

## WEBサーバの設定ファイル(httpd.conf)を変更

```bash
# Webサーバ(httpd)の設定ファイルを変更する
sudo vi /etc/httpd/conf/httpd.conf
```

※Vimの使い方が分からないかたは、ご自身でお調べ下さい。

参考：[viで編集するために必要な最低限覚えておくべき10のコマンド](https://qiita.com/commomuitoarroz/items/d395f212887eaa5be0b8)

### httpd.confの変更箇所

ユーザとグループをapacheからec2-userに変更して下さい。

```
# before
User apache
Group apache

# after
User ec2-user
Group ec2-user
```

DocumentRootをec2-userのホームディレクトリ（environment）に変更して下さい。

```
# before
DocumentRoot "/var/www/html"

# after
DocumentRoot "/home/ec2-user/environment"
```

DocumentRootのパスに合わせて下記の部分を変更して下さい。

```
# Further relax access to the default document root:
<Directory "/var/www/html">
  ↓
# Further relax access to the default document root:
<Directory "/home/ec2-user/environment">
```

## Webサーバの再起動

```bash
# ec2-userのセッション変数用のファイル書き込み可に設定
sudo chown root:ec2-user /var/lib/php/7.3/session

# 設定情報確認用ファイルを配置
echo "<?php phpinfo();" > index.php

# Webサーバの再起動
sudo service httpd start

# DBサーバの再起動
sudo service mysql start
```

## Webサーバからアクセスして確認

Webブラウザからアクセスする方法は下記をご確認ください。

[WEBブラウザからアクセス](https://qiita.com/gomiryo/items/75ff20f820bea6ec81e6#web%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%81%8B%E3%82%89%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B9)

以上で環境構築が作ることができます(2019/05/05 時点)。

## 参考URL
- [AWS Cloud9 で PHP7.1、7.2 へ変更する](https://qiita.com/kidatti/items/2d6a4a24f89dc71eb66e)
- [CentOS6／CentOS7にPHP5.6／PHP7をyumでインストール](https://qiita.com/ozawan/items/caf6e7ddec7c6b31f01e)
- [viで編集するために必要な最低限覚えておくべき10のコマンド](https://qiita.com/commomuitoarroz/items/d395f212887eaa5be0b8)
WineでMacでもOrinrinEditorを使えるようにする

WineでOrinrinEditorを使えるようにします

## Easywineをダウンロード
https://matome.naver.jp/odai/2140238022377155001
こちらからダウンロードしてください

# OrinrinEditorをダウンロード
下からダウンロード
https://jbbs.shitaraba.net/bbs/read.cgi/otaku/15956/1364219334/2

DLしたZIPを任意の場所に置いてください

## (旧)フォントをダウンロード
**ここの章は旧版です**
aahubフォントをTTFとしてDLするのですが、フォントファイルのダウンロードリンクはないので、とりあえず直リンクを張っておきます~~
https://fonts.aahub.org/assets/fonts/aahub/aahub.ttf

aahubフォントを使いたいのですが、残念ながらWine下のOrinrinEditorはUnicode空白が正常に動かないので、aahubフォントに独自の改修を加えます

Homebrewを使ってFontForgeをインストールします

```
brew cask install fontforge
```

FontForgeでaahub.ttfを開き、以下のように横幅を編集します

- HAIR SPACE(U+200A)
    - 64px
- THIN SPACE(U+2009)
    - 128px(これは元々整備されている)
- FIGURE SPACE(U+2007)
    - 640px
- SIX-PER-EM SPACE(U+2006)
    - 193px
- FOUR-PER-EM SPACE(U+2005)
    - 256px
- THREE-PER-EM SPACE(U+2004)
    - 319px
- EM SPACE(U+2003)
    - 1024px
- EN SPACE(U+2002)
    - 512px

このままFile->Generate Fontsを出し、TrueType Fontとして任意の場所に出力します。
任意の場所に出力できたら、Finderからダブルクリックしてインストールします。
その後

```
fc-cache -fv
```
を実行して、フォントのキャッシュの再読み込みします

## フォントをダウンロード
https://fonts.aahub.org/font/1
こちらからaahub.ttfをDLしてください

## WineでOrinrinEditorを起動
Easywine経由でOrinrinEditorを起動します
その後、ファイル->一般設定->フォント変更で、インストールしたaahubフォントをフォントに設定します。
OrinrinEditorを一回閉じてから、もう一度上のコマンドを叩くと、OrinrinEditorがaahubフォントで実行できているはずです。
LINEのMessaging APIでbotを作ってみたぜ（サンプル編）

# 概要
こんにちは，よしデブです．
LINEのMessaging APIに興味を持ったので簡単なbotを作ってみました．
今回はサンプル編ということで以下の記事を参考にさせていただき，自分でサンプルプロジェクトを作ってみました！（[LINEのBot開発 超入門（前編） ゼロから応答ができるまで](https://qiita.com/nkjm/items/38808bbc97d6927837cd)）
上記記事では[Heroku](https://jp.heroku.com/home)というPaaSを使っているので，真似して初挑戦してみます！！
実はNode.jsのWebフレームワークである[Express](https://expressjs.com/ja/)も初挑戦ですが，[Laravel](https://laravel.com/)経験者なのでこれはなんとかなるでしょう．

# 目標
1. LINE DevelopersのMessaging APIを触って感覚を掴む，Herokuを使ってみる←今ここ
2. push通知を実装してみる
3. Herokuアドオンを使ってアプリを拡張してみる（データベースとスケジューラ）

# 開発環境
- LINE Developersのアカウント登録済み
- npm v6.4.1
- Heroku はアカウント登録済み

LINE Developersのプランに関して，Trial Freeというプランで解説している記事が多く見受けられましたが，2019年5月5日現在では，Trial Freeが廃止されフリープランというものに移行中らしいです（[LINE Developer Trialプランの移行についてのご案内](https://engineering.linecorp.com/ja/blog/line-developer-trial-migration/)）．
これによって，**Messaging APIで毎月1,000通まで無料でプッシュメッセージを送信できる**とのことなので，お試し勢にはありがたいプラン体制になったみたいです．
Webhookに関して，LINEでBotに関連するイベントが発生した場合に，そのイベントをBotインスタンスに通知してもらうためのアクセスポイント（URL）を設定する必要があります．このURLは**SSL認証が必要となっている**ため注意が必要です．

# 作ったもの
上記の記事を参考に，挨拶をすればそれに対応する言葉を返してくれるbotを作りました（めっちゃ簡単ですみません）．
<img width="375" alt="IMG_1966.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/183745/a3971b28-ef71-1e25-5eef-bf7ac51cc8c5.png">

コードを共有しておきますので参考になれば幸いです．今回主にいじったのはindex.js内のルーター制御の部分です（[github](https://github.com/yoshidev523/sample-line-bot)）

```javascript:index.js
// (中略)
// ルーター設定
server.post('/bot/webhook', line.middleware(line_config), (req, res, next) => {
    res.sendStatus(200);
    // すべてのイベント処理のプロミスを格納する配列。
    let events_processed = [];

    // イベントオブジェクトを順次処理。
    req.body.events.forEach((event) => {
        // この処理の対象をイベントタイプがメッセージで、かつ、テキストタイプだった場合に限定。
        if (event.type == "message" && event.message.type == "text") {
            let text = "「おはよう」「こんにちは」「こんばんは」と言うと反応するぜ";
            switch (event.message.text) {
                case 'おはよう':
                    text = "おはよう！！"
                    break;
                case 'こんにちは':
                    text = "こんにちは！！"
                    break;
                case 'こんばんは':
                    text = "こんばんは！！"
                    break;
            }
            // replyMessage()で返信し、そのプロミスをevents_processedに追加。
            events_processed.push(bot.replyMessage(event.replyToken, {
                type: "text",
                text: text
            }));
        }
    });

    // すべてのイベント処理が終了したら何個のイベントが処理されたか出力。
    Promise.all(events_processed).then(
        (response) => {
            console.log(`${response.length} event(s) processed.`);
        }
    );
});
```


#感想
初めてLINE Developersを使用してみました．英語ですがドキュメントが充実しているのでとても簡単に作成することができました！！（[LINE Developers Messaging API](https://developers.line.biz/en/docs/messaging-api/)）
また，同時に**Herokuにも初挑戦してみましたが**，クッソ便利ですねこれ（笑）今まで自分のレンタルサーバでデプロイしたりして遊んでいたので設定とか大変でしたが（これはこれで勉強にはなる），gitにpushする感覚でデプロイができちゃうなんて...
Herokuには他にも色々な機能があるみたいなので調べて使ってみたいと思います！！（psqlやスケジューラなど）
UnityでVRアプリを作ったら上下が逆転してしまった

#症状
UnityでCardboard用にAndroidアプリを開発しました。
Unity上では正しく動作することを確認しました。
![1_1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/410109/669a120c-8e9b-fa9f-0b13-263cf43a7c2c.jpeg)
しかし、Buildしてスマートフォンにインストールし、Androidアプリとして実行すると、上下が逆転しました。
なお、左右は反転していません。
![1_2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/410109/3527d208-5e6f-51bd-277d-e3fbeb10f549.jpeg)


#環境
- Unity 2019.1.0f2
    - インストール時にAndrold Build Support を追加
    - GoogleVR SDK for Unity 1.200.0 をアセットとして追加
- Galaxy S8
    - Android 9

###Build Settings
- PlatformをAndroidに設定
- Player＞Resolution and Presentation＞Orientation＞Default OrientationをLandscape Left に
- Player＞XR Settingsについて
    - Virtual Reality Supported にチェック
    - Virtual Reality SDKs にCardboardを追加
    - Depth Format を 24-bit depth|8-bit stencil に
    - （Enable Transition Viewにチェック）
- Player＞Other Settingsについて
    - Identification＞Package Name を初期名から変更
    - Identification＞Minimum API Level をAndroid 7.0に

#解決法
Player＞Other Settings＞Rendering＞Graphics APIs のリストから Vulkan を外しました。
（Vulkan を選択し、「-」ボタンをクリック）
その後再度Buildし、同様にアプリとして実行すると、スマートフォン上でも正しく動作することが確認できました。
![1_3.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/410109/a3e4d383-a4ae-a6a2-4a75-53ce57bd54cb.jpeg)
なお、Vulkan を外すことについては、Virtual Reality Supported にチェックを入れた際に表示される注意書きにも記載されていました。
「XR is currently not supported when using the Vulkan Graphics API. 
Please go to 'Other Settings' and remove 'Vulkan' from the list of Graphics APIs.」
![1_4.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/410109/f4dcec66-8227-7661-0e90-534db02915d6.jpeg)
無視してもBuildできるのでそのままでも大丈夫なのかなーと思ったのですが、そんなことはなかったようです……。
Leetcode #88: Merge Sorted Array

```swift
func merge(_ nums1: inout [Int], _ m: Int, _ nums2: [Int], _ n: Int) {
    var start = 0
    for (index, num) in nums2.enumerated() {
        start = binarySearch(start, m+index-1, Array(nums1[..<(m+index)]), num)
        nums1.insert(num, at: start+1)
        
    }
}

private func binarySearch(_ start: Int, _ end: Int, _ ar: [Int], _ target: Int) -> Int {
    var start = start
    var end = end
    while start <= end {
        let mid = (start + end) / 2
        if ar[mid] == target {
            return mid
        } else if ar[mid] > target {
            end = mid - 1
        } else {
            start = mid + 1
        }
    }
    return end
}
```
Anacondaの起動時のエラー/Error on Anaconda Navigator start-up

#はじめに/Introduction

Anacondaの起動時に次のエラーが出た場合の様々な対処がNetで紹介されている。

もし、それでも解決できなかった場合、次のことをやってみたらいかがであろうか？

[ENGLISH] You can find various workarounds  against the error occurred on Anaconda Navigator start-up in the web.

If these did not work, why not do the following?
Please note that do it with your own risk.

##エラーの内容：
### **Navigator Error**
An unexpected error occurred on Navigator start-up
#### Report
Please report this issue in the anaconda issue tracker
#### Main Error
expected str, bytes or os.PathLike object, not NoneType
#### Traceback
Traceback (most recent call last):
  File "C:\Users\hogehoge\Anaconda\lib\site-packages\anaconda_navigator\exceptions.py", line 75, in exception_handler
    return_value = func(*args, **kwargs)
  File "C:\Users\hogehoge\Anaconda\lib\site-packages\anaconda_navigator\app\start.py", line 150, in start_app
    window = run_app(splash)
  File "C:\Users\hogehoge\Anaconda\lib\site-packages\anaconda_navigator\app\start.py", line 65, in run_app
    window = MainWindow(splash=splash, tab_project=False)
  File "C:\Users\hogehoge\Anaconda\lib\site-packages\anaconda_navigator\widgets\main_window.py", line 168, in __init__
    self.api = AnacondaAPI()
  File "C:\Users\hogehoge\Anaconda\lib\site-packages\anaconda_navigator\api\anaconda_api.py", line 2294, in AnacondaAPI
    ANACONDA_API = _AnacondaAPI()
  File "C:\Users\hogehoge\Anaconda\lib\site-packages\anaconda_navigator\api\anaconda_api.py", line 91, in __init__
    self._conda_api = CondaAPI()
  File "C:\Users\hogehoge\Anaconda\lib\site-packages\anaconda_navigator\api\conda_api.py", line 1767, in CondaAPI
    CONDA_API = _CondaAPI()
  File "C:\Users\hogehoge\Anaconda\lib\site-packages\anaconda_navigator\api\conda_api.py", line 353, in __init__
    self.sys_rc_path = join(self.ROOT_PREFIX, '.condarc')
  File "C:\Users\hogehoge\Anaconda\lib\ntpath.py", line 76, in join
    path = os.fspath(path)
TypeError: expected str, bytes or os.PathLike object, not NoneType


#対処方法 / Workaround

個人のホームディレクトリ直下の　.condarc　を消す。
または、Rename してもいいかもね^^

[ENGLISH]
Delete the .condarc under your personal home directory.
Or maybe it is OK to rename it.^^

##<font color="Red">Enjoy!</font>
Docker をmacにインストールしてみた

Dockerを始めるべく、まずは手持ちのMacにインストールしてみたので、それの備忘録です。


1.Docker for Macにダウンロード
---
下記ページからダウンロード出来ます。
https://docs.docker.com/docker-for-mac/install/
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/319276/ea0f8151-b455-0556-0c37-a3956eb25888.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/319276/40f47c7d-ff9a-6c66-f070-73dc77d12d64.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/319276/3ada6cba-5bd1-230f-1b08-99a4a10b6947.png)

2.インストールしたDockerを起動
---

Dockerのデスクトップ権限おアクセス許可を求められます。OKしてパスワードを入力してください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/319276/9affc3f0-87d6-7351-2a26-b995c3fd1399.png)

Dockerが起動.DockerHubのIDを入力します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/319276/618f1b21-3012-8630-8a46-526d7cd4b2b3.png)

3.Dockerの動作確認
---
上部Dockerアイコンをクリックすると下記画面がでます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/319276/a4f3f40b-17bd-a842-91d5-f3bbdd986bef.png)

[Preferences]でDockerの設定が可能です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/319276/d214108f-d3f1-3a1f-0fdc-1301ac899279.png)

下記コマンドでDockerの確認が可能です。(2019/5/5にインストールしてた結果です。)

```:DockerのVer確認
$ docker ---version
Client: Docker Engine - Community
 Version:           18.09.2
 API version:       1.39
 Go version:        go1.10.8
 Git commit:        6247962
 Built:             Sun Feb 10 04:12:39 2019
 OS/Arch:           darwin/amd64
 Experimental:      false

Server: Docker Engine - Community
 Engine:
  Version:          18.09.2
  API version:      1.39 (minimum version 1.12)
  Go version:       go1.10.6
  Git commit:       6247962
  Built:            Sun Feb 10 04:13:06 2019
  OS/Arch:          linux/amd64
  Experimental:     false
```
AWS S3+Route53+CloudFrontでReact+Redux+RouterなSPAをホスティングする

S3に静的コンテンツをアップロードして、Route53で取得したドメインでウェブホスティングしたい。
この際、CloudFrontを使ってオートスケールできるようにしたい、という依頼があった。
ここでいう静的コンテンツというのは、React+Redux+RouterなSPAなのだが。

当方、S3初心者であったため、まず最初のところで躓いてしまった。
そのあたりのことは、[別記事](https://qiita.com/tmiya-dev/items/4ab95a980004325b3f82)に書いた。

この記事では、S3でウェブホスティングしているコンテンツをRoute53で取得したドメインでホスティングすること、そしてもう一歩進んでCloudFrontを使う場合の設定も考えてみたい。

## ウェブホスティングしているS3バケットを、Route53で取得したドメインで提供する

これは何のことはない。Route53で取得したドメインにCNAMEを作成して、S3のウェブホスティング用のエンドポイントをCNAMEの値に設定すれば良いだけである。

もう少し、噛みくだくと...

1. ますS3のバケットを作り、コンテンツをアップロードする。
  1. 私はこのとき、AWS CLIから作業した場合には問題がなかったのですが、AWSマネジメントコンソールで作業すると、どういうわけか、バケットやファイルのアクセス許可を変更できないというトラブルに巻き込まれました。
2. AWSマネジメントコンソールで、S3バケットのアクセスコントロールリストを操作し、パブリックアクセスのグループeveryoneのオブジェクト一覧を「はい」に設定します。
3. AWSマネジメントコンソールで、S3バケットにアップロードしたコンテンツのアクセス権限を操作し、パブリックアクセスのグループeveryoneのオブジェクトの読み取りを「はい」に設定します。
4. AWSマネジメントコンソールで、S3バケットのプロパティを操作し、Static website hostingを「このバケットを使用してウェブサイトをホストする」を選択します。
  1. インデックスドキュメント、エラードキュメントともにindex.htmlにしておきます。(React+Redux+RouterなSPAなので、不正なURLに対する404エラー表示も、そのSPAの中で作り込んでしまいます。）
  2. このときエンドポイントが決定されるので、このエンドポイントをメモしておきます。(まあ、メモしなくても、S3バケット名とバケットのあるリージョンからエンドポイントは明らかなんですけどね。）
5. ブラウザからエンドポイントにアクセスし、利用可能であることを確認する。
6. 続いてAWSマネジメントコンソールでRoute53に進み、ホストゾーンからこのウェブサイトに使いたいドメイン名を選びます。
7. そうしたらレコードセットの作成を選択し、名前を入力して、タイプにCNAMEを選択し、上記4-2でメモしたエンドポイントを値にセットして、作成ボタンをクリックします。
8. 数分程度待つとDNS情報が浸透するので、ブラウザに上記7で作成したCNAMEの名前を入れてアクセスします。上記5と同じ表示になれば成功です。

## CloudFrontを使う(ついでにHTTPSにも対応させる)

これも、わかってしまえば難しいことはない。

1. AWSマネジメントコンソールで、CloudFrontに進み、Create Distributionボタンをクリックする。
2. われわれはWebサイトのためのdistributionを作りたいので、Web側のGet Startボタンをクリックする。
3. いろいろ入力覧があるが...
  1. Original Domain Nameに、ウェブサイトをホスティングしているS3バケットのエンドポイントを入力する。(つまり前節の7でCNAMEの値にセットした値である。)
    1. カーソルを入力覧に入れると、候補としてS3バケットが出てくるので、それを選ぶだけでOK
  2. Origin Pathは空欄でOK
  3. Origin IDは、Original Domain NameににS3バケットのエンドポイントを入力すると、自動的に決まるので何もしないでOK
  4. 他は特に指定する必要がないので、画面の一番下にあるCreate Distributionボタンをクリックする。
4. そうするとdistributionができるので、できたdistributionを一覧から選択し、Generalタブを選択して、Editボタンをクリックする。
5. いろいろ入力覧があるが...
  1. Alternate Domain Namesのところに、前節の7で作成したCNAMEのFQDNを入力する。
  2. 続いてSSL Certificateから、Custom SSL Certificateを選択する。
    1. テキストフィールドに上記5-1 Alternate Domain Namesに入力したFQDNを入力し、Request or Import a Certificate with ACMボタンをクリックする。
    2. するとACMで証明書を作成する手順が進むので証明書を作成する。
    3. 証明書が作成され、少し時間を置くと、上記5-2-1のテキストフィールドの選択肢にFQDN (証明書ID)の形式の選択肢が出てくるので、これを選ぶ。
    4. Yes Editボタンをクリックする。
5. Generalタブに戻って、Domain Name (*.cloudfront.net)をメモする。
6. AWSマネジメントコンソールでRoute53に進み、前節の7で作ったCNAMEのレコードセットの値を上記5でメモした*.cloudfront.netに変更する。
7. Route53に登録したDNS情報が浸透し、また、CloudFrontのdistributionのstatusがInProgressからDeployedにかわるまで待って、ブラウザでアクセスする。

以上でOKであります。
【Railsチュートリアル】Railsプロジェクトに身に覚えのないherokuディレクトリがあったときの対処法

##はじめに
Railsチュートリアルをcloud9環境で進めているとハマったので共有。

##問題
Railsチュートリアルを久々に再開して色々やってると、作業プロジェクト内にこんなディレクトリが作られていた。
**`./sample_app/heroku`**
中身はbinやlibがありどうやらherokuコマンドの実体みたい。
ただし、herokuコマンドの実体は/usr/localに配置されているのでここに置かれる意味は不明。
何よりこんなものを作った覚えはない。

##結論
ゴミディレクトリのため削除してください。

##原因
./sample_appで以下コマンドを実行したため。

```
source <(curl -sL https://cdn.learnenough.com/heroku_install)
```

Railsチュートリアルを再開した時、herokuがまったく動かずRailsチュートリアルに記載されているこのコマンドを実行したらちゃんと動いたので放置してたが。これが原因。

https://cdn.learnenough.com/heroku_install
ここにアクセスして実際にダウンロードされるファイルの内容はこんな感じ。
1. 圧縮状態のソースファイルをカレントディレクトリにダウンロード
2. 解凍してアプリを展開
3. アプリを/usr/localに移動させる
4. /usr/localに移動させたアプリにPATHを通す
→ herokuコマンドが実行可能となる

```terminal:heroku_installファイルの中身
curl -OL https://cli-assets.heroku.com/heroku-linux-x64.tar.gz
tar zxf heroku-linux-x64.tar.gz && rm -f heroku-linux-x64.tar.gz
sudo mv heroku /usr/local
echo 'PATH=/usr/local/heroku/bin:$PATH' >> $HOME/.profile
source $HOME/.profile > /dev/null
```

２回目以降に実行すると、./sample_app/herokuから/usr/local/herokuへの移動が失敗してプロジェクト内に残り続けたみたい。

```terminal:エラー
mv: cannot move ‘heroku’ to ‘/usr/local/heroku’: Directory not empty
```
ただ、herokuコマンドへのPATHは通ったので見落とした模様。

##対策
ターミナル起動時にPATHを通しておく。

```terminal:ターミナル
$ vim ~/.bashrc
PATH=/usr/local/heroku/bin:$PATH
```

※ 初回インストールのときに$HOME/.profileにherokuのPATHを通す設定を追記しているのでわざわざ設定する必要はないと思われるが、、、
**「.profile」は「.bash_login」の補欠らしい。**
**つまり、clound9だと「.bash_login」があるため設定が読み込まれない。**
参考：https://wa3.i-3-i.info/word13652.html

##メモ
コマンドの結果はちゃんと見ておこう。
「3.4.2 タイトルを追加する」を再開しようとした時に発生。
[Android入門その1][Kotlin]Android Studioでボタン操作を行う

#はじめに
ボタンを押したときに簡単なメッセージを出すまでの手順をまとめます。

#レイアウトエディター
activity_main.xmlを開き、Text→Designに変更します。

![キャプチャ12.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/104887/49e5f38b-3006-9b03-daf7-91fd5890d135.png)

下記の順番で練習を行います
　①Buttonを画面内にドラッグ&ドロップ
　②デザイン画面に出てきたボタンをクリック
　③idを「任意の名前」に変更します。

![キャプチャ10.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/104887/0044fc9b-7c2d-d770-ef68-1c659412f58a.png)


#プログラム
MainActivityを開き、onCreate内にボタンをクリックしたときの処理を追記します。

![キャプチャ8.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/104887/6be2162c-de4c-f63a-163f-63a4e2c6c9d1.png)


```Kotlin:MainActivity.kt

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

　　　　 //レイアウトの③で設定した名前を定義
        var button : Button = findViewById(R.id.hello_button)
        button.setOnClickListener {
            Toast.makeText(this, "テストメッセージです", Toast.LENGTH_SHORT).show()
        }
    }
```

※Toast：テキストを表示して消える通知方法

#実行
エミュレータのボタンを押すとメッセージが表示されます。

![キャプチャ7.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/104887/d224d931-f71a-c5bb-60db-4ccc9f199a2c.png)

#その他参考情報
[kotlinでandroid入門 メッセージ表示](https://qiita.com/folivora/items/efe4785462aec8123a7a)
[Buttonのクリックを処理する](http://buildbox.net/2018/01/kotlin-button%E3%81%AE%E3%82%AF%E3%83%AA%E3%83%83%E3%82%AF%E3%82%92%E5%87%A6%E7%90%86%E3%81%99%E3%82%8B/)
[KotlinでAndroidアプリケーション その2](https://dev.classmethod.jp/smartphone/android-kotlin-introduction-02/)
[ConstraintLayout による制約を設定するには](https://akira-watson.com/android/constraintlayout.html)
[Android の Button アプリを作ってみると簡単だった](https://akira-watson.com/android/button.html)
rails TwitterAPI を使ったフォローリスト表示

##はじめに
 ```devise``` と ```omniauth-twitter``` を使いソーシャルログインを実装後の、ログインした各ユーザーのフォローリスト(**ユーザー名、ユーザーアカウント名、プロフィール文、プロフィール画像**)を表示させた手順を書いていきます。

deviseを使ったソーシャルログインの実装は下記の記事を参考にしました。

[*Rails*] deviseの使い方（rails5版）
https://qiita.com/cigalecigales/items/f4274088f20832252374

##この記事を見てできること
twitterAPIを使ったフォローリストの表示。

##開発環境
ruby 2.6.2

rails 5.1.1

##手順

###gem



```
gem 'twitter'
```
###初期設定
https://apps.twitter.com
上記のサイトで必要となる四つのキーを取得。

>Consumer Key
Consumer Secret
Access Token
Access Token Secret

キー取得に関しては以下の記事を参考に。
https://qiita.com/ayies128/items/80e1163caa2e1448ff9d

取得したキーを以下のように読み込ます。

```
client = Twitter::REST::Client.new do |config|

    config.consumer_key        = CONSUMER_KEY

    config.consumer_secret     = CONSUMER_SECRET

    config.access_token        = ACCESS_TOKEN

    config.access_token_secret = ACCESS_TOKEN_SECRET

end
```

色々な書き方がありますが、僕はこのように書きました。

```users_controller.rb
class UsersController < ApplicationController
  before_action :twitter
  def index
  end

  def show
  end

  def follow
  end

  private
    def twitter
      client = Twitter::REST::Client.new do |config|
        config.consumer_key = "###"
        config.consumer_secret = "###"
        config.access_token = "###"
        config.access_token_secret ="###"
      end
    end
end
```

```before_action :twitter``` を入れることを忘れないように。

⚠︎キーを直接コントローラに書くのはセキュリティ面であまりよろしくないというご指摘を受けました。
以下の記事を参考に、Twitterlから取得したキーを```.env```に保存しておく方がいいっぽいです。

環境によって変わる設定値はdotenvを使うと便利
https://qiita.com/closer/items/f8d8ba00ae86d7051764
###Twitter APIを利用する
これでTwitter APIが使えるようになったので、実際に使ってみます。
今回の用途として、**followビュー**でログインユーザーのフォローリストを表示させたいので以下のように記述します。

```users_controller.rb
..
def follow
    @friends = twitter.friends(current_user).take(20)
end
..
```
@friendsは現在ログインしているユーザーのフォローユーザーを20件取得したものです。

これで表示させる準備が整いました。


###ビューで表示

表示させたい項目は、

>ユーザーの名前
ユーザーアカウント名
プロフィール文
プロフィール画像

なのでそれぞれ記述していきます。

```follow.html.erb
<% @friends.each do |friend| %>
#ユーザー名
<a href="https://twitter.com/<%= friend.screen_name %>" target="_blank"><%= friend.name %></a>
#アカウント名
<p><%= friend.screen_name %></p>
#プロフィール文
<p><%= friend.description %></p>
#プロフィール画像
<p><%= image_tag "#{friend.profile_image_url}" %></p>
<hr>

<% end %>
```

一つ注意点として```image_tag```の```friend.profile_image_url```は展開しないとエラーになってしまいます。
以下参照
https://teratail.com/questions/131100

ここまで完了すれば、ブラウザでいい感じのフォローリストができているはずです。

##終わりに

omniauth系の記事はよく見かけますが、Twitter API系の記事はあまりなかったので是非、参考にしていただければと思います。

##参考
ruby で twitter api を使用する
https://loumo.jp/wp/archive/20150916000032/
A Ruby interface to the Twitter API.
https://github.com/sferik/twitter
RailsアプリでTwitterから画像を取得する方法
https://teratail.com/questions/131100
TwitterのGemを使ってFollowした人の一覧を取ろうとしたらちょっとハマった件
https://qiita.com/ryonext/items/35546d53098240c330f3
LaTeX、listingsでのフレームの簡単なオプション

##frame=none|topline|bottomline|lines|single|leftline|shadowbox での指定
- デフォルトは枠なし
（例）[frame = ]
<img width="566" alt="スクリーンショット 2019-05-05 16.33.48.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244863/8d215a81-88ea-57b4-4c4b-46d746fc600c.png">
frame = none　としても同じ.

- [frame =topline|bottomline|lines|single|leftline|shadowbox]
　順に、上、下、上下、４方向の一重線のフレーム、左と上、影付きフレーム　の線が表示される.

（例）[frame = leftline]
<img width="566" alt="スクリーンショット 2019-05-05 16.34.47.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244863/86d40475-454c-2f7e-9a84-b19a2b00dd36.png">

（例）[frame = shadowbox]
<img width="572" alt="スクリーンショット 2019-05-05 16.43.07.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244863/891f4bec-eb61-08ed-09fc-17af80df551a.png">

##tbrlTBRL　の8文字による指定
- 
アルファベットの小文字が１重線、大文字が2重線を指定し、tbrlは順に、tがtopで上の線、bはbottomで下の線、rは右、lは左の線を指定する.これらを組み合わせてフレームを指定できる.順不同.

（例）[frame=TbL]
<img width="572" alt="スクリーンショット 2019-05-05 16.46.55.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244863/80ad9977-e50a-78d5-8894-69d22fb87808.png">
Leetcode #86: Partition List


```swift
func partition(_ head: ListNode?, _ x: Int) -> ListNode? {
    let dummyHead = ListNode(0)
    var current = head
    var pre = dummyHead
    var last = dummyHead
    var flag = false
    while current != nil {
        if current!.val < x {
            let tmp = current?.next
            current?.next = pre.next
            pre.next = current
            pre = current!
            if !flag {
                last = pre
            }
            last.next = nil
            current = tmp
        } else {
            flag = true
            last.next = current
            last = current!
            current = current?.next
        }
    }
    return dummyHead.next
}
```
Google Colaboratory内でGoogle Drive内にある画像を表示させる方法

#はじめに

Google Colaboratory内でGoogle Drive内にある画像を表示させる方法です。

#手順

１. ファイルをアップロードする
　　表示したい画像ファイルをGoogle Driveにアップロードします。

２. 共有可能なリンクを取得する
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204186/5e8c90db-3a25-a4aa-efe9-65cabd9b1dd0.jpeg" width=70%)>

-　表示したい画像ファイルを右クリックしてメニューを出し、「共有可能なリンクを取得」を選択する。
-　この時点で、リンクはコピーバッファに入っている。
-　テキストエディタなどにペーストしてみると次のような文字列が取得されていることがわかる。<br>
https://drive.google.com/open?id=xxxxxxxxxxxxxxxxxxxxxxxxx 


３. Colaboratoryでノートブックに画像を表示する
-　セルを選択した後に、Markdownモードにする。
-　「<img src="https://drive.google.com/uc?export=view&」につなげて、先程取得した共有化なリンクの id 以下の文字列を貼り付ける。

``` ## 画像の貼り方。
<img src="https://drive.google.com/uc?# export=view&id=xxxxxxxxxxxxxxxxxxxxxxxxx" width = 30%>
``` 

-　こんな感じにする。　お！できそうな予感^^
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204186/0444881d-c62b-5f7c-9d96-9653b46b74fb.jpeg" width=70%)>


できた！^^v
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204186/421f3876-bc64-e053-b560-2d5589d967a0.jpeg" width=70%)>

##<font color="Red">Enjoy!</font>