OmniAICreator/Qiita-1.07M huggingface dataset:
VEDAでfbm関数を使ってみる

VEDAを用いたGLSLのライブコーディングの練習をしていて、fbm関数の特性にとても興味があったので試しに使ってみました。
## fbm関数
```glsl:fbm.frag
float random (in vec2 st) {
    return fract(sin(dot(st.xy,
                         vec2(12.9898,78.233)))
                 * 43758.5453123);
}

float noise (in vec2 st) {
    vec2 i = floor(st);
    vec2 f = fract(st);

    float a = random(i);
    float b = random(i + vec2(1.0, 0.0));
    float c = random(i + vec2(0.0, 1.0));
    float d = random(i + vec2(1.0, 1.0));

    vec2 u = f*f*(3.0-2.0*f);

    return mix(a, b, u.x) +
            (c - a)* u.y * (1.0 - u.x) +
            (d - b) * u.x * u.y;
}

float fbm ( in vec2 _st) {
    float v = 0.0;
    float a = 0.5;
    vec2 shift = vec2(100.0);

    mat2 rot = mat2(cos(0.5), sin(0.5),
                    -sin(0.5), cos(0.50));
    for (float i = 0.0; i < 5.0; ++i) {
        v += a * noise(_st);
        _st = rot * _st * 2.0 + shift;
        a *= 0.5;
    }
    return v;
}
```
[ここの記事](https://thebookofshaders.com/13/?lan=jp)がとても勉強になりました。

## コード

```glsl:helloworld.frag
/*{
  "audio": true,
}*/

precision mediump float;
uniform float time;
uniform vec2 resolution;
uniform float volume;

float random (in vec2 st) {
    return fract(sin(dot(st.xy,
                         vec2(12.9898,78.233)))
                 * 43758.5453123);
}

float noise (in vec2 st) {
    vec2 i = floor(st);
    vec2 f = fract(st);

    float a = random(i);
    float b = random(i + vec2(1.0, 0.0));
    float c = random(i + vec2(0.0, 1.0));
    float d = random(i + vec2(1.0, 1.0));

    vec2 u = f*f*(3.0-2.0*f);

    return mix(a, b, u.x) +
            (c - a)* u.y * (1.0 - u.x) +
            (d - b) * u.x * u.y;
}

float fbm ( in vec2 _st) {
    float v = 0.0;
    float a = 0.5;
    vec2 shift = vec2(100.0);

    mat2 rot = mat2(cos(0.5), sin(0.5),
                    -sin(0.5), cos(0.50));
    for (float i = 0.0; i < 5.0; ++i) {
        v += a * noise(_st);
        _st = rot * _st * 2.0 + shift;
        a *= 0.5;
    }
    return v;
}

void main() {
  vec2 point = (gl_FragCoord.xy * 2. - resolution) / min(resolution.x, resolution.y);
  vec3 orbs = vec3(0.0);
  for(float loop = 0.0; loop < 5.0; loop++) {
    vec2 q = point + vec2(fbm(point + sin(time)) * loop, fbm(point + time) * loop);
    orbs += 0.1 * abs(sin(time)) / length(q);
  }
  gl_FragColor = vec4(vec3(orbs), 1.0);
}
```

クリエイティブコーディングやっぱ面白いです。
PostgreSQLの始め方(1)

<h3>0．背景</h3>
<p>
　Webアプリが作りたくて "Heroku" のお勉強を
<b><a href="https://qiita.com/Daiji-Nagashima/items/755ee75ebc72281a6a82">
ちょっただけ</a></b>
しましたが、<br>
Herokuがサポートするデータベース "PostgreSQL" にも 興味を持ったので、<br>
データベース素人ながらも導入してみました。
<ul>
  <li>PC環境 : Windows 10 (64bit)</li>
  <li>開発言語 : Python + PostgreSQL</li>
</ul>
</p>

<h3>1．素人の勘違いの話</h3>
<p>
　普段 IDE(Visual Studio等)に使い慣れてる方は躓くシーンがあるかと思いますが、<br>
私同様の躓きを感じた方に向けて Tipsを残しておきたいと思います。
</p>
<h5>1) PostgreSQLのインストールはマスト!</h5>
<p>
　データベースを用いた開発経験がほぼ無かった私は、<br>
PythonでPostgreSQLを利用したいので【Python + PostgreSQL】で検索！<br>
すると、<b><a href=http://initd.org/psycopg/">psycopg2</a></b>
などのライブラリが引っかかってくるんですが、<br>
これらのライブラリをインストールしただけでは何も出来ません。<br>
「何故っ！？」<br>
当然ですが、これらのライブラリはデータベースを利用するツールです。<br>
PostgreSQLその物では無いのです。まずはインストールしましょう。
</p>
<h5>2) 環境変数を追加しましょう！</h5>
<p>
　PostgreSQLのインストーラは環境変数の設定までやってくれません。<br>
「ん？どゆこと？」って思った方へ、平たく言うとWindowsにPostgreSQLの<br>
インストール先を教えなきゃならないのです。はい、面倒ですね。
</p>
<h5>3) Windowsコマンドプロンプト、Anacondaターミナルに違いは！？</h5>
<p>
　システムの理解が甘かったので、Windows向けPostgreSQLのインストールで<br>
Anaconda上で使えるの？とか無駄な心配をしてましたが、大丈夫でした。<br>
PostgreSQLをインストールして、Windowsに環境変数の追加まで行ったら、<br>
改めてAnacondaを起動し直しましょう。PostgreSQLのコマンドが使えますよ。
</p>

<h3>2．PostgreSQLをインストール</h3>
<p>
まずは
<b><a href="https://www.postgresql.org/">PostgreSQL公式ページ</a></b>
からインストーラをダウンロードしましょう。<br>
ダウンロードとインストールの手順は、
<b><a href="https://www.dbonline.jp/postgresql/install/index1.html">ココ</a></b>
のサイトが参考になりました。
</p>

<h3>3．環境変数の追加</h3>
<p>
PostgreSQLをインストールしても、まだ下記コマンドは効かないかと思います。<br>

<pre>
>psql --version
</pre>

<br>
Windows10に移って以降、環境変数を触ったことがなくて戸惑いました。<br>
環境変数の追加方法は、
<b><a href="https://www.dbonline.jp/postgresql/install/index3.html">ココ</a></b>
のサイトが参考になりました。
</p>
【HTML・CSS】opacityとrgbaの透明化

こんにちは、のっぽです。
本日の学習にてつまずいた箇所、調べた箇所を中心に書いています。

##目次
- opacityとrgbaの仕組み
- opacityとrgbaの違い
- opacityとrgbaの仕組み

***opacity***:不透明を表していて、値は0～1の間で指定します。
テキストでも画像でも半透明になる対象の要素の全体が半透明になってしまう。
***rgba***:色を指定しながら透明度も表せる。RGBカラーモデルのred・green・blueに、alphaが加わったもので、alphaは色の透明度を表す。

###opacityとrgbaの違い
opacityは要素自体に値を設定するので、要素全体に効果が出てしまう。
rgbaはプロパティに対しての値。要素のプロパティに対して色や透明度の設定をしているだけなので他の要素に影響を与えない。

opacityとrgbaを使い分けよう:rolling_eyes:
開発中、if文の分岐を片方のみに指定する小技

## 開発中、if文の分岐を片方のみに指定する小技
下のようなコードがあったとします。`x`の値によって、分岐１か分岐２どちらにも遷移する可能性があります。

```javascript
const x = confirm();
if(x){
  //分岐１
  console.log('x === true');
}else{
  //分岐2
  console.log('x !== true');
}
```
何かの事情で、分岐1に必ず遷移して欲しい時には、次のようにする小技があります。

```javascript
const x = confirm();
if(true || x){
  //分岐１
  console.log('x === true');
}else{
  //分岐2
  console.log('x !== true');
}
```
逆に、必ず分岐2に遷移させるには次のようにします。

```javascript
const x = confirm();
if(false &&  x){
  //分岐１
  console.log('x === true');
}else{
  //分岐2
  console.log('x !== true');
}
```

以上、開発中、if文の分岐を片方のみに指定する小技でした。（開発後は消すのを忘れずに！）
## 終わりに
私は現在、Web3のサービスの開発をしています。詳しくはこちらの記事をご覧下さい。
        [無料でイーサリアムが当たる、Web3時代の寄付サイトを作った話](https://note.com/kenroda/n/n814347fbdcd7)
Cake 123

- [Cake 123](https://atcoder.jp/contests/abc123/tasks/abc123_d)

## コンテスト中の考察

- C問題が解けずにD問題に来た。ヤケクソな気分
- とりあえず全探索を書く。$O(XYZ)$で最悪計算ステップは大体$10^9$になる。えるしってるか？最近のコンピュータはすごく性能がいい。ということでとりあえず提出。結果はRE。そもそもメモリが取りきれなかったみたい。

- ここでひらめいた。今$A_i + B_j + C_k$を必要な分だけ列挙したい。だからあらかじめ$A_i + B_j$を求めておく。$X_h = A_i + B_j$とおいてみる。すると、$X_h + C_k$の組み合わせを求めればいいことになる。
- でも、これでは結局$O(XYZ)$の解法と変わらない。そこで、とりあえず$10^7$回ループを回したコードを提出した。ACしてしまった。ごめんなさい。いや、ACは正義なのではい
- [これ](https://atcoder.jp/contests/abc123/submissions/4860659)がそのコード。この解法は一応正しいけど、書いた本人は適当にループ回しただけなのでなんでACしたかわかってなかった。はい



## 考察し直し

- $A_i + B_j$をあらかじめ求めておき、あとで$C_k$と合流するという考察までは良かった。
- でも、この考察では`AB通り*C通り`になって結局愚直解の計算量と変わらない。
- ここで、AB通りの数が少なくなれば嬉しいことに気がつく。ここで、AとBの組み合わせを埋め込んだ配列をAB配列と呼ぶことにする。
- AB配列を降順にソートする。上位K個より下はいらない。理由は、大きい数字を使った方がお得だから。大きい数字があるのにわざわざ小さい数字を使う理由がない。
- すると、AB配列の大きさはKでいいことになる。AB配列とCの配列の組み合わせが出せればいい。なので、さっきまで$O(XYZ)$だった部分の計算量は$O(KC)$となる。
- これで解けそう



## 解法

- $A_i + B_j + C_k$が大きい順に求めたい
- そこで、$A_i + B_j$の組み合わせをあらかじめ計算して配列に入れておく。これをAB配列と呼ぶ。
- AB配列降順にソートする。この配列のうち必要なのは上位K個となる。
- あとは、AB配列とC配列の組み合わせを全て求め、それを降順にソートした結果が答えとなる。
- 計算量は$O(XYlog(XY) + min(XY, K)Zlog(min(XY, K)Z))$だと思う。とりあえず間に合う。



## [コード](https://atcoder.jp/contests/abc123/submissions/4865945)

```cpp
#include <bits/stdc++.h>
using namespace std;

#define int long long

int X, Y, Z, K;
vector<int> A, B, C;
vector<int> cand;
vector<int> ans;

signed main() {
  cin >> X >> Y >> Z >> K;
  A.resize(X);
  B.resize(Y);
  C.resize(Z);
  for (int i = 0; i < X; i++) { cin >> A[i]; }
  for (int i = 0; i < Y; i++) { cin >> B[i]; }
  for (int i = 0; i < Z; i++) { cin >> C[i]; }

  // AとBの組み合わせをあらかじめ求める
  for (int i = 0; i < X; i++) {
    for (int j = 0; j < Y; j++) {
      cand.push_back(A[i] + B[j]);
    }
  }

  // candを降順にする
  sort(cand.begin(), cand.end());
  reverse(cand.begin(), cand.end());

  vector<int> ans;
  for (int i = 0; i < min(K, (int)cand.size()); i++) {
    for (int j = 0; j < Z; j++) {
      ans.push_back(cand[i] + C[j]);
    }
  }

  // 答えを降順にする
  sort(ans.begin(), ans.end());
  reverse(ans.begin(), ans.end());

  for (int i = 0; i < K; i++) {
    cout << ans[i] << endl;
  }

  return 0;
}
```



## 要点

- A, B, Cを分割して考える。
  - 半分全列挙みたいな考え方
  - てんぷらさんが数え上げコンで出してた問題と似た考え方をした
- 分割したものがどうなると嬉しいかを考える
  - 分割しただけで満足してた。どうすれば嬉しいかを考えると良さげ
  - 今回は、分割したAB配列が小さくなれば嬉しい。そこから上位K個より下はいらないことに気づけると良かった。


## メモ

- JOIのダーツが類題らしい？http://judge.u-aizu.ac.jp/onlinejudge/description.jsp?id=0529。これか？
- 半分全列挙の考え方
- てんぷらさんの問題っぽい。分割する感じが。https://yukicoder.me/problems/no/800
- 〇〇になったら嬉しいなぁという気持ちが考察する上で大事な気がしてきたぞい
DDLとは

参考サイト:
https://wa3.i-3-i.info/word15639.html

#DDLとは？
Data Definition Language、データ定義言語のこと。
データベースに対する命令の分類のひとつ。
データを入れておく箱に対して、あれやこれやをするときに使う命令のこと。

#SQLで言えば……
データ定義言語に相当するものとして、下記があげられる。
>・create文
・drop文
・alter文
【HTML・CSS】文字・背景の透明化


こんにちは、のっぽです。
本日の学習にてつまずいた箇所、調べた箇所を中心に書いています。

##目次
- opacityとrgbaの仕組み
- opacityとrgbaの違い


###opacityとrgbaの仕組み


**opacity**:不透明を表していて、値は0～1の間で指定します。
テキストでも画像でも半透明になる対象の要素の全体が半透明になってしまう。
**rgba**:色を指定しながら透明度も表せる。RGBカラーモデルのred・green・blueに、alphaが加わったもので、alphaは色の透明度を表す。

###opacityとrgbaの違い
opacityは要素自体に値を設定するので、要素全体に効果が出てしまう。
rgbaはプロパティに対しての値。要素のプロパティに対して色や透明度の設定をしているだけなので他の要素に影響を与えない。

opacityとrgbaを使い分けよう:rolling_eyes:
RubyプロジェクトのgemをBundlerで管理

業務でMechanizeを使ったスクレイピングをする機会があり、RubyプロジェクトをBundlerで管理する手順を共有します。
Bundlerを使ってgemを管理するメリットは以下参照
https://blog.tokoyax.com/entry/ruby/bundler

# Bundlerをインストール

```
$ gem install bundler
```
Bundlerをグローバルインストールします。

# Rubyプロジェクトを作成する

```
$ mkdir ruby_project
$ cd ruby_project
```
Rubyプロジェクトを作成するためのフォルダを作成して、移動します。

# Bundler を使った gem のローカルインストール

```
$ bundle init
```

これで、プロジェクトのルートにGemfileが作成されます。

```
source "https://rubygems.org"

git_source(:github) {|repo_name| "https://github.com/#{repo_name}" }

# gem "rails"

# 以下のgemを追加
gem 'mechanize'
```

作成されたGemfileに`gem 'mechanize'`の記述を追加します。

```
$ bundle install --path=vendor/bundle
```

Bundler で Gemfile に書かれている gem をインストールします。
新たにGemfile.lockが作成されて、その中にインストールされたgem一覧が記述されています。
これで、gemのローカルインストールが完了しました。

# gemがローカルインストールされているか確認

gemがグローバルインストールされているか、ローカルインストールされているかは以下の方法で検証できます。

```
$ gem list | grep mechanize              # グローバルインストールされているgem一覧
$ bundle exec gem list | grep mechanize  # ローカルインストールされているgem一覧
mechanize (2.7.6)
```

`bundle exec`を付けた方だけ、`mechanize (2.7.6)`が表示されているのでローカルでのみ
`mechanize`のインストールが完了しています。

# スクレイピングするRubyコードの作成

最後に、Rubyコードを書いていきます。

```
mkdir scraper
vi scraping.rb
```

Rubyファイルを編集します。

```ruby:scraping.rb
require 'mechanize'

agent = Mechanize.new
page = agent.get("http://qiita.com")
elements = page.search('title')
puts elements
```

```:実行コマンド
bundle exec ruby scraper/scraping.rb
```


```:実行結果
<title>Qiita</title>
<title>Qiita</title>
```

# 補足

ちなみに、`bundle exec`を実行コマンドの前につけることでローカルのgemが適用されます。
`bundle exec`を実行コマンドの前に付けなかった場合、グローバルのgemが適用され、グローバルgemには`mechanize`をインストールしていないためエラーになります。

```:実行コマンド
ruby scraper/scraping.rb
```

```:実行結果
/Users/tatsuminaoki/.rbenv/versions/2.4.1/lib/ruby/2.4.0/rubygems/core_ext/kernel_require.rb:55:in `require': cannot load such file -- mechanize (LoadError)
	from /Users/tatsuminaoki/.rbenv/versions/2.4.1/lib/ruby/2.4.0/rubygems/core_ext/kernel_require.rb:55:in `require'
	from scraper/mansion_review.rb:1:in `<main>'
```

これで、RubyプロジェクトをBundlerで管理することができました。
データベース DBMSと関係データベース

参考文献:
http://u0u0.net/W63n

#関係データベースは表、行、列で出来ている
表、行、列には別の呼び名もありますので、ひと通りおさえておきましょう。
![データベース.png](https://qiita-image-store.s3.amazonaws.com/0/368574/5a51b3fe-dab0-8160-2169-6df975443a8f.png)
関係データベースは、<font color="red">リレーショナルデータベース(RDB:Relational Database)</font>とも呼ばれます。

#表を分ける「正規化」という考え方
関係データベースでは、<font color="blue">蓄積されているデータに矛盾や重複が発生しないように、表を最適化する</font>のがお約束です。
これを<font color="red">正規化</font>と呼びます。
##例えば……
下の表を見てください。
この社員表には、社員番号や名前の他に、所属部署が書いてありますよね。
仮に<font color="blue">開発部</font>が<font color="blue">法人開発部</font>という名前に変わったとしましょう。
![具体例.png](https://qiita-image-store.s3.amazonaws.com/0/368574/07ca0385-1721-6954-0f45-506a431b49c7.png)
そうすると、この<font color="blue">開発部</font>と書いてある行は、すべて<font color="blue">法人開発部</font>という名前に書き換えないといけません。
そこで、表をこんな感じに分けてやる。
![putin.png](https://qiita-image-store.s3.amazonaws.com/0/368574/24724978-4145-19f3-2e1f-fce715382137.png)
これなら、部署名が変更されても部署表を書き換えなければ良いだけとなり、データに矛盾が生じることはありません。
なお、実際には正規化というのは、このようなざっくりとした話ではなく、いくつかの段階に分けて行われます。

#関係演算とビュー表
##選択
行を取り出す演算
##射影
列を取り出す演算
##結合
表と表とをくっつける演算

#スキーマ
スキーマとは、<font color="red">概要</font>、<font color="red">要旨</font>といった意味を持つ言葉で、<font color="red">データベースの構造や仕様を定義するもの</font>です。
<font color="red">外部スキーマ</font>、<font color="red">概要スキーマ</font>、<font color="red">内部スキーマ</font>という三層に定義を分けることで、データの独立性を高めています。
##外部スキーマ
利用者の必要とするデータの見方を表現。
<font color="blue">ビュー表</font>がこれに該当。
##概要スキーマ
データの倫理的関係を表現。
表の定義はここで。
いわば<font color="blue">データベース本体</font>。
##内部スキーマ
データの物理的関係を表現。
<font color="blue">物理的にどう記憶させるかの定義</font>はここで。
カプセル化とは


> オブジェクト指向は「カプセル化」「継承」「ポリモーフィズム」の3つの要素で成り立つと言われます。
>>https://qiita.com/tutinoco/items/6952b01e5fc38914ec4e

オブジェクト指向では必須らしい、カプセル化。

カプセル化とは何か。

>例えばiPhoneは液晶部分は操作できますが、本体の中身は基本的に特別な器具がないと開けることはできないですよね。iPhone内部にあるパーツなどはユーザーがいじれないように隠すことで、予期せぬ故障を未然に防いでいることになります。この隠すことを、プログラミングの専門用語でカプセル化と言います。
>>https://qiita.com/yuta-ushijima/items/d6b656618c10f47a6c32

ということ。

##カプセル化を可能にするpublicとprivate

```php:public.php
<?php
class Menu {
    public $name;
    public function __construct($name) {
        $this->name = $name;
    }
}

$curry = new Menu("カレー");
echo $curry->name;
?> 

<!--出力結果-->
<!--カレー-->
```

プロパティ(public \$hogeやprivate \$hogeの部分)をprivateにすると、classの外からは参照できなくなる。


```php:priavte.php
<?php
class Menu {
    private $name;
    public function __construct($name) {
        $this->name = $name;
    }
}

$curry = new Menu("カレー");
echo $curry->name;

?>
<!--エラー発生-->
```

では、privateプロパティを参照し、値を取得、更新したいときはどうすればいいのか。
##privageの場合はゲッターを使い、メソッド経由で値を返す

プロパティを返すだけのメソッドを作りそのメソッド経由で、プロパティの値を参照する。
このときそのメソッド（プロパティがhogeのとき、名前は通常getHoge()メソッド）はclassの中にあるため、
プロパティがprivateでも値を返すことができる。

```php:private.php
class Menu {
    private $name;
    public function __construct($name) {
        $this->name = $name;
    }

    //nameを返すだけのメソッド（ゲッター）
    public function getName(){
        return $this->name;
    }

}

$curry = new Menu("カレー");
//「$curry->name」という風には呼べないので、代わりにgetName()メソッド経由で呼び出す。
echo $curry->getName();
?>

<!--出力結果-->
<!--カレー-->

```

##プロパティの値の変更はセッターを使う

pblicの場合は以下のようにできる。

```php:public.php
<?php
class Menu {
    private $name;
    public $price = 1000;
    public function __construct($name) {
        $this->name = $name;
    }

    public function getName(){
        return $this->name;
    }

    public function setPrice(){

    }

}

$curry = new Menu("カレー");
echo $curry->getName()."\n";

echo $curry->price."\n";
//値を更新
$curry->price = 1200;
echo $curry->price."\n";

?>

<!--カレー-->
<!--1000-->
<!--1200-->
```
しかし、privateだとエラーが出るため、セッター（プロパティがhogeのとき、名前は通常setHoge()メソッド）を作成し、セッター経由で、値を更新する。

```php:private.php
<?php
class Menu {
    private $name;
    private $price = 1000;
    public function __construct($name) {
        $this->name = $name;
    }

    public function getName(){
        return $this->name;
    }

    public function getPrice(){
        return $this->price;
    }

    //セッター
    public function setPrice($price){
        //更新したい値を引数にとり、$this->priceに代入し、privateプロパティを更新
        $this->price = $price;
        return $this->$price;
    }

}

$curry = new Menu("カレー");
echo $curry->getName()."\n";

//更新前
echo $curry->getPrice()."\n";

//セッター経由で値を更新
$curry->setPrice(1200)."\n";
//更新後
echo $curry->getPrice()."\n";

?>

<!--カレー-->
<!--1000-->
<!--1200-->

```
#python の 正規表現で何故か match が起こらない ？ 複数行どころか先頭文字列にしかマッチしないから気をつけて！

# search を使うと良いっぽい

フォーマルなやり方かどうかは不明。

# match の場合

```py
>>> import re
>>> re.match(r'A', "A\nB\nC")
<re.Match object; span=(0, 1), match='A'>
>>> re.match(r'B', "A\nB\nC")

```

# search の場合

```py
>>> re.search(r'A', "A\nB\nC")
<re.Match object; span=(0, 1), match='A'>
>>> re.search(r'B', "A\nB\nC")
<re.Match object; span=(2, 3), match='B'>
>>>

```

# Doc

このあたりを読めば良さそう

[7.2. re — Regular expression operations — Python 2.7.16 documentation](https://docs.python.org/2/library/re.html#search-vs-match)

# これかな

MULTILINE mode では match は文字列先頭にしかマッチしないと書かれている。

```
Note however that in MULTILINE mode match() only matches at the beginning of the string, whereas using search() with a regular expression beginning with '^' will match at the beginning of each line.

>>> re.match('X', 'A\nB\nX', re.MULTILINE)  # No match
>>> re.search('^X', 'A\nB\nX', re.MULTILINE)  # Match
<_sre.SRE_Match object at ...>
```

# え、もしかして‥

本当に先頭からしかマッチしないのか！ 分かりづらい‥！ (Rubyと違う)


```py
>>> re.match(r'A', 'ABC')
<re.Match object; span=(0, 1), match='A'>
>>> re.match(r'B', 'ABC')
```

# Ruby の場合

こんなん

```
[9] pry(main)> "A\nB\nC".match('B')
=> #<MatchData "B">
```

# Original by Github issue

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








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
#python の IPython で #ruby の binding.pry 的なデバッグがしたいけど 標準入力が奪われてうまく動かなかった件の共有

`sys.stdin.read()` が全部と奪ってしまうらしい。
考えてみれば当たり前のような気もするが未言語化。解決策は未調査。

# script
```python
#!/usr/bin/env python3

from IPython import embed
import sys

sys.stdin.read()

embed()
a=1
```
# exe
すぐに終了してしまう。

```sh
$ echo "abc" | ./debugtest.py
Python 3.7.2 (default, Jan 13 2019, 12:50:01)
Type 'copyright', 'credits' or 'license' for more information
IPython 7.4.0 -- An enhanced Interactive Python. Type '?' for help.

In [1]: Do you really want to exit ([y]/n)?
```



# Original by Github issue

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








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
#Twitter #API の使う Bearer のアクセストークンを curl で得る例 (公式ドキュメントのまま)


# Doc
[Using Bearer Tokens — Twitter Developers](https://developer.twitter.com/en/docs/basics/authentication/guides/bearer-tokens.html)
# App
ここの API KEY と API Secret key を使う
[Twitter Developers](https://developer.twitter.com/en/apps)
![image](https://user-images.githubusercontent.com/13635059/55669321-c985fa80-58b0-11e9-8543-1b09500e7c36.png)
# Exe
```
curl -u 'API_KEY:API_SECRET_KEY --data 'grant_type=client_credentials' 'https://api.twitter.com/oauth2/token'
```

# Original by Github issue

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








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
【Rails】アソシエーションをもつモデルをfactory_botで作成するメモ

# Introduction
Railsで`has_many`や`belongs_to`などのアソシエーションのあるモデルをfactory_botで生成する方法のメモ。
いままでずっと、

```rb:spec/factories/factory.rb
FactoryBot.define do
  factory :author do
    name { "Author Name" }
  end

  factory :book do
    author_id { 1 }
    title     { "Book Title" }
  end
end
```

```rb:spec/system/xxxxx_spec.rb
# ~~~ #
background do
  @author = create(:author)
  @book1 = create(:book, author_id: @author.id, title: "book 1")
  @book2 = create(:book, author_id: @author.id, title: "book 2")
  @book3 = create(:book, author_id: @author.id, title: "book 3")
  @book4 = create(:book, author_id: @author.id, title: "book 4")
  @book5 = create(:book, author_id: @author.id, title: "book 5")
end
# ~~~ #
```
みたいな書き方をしてしまっていたのですが、それぞれの項目は連番とかでよいテストではもっといい方法がありました...

# 前提
Author has_many Books　（Authorモデルは0以上のBookモデルを子に持つ）
Book belongs_to Author　（Bookモデルは1つのAuthorモデルを親に持つ）

| Author      |
|:-----------:|
| id:integer  |
| name:string |

| Book              |
|:-----------------:|
| id:integer        |
| author_id:integer |
| title:string      |

ちなみに`selenium`+`rspec`+`capybara`でsystem testをするのを想定してます。
[Rails on Dockerにて、Headless ChromeでSystem Testをやってみた。 - Qiita](https://qiita.com/at-946/items/e96eaf3f91a39d180eb3)

また、使用しているfactory_botのversionは`5.0.2`です。

# Solusion

```rb:spec/factories/factory.rb
FactoryBot.define do
  factory :author do
    name { "Author Name" }

    factory :author_with_books do
      transient do
        books_count { 5 }
      end
      after(:create) do |author, evaluator|
        create_list(:book, evaluator.books_count, author: author)
      end
    end
  end

  factory :book do
    title { generate(:book_title) }
  end

  sequence :book_title do |n|
    "Book Title #{n}"
  end
end
```

これで

- `create(:author)`で`Book`を持たない`Author`
- `create(:author_with_books)`で`Book`を5つ持つ`Author`

が作れるようになりました。`create(:author_with_books)`でできる`Book`の数は7行目の`books_count`で変更できます。

また、`Book`の`title`を`generate(:book_title)`としています。これは19行目の`sequence :book_title`を呼び出していますが、`sequence`は呼び出されるたびに`n`がカウントアップするため、`Book Title 1`, `Book Title 2`, ・・・、といった`title`の`Book`オブジェクトが5つできることになります。

```rb:spec/system/xxxxx_spec.rb
# ~~~ #
background do
  @author = create(:author_with_books)
end
# ~~~ #
```
テストシナリオファイル側では１行で1つの`Author`オブジェクトとそれに紐づく5つの`Book`オブジェクトを扱えるようになります。`Book`オブジェクトは、`@author.books[i]`の形でアクセスすることができます。

# Conclusion
テストシナリオファイルがかなりスッキリしました。
Getting Started見る限り、まだまだ知らない便利な書き方がありそう。ちゃんと読まねば。

# Reference
- [File: GETTING_STARTED — Documentation for factory_bot (5.0.2)](https://www.rubydoc.info/gems/factory_bot/file/GETTING_STARTED.md)
Pythonを使って余因子行列を用いて逆行列を求める。

##余因子行列を用いて逆行列を求めたい。




今回は余因子行列を用いて逆行列を求めてみたいと思います。

---
#### まずは正則行列Aをひとつ定める。
例えば今回はAとして以下の様な行列をとることにします。

```python:
import numpy as np
A = np.array([[2.,1.,1.],[0.,-2.,1.],[0.,-1.,-1.]])
```
####行列式を定義。

np.linalgを使えばnp.linalg.det(A)でおしまいですが、ここでは
あえてdet(A)という関数を以下のようにきちんと書いておくことにします。

```python:
def det(A):
    return  A[0][0]*A[1][1]* A[2][2] + A[0][2]*A[1][0]*A[2][1] + A[0][1]*A[1][2]*A[2][0]\
           - A[0][2]*A[1][1]*A[2][0] - A[0][1]*A[1][0]*A[2][2] - A[0][0]*A[1][2]*A[2][1]

```




####余因子行列を与える関数(写像)を定義。


```python:

def Cof(A):
    C = np.array([[0,0,0] for q in range(3)])
    C[0] = C[0]+[A[1][1]*A[2][2]-A[1][2]*A[2][1], -A[0][1]*A[2][2]+A[0][2]*A[2][1], \
           A[0][1]*A[1][2]-A[0][2]*A[1][1]]
    C[1] = C[1]+[-A[1][0]*A[2][2]+A[1][2]*A[2][0], A[0][0]*A[2][2]-A[0][2]*A[2][0], \
          -A[0][0]*A[1][2]+A[0][2]*A[1][0]]
    C[2] = C[2]+[A[1][0]*A[2][1]-A[1][1]*A[2][0],  -A[0][0]*A[2][1]+A[0][1]*A[2][0], \
           A[0][0]*A[1][1]-A[0][1]*A[1][0]]
    return C
```
   

####逆行列を与える関数(写像)を定義。

ここまで来ればあとは以下のように定めて、

```python:
def Inv(A):
    R = Cof(A)/det(A)
    return R
```
この関数にAを代入すれば完了です。

```python:
#逆行列を余因子行列により求める。
print(Inv(A))
```
iOSで撮影した動画をFirebaseに保存する方法


# 背景
iOSで撮影した動画をFirebaseなどに保存する方法を調べても、日本語の記事が出てこなかったので、ここにまとめることにしました。

#準備
初めにFirebaseの設定がすんでいることが前提です。
また、Firebase Storageを用いるのでこちらもルールも含めて設定しておいてください。
もちろんpodもインストールしておくこと。

## 動作環境
swift4.2.1

# アプリ内で撮影された動画の基本

アプリ内で撮影された動画は、基本的にアプリ内に保存されることになる。保存された動画のパスは、例えば、NSURLという値で指定される。
以下のコードは、動画の撮影を行うときのものである。fileoutputにNSURL型のfileURLを指定して録画を開始している。


```swift
func Record() {
            if !isRecording {
                // 録画開始
                let paths = NSSearchPathForDirectoriesInDomains(.documentDirectory, .userDomainMask, true)
                let documentsDirectory = paths[0] as String
                let filePath : String? = "\(documentsDirectory)/temp.mp4"
                let fileURL : NSURL = NSURL(fileURLWithPath: filePath!)
                fileOutput.startRecording(to: fileURL as URL, recordingDelegate: self)
                
                isRecording = true

            } else {
                // 録画終了
            
                fileOutput.stopRecording()
            }
        }

```

このようにSwiftでは、アプリ内にNSURLで指定される形で撮影された動画が保存されることになる。

##ファイルパスを指定してUpload

この構造を知っていれば後は、パスを指定してFirebaseにアップロードすればいい。
今回は、動画をmp4でアプリ内に保存されていることからfirebase Databaseではなく、Firebase Storageに保存することになる。
保存は、以下のように行えば良い。

まず、次をimportする。

```swift

import Firebase
import FirebaseStorage
```

そのあとに、撮影の終了のタイミングで

```swift

func fileOutput(_ output: AVCaptureFileOutput, didFinishRecordingTo outputFileURL: URL, from connections: [AVCaptureConnection], error: Error?) {
            
            let storageReference = Storage.storage().reference().child("\(UseID!).mp4")
            
            // Start the video storage process
            storageReference.putFile(from: outputFileURL as URL, metadata: nil, completion: { (metadata, error) in
                    if error == nil {
                        print("Successful video upload")
                    } else {
                        print()
                    }
                }
            )
          }

```

というように処理すればアップロードが可能です。
Flutterで画像を表示する方法【まとめ】

2019年2月からFlutterの学習を始め、かなり将来性がありそうだと思ったので、学んだことを逐一記事に残していきたいと思っています。

Flutterとは？ → https://speakerdeck.com/najeira/iosliang-dui-ying-falseapurikai-fa-2

今回は、
Flutterで**画像を表示する**方法について2種類の方法をメモします。
1. アプリ内(アセット)の画像を表示する
2. ネットから画像をダウンロードして表示させる

アプリ内(アセット)の画像を表示する
-
① 画像を配置する
② `pubspec.yaml`を編集する
③ Image Widgetを配置する

画像を配置して、アプリに認識させる必要があります。
↓↓

####① 画像を配置する
<img src="https://qiita-image-store.s3.amazonaws.com/0/366412/9a956c5a-10a3-23e0-1867-bc702d269a40.png" width=40% />
プロジェクト直下に`images`フォルダを作成して、表示したい画像をその中に入れます。

####② `pubspec.yaml`を編集する
```yaml:pubspec.yaml
flutter:

  # The following line ensures that the Material Icons font is
  # included with your application, so that you can use the icons in
  # the material Icons class.
  uses-material-design: true

  # To add assets to your application, add an assets section, like this:
  # ↓この部分を追加する↓
  assets:
    - images/sample.jpg
```
`flutter`ブロックの中に`assets`以下の内容を追加します。
`images`フォルダ内の全ファイルを取り込みたい場合は次のように記述します。

```yaml:pubspec.yaml
flutter:

  # The following line ensures that the Material Icons font is
  # included with your application, so that you can use the icons in
  # the material Icons class.
  uses-material-design: true

  # To add assets to your application, add an assets section, like this:
  # ↓この部分を追加する↓
  assets:
    - images/
```

####③ Image Widgetを配置する
```dart:main.dart
class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        // ここを追加
        child: Image.asset('images/sample.jpg'),
      ),
    );
  }
}
```
`Image.asset(ファイル名)` でWidgetとして追加できます。
`assets/`で指定した時も同様のパス指定をします。

ネットから画像をダウンロードして表示させる
-
① Image Widgetを配置する

コードを1行書くだけです。
↓↓

####① Image Widgetを配置する
```dart:main.dart
class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Image.network('https://yu1204eng.work/images/sample.jpg'),
      ),
    );
  }
}
```
たったこれだけで表示してくれます...！

<img src="https://qiita-image-store.s3.amazonaws.com/0/366412/1ea3e30e-c5df-da7a-4ef7-be4a4279adba.jpeg" width=40% />

非常に簡単に画像を表示させることが出来ました。

＜参考＞
https://flutter.dev/docs/development/ui/assets-and-images
https://nzigen.com/flutter-reference/2018-04-16-image.html
UDTプロトコル

***typoじゃないです。***
*UDP-based Data Transfer Protocol*を略してUDTです。
RakNetについて勉強したことをまとめるにあたってUDTも学んだのでこちらも軽くまとめようと思います。間違っているところがあったら教えてもらえると嬉しいですm(__)m

# 概要
UDTは、大きなデータを高速な通信回線で転送する際TCPではパフォーマンスが出ない問題を解決するために開発されました。またこのプロトコルは*Yunhong Gu*氏が博士号の取得の際に研究し開発されたもので、研究者が手軽に独自の輻輳制御アルゴリズムを試せるように作られています。UDTはTCPによく似ているので、TCPのフロー制御と輻輳制御を先に学んでおくことをおすすめします。

UDTを使用することで、UDP通信に***信頼性***、***輻輳制御***、***フロー制御***が追加されます。

# アーキテクチャ
* UDP上で設計されたトランスポートプロトコル
* SenderとReceiverをお互い持つ二重通信
* パケットベース
* 定期的なAcknowledgement (遅延ACKに近いのかな？)
* 輻輳制御はウィンドウ制御とレートコントロールをハイブリット
* AIMD

# 参考資料
http://udt.sourceforge.net/
https://en.wikipedia.org/wiki/UDP-based_Data_Transfer_Protocol
Golangでlambdaローカルの動かし方(2019/04版)

Golangでlambdaローカルを動かす際に古い記事しかなかったので、自分用のメモ

## 前提
 - OSは、Mac(Mojave 10.14.3)
 - Pythonをインストール済み
  * 筆者の環境は、pyenvで3.7.3をインストール済み
 - dockerをインストール済み

## 準備
 - aws-sam-cliをインストール

```
pip install aws-sam-cli
```
 - 初期化する
  * 下記のパスは、筆者の環境なので、便宜変えてください

```
cd $GOPATH/src/github.com
sam init --runtime go
```

 - 依存モジュールを取得

```
go get github.com/aws/aws-lambda-go/events
go get github.com/aws/aws-lambda-go/lambda
```

 - lambdaイベントの作成

```
cd sam-app/
# Lambdaに渡す用のイベントファイルの作成
sam local generate-event apigateway aws-proxy > event_file.json

# Lambdaの実行
sam local invoke HelloWorldFunction --event event_file.json
```

 - 動作実行

```
# APIの起動
sam local start-api

# 呼べるか確認
curl http://127.0.0.1:3000/hello
```

## 参考URL
 - https://qiita.com/mapyo/items/8ca05957b199b380d899
 - https://qiita.com/hayao_k/items/841026f9675d163b58d5
 - https://qiita.com/hf7777hi/items/5d592c6c2c15a7d75793
Firebase Performance Monitoringを開発中のビルド時には無効にしておきたい

実際にユーザー環境でのパフォーマンスを確認するためにFirebase Performance Monitoringを導入しているアプリはそれなりにあるのではないかと思います。

でも、開発中に有効にしているとビルドが遅くなりますよね。アプリによるけど、２〜３分くらいかかることありますよね。

はずかしい話ローカルでコメントアウトして開発してたんですよね。こんな感じで

```gradle
//apply plugin: 'com.google.firebase.firebase-perf'
```

導入したときにはなかった設定だったと思うのですが、簡単に有効・無効を切り替えることができるようです。
[Firebase Performance Monitoring SDK を無効にする](https://firebase.google.com/docs/perf-mon/disable-sdk?hl=ja)

[Firebase Gradle Plugins version 1.2.0](https://firebase.google.com/support/release-notes/android#2019-03-27)から追加された設定のようです。

gradle.propertiesには無効と設定しておいて

```gradle:gradle.properties
firebasePerformanceInstrumentationEnabled=false
```


リリースするアプリをビルドする際などはコマンドライン引数で上書きすればいいみたい

```shell
 ./gradlew -PfirebasePerformanceInstrumentationEnabled=true assembleRelease
```
Dapperでカラム名とプロパティ名のケースが異なる場合のマッピング

## 結論

データベースからレコードを取得する前に、以下のコードを挿入します。

```csharp
Dapper.DefaultTypeMap.MatchNamesWithUnderscores = true;
```

## はじめに

Qiita初投稿です。もし当記事が少しでもお役に立った場合は「いいね」を頂けると励みになります。
また、誤った記載があった際はコメント欄にて優しいマサカリをお待ちしています。

## 環境

- Dapper v1.60.6
- Azure SQL Database V12
- Microsoft.NETCore.App v2.2.3
- Microsoft Visual Studio Community 2017 v15.9.10

## 詳細

### 課題

Dapperを使用して取得したレコードの中身をモデルクラスにマッピングしようとした際、
テーブルのカラム名がスネークケース、モデルクラスのプロパティ名がキャメルケースでした。
`DataContractAttribute`を使用すればマッピングをうまい具合にやってくれると思ったのですが、
Dapperではうまく機能しないようです。


- SQL Database

personテーブル

| first_name | last_name | age       |
|:-----------|:----------|:----------|
| Hoge       | Fuga      | 20        |

- ソースコード

```csharp:Person.cs

[DataContract(Name = "person")]
class Person
{
    [DataMember(Name = "first_name")]
    public string FirstName { get; set; }

    [DataMemeber(Name = "last_name")]
    public string LastName { get; set; }

    [DataMemeber(Name = "age")]
    public int Age { get; set; }
}
```

```csharp:Program.cs
class Program
{
    static void Main(string[] args)
    {
        var connString = "DBの接続文字列";
        using (var conn = new SqlConnection(connString))
        {
            conn.Open();
            var sql = "SELECT first_name, last_name, age FROM person;";
            var result = conn.Query<Person>(sql).ToList();
        }
    }
}
```

- 取得結果

```csharp
FirstName = null;
LastName = null;
Age = 20;
```

### 解決方法

Dapperがカラム名のアンダースコアを無視する設定を追加します。
具体的には、以下のコードをレコードを取得するより前に挿入します。

```csharp
Dapper.DefaultTypeMap.MatchNamesWithUnderscores = true;
```

ちなみに、Dapperは大文字小文字はデフォルトで無視するそうなので、上記のプログラムでは`Age`だけ
マッピングできました。

```csharp
using (var conn = new SqlConnection(connString))
{
    conn.Open();
    // ↓ ここに入れる
    Dapper.DefaultTypeMap.MatchNamesWithUnderscores = true;
    var sql = "SELECT first_name, last_name, age FROM person";
    var result = conn.Query<Person>(sql).ToList();
}
```

## 最後に

もう一つ、SQL文で素直にカラム名のエイリアスを指定する方法もあります。

```sql
SELECT first_name AS FirstName, last_name AS LastName, age AS Age FROM person;
```

こちらはカラム名とプロパティ名がケース以外も異なる場合にも使えますが、取得したいカラム数が増えると
すべてにエイリアスを指定する必要があり面倒なので、個人的にはDapperの設定を変更する方法が好きです。

DapperはEntity Frameworkと違い軽量かつ導入が簡単で便利なORMですが、意外と日本語情報が少ないので
Dapperをはじめて使用する私のような初心者は頑張りましょう。

## 参考
https://andrewlock.net/using-snake-case-column-names-with-dapper-and-postgresql/amp/
https://webbibouroku.com/Blog/Article/dapper
ラビット☆チャレンジde JDLA E資格

# Deep Learningエンジニア資格挑戦ブログ

### 挑戦の理由

当ブログは、錚々たる有識者会員を持つJDLA(日本ディープラーニング協会)[^1]のエンジニア資格(E資格)への挑戦ブログである。E資格を取るには、JDLA認定の(結構な高額)講座(や課題を含むプログラム:以降単に講座と呼ぶ)を受けることが前提だが、ハードながらそこそこの値段で講座を受けることができる。特に学生は安い。それが、ラビット☆チャレンジ[^2] である。

[![ラビット☆チャレンジ](http://www.realca.ai/images/rabbit-challenge.jpg)](http://ai999.careers/rabbit/)
[ラビット☆チャレンジ](http://ai999.careers/rabbit/)

大学の理系の勉強をある程度やっている方、かつ本気で取り組む覚悟がある方であれば、ぜひオススメしたい。私は40代後半ではあるが、まだディープラーニング エンジニア(DLE)[^3]を諦めていない。AIベンチャーへの転職は叶わなかったが、自分でAI事業を起こすという手段は残っている。その話しも機会があればしたい。
つまり、サブタイトルの回答は、資格でも取らないとやりたいことの入り口に立てないと考えたからである。

### これまでの準備
さて、私がラビット☆チャレンジに申し込んだ際に、熱意があるかどうかの審査があったのだが、それが通ってから実は1ヶ月ぐらい経っている。仕事が忙しく進捗が悪かったのもあるが、それまで次のことをしていた。

##### JDLA G(ジェネラリスト)検定の勉強
3/14、2019 #1の合格通知を受け取った。合格率が高くて少し拍子抜けしたが、自分としては、次のことをきちんとやったつもりだ。

* G検定公式テキストの勉強
* 2019年AI白書の勉強

だからちょっと勉強したら受かったという話しを聞くと、この資格の価値に疑問を抱かずにはいられない。しかし、今自社が関わっている、AI事業化のための説明資料にて、自分がディープラーニング ジェネラリスト(DLG)[^4]であるとはっきり言えるのは、プラス査定であることは間違いない。参考までにE資格、G検定と言葉が不揃いなのは、E検定は「電気・電子系技術検定」で使われているからだと思う。

##### 大学の数学ノートの復習
* 確率・統計
* 線形代数
* 微積分

社会人大学生として20年ぐらいかかって勉強し、ようやく数年前に卒業した。卒論は深層学習を使った姿勢推定とかだったので、この辺はそれなりにきちんと勉強したつもりだが、これを抑えないとE資格は難しいと思っている。

##### 余談
正直AIトップベンチャーであれば、これらは分かって当然だと思われるが、最低でもその入り口に立つために、また、他の技術系エンジニアよりも優先的に仕事を割り振ってもらうためにも、まさに登竜門に相応しい難易度ではないだろうか。プラス、Kaggleでも始めて、Kaggle Masterにでもなって、それでも年齢を理由にそういった仕事ができなかった場合は、大声で言ってやろうと思う。「日本、中国AIに負けて○ね」と。
いろいろあって今までレッドカーペットを通ったことはなかったが、近いうちに必ずAI事業者としてのDLEという立場を手に入れたいと思う。そのためにラビット☆チャレンジを選んだ。

### ブログを書くもう一つの理由
ラビット☆チャレンジでは、ブログ等で勉強した際の記録を残さなければならない。
一種の宣伝効果を期待したものだろうが、今までラビット☆チャレンジのブログを見たのは、kkikuchiさん[^5]だけである。この辺からも当講座の難易度が高いことが窺える。

### Are you an only uncle? (ただのおっさん?)
YESかも知れないが、毎週若者と混じってフットサルをやっている。
ということではなく、22年ほどITエンジニアを続けており、自分は「SE」とは、できれば言いたくない。今風に言うと「フルスタックエンジニア」であり、本当にできるエンジニアはレイヤーには縛られない(はず)。お客さんからも気に入られるよう努力するし、低レベルのプロトコルを理解するためにメーカーの英語の技術書も読む。できない上司から「非効率だ。なんやかんや...」と言われるのに我慢できず、今に至ってしまっている。最近、こんな自分でもお客さんから気に入られているので、自分は間違っていなかったと考えている。
閑話休題
また脱線してしまった。ここで言いたかったのは、ただのおっさんではなくそれなりに下地の勉強はやっているつもりだ、ということである。

* ITエンジニア歴22年
* IPAソフトウエア開発技術者を10年以上前に取った
* どちらかというとバックエンド・ソフトウェアエンジニア
* YOLOを使った姿勢推定の卒論を書いた。(YOLOがGitHubに公開されてから3ヶ月後には知っていた)
* R-CNNの論文は20本ぐらい読んだ。
* SIGNATEの前進のCookpadのコンテスト検出部門でギリギリ10位取った。[第1回AIチャレンジコンテスト](https://signate.jp/competitions/31)
* Python歴3年 (うち業務1年)
* SuaKITを触ったことがある。
* うさぎとは縁がある。
    * DLEの講座名は「ラビット☆チャレンジ」
    * ツイ垢にも写っているが、うさぎ♂を飼っている
    * E資格試験後に「バーニーおじさんは嫌だ」とツイートしてしまった

### 今日の結論

* ブログのイントロダクション作成
* 今まで実施してきたことのまとめ
* 自己紹介

[^1]: JDLA 会員: https://www.jdla.org/membership/
[^2]: ラビット☆チャレンジ: http://ai999.careers/rabbit/
[^3]: https://www.jdla.org/news/detail/20190305001/ 
 「ディープラーニング エンジニア」のこと。JDLAがそう呼んでいる
[^4]: 3に倣って、そう呼びたい
[^5]: [ラピッド☆チャレンジ – DeepLearning学習ブログ](http://rabit.deeplogi.ai/kkikuchi/category/%E3%83%A9%E3%83%94%E3%83%83%E3%83%89%E2%98%86%E3%83%81%E3%83%A3%E3%83%AC%E3%83%B3%E3%82%B8/)
pandas 列単位のデータ型の変換メモ

# 数値型列に数値以外のデータが入っていた時の対応

DataFrameでは列にひとつでも数値以外のValueがあるとObject型に認識されるようです。これをそのまま数値型に変換しようとするとエラーになります。
数値型に変換するために文字列を探して、ひとつひとつ対応することになりますが、
文字列を完全に無視してよい場合は簡単な方法がありました。

# to_numric関数の引数errorsにcoerceを渡す

coerceは強制という意味らしいです。数値以外のデータがNanになります。
元の文字列データが消えてしまうので注意が必要ですが、テスト的に手っ取り早く型変換したい場合に便利でした。

```python

df_s["test"] = pd.to_numeric(df_s["test"] , errors="coerce")
```

```python

df_s.info()
test          933 non-null float64
dtypes: datetime64[ns](2), float64(11), int64(3), object(16)
memory usage: 233.6+ KB
```
Homebrewのインストール

# Homebrewとは
* Macで使える。
* パッケージ（javaやnode.jsなど）のインストールやアンインストールを簡単にできるようにするパッケージ管理ツール。

# インストールする
公式を見るのが一番。
[macOS 用パッケージマネージャー — macOS 用パッケージマネージャー](https://brew.sh/index_ja.html)
Alexaのスキルを作ってみた・呼び出し名を決める

前回からの続き・・・。

Alexaでカスタムスキルを作ってみたので、
技術的なところも踏まえて説明していきたいと思います。
なお、今回はAWSLambdaは使用せず、自前のサーバーでPHPを利用しての開発となります。
（Lambdaでの解説は多くあるので、Lambdaでの開発メインであれば、そちらを参考にしてください）

さて、呼び出し名を決めましょう・・・ってことで。
すでに目標のスキルは完成しており、「パワーメーター」というスキル名で公開済みです。
しかし、そこまで決まるまでにはちょっとだけ時間がかかったのでした。

## 呼び出し名の要件
AlexaのDeveloperConsole上には以下のような注意書きがあります。

>呼び出し名は2語以上でなければなりません。また、使用できるのはひらがな、カタカナ、漢字、小文字のアルファベット、スペースのみです。数字などは文字で表現しなければなりません。(例: 「二十一」など）
呼び出し名には、「起動して」、「開いて」、「聞いて」、「教えて」、「読み込んで」、「開始して」、「有効にして」などの起動フレーズを使用することはできません。「アレクサ」、「アマゾン」、「エコー」、「コンピューター」などのウェイクワードや「スキル」、「アプリ」などの単語は使用できません。カスタムスキルの呼び出し名についての詳細はこちら。
スキルの対話モデルをビルドするまで、スキルの呼び出し名の変更は反映されません。ビルドを正常に完了させるには、スキルの対話モデルに少なくとも1つのサンプル発話のあるインテントが含まれている必要があります。

当初、上記を意識せずに決めておりまして・・・
「ス〇ウター」としておりました。

当然、
> 呼び出し名は2語以上でなければなりません。

に引っかかってしまうので、駄目となります。
（以降にお話しする予定の公開前審査でひっかかります）

注意書きを意識し、分かりやすい名前にしましょう！
・
・
・
というだけでは、当然ダメ！

## ブランド名、商標違反となる名前もNG
まあ、当然といえば当然ですが・・・。
「ス〇ウター」だと「ド〇ゴン〇ール」のアイテムですよね？
こういうのも当然NGになってしまいます。
だから「パワース〇ウター」はダメなんだよね・・・。

## 結局は・・・
なんだかんだで、結局は「パワーメーター」となりました。
当初は「パワーグラス」やら「パワー測定」とかって名前にしようと思ったのですが、
Alexaが答えるのに「グラス」のイメージがつかなかったし、「測定」だと堅苦しい言い回しになるので・・・。

名前は決めたので、次にいきましょう。
と言いたいのですが、一旦Alexaから離れて次回はサーバーの話をさせてください。
結局のところ、Alexaとの対話をするためには、ユーザーの発声に答えるためのAPI（エンドポイント）を用意する必要があるため。

ではでは！
VSCodeでC++始めてみた on Mac

新卒エンジニアで業務5日目を終えた[FooQoo](https://twitter.com/FooQoo56)です．
研究で書いたpythonコードの高速化のために，本日4/6からC++デビューしました．
VSCodeにて，開発環境の構築やソースコードのコンパイルの演習を行ったので，その過程を自分用メモとして投下します．

# やったこと
1. VSCodeでのC++の開発環境構築
2. Makefileを記述してC++コードのコンパイルの演習

## VSCodeでのC++の開発環境構築
以下の記事を参考にしました．
- [Visual Studio Code Mac 開発環境構築[C++]](https://westhillworker.com/visualstudiocode-cpp/)
- [Mac の Visual Studio Codeで C/C++ をデバッグするまで（OSX10.11.6, VSCode1.4.0）](https://qiita.com/keita1987/items/f01cf9f307fedfca00c6)

VSCodeには以下のプラグインをインストールします．
- [C/C++](https://marketplace.visualstudio.com/items?itemName=ms-vscode.cpptools)
- [CodeRunner](https://marketplace.visualstudio.com/items?itemName=formulahendry.code-runner)

C/C++は補完やデバッグ用のツール，CodeRunnerはコンパイルと実行をボタン一つで同時に行ってくれるプラグインです．
`Command + Shift + x` のショートカットで，プラグインの検索窓が出てくるので，上記のものを検索しインストールしました．

## Makefileを記述してC++コードのコンパイルの演習
以下のC++のプログラムを作成しました．

```main.cpp
#include <iostream>

using namespace std;

int main(){
    cout << "HelloWorld." << endl;
    return 0;
}
```

このファイルをコンパイルするため，以下の`Makefile`を作成し，`$ make` を実行しました．

```
test:main.cpp
	g++ -o main main.cpp
```

すると実行ファイル `main` が生成されます．
これに対して，`$ ./main` を実行すると，`HelloWorld.` が出力され無事終了．

# つまづいたところ
VSCodeの開発環境構築の際に，`main.cpp` ファイルの1行目`#include <iostream>`に緑の破線が出てエラーが出力されていました．(エラーの詳細の控えを撮り忘れてしまいました...)
これに対して，以下の記事を参考に次の手順でコマンドを実行したところ，エラーが解消されました．
以下の記事では，`$ xcode-select --install` の効果がなかったことを報告していますが，私のマシンでは上手く動作しました．

```
$ xcode-select --install
$ brew reinstall gcc
```

- [macOSをアップデートしたらg++でwchar.hが見つからなくなった](https://qiita.com/hemuichi/items/0ad8a11fe5d195aaffcb)
- [Macのgcc, g++をHomebrewを使って最新版にする](https://qiita.com/wawawa/items/50c2c612b0937f28d92b)

# おわりに
上記の構築は情報収拾を含め，4時間ほど使いました．
これでようやく，C++の勉強に着手できそうで，ほっとしています．

以降は[一週間で身につくC++言語の基本](http://cpp-lang.sevendays-study.com/index.html)というサイトでC++のチュートリアルをやっていく予定です．
新たな知見があれば，記事にして共有します！
Rubyでファイルに書き込みできなくてハマった話

## あれ？ Tempfile に文字列が書き込まれない。。。
ある日、 `Tempfile` を作成して、そのファイルに文字列を書き込み、完成した `Tempfile` を元に処理を実行するという機能が正常に動作しなくなりました。

調査すると、書き込む文字列によって `Tempfile` に書き込まれたり、書き込まれなかったりすることがわかりました。

原因がすぐに特定できず、解決までちょっと時間がかかってしまったので、この現象の原因と解決方法についてまとめようと思います。

## これは何の記事か？
`Ruby` で `Tempfile` に文字列が正常に書き込まれないケースの原因と解決方法についてまとめた記事です。

**対象読者**

- `IO#write` したのに、文字列が書き込まれない。。。と困っている人

## この記事のゴール

- `Tempfile` に文字列が書き込まれないときの原因がわかる
- 書き込まれないときの対応方法を知る

## 不具合の発覚から対応までの流れ
### 不具合のあった機能について
私が所属する会社では、スプレッドシートで管理している情報をインポートして、一度処理に適した形（CSV形式）に整形した `Tempfile` を作成し、そのファイルを元にして処理を実行するという機能があります。ある日、この機能が正常に使えないとの報告がありました。

### ファイルによって機能が使えないときがある
機能利用者（スタッフ）にヒアリングすると、インポートするスプレッドシートによって、機能が正常に動作するケースとしないケースがあることがわかりました。

**スプレッドシートの特徴**

- 機能するスプレッドシート: 今まで使用してきたもの。1000行以上。
- 機能しないスプレッドシート: 新しく作成されたもの。10行程度。

### Tempfile に何も書き込まれない。。。
ローカル環境で実行してみたところ再現したので、 `byebug` を仕込んで調査を行いました。すると、報告のあったスプレッドシートの情報をインポートして `Tempfile` に整形した情報を書き込んでも（ `IO#write` ）、ファイルには何も書き込まれないことがわかりました。

```ruby:該当箇所
tempfile = Tempfile.open(["spreadsheet", ".csv"])
tempfile.write(spreadsheet.export_as_string.force_encoding("UTF-8"))
# 2行目で Tempfile#write を実行しているのにファイルには書き込まれないケースがある
```

※ 1000行あるスプレッドシートは、正常に書き込まれます。

### 文字数が少ないと書き込まれないことを発見
そこで `rails c` を実行し、コンソール上で試行錯誤していると、書き込む文字列の数によって、書き込まれるときと書き込まれないときがあることに気づきました。

```ruby:書き込まれないケース
> tempfile1 = Tempfile.open("test1.txt")
=> #<Tempfile:/file_path>
> tempfile1.write("test") # 書き込まれない
```

```ruby:書き込まれるケース
> tempfile2 = Tempfile.open("test2.txt")
=> #<Tempfile:/file_path>
> tempfile2.write("TestTest....") # 文字数を1万にして試してみると、書き込まれた。
```

なぜか文字列が多いときにだけ、ファイルに書き込まれることがわかりました。

### バッファが関係しているかも
チームリーダに報告したところ、 「 `File` に書き込むときに、文字列が一度バッファメモリに書かれ、そのバッファが満杯になっていないので書き込まれないのかもしれない」というヒントをいただきました。

調べると確かにそういった記述を見つけることができました。

> PrintWriterなどで物を書き出すときには、内容が一旦バッファと呼ばれるメモリに書かれます。(論理出力動作ともいう) バッファが満杯になると自動的に蓄えられた内容はHDDなどの物理的装置に書き出されます。

参考: https://www.atmarkit.co.jp/bbs/phpBB/viewtopic.php?topic=1445&forum=12

### フラッシュすればバッファが満杯でなくても書き込める
上記の参考ページを読み進めると、以下のような記述がされていました。

> このとき、バッファが満杯になっていなくてもバッファの内容を物理的記憶装置に書き込むよう指示したい場合にはバッファの内容を「フラッシュ」するわけです。 

そこで `Ruby` にも `File` に書き込むときにフラッシュする機能がないかを調べると、公式ドキュメントで見つけることができました。

公式ドキュメント: https://docs.ruby-lang.org/ja/latest/method/IO/i/flush.html

どうやら `IO#flush` を実行すれば解決するようでした。

### IO#flush の実行で無事解決

`IO#write` の実行後に `IO#flush` を実行することで、情報の少ないスプレッドシートをインポートしても、 `Tempfile` に書き込むことができました。もちろん、機能も正常に動作しました。

```ruby:該当箇所
tempfile = Tempfile.open(["spreadsheet", ".csv"])
tempfile.write(spreadsheet.export_as_string.force_encoding("UTF-8"))
tempfile.flush
# IO#write の実行でバッファに溜まった文字列を IO#flush でファイルに書き込めた
```

## まとめ
- `Tempfile` に文字列が書き込めない原因のひとつに、文字数が少なくて（データが小さくて）バッファメモリが満杯にならないケースがある。
- バッファメモリが満杯にならないときは `IO#flush` を実行することで、文字列をファイルに書き込むことができる。

## 所感
この部分は、プログラミングだけを学んでいても、身につかない部分だったのかなと思いました。コードを書いている時にバッファメモリのことを気にしたことは今まで一度もなかったからです。

「やはり、プログラミングだけではなくて、コンピュータの基礎を学ぶことも大事だな」と改めて実感した不具合対応になりました。
Gitpodが最強過ぎる件について

# [Gitpod](https://www.gitpod.io/)って何？

> One-Click Online IDE for GitHub & GitLab

[GitHub](https://github.com/),[GitLab](https://gitlab.com/)のためのワンクリックオンライン IDE です。

GitHub や GitLab のページからすぐに使える使い捨ての VS Code ライクなクラウド開発環境を構築してくれます。

[Theia](https://theia-ide.org/)というオープンソースの IDE を動かしています、詳しくは Theia のサイトを見てみてください。

# なんで最強なのか

-   無料（50 時間/月、オープンソース）
-   アカウント連携だけで利用できる (GitHub,GitLab,Bitbucket)
-   開発環境を使い捨てできる
-   VS Code と操作感が同じ（拡張機能も対応）
-   自動で開発環境をセットアップできる
-   コラボレーション（ペアプロ）ができる
-   Git 統合されていて Pushは勿論のことGitHubなどのPRレビューまでできる
-   多くのプログラム言語をサポート
-   ターミナルが利用できる
-   タブレットやスマホでも利用できる（現在調整中）

# 使い方

`gitpod.io/#`を GitHub,GitLab,Bitbucket のリポジトリURLの先頭につけるだけ

これだけで開発を開始できます！
(URLがIssuesだと新ブランチが作られた状態で、Pull Requestだとレビュー画面で起動するなどちょっとした小技があります)

また、[Chrome 拡張機能](https://chrome.google.com/webstore/detail/gitpod-online-ide/dodmmooeoklaejobgleioelladacbeki)をインストールし簡単にアクセスできるようにする方法もあります。（オススメ）

![](https://lh3.googleusercontent.com/kba5II8ONeymD3FI6cZkC5q3lBJ_zKT6NR0nZT1TImzaV6DUjKs7HPpJ5c9Hmaeh6Kfpsk9ObeU=w640-h400-e365)

https://www.gitpod.io/docs/10_getting_started/

# Gitpod をより便利にする方法

## .gitpod.yml を設定する

-   DockerFile を利用できる
-   モジュール等を起動時にインストールできる

といった他の IDE では手の届かないところが使えます。

例:

```yml
# ワークスペースを実行するDockerイメージ デフォルト:gitpod/workspace-full
image: <your-workspace-image>

# 起動時に実行するコマンド
tasks:
    - init: yarn install
      command: yarn start
# 起動時に開くポート
ports:
    - port: 8000
      onOpen: open-preview
```

これで起動時に`localhost:8000`のプレビューが開いた状況を自動で用意します。

https://www.gitpod.io/docs/41_config_gitpod_file/

## GitHub アプリを利用する

GitHub アプリを利用することで継続的インテグレーション（CI）のように自動でリポジトリの変更を検出しワークスペースを準備し始めます、起動を始める前に起動処理が終わるので少し時間のかかる起動時間が大幅に減ります。

[こちら](https://github.com/marketplace/gitpod-io)からセットアップ！

## VS Code 拡張機能をインストールする

左側の拡張機能欄から検索してインストールします。

以下の動画を参考にしてみてください。
[![How to install VS Code extensions in Gitpod.io (new Open VSX search bar)](http://img.youtube.com/vi/eD_GQ2lQug8/0.jpg)](http://www.youtube.com/watch?v=eD_GQ2lQug8)
<details>
<summary>いつもの拡張機能がない場合</summary>

GitpodではMicrosoftの規約の影響によりVSCode Marketplaceではなく[Open VSX](https://open-vsx.org/)を利用しているので検索しても思ってる拡張機能が出ないことがあります。

[VSCode Marketplace](https://marketplace.visualstudio.com/vscode)から拡張機能をダウンロードしてください、そのファイルをGitpodにドラッグアンドドロップすると利用できます。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/265244/b8298821-acfc-4f4c-a05b-aae9067241c3.png)

わかりにくいですがMarketplaceの右側にある`Download Extension`からインストールしてください。
</details>

詳細:https://www.gitpod.io/docs/vscode-extensions/

## 環境変数を設定する
```
gp env foo=bar
```
とコマンドに打ち込む
または[ダッシュボード](https://gitpod.io/environment-variables/)から設定できます。

![](https://www.gitpod.io/static/c92ee36b85e78680749286788e3087f0/b395d/env-var-dashboard.png)

https://www.gitpod.io/docs/47_environment_variables/

# 終わりに

2019年4月、βから本公開に移ったときこの記事を書かせてもらいました。
その後7月からGitpodに関わらせて頂いています。感謝🙇

追記:Gitpodの良さをもっと知ってもらうために記事を書いています、この記事に付け足すか新しく記事を作るかは未定ですが楽しみにしていてください(2020/09/10)


Gitpodに関してわからないことがあれば気軽に聞いてください、多くの人に必要そうな内容であれば追記させていただきます。


※指摘、質問があればコメント又は[Twitter](https://twitter.com/mouse_484)までお願いします。
Alexaのスキルを作ってみた・概要編

本件が初投稿になります。
分かりずらい内容であれば、ごめんなさい！

今回は、Alexaでカスタムスキルを作ってみたので、
技術的なところも踏まえて説明していきたいと思います。
なお、今回はAWSLambdaは使用せず、自前のサーバーでPHPを利用しての開発となります。
（Lambdaでの解説は多くあるので、Lambdaでの開発メインであれば、そちらを参考にしてください）

さて、では初級編ってことで何を作ろうか・・・と思ったのですが、
過去に以下のAndroidアプリを作ったこともあり、これみたいなのを作ってみようと思いました。
https://play.google.com/store/apps/details?id=jp.ne.poropi.scouter&hl=ja

スキル名は「パワーメーター」・・・。
実は、上記を決めるのにそれなりに時間がかかりました。
それは別の機会にお話しします。

以下、すでに作成済みのスキルです。
https://www.amazon.co.jp/%E5%BB%A3%E6%BE%A4-%E6%99%BA%E6%98%8E-%E3%83%91%E3%83%AF%E3%83%BC%E3%83%A1%E3%83%BC%E3%82%BF%E3%83%BC%EF%BD%9E%E3%81%82%E3%81%AA%E3%81%9F%E3%81%AE%E6%88%A6%E9%97%98%E5%8A%9B%E3%82%92%E6%95%99%E3%81%88%E3%81%BE%E3%81%99%EF%BD%9E/dp/B07MC65GB4

「アレクサ、パワーメーターで俺の戦闘力を教えて！」と聞くと、Alexaから「お前の戦闘力は・・・」と教えてくれます。
当然、数値はランダムなのでジョークアプリですが・・・。

上記を踏まえて、これから何章かに分けて説明できればと思います。
Selenium Basicを使って、Excel VBAからEdgeを操作する

# 目的
Windows7のサポートが切れる。即ちIEの死期が近づく。即ちIEを使っているExcelVBAの死期が近づく。


・・・・


そうだ。Edgeを操作しよう！


~~ExcelVBAもさっさと死んでPython標準搭載になってくれ~~

# 準備

## Selenium Basicのインストール
Selenium Basicをインストールする。怪しいソフトはインストールできない？諦めよう。

https://github.com/florentbr/SeleniumBasic

執筆時点ではv2.0.9.0が最新だった。
https://github.com/florentbr/SeleniumBasic/releases/tag/v2.0.9.0

## EdgeDriverの更新
最新のEdgeDriverを入れないと動かなくなるぞ！
`C:\Users\?ユーザー名?\AppData\Local\SeleniumBasic\Scripts`の中にedgedriver.exeってのがあるので、最新版と差し替える。
https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/


## .NetFramework3.5のインストール
`C:\Users\?ユーザー名?\AppData\Local\SeleniumBasic\Scripts`の中にある、`StartEdge.vbs`をダブルクリックすればインストールできる。わかる人は`Windowsの機能の有効化または無効化`から追加してもよい。でもユーザに説明するのメンドイからおとなしくvbsクリックさせよう。

グループポリシーでvbsが実行できない？`Windowsの機能の有効化または無効化`の方法をアナウンスするか諦めよう。


## 参照設定の追加
Visual Basic Editorを開いて、参照設定からSelenium Type Libraryを追加する。
もしそんなもんねぇよ！っていう人は、SeleniumBasicをインストールした後に、再起動してみよう。
（自分の場合はExcel再起動で出てきた）


# 実装

```vb
Option Explicit

Public Sub Main()
    Dim driver As Selenium.EdgeDriver
    Set driver = New Selenium.EdgeDriver
    
    With driver
        .Start
        .Get "https://www.google.com/"
        .FindElementByName("q").SendKeys ("テスト検索なんだぜ")
        .FindElementById("tsf").submit
        Debug.Print .FindElementById("resultStats").Text
        .Quit
    End With
    

End Sub
```

出力

```
約 24,400,000 件 （0.33 秒） 
```

ね、簡単でしょ。

# SI的結論

.NetFramework3.5をインストールしなきゃいけない
⇒基本これを求めるところはふるーい資産大好きなのでデフォで入ってそう

EdgeDriverの更新が必要
⇒どれくらいの頻度あるかしらんけどWSUSでパッチ配信作業があるたびに検証しなきゃいけないの？無理ぽぉ。動かなくなった！っていうクレームもうざそう

Selenium Basicいれなきゃいけない
⇒それならちゃんとした環境整えるね。

~~あきらめよう~~

# 抜け道
Selenium.IEDriverっちゅうのもある。
これでIEが操作できるZo!
IEが死んでもオブジェクト差し替えるだけなので、まぁ既存のを使い続けるよりは安全かも？いや目糞鼻くそか…。
【Unity】ReorderableListを気軽に使う

#ReorderableListって？
Animatorとかで見かける並べ替えできるやつです。
最近まで名前を知らなかった...
<img width="538" alt="スクリーンショット 2019-04-06 19.57.00.png" src="https://qiita-image-store.s3.amazonaws.com/0/228487/c0372039-0b37-ae8b-88a7-b152040b6366.png">
基本的にはEditor拡張でEditorWindowやComponentの描画を書き換えて
**ReorderableList**が使われることが多いイメージ。
ただそれだと毎回自作クラスとかを拡張して書いてあげる必要があって、
Editor拡張わかる人しかゴリゴリ使えない！！

　**List\<T>**使う感覚でサクッと使えればみんな幸せ。

という事で色々参考にしながら作りました。
[CustomReorderalbeList](https://github.com/CitrusMikan/CustomReorderableList/releases/tag/v1.0.0)

#環境
- Unity 2018.3.8f1
- MacOS 10.13.6
- [CustomReorderableList 1.0.0](https://github.com/CitrusMikan/CustomReorderableList/releases/tag/v1.0.0)
    - 1.0.1：折りたたみ対応。

#使い方
UnityPackageをインポート。
`[ReorderableList]`をつけてpublicで`L***`の型を指定して終わり。
privateでも使えますがInspectorに表示しないならList\<T>を使ったほうが気持ちいいです。

```c#:Example.cs
// Ex.
[ReorderableList]
public LString m_string;  // string型
[ReorderableList]
public LBool   m_bool;    // bool型
```
![list1.gif](https://qiita-image-store.s3.amazonaws.com/0/228487/188c855d-eb56-598d-e28c-9ae96d0781db.gif)
スクリプト内でもListとだいたい同じように使えます。
`m_string.Add("new Text");`
`foreach (var item in m_string) {}`

#もっと使い方
Systemで使える`float`や`byte`などは`L***`で使えるようにしてあります。
UnityEngineで使えるのは`GameObject`や`Vector3`くらいしか設定していません。
ジェネリックのクラスはUnityのInspectorで表示されないようで、
あらかじめ継承したクラスを用意してあげなきゃみたいです。
UnityのComponentを全部用意するのは大変なので必要に応じて追加してください。

各クラスはPackageの中にある`ReorderList.cs`の下の方にあります。

```c#:ReorderList.cs
/* 省略 */
// UnityEngine
[System.Serializable] public class LGameObject : ReorderList<GameObject> { }
[System.Serializable] public class LTransform : ReorderList<Transform> { }
[System.Serializable] public class LVector2 : ReorderList<Vector2> { }
[System.Serializable] public class LVector3 : ReorderList<Vector3> { }
// 追加 TextComponentをReorderableListで使えるようにする
[System.Serializable] public class LText : ReorderList<UnityEngine.UI.Text> {}
```

#参考にした記事
- [http://kan-kikuchi.hatenablog.com/entry/ReorderableList](http://kan-kikuchi.hatenablog.com/entry/ReorderableList)
- [http://yukimemo.hatenadiary.jp/entry/2015/04/19/003309](http://yukimemo.hatenadiary.jp/entry/2015/04/19/003309)
- [https://forum.unity.com/threads/custompropertydrawer-for-a-class-with-a-generic-type.172013/](https://forum.unity.com/threads/custompropertydrawer-for-a-class-with-a-generic-type.172013/)
- [https://anchan828.github.io/editor-manual/web/property_drawer.html](https://anchan828.github.io/editor-manual/web/property_drawer.html)