OmniAICreator/Qiita-1.07M huggingface dataset:
[playframework]フォームに長い文字列(100KB超え)を設定した時に発生する Memory buffer full on part <フォームフィールド名> エラーに対応

# 背景

以下の要件に対応するためにフォームの`input type="file"`でなく、base64化したイメージ文字列をサーバに返すことになりました。
(base64文字列は、リサイズしたイメージを`canvas`に書き込んで、`toDataURL()`で取得します。)

- 電波が悪い宿泊施設がある
- 大きな画像を登録するとすごく時間がかかる。
- 「画像のリサイズ」とか言われてもよくわからない年配の人が多い
- そこで画像を自動でリサイズしてからアップロードして欲しい。

# 問題点

処理を実装してサーバに`submit`したところ以下のエラーが発生しました。HTTPステータスコードは`413`です。

```
Memory buffer full on part <フォームのname>
```

# 対策

なんのこっちゃ？と調べてみたら、FormのParseの上限サイズ(既定では`100KB`)にひっかかっている模様。コンフィグで拡張したところ解決しました。

[(公式)Body parsers > Max content length](https://www.playframework.com/documentation/2.6.x/ScalaBodyParsers#Max-content-length)

```conf:application.conf
play.http.parser.maxDiskBuffer=10MB
play.http.parser.maxMemoryBuffer=10MB
```

# おまけ

サーバ側での実装(イメージ文字列を`BufferedImage`に変換するまで)は以下のような感じ。Java8です。

```java
import java.awt.image.BufferedImage;
import javax.imageio.ImageIO;

// 'data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAAPAAAADwCAYAAAA+VemSAAAgAEl...=='
String imageString = source.split(",")[1];
byte[] imageBytes = javax.xml.bind.DatatypeConverter.parseBase64Binary(imageString);
BufferedImage bufferedImage = ImageIO.read(new java.io.ByteArrayInputStream(imageBytes));
```

[参考]java - Convert base64 string to image - Stack Overflow
https://stackoverflow.com/questions/23979842/convert-base64-string-to-image
.preventで画面遷移をさせない ❏Vue.js❏

リンクがあるけど、画面遷移をさせたくない時を考えます。
~~そんな時あんのか~~

[![Screenshot from Gyazo](https://gyazo.com/e59424345f972a3bf79f7c88d7c9fac0/raw)](https://gyazo.com/e59424345f972a3bf79f7c88d7c9fac0)

開発環境はJSFiddle
https://qiita.com/ITmanbow/items/9ae48d37aa5b847f1b3b

```html:html
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div id="app">
  <a @click.prevent href="https://google.com">google</a>
</div>
```

`preventDefault`を仕込むと画面遷移を無効にできます。
本来はJS側で`event.preventDefault()`と記述します。

しかし、Vue.jsでは、html側で`@click.prevent`と繋げることで簡単に実装できます。

<br>
ではまた！
【理工学書勉強会】ベイズ更新のメモ

先日、塩尻市で開催された[理工学書勉強会](https://connpass.com/event/159173/)に参加してきました。

今回の内容は、ベイズの定理及びベイズ更新に関する内容でした。
非常に興味があるところであり、内容も充実しており面白かったです！
次回も予定されているようなので、楽しみです。

#残った疑問
そのときの疑問として、複数回試行した結果があったとして、**一回ずつベイズ更新を
適用した結果と、全ての結果をベイズの定理に突っ込んだ場合とで、結果が一致する
のか？**という議論になりました。

ベイズの定理を使いこなしている方にとっては当たり前の内容かもしれませんが、
普段使っていない自分にとっては「一致するはず...」という弱い主張しかできません。

そこで、**実際に計算して確かめてみるしかない！**と思いメモとして残すことに
しました。

#問題設定
感染率が0.001の病気があり、その感染を検査する薬Aと薬Bがある。

そのとき、薬Aと薬Bの陽性/陰性の確率は以下のとおりである。
ただし、Xは薬の陽性/陰性反応を示し、Sは患者の感染/非感染を表している。

・薬A

||S=非感染|S=感染|
|---|---|---|
|X=陰性|0.99|0.02|
|X=陽性|0.01|0.98|
|事前確率|0.999|0.001|

・薬B

||S=非感染|S=感染|
|---|---|---|
|X=陰性|0.96|0.03|
|X=陽性|0.04|0.97|
|事前確率|0.999|0.001|

事前確率は感染率を意味しています。薬Aでも薬Bでも当然同じ確率です。

問いは、「薬Aを使って陽性であって、かつ薬Bを使って陽性であって、実際に
病気に感染している確率を求める」というものです。

詳しくは、以下のスライドP9,10をご覧ください。

https://www.slideshare.net/ssuserfecf16/pattern-recognition-sec1-2a

#ベイズの定理
皆さんよくご存知のベイズの定理を示しておきます。

```math
p(S|X)=\frac{p(X|S)}{\sum_S p(X|S)p(S)}p(S)
```

#ベイズ更新で計算
今回の問題は、ベイズ更新の方が式が分かりやすいので、ベイズ更新から計算します。
ベイズ更新は、「前の試行の事後確率が次の試行では事前確率として代入できる」手法です。

今回の問題では、「薬Aを使って陽性」→「薬Bを使って陽性」という二回の試行に
分けてしまいます。その上で、ベイズ更新を行います。

##薬Aについて
まずは、「薬Aを使って陽性」の確率を計算します。
再掲する以下の表をベイズの定理に代入します。

||S=非感染|S=感染|
|---|---|---|
|X=陰性|0.99|0.02|
|X=陽性|0.01|0.98|
|事前確率|0.999|0.001|

```math
\begin{align}
p(S=感染&|X=陽性)\\
               &=\frac{p(X=陽性|S=感染)p(S=感染)}{\sum_Sp(X=陽性|S)p(S)}\\
               &=\frac{p(X=陽性|S=感染)p(S=感染)}{p(X=陽性|S=感染)p(S=感染)+p(X=陽性|S=非感染)p(S=非感染)}\\
               &=\frac{0.98\times0.001}{0.98\times0.001+0.01\times0.999}\\
               &=0.089
\end{align}
```

薬Aで陽性であって、実際感染している確率は0.089となりました。
一見、かなり低い確率になりますが、感染率が0.001と低いのでこのような
結果になっています。

##薬Bについて
次に「薬Bを使って陽性」の確率を求めます。
対応表はほとんど変わりませんが、事前確率が変わってきます。

||S=非感染|S=感染|
|---|---|---|
|X=陰性|0.96|0.03|
|X=陽性|0.04|0.97|
|事前確率|**0.911**|**0.089**|

事前確率が変わっているのは、「薬Aを使って陽性の事後確率」が事前確率として使えるからです。
式の内容は薬Aのときと同じです。

```math
\begin{align}
p(S=感染&|X=陽性)\\
               &=\frac{p(X=陽性|S=感染)p(S=感染)}{\sum_Sp(X=陽性|S)p(S)}\\
               &=\frac{p(X=陽性|S=感染)p(S=感染)}{p(X=陽性|S=感染)p(S=感染)+p(X=陽性|S=非感染)p(S=非感染)}\\
               &=\frac{0.97\times0.089}{0.97\times0.089+0.04\times0.911}\\
               &=0.70
\end{align}
```

薬A単体のときと比べ、薬A→薬Bと併用することで、薬A,Bで陽性であれば
実際に感染している確率を0.70まで引き上げることができました。

#ベイズの定理で計算
ここでは、一気に計算してしまいます。

すなわち、薬Aでも陽性で、かつ薬Bでも陽性であったときの病気に感染している
確率をベイズの定理に入れ求めます。

```math
\begin{align}
p(S=感染&|X_A=陽性,X_B=陽性)\\
               &=\frac{p(X_A=陽性,X_B=陽性|S=感染)p(S=感染)}{\sum_Sp(X_A=陽性,X_B=陽性|S)p(S)}\\
               &=\frac{p(X_A=陽性,X_B=陽性|S=感染)p(S=感染)}{p(X_A=陽性,X_B=陽性|S=感染)p(S=感染)+p(X_A=陽性,X_B=陽性|S=非感染)p(S=非感染)}\\
               &=\frac{0.98\times0.97\times0.001}{0.98\times0.97\times0.001+0.01\times0.04\times0.999}\\
               &=0.70
\end{align}
```
先ほどの結果と一致しました。

#まとめ
このケースに限っては、**一回ずつベイズ更新を適用した結果と、全ての結果を
ベイズの定理に突っ込んだ場合とで、結果が一致する**ことが分かりました。
初心者によるプログラミング学習ログ 192日目

#100日チャレンジの192日目

twitterの100日チャレンジ#タグ、#100DaysOfCode実施中です。
すでに100日超えましたが、継続。

100日チャレンジは、ぱぺまぺの中ではプログラミングに限らず継続学習のために使っています。

192日目は

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">おはようざいます<br>192日目<br><br>udemyで、Vue.js<br>webサイトコーディングの練習<a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a> <a href="https://twitter.com/hashtag/%E6%97%A9%E8%B5%B7%E3%81%8D%E3%83%81%E3%83%A3%E3%83%AC%E3%83%B3%E3%82%B8?src=hash&amp;ref_src=twsrc%5Etfw">#早起きチャレンジ</a><a href="https://twitter.com/hashtag/%E9%A7%86%E3%81%91%E5%87%BA%E3%81%97%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%8B%E3%82%A2%E3%81%A8%E3%81%A4%E3%81%AA%E3%81%8C%E3%82%8A%E3%81%9F%E3%81%84?src=hash&amp;ref_src=twsrc%5Etfw">#駆け出しエンジニアとつながりたい</a></p>&mdash; ぱぺまぺ@webエンジニアを目指したい社畜 (@yudapinokio) <a href="https://twitter.com/yudapinokio/status/1208840937519992832?ref_src=twsrc%5Etfw">December 22, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
MySQLにLinuxコマンドからエクスポート、インポートする方法

よく忘れるのでメモ用。

# 特定のデータベースの中身を全てエクスポート

以下のコマンドをクリック。

```
mysqldump -u root -p testdb > dump.sql
```

以上の例では、
rootユーザー、testdbというデータベース名になります。
tesdbの中身を「dump.sql」というファイル名で出力します。


以上のコマンドを打った後、パスワードが求められます。


# 特定にデータベースsqlファイルをインポート

以下のコマンドをクリック。

```
mysql -u root -p testdb < dump.sql
```
以上の例では、
rootユーザー、testdbというデータベース名になります。
dump.sqlのファイルを、testdbにインポートします。

以上のコマンドを打った後、パスワードが求められます。

以上
ファイルのコピー処理



```go:man.go
package main

import (
	"bufio"
	"fmt"
	"os"
	"os/exec"
	"path/filepath"
	"regexp"
)

const (
	// 検索対象のパス。検索したいフォルダのパスを指定する
	Root = `xxx\xxx\xxx`
	// コピーしたフォルダを指定
	DestPath = `xxx\xxx\`
)

var (
    // マッチしたファイルを追加するため変数
    file  string
    // 検索ワードを正規表現化して入れておく変数
    re *regexp.Regexp
)

// filepath.Walk に渡す関数
func visit(path string, info os.FileInfo, err error) error {
	if err != nil {
		return err
	}

	// ファイル検索
	if !info.IsDir() && re.MatchString(info.Name()) {
		//同じファイルがあっても上書き
		file = path
	}

	return nil
}

func search(checkFile string) error {

	// 正規表現
	var err error
	re, err = regexp.Compile(checkFile)
	if err != nil {
		fmt.Fprintf(os.Stderr, "error: %s\n", err)
		os.Exit(1)
	}

	err = filepath.Walk(Root, visit)
	if err != nil {
		return err
	}

	// マッチしたファイルがなければ終了する
	if len(file) == 0 {
		return fmt.Errorf("file not matched")
	}

	// ファイルのコピー
	/* このやり方だと、コピーではなく転記になる
	w, err := os.Create(DestPath + checkFile)
	if err != nil {
		log.Fatal(err)
	}

	r, err := os.Open(file)
	if err != nil {
		log.Fatal(err)
	}

	_, err = io.Copy(w, r)
	if err != nil {
		log.Fatal(err)
	}
	*/
	cmd := exec.Command("cmd.exe", "/C", "copy", "/Y", file, DestPath)
	cmd.Start()

	return nil
}

func main() {
	fmt.Println("ファイル読み取り処理を開始します")
	// 検索対象のファイル名が記載されたファイルをOpenする
	f, err := os.Open("xxxx.txt")
	// 読み取り時の例外処理
	if err != nil {
		fmt.Println("error")
	}
	// 関数が終了した際に確実に閉じるようにする
	defer f.Close()

	// 1行づつ読込む
	scanner := bufio.NewScanner(f)

	for scanner.Scan() {
		// 一行ずつ処理
		err = search(scanner.Text())
		if err != nil {
			fmt.Fprintf(os.Stderr, "error: %s\n", err)
		}
	}
}
```
【Qiita】いいねした人を確認する

自分の記事のタイトル名をそのまま検索したら2件ヒットした。

![コメント 2019-12-23 200036.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/362315/fc41b9f2-b53e-7911-f6e7-9bc9a200bd4e.png)


#確認方法
その記事のURLの後ろにlikersと付けるだけ

[【Qiita記事, Markdown】画像並びの神となる](https://qiita.com/Koshi_VTuber/items/a86ce3bb569cc4652e2f)

```
https://qiita.com/Koshi_VTuber/items/a86ce3bb569cc4652e2f/likers/
```


![コメント 2019-12-23 200500.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/362315/afd37099-cec0-2fcc-cc01-cd68876ecf9b.png)

「いいね(Contributions)」した人は一瞬の通知にしか出てこない。
![コメント-2019-12-23-201208.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/362315/1358a6b2-9dc0-66e8-aaed-766c41679b39.jpeg)

追記 
画面左側のいいねアイコンの上の数字をクリックすると、いいねした人のページを開けます。
（しらかみゅ(@shiracamus)さんより教えていただきました。）

<img width="162" alt="スクリーンショット 2019-12-25 20.56.29.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/362315/1ceba97a-efb5-7c41-70a1-8d5b472481b4.png">

少なくともその記事を「いいね」を押してくれた人がいてくれただけでわしは生きててよかったなって。

「いいね」は愛だよ！愛！
#Stripe の定期支払いで 支払い日 = 請求サイクルの起点となる日付を決める  ( billing_cycle_anchor とは？ )

https://stripe.com/docs/billing/subscriptions/billing-cycle

定期支払いのサイクルが月単位である時、

毎月2日を請求サイクルの起点とする
毎月15日を請求サイクルの起点とする

というようなことを、顧客に対する定期支払いの単位で設定することができそうだ。

# 動作

- トライアル期間がある場合は、その期間の終わりが支払い日の起点となる
- Subscriptionの作成タイミングで billing-cycle-anchor を指定した場合は、その日付が支払い日の起点となる
- 何も指定しなかった場合はSubscriptionの作成タイミングが支払い日の起点となる

これで合ってる？

>A subscription’s billing date is determined by two factors:
>Its “billing cycle anchor”: This defaults to when the subscription was created—or, if a trial period is used, to the trial end. It can also be explicitly set at the subscription’s creation.
The billing interval of its plan or plans.

# 予約ではない？

予約ではないな。

# billing_cycle_anchor=now

次回期間の請求が存在する場合に、
Subscriptionをupdateする時に `billing_cycle_anchor=now` を指定すると、今を起点にリセットできそうだ。


すぐにSubscriptionの請求が新しく発生するわけではなく、顧客への請求は良きに計らってくれるような動作を見せているが、実際のところどうなのだろう。

ドキュメントに詳しい挙動が書かれていそうだが、あとで読む。

![image](https://user-images.githubusercontent.com/13635059/71320480-3993e980-24ef-11ea-98b7-1bc194ebf618.png)


# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/2866








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
micro:bitとScratchでVRやってみる

自身のアルバイト先がITものつくり教室であり，Scratchを使ってゲーム作りを教えたりしています．最近ではワークショップでmicro:bitもよく使われ，何か出来ないかなーと考えていました．

そこに登場したScratch3.0！拡張機能でLEGOWeDoやマインドストームEV3などと無線で接続して，フィジカルコンピューティングが簡単に行えるようになりました．今回はmicro:bitを使ってScratchと無線通信し，ScratchでVRぽいゲームを作りたいと思います．

[Scratchのアドベントカレンダー](https://qiita.com/kikpond15/items/b6c0986a989b5bcf162d)にも記事を載せているのですが，micro:bitの方では主にScratchとの接続がメインになってしまったので，そこらへんを載せて行きたいと思います． 


## 接続方法

手順は[Scratchのサイト](https://scratch.mit.edu/microbit)に乗っているので，細かくは説明しませんが，以下の手順で行います．

- ScratchLinkをダウンロードし起動する
- [Scratch micro:bit HEX](https://downloads.scratch.mit.edu/microbit/scratch-microbit-1.1.0.hex.zip)をダウンロードする
- micro:bitにコードを書き込む
- Scratchとmicro:bitを接続する(Scratchから)

## VRぽいシューティングゲームを作る
micro:bitとScratchの接続が出来たら，micro：bitを使ってゲームを作っていきます．
今回作るゲームはVRぽいシューティングゲームです．VRぽいとはどんなものかというと，micro:bitには加速度センサーが入っており，傾きを見地することが出来ます．それを利用して，micro:bitを頭につけて首を傾けることで，画面のゲームを操作するものを作っていきます．

![スクリーンショット 2019-12-19 14.46.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191122/e6de6b99-6e85-4299-f563-fcd8aa29b04f.png)


## プログラミング
ここでは，コントローラとなるmicrobitのプログラムを載せていきます．
microbit の傾きによって画面を動かすとこまでやります．残りはscratchのアドベントカレンダーに載せたいと思います！

### micro:bitプログラム
![スクリーンショット 2019-12-21 13.13.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191122/e2fc56b0-789b-ab3e-e27b-190fc44b78a1.png)
こんな感じでmicrobitの傾きを変数に格納し，使いやすくします．

### 画面を動かすプログラム
次に背景を用意します．今回のシューティングゲームは宇宙をステージにしようと思うので，背景は真っ黒なものを用意しましょう．

microbitをコントローラにするのですが，ただ傾きでキャラクターが動いてもVRのような没入感，臨場感は得られないでしょう．そこで，首を傾けた方向に画面内の背景なども一緒に傾けるようにすることで，動作と画面の動き（傾き）がマッチして，少しゲームに没入しているような感覚を得ることが出来ます(個人差有り)．

microbitの傾きに合わせて傾く背景用のスプライトを用意します．
![スクリーンショット 2019-12-21 14.03.02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191122/36de5f8f-2363-c0ff-300a-150ccd7e1846.png)
こんな感じで地球や惑星を配置し，白色のペンで星を表現します．
![スクリーンショット 2019-12-21 14.05.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191122/3b9067f6-fd06-ae10-724b-bdfbfab68912.png)
プログラムはこんな感じです．
これでmicrobitの傾きによって惑星が回転するようになりました．

さらに自分が操縦する宇宙船を加えます．
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191122/aeab5a6b-d26b-0983-ce93-4655213c6670.png" width="250"> <img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191122/c364a384-473f-610e-122f-aed6d94d6b91.png" width="230">
プログラミングはこんな感じです．
<img src = "https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191122/7131b51f-f00d-8bdd-76e3-1b1c629702df.png" width="400">
これで宇宙船と背景が傾くようになりました．
![ダウンロード.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191122/ce7ff7ea-4442-c2be-d3b3-94e0e6a49853.gif)

とりあえず，microbitの傾きを使ってスプライトを動かすことが出来ました．
ここからさらにゲーム感を出すには，いろいろ作り込まなきゃいけないのですが，続きは[Scratchのアドベントカレンダー](https://qiita.com/kikpond15/items/b6c0986a989b5bcf162d)で書くことにします．

## リンク
[Scratch アドベントカレンダー](https://qiita.com/kikpond15/items/b6c0986a989b5bcf162d)
Railsで排他制御

model以外で特定の処理にロックをかけたい事象が発生したので、その時の対応です。

```ruby
module Lockable
  extend ActiveSupport::Concern

  class UnableLockError < StandardError; end

  KEY_PREFIX = 'lock/'

  def with_lock(key, expire = 30.seconds)
    real_key = "#{KEY_PREFIX}#{key}"
    value = SecureRandom.hex(10)

    raise UnableLockError unless lock(real_key, value, expire)

    begin
      yield
    ensure
      unlock(real_key, value)
    end
  end

  private

  def lock(key, value, expire)
    redis_client.set(key, value, ex: expire, nx: true)
  end

  def unlock(key, value)
    redis_client.del(key) if $redis.get(key) == value
  end

  def redis_client
    $redis
  end
end
```

```ruby
def hoge
  with_lock(key) do
    # somthing
  end
rescue Lockable::UnableLockError
  # handle error
end

```

redisを用いて対応しました。
もしお困りの方がいらっしゃれば...参考にしてくださいmm
Tesseract 5.0.0を使用して名刺をOCRしてみる

この記事は[ユニークビジョン株式会社 Advent Calendar 2019](https://qiita.com/advent-calendar/2019/uniquevision)の22日目の記事です。

# はじめに
本記事では、tesseractを使用して名刺のOCRを行います。

# インストール

基本的には[GitHubのインストール手順](https://github.com/tesseract-ocr/tesseract/wiki)に従います。
最新版のインストールにはPPAを登録する必要があります。
また、tesseractのインストールと同時に日本語用のデータもインストールします。

```console
$ add-apt-repository ppa:alex-p/tesseract-ocr-devel -y
$ apt update
$ apt install -y tesseract-ocr libtesseract-dev tesseract-ocr-jpn
```

バージョンを確認します。無事、5.00 Alphaがインストールされています。

```console
$ tesseract -v
tesseract 5.0.0-alpha-582-g60b07
 leptonica-1.78.0
  libgif 5.1.4 : libjpeg 8d (libjpeg-turbo 1.5.2) : libpng 1.6.34 : libtiff 4.0.9 : zlib 1.2.11 : libwebp 0.6.1 : libopenjp2 2.3.0
 Found AVX2
 Found AVX
 Found FMA
 Found SSE
 Found OpenMP 201511
 Found libarchive 3.2.2 zlib/1.2.11 liblzma/5.2.2 bz2lib/1.0.6 liblz4/1.7.1
```

ついでに、日本語が使用できることを確認します。

```console
$ tesseract --list-langs
List of available languages (3):
eng
jpn
osd
```

# 試してみる
[GitHubの使用方法](https://github.com/tesseract-ocr/tesseract/wiki/Command-Line-Usage)によれば、日本語のOCRは以下のようなコマンドで実行できるようです。

```console
$ tesseract imagename outputbase -l jpn
```

本記事では、試しに自分の名刺をOCRしてみます。
![meishi.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/314315/451427ec-f818-2d58-60eb-395c5282b5df.jpeg)

上記画像を`meishi.jpg`という名前で保存し、tesseractを実行します。

```console
$ tesseract meishi.jpg meishi -l jpn
Tesseract Open Source OCR Engine v5.0.0-alpha-582-g60b07 with Leptonica
Warning: Invalid resolution 0 dpi. Using 70 instead.
Estimating resolution as 219
```

すると、以下のようなファイルが生成されると思います。

```plaintext:meishi.txt
Kazumasa YAMAMOTO

ユニークビジョン株式会

〒160-0022 東京都新宿区新宿2- 1 -12 PMO新宿御苑前4F
http://www.uniquevision.coJp/

                                   TEL : 03-6434-9993
E-mail : yamamoto_kazumasa@uniquevision.coJDp


```

肝心の名前が取れていなかったり、`co.jp`が誤認識されていたりしますが概ね良さそうな気がします。
ちなみに、解析する言語は複数指定することが出来ます。試しに、英語+日本語で先ほどの名刺を解析すると以下のようになります。

```console
$ tesseract meishi.jpg meishi -l eng+jpn
Tesseract Open Source OCR Engine v5.0.0-alpha-582-g60b07 with Leptonica
Warning: Invalid resolution 0 dpi. Using 70 instead.
Estimating resolution as 219
```

```plaintext:meishi.txt
Kazumasa YAMAMOTO

ユニ ー ク ビジ ョ ン 株 式 会

〒160-0022 東京 都 新宿 区 新宿 2- 1 -12 PMO 新 宿 御苑 前 4F
http://www.uniquevision.co.jp/

TEL : 03-6434-9993
E-mail : yamamoto_kazumasa@uniquevision.co.jp

 
```

日本語の解析結果に不自然なスペースが含まれてしまいましたが、URLやメールアドレスは正しく認識されるようになりました。

# CLI以外の方法で実行する
[GitHubのWiki](https://github.com/tesseract-ocr/tesseract/wiki/AddOns)にまとまっていました。
本記事では取り扱いませんが、各言語で使用できるラッパーも紹介されており、例えば大量の名刺を自動でOCRするスクリプトなども簡単に書けるかもしれません。

# まとめ
本記事ではtesseractを使用したOCRを試しました。
簡単に導入することができるので、業務効率化などに使いやすいと感じました。

今後はプログラムからの実行も試せたらと思います。
Azure Data Factory でWeb上のテーブルを取得する

#はじめに
Azure Data Factory(以下、ADF)では多様なデータソースをサポートしています。
今回はWeb上のテーブルからデータを取得する方法についてまとめます。

※webページへの負担をかけすぎないようにご注意くださいませ。

#前提
 - Self-Hosted IRをインストールしたマシンが必要です。
    - Self-Hosted IRについては[こちら](https://docs.microsoft.com/ja-jp/azure/data-factory/create-self-hosted-integration-runtime)
 - 一部、取得先の確認用にExcel or Power BIを利用します。

#手順
[参考リンク](https://docs.microsoft.com/ja-jp/azure/data-factory/connector-web-table)

取得先は下記の国税庁のサイト内の企業規模別の平均給与リンクにします。
http://www.nta.go.jp/publication/statistics/kokuzeicho/minkan1997/menu/04.htm

手順の流れは下記です。

 - 取得先へのリンクドサービスの作成
 - インデックスの確認
 - データセットの作成

##取得先へのリンクドサービスの作成
newからリンクドサービスを作成します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/da4f5708-a19b-dfc7-7070-d96ade53f127.png)

webを選択し、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/3510bf3f-91ce-23e0-87a5-9a4ca965d916.png)

Self-Hosted IR経由で取得するように設定し、URLを指定します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/20f36b14-7076-4629-6f3a-053d4b44e208.png)

※Test Connection しておきましょう。

##インデックスの確認
Power BI かExcelから対象のテーブルのインデックスを確認します。
Excelであれば下記
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/0d3d88da-a264-de06-cde8-383b68dcf9de.png)

Power BI であれば下記
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/ed09a323-fa7d-8515-f5dc-ad9efc6b2013.png)

URLを指定します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/334b1dce-6604-a8f4-3d80-bd92c6135a3e.png)

データの変換
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/ed0b048e-e2f4-b90a-ecb7-d94126b1304c.png)

詳細エディターで、インデックスを確認します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/2987db0c-005b-dc33-db90-24a76558072b.png)

下記の数字がインデックスになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/620135a4-0111-eff4-c266-f5919d193b29.png)

##データセットの作成
ADFに戻って、データセットを作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/f672a715-9f20-c6ce-2b83-19c89fc9eb88.png)

LinkedServiceは先ほど作ったものを選択し、インデックスは確認した「0」を入れます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/7b9fb694-d1b3-3995-826c-5b9810ddf39f.png)

プレビュー結果はこのように出ます。クレンジングが必要そうですね。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/9870233d-5418-e2c6-8a44-033fc6329aa7.png)

あとはCopyアクティビティなどで、Storageに吐くもよし、Mapping Data Flowで変換してDBに書き込むもよしです。

以上
Laravel6.0「make:Auth」の対応策

##内容 
Laravelバージョン６.0では php artisann make:auth が
無くなったみたいです。
実装できるまで私が辿った道のりをまとめました。


#####こちらの記事を参照
[qiita.com/daisu_yamazaki/items/a914a16ca1640334d7a5](qiita.com/daisu_yamazaki/items/a914a16ca1640334d7a5)

 
###エラーが出たら
`php artisan ui vue --auth`
`php artisan migrate`ができなかったら
Node.js/npmをインストールする必要があります。

#####こちらの記事を参照
[https://qiita.com/PolarBear/items/62c0416492810b7ecf7c](https://qiita.com/PolarBear/items/62c0416492810b7ecf7c)



###インストールできなかった場合
以下のようなエラーが出たら、

```
Error: An exception occurred within a child process:
 CompilerSelectionError: nodebrew cannot be built with any available compilers.
```

NodebrewでNodeをインストールしてください。

#####こちらの記事を参照
[https://qiita.com/mame_daifuku/items/373daf5f49ee585ea498](https://qiita.com/mame_daifuku/items/373daf5f49ee585ea498)

これでできるようになると思います！
ATLAS-SoCで遊ぶ (Lチカ part1)

##最初の遊び道具
[ATLAS-SoC](https://www.mouser.jp/ProductDetail/Terasic/P0419/?qs=%2Fha2pyFaduhNHxtUPTgUr5Xeiu7Ehsp%2F%2F3FfcuVtxFI=&_ga=2.266056143.1775444152.1577095273-1679077788.1577095273)
![test.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/555882/500bc04a-2caa-e98b-0471-2a81e203d4ba.jpeg)
いきなりボリューミーな物を買ってしまった感があるが気にしない。
ARMベースSoC FPGAの中でも安価で手に入るために購入を決意
ARMもFPGAも遊べちゃう。
まずはFPGA部を適当に触ってみたいと思います。

###実施内容
terasicで配布している[CD-ROM](http://download.terasic.com/downloads/cd-rom/de0-nano-soc/)
の中にverilogのソースコードが入っていたので「DE0_NANO_SOC_Default.qpf」
を読み込みコンフィギュレーションを行い動作確認を行う。

###使用ツール
・Quartus (Quartus Prime 18.1) Lite Edition

###結果
![test2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/555882/07316aa1-9153-87dc-4a2f-b494f7d1f263.jpeg)
無事動作。コードもいじってないし当然か。
にしてもこの楽し気に光るLEDいいね。
Stripe::InvalidRequestError: billing_cycle_anchor cannot be later than next natural billing date (<timestamp>) for plan

定期支払いのサイクルを超えた billing_cycle_anchor の設定はできないように思える。

例えば定期支払いサイクルが1日単位の場合は、2日以降の billing_cycle_anchor 
は指定できない

# ref

Managing subscription billing cycles | Stripe Billing
https://stripe.com/docs/billing/subscriptions/billing-cycle

# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/2865








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
testingだけで完結するmockを作る #Golang

こんにちは。[まいたけ](https://twitter.com/maitaketurn)と申します。
こちらは、[Go4 Advent Calendar 2019](https://qiita.com/advent-calendar/2019/go4) の23日目の記事です。

Goで実装して、テストも実装して、、とやっていると、
ある程度以上の大きさ(&複雑さ？)の実装となるとmockが必要になるケースが増えるかなと思います。


[GoMock](https://github.com/golang/mock)を使って実装するやり方は結構情報あったのですが、
標準のtestingパッケージのみでmockを作る方法を詳しく書いている方があまり多くないようで(皆さんGoMockを利用されているということでしょうかね。。)
Goに入門して割りとすぐの頃にmockを作ろうとして少し苦労した記憶があるので、まとめてみたいと思います。

## テスト対象の実装
`createTask`と`updateTask`のmockを作りたいとする。

```Go
type TaskInterface interface {
	createTask(int,string) (string, error)
	updateTask(int,string) (string, error)
}

type TaskController struct {
	functions            TaskInterface
}

func (c *TaskController) createTask(id int,title string) error {
	// 何か処理
}

func (c *TaskController) updateTask(id int,title string) error {
	// 何か処理
}	
```

## test側
Goのinterfaceはダックタイピングを採用しているため、`TaskInterface`のメソッドリストを実装してあげることで、mockを作成出来ます。

```Go
type mockTaskController struct {
	TaskInterface
	mockCreateTask func(int,string) (string, error)
	mockUpdateTask func(int,string) (string, error)
}

// 内部処理はmockCreateTask,mockUpdateTaskに任せる
func (m *mockTaskController) createTask(id int, title string) error {
	m.mockCreateTask(id, title)
}

func (m *mockTaskController) updateTask(id int, title string) error {
	m.mockUpdateTask(id, title)
}

... //中略
func TestHoge(t *testing.T) {
	m = &mockTaskController{}
	// テスト内容に合わせてmockCreateTaskの戻り値を指定する
	m.mockCreateTask = func(int,string) (string, error) { return "bug fix", nil }

...

}	
```
メソッドの内部処理は上記の例のように固定値を返すようにしても良いですが、
`createTask`の戻り値によって動作が変わるメソッドのテストを書く場合もある(むしろこっちのほうが多い？)ので、テーブルドリブンテストのループ内で`m.mockCreateTask`の宣言をする感じにも出来ます。

### test側 テーブルドリブンテストの場合
```Go
func TestHoge(t *testing.T) {
	m = &mockTaskController{}
	Cases := []struct {
		caseTitle  string
		createTaskTitle string
		createTaskError
	}
		.... // 中略
	}

	for _, c := range Cases {
		m.mockCreateTask = func(int,string) (string, error) { return c.createTaskTitle, c.createTaskError }
		... //中略
	}

...

}	
```
## まとめ
この方法だと既存のソース、パッケージ内のメソッドのmockも同様に作成可能です。便利。
mockを自動生成してくれる[GoMock](https://github.com/golang/mock)も魅力的ですが、今回ご紹介した方法だと柔軟にmockが作れるので良いなあと思います。
testingのみでサクッとmockを作りたい場合にはぜひ試してみて下さい。
UbuntuでRやHaskellがインストールできないときの対処法


メモ記事

環境はUbuntu16.04。
Anaconda(Python)やMATLABはインストーラでインストールできるが、Rはapt-getなどを利用してインストールしなければならない。

```
sudo apt-get install r-base
```
以下のようなエラーが出た。

```
パッケージリストを読み込んでいます... 完了
依存関係ツリーを作成しています                
状態情報を読み取っています... 完了
インストールすることができないパッケージがありました。おそらく、あり得
ない状況を要求したか、(不安定版ディストリビューションを使用しているの
であれば) 必要なパッケージがまだ作成されていなかったり Incoming から移
動されていないことが考えられます。
以下の情報がこの問題を解決するために役立つかもしれません:

以下のパッケージには満たせない依存関係があります:
 r-base : 依存: r-base-core (>= 3.2.3-4) しかし、インストールされようとしていません
          依存: r-recommended (= 3.2.3-4) しかし、インストールされようとしていません
          推奨: r-base-html しかし、インストールされようとしていません
E: 問題を解決することができません。壊れた変更禁止パッケージがあります。
```
他のソフトはapt-get installで問題なくインストール出来ているから不思議だった。
調べるとRにはgcc-gfortranなどの依存パッケージがあり、それらがインストール出来ないようだ。

#解決方法
設定の「ソフトウェアとアップデート」の「アップデート」タブでチェック項目に一つもチェックされていないことが原因だったようだ。

![demo1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521288/50f1af13-7599-c2b7-5f23-94078a02a4b3.jpeg)
これらの項目にチェックを入れてから、以下のコマンドを打つことでインストールすることができた。(チェックを入れるのはxenial-securityだけでも可。)

```
sudo apt-get update
sudo apt-get install r-base
```
ちなみにRは通常のレポジトリからは最新版をインストールできない。
最新版をインストールする場合は、Rプロジェクトのリポジトリに登録し公開鍵認証をする必要がある。

＊追記(2020/06/04)
Haskellをインストールするときにも同様の方法で対処することが出来た。
【他人に教えることの難しさを経験できた】Perl入学式 in東京 秋開講 第2回 〜構文基礎編〜 #Perl入学式

スタッフとして参加してきました。
今回は構文基礎編（四則演算、論理演算、ループなど）です。

イベントの詳細はこちらから確認できます↓
https://perl-entrance-tokyo.connpass.com/event/153441/

## 良かったこと
初学者の方に教える難しさが経験できました。

forループの基本構文を教えるところで、「**なんとなく分かるんだけど、よくわからない**」という方がいました。

であれば、ということで、基本構文のサンプルコードを一行ずつ指定して、「この行は何をしていると思いますか？」と質問することから始めました。

こうすることで、あいまいな理解を具体的な理解に落とし込む手伝いをしました。

結果として、講義に少し遅れる形ではありましたが、時間内に基本構文を参考にして練習問題を解けるまでになりました。

## 感じた課題
教えるときに、こちらが正解を誘導してしまうことがありました。

具体的には、配列の要素をすべて出力しようとしたとき、対象の配列を間違えていたのをこちらが指摘してしまいました。

講義時間が迫っていたのは仕方ないとして、ここは、自分で気づけたほうが後々のモチベーションに繋がると思いました。

## 改善したいこと

 - 最初に、「相手がどこまで知りたいか」を確認するようにします。
 - 自己紹介の後には拍手をするようにします。
SmalltalkJenga v1.0.2

去年発表した[SmalltalkJenga](https://qiita.com/kueda_sorabito/items/a07b67822c686ac8a344)が少しだけパワーアップしたので紹介したいと思います。

# インストール

[gist](https://gist.github.com/KazunoriUeda/5fb8be0a6b69001f19d047e9bf23b695)から`SmalltalkJenga.st`と`RSJengaLayout.st`をDLします。

`Roassal3`を使っているのでそちらを事前にインストールします。

```Smalltalk
Metacello new
    baseline: 'Roassal3';
    repository: 'github://ObjectProfile/Roassal3/src';
    load.
```

`SmalltalkJenga.st`と`RSJengaLayout.st`をFile inしてから

```Smalltalk
SmalltalkJenga playWithRoassal.
```

を実行すると、ジェンガタワーが現れます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/323383/d073e72a-68f3-cf60-43c9-7dba1c5c1836.png)

## ブロックについて
ブロックの色は<font color="orange">オレンジ</font>のものほどメソッド数が少なく、<font color="red">赤い</font>ものほどメソッド数が多いです。
またブロックの幅はサブクラスの数が少ないほどブロックが*細く*、サブクラスの数が多いほど**太く**なります。
赤い長いこのブロックが`Object`クラスのブロックです（その下の赤い長いブロックは`ProtoObject`）。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/323383/e9cba57e-9fd9-e45e-e4ab-57cb339bb08e.png)

## 遊び方
クリックすると、該当クラスとそのサブクラスたちが一斉に消えます。
クラスを消すと以下のような計算式に従ってスコアが計算され加算されていきます。
システムが止まらない間にどれだけスコアを稼げるか、というゲームです。

- (コード行数 * 1)
- (インスタンス変数の数 * 2)
- (インスタンスメソッドの数 * 3)
- (クラス変数の数 * 4)
- (クラスメソッドの数 * 6)
- (インスタンスとクラスの参照の数 * 10)
- (サブクラスのスコア)

### クラス毎のスコア
いくつか試しに削除時のスコアを計算してみます。

あんまり影響が無さそうな`ClassVariableTest`クラスを消すとスコアは下記のようになります。

```
LOC                	: 35
Instance Variables 	: 0
Instance Methods  	: 6
Class Variables    	: 1
Class Methods      	: 0
Instance Refs      	: 0
Class Refs         	: 10
Subclasses         	: 0
deletion score     	: 157
```

続いて`True`クラス。インスタンスの参照数がすごいです。

```
LOC                	: 62
Instance Variables 	: 0
Instance Methods  	: 13
Class Variables    	: 0
Class Methods      	: 1
Instance Refs      	: 24486
Class Refs         	: 12
Subclasses         	: 0
deletion score     	: 245077
```

`Metacello`を削除すると……意外とスコアが低いです。Smalltalkシステム自体は`Metacello`クラスが無くても動きに支障は無いのでこのくらいなのでしょう。

```
LOC                	: 206
Instance Variables 	: 2
Instance Methods  	: 62
Class Variables    	: 0
Class Methods      	: 6
Instance Refs      	: 0
Class Refs         	: 12
Subclasses         	: 0
deletion score     	: 552
```

そして最後に`Duration`のスコア。スコア自体はそこまででも無かったのですが、クラスの参照が多いためかやたらと時間がかかりました。

```
Class Name         	:
LOC                	: 287
Instance Variables 	: 2
Instance Methods  	: 45
Class Variables    	: 0
Class Methods      	: 16
Instance Refs      	: 3495
Class Refs         	: 741
Subclasses         	: 0
deletion score     	: 42882
```

このスコア計算はすごく雑ですが、きちんと計算するようにすれば該当クラスのシステムにおける重要度が客観的に評価できる……かもしれません。

## [ESUG2019](https://esug.github.io/2019-Conference/conf2019.html)での発表
2019年8月下旬に開催された[ESUG2019](https://esug.github.io/2019-Conference/conf2019.html)のShow us your projectにて飛び込みでLTをしてきました。
https://youtu.be/RNQKwcYb6Jc?t=2556
割と受けてました。

## 今後の展望
REST APIに対応させてネットワーク内の不特定多数と遊べるようにするのはどうか、というアイデアをいただいたので、頑張って実装していきたいと思います。
それから結局パッケージマネージャでインストールできるようになっていないので、方法を調べてGitHubにリポジトリを作ってそこからインストールできるようにもしていきたいなと思っています。
あと[Woden](https://github.com/woden-engine/woden)を使って3Dのジェンガタワーを作るというのも面白そうなので、挑戦してみたいです。
ネストしたオブジェクトをYupでバリデーションする

Railsでいうnested attributesみたいなやつ :bulb: 

```rb
{
  "title" => "title dayo",
  "body" => "body dayo",
  "tag_attributes" => {
    "0" => { "name" => "hoge" },
    "1" => { "name" => "fuga"}
  }
}
```


Yup.lazyとlodashのmapValuesを使いました。

```ts
import * as Yup from "yup";
import mapValues from "lodash.mapvalues";

interface Form {
  title: string;
  body: string;
  tag_attributes: {
    [key: string]: {
      name: number;
    };
  };
}

const validationSchema = Yup.object().shape({
  title: Yup.string(),
  body: Yup.string(),
  tag_attributes: Yup.lazy<object>(obj =>
    Yup.object(
      mapValues(obj, () =>
        Yup.object().shape({
          name: Yup.string()
        })
      )
    )
  )
});
```

以上です :hugging: 

## 参考
- [Lodash Documentation](https://lodash.com/docs/4.17.15#mapValues)
- [Example of dynamic object keys · Issue \#130 · jquense/yup](https://github.com/jquense/yup/issues/130)
- [ActiveRecord::NestedAttributes::ClassMethods](https://api.rubyonrails.org/classes/ActiveRecord/NestedAttributes/ClassMethods.html)
欅坂46の歌詞を形態素解析してみた(MeCabをRubyで使う)

# はじめに
12月14日に[平成Ruby会議01](https://heiseirb.github.io/kaigi01/)に参加してきました。

「[階層的クラスタリングをRubyで表現する](https://speakerdeck.com/ayumitamai97/implement-hierarchical-clustering-analysis-using-ruby)」のセッションに影響されて、
普段、自然言語処理や統計などやっていない素人がやってみました。

# 環境
macOS Cataline 10.15.2
Ruby 2.5.3
Homebrew 2.2.1

# インストール
MecabとMecabで使用する辞書をインストールします。

```
$ brew install mecab
$ brew install mecab-ipadic
```
```
$ mecab -v                      
mecab of 0.996
```
続いて、
MecabをRubyで扱うことのできる`natto`をインストールします。

```
$ gem install natto
```
```
$ gem list natto
*** LOCAL GEMS ***

natto (1.1.2)
```

# 実装
今回歌詞を取得するため
[歌ネット](https://www.uta-net.com/) から `nokogiri` を使ってスクレイピングします。
今回`nokogiri` に関する説明は省略します。

欅坂46の歌詞の人気順のTOP10に絞って行いました。
https://www.uta-net.com/artist/19868/4/


まず人気一覧から各曲の歌詞ページの飛んで歌詞を取得し、
`run_natto`に渡します。

```rb

require 'nokogiri'
require 'open-uri'

def run
  doc = Nokogiri::HTML.parse(open('https://www.uta-net.com/artist/19868/4/'), nil, 'utf-8')
  words = []
  doc.css('.td1').each_with_index do |f, i|
    link = f.children[0][:href]
    url = "https://www.uta-net.com#{link}"
    song = Nokogiri::HTML.parse(open(url), nil, 'utf-8')
    title = song.css('.title > h2').text
    run_natto(song, title, words)
    break if i == 9
  end
end
```



`Natto::MeCab.new`にノードフォーマットオプションを渡すことで
抽出する属性をカスタマイズすることができます。

今回は
「助詞」、「助動詞」、「記号」は除き、
`形態素: ノードの品詞`
の形で抽出しています。

```
人: 名詞
溢れ: 動詞
交差点: 名詞
どこ: 名詞
行く: 動詞
```

```rb
require 'natto'

def run_natto(song, title, words)
  natto = Natto::MeCab.new('-F%m:\s%f[0]')
  natto.enum_parse(song.css('#kashi_area').text).each do |n|
    array = n.feature.split(': ')
    if array[1] == '助詞' || array[1] == '助動詞' || array[1] == '記号'
      next
    else
      words << array[0]
    end
  end
end
```

`run_natto`で生成した配列から
形態素をkeyとして個数をvalueとするハッシュを生成し
CSVで出力しました。

```rb

require 'csv'

def run
  ...
  hash = words.group_by(&:itself).map{ |key, value| [key, value.count] }.to_h
  create_csv(hash)
end

def create_csv(hash)
  CSV.open('file.csv', 'w') do |csv|
    csv << %w[ワード カウント]
    hash.each do |key, value|
      csv << [key, value]
    end
  end
end
```

全体はこちらから。
https://github.com/kokinoue/analyze_lyrics_of_keyaki/blob/master/keyaki_songs.rb

# 結果
TOP10は以下のようになりました。

|ワード  |カウント  |
|---|---|
| (  |68  |
|し  |50  |
|僕 |50 |
|） |45 |
|ん |39 |
|れ |37 |
|ない |35 |
|君 |31 |
|人 |29 |
|何 |29 |

「僕」「君」は多いだろうなと思っていたので予想通りでしたが
「（）」や「ん」「ない」などあまり参考にならないものが上位に来てしまい
改良の余地があるなと思いました…

ちなみに

|ワード |カウント |
|--- |--- |
|セゾン |24 |
|Blah |24 |

二人セゾンとアンビバレントですね
(セゾンこんな言ってるんだ…)

# 最後に
実際の発表ではさらに階層的クラスタリングを行っているのですが、
とりあえずは形態素解析まで行ってみました。

今回は秋元康でしたが別の作詞家でやってみると面白いかと思います！

# 参考
https://github.com/buruzaemon/natto
https://speakerdeck.com/ayumitamai97/implement-hierarchical-clustering-analysis-using-ruby
https://www.uta-net.com/
http://brainvalley.jp/blog/32
http://brainvalley.jp/blog/33
Laravel Mixで出力されたJavaScriptファイルのパッケージ構成比をsource-map-explorerで調べる

Laravel Mixで出力されたJavaScriptファイルのファイルサイズが大きくて困っているとき、
まずはどのパッケージがどれぐらいのサイズを占めているか調べると思います。
そこでどうやって構成比を調べるかを「webpack バンドル サイズ」などで検索したところ、source-map-explorerというパッケージを見つけました。

https://github.com/danvk/source-map-explorer

# Getting started

サクッと使ってみましょう。
まず用意するのはLaravelアプリで、最新の6を落としてきて`npm install`まで済ませたところから始めます。
次に今回の肝であるsource-map-explorerをインストールします。

```sh
$ npm install --save-dev source-map-explorer
```

`package.json`に`analyze`コマンドを追加しましょう。

```javascript
{
    ...
    "scripts": {
        ...

        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "analyze": "source-map-explorer 'public/js/*.js'"
    },
    ...
}
```

そしてJavaScriptファイルを出力した後に`analyze`を実行します。

```sh
$ npm run dev
$ npm run analyze

> @ analyze
> source-map-explorer 'public/js/*.js'

public/js/app.js
  Unable to find a source map.
  See https://github.com/danvk/source-map-explorer/blob/master/README.md#generating-source-maps
```

ソースマップがないと怒られました:cry:

`webpack.mix.js`を修正します。

```javascript
mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css')
    .sourceMaps();
```

`npm run production`でないとソースマップが出力されません。

```sh
$ npm run production
$ npm run analyze
```

<img width="1552" alt="スクリーンショット 2019-12-23 18.21.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/123511/7790366f-fd5b-dedb-f264-4fccf1eda261.png">

実行するとブラウザで上記のような画面が表示されます。
要素をクリックするとさらに詳しく調べられたりします。
シンプルでわかりやすいですね:beer:

# 参考URL
https://qiita.com/qrusadorz/items/cd05ffe3ad08754b9e65
https://create-react-app.dev/docs/analyzing-the-bundle-size
https://github.com/danvk/source-map-explorer
[Go]マイグレーションツールsql-migrate使い方

## 公式リポジトリ

https://github.com/rubenv/sql-migrate

## 対応DB
MySQL / SQLite / PostgreSQL / MSSQL / Oracle Database

# 使い方

## 1. インストール
```
$ go get github.com/rubenv/sql-migrate/...
```


## 2. 設定ファイルのdbconfig.ymlを作成する
```
development:
  dialect: mysql  //使用するRDBMS
  datasource:[ユーザー名]:[パスワード]@/[データベース名]?parseTime=true
  dir: db/migrations  //マイグレーションファイルを作成するディレクトリ
  table: migrations  //マイグレーション履歴を保存するテーブル名
```

マイグレーションファイルをどのディレクトに生成するか`dir: `で設定できます。
上記の場合、`db/migrations`ディレクトリに生成されます。


### 3. マイグレーションファイルの作成


```
sql-migrate new [テーブル名]
```
`20191223120951-[テーブル名]`というファイルが作成されます。

### 4. マイグレーションファイルに記述する
`-- +migrate Up`以下に行いたいスキーマの変更のためのSQLを記述し、
`-- +migrate Down`以下にそれを打ち消すSQLを記述します。

```20191223120951-users.sql

-- +migrate Up
CREATE TABLE IF NOT EXISTS `users` (
  `user_id` INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY,
  `name` VARCHAR(255) NOT NULL,
);

-- +migrate Down
DROP TABLE IF EXISTS `users`;
```

### 5. コマンド

#### マイグレーションファイルを実行する

```
$ sql-migrate up
Applied 1 migrations
```

#### ロールバックする

```
$ sql-migrate down
Applied 1 migrations
```

#### マイグレーションの実行を確認する

```
$ sql-migrate status
+--------------------------------------+-------------------------------+
|              MIGRATION               |            APPLIED            |
+--------------------------------------+-------------------------------+
| 20191223120951-users.sql             | 2019-12-23 08:00:00 +0000 UTC |
+--------------------------------------+-------------------------------+
```

#### 直前の操作を再実行する

```
$ sql-migrate redo
```

#### マイグレーションファイルを作成する

```
$ sql-migrate new [テーブル名]
```

### 参考
https://github.com/rubenv/sql-migrate
https://medium.com/what-i-talk-about-when-i-talk-about-technology/a-db-migration-tool-for-go-rubenv-sql-migrate-718872ab9528
【ぶっちゃけAndroidアプリ開発】AsyncTaskクラスの備忘録

このTipsはJava言語をある程度学んでいる方を前提にしています。
Web通信するAndroidアプリを開発する上で、AsyncTaskという非同期クラスを使う事になりました。その時に学んだ事を備忘録として記録します。
AsyncTaskに翻弄されている方の助けになればと思います。
##サンプルコード
Android Developersに載っているサンプルコードです。AsyncTaskを継承して実装しています。
AsyncTaskは、呼び出し側と非同期で実行したい場合に使います。なので、呼び出し側はクラスをインスタンス化して実行(executeメソッド)する事になります。(呼び出し方は後述)

```.java
 private class DownloadFilesTask extends AsyncTask<URL, Integer, Long> {
     protected Long doInBackground(URL... urls) {
         int count = urls.length;
         long totalSize = 0;
         for (int i = 0; i < count; i++) {
             totalSize += Downloader.downloadFile(urls[i]);
             publishProgress((int) ((i / (float) count) * 100));
             // Escape early if cancel() is called
             if (isCancelled()) break;
         }
         return totalSize;
     }

     protected void onProgressUpdate(Integer... progress) {
         setProgressPercent(progress[0]);
     }

     protected void onPostExecute(Long result) {
         showDialog("Downloaded " + result + " bytes");
     }
 }
```
##ジェネリクス
AsyncTaskを継承してクラスを作成していますが、AsyncTaskはジェネリクスを使用しているため継承する時に以下のような記述になります。

```.java
private class DownloadFilesTask extends AsyncTask<URL, Integer, Long> {
}
```
ジェネリクス(総称型)というのは、クラスが引数の型を定めない場合に使うんだそうです。ここではとりあえずそう覚えておきます。
このサンプルでは、 URL, Integer, Long となっていますが、型が決まっていないので、クラスの実装によって他の型になります。

##doInbackgroundメソッドと可変長引数
AsyncTaskには必ずオーバーライドしなければならないabstructメソッドとして、doInBackgroundがあります。
doInBackgroundは、AsyncTaskが(非同期に)実行された時に裏側で動くいちばんメインの処理を記述します。

```.java
     protected Long doInBackground(URL... urls) {
         int count = urls.length;
         long totalSize = 0;
         for (int i = 0; i < count; i++) {
             totalSize += Downloader.downloadFile(urls[i]);
             publishProgress((int) ((i / (float) count) * 100));
             // Escape early if cancel() is called
             if (isCancelled()) break;
         }
         return totalSize;
     }
```
引数はピリオドが3つついたもの (URL... urls) となっています。
これは可変長引数と言って、受け取るのはurls[]配列変数となります。
なぜ配列変数の引数にしないかというと、呼び出す側には羅列して書いていいので、呼び出す前にいちいち配列を作らなくていいというメリットがあるからだそうです。(呼び出し方は後述)

doInBackgroundメソッドの引数 (URL... urls) は、クラス継承する時にジェネリクスで指定した1つ目の型です。戻り値の totalSize は、3つ目の型(ここではLONG型として戻す)です。

##呼び出し側
呼び出し側の記述です。

```.java
new DownloadFilesTask().execute(url1, url2, url3);
```
executeメソッドで実行するとdoInBackgroundメソッドの処理が裏側で動きます。
url1とurl2とurl3が、可変長引数として(結局は配列変数として)渡されます。

##onPostExecuteメソッド
サンプルで、AsyncTaskのonPostExecuteというメソッドを記述しています。
このメソッドは、doInBackgroundの処理が終わった後に呼び出されます。

```.java
     protected void onPostExecute(Long result) {
         showDialog("Downloaded " + result + " bytes");
     }
```
doPostExecuteメソッドの引数 result は、doInBackgroundの戻り値がセットされます。

##ジェネリクス再び
最初に戻って、クラスを継承した時にジェネリクスに指定する1つ目の型はdoInBackgroundの引数と、3つ目の型はdoInBackgroundの戻り値(＝onPostExecuteの引数)と合わせましょう。

```.java
private class DownloadFilesTask extends AsyncTask<URL, Integer, Long> {
}
```
---
ぶっちゃけAndroidアプリ開発は、アプリ開発にあたってとりあえず知っておくべきことをズバリ書きます。例外はありますのでご了承ください。
勉強中の身でありますので、誤りなどあればご指摘いただけると有り難いです。
SwiftUIで非同期で画像を表示する方法

# はじめに

この記事は、`ObservableObject`を使って非同期に画像をダウンロードする方法を紹介します。
List表示時などに使うと便利だと思います。
TIPSとして活用してもらえたらと思います。

# 作り方

## Step1.準備
画像を用意します。今回は、いらすとやの画像を活用させていただきます。

> スマートフォンを使うペンギンのイラスト
> https://www.irasutoya.com/2019/07/blog-post_4.html

画像のURLは`https://1.bp.blogspot.com/-_CVATibRMZQ/XQjt4fzUmjI/AAAAAAABTNY/nprVPKTfsHcihF4py1KrLfIqioNc_c41gCLcBGAs/s400/animal_chara_smartphone_penguin.png`でした。

## Step2.非同期で画像をダウンロードする

ObservableObjectを活用して、データを取得します。
バッググラウンドスレッドで画像を読み込み、`@Published`した変数に格納するときはメインスレッドで更新します。
([Data Flow Through SwiftUI](https://developer.apple.com/videos/play/wwdc2019/226)20:05あたりのスライド87ページより)

```swift:ImageDownloader.swift
import Foundation

class ImageDownloader : ObservableObject {
    @Published var downloadData: Data? = nil
    
    func downloadImage(url: String) {
        
        guard let imageURL = URL(string: url) else { return }
        
        DispatchQueue.global().async {
            let data = try? Data(contentsOf: imageURL)
            DispatchQueue.main.async {
                self.downloadData = data
            }
        }
    }
}
```

## Step3. SwiftUIで扱えるUIパーツを作る

ObservableObjectを使い、画像読み込み終わるとUIImageを使い表示します。
読み込み中の場合は、ランアップできないので今回はSF Symbolの画像を表示します。
SF Symbolの画像以外に任意の画像に置き換えればいいと思います。

```swift:URLImage.swift
import SwiftUI

struct URLImage: View {
    
    let url: String
    @ObservedObject private var imageDownloader = ImageDownloader()
    
    init(url: String) {
        self.url = url
        self.imageDownloader.downloadImage(url: self.url)
    }
    
    var body: some View {
        if let imageData = self.imageDownloader.downloadData {
            let img = UIImage(data: imageData)
            return VStack {
                Image(uiImage: img!).resizable()
            }
        } else {
            return VStack {
                Image(uiImage: UIImage(systemName: "icloud.and.arrow.down")!).resizable()
            }
        }
    }
}
```

## Step4.SwiftUIから読み込む
Step3で作成したURLImageをSwiftUIから呼び出します。
画像のURLを引数に呼び出すと自動で画像ダウンロードされたら表示されるようになります。

```swift:ContentView.swift
import SwiftUI

struct ContentView: View {
    
    var body: some View {
        VStack {
            URLImage(url: "https://1.bp.blogspot.com/-_CVATibRMZQ/XQjt4fzUmjI/AAAAAAABTNY/nprVPKTfsHcihF4py1KrLfIqioNc_c41gCLcBGAs/s400/animal_chara_smartphone_penguin.png")
                .aspectRatio(contentMode: .fit)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
```

# 参考サイト
- [Downloading Images in SwiftUI](https://youtu.be/3q6jGt7bxeg)
TikZ color list

## tikzの色一覧

![colors.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/479931/91240dc2-7a2f-285c-e280-f792a9524545.jpeg)

## コード
```tex
¥documentclass[dvipdfmx]{standalone} 

¥usepackage{tikz}

¥begin{document}
¥begin{tikzpicture}
¥node [fill=red]  at (0, 1) {red};
¥node [fill=green]  at (0, 2) {green};
¥node [fill=blue]  at (0, 3) {blue};
¥node [fill=cyan] at (0, 4) {cyan};
¥node [fill=magenta] at (0, 5) {magenta};
¥node [fill=yellow]  at (4, 1) {yellow};
¥node [fill=black, text=white]  at (4, 2) {black};
¥node [fill=gray]  at (4, 3) {gray};
¥node [fill=white]  at (4, 4) {white};
¥node [fill=darkgray]  at (2, 5) {darkgray};
¥node [fill=lightgray]  at (2, 1) {lightgray};
¥node [fill=brown]  at (2, 2) {brown};
¥node [fill=lime]  at (2, 3) {lime};
¥node [fill=olive]  at (2, 4) {olive};
¥node [fill=orange]  at (6, 1) {orange};
¥node [fill=pink]  at (6, 2) {pink};
¥node [fill=purple]  at (6, 3) {purple};
¥node [fill=teal]  at (6, 4) {teal};
¥node [fill=violet]  at (6, 5) {violet};
¥end{tikzpicture}

¥end{document}
```

## 他の色
自分でカラーを定義するなら、こちらにたくさんサンプルがある。 [http://latexcolor.com/](http://latexcolor.com/)
disabled にしたボタンの hover スタイルが消えなくて困った時の対処法

## 修正前のコード
`disabled="disabled"` にしても `hover` のスタイルが適用されてしまう...

<p class="codepen" data-height="265" data-theme-id="default" data-default-tab="css,result" data-user="sshono1210" data-slug-hash="xxbdWvX" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="xxbdWvX">
  <span>See the Pen <a href="https://codepen.io/sshono1210/pen/xxbdWvX">
  xxbdWvX</a> by Shiori SHONO (<a href="https://codepen.io/sshono1210">@sshono1210</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

## 修正後のコード
「〜はスタイルを除外したい」というものを指定できる `:not()` を使う

<p class="codepen" data-height="265" data-theme-id="default" data-default-tab="css,result" data-user="sshono1210" data-slug-hash="qBEmoxm" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="qBEmoxm">
  <span>See the Pen <a href="https://codepen.io/sshono1210/pen/qBEmoxm">
  qBEmoxm</a> by Shiori SHONO (<a href="https://codepen.io/sshono1210">@sshono1210</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

## 参考
https://qiita.com/noraworld/items/74ab6d7f6ace6e7ec3c4
NLPerのための"CUDA out of memory"回避術

# TL;DR

GPUでNLPする時のCUDA out of memoryを回避する方法を地味なものからナウいものまでまとめてみた

# 自己紹介

* 都内のしがない博士院生
* NLPer
* PyTorchユーザー
* VAEが好き

# CUDA out of memory とは

GPUのメモリに大きなサイズのテンソルを乗せすぎて容量を超えてしまうことで発生するエラー。

NLPerに限らず、多くのエンジニア・リサーチャーを苦しめていることと（勝手に）思っています。

この記事ではそんな方達のために僕が今までに見つけた回避術をいくつか紹介したいです。

他にもこんなの知っているよ、とか、ちょっとその方法はどうなの、という方がいたらコメントしていただけると勉強になるので嬉しいです。

以下、padding, embedding, RNN, seq2seqなどは前提知識として話を進めます。



# 回避術
## 1. 最大系列長を指定しよう

NLPerが扱うデータは自然言語なので可変長。

そしてデータの中には大抵外れ値が紛れ込んでいて、とても短いものや、長いものもあります。

特に長いものをそのままテンソルにしてGPUに載せると一瞬でout of memoryになることがあります。

以前、最大系列長を指定しておらず、batchごとの最大長さに合わせて長さを変えるということをしていましたが、

実際に手元で実験しているときに、スペース10万個からなる単語がbatchに紛れており(原因は不明)、そのbatchになると必ずout of memoryになるケースがありました。

文を扱うときは単語の総数が系列長に相当するが、このように単語を文字に分解してCNNに入力するときは、単語の長さも肝になってきます。

事前に最大文長、単語長を調べる等の簡単な統計量の調査くらいはしてもいいかもしれないです。

（よく見るとpytorch公式でも同様のアドバイスがされていた）

余談ですが、文字レベルCNNを使うときは、最低限CNNのfilterの幅だけは長さが必要になるので、（単語の）最小系列長を指定する必要もあることに触れておきます。

## 2. Embedding layerだけCPUに載せる

どうしてもGPUに乗らなくて、batch size 2じゃないと計算できない・・・ということがありました。

その時の裏技として、embedding layerだけCPUに乗せ、embedded vectorからGPUに載せるというものがあります。

単語数万x埋め込み次元300となるとembedding layerがかなりの容量を占めるので、embeddingだけ目を瞑ってCPUでやるのはなかなか効果的でした。

## 3. Tie embedding

RNN言語モデルでは、まず単語をembeddingして、なんやかんやした後、最終的に線形変換後、softmaxして語彙次元のテンソルにする、を各stepでします。

この時に、embeddingのパラメータと線形変換のパラメータをshareすることで省メモリになります。

具体的にはこの論文を参照されたい。

[TYING WORD VECTORS AND WORD CLASSIFIERS: A LOSS FRAMEWORK FOR LANGUAGE MODELING](https://openreview.net/forum?id=r1aPbsFle) (ICLR2017)

## 4. Share embedding

3と類似手法になるが、seq2seqモデルを使う時に、encoderとdecoderの入力側のembedding layerに同じものを使う手法。

3, 4については
https://github.com/howardyclo/pytorch-seq2seq-example
に詳細な実装が公開されています。（僕が書いたものではないです）

実際使ってみた上での注意点として、メモリ上でパラメータはshareしていてもモデルを保存するときは別々のものとして扱われるっぽいので、省ストレージするにはさらに工夫が必要。

## 5. 不要になったテンソルはこまめにdelする

例えば、batch処理が終わってloss.backward()した後は、次のbatch処理を始める前に`del loss`した方がいい（かもしれない）(気がする)(気持ち的に)

## 6. Vocabulary selection

ラボの某先輩が教えてくれた論文で、テキスト分類するときは、実は1万も単語はいらない、なんなら1000単語でも十分な精度がでる話。

[How Large a Vocabulary Does Text Classification Need? A Variational Approach to Vocabulary Selection](https://arxiv.org/abs/1902.10339) (NAACL2019)

論文ではvariationalに単語を落としているけど、実用的には手動で設定してもいい気はする。

タスクの難易度によって必要な語彙数が違うのか気になる。

※6は実際に試したことはないです

# 最後に

advent calendarの投稿遅れてしまいましてすみません。

冒頭にも書きましたがVAEが好きです。

一緒に議論・論文読み会などできる方を探しているので、twitterでもメールでもしてくださるととても嬉しいです。 #VAE好きな人と繋がりたい 

よろしくお願いします。