OmniAICreator/Qiita-1.07M huggingface dataset:
FireAlpaca用ブラシスクリプトNgon概説

## FireAlpacaとは
[fireAlpaca.com](http://fireAlpaca.com)で配布されているフリーのペイントツールです。 
レイヤーや手振れ補正、PSD形式対応、3Dパースも可能なスナップ等の多彩な機能備えています。 
しかも _Windows/Mac両対応_ です。
## ブラシスクリプトはLua
* プリセットで鉛筆やエアブラシなどが用意されていますが、Lua言語によるAPI操作で様々な描画ができるブラシスクリプトに対応しています。
* 拡張子は.bsです。

## スクリプト標準関数
* main関数 
    マウスポインタが移動するごとに、座標およびペンの情報を引数に呼び出されます。
 
* param関数(1-10) 
    param1～param10を宣言することでブラシコントロールでパラメタを10個まで指定できます。
* use_base関数 
    基点を使うための宣言です。Ngonでは図形の中心に使います。

## 自作スクリプトNgon
ブラシスクリプト作成講座は敷居が高いので、絶賛放置中のブログで公開しているNgonというスクリプトを解説したいと思います。 
FireAlpacaは多機能なのですが、意外にも多角形を描画する機能が備わっていなかったので作成しました。
![Ngon.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/284224/e09d0550-1f76-1093-9b13-a0f492a153cc.jpeg)


## 動作概要
* 基点(デフォルトでは画面の中心)とmain関数が呼び出された時のマウスポインタの位置で多角形の中心と各頂点までの距離を決定
* パラメタ(正n角形)を頂点の数とする
* ベジェ曲線の開始 (bs_bezier_begin)
* 頂点の数だけ以下ループ
    * 三角関数を使って頂点の座標を算出
    * 直線の辺を追加(bs_bezier_l)
* 辺を追加し終えたら描画(bs_fill)
  
ベジェ曲線の使い方(曲線の開始、辺の追加、描画)がポイントだと思います。
ブラシスクリプトにもベジェ曲線の代名詞、制御点付きの曲線が用意されています。

## スクリプト概説

基点の使用と3つのパラメタを宣言 
パラメタの3つ数字は下限、上限、初期値です。
下限、上限が0,1の場合チェックボックスになります。

````lua
function use_base()
  return true
end

function param1()
    return "正ｎ角形", 3 , 8 , 3
end

function param2()
    return "線の太さ", 1 , 20 , 3
end

function param3()
    return "角度補正(×10度)", 0 , 12 , 0
end
````

main関数 
if not firstDrawの部分は前回処理のマウスポインタと今回とが近すぎる場合の
不要な描画を抑止しています。

````lua
function main(x,y,p)
	local size = bs_param2()
	local r,g,b = bs_forebg(p)

	if not firstDraw then 
		local  distance = bs_distance( lastDrawX - x, lastDrawY - y )
		if  distance < size * 2 then 
			return 0
		end 
	end 

 -- 基点が指定されていなければキャンバスの中心を基点にする
	local bsx,bsy = bs_base()
	if bsx == -1 then
		bsx = bs_canvas_width() / 2
		bsy = bs_canvas_height() / 2
	end
````
  
とんがりを上向きにするか下向きにするかを決めています。 
頂点が奇数の場合のみ意味があります。

````lua
 -- ペンと基点の位置関係で頂点(開始点)を決定
	local radOffset = 0
	local dist = y - bsy
	if dist < 0 then
		dist = dist * -1
		radOffset = 270
	else
		radOffset = 90
	end
````
  
角度の補正もあったほうがいいかなと思ったのですがどうかな。

````lua
	radOffset = radOffset + bs_param3() * 10
````
  
関数drawVertexを呼び出して辺を追加しbs_fillで描画します。 
1回目(末尾false)がベジェの開始で、 
2回目(末尾ture)がサブパスの追加です。ペンのサイズ分、頂点までの距離を縮めています。 
こうすることで輪郭のみ(中抜き)の描画を実現しています。  
今回のマウスポインタ座標を退避して終了。

```lua
	drawVertex(bsx,bsy,dist,radOffset,false)
	drawVertex(bsx,bsy,dist-size,radOffset,true)
	bs_fill(r,g,b,255 * bs_opaque())

	lastDrawX = x
	lastDrawY = y
	firstDraw = false
	return 1
end
````

あぁ三角関数を学ばなかったゆえにここで苦労することになります。 
cosでX座標、sinでY座標を算出しています。
i - 0って何だろう。

````lua
function drawVertex(bsx,bsy,dist,radOffset,isSub)
	local px = 0
	local py = 0
	local vertex = bs_param1()
	local rad = 360 / vertex
	local nrad = 0
	local px1,py1 = 0

	for i = 1,vertex,1 do
        nrad = (i - 0) * rad + radOffset
  
        px = bsx + dist * math.cos(math.pi * nrad / 180)
        py = bsy + dist * math.sin(math.pi * nrad / 180)
        
	    if i == 1 then
			if isSub == false then
				bs_bezier_begin(px,py)
			else
				bs_bezier_m(px,py)
			end
			px1 = px
			py1 = py
		else
			bs_bezier_l(px,py)
		end
	end
	bs_bezier_l(px1,py1)
	return 1
end

lastDrawX = 0 
lastDrawY = 0 
firstDraw = true
````
## 参考
[ブラシスクリプト仕様書](http://firealpaca.com/bs/)
AWS サーバ構築（ファイルサーバ）その１ 構成

社内で管理しているサーバーをAWSに構築する担当になったのでその時の調査メモを残します。
ここではファイルサーバーについて記述します。

## 要件

1. 可能な限り高い耐久性、可用性があること(100%は有り得ないという前提)
1. BCP/DR対策ができること
1. 社内サーバと比較しパフォーマンスが劣化しないこと

## 関連サービス

ファイルサーバーを構築するに当たって関連するサービスです。

### S3

99.999999999% (9 x 11) の耐久性を持つオブジェクトストレージサービス。安いが低速。

### EC2

説明省略

### EBS

仮想ディスクでEC2からアタッチ（マウント）して使用します。
EC2のサーバー内にも（インスタンスストアと呼ばれる）ストレージはあるが、EC2インスタンスで障害が発生したり、EC2インスタンスが停止するとデータが失われてしまうようです。

### EFS

共有ファイルストレージのフルマネージドサービスです。
EBSは複数のEC2からアクセスすることができませんが、EFSは可能です。NASのイメージです。
Linux限定です。

### FSx for Windows

Windowsでネイティブ接続できるEFSです。2019年3月から東京リージョンで使用可能になったようです。とても惹かれますが、情報がまだ少ないです。

[Amazon FSx for Windows File Server がアジアパシフィック (東京) リージョンで利用可能に][1]

### Storage Gateway

S3をファイルストレージとして使用する場合、EC2から直接アクセスできるようにするサービスです。

## SLAと責任共有モデル

AWSには責任共有モデルというものがあり、AWSとユーザーで可用性を担保するという考え方で運用されます。
SLAには気を抜くと読み飛ばしてしまいそうな条件があるので、要熟読です。とてもわかりにくい印象です。

|サービス|SLA可用性| AZ |備考|
| --- | --- | --- | --- |
| S3 | 99.9% | MultiAZ | |
| EC2 | 99.9% | SingleAZ | __「地域（Region)使用不能」__の状態になった時間（単位は分）の割合 |
| EBS | 99.9% | SingleAZ | |
| EFS | 99.9% | MultiAZ | |

### 稼働率別停止時間

99.99%といっても、もし連続で止まったら業務で問題になるレベルです。そのため、マルチAZ配置、バックアップを別リージョンに保存するようにします。

- 99.95％  
4.38 時間/年、21.9 分/月停止
- 99.99%  
52.56 分/年、4.38 分/月停止

### 構成１

AWSのサイトにある構成例です。これでも問題ないとは思いますが、EC2が単一障害点になっているので要件を満たせないと判断しました。

![kousei1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/29324/245b2c6f-4894-b606-98f3-629a773a85e3.png)

[ファイルサーバーのためのクラウド構成とお見積り例][0]

### 構成２

EC2をコールド、または、ホットスタンバイします。ストレージはEFSです。これで２つのサーバでファイルが同期され、EC2が冗長化されます。

![AWS-EFS.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/29324/8e7890c5-1f42-d97b-90ff-b094177d2006.png)

## まとめ

今は構成２で進めています。
書きませんでしたが、Storage Gatewayを使いS3を使用する方法もあるようです。

[その２に続く][file-server-2]

## 参考

[AWS EFS の特徴を知る][2]
[Amazon S3についてまとめてみた][3]
[AWSでファイルサーバを構築する方法を比較してみた(EBS・EFS・S3)][4]

[0]:https://aws.amazon.com/jp/cdp/fileserver/
[1]:https://aws.amazon.com/jp/about-aws/whats-new/2019/03/amazon-fsx-for-windows-file-server-is-now-available-in-tokyo/
[2]:https://qiita.com/hiroakiyoshii/items/e5c9ce6f36c7d8f0590a
[3]:https://qiita.com/quwtoy/items/24c7ad604966f48393cc
[4]:https://chariosan.com/2018/11/03/aws_fileserver/
[file-server-2]:https://qiita.com/urushibata/items/a04acc2db35d6e0c4635#_reference-622fd48944289d790482
初心者僕「KotlinでAndroidプログラミングをしたい」1

#はじめに
最近、就活をはじめましたがとても面倒くさいなと思い、気晴らしにAndroidアプリをKotlinで作りはじめました。
何故Kotlinなのかって？流行りに乗ったからです。Javaでもいいですが、事始めということでKotlinという言語に触れてみます。この記事は初心者の備忘録程度に思って見守ってください。

#環境
OS : Windows 10
AndroidStudio 3.4　[ダウンロード](https://developer.android.com/studio/)はここから
森永〇菓　ラムネ
Bl〇ndy コーヒー

#プロジェクトを作ろう
上のツールバーから
[File] → [New] → [New Project]
を選択

するとこんなメニューが出てきます。
<img width="674" alt="NewPro.jpg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/167019/1c78b194-1b55-a2fb-48ef-76c9916d9149.jpeg">

初心者僕(どれがいいんだ......Empty Activityでいいか)　[Next]ポチッ


<img width="673" alt="Newpro2.jpg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/167019/7538ae42-82cd-efad-260f-20d7a026fd70.jpeg">

次はアプリケーションの名前を決めて、言語をKotlinに変えましょう。他の変更はしないでいいです。(いいはず)
※画像のエラーは気にしないでください。

[Finish]を押すと画面が遷移します。しばらく同期とビルドに時間が必要なのでコーヒーを飲んで待ちましょう。

テンプレートは画面にHello World!が表示されるようですね。これでAndroidアプリを作れます。

#次は？
**ちょっと待って勉強するから！**
次はボタンの配置などをやっていく予定です。初心者なので許してください。
というわけで次に機会がありましたら会いましょう。(そそくさと退散)
php-master-changes 2019-04-20

今日は typo の修正、Appveyor のビルド設定の微修正、ビルド時の kerberos 検出の pkg-config への移行、Mojave で iconv が検出されない問題の修正、ドキュメントの更新があった！

# 2019-04-20
## Fabien Villepinte: Fix typo in comments
- https://github.com/php/php-src/commit/baa9669392136632c8f4a014a8ae4706da4b2ce5
- [7.4~]
- コメント内の typo を修正

## petk: Update Git repository for Windows build tool kit
- https://github.com/php/php-src/commit/06fa35568e1b25640cf8fbcd150d01477390132f
- [7.2~]
- Appveyor のビルド設定で、php-sdk の取得元を修正

## hughmcmaster: Use PKG_CHECK_MODULES to detect the kerberos libraries
- https://github.com/php/php-src/commit/aba72ebf15ec5d8063e9f801f816d7f45f772840
- [7.4~]
- ビルドシステムで、kerberos の検出に PKG_CHECK_MODULES を使うよう修正

## Gabriel Rodrigues Couto: Fixed bug [#77011](https://bugs.php.net/bug.php?id=77011)
- https://github.com/php/php-src/commit/e28db2276b3d73bcdbf256bd7efffff3e8f874e0
- [7.4~]
- Mojave で iconv が検出されない問題の修正

## petk: Remove PHP_SETUP_KERBEROS m4 macro
- https://github.com/php/php-src/commit/caea088ac7971a22b453112f77a3131bdbeb3b58
- m4 マクロ PHP_SETUP_KERBEROS の削除
- pkg-config 移行で内容も単純化されたので直接使えばいいか、という

## petk: Update changelogs
- https://github.com/php/php-src/commit/a353d4c218c1b538a04272dadf98ebff4cb190f0
- [7.4~]
- UPDATING、UPGRADING.INTERNALS の更新
ラズパイ上のDockerでLIRC

Docker は初挑戦でいろいろ知らなかったのでメモ。
コンテナ側でlircdを使うなら、ホスト側のlircdは止めておかなきゃならなみたい。

症状としては、コンテナ側でサービスが動いていて、irsend list "" "" も応答を返しているのに、irsend SEND_ONCE でエラーになる。

```shell-session
$ service lircd status
[ ok ] lircd is running.

$ irsend list "" ""
light
aircon

$ irsend SEND_ONCE aircon off
hardware does not support sending
Error running command: Input/output error
```
docker-compose.ymlの設定は次のようなカンジ。

```config:docker-compose.yml
    privileged: true
    devices:
      - "/dev/gpiomem:/dev/gpiomem"
      - "/dev/lirc0:/dev/lirc0:rwm"
```
【今更聞けない】REST RESTfulってなに？

#RESTとは
Representational State Transfer (REST) の略称。
(リソースの表現可能な状態の転送）
ソフトウェアアーキテクチャのスタイルのひとつで、ロイ・フィールディングが考案

#ソフトウェアアーキテクチャ？
ソフトウェアの構築方式の事

#RESTの設計原則→RESTful
 - アドレス指定性
 リソースに対してアドレス指定可能なURIが用意されていること

 - インターフェース統一性
  httpメソッド(GET、POST、PUT、DELETE)を利用すること

 -  ステートレス性
  ステートレス「状態がない」
  状態管理はせず、やり取りされる情報はそれ自体で完結して解釈できること

 -  接続性
  情報の内部に、別の情報や状態へのリンクを含めることができること

#なぜRESTfulを使いうのか
 -  メリット
　・アプリケーションの中のリソースがURIで示せる
　・利用する開発者が容易になる
　・アクセスの集中に耐えやすい構造にできる
　・統合の相対的な容易である
　・インタフェースが固定されている為互換性の問題が発生しない
　・多様なアプリケーションを提供することができる。

 -  デメリット
　・実装ルールが統一されていない
　・メタデータ・スキーマ情報が提供されていない

#参考
https://qiita.com/TakahiRoyte/items/949f4e88caecb02119aa
https://qiita.com/NagaokaKenichi/items/0647c30ef596cedf4bf2
http://kageura.hatenadiary.jp/entry/2018/01/11/%E3%81%AA%E3%81%9C%E3%83%9D%E3%82%B9%E3%83%88REST_API%E3%81%8C%E6%B1%82%E3%82%81%E3%82%89%E3%82%8C%E3%82%8B%E3%81%AE%E3%81%8B%EF%BC%9F_REST_API%E3%81%8C%E3%82%AB%E3%83%90%E3%83%BC%E3%81%A7%E3%81%8D
とにかく複数のDockerコンテナを一括で扱いたい

CI/CDというキーワードを聞かない日がない今日この頃ですが、人力でのテスト方法が定着し、それを超える生産性が保証できないうちはチャレンジできない現場や、どうしても人間がテストを行わなくてはならない場面があります。

と知った風な口をききましたが、上記は私のケースで、ちょうど今、人力テストから自動テストへの過渡期にあり、両方のテスト方法が並存している状況にあります。
今回は、複数の人間がテストを行う場合に、気を使ったところを残していきます。

### テストの条件
- サーバの数が、WEBサーバ、APサーバ、DBサーバ、その他通信先サーバなど合わせて、８サーバあり、１サーバにつき１コンテナとなっています。
- テスターは、各自のPCにてテストする必要があルため、コンテナの操作を行ってもらう必要がありそうです。

### 複数のコンテナを簡単に扱いたい
テスターにdockerコンテナを使ったテスト環境を構築してもらうために、どのようにして各自のマシンに構築してもらうかを考えました。

- テスターがdockerコマンドを打つ。
- 上記コマンドが記述されたバッチファイルやシェルスクリプトを配布して、テスターはバッチファイル等を実行する。
- composeファイルを配布し、テスターはdocker-composeコマンドを打つ。

考えたというか、結局上から順にやった結果、docker-composeが一番スマートでした。
頭のいい人が考えたものは違います。

例えば、WEB-AP-DBの環境を起動する場合、下記コマンドで行えてしまいます。

```
docker-compose -f [composeファイル] up -d
```

これだけで、下記が行えてしまいます。

- WEB,AP,DBのイメージのpull
- 各イメージからコンテナの作成
- 決められたコンテナの起動順

テスターはdockerの事は意識せずにテストに専念できますね！
ここまで書きましたが、わざわざ書くような記事ではなかったかなとも思います。
Swift 4.2 で　UITextViewにPlaceHolderを実装する

# 初めに
これは、個人的な覚書です。

以下のclassを作り、UITextViewに継承させる。

```swift
//初めに定義する
@IBOutlet var Text: PlaceHolderTextView!

//定義されたTextに何を書くかここで決める。
Text.placeHolder = "ここが初めに初めに表示される"
Text.placeHolderColor = UIColor(red: 0.1, green: 0.1, blue: 0.1, alpha: 0.4)

```

以下のコードで、UITextViewに変更が加えられた際に、PlaceHilderに設定してあった文字が消えるようにしてある。

```swift
import UIKit

public class PlaceHolderTextView: UITextView {
    
    lazy var placeHolderLabel:UILabel = UILabel()
    var placeHolderColor:UIColor = UIColor.lightGray
    var placeHolder:NSString = ""
    
    required public init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)!
    }
    
    deinit {
        NotificationCenter.default.removeObserver(self)
    }
    
    override public func awakeFromNib() {
        super.awakeFromNib()
        
        self.changeVisiblePlaceHolder()
        NotificationCenter.default.addObserver(self,
                                               selector: #selector(textChanged),
                                               name: UITextView.textDidChangeNotification,
                                               object: nil)
    }

    override public func draw(_ rect: CGRect) {
        if(self.placeHolder.length > 0) {
            self.placeHolderLabel.frame = CGRect(x: 8, y: 8, width: self.bounds.size.width - 16 , height: 0)
            self.placeHolderLabel.lineBreakMode = NSLineBreakMode.byWordWrapping
            self.placeHolderLabel.numberOfLines = 0
            self.placeHolderLabel.font = self.font
            self.placeHolderLabel.backgroundColor = UIColor.clear
            self.placeHolderLabel.textColor = self.placeHolderColor
            self.placeHolderLabel.alpha = 0
            self.placeHolderLabel.tag = 1
            
            self.placeHolderLabel.text = self.placeHolder as String
            self.placeHolderLabel.sizeToFit()
            self.addSubview(placeHolderLabel)
        }
        
        self.sendSubviewToBack(placeHolderLabel)
        
        if(self.text.utf16.count == 0 && self.placeHolder.length > 0){
            self.viewWithTag(1)?.alpha = 1
        }
        
        super.draw(rect)
    }
    
    
    private func changeVisiblePlaceHolder() {
        if self.placeHolder.length == 0 || !self.text.isEmpty {
            self.placeHolderLabel.alpha = 0.0
        } else {
            self.placeHolderLabel.alpha = 1.0
        }
    }
    
    @objc private func textChanged(notification: NSNotification?) {
        changeVisiblePlaceHolder()
    }
}

```
全プログラマに捧ぐ！ Webお試し版の #ノートブック + #python  で手軽にプログラム実行結果を #Markdown スタイルで保存してみる

# Ref

[全プログラマに捧ぐ！図解「ノートブック」 - Qiita](https://qiita.com/hinastory/items/e179361ae806e8776c70)

# Enter

https://jupyter.org/try

# python を選ぶ

![image](https://user-images.githubusercontent.com/13635059/56466431-2656e880-644d-11e9-938b-23eba9d6077f.png)

# 暫く待つ

![image](https://user-images.githubusercontent.com/13635059/56466487-e17f8180-644d-11e9-8542-ac9c67cc44f7.png)

# こんな画面になる

![image](https://user-images.githubusercontent.com/13635059/56466438-44bce400-644d-11e9-89c0-cf74fbd54f7e.png)


# 再生ボタンを押す

![image](https://user-images.githubusercontent.com/13635059/56466442-50a8a600-644d-11e9-9f13-fac7aa7aef41.png)

# いろいろ入力していく

Shift + Enter で実行できる様子

![image](https://user-images.githubusercontent.com/13635059/56466457-6cac4780-644d-11e9-851a-6dcd7139414b.png)

# Download AS Markdown を選ぶ

![image](https://user-images.githubusercontent.com/13635059/56466473-98c7c880-644d-11e9-9bda-4cd9634e33b3.png)

# こんな感じ

![image](https://user-images.githubusercontent.com/13635059/56466475-a9783e80-644d-11e9-8c7d-efb10e167d33.png)

# 以下、markdownそのまま磔


# Welcome to Jupyter!

This repo contains an introduction to [Jupyter](https://jupyter.org) and [IPython](https://ipython.org).

Outline of some basics:

* [Notebook Basics](../examples/Notebook/Notebook%20Basics.ipynb)
* [IPython - beyond plain python](../examples/IPython%20Kernel/Beyond%20Plain%20Python.ipynb)
* [Markdown Cells](../examples/Notebook/Working%20With%20Markdown%20Cells.ipynb)
* [Rich Display System](../examples/IPython%20Kernel/Rich%20Output.ipynb)
* [Custom Display logic](../examples/IPython%20Kernel/Custom%20Display%20Logic.ipynb)
* [Running a Secure Public Notebook Server](../examples/Notebook/Running%20the%20Notebook%20Server.ipynb#Securing-the-notebook-server)
* [How Jupyter works](../examples/Notebook/Multiple%20Languages%2C%20Frontends.ipynb) to run code in different languages.

You can also get this tutorial and run it on your laptop:

    git clone https://github.com/ipython/ipython-in-depth

Install IPython and Jupyter:

with [conda](https://www.anaconda.com/download):

    conda install ipython jupyter

with pip:

    # first, always upgrade pip!
    pip install --upgrade pip
    pip install --upgrade ipython jupyter

Start the notebook in the tutorial directory:

    cd ipython-in-depth
    jupyter notebook


```python
print(1)
```

    1



```python
print("OK!")
```

    OK!



```python
OWWWW
```


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

    NameError                                 Traceback (most recent call last)

    <ipython-input-3-63b91ee5210e> in <module>
    ----> 1 OWWWW
    

    NameError: name 'OWWWW' is not defined



```python

```


# Original by Github issue

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








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
NOIDでAlexaスキルを始めてみた

技術書典にて見つけた[NOIDで始めるAlexaスキル ](https://booth.pm/ja/items/1318607)を試してみた。

# NOIDとは？
https://www.noid.ai/help
<img width="569" alt="2019-04-21_16h16_02.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106639/e472fb91-3e3d-8cff-2935-0890939ad1cc.png">

# 初期設定
## サインアップ
https://service.noid.ai/signup/
メアドを登録して送信
メールが送られてくるので、アカウント情報を入力して登録完了させたら準備OK
※ただ、なんで会社名や住所の登録が必要なのかはよくわからない


## アカウント連携
NOIDのアカウントはできたけど、Alexaのアカウント(Amazon developerアカウント)とは紐づいていないので紐づける。

Amazon developerアカウントは以前作成しているので、アカウント作成は飛ばす。

右上のアカウントっぽいところから[AmazonIDを変更]を押下して、Amazon developerアカウントを連携。

これで準備はOK。

# アプリを作ってみる

とりあえずでランダムな反応を返すアプリを作ってみたけど、これベータ版公開はできないのかな？
保存したタイミングでAmazonの方にアップロードしているようなので、そっち側からベータテストをしたいメアドなどに送信することはできそう。
※自分の端末とかだったら、その辺はしなくても勝手に「開発」に追加されているはずなので遊べる

とりあえず作ってみて、ダッシュボードのテストでしゃべらせて、それを踏まえてNOID側で修正してってのが楽なのかも。

<img width="653" alt="2019-04-21_17h53_59.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106639/4d28e8a2-4fca-1018-ad68-e2d96dd74033.png">


## 感想１
ということでサクッと作れる。これは非常に便利なツールだわ。
Node.jsで試行錯誤していた部分を気にせず、コンテンツ側の改修に注力できるというのは非常にうれしい。
実機がなくてもダッシュボードで遊べるし。

ということで、この辺のSSMLを使ったことなかったので使って遊んでみた。

```
<prosody pitch="x-slow" rate="+10%"></prosody>
<break time="1s" />
<say-as interpret-as="interjection"></say-as>
```

が、「interjection」は思った以上に気持ち悪い。
たぶんAlexaのしゃべり方に慣れてきてしまっているので、中途半端すぎて気持ち悪いのかなと。


# 感想
改めて簡単だな。
一人で作って遊ぶ分には申請する必要もないから、これで量産して遊べるわ。
アイデアがないから量産しようがないけど。。。

これ、Lambda側のソースは手に入らないのかな。。
その辺ができるとこれでサンプルを作ったうえで、これでできない部分の改修ができたりするとさらにいろんなことができそうなんだけどなぁ。。

# その他：参考
＜参考というか著者＞
https://qiita.com/surumegohan/items/a4170515010554e229a0
https://surumegohan.hatenablog.com/entry/20181212/1544579595

＜効果音＞
https://maoudamashii.jokersounds.com/
特定インスタンスのUnit定義を上書きする

# TL;DR

`/etc/systemd/system/template_name@instance_name.service.d/xxxx.conf`を作成すればよい。

# 検証

CentOS 7.xではsystemd管理のデーモンについてlimitsを上書きする場合には`/etc/systemd/system/service_name.service.d/custom.conf`を作成すればよい[^1]が、[Tomcat8のマルチインスタンス化](https://qiita.com/ochiba/items/fb25dee6f75d659f1320)のようにテンプレートUnitを利用してインスタンス化した際、インスタンス毎にUnit定義を変更したい場合どうするかが気になったので検証。

* 対象: systemd-219-62.el7.x86_64[^2]

## 設定

設定変更前の状態は以下の通り。

```shell-session
# grep -e 'Max processes' -e 'Max open files' /proc/$(head -n1 /run/tomcat/tomcats-svr00.pid)/limits
Max processes             31227                31227                processes
Max open files            4096                 4096                 files
# grep -e 'Max processes' -e 'Max open files' /proc/$(head -n1 /run/tomcat/tomcats-svr01.pid)/limits
Max processes             31227                31227                processes
Max open files            4096                 4096                 files
```

RPMデフォルトでテンプレートUnitが定義されていた場合のカスタマイズも確認する意味で以下の設定ファイルを配置。

```ini:/etc/systemd/system/tomcats@.service.d/limits.conf
[Service]
LimitNOFILE=8192
LimitNPROC=8192
```

```ini:/etc/systemd/system/tomcats@svr00.service.d/limits.conf
[Service]
LimitNOFILE=65536
LimitNPROC=65536
```

systemdに読み込ませてそれぞれのインスタンスを再起動。

```
# systemctl daemon-reload
# systemctl restart tomcats@svr00.service tomcats@svr01.service
```

## 確認

svr00は`/etc/systemd/system/tomcats@svr00.service.d/limits.conf`の設定が反映されている。

```shell-session
# systemctl show tomcats@svr00.service | grep -e LimitNOFILE -e LimitNPROC
LimitNOFILE=65536
LimitNPROC=65536
# grep -e 'Max processes' -e 'Max open files' /proc/$(head -n1 /run/tomcat/tomcats-svr00.pid)/limits
Max processes             65536                65536                processes
Max open files            65536                65536                files
```

svr01は`/etc/systemd/system/tomcats@.service.d/limits.conf`の設定が反映されている。

```shell-session
# systemctl show tomcats@svr01.service | grep -e LimitNOFILE -e LimitNPROC
LimitNOFILE=8192
LimitNPROC=8192
# grep -e 'Max processes' -e 'Max open files' /proc/$(head -n1 /run/tomcat/tomcats-svr01.pid)/limits
Max processes             8192                 8192                 processes
Max open files            8192                 8192                 files
```

再起動しても上記の設定は維持されることを確認。


## 備考

`systemd-delta`とかで上書き状況を確認できるらしい。が、インスタンス用のはリストされなかった。残念。

```shell-session
# systemd-delta | grep tomcat
[EXTENDED]   /etc/systemd/system/tomcats@.service → /etc/systemd/system/tomcats@.service.d/limits.conf
```

[^1]: [systemd時代に困らないためのlimits設定](http://blog.father.gedow.net/2016/03/28/limits-of-systemd/)とかを参照
[^2]: systemdのバージョンが古いとLimitNOFILEの設定は効かないので注意 [BZ - 1351415](https://bugzilla.redhat.com/show_bug.cgi?id=1351415)
Jupyterのダークモード時に、matplotlibやseabornでグラフの目盛が見えない件の解決法

# 対象読者
以下の条件全てに合致している人を対象に記載しています。

- Chromeのダークモードを使用
- Jupyter-notebookもしくはJupyterLabを使用
- matplotlibもしくはseabornでグラフを描画している
- **軸の目盛が見えなくて困っている**

# matplotlibでの目盛の表示方法
### そのままグラフ描画
```python
import matplotlib.pyplot as plt
%matplotlib inline
plt.plot([1,2,4,3])
```
目盛が黒でみえません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/5e609bd6-1988-81b0-0c3f-84f276fd41db.png)


### 目盛に色指定
`plt.tick_params(colors='white')` を指定すると目盛が見えるようになります。

```python
import matplotlib.pyplot as plt
%matplotlib inline
plt.tick_params(colors='white')
plt.plot([1,2,4,3])
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/e9ca895a-4c2e-5e4b-9a11-464089793289.png)


# seabornでの目盛の表示方法
### そのままグラフ描画
```python
import pandas as pd
import seaborn as sns
df = pd.DataFrame([1,2,3,4])
sns.lineplot(data=df)
```
目盛が黒で見えません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/cb0028ea-9fec-168d-0d17-66c005ff8290.png)

### 目盛に色指定
`sns.set_style("darkgrid")` を指定すると背景色が白になり見えるようになります。
なお `sns.set_style("darkgrid")` はデフォルト設定なのでグラフの中身は何も変わりません。

```python
import pandas as pd
import seaborn as sns
df = pd.DataFrame([1,2,3,4])
sns.set_style("darkgrid")
sns.lineplot(data=df)
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/d796e48a-4006-a84b-896b-d3f11e0938ac.png)
MRマージ時に自動でデプロイプレビュー環境を閉じる[GitLab][Review Apps]

# 3行で概要
[前々回の記事](https://qiita.com/rena_m/items/d6b2d3f053d49e113fd6)では、デプロイプレビュー後に「ここにデプロイしたよ！」と教えてくれる設定の仕方を見ていきました。ですがこのままだと**デプロイプレビュー用に立てた環境が残ってしまう**ので、環境を止める設定が必要です。今回はその設定をしていきます:chipmunk:

# 自動で止める
手動でとめる設定もできるのですが、これまでの内容をスライドにまとめていた時に、[@tnirさん](https://twitter.com/tn961ir)に自動で止める設定もできるみたいですよ、と教えていただいたのでやってみました。**公式の説明ページは[こちら](https://docs.gitlab.com/ee/ci/environments.html#automatically-stopping-an-environment)です。** これも結構簡単なのでぜひやってみてください。

↓が`.gitlab-ci.yml`から関連する部分を抜き出したものです。

```yml:.gitlab-ci.yml
deploy_review:
    stage: deploy
    environment:
        name: review/${CI_COMMIT_REF_NAME}
        url: https://${CI_COMMIT_REF_NAME}.${APP_ID}.amplifyapp.com
        on_stop: stop_review
    only:
        - branches
    except:
        - master
    script:
        - aws amplify update-branch --app-id ${APP_ID} --branch-name ${CI_BUILD_REF_NAME}
stop_review:
    stage: deploy
    variables:
        GIT_STRATEGY: none
    when: manual
    environment:
        name: review/${CI_COMMIT_REF_NAME}
        action: stop
    script:
        - aws amplify delete-branch --app-id ${APP_ID} --branch-name ${CI_BUILD_REF_NAME}

```

それでは、ポイントごとにみていきたいと思います。
**1. ストップするjobは環境をデプロイするjobと同じstageに配置する**
　`deploy_review`も`stop_review`も`stage: deploy`になっています。

**2. デプロイするjobの環境に`on_stop`でストップするjobを設定する**
　これがないと、手動で「環境を止める」を押したとしてもストップするjobが実行されません。
　`on_stop: stop_review`で設定しています。

**3. jobを実行する条件を設定する**
　デプロイプレビュー自体はデプロイjobの実行タイミングを`only: merge_requests`で設定しても動くのですが、 **ストップするjobはデプロイjobの実行タイミングを**

```yml:
   only:
        - branches
   except:
        - master
```
**にしないと実行されませんでした。**ちょっとこのあたり、2つの条件の違いがよくわかっていないのでもう少し勉強しないといけなさそうです。

**4. ストップするjobのvariablesに`GIT_STRATEGY: none`を設定する**

だいたいこんな感じです。基本的には上記公式リンクのサンプルを参考にすれば問題なく動くと思います。このように設定して、MRマージ後にAWS ConsoleでAmplifyを見に行くときちんとデプロイプレビュー用に作成された環境が一覧から消えていることが確認できます。これにて完成です:sparkles: 

# 完結
というわけで、無事**MR作成→デプロイプレビュー環境を作成→MRに環境の情報を通知→マージ後に削除**という基本的な流れができるようになったため、デプロイプレビューシリーズは一旦完結します(シリーズ化してないけど)。
これを試したいがために自分のポートフォリオのレポジトリをGitLabにコピーしてきたのでついでに載せておきます。最終形態は[こちら](https://gitlab.com/renamoo/portfolio/blob/master/.gitlab-ci.yml)です。

# 残課題
とはいえまだ残課題もあります。現在私の`.gitlab-ci.yml`は、

▶︎create-job
1. amplifyにbranchを作成する
2. amplifyのjobをstartさせる

▶︎deploy_review
1. amplifyのbranchをupdateする

という構成になっていて、`create-job`には`allow_failure: true`を設定しています。
これはなぜかというと、MR作成後に新たなpushがあった場合、branchだけはすでにamplify上にあるのでエラーとなるためです。本当はamplifyのbranchのリストを取得して、そこにあればupdateだし、なければcreateという流れが良いのだと思いますが、私のyml記述スキルが足りないため実現できていません:pensive: ですので、もし最終形態としてご紹介した`.gitlab-ci.yml`を参考にされる方がいたらこの点ご注意ください。

最後まで目を通して頂きありがとうございました:snowman:
[C#] C#開発環境を整える。VSCode拡張機能や設定等

# はじめに

使っている拡張機能とその設定です。
すでに同記事多数ですが、あえてまとめてみます。
お目汚し失礼。


* [VSCodeの拡張機能 おすすめ(8/14更新)](https://qiita.com/EbXpJ6bp/items/4b87a092a3d6a0ecf595)
* [VS CodeでUnityプログラミングしてる僕が入れてる拡張機能](https://qiita.com/OrotiYamatano/items/4e2c8fc33416df7ec3c3)


# 使っているVSCode拡張機能

## [C#](https://marketplace.visualstudio.com/items?itemName=ms-vscode.csharp)

Microsoft製拡張機能です。
*.csファイルを開くと、「入れましょう」とおすすめされます。
コードハイライト、自動補完、定義へのジャンプ、参照の検索等々の機能があります。
必須です。

## [C# XML Documentation Comments](https://marketplace.visualstudio.com/items?itemName=k--kato.docomment)

`///`と入力すると、コメントの雛形を出力してくれます。
CodeでないほうのVisual Studioに備わっている機能です。

## [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)

スペルチェッカーです。英語スペルの間違いを指摘してくれます。
こういうのずっと欲しかった。

## ~~[C# FixFormat](https://marketplace.visualstudio.com/items?itemName=Leopotam.csharpfixformat)~~

__2019-6-2追記:インスタンス化時に{}が入れ子になっているとインデントが崩れるので、使うのをやめました。__

ソースコードをまとめて整形できます。
対象は、括弧、インデント、スペース、改行、usingです。
C#拡張機能では対応していない `[]` 前後のスペースや、改行した行のインデントに対応しています。
C#拡張機能整形機能とぶつかる部分があるので、以下の設定をしています。


```yaml:
# 開き括弧{を独立行に置きます。
csharpfixformat.style.braces.onSameLine: false
# 開き括弧(前にスペーを出力しません。
csharpfixformat.style.spaces.beforeParenthesis : false
```

## [.Net Core Test Explorer](https://marketplace.visualstudio.com/items?itemName=formulahendry.dotnet-test-explorer)

Visual StudioのTestウィンドウと同様のものです。
ソリューション/プロジェクトに含まれているテストを一覧できます。
コード中に[Run Test]リンクが表示されるので、あまり使ってないです。



# VSCode 拡張機能以外のもの

## [StyleCop.Analyzers](https://www.nuget.org/packages/StyleCop.Analyzers/)

C#コンパイラのアナライザに、コーディングスタイルチェックを追加します。
プロジェクトに追加すると、ビルド時に警告が出力されるようになりなす。

設定はxmlファイルとjsonファイルで行います。それぞれできる設定が分かれています。
jsonファイルの内容はこちらで説明されています。
https://github.com/DotNetAnalyzers/StyleCopAnalyzers/blob/master/documentation/Configuration.md

以下はxmlファイルの例です。`Rule`タグにある`Id`属性は、StyleCop Analyzerが出力するルールのIDです。ここでは2つのルールを無視するようにしています。

```xml:code-analyzer.ruleset
<?xml version="1.0" encoding="utf-8"?>
<RuleSet Name="My Analyzer ruleset" ToolsVersion="15.0">
    <IncludeAll Action="Warning" />
    <Rules AnalyzerId="StyleCop.Analyzers" RuleNamespace="StyleCop.Analyzers">
        <!-- 一行コメント先頭に要スペース -->
        <Rule Id="SA1005" Action="None" />
        <!-- 呼び出し時要this -->
        <Rule Id="SA1101" Action="None" />
    </Rules>
</RuleSet>
```

jsonファイルの例です。

```json:stylecop.json
{
  "$schema": "https://raw.githubusercontent.com/DotNetAnalyzers/StyleCopAnalyzers/master/StyleCop.Analyzers/StyleCop.Analyzers/Settings/stylecop.schema.json",
  "settings": {}
}
```

ファイルを作成したら、csprojファイルを編集して参照するようにします。

```project.csproj
  <PropertyGroup>
    <CodeAnalysisRuleSet>code-analyzer.ruleset</CodeAnalysisRuleSet>
  </PropertyGroup>

  <ItemGroup>
    <AdditionalFiles Include="stylecop.json" Link="stylecop.json" />
  </ItemGroup>
```
パッケージ名と App ID を個別に設定する

Monaca の Android や iOS のアプリ設定画面で設定する `パッケージ名` や `App ID` には、共通の `id` が使用されます。

すでに公式ストアへ登録しているアプリを Monaca で再開発するような場合、パッケージ名と App ID を個別に設定しなければいけないケースがあります。

このような場合、Monaca のアプリ設定画面では対応することができません。

パッケージ名と App ID を個別に設定する場合は、`config.xml` ファイルを使用します。

# パッケージ名と App ID を個別に設定する

Monaca のアプリ設定画面で設定したパッケージ名と App ID は、

`config.xml` - `widget タグ` - `id`

に設定されます。

パッケージ名と App ID を個別に設定する場合は、widget タグに下記の属性を設定します。

| OS | 属性 |
|:-----------|:------------|
| Android | android-packageName |
| iOS | ios-CFBundleIdentifier |

```xml:設定例
<widget xmlns="http://www.w3.org/ns/widgets" id="com.example.helloworld" android-packageName="com.example.android" ios-CFBundleIdentifier="com.example.ios" version="1.0.0">
```

widget タグに `android-packageName` と `ios-CFBundleIdentifier` を設定することで、ビルドの際に設定した値でビルドされるようになります。


# 注意点 1
android-packageName や ios-CFBundleIdentifier を個別に設定した場合でも、`id` 属性に値を設定する必要があります。

Android 版カスタムビルドデバッガーでは、ビルドの際に id 属性を使用しているため、id 属性がない場合は、正常にビルドを行うことができません。


# 注意点 2
現在、Monaca で提供している Cordova 7.1 用プロジェクトの config.xml は、プロジェクトのルートに 1 つだけ存在する形式になっています。

旧 Cordova バージョンのプロジェクトから Cordova 7.1 へアップグレードを行なっている場合、config.xml が複数存在しているケースがあります。

config.xml が複数存在している場合は、プロジェクトのルート以外にある config.xml を削除して、プロジェクトのルートにある config.xml に設定を行う必要があります。

プロジェクトのルート以外にある config.xml を削除した場合は、アプリ設定画面の設定が初期化される場合があります。

その場合は、再度、アプリ設定画面から設定を行い、設定を保存する必要があります。
vagrantでvirtulboxの設定その2

#やりたいこと
vagrantで作った仮想マシン（virtulbox）の設定をする。

基本、vagrantfileをいじって設定する。

#環境
バージョンを書いてなかったので追記。
virtulbox 6.0.4
vagrant 2.2.4
centOS 7.6.1810


#やったこと
**ポートフォワード**

以下の行のコメントを外す。

```
 config.vm.network "forwarded_port", guest: 80, host: 8880
```

これでホストOSからも作成したページにアクセス出来るようになる。
（アドレスのlocalhostのあとに8880を追加する。）



**共有フォルダの設定**
ホストOSとゲストOSでファイルのやり取りをするようなことがあるかもしれないので、共有フォルダを作っておく。

```
 config.vm.synced_folder "./data", "/vagrant"
```

書いてあるパスの前者がホストOS側、後者がゲストOS側の共有フォルダ。ホストOS側はvagrantfileがあるフォルダが基準になる。
設定後、dataフォルダにファイルを置いたら、無事ゲストOS側のvagrantフォルダに格納された。
試しにホストOS側で適当なテキストファイルを作ってみると、ゲストOSの共有先にも同じファイルが作成された。
これでコーディングはホストOSでやって、起動はゲストOSにしてもらう環境が整った。


**起動時の設定**
とりあえず仮想マシン起動時にApacheを自動起動シてほしいので、vagrantfileで設定。
一番下の方にあるprovisionを以下のように記載。

```
  config.vm.provision "shell", run: "always", inline: <<-SHELL
	sudo service httpd restart
  #   apt-get update
  #   apt-get install -y apache2
   SHELL
```

vagrantの設定というより、起動した時に指定したshellを叩いてねって感じ。
ここの設定を使えば他にも自動で起動してほしいサービスなんかも追加できそう。
普通に仮想マシン側の設定を変えてもいいけど、vagrantfileで環境を簡単にコピーできるのがvagrantのいいところだと思っているので、共通の設定はなんでもvagrantfileに書いておこうという方針。

一通りの設定が出来たので、確認。
ホストOSの共有フォルダ直下に以下のファイルを作成。

```php
<?php
  phpinfo();
?>
```

これがルートディレクトから閲覧できるはずなので、[http://ローカルホスト/ファイル名]にアクセスして、phpinfoの画面が出ればOK

細かいところは抜いているけど、これでとりあえず開発環境の土台が出来た。

今度はPHPのフレームワークであるLaravelの導入がしたい。
Angular : *ngIf文でワイルドカード使えなかたよ…

# Angular : *ngIf文でワイルドカード使えなかたよ…

下記のようなコード、urlに応じて表示を条件分岐したい時。

```html
<div *ngIf="route.url === '/page-top' || route.url === 'page-top/*'">
```

urlが`https://<ドメイン名>/page-top`か、もしくは`https://<ドメイン名>/page-top/<すべてのChildコンポーネント>`の場合、という条件文。

もう`https://<ドメイン名>/page-top`以下のChildコンポーネントはすべて条件に含めたいのだよ、ということでとっさに思いつくのがなんにでも一致を意味するワイルドカード'＊'だと思うのだけど。

<br />

使えません。

<br />


いちおうこんな方法がありました。

```html
<div *ngIf="route.url === '/page-top' || route.url.includes('/page-top')">
```

<br />

**router.url.include('...')**という構文。

<br />

以上。
ssocrで7セグメントディスプレイを認識する

# 概要
* いわゆる [7セグメントディスプレイ (7 segment display)](https://ja.wikipedia.org/wiki/7%E3%82%BB%E3%82%B0%E3%83%A1%E3%83%B3%E3%83%88%E3%83%87%E3%82%A3%E3%82%B9%E3%83%97%E3%83%AC%E3%82%A4) の写真から数字の画像認識をやりたくて、そのためのバイナリ [ssocr](https://www.unix-ag.uni-kl.de/~auerswal/ssocr/)を試すためのDockerfileです。
* なお、[google cloud vision](https://cloud.google.com/vision/docs/) と [AWS rekognition](https://aws.amazon.com/jp/rekognition/) もどちらも 7セグメントディスプレイの文字を 全く認識してくれません。このあたりはわざと認識しないようにしているのかな。

# 動機
世の中の計測器の数値（7セグメントディスプレイ）をwebカメラとかでネットワークにつないで送ることができればどんな計測器もIoTっぽくてわきるなーと思って試しました。

# ソース
https://github.com/junara/seven_segment_recognition_ssocr_docker/blob/master/README.md

# 使い方
## Dockerイメージのビルド

```
docker-compose build
```

## テストイメージを認識させる

 `./images/test_22.jpg` .
![test_22.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/124445/2df88841-ef9a-8c86-bd8d-ef605f0df292.jpeg)

```
docker-compose run ssocr
root@xxxxxxxx:/app# ssocr -d-1 ./images/test_22.jpg -D./images/temp.png -t 30
22
```

22と認識されました。成功です！
中間ファイル `./images/temp.png` をみるとたしかにいい感じに文字を区切ってくれているようです。
![temp.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/124445/9b531fac-c266-06cc-a74b-4bb46d6543cb.png)

# Dockerfile


Dockerfileは [How to recognize Seven Segment Displays content with ssocr (Seven Segment Optical Character Recognition) in Ubuntu 16.04](https://ourcodeworld.com/articles/read/741/how-to-recognize-seven-segment-displays-content-with-ssocr-seven-segment-optical-character-recognition-in-ubuntu-1604) を元に作成しました。

```Dockerfile
FROM ubuntu
RUN apt-get update -qq &&\
    apt-get install -y git libx11-dev libimlib2-dev
RUN git clone https://github.com/auerswal/ssocr.git &&\
    cd ssocr &&\
    make &&\
    mv ./ssocr /usr/local/bin/ssocr
RUN mkdir /app
WORKDIR /app
COPY . /app
```

必要なライブラリを落としてきて、makeするだけです。


# 所感
* 画像をうまく2値化できればかなり精度良く認識してくれます。
  * 7セグメントディスプレイの計測器を固定webカメラで移して、2値化処理条件をきりきりに詰められれば、ssocrはかなり有効だと思います
* ただ、一方、ちょっと光の加減が変わったりすると2値化ができず認識も失敗します （ [参考 ネットワークカメラを用いた学内消費電力可視化の試み - 鳴門教育大学](http://www.naruto-u.ac.jp/journal/info-edu/j09002.pdf) ）
  * 今回のテストイメージももうちょっといい感じのやつ `123` の画像を用意しようとと思ってのですが、光の加減でうまく端が2値化失敗するので、妥協してうまくいったものを使いました。

* 一方撮影条件が多様なら、7セグメントディスプレイを学習させるような方法を考えるべきだと思います 
  * 小数点を考えなければ、各数字毎に10枚程度の画像を適当に用意してやれば（ん？？どうやって）いいので、 
 [Cloud AutoML Vision Object Detection](https://cloud.google.com/vision/automl/object-detection/docs/)  でやってみようかと思います。
  * もしくは [AWS textract](https://aws.amazon.com/jp/textract/)がOCRに強そうなのでうまくやってくれないかなーと期待しています。

以上
パパ、APIってなあに？ 〜3歳娘がインターンに来た話〜


## 登場人物
**ワイ**・・・ワイ（やめ太郎）
**ハスケル子**・・・インターンの中学生
**娘**・・・ワイの娘（3歳）
**よめ太郎**・・・ワイの妻
**社長**・・・社長

## 月曜日、会社にて
ワイ「月曜の午前中は仕事する気が起きひんな」
ワイ「調べ物しとる**テイ**でQiitaでも読んどこか」

## そんなこんなで16時
ワイ「よっしゃ、**デイリートレンド全部**読み終わったで！」

ハスケル子「（**30件全部！？**）」

ワイ「なんや、読んだことあるような記事が多いな〜」

ハスケル子「（そりゃ、デイリートレンドは半分くらい**昨日と同じ記事が載ってる**から・・・）」

社長「（昨日読んだ記事**もう忘れてんのかい・・・！**）」
社長「（**コイツに給料払いたくねえ・・・**）」

ワイ「さあ、先週の会議の議事録でもまとめよか」

> **議事録**
弊社「本番環境では制約があるとのことですが、具体的にはどないな感じでっか？」
クライアントはん「それが大変でんねん」
・・・・・・・・・・・

ワイ「よっしゃ！ワイ記法だとスラスラ書けるから5分で書けたで！」

ハスケル子「（そんなので大丈夫なのかな・・・）」

娘（3歳）「パパ〜！」

ハスケル子「**！？**」

娘「娘ちゃん、来ちゃいました！」

ワイ「Oh...」
ワイ「来てもうたんか」
ワイ「怒られへんかな」
ワイ「まあ、**インターン**で来た子いうことにしておこか」

## 3歳娘のインターン開始
ワイ「ほな、一応インターンのテイを取らなあかんから、何か研修や」
ワイ「娘ちゃん、何を勉強しよか」

娘「うーんと、ちょうど知りたいことがあったの」
娘「パパ、APIってなあに？」

ワイ「カタカタカタカタカタカタカタカタカタカタ・・・**ッターーーン！**」
ワイ「**アプリケーション・プログラミング・インターフェース**や（ドヤァ・・・」

ハスケル子「（**ググった・・・**）」

社長「（APIの**3文字**を打つのに何でそんなにカタカタすんねん・・・）」

ハスケル子「（やめ太郎さんは**異様にタイポが多い**んです・・・）」

娘「パパ、すご〜い」
娘「じゃあ、その**インターフェース**ってなあに？」

ワイ「うーん・・・」
ワイ「せや！」
ワイ「ハスケル子ちゃん！」
ワイ「弊社でのインターンで学んだ成果を見せたってや！」

ハスケル子「と言うと・・・？」

ワイ「インターフェースとは何か説明してみてくれや！」

ハスケル子「はぁ・・・」
ハスケル子「（またそうやって逃げるんだ・・・）」
ハスケル子「（まあ、娘ちゃんの前でカッコいいパパでいさせてあげようかな・・・）」

## インターフェースとは
ハスケル子「娘ちゃん」
ハスケル子「インターフェースっていうのは英語で**境界面**とか**橋渡し**、そして**接点**って意味なの」

娘「そっかー」
娘「だから、人間とPCを繋ぐ**接点**であるマウスやキーボードの事を**ハードウェア・インターフェース**って呼んだりするんだね！」

ハスケル子「そうだよ！」

社長「（**どんだけ理解早いねん**）」

ハスケル子「他にも、エレキギターをパソコンに繋ぐための機器は**オーディオ・インターフェース**っていうしね」

娘「まさに**接点**って感じだねー」
娘「機器と機器を繋ぐ規格であるUSBも、**汎用インターフェース規格**っていうもんね」

ハスケル子「そうそう」
ハスケル子「じゃあ、アプリを操作するためのボタンとかのことを**ユーザー・インターフェース**っていうのは何故か分かる？」

娘「うーんと、アプリケーションと人間の**接点**となるのは、画面上にあるボタンとかそういうUI部品だから！」

ハスケル子「うんうん、そんな感じだね〜」
ハスケル子「あとはね、Googleマップをiframeタグで自分のサイト上に呼び出せる仕組み、あれもインターフェースなんだよ」

娘「最初に言ってた**アプリケーション・プログラミング・インターフェース**だね」
娘「GoogleマップというWebアプリケーションから簡単に情報を取得して利用するための**接点**だよね」
娘「弊社Googleは、Googleマップを簡単にご利用いただけるようにiframe APIをご用意いたしました！」
娘「みたいな」

ハスケル子「そうそう」
ハスケル子「Googleマップをもう少しカスタマイズしたい場合は、**JavaScript API**っていうのもあるよね」

## DOMもAPI
娘「じゃあさ、JSでページ上の要素たちを操作するための**Document Object Model**、通称**DOM**もAPI？」

ハスケル子「そうだよ！JavaScriptからhtml要素たちを操作できるようにするためにブラウザが用意してくれてるAPIだよ〜」

娘「JSプログラマーとhtml要素たちを繋ぐ**接点**だね」

## PHP等のinterface構文
ハスケル子「PHPとかでさ、**クラスが実装すべきメソッド**を定義する**interface**っていう構文があるけど、あれは何でinterfaceなのかな？」

娘「うーんと、クラスをnewして生成したオブジェクト達を連携させて仕事をさせるとき、オブジェクト同士はお互いの**メソッド**を実行しあうことで連携するから・・・」
娘「**メソッド**は、オブジェクト同士の**接点**・・・つまり**インターフェース**」
娘「だから、実装すべき**メソッド**を定義する構文の名前が**interface**なんだね！」

ハスケル子「すごーい！説明上手だね」

娘「えへへ」

## インターンしてみた感想
娘「楽しかった！」

ハスケル子「わたしも！」

社長「なんていうか・・・」
社長「娘ちゃん、**採用してええ？**」

ワイ「**ファッ！？**」

社長「年収**600**出すで？」

ワイ「え、それはさすがに・・・」
ワイ「**700でどうでっか？**」

よめ太郎「**金額交渉すな！**」
よめ太郎「しかも何で**お前より年収高い**ねん！」

**〜おしまい〜**
Ubuntu デスクトップ環境を手に馴染む感じにする

# デスクトップ環境の差異が辛い
Windowsを常用してるとUbuntuを使った時にデスクトップ環境の違いに多少は頭の切替え負荷が生じます。過度なカスタマイズは環境再構築が大変になるためデフォルト至上主義ですが、限度を超えたものは変えたい。ここでは次の部分を変えました。

* Alt+Tabの反応が鈍い  
  → 遅延0秒に変更
* Alt+Tabの切替えがWindow単位になっていない  
  → Window単位に変更
* アプリ一覧でのESCキーを押しがデスクトップではなくオーバービューなのは変  
  → デスクトップに戻るよう変更
* Nautilusのコンテキストメニューに「VSCodeを開く」が欲しい  
  → 「VSCodeを開く」を追加

# 必要アプリをインストール
Ubuntu ソフトウェアセンターからインストール。一部PPA。GNOME拡張機能はインストールすれば勝手に有効化されます。

- **ESC to close overview from applications list**  
  GNOME拡張機能。アプリ一覧でESCキーを押した際の挙動変更に使用
- **Alt-Tab Switcher Popup Delay Removal**  
  GNOME拡張機能。Alt+Tabの遅延0秒化に使用
- **dconf エディター**  
  GNOMEのパラメータ編集ソフト。Alt+Tabの挙動を変えるのに使用
- **filemanager-actions**  
  ファイル/ディレクトリのコンテキストメニュー編集ソフト。「VSCodeを開く」追加に使用。  
  PPA: https://launchpad.net/~daniel-marynicz/+archive/ubuntu/filemanager-actions

# GNOMEを設定する
switch-windows に Alt+Tab を割当てるのが肝。
switch-applications も Win+Tab に割当てると機能自体は案外便利 (SuperはWinキーのこと)。

| key                                                   | value             | desc                 |
|-------------------------------------------------------|-------------------|----------------------|
| /org/gnome/desktop/wm/keybindings/switch-applications | \['\<Super\>Tab'\] | 切替えがアプリ単位   |
| /org/gnome/desktop/wm/keybindings/switch-windows      | \['\<Alt\>Tab'\]   | Winお馴染みのAlt+Tab |

# 「VSCodeを開く」を追加
filemanager-actions を起動し、以下の設定を行います。

## 初期設定を行う
既定ではメニューに「FileManager-Action」が新設され、その中に追加した項目が格納されます。追加項目が少数であれば邪魔なのでメニューのルートに直接追加されるようにします。

1. メニューから \[Edit\] - \[Preferences\] をクリック
2. Nautilus menu layout の 「Create a root 'FileManager-Action' menu」 をチェックオフ
3. Preferences の \[OK\] を押して設定確定

## メニューアイテムを追加
ツールバーから \[Define a new action\] をクリック。以下を設定。

- Action
    - Display item in selection context menu をチェックオン  
      → 要素に対するメニューを表示
    - Display item in location context menu をチェックオン  
      → Nautilusの要素周囲の背景エリアに対するメニューを表示
    - Context label: VSCodeを開く
- Command
    - Path: /usr/bin/code (VSCodeのパス)
    - Parameters: %b (開く際のファイル名)
    - Working directory: %d (開く際の作業ディレクトリ)

# 完了
以上の変更で、思考が途切れる事を回避できる程度には馴染む使い勝手にできた。
react-helmetで画像をpreloadする

メモ書きです。

画像を先に読み込みたい時について。

以下のようなコンポーネントを作る。


```javascript
import * as React from 'react'
import { Helmet } from 'react-helmet'

interface ImagePreloaderProps {
  images: string[]
}

const ImagePreloader: React.FunctionComponent<ImagePreloaderProps> = ({ images }) => (
  <Helmet>
    {images
      .filter(item => item)
      .map((image, index) => (
        <link rel="preload" href={image} as="image"/>
      ))}
  </Helmet>
)

export default ImagePreloader
```

https://github.com/nfl/react-helmet

今やっているやつが、スライドを見せていくような感じのもので、そのスライド中に含まれる画像の読み込みが通信環境によって遅い時があった。

予めそのスライドのコンテナとなるコンポーネントで、このコンポーネントを呼び出すことでpreloadすることができた。

通信環境の再現はchromeのデベロッパーツール:Networkタブでできる。 `Slow 3G` 状態でも問題なく読み込めることを確認できた。
macOSでChainerCV使ってみる

```.sh
brew install pyenv
CFLAGS="-I$(brew --prefix readline)/include \ 
  -I$(brew --prefix openssl)/include \
  -I$(xcrun --show-sdk-path)/usr/include" \
   LDFLAGS="-L$(brew --prefix readline)/lib \
  -L$(brew --prefix openssl)/lib" \
   PYTHON_CONFIGURE_OPTS=--enable-unicode=ucs2 \
   pyenv install 3.6.6

vi ~/.zshrc
source ~/.zshrc

pyenv shell 3.6.6

pip install numpy chainercv matplotlib opencv-python
```

このページから１つ目のサンプルと画像をダウンロードする。
https://chainercv.readthedocs.io/en/latest/tutorial/detection.html

最初の行に以下を追記して実行

```
import matplotlib as mpl
mpl.use('TkAgg')
```

実行された

<img width="642" alt="Screen Shot 2019-04-21 at 17.09.27.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/481/5043736f-a2ce-732f-f5ef-39aa4d3d438c.png">
ransack覚書

### Ransackを使って複数単語に対してのAND検索を実装する。

- Ransackはhashの形で変数を渡すことで、複雑な条件検索が可能になる。
- ストロングパラメーター後のやり方。
- 例えば、titleに「カフェ」 regionに「北海道」と入っているBlogモデル、あるいはその逆のものだけをarticleとして表示させる場合に使える。
機械学習の門戸を叩きに行く

# はじめに
AIブームに完全に乗り遅れてしまったので、それ相応のスピードで機械学習全般を学習していこうと思います。
完全にプライベートとして行いますが、炎上ＰＪに所属してもやったろう！という想いです。

というわけで、まずはゆるゆるの計画を立てようと思います。


# 目標とする姿
- まずはKaggleで「普通」レベルになる。
 - 普通レベルの難度を理解していません…。
- 会社の同じＰＪで胸を張って１番の理解者となる。
 - 異動先のレベルは未知

# ストーリーとスケジュール
 1. Coursera でMachine Learning の学習（～５／１９）
 2. Kaggleに挑戦その１（５／２７）
 3. 東大松尾研のデータサイエンティスト育成を自習（６／１５）
 4. Kaggleに挑戦その２（６／３０）


# 背景
自分を追い込むためにも、今までも時間はかけて学んでたことを記載しておきます。
ここまで準備しているのなら、きっと楽勝でしょう！

 - 理系大学院を卒業
  - 行列計算は得意
  - 確率統計は苦手意識あり
 - 機械学習や深層学習の本を独学で学習
  - まったくの素人ではなく概論は理解済み
  - だけど、体系的には学習できていない
 - プログラム経験あり
  - Pythonは本当に少しだけ実装したことあり
  - 人生で一番簡単だったPython3検定は合格済み


# リファレンス
本当に刺激になります。

- [機械学習をゼロから1ヵ月間勉強し続けた結果](https://qiita.com/junichiro/items/3457e33e502086a200f1)
- [東大松尾研のデータサイエンティスト育成/ Deep Learning基礎講座を自習する]
(https://qiita.com/tomo_makes/items/5d6f5860bb793e3b354a)

-------------
さて、数か月後にはどのような状況か楽しみです。
[Unity de Spine] 落下から着地時の補間アニメーションからループアニメーションへのつなぎ方

個人開発でSpineを使うかもしれないので備忘録

Spine SDK version: spine-unity-3_7-2019-04-18
Unity version: 2018.3.2f1


## 補間有りと無しの違い

Exampleでは高いところから落下するとしゃがみアニメーションに遷移します。
補間ありの方は落下からしゃがみへの遷移するアニメーションがありますが無い方は落下からしゃがみアニメーションにすぐに切り替わっています。

### 補間アニメーションあり

https://youtu.be/nBEmVMdij5Q

### 補間アニメーションなし

https://youtu.be/ShOrilYra34

## 補間アニメーションありの実装の仕方

Spineでは連続したアニメーションの再生ができる為、次のようにすると補間アニメーションの後に通常のアニメーションが再生されるようになります。

```csharp
skeletonAnimation.AnimationState.SetAnimation(0, transitionAnimation, false);
skeletonAnimation.AnimationState.AddAnimation(0, nextAnimation, true, 0);
```

##　補間無しの場合

補間無しの場合はこんな感じでやればとりあえず出来ます。

```csharp
var trackIndex = 0;
var isLoop = true;
skeletonAnimation.AnimationState.SetAnimation(trackIndex, nextAnimation, isLoop);
```

## 参考

https://github.com/pharan/spine-unity-docs/blob/master/spine-unity-animation.md
PHPのダブルクォーテーションとシングルクォーテーションの違いを理解する

#近況報告

エンジニア転職成功しました。YouTubeもはじめました。

https://www.youtube.com/channel/UCcXQG8lu_EdyP2Cbhtz1bcA


こんにちは。業務でPHPを扱いCRMをメインに開発している[YUUKI](https://twitter.com/bitcoinjpnnet)です。

PHPで書かれたコードを見ていると、文字列を囲む際に

- ダブルクォーテーション（""）
- シングルクォーテーション('')

の２つを使っているパターンがありますね。

この２つの違いを明確に理解するために、
PHPにおけるダブルクォーテーションとシングルクォーテーションの違いを解説します。

##文字列出力では同じ内容が出力されるが、動作速度が違う

例えば「この野菜はトマトです」という文字列を出力する場合

```php5
<?php

//　ダブルクォーテーション
echo "この野菜はトマトです";
echo '<br>';

// シングルクォーテーション
echo 'この野菜はトマトです';


```

出力結果

![スクリーンショット 2019-04-21 16.09.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244639/288f3748-c6c4-00b7-7d21-d00dd5dfbcff.png)


出力される内容は同じですが、出来ることに差があります。

例えば、ダブルクォーテーションで囲んだ文中に変数を組み込むと、変数のデータが表示される（変数展開を行える）点が、シングルクォーテーションと異なります。

また、変数の変換処理を行うため、動作処理速度がシングルクォーテーションと比べると遅くなります。

動作処理速度には

- **シングルクォーテーション＞ダブルクォーテーション**
- **約1.2倍〜2倍**

の差があるようです。

##変数展開の場合はダブルクォーテーション""を使う

変数展開とは、**文字列の中に変数の値を組み込むこと**を言いますが、
echoで出力時は**ダブルクォーテーション””を使わないと変数展開が適用されません。**

```php5
<?php

$testDouble = "tomato";
$testSingle = "paseri";

// ""で変数の中身を表示（変数展開を適用する）
echo "この野菜は{$testDouble}です。";
echo '<br>';

// ''で変数名をそのまま表示（変数展開が適用されない）
echo 'この野菜は{$testSingle}です。';
echo '<br>';
```

出力結果

![スクリーンショット 2019-04-21 17.28.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244639/7f59f611-0fbd-456c-8a7a-9682816bf214.png)



要は、

- 変数の中身を表示したい場合はダブルクォーテーションを使う
- 変数名を直接表示したい場合はシングルクォーテーションを使う


ってことですね。


##ダブルクォーテーション""とシングルクオーテーション""をそのまま表示する

""と''を文字列としてそのまま出力したい場合は、**変数に文字列を以下のように代入します。**

```php5
<?php

$testDouble = '"tomato"';
$testSingle = "'paseri'";

// ""をそのまま表示
echo $testDouble;
echo '<br>';

// ''をそのまま表示
echo $testSingle;
echo '<br>';
```

出力結果

![スクリーンショット 2019-04-21 17.30.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244639/7f395619-0d2d-635c-e850-8453117dac6b.png)


要は

- ダブルクォーテーションを表示したい場合は、変数代入時に''で囲む
- シングルクォーテーションを表示したい場合は、変数代入時に""で囲む


ってことですね。


##まとめ

- シングルクォーテーションとダブルクォーテーションでは動作速度が違う
- シングルクォーテーションの方が速く、ダブルクォーテーションの方が遅い
- 変数展開を用いる場合はダブルクォーテーションで囲む
- ""と''をそのまま表示する場合は、外側を''又は""クォーテーションで囲む
【今更聞けない】httpって結局なに？

#httpとは
HyperText Transfer Protocol(ハイパーテキストトゥランスファープロトコル)の略。
webブラウザーがwebサーバーから情報を取得（送受信）する際に使用するプロトコル（通信規格）の事。

#httpsとは
HTTP over SSL の略
機密性や安全性を高めたい場合にSSLを導入したプロトコルの事。

#「webブラウザ」「webサーバー」「プロトコル」ってそもそも何？

-  _webブラウザ_
 パソコンやスマートフォンでインターネットに接続し、ニュースやブログ記事、
 インターネット上のシステム（クラウドサービス）などを閲覧・操作するときに
 使用するアプリケーションの総称。
 （例：GoogleChrome、InternetExplorer、Safari　など）

- _webサーバー_
 Webブラウザなどのクライアントソフトウェア（Webクライアント）からの要求に応えて、
 自身の管理するデータなどを送信する。
 htmlファイルや画像ファイルなどWebページを構成するファイルの送信が主な用途

-  _プロトコル_
 webブラウザ、webサーバーとの間で、HTMLで記載された情報をやりとりするための仕組み

#つまり
ホームページのファイル（テキストや画像）を受け渡しするときに使う通信規格
<img width="1081" alt="スクリーンショット 2019-04-21 16.39.22.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391718/83596c0e-0756-6ea9-0e23-7f56299889cd.png">


#railsでよく使うもの
|メソッド|機能|例|
|:--|:--|:--|
|GET |サーバーからブラウザに情報を返すのみ |サイト閲覧のみ|
|POST|ブラウザからサーバーに情報を送信し、サーバーに情報を保存|記事を投稿|
|DELETE|ブラウザからサーバーに情報を送信し、サーバーの情報を削除|投稿した記事を削除|
|PATCH|ブラウザからサーバーに情報を送信し、サーバー内の情報を置き換える|投稿した記事を編集|
MySQL監視用の簡易スクリプト

bashを用いたMySQL監視用の簡易スクリプトです。
Zabbixなどの監視サービスがない環境で利用できます。

###できること
・MySQLサービスの死活監視と指定DBへの接続監視。

###前提
・bashを利用できること
・出力したログの監視はSwatch等で実施する。

###スクリプト

```bash:mysql_monitor.sh
#!/bin/bash
 
############################################
# 変数定義
############################################
#本処理用ログファイル
MYSQL_LOG="/var/log/mysql_check.log"

############################################
# 処理
############################################
echo "`date`" >> $MYSQL_LOG

##MySQL死活監視
mysqladmin ping -h "MySQLサーバのIP" -u hogehoge -phogehoge  2>&1 | sed -e "/Using a password on the command line interface can be insecure/d" >> $MYSQL_LOG 2>&1
##MySQL DB接続監視
mysql -h "MySQLサーバのIP" -u hogehoge -phogehoge "DB名" -e "exit" 2>&1 | sed -e "/Using a password on the command line interface can be insecure/d" >> $MYSQL_LOG 2>&1

exit
```
【初心者向け】Apacheでgzip

# gzipとは.
>gzip（ジー・ジップ）は、データ圧縮プログラムのひとつ、およびその圧縮データのフォーマットである。「GNU zip」の略。
wikipedia:https://ja.wikipedia.org/wiki/Gzip

#手順
httpd.confを下記のように設定。
```/etc/httpd/conf```にある
cp でバックアップ取っておいた方が安全
terminal
```cp httpd.conf httpd.conf.20190421```

設定したファイルはこちら
httpd.conf

```
LoadModule deflate_module modules/mod_deflate.so

<IfModule mod_deflate.c>
      SetOutputFilter DEFLATE

      AddOutputFilterByType DEFLATE text/plain
      AddOutputFilterByType DEFLATE text/html
      AddOutputFilterByType DEFLATE text/xml
      AddOutputFilterByType DEFLATE text/css
      AddOutputFilterByType DEFLATE application/xhtml+xml
      AddOutputFilterByType DEFLATE application/xml
      AddOutputFilterByType DEFLATE application/rss+xml
      AddOutputFilterByType DEFLATE application/atom_xml
      AddOutputFilterByType DEFLATE application/javascript
      AddOutputFilterByType DEFLATE application/x-javascript
      AddOutputFilterByType DEFLATE application/x-httpd-php
</IfModule>
```

apache再起動
code:httpd.conf
```service httpd restart```

おわり

## 注意事項
###.htaccessではなくhttpd.confで設定する理由
>httpd.conf は apache httpd の起動時に１回処理されるだけ
> - .htaccess はリクエストがあるたびに読まれなおす
> ということです。 https://httpd.apache.org/docs/2.2/ja/howto/htaccess.html には
https://ja.stackoverflow.com/questions/37381/apache-mod-deflate-の設定方法の違いについて
http://www.hack-log.net/entry/2015/05/04/183854

###gifや画像ファイルをgzipしてはいけない。
容量の大きいファイルやそもそも最初から圧縮されているファイルを圧縮すると余計な負荷がかかり、逆にレスポンスが悪くなる可能性がある。

ちなみに
ファイル権限の確認
https://qiita.com/shisama/items/5f4c4fa768642aad9e06
PHPでファイルのアップロード、ダウンロード

#やりたいこと
PHPでファイルのアップロードとダウンロードを実現する。


**アップロード**
HTML側でinputタイプをfileに指定。

```html
<form action="upload.php" method="post" enctype="multipart/form-data">
 <input type="file" name="image">
 <input type=submit value="ファイル送信">
</form>
```

選択されたファイルは受け取り側の$_FILESで受け取るので、この中身を参照して処理する。

・ファイル存在確認
`isset($_FILES['image'])`
・アップロードされたファイルと、一時保存されたファイルが一致するか確認
`is_upload_file($_FILES['image']['tmp_name'])`
・一時保存されたファイルを指定のフォルダへアップロード
`move_upload_file($_FILES['image']['tmp_name'],"保存するファイル名")`

おそらく一番シンプルな例だけど、ひとまずこの方法で実現した。



**ダウンロード**
ダウンロードするファイルパスと、ダウンロード時にデフォルトでつくファイル名の２つを指定する。

```php
$filepath = "ダウンロードするファイルパス";
$filename = "ダウンロー時のファイル名";

header("content-type: application/octet-stream");
header("content-disposition: attachment; filename={$filename}");
header("content-length: ".filesize($filepath));
header("connection: close");
readfile($filepath);
```


他にも色々設定したり気をつけないといけないことはあるはずだけど、ひとまずこの方法で実現。
Google Cloud Speech API を使った音声の文字起こしの便利メモ

#0.　はじめに
Google Cloud Speech APIを利用して音声の文字起こしをする際の便利なリンクをまとめておく。

#1. 素材準備
Google Cloud Speech APIを利用するためには、Flac形式の音声ファイルが必要である。
以下の便利なオンラインツールを利用すると便利。

##ビデオ編集
https://online-video-cutter.com/ja/

##オンライン音声編集
https://audiotrimmer.com/

#2. GCSにアップロード
音声ファイルはGCSなどにアップロードされている必要がある。
手動でもよいがプログラム化できると便利
https://journal.lampetty.net/entry/upload-file-to-gcs-without-gcloud-command

#3. Google音声認識を利用する便利なチュートリアル
##全体チュートリアル
https://qiita.com/knyrc/items/7aab521edfc9bfb06625

##ハマりどころまとめ
http://note103.hateblo.jp/entry/2018/07/23/115930#%E3%83%8F%E3%83%9E%E3%82%8A%E3%81%A9%E3%81%93%E3%82%8D

#4. メモ　Google Cloud Speech APIで現在できないこと
・日本語の場合、句読点がつかない