OmniAICreator/Qiita-1.07M huggingface dataset:
お役立ちGitHubの使い方

有益なGitHubの使い方のストックが溜まってきたので、以下まとめてみた。

# 1. awsome <言語orフレームワーク名> でググって表示される有名なリポジトリ一覧を見る方法
例えば、`awsome golang`でググると、以下のような検索結果一覧が表示される。検索結果の中に、awsome~~と表示されたGitHubへのリンクが見つかれば、そのページに移動する。
![858db8433cf83a48197636a8b88d5214.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/739a4e14-16b9-4ef8-e9f3-34e1df7247ba.png)

表示されたGitHubのページのReadmeを見ると、各カテゴリの有用なリポジトリ一覧が確認できる。

※こちらは、OAuth系のリポジトリ一覧
![079c613cdfb356593b3529ca23c387dd.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/6e2e2f73-0b0f-0980-8f7b-62d386081216.png)
※こちらは、ORM系のリポジトリ一覧
![05676cd23820627ad4c85b7bb9ffa9a6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/512d4d58-e456-9438-a1a4-ae3bc9d13419.png)

自分が実装しようとするシステムに必要なツールの中で、以下の項目を確認して利用するかどうか決める。
・`スター数が多い(最低でも500以上は欲しい)` 
・`メンテされている(長くても数ヶ月単位で、プルリクが出てマージされている)` 
・`ある分野でスター数が少ない場合はWatch数が多いかを代わりに見る` 

# 2. 特定の言語やライブラリを使用していたり、スター数が500以上などの条件で参考になるリポジトリを探す方法
端的に言うと。Advanced Searchを利用する。
https://github.com/search/advanced

・Rubyで書かれた言語のコードを探したい
・MITライセンスが良い
　　　　　・
　　　　　・
　　　　　・
などなど、色々な条件でGitHubリポジトリを探せる。
何個かリポジトリを見つけたら、書き方が分からないライブラリーや綺麗なソースを見て参考にできる。
![GitHub advanced searh.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/07d72487-4b97-31c2-4a0e-f96b2e325f35.png)

# 3. 対象リポジトリ内の該当ファイルを即調べて過去の修正履歴を見る方法
どこでも良いが、GitHub上でキーボードの`T`を打つ。
![bff1d15c020716e46ab462b526b54181.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/a79b136e-d982-f82f-ed10-e16971e00919.png)
すると、ディレクトリの検索画面になる。
キーボードの`↑`と`↓`でも検索しても良いし、直接入力も可能。
![2be90a599048971f8f419d43dc81f160.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/24923695-3244-6b42-7134-c5723f447dad.png)
開いた画面で`History`ボタンを押す。
![9cfbb2b1aba5210062c4de20e760cf62.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/b2f10301-fda9-49ce-f7b0-1c9ee49d6918.png)
そのファイルのcommitグラフが見える。
`<>`を押すと、その時点のリポジトリが開き、commitのハッシュ値を押すと編集情報が見える。
![090d2477343b70e1f026c7d8e5fef757.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/d4c9ce3b-747c-0ada-d75a-dc73a203cd71.png)
また、GitHubのファイル上でキーボードの`B`を打つと、各行単位のソース編集者や編集時期が見える。commitコメントはリンクにもなっていて、そのcommit内容の画面に遷移が可能。
![1185f257f8a7ed80f0a4aa984c250ef7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429583/830468b3-50fe-8536-9c99-858f6c5329e3.png)

# 4. その他、GitHub上のショートカットキー一覧

キーボードのキーを押下するだけで以下のような動作が可能。

`W : Branch選択画面になる` 
`E : ソースファイル上で押下するとEditモードになる` 
`S : 左上のリポジトリ検索モードがアクティブになる` 
`B : ソースファイル上で押下するとソースの各行の最後の編集者と編集時期が見える` 
`T : ディレクトリ検索画面になる` 

※個人的に使い方がよく分からないショートカット
`L : ソースファイル上で押下するとJump to line入力欄が表示できる` 
`R : ソースファイル上で押下するとCode definitions入力欄が表示できる`
Cordova環境構築(初めての投稿)

webviewのネイティブアプリを作成する際にwebviewを埋め込むのにcordovaが必要で環境構築にもの凄く苦戦したのでやり方を残します。

# ■ 構築環境
**・Windows10**
**・node10.16.0**
**・npm6.9.0**

# ■ Node.jsのインストール
　1. http://nodejs.org のINSTALLからダウンロード
　2. ダウンロードしたファイルをインストール(パスも自動で設定してくれる)
　3. パスが通ってるかコマンドプロンプトで `npm -v` で確認

# ■ Cordovaのインストール
　1. コマンドプロンプトを立ち上げる。
　2. `npm install -g cordova` を打ち込むとインストール開始
　3. パスが通ってるかコマンドプロンプトで `cordova -v` で確認

# ■ AndroidStudioのインストール
　1. https://developer.android.com/studio からダウンロード 
　2. そのままウィザードにしたがってインストール
　3. システム環境変数の変数名 `Path` に追加 `yourname` は自分の環境に合わせる
　　※インストールしたら既に環境変数が設定されている場合がある
　　`C:\Users\yourname\AppData\Local\Android\Sdk\platform-tools`
　　`C:\Users\yourname\AppData\Local\Android\Sdk\tools`
　4. パスが通ってるかコマンドプロンプトで `android-v` と `adb version` で確認

# ■ JavaSEのインストール
　1. https://www.oracle.com/technetwork/java/javase/downloads/index.html からインストール
　　※versionは8じゃないとダメみたいなので8をインストール

# ■ Cordovaプロジェクトの作成
　1. `create` コマンドで作成
　   　第一引数はプロジェクトのフォルダ名
　   　第二引数はid `config.xml` で変更可能
　   　第三引数はname `config.xml` で変更可能
　　※Cordovaのコマンドは全て `cordova` から始まる

```
C:\yourdirectory>cordova create test com.example.test Test
```

　2. `cd test` で移動しておく

# ■ プラットフォームの追加
　1. `platform add [platform]` コマンドで追加
　   　今回追加するのはwindowsなのでandroid
　　※iosはxcodeが必要なのでwindowsでは無理

```
C:\yourdirectory>cordova platform add android
```

# ■ 追加したプラットフォームをビルド
　1. `build [platform]` コマンドでビルド
　　 指定無しの場合全てのプラットフォームをビルドする
　　 SUCCESSFULが出たらビルド成功

```
C:\yourdirectory>cordova build android

～省略～

BUILD SUCCESSFUL in 5s
```

# ■ 実機で動作確認
　1. 実機をUSBで接続
　2. 実機の開発者向けオプションで適切な処理をしておく
　　https://enjoypclife.net/2016/11/26/android-6-0-developer-options-usb-mtp-ptp/
　3. SDK Managerで実機のversionと同じplatformをインストール
　4. `cordova run android` コマンドで実行

```
C:\yourdirectory>cordova run android

～省略～

BUILD SUCCESSFUL in 5s

～省略～

LAUNCH SUCCESS
```

※画像はエミュレータですが実機でも同様の表示がされます。
![c55f53aa1634caaf328906c2b7a83d50.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449538/8c604415-9c58-55d9-c1ae-a5933eb2c7f3.png)
Kivyのgraphics使ってみた

# 概要
kivyのgraphicsクラスのメソッドで使い方が直感的に分からなかったものがあったので、思いだすようでかいておきたいと思います。説明するのは、color,ellipse,rectangle,meshです。

# 実行環境
次に実行環境を示します。

| Soft and Hard       |       バージョン | 
|:-----------------:|:------------------:|
| Ubuntu         |              16.04 |  
| Python         |              2.7 |   
| kivy         |              1.10.0 |

また、Graphicsの公式ドキュメントは[こちら](https://kivy.org/doc/stable/api-kivy.graphics.html)です。
![5.PNG](https://qiita-image-store.s3.amazonaws.com/0/169342/38bdf3b6-b907-7168-de67-6dacb949b836.png)


# 各メソッド
## Color

後に描画される頂点の色の状態を設定するです。これは0と1の間の色を表しますが、続くキャンバス内の任意の頂点命令のテクスチャに 
乗数として適用されます。テクスチャが設定されていない場合は頂点命令はColor命令の正確な色を取ります。例えば、Rectangleが均一な色``(0.5, 0.5, 0.5, 1.0)`` 
のテクスチャを持ち、先行Colorがrgba =``rgba=(1, 0.5, 2, 1)``　の場合、実際の表示色は``(0.5, 0.25, 1.0, 1.0)`` です。なぜならColor命令はすべての
rgbaコンポーネントに乗数として適用されるからです。 この場合は0〜1の範囲外の色成分は青色成分が目に2倍の強さになると結果を与えます。
引数を次に示します。

Parameters:	
    a:Added in 1.0.0
        レッドコンポーネントは0～1です。

    b:Added in 1.0.0
        ブルーコンポーネントは0～1です。

    g:Added in 1.0.0
        グリーンコンポーネントは0～1です。

    h:Added in 1.0.0
        色相コンポーネントは0～1です。

    hsv:Added in 1.0.0
        HSVカラーは範囲が0～1の値が3つのリストと、1つのアルファを持ちます。

    r:Added in 1.0.0
        赤コンポーネントは0～1です

    rgb:Added in 1.0.0
        RGBカラーは範囲が0～1の値が3つのリストです。

    rgba:Added in 1.0.0
        RGBAカラーは範囲が0～1の値が4つのリストです。

    s:Added in 1.0.0
        彩度コンポーネントは0～1です。

    v:Added in 1.0.0
        値コンポーネントは0～1です。

##ellipse


2次元の楕円を出力する命令です。引数を次に示します。

Parameters:	
    segments: int, デフォルト値は180
        楕円を描くために必要なセグメントの数を定義します。 多くのセグメントがある場合は図はスムーズになります。

    angle_start: int, デフォルトは 0です
        円の部分の開始角度を度で指定します。

    angle_end: int, デフォルトは 360です
        円の部分の終了角度を度で指定します。

    angle_end¶Added in 1.0.0
        楕円の終了角度(単位：度)。デフォルトは360です。

    angle_start¶Added in 1.0.0
        楕円の開始角度(単位：度)。デフォルトは0です。

    segments¶Added in 1.0.0
        楕円のセグメント(分割)数を設定/取得するためのプロパティです。



##rectangle

2次元の四角形を出力する命令です。引数を次に示します。

Parameters:	
    pos: list
        四角形の位置を指定します。フォーマットは(x, y)です。

    size: list
        四角形の大きさを指定します。フォーマットは(width, height)です。

##mesh

2次元のメッシュを出力する命令です。引数を次に示します。メッシュのindicesとverticesの関係は次のイメージで説明します。
![7.png](https://qiita-image-store.s3.amazonaws.com/0/169342/9f56aca2-fcd4-f1bc-20d6-096e15dfacb9.png)


Parameters:	
    indices: iterable
        インデックスのリストのフォーマット (i1, i2, i3...)です。
    
    vertices: list
        メッシュの構築に使用されたx, y, u, v 座標のリスト。メッシュ命令では頂点のフォーマットを今すぐ変更できません。
        つまり、x、y + 1つのテクスチャ座標だけです。

    mode: str
        インデックスの描画に使用されるVBOモードです。 ‘points’, ‘line_strip’, ‘line_loop’, ‘lines’, ‘triangles’,
         ‘triangle_strip’、’triangle_fan’ のいずれかになります。

    fmt: list
        verticeの形式は、デフォルトでは各頂点は2D座標(x,y)と2Dテクスチャ座標(U,V)によって記述されています。リストの各要素はtupleまたはリストの形式であるべきです。


また、三角形を描きたい場合は3つの頂点を追加します。次のようにしてインデックスリストを作成できます。

    indices = [0, 1, 2]
三角形のイメージは次の通りです。

<div align="center">
<img src="https://qiita-image-store.s3.amazonaws.com/0/169342/e7ca7a28-6e57-88fc-224c-6d287c6b3c08.png" width=600>
</div>

# まとめ
3Dや2Dに関してあまり詳しくない為、meshのようなものにうーんとなってしまいました。うーんとなってしまっている人の助けになっていたら嬉しいです。
Laravel-Mix 4でIE11だとAxiosが動作しない

# 結論

`es6-promise/auto`を使う

## 方法

`npm install es6-promise`
を実行後

```js
import 'es6-promise/auto';
import Vue from 'vue';
import VueRouter from 'vue-router';
import Hoge from 'Hoge'

Vue.use(VueRouter);
// ~~省略
```
CameraXについて

#CameraX概要
Jetpackライブラリの１つで、既存のカメラAPIであるCamera2を元に作られている。
CameraXはCamera2の難点であった様々な端末のカメラの機能へのアクセスの複雑さを解消し、
シンプルに実装できるようになった。
※Android5.0(API21以上)で利用可能

#CameraXの構成
CameraXは以下の3つのユースケースを実装し、カメラ機能にアクセスできる。
この3つのユースケースはLifeCyleにbindすることにより使用でき、
bindしたLifeCycleにより破棄、再生成がされる。

###プレビュー
カメラ入力に対するプレビュー機能を提供する

```Kotlin:SampleFragment.kt
val previewConfig = PreviewConfig.Builder().apply {
  //どのカメラを使うか
  setLensFacing(CameraX.LensFacing.BACK)
  //解像度の設定
  setTargetResolution(Size(1920, 1080))
  //アスペクト比の設定
  setTargetAsoectRatio(Rational(1920, 1080))
  ....
}.build()
val preview = Preview(previewConfig)
//ライフサイクルにbind
CameraX.bindToLifecycle(this as LifecycleOwner, preview)

```
解像度やアスペクト比を設定などが端末のスペックの範囲外の時は、
その端末で設定できる一番近しい値が自動で設定される。

###画像解析
画像解析用のバッファの設定をする。
画像解析用に必要なピクセルデータを送信することで画像解析のスピードを早くしている。

```Kotlin:SampleFragment.kt
val imageAnalysisConfig = ImageAnalysisConfig.Builder().apply {
  //どのカメラを使うか
  setLensFacing(CameraX.LensFacing.BACK)
  //解像度の設定
  setTargetResolution(Size(1920, 1080))
  //アスペクト比の設定
  setTargetAsoectRatio(Rational(1920, 1080))
}.build()

val imageAnalyzer = ImageAnalysis(imageAnalysisConfig).apply {
  //解析コード
}

//ライフサイクルにbind
CameraX.bindToLifecycle(this, imageAnalyzer)
```

###画像キャプチャ
画像の保存の設定をする。

```Kotlin:SampleFragment.kt
val imageCaptureConfig = ImageCaptureConfig.Builder().apply {
  //どのカメラを使うか
  setLensFacing(CameraX.LensFacing.BACK)
  //解像度の設定
  setTargetResolution(Size(1920, 1080))
  //アスペクト比の設定
  setTargetAsoectRatio(Rational(1920, 1080))
  //or MAX_QUALITY 速さ優先かクオリティ優先か
  setCaptureMode(CaptureMode.MIN_LATENCY)
  ....
}.build()
val imageCapture = ImageCaputure(imageCaptureConfig)
//ライフサイクルにbind
CameraX.bindToLifecycle(this, imageCapture)

....
//撮影ボタンが押された時
captureBtn.setOnClickListener {
  val fileName = System.currentTimeMillis().toString()
  val fileFormat = ".jpg"
  val imageFile = createTempFile(fileName, fileFormat)
        
  // 撮影画像の保存
  imageCapture.takePicture(imageFile, object : ImageCapture.OnImageSavedListener {
    override fun onImageSaved(file: File) {
      // handle success
    }

    override fun onError(useCaseError: ImageCapture.UseCaseError, message: String, cause: Throwable?) {
      // handle error
    }
  })
}

```
撮影する画像の設定を実装したImageCaptureConfigに基づいてImageCaptureクラスを作成し、
ImageCapture内のtakeCapture関数を呼んで撮影する。

#まとめ
プレビュー、キャプチャ、解析の3つのユースケースをライブサイクルにbindすることで、
指定したライフサイクルに沿ってカメラを有効にするタイミング、データの生成、破棄を行うことができる。
また、デバイス間の違いを吸収し、同様の機能を備えたカメラアプリを簡潔に実装することができる。

#参考
[CameraX - Android Developers](https://developer.android.com/training/camerax)
Gitのソースからltfsをビルドする

#初めに

Qiitaのユーザさんにはあまりなじみが無いと思いますが、テープデバイスをマウントして使用できるファイルシステム[ltfs](https://www.snia.org/tech_activities/standards/curr_standards/ltfs)をソースからbuildしてCentOS7で使用する方法についての備忘録です。
IBMさんの[IBM Spectrum Archive Single Drive Edition (SDE)](https://www.ibm.com/support/home/product/5393096/IBM_Spectrum_Archive_Single_Drive_Edition_(SDE))ですと、[IBM Tape Device Driver](https://www-01.ibm.com/support/docview.wss?uid=ssg1S7002972)のインストールが必要です。こちらがカーネルドライバーのためビルドが必要ですし、カーネルのアップグレードを行う毎にビルドし直さなければいけませんのでCentOS等ではこちらを使った方が楽かもしれません。
(Version2.4.1.2からsgデバイスが使用される様になり、IBM Tape Device Driverのインストールは必要なくなりました。)

基本的に[ltfs Git](https://github.com/LinearTapeFileSystem/ltfs)の手順に従って行えばよいのですが
いくつか注意点があります。
以下はCentOS7.6で試した際の注意点です。

## Prerequestについて

[ここ](https://github.com/LinearTapeFileSystem/ltfs#prerequisites)に記載のあるPrereuestに挙げられているパッケージですがCentOSのパッケージ名と一部異なるものがありますので注意が必要です。

```
$ rpm -q automake autoconf libtool fuse uuid libxml net-snmp icu4c
automake-1.13.4-3.el7.noarch
autoconf-2.69-11.el7.noarch
libtool-2.4.2-22.el7_3.x86_64
fuse-2.9.2-11.el7.x86_64
uuid-1.6.2-26.el7.x86_64
パッケージ libxml はインストールされていません。
net-snmp-5.7.2-37.el7.x86_64
パッケージ icu4c はインストールされていません。
```

libxmはlibxml2、icu4cはicuのようです。

```
$ rpm -q libxml2 icu
libxml2-2.9.1-6.el7_2.3.x86_64
icu-50.1.2-17.el7.x86_64
```

## Parameter settings of the sg driverについて

[ここ](https://github.com/LinearTapeFileSystem/ltfs#parameter-settings-of-the-sg-driver)に記載されているsgドライバのパラメータですが、これを指定するとエラーを起こしてltfsでのマウントが失敗します。Redhat7用の設定例ですのでCentOS7でも同様だと思うのですが、allow_dio=1がいけないようです。
/proc/scsi/sg/allow-dioを1にするとマウントに失敗します。

## 使い方
基本的にIBM版と同じですが、IBM版がIBM Tape Driver(lin_tape)デバイスを使うのに対してGit版はデフォルトではsg（SCSI Generic)デバイスを使います。
どのsgデバイスがテープドライブか？はltfsコマンド「-o device_list」オプションで確認できます。
以下の例では/dev/sg0

```
$ sudo ltfs -o device_list
4a86 LTFS14000I LTFS starting, LTFS version 2.4.2.0 (Prelim), log level 2.　
　-省略-
Tape Device list:.
Device Name = /dev/sg0, Vendor ID = IBM     , Product ID = ULTRIUM-HH8     , Serial Number = 10WT002321, Product Name =[ULTRIUM-HH8].
```

ltfsコマンドに「-o devname=デバイス名」を指定してマウントして使用します。
/mnt/ltfsにマウントする場合は「ltfs -o devname=/dev/sg0 /mnt/ltfs」とします。
他の使用方法はIBM版と同じですので[IBM社のKB](https://www.ibm.com/support/knowledgecenter/STQNYL)等をご確認下さい。
digdagの「echo>:」と「sh>: echo 」の違い

# 概要

`echo>:`と`sh>: echo`の挙動の違いについてです。
digdagのバージョンはv0.9.37です。

# 詳細

- シークレットの変換
- dockerコンテナでの実行

は`sh>: echo`のみで可能です。

`io.digdag.core.workflow.EchoOperatorFactory`と`io.digdag.core.workflow.ShOperatorFactory`の実装を見てもらえればすぐにわかると思います。
ShOperatorFactoryでそれぞれの処理を行なっている該当箇所は以下です。

●シークレット変換

```java
String command = UserSecretTemplate.of(params.get("_command", String.class))
         .format(context.getSecrets());
```

●コンテナ実行

```java
Process p = exec.start(workspace.getPath(), request, pb);
```

※execはCommandExecutorで、実装はDockerCommandExecutorです。

# 確認
では実際に動かして試してみましょう。

(1)シークレットの変換

```json:secret.json
{ "secret_key": "abcde" }
```

```yaml:sample.dig
+task1:
  echo>: ${secret:secret_key}

+task2:
  sh>: echo ${secret:secret_key}
```

```bash
digdag secrets --local --set @secret.json
digdag run sample.dig --session "2019-06-30 12:00:00"
```

実行結果

```
2019-07-01 12:12:11 +0900 [INFO] (0017@[0:default]+sample+task1): echo>: ${secret:secret_key}
${secret:secret_key}
2019-07-01 12:12:11 +0900 [INFO] (0017@[0:default]+sample+task2): sh>: echo ${secret:secret_key}
abcde
```

`sh>: echo`の場合だけ変換されていることが確認出来ます。

(2)dockerコンテナでの実行

```yaml:sample2.dig
_export:
  docker:
    image: alpine:3.7

+task1:
  echo>: hoge

+task2:
  sh>: echo hoge
```
※ローカルにalpine:3.7のイメージが存在しない状態で実行

```bash
digdag run sample2.dig --session "2019-06-30 12:00:00"
```

実行結果

```
2019-07-01 12:12:11 +0900 [INFO] (0017@[0:default]+sample2+task1): echo>: hoge
hoge
2019-07-01 12:12:11 +0900 [INFO] (0017@[0:default]+sample2+task2): sh>: echo hoge
Unable to find image 'alpine:3.7' locally
3.7: Pulling from library/alpine
5d20c808ce19: Pulling fs layer
5d20c808ce19: Verifying Checksum
5d20c808ce19: Download complete
5d20c808ce19: Pull complete
Digest: sha256:8421d9a84432575381bfabd248f1eb56f3aa21d9d7cd2511583c68c9b7511d10
Status: Downloaded newer image for alpine:3.7
hoge
```

`sh>: echo`の場合だけイメージがダウンロードされているので、DockerCommandExecutorのstartメソッドでコンテナで実行する分岐に入っていることがわかります。

# まとめ
ローカルでシークレットで設定した値の確認したい場合なんかは`sh>: echo`を使えば良さそうですね。
vue.js component 非同期で 部品化

vue.js で component を使いまわしたい時がある。
しかも非同期で。



# 概要

・各vueから読み込む
・`<my-component :message="message"></my-component>`の中に Com.vue の内容を表示する。
・top.vue から message 池田を渡す。必ず data の中に入れて渡す。

```top.vue

<my-component :message="message"></my-component>

<script>

    export default {
        components: {
            'my-component': () => import('./Com.vue')
        },
        data () {
            return {
                //子要素にわたす
                message:'池田'
            };
        },
    }

</script>

```


```com.vue

<template>

    <div>
        ラッキー {{message}}
    </div>

</template>

<script>
    export default {
        props: ['message']
    }
</script>


```

すると ラッキー 池田 と表示される。


# 子 から 親 のメソッドを操作

```top.vue

<template>
    <div>
        <my-component @taberu="parentsMethod"></my-component>
    </div>
</template>

<script>

    export default {
        components: {
            'my-component': () => import('./MyComponent.vue')
        },
        data() {
            return {
            };
        },
        methods: {

            //これが動く
            parentsMethod() {
                alert('お腹いっぱい')
            }
        }
    };
</script>

```

```com.vue

<template>
    <div>
        <button @click="taberu">親にイベント通知</button>
    </div>
</template>

<script>
    export default {
        methods: {
            taberu(){
                alert("食事開始");
                this.$emit('taberu')
            }
        }
    }
</script>

```

「食事開始」「お腹いっぱい」 とアラートされる。
また、親側で `@taberu="parentsMethod` を指定しない場合は親側のメソッドは動作しない。


値の受け渡し




```

//子
this.$emit('taberu',this.res);

//親
parentsMethod(data) {
                alert(data)
            },

```

って感じで emit のあとに 渡したい データを入れるだけで渡せる

# 親の引数を渡すとき、遅延したい場合

例えば親でaxiosを使ってユーザーのIDを読み出して、
子に渡したい場合がある。
しかし、普通にやると undefined になるので、ちょっと工夫。



```oya.vue

<note-component :social_id="this.social.id" v-if="this.social.id"></note-component>


<script>

data () {
    return {

        social: {
            id:'',
        },

</script>

```

これで social.id に値が入ったら note-component を動かせる。
PHPのヒアドキュメントをシンタックスハイライトする

# 概要
一部のエディタではヒアドキュメントに書いたコードをシンタックスハイライトしてくれます．
現在確認できているエディタはVSCode，Atom，SublimeTextです．

# やり方
次のようにヒアドキュメントの開始IDと終端IDを```HTML```か```JS```に指定するとシンタックスハイライトがかかります．

```php
$number = 1;
$html = <<<HTML
<div>
    <span>HELLO</span>
</div>
HTML;

$js = <<<JS
const a = 1;
console.log(a);
JS;
```

### まとめ
便利です．
Let's Encrypt 更新したのに、期限切れ

# 現象
Railsで作成したサイトで、Let's Encryptを使ってSSL化をしていた。
pemの参照はRailsのpuma.rbで管理していた。
しかし、更新前の期限が来た時に「この接続は保護されておりません」と
表示されてしまいました。

# 原因
Nginxが古い情報をキャッシュしていたため。
SSLのpemファイルの参照はRails側で行っていましたが、
その情報をNginx側でキャッシュしていました。

# 対策
Nginxを再起動しましょう。
```再起動
sudo nginx -s reload
```
なぜサードパーティ・ライブラリを避けるべきなのか？

最近のプログラミング言語[^3]は標準ライブラリが充実していますが、標準ライブラリが使いにくいために、別のサードパーティが普及している事も多いです。

例えばRubyでは、標準ライブラリの`net/http` に対し、`faraday` がよく使われます。

しかし、私は先日あるプロジェクトであえて`faraday`を避け`net/http`を使うことを選びました。私は以下のような理由から、**サードパーティ・ライブラリは避けるべき**(時もある)と思っています。

[^3]: "Batteries included" が売りのPythonは1991年登場なので「最近」という表現はちょっと変ですが。

# 昔話：Pythonをシェルスクリプトで書き直した

「シェルスクリプトをPythonで」ではありません。

若い頃あるプログラムを任された私は「RHELなら標準でPythonがインストールされている。このプログラムは RHEL でしか動かさないんだから、Pythonで書いてもいいだろう。PythonはBashより可読性も高いし、クールだ！」と考え、Pythonで書いた結果、先輩にゲンコツ（の絵文字）を食らいました。

というのも、任されたプログラムが、商用パッケージのアップデート用スクリプトだったからです。「RHELでしか動かさない」ものの、RHEL のバージョンは顧客によりまちまちでした(4.x 〜 5.x)。

Python では複数のバージョンで動くスクリプトを書くのは注意が必要です（2.4にはwith文が無い！）。気を付けて書いたとしても、そのスクリプトが将来のバージョンでも動く保証はありません（2.5では`with`という変数名は使えない！）。

一方、シェルスクリプトはどのRHELでも同じように動作することが期待できます（少なくともPythonよりは確実性が高い）。

# サードパーティはコントロールできない

さて、サードパーティ・ライブラリの話です。

サードパーティ・ライブラリはあなたの所有物ではありません。ゆえに、ライブラリに大きな変更が加わったり、開発終了になることを止めることはできません。

これが如実に現れたのが、2016年のleft-pad問題でした[^2]。left-padというライブラリが公開停止されたことで、それを（間接的に）利用するReactやBabelなどの有名ライブラリも動作しなくなったのです。

[^2]: left-pad については、こちらの記事で解説されています: [NPMとleft-pad : 私たちはプログラミングのやり方を忘れてしまったのか？ | POSTD](https://postd.cc/npm-and-left-pad/)

「left-padは極端な例だろう」「有名ライブラリが公開停止されることはない」と思われるでしょう。

でも、有名ライブラリも**メジャーバージョンアップで後方互換性が無くなる**ことは珍しくはありません。旧バージョンの利用者から見ると、実質的には開発終了と同じです。

もし、旧バージョンに深刻な不具合・脆弱性が見つかった場合、利用者であるあなたは、

1. 自分のコードを新バージョン向けに修正する（もちろん、テスト等の工数もかかる）
2. もはやメンテされない旧バージョンを使い続ける（場合によってはフォーク版を作る）

という選択に迫られます。

こんなリスクを追うぐらいなら、多少不便でも標準ライブラリで書いた方が良いのではないですか？

# そのサードパーティ、そんなに重要？

さて結局、サードパーティ・ライブラリを使うかどうかは、

- バージョンアップ時の書き換えにかかるコスト
- 得られる利便性

この2つを天秤にかけることになります。

あなたが書いているのが「長期間使うが滅多に変更はしないコード」の場合は、「最後に触ったのが3年前だから勘所が思い出せない」「開発環境構築から始めないといけない」「保守フェーズなので工数が取れない」といったことが起きがちなので、最初に標準ライブラリと多少格闘した方が、後々のコストは安いでしょう。一方、書き捨てスクリプトや、頻繁に手を加えるコードなら、書き換えのコストはゼロあるいは低くなります。

また、例えばPythonでデータ分析処理を書くとき `pandas` や `numpy` といったライブラリは不可欠でしょう（明らかに利便性がコストに勝ります）。一方、付加的な処理（分析結果の保存とか）で楽をするために`requests` を導入するというなら、それはちょっと考え直した方がいいかもしれません。
[ETH-MEETUP] Solidityでアドレス帳を作った

# Ethereumのミートアップの課題「アドレス帳を作ろう」
2019/07/06 SingularityHIVE 開催
Ethereum Solidity入門課題
## 仕様
- set(string, uint8): 送信者は名前と年齢を登録する．
- getAge(address, a): アドレスに登録された年齢を得る．
- getName(address, a): アドレスに登録された名前を得る．
- getDate(address, a): アドレスに登録された日付を得る．
- hello(): 送信者へ挨拶を返す．「Hello, xxx!!」(xxxは予め登録されている名前)．

## アドレス帳のコード例

```js:AddressBook.sol
pragma solidity >=0.4.22 <0.6.0;
contract AddressBook {
    // 登録情報の構築
    struct Info {
        string name;
        uint8 age;
        uint date;
    }
    // アドレスと登録情報を紐付ける
    mapping(address => Info) book;
    // 挨拶の雛形
    string left;
    string right;
    
    // 雛形を初期化
    constructor() public {
        left = "Hello, ";
        right = "!!";
    }
    // 送信者情報を登録
    function set(string name, uint8 age) public {
        Info storage info = book[msg.sender];
        info.name = name;
        info.age = age;
        info.date = now;
    }
    // アドレスに登録された名前を取得
    function getName(address a) public view returns(string name){
        Info memory info = book[a];
        name = info.name;
    }
    // アドレスに登録された年齢を取得
    function getAge(address a) public view returns(uint8 age){
        Info memory info = book[a];
        age = info.age;
    }
    // 情報が登録されたを日時を取得
    function getDate(address a) public view returns(uint date) {
        Info memory info = book[a];
        date = info.date;
    }
    // 送信者に挨拶を返す
    function hello() public view returns(string greet) {
        Info memory sender = book[msg.sender];
        
        string memory name = sender.name;
        string memory hellox = strConnect(left, name);
        greet = strConnect(hellox, right);
    }
    // 文字列の結合を行う
    function strConnect(string str1, string str2) private pure returns(string){

        bytes memory strbyte1 = bytes(str1);
        bytes memory strbyte2 = bytes(str2);

        bytes memory str = new bytes(strbyte1.length + strbyte2.length);

        uint8 point = 0;

        for(uint8 j = 0; j < strbyte1.length;j++){
            str[point] = strbyte1[j];
            point++;
        }
        for(uint8 k = 0; k < strbyte2.length;k++){
            str[point] = strbyte2[k];
            point++;
        }
        return string(str);
    }
}
```

## 軽く解説
mappingでアドレスと登録情報を紐づけ
登録情報はstructで一括管理（名前，年齢，登録日時）
挨拶の雛形としてleftとrightを定義し，コンストラクタで初期化
文字列の結合を行うstrConnectメソッドを実装（[参考: Solidityで文字列連結](https://qiita.com/onokatio/items/4d74229bd6015379e379)）
[Vue]便利なnuxt-linkや$routerだが、外部サイトへのページ遷移はaタグを使うしかない件

薄めの内容ですが、調べて「はえ〜」と思ったので、共有しておきます。
# nuxt-linkや$routerは、外部サイトへのリンクとしては使えない
## nuxt-linkと$routerについて
ここでは、簡単に書きます。サンプルは以下の通りです。
### サンプルコード

```vuejs:nuxt-linkのサンプル
<nuxt-link to="/home">ホームへ</nuxt-link>
```

```vuejs:$routerのサンプル
<button @click="onClick">ホームへ</button>

~省略~

<script>
  new Vue({
    el: "#app",
    methods: {
      onClick(){
        this.$router.push('/home');
      }
    }
  })
</script>
```
### すごいざっくり特徴を解説
箇条書きにすると、以下の感じです。
ちょっとざっくり過ぎますが、ご容赦ください。

 - 両方ともページ遷移で便利
 - あくまで主観的だが、aタグでのリンクと比べて、非同期的な操作感がる。サクサクとページ遷移される。
 - nuxt-linkの方は、レンダリングされてブラウザで表示される際には、aタグとして描画される。
 - $routerはnuxt-linkをスクリプト的な表現にしたもの。

## 外部サイトへのリンクでは使えない
nuxt-linkや$routerですが、以下の様な、**外部サイトへのリンクとしては使えません**

```vuejs:挙動してくれないサンプル
<nuxt-link to="https://qiita.com">Qiitaへ</nuxt-link> <!-- ※ページ遷移されない -->
```
エラー等は出ないですが、クリックしてもページ遷移はしてくれません。
# 対応策案
今の所、シンプルにaタグにして

```html:対応策
<a href="https://qiita.com">Qiitaへ</a>
```
とすることぐらいでしょうか。
何か他に良い方法があれば、どなたか教えていただければ嬉しいです。
# さいごに
今日は短い内容ですが、以上です。
最後まで、ありがとうございました。

[参考にしたサイト](https://qiita.com/shosho/items/07eab6e962c95dc846e2)
[参考にしたサイト](https://hafilog.com/nuxt-link-and-atag)
App Store Connect アプリ配布でバイナリが無効エラー

アップルの Store Connectで新しいバージョンのアプリバイナリを登録して審査に提出すると　バイナリが無効　と言うエラーがでた。

エラー理由を書いたメールには以下のようになっている。

We identified one or more issues with a recent submission for App Store review for your app, "XXXXXXXX" X.X.X (X). Please correct the following issues, then upload again.

ITMS-90111: Invalid Toolchain - Your app was built with a beta version of Xcode or SDK. Apps submitted to the App Store must be built with the GM version of Xcode 9 and the SDK for iOS 11, tvOS 11, watchOS 4, or macOS 10.13 or later.

既存の開発環境にXcode１１Beta版をインストールして、複数のXcodeが混じっていたのが原因だった。さっさとbeta版を外して新しくアプリをビルドしてリリースすることにした。

>iOS、Androidアプリの制作なら、https://origon.co.jp にお任せください
>信頼且つ満足できる製品を納品いたします
【AWS】git clone ssh...をする前に行うべき簡単な設定

# AWS の CodeCommit に ssh接続するために必要なこと

#
## ssh接続に必要なキーペアを生成する

ターミナルで以下のコマンドを実行する

```terminal
% ssh-keygen
```
これにより **秘密鍵(secret_key)** と **公開鍵(public_key)** のキーペアが生成される
途中、yes or no を問われる場面が3度ほどあるが、全て脳死でエンター押せばよい

秘密鍵は`~/.ssh/id_rsa`
公開鍵は`~/.ssh/id_rsa.pub`
にそれぞれ記載されている

## IAMユーザーに公開鍵情報を登録する

サービス > IAM > ユーザー > 認証情報 の「SSHパブリックキーのアップロード」をクリック
公開鍵`~/.ssh/id_rsa.pub`の中身をコピーし、フィールドに貼り付けアップロードする
するとSSHキーIDが生成されるのでコピーしておく

## 設定ファイルにSSHキーIDと秘密鍵ファイルパスを記述する

ターミナルで以下のコマンドを実行する

```terminal
% vim ~/.ssh/config
```

configには以下のように記述する

```config
Host git-codecommit.*.amazonaws.com
  User 先ほどコピーしたSSHキーID
  IdentityFile ~/.ssh/id_rsa
```

## config のアクセス権限を変更する

ターミナルで以下のコマンドを実行する

```terminal
% chmod 600 ~/.ssh/id_rsa
```

## SSH設定をテストする

ターミナルで以下のコマンドを実行する

```terminal
% ssh git-codecommit.us-east-2.amazonaws.com
```
初めて接続する場合は接続の確認メッセージが表示される
(yes? or no? ) と聞かれるので yes と書いて enter する

ここまで出来れば事前準備完了！
これで SSH で git clone し放題なのでぜひ試してみて欲しい
【Oracle】シノニム(synonym)の定義

#シノニム(synonym)の定義
##シノニムとは
シノニム(synonym)とはテーブルの別名のことです。
別名を設定することで元の名前とは違うシノニムとして定義した名前でも、テーブルへアクセスできるようになります。

#コード
以下のコードでは「CMN_TABLE」という名前で「WK_TABLE」のシノニムを作成しています。

```sql
-- シノニムを定義する 
CREATE SYNONYM WK_TABLE FOR CMN_TABLE;
;
```

また、通常のシノニムでは自分だけしか使用できませんが、パブリックシノニムを作成することで別のユーザーも同様のシノニムで元のテーブルにアクセスすることが可能になります。

```sql
-- パブリックシノニムを定義する 
CREATE PUBLIC SYNONYM WK_TABLE FOR CMN_TABLE;
;
```
【MariaDB】skip-networkingをOffにしたい

# したいこと
Alpine Linuxにて絶賛稼働中のMariaDBに，WAN側からもアクセスできるようにしたかったのですが，
全然アクセスはできないし，netstatたたいても一向にポートを開けてる感じがしない．

ということで調べてみました．

# 調べたこと
ネット上の情報をいろいろ見て確認したものの，ほぼほぼ問題なさそう．
- rc-service mariadb status →　〇 動いている
- iptables → 〇 tcp/3306開いている
- MariaDBの**skip-networking** → × なんか知らないけどOnになっている

# skip-netowrkingとは？
MariaDBの設定項目の一つ．

詳しく調べていないので何とも言えないのですが，

おそらくたぶん
**Network設定をSkipする（外部からのアクセスなんて知らないよ）**
ということだと思います．確認不足申し訳ない．

なので，これがOnになっていると外からのアクセスはできないというわけのようです．

## コメントアウトしてみた…ものの
`my.cnf`内のskip-networkingを`#`でコメントアウト．

```conf:/etc/mysql/my.cnf
# skip-networking ←コメントアウト
```

ネット上の情報を見て，これでOffになるよ～と書いてあったのでコメントアウトし，保存してMariaDBを再起動
どうなっているか，確認してみました．

MariaDB内で`SHOW VARIABLES LIKE 'skip_networking';`を実行した結果…

```
+-----------------+-------+
| Variable_name   | Value |
+-----------------+-------+
| skip_networking | ON    |
+-----------------+-------+
```

Offになってない…

サーバ自体再起動してみたりしても結果は変わらず．
何なんだ一体！

## 値の書き換え
さらに情報を探していると，それらしい名前の公式ドキュメント(英語)に遭遇．
公式ドキュメント: [Configuring MariaDB for Remote Client Access](https://mariadb.com/kb/en/library/configuring-mariadb-for-remote-client-access/)

その中にこんなものが．

```conf:/etc/mysql/my.cnf
skip-networking = 0
skip-bind-address
```


＿人人人人人人人人人人人人人人＿
＞　値書き換えられたのかよ！　＜
￣Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y￣

ドキュメント内に

> Alternatively, just add the following lines at the end of your .my.cnf (notice that the file name starts with a dot) file in your home directory or alternative last in your /etc/my.cnf file.

とかなんとか書いてあったので，上記の方法に従って追記してみました．

その後，もう一度MariaDBを再起動して，`SHOW VARIABLES LIKE 'skip_networking';`を再実行した結果…

```
+-----------------+-------+
| Variable_name   | Value |
+-----------------+-------+
| skip_networking | OFF   |
+-----------------+-------+
```

Offになりました．
無事，netstatでもポート開いているのを発見できましたし，外からも繋げました．

# 結論
まずは公式ドキュメントを読みましょう（当然）
Link > RPGツクールMVのプラグイン MITライセンスについて (2017-11-24) by NPlasmaさん

MITライセンスについて調べている (バイナリ配布を視野に入れて)。

### RPGツクールMVのプラグイン MITライセンスについて (2017-11-24) by NPlasmaさん

下記のNPlasmaさんの記事が参考になりました。

- RPGツクールMVのプラグイン MITライセンスについて
    - https://elleonard.github.io/nplus_doc/2017/11/24/engineering/rmmv/rpgtkoolmv-license/

他のライセンスとして、以下のものの考察があります。

- BSDライセンス
- Apache License 2.0
- Boost Software License 1.0
- CC0 (public domain)
- NYSLとWTFPL

GPL違反例についても言及されています。
LambdaからAPI Gateway(IAM認可)へのアクセス方法 [Python版]

AWS上でServerlessかつMicroservicesな構成の場合、Lambda内から別サービスのAPI Gatewayにアクセスすることがある。
API GatewayがIAMでアクセス制限がかかっている場合のアクセス方法が分からなかったので調査した。

※ Node.js版は[こちら](https://qiita.com/t_sugawara-01/items/bd247b4326b81056396c)

## 前提
- Lambda (Python 3.7)
- LambdaにIAM Role付与済み
- API Gateway(IAM認可)作成済み

※ API Gatewayの設定方法やIAM Roleの内容などはここでは取り扱わない

## 結論
botocoreのSigV4Authで署名する。

```python:lambda_function.py
import os
import urllib.request
from botocore.credentials import Credentials
from botocore.awsrequest import AWSRequest
from botocore.auth import SigV4Auth

def lambda_handler(event):
    ENDPOINT = "https://XXXXXXXXXX.execute-api.ap-northeast-1.amazonaws.com/STAGE"
    PATH = "/YOUR/RESOURCE"

    awsreq = AWSRequest(method="GET", url=ENDPOINT+PATH)

    # Sign
    credentials = Credentials(
        os.environ["AWS_ACCESS_KEY_ID"],
        os.environ["AWS_SECRET_ACCESS_KEY"],
        os.environ["AWS_SESSION_TOKEN"])
    SigV4Auth(credentials, "execute-api", os.environ["AWS_REGION"]).add_auth(awsreq)

    # Request
    req = urllib.request.Request(awsreq.url, method=awsreq.method,
                                 headers=awsreq.headers)
    with urllib.request.urlopen(req) as res:
        body = res.read()

    # Do something 
```

SigV4Auth で AWSRequest を署名する。
⇒ 下記のようなHeadersが設定される

```Python:req.headers
X-Amz-Date: 20190701T020706Z
X-Amz-Security-Token: AgoJb3JpZ3luX2VjEBgaDmFwLW6vcnRoZWFzdC0xIkcwRQIgXKqUW7xJYR7xjI8r3A8867/J/258UZa3dVZTZXJhZdoCIQCtfBGGCJQR2RIGAaFMUzXdr4MXYzVapq0dUV8tN6QWGSqAAghhEAIaDDM1OTAzMDQzODQ5MSIMuUdqb7U/zKQD0S6GKt0BOkhXekZuxE8LCL9u8ktGjEeQJGHXiRvyfQ8ohzGRlWzmql66Ao1ArjTjYB1Bw7hbnFs4EUylvwc1XBvbEG/OEyWm1rpbZqe5U5Jg0Z9HY8UvJ2wrjKTH4OBMIYMXk4ZdHu9djIx+6d1Ap0E2F2SAtyMsaG75gFuNOx6frG7T0ZFj9t/pT+5HfxE5349VbxaBX6PvRvOIDfLXqv2UacY9eq3gRkkCNOlBm/4Z+iHyQLkWxkOeG05YIx2r7oeeBqN/459KeKU/pDJMcc/QbnTilCQx+oedEmlV+HRfVIswmPbY6AU6tAHD/gc0T1Rszlg1QgZ7aytsID5JvZCaO6/0SYx0C6mx2G/vrQQivQlxCkK396anWK+sVu69goOxay8cs+wov5+TVtL+1ybPYsMJIv6Pb0/zNS82jyh2Va1YOZ8Ep/i/VHrvPVgVLL1419Ly92MhkPZqMecDiniomEzfBchLYpB+eZ/+B+8+SnqOBuooz+QiF+y8doSBMj24ahhEaa7ErGC/rTI1VuT0GSN8a43N1hpkZ7O9Vlg=
Authorization: AWS4-HMAC-SHA256 Credential=ASIAVHFXXXXXXXXXXXXX/20190701/ap-northeast-1/execute-api/aws4_request, SignedHeaders=host;x-amz-date;x-amz-security-token, Signature=ac00aaab0b00fe0a000000e0fd0a00c00aab00000b0000a0a000bddb0b000d
```

AWSRequest 自体はリクエストを発行してくれないので、別途urllibやrequestsなどでリクエストを送る必要がある。

## 参考
https://docs.aws.amazon.com/ja_jp/general/latest/gr/sigv4_signing.html
https://dev.classmethod.jp/cloud/aws/botocore-signed-process/
https://qiita.com/paper2/items/cea6021512132f070403
https://qiita.com/toshihirock/items/a92cbda51d5f469bb0ac
https://qiita.com/crifff/items/6dff429555c898a19758
【Oracle】Viewが存在するかを確認するSQL

#Viewが存在するかを確認するSQL
##やりたいこと
定義済みのViewを検索します。
'USER_VIEWS'テーブルにSELECTを投げることで確認できます。

#コード
以下のコードでは「CMN_VIEW」というViewが存在するかを確認しています。

```sql
-- Viewを確認するSQL 
SELECT *
FROM USER_VIEWS
WHERE view_name  = 'CMN_VIEW'
;
```
HRのスタイリングいろいろ

http://kachibito.net/css/hr-css-styling-collection
より

<p class="codepen" data-height="265" data-theme-id="0" data-default-tab="css,result" data-user="kachibito" data-slug-hash="bPLrqX" 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="bPLrqX">
  <span>See the Pen <a href="https://codepen.io/kachibito/pen/bPLrqX/">
  bPLrqX</a> by kachibito (<a href="https://codepen.io/kachibito">@kachibito</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

CSSの記述を思い出すのと画像で作るのとどっちが早いか悩ましい。
Distortion,UndistortionのChainer実装

レンズ歪みを扱う関数(distortion, undistortion)のChainer実装が欲しかったので探したが、見つけられなかったので自作した。なかなか大変だったのでメモを残す。

# distortion

OpenCVに習って、歪み係数を $(k_1, k_2, p_1, p_2, k_3, k_4, k_5, k_6)$ としたときの歪み関数を以下の式で定める。

$$(x', y') = {\rm distort}(x, y)$$

$$ \begin{aligned}
r^2 &= x^2 + y^2 \\\\
x' &= x\frac{1+k_1r^2+k_2r^4+k_3r^6}{1+k_4r^2+k_5r^4+k_6r^6}+2p_1xy+p_2(r^2+2x^2)\\\\
y' &= y\frac{1+k_1r^2+k_2r^4+k_3r^6}{1+k_4r^2+k_5r^4+k_6r^6}+2p_2xy+p_1(r^2+2y^2)\\\\
\end{aligned}$$

distortionはこれをそのまま実装すれば良い。

# undistortion

逆関数 $(x, y) = {\rm undistort}(x', y')$ を陽に求める事は出来ないので、数値解法によって求める事が必要。

## 初期近似解の導出
まず最初に出来るだけ良い初期値を求める。以下の文献によればradial distortionの部分(第一項目)は厳密に解く事ができる。と言っても無限級数としてだが。
https://www.ncbi.nlm.nih.gov/pmc/articles/PMC4934233/

まず、

$$P(x) = 1+k_1x+k_2x^2+k_3x^3$$

と置く。本関数は$x\geq 0$において単調増加かつ連続である。これを用いるとradial distortionは

$$
\begin{pmatrix} x'\\\\y'\end{pmatrix} = P(r^2)\begin{pmatrix} x\\\\y\end{pmatrix} \\\\
$$

と表せる。同様に、逆方向のradial distortionを

$$\begin{aligned}
Q(x) &= 1+a_1x+a_2x^2+a_3x^3+\cdots\\\\
\begin{pmatrix} x\\\\y\end{pmatrix} &= Q(r'^2)\begin{pmatrix} x'\\\\y'\end{pmatrix}\\\\
\end{aligned}$$

と表すと、これらは逆関数なので

$$P(r^2)Q(r'^2) = 1$$

が成立する。また $r'^2 = r^2P(r^2)^2$ であるので

$$P(r^2)Q(r^2P(r^2)^2) = 1$$

が任意の $r\geq 0$ について成立する。$x=r^2 \geq 0$ と置換して

$$P(x)Q(xP(x)^2) = 1$$

となる。これを展開して係数を求めればよいが、面倒なのでsympyで計算する。

```python
from sympy import Symbol, Poly, solve

DEGREE = 3

x = Symbol('x')
Ks = [Symbol('k%d'%i) for i in range(1, 4)]
As = [Symbol('a%d'%i) for i in range(1, DEGREE+1)]

P = sum(k * x**d for d, k in enumerate([1] + Ks))
Q = sum(a * x**d for d, a in enumerate([1] + As))

print('P(x) =', P)
print('Q(x) =', Q)

coeffs = Poly(P * Q.subs(x, x*P**2) - 1, x).coeffs()
answer = solve(coeffs[-len(As):], As)
for a in As:
    print(a, '=', answer[a])
```

実行結果は以下の通り(とりあえず3次で打ち切った)。

```
P(x) = k1*x + k2*x**2 + k3*x**3 + 1
Q(x) = a1*x + a2*x**2 + a3*x**3 + 1
a1 = -k1
a2 = 3*k1**2 - k2
a3 = -12*k1**3 + 8*k1*k2 - k3
```

## Newton-Raphson法での解改良
続いて、上で求めた初期解をNewton-Raphson法により改良する。

$$ f({\mathbf x}) = {\rm distort}({\mathbf x}) - {\mathbf x'}$$

と置く。これを微分すると

$$\nabla f({\mathbf x}) = \begin{pmatrix}
g(r^2) + 2x^2g'(r^2) + 2p_1y + 6p_2x & 2xyg'(r^2)+2p_1x+2p_2y\\\\
2xyg'(r^2) + 2p_1x + 2p_2y & g(r^2) + 2y^2g'(r^2) + 2p_2x + 6p_1y\\\\
\end{pmatrix}$$

となる。但し

$$g(x) = \frac{1+k_1x+k_2x^2+k_3x^3}{1+k_4x+k_5x^2+k_6x^3}$$

これを使って、前節で求めた値を初期値として用いて更新式

$${\mathbf x_{i+1}} = {\mathbf x_i}-\nabla f({\mathbf x_i})^{-1}({\rm distort}({\mathbf x_i})-{\mathbf x'})$$

を数回まわして解を改善する。

# 実装
こちら。
https://github.com/Idein/chainer-graphics

# 実験
下の画像の左がOpenCVの `cv2.undistort` レナ画像を変換したもの。右が `chainer_graphics.camera.undistort_image` で同じパラメータを用いて変換したもの。
正しく出来ていそう。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/83682/1bbd049a-7565-dc44-82cd-4367ab8590a4.png" width="50%"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/83682/02214fa4-70d3-eacc-2efe-7410b3c9a034.png" width="50%">

これを `chainer_graphics.camera.distort_image` で同じパラメータで逆変換すると元に戻る。こちらも正しく出来ていそう。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/83682/96c8b1a1-1b6b-96ce-fd17-3ecaba58ab52.png" width="50%">
【Oracle】シノニム(synonym)が存在するかを確認するSQL

#シノニムが存在するかを確認するSQL
##シノニムとは
シノニム(synonym)とはテーブルの別名のことです。
別名を設定することで元の名前とは違うシノニムとして定義した名前でも、テーブルへアクセスできるようになります。

シノニムの定義については下記を参照してください。
[【Oracle】シノニム(synonym)の定義](https://qiita.com/t-kikuchi/items/aacfcf49842ebb56d978)

##やりたいこと
定義済みのシノニムを検索します。
'ALL_SYNONYMS'テーブルにSELECTを投げることで確認できます。

#コード
以下のコードでは「CMN_TABLE」というシノニムが存在するかを確認しています。

```sql
-- シノニムを確認するSQL 
SELECT *
FROM ALL_SYNONYMS
WHERE table_name = 'CMN_TABLE'
;
```
PowerShell ドライブ関連コマンド

### 【ドライブ関連コマンド】
　New-PSDrive　　:ドライブの新規マウント
　Remove-PSDrive：ドライブのマウント解除
　Get-PSDrive　　：全ドライブの表示

## New-PSDrive

```PowerShell
　New-PSDrive -Name ＜ドライブレター＞ -PSProvider FileSystem -root ＜マウントディレクトリ＞ 
```

```Powershell:例：DドライブにCドライブのtestdirディレクトリをマウントさせる。
 New-PSDrive -Name D -PSProvider FileSystem -root C:\testdir
```

## Remove-PSDrive

```PowerShell
Remove-PSDrive ＜ドライブレター＞
```

```PowerShell:例：Dドライブのマウントを解除する。
Remove-PSDrive D
```

## Get-PSDrive

```PowerShell
Get-PSDrive
```

![Get-PSDrive.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/434774/5813c309-3aef-42a3-b12b-cd0d478b263d.png)


### 【注意事項】
　New-PSDriveにてマウントしたドライブがエクスプローラ上では表示されないことがあり、またその逆でエクスプローラ上でマウントしたドライブがPowerShell上で使用できない場合もある点に注意。
![PSDrive2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/434774/7cc5fc42-7996-0341-f2f1-260b91f31805.png)
Laravel Excel 3.1 導入 + 使用例

# 概要
[Laravel-Excel](https://laravel-excel.com/)の導入方法と使い方の紹介です．公式ドキュメントに同じものがあります．

目盛線や印刷の向きなどの設定方法は[こちら](https://qiita.com/OKCH3COOH/items/e6c223cc4ed28a112a72)にまとめています．

# 環境
- Laravel 5.8
- Laravel-Excel 3.1

# インストール
次のコマンドを打ちます：

```console
composer require maatwebsite/excel
```

これでvender以下にLaravel-Excel用のファイルが追加されます．

次にLaravelの設定をしていきます．まずconfig/app.phpに

```php:config/app.php
'providers' => [
    /*
     * Package Service Providers...
     */
    Maatwebsite\Excel\ExcelServiceProvider::class,  //追加
]
```

```php:config/app.php
'aliases' => [
    'Excel' => Maatwebsite\Excel\Facades\Excel::class,  //追加
]
```

この2行を追加します．追加後コンソールで

```console
php artisan vendor:publish --provider="Maatwebsite\Excel\ExcelServiceProvider"
```

を実行して，インストール完了です．

# 使用例
Userを出力してみます．まず

```console
php artisan make:export UsersExport --model=User
```

を実行して，必要なファイルを作成します．ファイルは app/Exports/UsersExport.php に作成されます．作成されたファイルは

```php:App/Exports/UsersExports.php
<?php

namespace App\Exports;

use App\User;
use Maatwebsite\Excel\Concerns\FromCollection;

class UsersExport implements FromCollection
{
    public function collection()
    {
        return User::all();
    }
}
```
のようになっています．

次にコントローラに

```UserController.php
use App\Exports\UsersExport;
use Maatwebsite\Excel\Facades\Excel;

class UsersController extends Controller 
{
    public function export() 
    {
        return Excel::download(new UsersExport, 'users.xlsx');
    }
}
```

を追加します．あとはルートを

```php:routes/web.php
Route::get('/users/export','UserController@export');
```

追加すれば完了です．

# 出力形式の指定
出力形式を指定する場合は次のようにします：

```php:UserController.php

use App\Exports\UsersExport;
use Maatwebsite\Excel\Facades\Excel;
use Maatwebsite\Excel\Excel as ExcelType

class UsersController extends Controller 
{
    public function export() 
    {
        return Excel::download(new UsersExport, 'users.xlsx', ExcelType::XLSX);
    }
}
```

ちなみに

```php
return Excel::download(new UsersExport, 'users.xlsx', 'Xlsx');
```

としても動きます(推奨はしません)．対応している形式は

| ExcelType::XXXX | 実体 |
| --- | --- |
| XLSX | 'Xlsx' |
| CSV | 'Csv' |
| TSV | 'Csv' |
| ODS | 'Ods' |
| XLS | 'Xls' |
| SLK | 'Slk' |
| XML | 'Xml' |
| GNUMERIC | 'Gnumeric' |
| HTML | 'Html' |
| MPDF | 'Mpdf' |
| DOMPDF | 'Dompdf' |
| TCPDF | 'Tcpdf' |

です．

# 参考
[公式ドキュメント](https://laravel-excel.com/)
Webpacker 3 → 4

Rails5.2で使っている `webpacker` を3系から4系にアップデートしようとしたところ、ほとんどデフォルト環境で使っているにも関わらずいくつか作業が必要だったのでメモしておきます。

## Gemfile

まずgemのバージョンを上げます。2019/7/1現在だと4.0.7が最新でした。


```ruby
gem 'webpacker', '~> 4.0'
```

```
$ bundle install
```

## Webpackerを再インストール

環境を綺麗にするため、一度インストールし直します。
色々聞かれますが、全部上書きしちゃいます。

```
$ bundle exec rails webpacker:install
```

Vueも入れ直します。

```
$ bundle exec rails webpacker:install:vue
```

## 設定ファイル変更

- .babelrc
- .postcssrc.yml 

これらのファイルはそれぞれ `babel.config.js` と `postcss.config.js` に置き換えられたようなので削除します。


```
$ rm .babelrc .postcssrc.yml 
```

## Pug

テンプレートエンジンとしてPugを使っていたんですが、webpackのloaderが置き換わったようなので対応します。

```
$ yarn remove pug-loader
$ yarn add pug-plain-loader
```

```javascript:config/webpack/loaders/pug.js
module.exports = {
  test: /\.pug$/,
  use: [{
    loader: 'pug-plain-loader'
  }]
}
```

```javascript:config/webpack/environment.js
const { environment } = require('@rails/webpacker')
const { VueLoaderPlugin } = require('vue-loader')
const vue = require('./loaders/vue')
const pug = require('./loaders/pug')

environment.plugins.prepend('VueLoaderPlugin', new VueLoaderPlugin())
environment.loaders.prepend('vue', vue)
environment.loaders.prepend('pug', pug)
module.exports = environment
```

## 動作確認

```
$ bin/webpack
```
GCPでのアーキテクチャを確定するまでの経緯〜動画ストリーミング編

# 概要
ストリーミングで受信した動画データをどのように扱えば、GCPのメリットを最大限に享受しつつ、コストを抑えた構成にできるか考える。

# 要件
 - 動画ストリーミングデータをGCPに保存
 - 保存した動画データをPCにダウンロードできるようにフォーマット変換する
 - サーバコスト・運用コストを出来るだけ下げる

# アーキテクチャ
### はじめ：Compute Engine をメインとした構成
![Architecture1](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17662/9c97b499-a3a9-93d4-1e40-08ed2258c2c4.jpeg)

> 1. Compute Engine へ 動画をストリーミング送信
> - Compute Engine で MUX してダウンロードファイルに変換
> - Cloud Storage に保存

### 最終：全てマネージドサービスな構成
![Architecture2](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17662/ccfd601b-fbdd-cf0a-d39a-7c47949253d4.jpeg)

> 1. App Engine から Cloud Storage バケットの署名付きURLを取得
> - Cloud Storage へ動画をストリーミング送信
> - Cloud Storage のオブジェクト作成イベントで Cloud Pub/Sub 通知送信
> - Cloud Pub/Sub から Cloud Run へ通知
> - Cloud Run で MUX してダウンロードファイルに変換、Cloud Storage のファイル上書き

# コストを下げながら効率的な構成にするための試行錯誤の変遷
はじめの構成の **Compute Engine** 部分をマネージドサービス化する構成を検討する。
### １． App Engine SE
まず、GCP の王道、 GAE のスタンダード環境を検討しました。
しかし、動画変換ライブラリが使用できず、要件を満たしませんでした。

- メリット
 - PaaS
 - フルマネージドサービス
 - サーバコスト・運用コスト低
- デメリット
 - リクエストの最大タイムアウト：60秒
 - 動画変換ライブラリ（C言語ベース）が使えない
 - リッスンソケットは作成できない（アウトバウンドソケットのみ）

### ２． App Engine FE
GAE のフレキシブル環境を検討しました。
しかし、Compute Engine 仮想マシン（VM）上の Docker コンテナで実行されるため、サーバ費用は高めとなります。

- メリット
 - PaaS
 - マネージドサービス
 - リクエストの最大タイムアウト：60分
 - Runtime とミドルウェアに制限がない　→　動画変換ライブラリ使用可能
 - 運用コスト低
- デメリット
 - サーバコスト高

### ３． Cloud Pub/Sub + Cloud Functions
次にサーバレス実行環境である Cloud Functions を検討しました。
サーバレス環境は、サーバーを立ち上げることなく、イベント受信時のみ起動するのでコスト減に貢献します。
しかし、動画変換ライブラリが使用できず、要件を満たしませんでした。

- メリット
 - サーバーレス
 - フルマネージドサービス
 - サーバコスト低
- デメリット
 - 動画変換ライブラリが使えない（サポート言語は Node.js、Python、Goのみ） ＊執筆時点

### ４． Cloud Pub/Sub + Cloud Run
3.と同じくサーバレスですが、Cloud Run はマネージドサーバ上でDockerコンテナを起動して実行するので、動画変換ライブラリも使用可能です。

- メリット
 - サーバーレス
 - マネージドサービス
 - Runtime とミドルウェアに制限がない　→　動画変換ライブラリ使用可能
 - サーバコスト低
- デメリット
 - beta機能（us-central1 リージョンでしか使えない & 情報少ない） ＊執筆時点

# まとめ
 - コストを下げるなら、PaaS かサーバレス
 - Cloud Pub/Sub を使いこなせるようになりたい
 - Cloud Run は要チェック
論文投稿のときにpdfのバージョンに関して怒られたときの対処法

# 論文投稿時にpdfのバージョンでよく怒られる。
締め切り直前だと焦りますよね。

ソースファイルがあるディレクトリで以下のコマンド
```platex hogehoge.tex```
```dvipdfmx -V 4 hogehoge.dvi```
で無事に怒られずに済みました。

~~まあ、だいたいの場合締め切り延びるけどね。~~
Railsでpublic以下の静的ページ（404.htmlといったエラーページ等）をデプロイ時に生成するgemを作った

## はじめに: 404.htmlや500.htmlといったエラーページをhtmlで直接書くのって面倒じゃないですか？

Railsでは独自デザインの404ページや500ページを`public/404.html`や`public/500.html`に置くことができます。
ただし、このファイルは静的なファイルなので、HTMLやCSSも静的にしなければなりません。
そのためデザインをサイト全体で合わせようとして、以下のようにHTML内にがんばって静的なCSSを埋め込んだりしているケースもあるのではないでしょうか？

```public/404.html
<html>
  <head>
    <style type="text/css">
      // コンパイル済みのapplication.cssからコピペした自前のCSSが何百行も並んだり
      // ...
      // ...
      // ...
    </style>
    <!-- もしくはpublic以下に専用のcssファイルを用意したり -->
    <link rel="stylesheet" media="all" href="/css/errors.css" />
  </head>
  <body>
    <h1>404 Not found</h1>
    <p>ページが見つかりません。</p>
  </body>
</html>
```

この問題を解決するために、[hanmoto](https://github.com/aki77/hanmoto)というgemを作りました。
このgemは弊社ソニックガーデンの複数のプロジェクトで1年以上、本番利用されてきた実績があります。

今回の記事ではこのgemの概要と使い方を紹介します。

## 何が出来るの？

- hamlやslimを使って静的ページが書ける
- WebpackerやSprocketsで生成したcssをそのまま使える
- Layoutファイルを使ってエラーページをDRYに管理できる
- link_to等のヘルパーが使える
- public以下にファイルが吐き出されるので、railsが死んでも表示出来る

## インストール

```ruby:Gemfile
gem 'hanmoto'
```

```
$ bundle install
```

## 使い方

### 404.htmlの例

#### レイアウトを用意

```haml:app/views/layouts/public.html.haml
!!!
%html
  %head
    %title #{yield(:title)} | MyAPP
    = stylesheet_pack_tag 'application', media: 'all'
    = favicon_link_tag '/favicon.ico'
  %body
    = yield
```

#### ビューを用意

```haml:app/views/public_pages/404.html.haml
- provide(:title, 'Not found')
%h1 Not found
%p This webpage is not found.
%p= link_to 'Home', root_path
```

#### public以下にファイルを生成

```
$ rake assets:precompile
```

OR

```
$ rake hanmoto:publish
```

`.gitignore`に`public/404.html`を追加しておいて、デプロイ時に`rake assets:precompile`または`rake hanmoto:publish`を実行するという使い方を想定しています。

#### 出力結果

```public/404.html
<!DOCTYPE html>
<html>
<head>
<title>Not found | MyAPP</title>
<link rel="stylesheet" media="all" href="/packs/css/application-cc5b8b21.css" />
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
</head>
<body>
<h1>Not found</h1>
<p>This webpage is not found.</p>
<p><a href="/">Home</a></p>
</body>
</html>
```

### htmlファイル以外の例

#### robots.txtを動的に生成する場合

```erb:app/views/public_pages/robots.text.erb
<% unless Rails.env.production? %>
User-Agent: *
Disallow: /
<% end %>
```

## 設定

```ruby:config/initializers/hanmoto.rb
Hanmoto.configure do |config|
  # ビューファイルを置くディレクトリを変更したい場合は指定してください
  # config.view_dir = 'public_page'

  # レイアウトファイルを変更したい場合はファイルタイプ別に指定してください
  # config.layouts = {
  #   html: 'public',
  # }
end
```

## その他

### 仕組み

- `ApplicationController.renderer`のレンダリング結果を`public`以下に書き出しています。
- 参考: [\[Rails 5\] コントローラの制約を受けずに任意のビューテンプレートをレンダリングする](https://techracho.bpsinc.jp/hachi8833/2017_03_07/36593)

### Herokuでも使える？

RailsアプリをHerokuにデプロイすると自動的に`rake assets:precompile`が実行されるので、特に意識する必要なく利用できます。

### gemの名前の由来

publicに書き出す -> publisher -> 版元

### リポジトリ
https://github.com/aki77/hanmoto
Powershell メモ

#### Linux で、powershell 

- pwsh ( 起動コマンド ) 
- インストール ( ubuntu 18.04  )


```
# Import the public repository GPG keys
curl https://packages.microsoft.com/keys/microsoft.asc | sudo apt-key add -

# Register the Microsoft Ubuntu repository 18.04 を指定
sudo curl -o /etc/apt/sources.list.d/microsoft.list \ https://packages.microsoft.com/config/ubuntu/18.04/prod.list

# Update the list of products
sudo -E apt-get update

# Install PowerShell
sudo -E apt-get install -y powershell
```

#### powershell で、remote login 

 - [PowerShellで遠隔操作の準備](https://qiita.com/arachan@github/items/707ba05befb2d5a5a81a)

- Linux の powershell から、windows へのリモートログインは、WinRM ではできないらしい
- https://github.com/PowerShell/PowerShell/issues/6647
- Basic 認証で行う windows 側で対応必要
- https://www.vwnet.jp/Windows/PowerShell/EnableWinRMFromLinux.htm

#### Powershell コマンド備忘
-  $PSVersionTable ( バージョンの確認　＄が最初に必要)
配列のメソッドまとめ！

こんにちは！

最近雨模様が続いてますね...

梅雨が明けて真夏の日々が待ち遠しいです:relaxed:（←夏生まれ）

はい！

今回は、ブロックを扱う配列のメソッドの中でも、特に使用頻度の高いメソッドをまとめていきます！

それではLet's GO！

## mapメソッド
mapメソッドは各要素に対してブロックを評価した結果を***新しい配列***に返します！

具体例を交えながら説明していきますね！

例えば、以下のように配列の各要素に5を足した新しい配列を作るコードがあります。

```ruby:sample.rb
numbers = [0,1,2,3,4,5]
plus_numbers = []
numbers.each do |number|
  plus_numbers << number + 5
end

plus_numbers #=> [5,6,7,8,9,10]
```

ここでmapメソッドの登場です！！！

mapメソッドを使うと、ブロックの返り値が配列の要素となる新しい配列が形成されるため、***mapメソッドの返り値をそのまま変数に入れることができます！***

それでは見てみましょう！

```ruby:sample.rb
numbers = [0,1,2,3,4,5]
plus_numbers = numbers.map do |number|
  number + 5
end

plus_numbers #=> [5,6,7,8,9,10]
```

## selectメソッド
selectメソッドは、各要素に対してブロックを評価して、その返り値が***真の要素***を集めた配列を返すメソッドです！

同じく具体例を交えながら説明していきますね！

例えば、以下のようにすると、"e"を含んだ値だけを集めた配列を新たに作ることができます！

```ruby:sample.rb
colors = ["red","blue","yellow","black"]
new_colors = colors.select do |color|
  color.include?('e')
end

new_colors #=> ["red","blue","yellow"]
```

## rejectメソッド
rejectメソッドはselectメソッドの反対で、ブロックの返り値が***真になった要素を除外した***配列を返します！

例えば、以下のようにすると、"e"を含んだ値を除いた配列を新たに作ることができます！

```ruby:sample.rb
colors = ["red","blue","yellow","black"]
new_colors = colors.reject do |color|
  color.include?('e')
end

new_colors #=> ["black"]
```

## findメソッド
findメソッドは、ブロックの返り値が***真になった最初の要素***を返します！

例えば、以下のようにすると、"e"を含んだ最初の要素を返します！

```ruby:sample.rb
colors = ["red","blue","yellow","black"]
new_colors = colors.find do |color|
  color.include?('e')
end

new_colors #=> ["red"]
```

---

以上となります！

配列のメソッドは使い方次第でとても便利なので知っておくだけでもかなり幅が広がると思いました！

何かご意見等ございましたら、お気軽にコメントお願いします！

ご静聴ありがとうございました！:relaxed:
hostsファイルに書き込み権限付与 (windows)

## 概要
開発のWindowsパソコンでhostsファイルを管理者権限なしで自分のユーザーで修正できるように権限変更する。

## powershell
下記コマンドを実行する。
※powershellを管理者権限で起動し、下記コマンドを実行する。

```shell
> cacls C:\Windows\System32\drivers\etc\hosts /E /G {ユーザー名}:W
```
※ hostsファイルのパスは環境に合わせて変更してください。
※ ユーザー名も自分のユーザーに変更する。

Get-Aclコマンドでアクセス権限の付与を確認する。

```shell
> Get-Acl -Path hosts | select -expand access

FileSystemRights  : ExecuteFile, Write, ReadPermissions, Synchronize
AccessControlType : Allow
IdentityReference : {ユーザー名}
IsInherited       : False
InheritanceFlags  : None
PropagationFlags  : None
```

今付与したユーザーが表示されているので追加できているようです。

## 参考サイト
* [fire-hostadmin - GAIN_HOSTS_WRITE_PERM.wiki](https://code.google.com/archive/p/fire-hostadmin/wikis/GAIN_HOSTS_WRITE_PERM.wiki)
* [Get-Aclで取得したファイル・フォルダのアクセス権(FileSystemRights)が、数字表記される](http://gottsu.hatenablog.com/entry/2017/09/17/132835)
* [icalcsコマンドを使ってファイルアクセス権限を設定する方法](https://webbibouroku.com/Blog/Article/file-access-controll)