OmniAICreator/Qiita-1.07M huggingface dataset:
Docker Desktop for Windows 2.4.0.0 (48506) アップデート後に起動エラー

# エラー内容

```
System.NullReferenceException:
オブジェクト参照がオブジェクト インスタンスに設定されていません。
   場所 Docker.Engines.IsoConfig.Meta(Object value) 場所 C:\workspaces\stable-2.4.x\src\github.com\docker\pinata\win\src\Docker.Desktop\Engines\IsoConfig.cs:行 146
   場所 Docker.Engines.IsoConfig.GenerateConfig(Settings settings) 場所 C:\workspaces\stable-2.4.x\src\github.com\docker\pinata\win\src\Docker.Desktop\Engines\IsoConfig.cs:行 82
   場所 Docker.Engines.IsoConfig.Write(Settings settings) 場所 C:\workspaces\stable-2.4.x\src\github.com\docker\pinata\win\src\Docker.Desktop\Engines\IsoConfig.cs:行 40
   場所 Docker.Engines.LinuxHyperVEngine.<DoStartAsync>d__14.MoveNext() 場所 C:\workspaces\stable-2.4.x\src\github.com\docker\pinata\win\src\Docker.Desktop\Engines\LinuxHyperVEngine.cs:行 57
...
```

# 解消方法

```json:C&#058;\Users\&lt;username&gt;\AppData\Roaming\Docker\settings.json
"overrideProxyExclude": null,
```
↓

```json
"overrideProxyExclude": "",
```

# 参考

* [Docker fails to start after update on 2020-09-30 (today) · Issue #8724 · docker/for-win](https://github.com/docker/for-win/issues/8724#issuecomment-701982160)
【Android】EditTextにペースト時、指定文字のみをペースト(バリデーションチェック)

コピー元に、ペーストしたい文字とペーストしたくない文字が混じっていた場合、テキスト入力エリアにペーストしたい文字のみをペーストしたい時。

例：
指定文字をカタカナとすると、
「このイヌの名前はポチです」この文をコピー・テキスト入力エリアにペースト→「イヌポチ」がペーストされる


### 1. 特定の文字のみ出力するフィルターの作成

例として、全角カタカナのみを対象にする。

やっている処理としては、指定文字以外の文字を消去して(""に置き換えて)出力する。

```kotlin
class KatakanaInputFilter : InputFilter {
   override fun filter(source: CharSequence, start: Int, end: Int, dest: Spanned, dstart: Int, dend: Int) =
         "[^ァ-ヶ]".toRegex().replace(source, "")
}
```

### 2. フィルターのセット

```kotlin
edit_text.filters = arrayOf<InputFilter>(KatakanaInputFilter())
```
Win10 1909 でも WSL2 を使いたい！

Windows 10 1903/1909 でも WSL2 が使えるようになったとのことで、Docker Desktop を使ってる身としては早いところ Hyper-V から WSL2 に乗り換えたい…というわけで、乗り換え手順のメモ。

※もう似たような記事がたくさん出てますが(滝汗; …まぁ自分用ということで。

# 1. WSL 機能を有効化します。

PowerShell プロンプトを管理者モードで開いて、下記の2コマンドを打ちます。

```Powershell
dism.exe /online /enable-feature /featurename:Microsoft-Windows-Subsystem-Linux /all /norestart
dism.exe /online /enable-feature /featurename:VirtualMachinePlatform /all /norestart
```

実行し終わったら再起動します。

```Powershell
Restart-Computer
```

# 2. (環境によっては必須) [KB4566116](https://www.catalog.update.microsoft.com/Search.aspx?q=KB4566116) を適用します。

個人の開発環境なら WindowsUpdate も最新状態でしょうからたぶん適用済みでしょうが、会社の環境で WSUS で統制されていたりすると必ずしも適用されません。このパッチを適用しておかないと手順 4. で実行する `wsl --set-default-version 2` が「コマンド ライン オプションが無効です」と怒られるので、未適用の場合は上記リンクから自分の環境用に適切なものをダウンロードして適用します(実行完了まで数時間かかる場合があります)。実行完了すると再起動を求められるので、素直に再起動します。

# 3. WSL2 Linux kernel を更新します。

[最新版の WSL2 Linux カーネル](https://docs.microsoft.com/en-us/windows/wsl/wsl2-kernel) をダウンロードしてインストールします。

# 4. WSL のバージョンをセットします。

PowerShell プロンプトを管理者モードで開いて、下記のコマンドを打ちます。

```Powershell
wsl --set-default-version 2
```

# 5. (オプション？) Microsoft ストアからお好きな Linux ディストリビューションを入手します。

Ubuntu でも Debian でも。

# 6. (オプション？) Docker Desktop を使ってる人は WS2 integration を有効化しましょう。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180213/764a0dbd-280e-1102-0f27-343059e1e6ed.png)

画面右下の Apply & Restart ボタンを押して、完了！

参考： https://cybergav.in/2020/08/28/wsl2-on-windows-10/
svgでどうやってパイチャート（piechart）を作ってるのか？

[How to Create an SVG Pie Chart—Code Along with Kasey (Video)][1]
ですごく丁寧に説明されている。

https://www.youtube.com/watch?v=XEUCs7Sh8FI
このyoutubeはとても良くわかる。

[1]: https://seesparkbox.com/foundry/how_to_code_an_SVG_pie_chart
Rでreset index

　初投稿です。

　ほぼ自分用のメモです。Rでreset index をしたかったのですが、pandasみたいに用意されてなさそうなので調べました。使うのはpcrの日別検査数(https://www.mhlw.go.jp/content/pcr_case_daily.csv)

```R:
pcr <- read.csv(file="dataset/pcr_case_daily.csv",fileEncoding="CP932")
pcr_refined=subset(pcr, subset= A!=0) # 国立感染症研究所の検査数が0のデータを除く

#出力結果
#116 2020/6/12  42 1061 1286  3663 1355  559
#117 2020/6/13  41 1183 1148  3952  394  272
#119 2020/6/15   3  878  598  3375 1256  757
#121 2020/6/17  40  771 1150  4242  963  493
#122 2020/6/18  86  838  997  3948  939  631
#123 2020/6/19   3 1173  966  3474 1278  628
#127 2020/6/23  80  818 1054  3648 1069  643
#128 2020/6/24  25  789 1024  4803 1111  585
```
　国立感染研究所はコロナウイルス感染拡大の初期段階に検査をたくさんしてましたが、最近は他の医療機関での検査が増えています。そのため後ろの方のデータになると、インデックスに抜けが多く見られるようになります。

　さて、本題ですが、このdataframeでreset index をしたいわけですが、あまり決まった方法がなさそうです。以下の方法を試したら、楽にindexを揃えられることがわかりました。

```R:
rownames(pcr_refined)=NULL #reset indexはこれ
pcr_refined

#出力結果
#88  2020/6/12  42 1061 1286  3663 1355  559
#89  2020/6/13  41 1183 1148  3952  394  272
#90  2020/6/15   3  878  598  3375 1256  757
#91  2020/6/17  40  771 1150  4242  963  493
#92  2020/6/18  86  838  997  3948  939  631
#93  2020/6/19   3 1173  966  3474 1278  628
#94  2020/6/23  80  818 1054  3648 1069  643
#95  2020/6/24  25  789 1024  4803 1111  585
```

以上です。
ググる・検索力を上げるためのチートシート

# 1 検索用語関連
## 1.1 範囲を狭めながら検索
### 1.1.1 方法
1. まず思いつくキーワードで検索する(検索語を探すための検索を試みる)
2. 検索結果でより最適なキーワードが出てきたら、キーワードを切り替える。
3. キーワードの類語で検索(CSS センター揃え→ CSS 中央揃え)
4. 言語名＋やりたいこと(CSS　真ん中揃えにならない)
5. 言語名＋できないこと
6. 「やり方」「方法」等の言葉を入れる(CSS margin やり方)

### 1.1.2 意識
1. 一度で目的のものが見つかるとは考えず、範囲を狭めながら検索していく。一発目で当たりを引くことにこだわらない。まずはニアピンをゆるく探して、それから少しづつ絞っていく。思いついたキーワードを入れて検索し、はずれても気にしないのがポイント。焦ったら負け。
2. 10〜15分でググって見つからなかったら、諦めて他の手段を検討する(その技術とは別の技術を使う方法を考える。その技術を使わなくても問題がないような代替案を考える)
3. コツは、いち早く、その機能なりモノなりの正式名称を見つけ出すこと。正式名称さえわかれば、あとは大体なんやかんやで情報が出てくる。


## 1.2 英語で検索

1. 日本語の検索キーワードを英語に直し、検索して出てきた英語ページをGoogle翻訳などを駆使して読む(TOEIC400-500でも日本語で検索していた時よりも解決率は高い)
2. リファレンスサイト名をひっつけて検索する(MDN JavaScriptなど)
3. 定番の英語フレーズを知っておく

定番の英語フレーズ

| 英語 | 意味 |
| ---- | ---- |
| how to ～ | ～の仕方、～する方法 |
| ～ not working | ～が動かない、～が動作しない |
| cannot ～ | ～できない |
| what is  ～ | ～とは何？（定義など） |
| why ～ | なぜ～なのか、～なのはなぜ？ |
| difference (between) A (and) B | AとBの違い |
| enable/disable ～ | ～を有効/無効にする（方法） |
| is it possible ～ | ～は可能？ |
| best ～ | ～に関するランキングネタにヒットしやすい |
| alternative ～ | ～の代替（代わりになる手段） |



## 1.3 検索の小技
1. or検索
2. ""検索
3. 「-」検索
4. ワイルドカード検索 *
5. 日付指定
6. site:コマンドで任意のサイトを除外(アフィなど信頼性のない情報)
7. related:一次情報など特定サイトの関連ページを検索
8. link:特定のURLにリンクしているサイトを知りたい時 
9. DEFINE:単語の定義を知りたい時
10. 英語検索
11. 画像検索
12. バージョンを含めて検索(SQLServerについてであれば、SQLServer2016)


# 2 重要な情報源
## 2.1 「公式ドキュメント」
信頼性:★★★★★

可読性:★

時間(短期):★★★

時間(長期):★★★★★

概要：
* 正確な一次情報（公式ドキュメントやリファレンス）。
* Qiitaや個人ブログは所詮片手間で書いた二次情報なので、公式ドキュメントよりは信頼性に欠ける。
* 公式ドキュメントを読み込むことで正しい情報の勘所が押さえられ、準一次情報を見分ける精度が上がる。
* 英語で記載されている場合が多いので、Google翻訳して読むか英語力を高める必要がある。


## 2.2 「英語の文献」
信頼性:★★★★★

可読性:★

時間(短期):★

時間(長期):★★★

備考：
* プログラミングは英語で出来ている言語で世界中に話者がいるため、日本語ソースより量が多い。故に問題が起きた際に解決までのスピードは早くなる。
* Google翻訳して読む



# 3 検索力を鍛える
## 3.1 概要
エンジニアの技術力・実力は「調査力」に比例する。なぜなら調査力が身に付けば質の高い情報を短時間で取得できるため。そして、学ぶサイクルを回すのも早くなることから他のエンジニアに比べて成長度合いが早くなる。

## 3.2 方法

### 3.2.1 調べている内容を頭の中で想像する

「調べた結果をどう使えばいいのか」をシミュレーションすること。「これをすればこうなるな」といったように、想像力を働かしながら答えを探さないと、同じようなサイトをグルグル回って時間ばかりかかるため。

### 3.2.2 短時間で信頼性のある情報源に辿り着く
「雑多な情報の中から正解を選び出す力を磨く」(正解のない状態でも迅速に信頼できる情報源を見抜けるため、時短で実装できる)
#### 方法
1. 正確な一次情報を探す(公式ドキュメントやリファレンス)
2. 一次情報でない情報の正確性を見抜くスキルを伸ばし、準一次情報が載っているサイトを探す(方法：公式ドキュメントを読み込む)(コツ：参照リンクが一次情報、使用している単語を正確に記述するようにしている)

#### 公式ドキュメント以外で信頼性の高い人の記事はどんな記事かを見極めたい
→「想像力」を磨く。具体的には「自分が知りたいことを知っている本当に信頼できる専門家がもしwebに何か書いてくれているとしたら、その人はどんな言い回し、単語で作文するだろう？どんなワードを使って話をしているのか」「知識は生半可なままアフィリエイト狙いで文章を書き飛ばしている人が多用しやすい（あるいは思いつかない）キーワードはないだろうか」といったこと

> 基本的に、公式以外の情報は「眉唾」だと思ってください。なので注意は必要ですが、注意さえしていれば「見ればわかる」ようなダメなところ以外では有益な情報も多いです。私も、個人のブログやQiitaなどに助けられることはよくあります。あとは、ある程度規模が大きくて、信頼でき親切なサイトをいくつか覚えておくと良いです。検索に引っかかったときに優先的に見るという判断ができます。

# 参考文献

https://teratail.com/questions/295129

https://teratail.com/questions/64358

https://nanashilog.com/ggr/

https://qiita.com/sta/items/7f600ac5497f81173fc7
小ネタ：numpyのflattenのメカニズム

numpyのndarrayをflattenすることがよくあるのですが、データがどのような順番で並ぶのかをきちんと理解してみます。


(3, 3, 3)のndarrayを作成。どの位置にどの値が割り当てられているかわかるように、値に連番で付与する。

```py
import numpy as np

x = np.array([[[ 0,  1,  2], [ 3,  4,  5], [ 6,  7,  8]], 
              [[ 9, 10, 11], [12, 13, 14], [15, 16, 17]], 
              [[18, 19, 20], [21, 22, 23], [24, 25, 26]],])
print(x.shape)
```

```:out
(3, 3, 3)
```


これを`np.flatten()`すると、どのように一次元に配置されるかを見てみます。

```py
x.flatten()
```

もっともネストが深いところを順番に取って、１次元に並べていることがわかりました！割と直感的ですね。

```:out
array([ 0,  1,  2,  3,  4,  5,  6,  7,  8,  9, 10, 11, 12, 13, 14, 15, 16,
       17, 18, 19, 20, 21, 22, 23, 24, 25, 26])
```

短いですが以上です！
GaussianでMP2計算がうまくいかない時の対処法

# 概要
GaussianでMP2の計算をしたところ、`Link died`と出て、いきなり計算が止まってしまった。対処法が見つけにくかったので、備忘録としてまとめておきます。（記事に間違いがあればご教授ください）

## 前提条件
Gaussviewを用いてインプットファイルを作成し、MP2の計算をGaussianにサブミットした。

### 実行環境
- Windows10
- CドライブにインストールしたGaussian
- Gaussviewを使って、ジョブファイルを作成

### 症状
GaussianのLink 906というところで、大量のファイル書き出しが起こり、Cドライブを埋め尽して計算が停止する。

## 原因
MP2計算では、計算中にGaussianが作るスクラッチファイル(.rwf)の容量が非常に大きくなる。デフォルトでは、スクラッチファイルはGaussianのディレクトリ内(C:/g16w/Scratch/)に作成されるが、Cドライブの容量が足りないと入りきらずに計算が途中で止まってしまう。
なお、計算が異常終了するとスクラッチファイルは自動で削除されないので、Cドライブが圧迫されたままになる。

## 対処方法
計算設定ファイル(.gjf)で
`%chk= <>` 
の行の上に以下の行を追加する。

```
%RWF= <容量の大きいディレクトリ\スクラッチファイル名.rwf>
%NoSave
```
ディレクトリ名とスクラッチファイル名は任意（ただし、2バイト文字は使えない）

## 結果
.gjfに以下の行を追加したところ、計算が正常に終了した。
予め、Eドライブに `E:\gaussian\scratch` というディレクトリを作成した。

```
%RWF= E:\gaussian\scratch\scratch.rwf
%NoSave
```
## 余談
`%NoSave`を追加しなければ、スクラッチファイルが消されずに残る。試しに残してみたところ、今回は200GB程度のスクラッチファイルが生成しました。（Job TypeはEnergyで300 electronsくらいの計算）

デフォルトのままCドライブに作成されてしまうと、256GBや512GBのストレージだと厳しいかもしれません。

## 参考
https://computational-chemistry.com/top/blog/2017/04/07/gaussian-scratch/
Apache RoyaleでHelloWorldアプリを作る

# はじめに

Apache Royale を使って、Hello Worldを表示するWebアプリを作成します。
IDEは利用せずに、コマンドプロンプトにてコンパイル等を行います。

## アプリの完成イメージ

![test.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102121/e8dc9c1b-6605-9bf5-99d4-fa048d81a5f2.png)

## 試した環境/バージョン

Windows 10
Chrome 105
Apache Royale 0.9.8

# 環境作成

以下から、apache-royale-0.9.8-bin-js.zipをダウンロード
https://github.com/apache/royale-asjs/releases

ダウンロードしたzipを解凍
（今回はD:\apache-royale-0.9.8-bin-jsに解凍）

# Hello World アプリの作成、実行

## mxmlの作成

アプリの画面デザインをMXMLで、処理をActionScriptで記述する
srcフォルダーを作成し、その下に以下のMain.mxmlを作成する

```mxml:Main.mxml
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.apache.org/royale/spark"
               xmlns:mx="library://ns.apache.org/royale/mx"
               width="100%" height="100%">

    <fx:Style>
        * {
            font-family: "Meiryo";
        }
    </fx:Style>

    <fx:Script>
        <![CDATA[
            import mx.controls.Alert;

            private function showMessage():void {
                Alert.show("Hello World");
            }

        ]]>
    </fx:Script>

    <s:Label left="10" top="10" text="Click the button."/>
    <s:Button left="10" top="40" label="Click Me" click="showMessage();" />

</s:Application>
```

## コンパイル（デバッグ用）

コマンドプロンプトで以下を実行するとbinフォルダーが作成される

```
> D:\apache-royale-0.9.8-bin-js\royale-asjs\js\bin\mxmlc +configname=flex -debug=true -source-map=true src\Main.mxml
```

## アプリのデバッグ

ブラウザーでbin\js-debug\index.htmlを開くと画面が表示される

ChromeのデベロッパーツールのSourcesタブでMain.mxmlを開き、ブレークポイントを指定する等してデバッグすることが可能

## コンパイル（リリース用）

コマンドプロンプトで以下を実行するとbinフォルダーが作成される

```
> D:\apache-royale-0.9.8-bin-js\royale-asjs\js\bin\mxmlc +configname=flex -js-dynamic-access-unknown-members=true src\Main.mxml
```

※リリース用のコンパイルは少し時間がかかります。

## アプリの実行

ブラウザーでbin\js-release\index.htmlを開くと画面が表示される

とりあえず今回はここまで
kotlinの拡張(Extensions)で遊ぼう

# つくってあそぼ
kotlinの拡張関数が面白くて最高だ。
取り敢えず最初に作ったのはおねんね機能。

```hoge.kt
fun Int.secondsSleep() {
    TimeUnit.SECONDS.sleep(this.toLong())
}

// 5秒おねんね
5.secondsSleep()
```

文法的には```SleepFor(5).seconds()```とかの方が普通なんだろうけど、そんなのどうでもいいよね。世界が俺に合わせろっての。文法を変えたらいいよ。

今度はファイル操作とかやってみよ。

```hoge.kt
fun String.create() {
    File(this).createNewFile()
}

fun String.delete() {
    File(this).delete()
}

fun String.exists(): Boolean {
    return File(this).exists()
}

fun main() {
    "testFile".create()
    println("testFileできた？ ${"testFile".exists()}")
    "testFile".delete()
    println("testFile消えた？ ${"testFile".exists()}")
}
```

カレントにtestFileというファイルを作って消すだけ。

```実行結果.
testFileできた？ true
testFile消えた？ false
```

面白いよなこれ。クラスを静的に拡張する事もできるんだよね。

```hoge.kt
class Base

fun Base.hello() {
    println("こんにちはExtensions")
}

fun main() {
    Base().hello()
}
```

# もっと色々やってみよう
```hoge.kt
fun (()->Boolean).waitForTrue() {
    while(!this())
        1.secondsSleep()
}
```

こんなんどうかなー。
trueを待ちましょうって。

```hoge.kt
fun main() {
    var flag = false
    val isFlag = { flag }

    GlobalScope.launch {
        println("5秒待機開始")
        5.secondsSleep()
        println("5秒待機終了")
        flag = true
    }

    time = measureTimeMillis {
        println("trueを待つぞ")
        isFlag.waitForTrue()
        println("trueを待ったぞ")
    }

    println("5秒経過してるはずだが・・・？ $time ms")
}
```

```実行結果.
trueを待つぞ
5秒待機開始
5秒待機終了
trueを待ったぞ
5秒経過してるはずだが・・・？ 5005 ms
```

**うお、なにこの言語気持ちいい。思った通りに動きやがる。**
これもっと行数を絞って書いてみるか。

```hoge.kt
        println("trueを待つぞ")
        { flag }.waitForTrue()
        println("trueを待ったぞ")
```
あれ？ この部分がコンパイルエラー・・・
ああ、なるほど。```println("…") { ```←このスコープの始まりが曖昧なのか！

```hoge.kt
        println("trueを待つぞ")
        ;{ flag }.waitForTrue()
        println("trueを待ったぞ")
```
セミコロンを置いて切ってあげればいいのね。なるほどねー。
というかprintlnはいらないや。セミコロン汚いし。

```hoge.kt
    var flag = false

    GlobalScope.launch {
        5.secondsSleep()
        flag = true
    }

    println("5秒経過してるはずだが・・・？ ${measureTimeMillis {
        { flag }.waitForTrue()
    }} ms")
```

これも期待通りに動いた。よしよし。

# もっと遊んでみよう
```hoge.kt
fun (() -> (() -> Boolean)).どうなる() {
    println("どうなる？ this(): ${this()}")
    println("どうなる？ this()(): ${this()()}")
}
```

これどうなるかな？

```hoge.kt
fun main() {
    { { true } }.どうなる();
    { { false } }.どうなる()
}
```

```
どうなる？ this(): () -> kotlin.Boolean
どうなる？ this()(): true
どうなる？ this(): () -> kotlin.Boolean
どうなる？ this()(): false
```

おお、これも期待通りだなあ。

# waitForTrueを拡張できないかな？

```hoge.kt
fun main() {
    { false }::waitForTrue.abc()
}
```

こんな事できないかな・・・？
どう書けばいいんだろ（暫く試行錯誤）

```hoge.kt
private fun Function<Unit>.abc() {
    println("abc $this")
}
```

これでどうなるかな。

```
abc fun () -> kotlin.Boolean.waitForTrue(): kotlin.Unit
```

なるほど・・・
でもFunction<Unit>じゃなんでも食うよな。

```hoge.kt
;{ true }::waitForTrue.abc()
;{ true }::waitForTrue::abc::abc::abc::abc::abc.abc()
```

```
abc fun () -> kotlin.Boolean.waitForTrue(): kotlin.Unit
abc fun kotlin.Function<kotlin.Unit>.abc(): kotlin.Unit
```

だよね。流石にこれは限定できないかなー。

# という事で
楽しかった。
だからなんだって話なんだけどね、てへへ。
online-judge-toolsをインストールしたのにcheck-ojで認識されないときに30秒でできる解決法

## 想定条件
atcoder-cliおよびonline-judge-toolsをインストール済み

未インストールの方は[こちら](https://qiita.com/Adaachill/items/3d4ddad56c5c2cc372cd)を参考にしてください。
### 私の環境
Ubuntu18.04
## 背景
atcoder-cliとonline-judge-toolsをインストールしたのに、
check-ojで`online-judge-tools is not available.`って出る！

oj -hでは確かにインストールされていることが確認できるのに、なんでー！？
## 解決法
簡潔に言うと、
「バイナリファイル`oj`を見えるところにコピーする」
ってだけです。

必要なステップはたったの3つ。
3回コマンドを叩くだけでOK！

ホップ・ステップ・ジャンプ！
Ready! Steady! GO!
それではいきましょう！

※以下のコマンドはすべてホームディレクトリ（cdコマンドのみで戻るところ）で叩いているものです。
### ① ： `find`コマンドでバイナリファイル`oj`がある場所を見つける。

```
find ./ -name "oj" -type f
```
私の場合は、`~/.local/bin/oj`と出力されましたので、
`~/.local/bin/`以下にあるということですね。
### ② ： ホームディレクトリ以下に`bin`というディレクトリを作る。

```
mkdir bin
```
### ③ ： ①ででてきた場所の`oj`を`bin`ディレクトリの中にコピー

```
cp ~/.local/bin/oj bin/
```
### 以上！
最初からの流れをまとめると、
下図のような感じになります。

赤線のように
`online-judge-tools is available. found at:
/home/<username>/bin/oj`
と、
check-ojが識別してくれるようになりました！
（文字小さくて申し訳ないです。）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/440679/23018f2e-1997-832e-bbb6-239d9fd4fcb6.png)


## 考察
どうやらonline-judge-toolsがcheck-ojでは探せないところ（私の場合は`~/.local/`以下）にインストールされていると。

ちょっと調べたら、アクセス権限を付与とかなんとかすればできるようになるらしいですね。

でも、ま、めんどくせーし。
この方法のが早くて簡単でわかりやすい。

それにぼくむずかしいことわかんない！

ということで、
この記事はこんなところで。

同じところでつまづいているAtCoder入門者の同士諸君、頑張って一緒に精進していきましょう〜！
では。
BigQueryのbqコマンドメモ

BigQueryをbqコマンドから操作できるので、よく自分が使うコマンドをメモします。

#### テーブルの詳細情報の確認
```
bq show my-project:samples.test_tbl

Last modified         Schema       Total Rows   Total Bytes   Expritation   Time Partitioning  Clustered Fields  Labels
---------------- ---------------- ------------ ------------- ------------- -------------------- ------------------ -------
12 Sep 10:20:30   |- id: string    12345678     91011121314  
                  |- col1: integer
                  |- col2: integer
```

#### データセット配下のテーブル一覧出力
```
bq ls -n 1000 --format=pretty bigquery-public-data:samples

+-----------------+-------+--------+-------------------+------------------+
| tableId         | Type  | Labels | Time Partitioning | Clustered Fields |
+-----------------+-------+--------+-------------------+------------------+
| github_nested   | TABLE |        |                   |                  |
| github_timeline | TABLE |        |                   |                  |
| gsod            | TABLE |        |                   |                  |
| natality        | TABLE |        |                   |                  |
| shakespeare     | TABLE |        |                   |                  |
| trigrams        | TABLE |        |                   |                  |
| wikipedia       | TABLE |        |                   |                  |
+-----------------+-------+--------+-------------------+------------------+
```

| オプション | 説明 |
|:-:|:-:|
| --max_results または -n  | 出力結果の最大数を指定 <br> デフォルトは50  |
| --format  | 結果の出力形式を指定 <br> pretty: フォーマットされたテーブル  |


#### クエリを実行する（例：テーブル作成）
```
bq query --nouse_legacy_sql 'create table if not exists `my-project:samples.test_tbl`'
```

#### クエリを実行する（例：SQLファイルの実行）
```
bq query --project my-project --use_legacy_sql=false "`cat sample.sql`"
```

| オプション | 説明 |
|:-:|:-:|
| --nouse_legacy_sql <br> または <br> --use_legacy_sql=false | 標準SQLクエリを使用  |
| --use_legacy_sql  | レガシーSQLを使用  |

#### テーブルをコピーする
```
bq cp my-project:samples.test_tbl_a my-project:samples.test_tbl_b 
```

#### タイムトラベル機能で特定時点のテーブルに復元
```
bq cp -f [データセット名].[テーブル名]@-[現在時刻からの相対オフセット] [データセット名].[テーブル名]

# 例えば、データセット「samples」のテーブル「test_tbl_a」を1時間前の状態に復元したい場合は以下のコマンド
bq cp -f samples.test_tbl_a@-3600000 samples.test_tbl_a
```

　
参考：https://cloud.google.com/bigquery/docs/reference/bq-cli-reference?hl=ja
【Android】エミュレータのカメラで画像ファイルを表示させる

すぐ忘れそうなのでメモ。

```
1. 右下の"・・・"ボタン -> Camera -> WallとTableで画像を選択
2. Emulator上でCamera を起動 -> Alt + Mouseで方向転換 -> Alt +Wで前に進み、扉が開いている部屋（ダイニング）に移動
```

（ダイニングに移動するのを忘れそう）
GithubのPullRequestで、自動生成されたファイルなどのdiffを非表示にする

PullRequestのチェック時に自動生成されたコードなどが大量にあるとPull requestのFiles changedがとても長くなり、レビューする人に大きな負荷がかかることがよくあると思います。その解決方法です。


## 方法

githubはPullRequestのPreviewの判定に[github linguist](https://github.com/github/linguist)というものを使用しています。これ自体は、ファイルの種類なのが何かを判定するときに使用されています。テキストファイルと判断されるとpreviewやdiffで表示されますが、バイナリファイルと判断されたものなどはプレビューでは表示されないようになっています。
この設定は、.gitattributesというファイルをプロジェクトのルートにおいておくと、自分で設定が可能で、判定したファイルを[「自動生成したファイル」](https://github.com/github/linguist#generated-code)であるとマークすることが出来ます。自動生成したファイルに設定したものはPullRequestでデフォルトではdiffが表示されなくなるため、File changedが長くなることを抑制出来ます。

## 実際のサンプル

こちらに、実際に作ったPullRequestがあります。
generated/ディレクトリ以下のファイルを全て自動生成ファイルとしてマークしています。
https://github.com/takezoux2/how-to-make-codereview-clean/pull/1/files

generated/gen.mdのファイルがMarkdownファイルであるにも関わらず、デフォルトでは差分が表示されなくなっていることがわかるかと思います。
画像が読み込まれる前にカクつかないようにする(レスポンシブ対応)

imgタグに`width`、`height`を指定しないと、画像が読み込まれる際にカクつくことがある(Jankって言うらしい)

```html
<div class='wrap'>
  <img src='hoge.jpg'>
</div>
```

## widthとheightを指定して解決?
解決するけど、数値を絶対指定しないといけないのでレスポンシブ対応がむずい。

モダンブラウザの最近のバージョンではwidthとheightの数値からアスペクト比を計算していい感じにしてくれるらしいから、最新のブラウザ以外は一瞬崩れるくらい知らん！って割り切りもありかも。

[【2020年夏】imgタグにはwidthとheight属性を書くのがいいらしい  |  Rriver](https://parashuto.com/rriver/development/img-size-attributes-are-back)

```html
<div class='wrap'>
  <img src='hoge.jpg' width='320' height='240'>
</div>
```

## 擬似要素を使って解決
画像と同じ大きさの透明な擬似要素を設置することで、動的に領域を確保することができます。

```html
<div class='wrap'>
  <img src='hoge.jpg'>
</div>
```
```css
.wrap {
  position: relative;
}
.wrap:before {
  content: '';
  display: block;
  background: transparent;
  width: 100%;
  padding-top: 75%;  
}
img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
```
`padding-top: 75%`の部分は画像の縦横比に合わせて調整。
縦/横 × 100%です。


## 参考
- [CSSだけでアスペクト比を固定するテク - Qiita](https://qiita.com/ryounagaoka/items/a98f59347ed758743b8d)
【自分メモ】Macを使っていて周囲から見えてしまう名前の変更

## Memo
Hostnameを変更してシェルのHostnameは変わったのに、
AirdropやBluetoothで周りの端末から「○○のMacbook」のように出てきてしまう。
セキュリティ的に怖い！

ComputerNameを変える必要がある模様。

#### 確認方法
```
% sudo scutil --get ComputerName
○○のMacbook
```
#### 変更方法
```
% sudo scutil --set ComputerName COMPUTER
Password:

% sudo scutil --get ComputerName
COMPUTER
```
Redmine Wiki記法チートシート

# 概要

RedmineのWikiを書く時に知っていると便利なWiki記法をまとめる.

## フォントスタイル

### 太文字

```Textile
*文字列*
```

### 斜体

```Textile
_文字列_
```

### 取り消し線

```Textile
-文字列-
```

### 引用

```Textile
??文字列??
```

### コード(1行)

```Textile
@文字列@
```

### コード(複数行)

```Textile
<pre>文字列</pre>
```

### タグの無効化

```Textile
<notextile>文字列</notextile>
```

## リスト

### 箇条書きリスト

```Textile
* 項目1
** 下位階層項目
* 項目2
```

### 番号付き箇条書きリスト

```Textile
# 項目1
## 下位階層項目
# 項目2
```

## 見出し

```Textile
h1. headline
h2. part
h3. chapter
h4. section
h5. subsection
h6. subsubsection
```

## リンク

### 外部リンク

```Textile
http://foo.bar
```

### 外部リンク(リンク非表示)

```Textile
"文字列":http://foo.bar
```

### Wikiページリンク

```Textile
[[Wiki Page]]
```

### チケットリンク

```Textile
#12
```

## テーブル

### テーブルヘッダ

```Textile
_.
```

### 左寄せ

```Textile
<.
```

### 右寄せ

```Textile
>.
```

### センタリング

```Textile
=.
```

### 列のセル結合

```Textile
\2.
```

### 行のセル結合

```Textile
/2.
```

### 上揃え

```Textile
/2^.
```

### 下揃え

```Textile
/2~.
```

### テーブル全体に色つけ

```Textile
table{background:#000}.
```

### セルに色つけ

```Textile
{background:#000}.
```

## 段落

### 右寄せ

```Textile
p>.
```

### センタリング

```Textile
p=.
```

## 引用

```Textile
bq. 引用文
```

## 目次

### 右寄せ

```Textile
{{toc}}
```

### 左寄せ

```Textile
{{>toc}}
```

## 区切り線

```Textile
--
```

## マクロ

### 子ページ一覧

```Textile
{{child_pages}}
```

### 子ページ一覧(表示階層指定)

```Textile
{{child_pages(depth=2)}}
```

### 別のWikiページの内容を挿入

```Textile
{{include(Wiki Page)}}
```

### 別のプロジェクトのWikiページの内容を挿入

```Textile
{{include(Project Name:Wiki Page)}}
```

### 折りたたみ

```Textile
{{collapose(詳細)折りたたまれる部分}}
```
Java Lambda の入出力型を試してみた〜Stream 編〜

Java Lambda の入出力の型には、いろんなパターンが使えます。

* Map 方式
* POJO 方式
* InputStream/OutputStream 方式

公式ドキュメントでは [ここ](https://docs.aws.amazon.com/ja_jp/lambda/latest/dg/java-handler.html#java-handler-types) に書かれています。

[POJO 編](https://qiita.com/kazfuku/items/095b4fb9c37638f57457) では、POJO クラスを使用して JSON を扱う方法を紹介しました。

最後に、InputStream/OutputStream を使った Stream 編です。

前回の POJO 編に手を加えて、Jackson を使って自前で Parse、Generate するコードになります。

```Java
import com.amazonaws.services.lambda.runtime.Context;
import com.amazonaws.services.lambda.runtime.RequestStreamHandler;
import com.fasterxml.jackson.databind.ObjectMapper;

import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.util.Arrays;
import java.util.List;

public class StreamFunction implements RequestStreamHandler {

    private static final ObjectMapper OBJECT_MAPPER = new ObjectMapper();

    @Override
    public void handleRequest(InputStream inputStream, OutputStream outputStream, Context context) throws IOException {
        Product product = OBJECT_MAPPER.readValue(inputStream, Product.class);

        String name = product.getName();
        System.out.println(name); // orange juice

        Integer price = product.getPrice();
        System.out.println(price); // 1000

        Long releaseDate = product.getReleaseDate();
        System.out.println(releaseDate); // 1601606387939

        Double rate = product.getRate();
        System.out.println(rate); // 4.5

        List<String> rawMaterial = product.getRawMaterial();
        System.out.println(rawMaterial); // [orange, fragrance]

        Product.Size size = product.getSize();
        Integer height = size.getHeight();
        System.out.println(height); // 10

        Integer width = size.getWidth();
        System.out.println(width); // 20

        Integer depth = size.getDepth();
        System.out.println(depth); // 30

        Product response = new Product();
        response.setName("coffee");
        response.setPrice(Integer.valueOf(500));
        response.setReleaseDate(System.currentTimeMillis());
        response.setRate(Double.valueOf(4.2));
        response.setRawMaterial(Arrays.asList("coffee", "sugar"));

        Product.Size responseSize = new Product.Size();
        responseSize.setHeight(Integer.valueOf(100));
        responseSize.setWidth(Integer.valueOf(200));
        responseSize.setDepth(Integer.valueOf(300));
        response.setSize(responseSize);

        OBJECT_MAPPER.writeValue(outputStream, response);
    }
}
```

実行すると、POJO 編と同じ結果になります。

```Json
{
  "name": "coffee",
  "price": 500,
  "releaseDate": 1601627790764,
  "rate": 4.2,
  "rawMaterial": [
    "coffee",
    "sugar"
  ],
  "size": {
    "height": 100,
    "width": 200,
    "depth": 300
  }
}
```

あんまり使うところはなさそうですが、巨大な JSON を扱うときとか、JSON の Parser/Generator のライブラリを使いたいときとかでしょうか。

# 結局どれがいいのか
プロダクトコードなら、保守性から、POJO 方式を使うのがおすすめです。
さくっと動かして試したいだけなら、Map 方式が楽でしょう。
GCPのVMインスタンスにrootでログインする方法

## はじめに
GCP上のGCEでVMインスタンスを作成した場合、デフォルトではGCPアカウント名のユーザーでSSHログインすることになる。
このユーザーではパッケージインストールなどの度に `sudo` コマンドが必要となり面倒なので、本記事ではrootユーザーでログインする方法をメモとして残しておく。


## 実行環境
【GCP VM環境】
　　・Ubuntu20.04 LTS
　　※前提として、VMインスタンスは作成済みとする。

## 手順

１．rootユーザーでのログインを許可する
２．Cloud Console からrootユーザーでログイン


### １．rootユーザーでのログインを許可する


以下のコマンドよりconfigファイルを編集して、`PermitRootLogin yes` を追記する

```
$ sudo nano /etc/ssh/sshd_config
```
```shell:/etc/ssh/sshd_config
~~~省略~~~~~~~~~~~~~
#LoginGraceTime 2m
PermitRootLogin yes
#PermitRootLogin prohibit-password
~~~省略~~~~~~~~~~~~~
```

設定を反映させるために、サービスの再起動

```
$ sudo systemctl restart sshd
```



### ２．Cloud Console からrootユーザーでログイン

[Cloud Console]を立ち上げる。
![Qiita-no011_img01.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/654767/155b181e-29e8-59f9-1a8a-d2bb10e57867.jpeg)
以下のコマンドを実行。

```
$ gcloud compute ssh --project [project_id] --zone [zone] root@[VMインスタンス名]
```

**以上でログイン完了！**

### ■補足
作業が終わったら忘れずに `PermitRootLogin no` に変更しておく。

```
$ sudo nano /etc/ssh/sshd_config
```
```shell:/etc/ssh/sshd_config
~~~省略~~~~~~~~~~~~~
#LoginGraceTime 2m
PermitRootLogin no
#PermitRootLogin prohibit-password
~~~省略~~~~~~~~~~~~~
```

```
$ sudo systemctl restart sshd
```
「もっとプログラム脳を鍛える数学パズル」_Q17 (code:Ruby) -> Rust

[「もっとプログラマ脳を鍛える数学パズル」](https://www.shoeisha.co.jp/book/detail/9784798153612)をRustで書き直すのは、ボケ防止にちょうど良いかもしれない、と思った。

# Q17:グループで乗るリフト

## Ruby

p.092の解答例。

```ruby:q17.rb
MEMBER, LIFT = 32, 6

@memo = {0 => 1, 1 => 1}
def board(remain)
    return @memo[remain] if @memo[remain]
    cnt = 0
    1.upto(LIFT) do |i|
        cnt += board(remain - i) if remain - i >= 0
    end
    @memo[remain] = cnt
end
puts board(MEMBER)
```

## Rust

```rust:main.rs
use std::collections::HashMap;

fn main() {
    let mut q17 = Q17::new();
    println!("{}", q17.board(6, 32));
}

type PassengersWaitingForBoarding = i64;
type Patterns = i64;

struct Q17 {
    memo: HashMap<PassengersWaitingForBoarding, Patterns>,
}

impl Q17 {
    pub fn new() -> Q17 {
        let mut q17 = Q17 {
            memo: HashMap::new(),
        };
        q17.memo.insert(0, 1);
        q17.memo.insert(1, 1);
        return q17;
    }

    pub fn board(&mut self, number_of_seats: i64, passengers_waiting_for_boarding: i64) -> i64 {
        match self.memo.get(&passengers_waiting_for_boarding) {
            Some(pat) => return *pat,
            _ => {
                let patterns = (1..=number_of_seats).fold(0, |cnt, passengers| {
                    if passengers_waiting_for_boarding - passengers >= 0 {
                        cnt + &self.board(number_of_seats, passengers_waiting_for_boarding - passengers)
                    } else {
                        cnt
                    }
                });
                &self.memo.insert(passengers_waiting_for_boarding, patterns);
                return patterns;
            }
        }
    }
}
```

集計を`fold()`で実装してみた。`let mut cnt = 0;`がなくなるのはいいけれど、イマイチ見やすくはならない感じ。
iOS14で通知のリクエストができない不具合の解決方法

# 不具合の内容

iOS13まで通知許可のリクエストやPush通知の表示ができていたアプリ。
iOS14にあげたところ、Push通知が表示されなくなりました。
アプリを新しくインストールし直すと、通知許可のリクエストすらできない始末。

私の場合、本番でしか発生しませんでした。

# 原因

https://developer.apple.com/forums/thread/660648

`ProductName`がカタカナだった。

debug, stg, releaesと環境ごとに設定を分けてました。
debug, stgの`ProductName`は半角英字だったのに対し、release用の`ProductName`は全角カタカナでした。
これは環境ごとに端末に表示されるアプリ名を変えたかったがためです。

これを半角英字にしたところ、正常に通知のリクエストやPush通知が表示されました。

アプリ名についてはinfo.plistで`Bundle display name`を設定し、そこに`Build Settings`の`User-Defined`で定義したアプリ名をセットしました。

# Appleに問い合わせ

`ProductName`を変更することから、なかなか影響が見えず不安だったので、Appleのテクニカルサポートに問い合わせをしました。
アプリ名とか目に見える部分はわかりますが、`ProductName`がどういうところに使われて、どういう影響が出るのかがわかりません。
特に、今回は通知周りということで、私の実装の範囲ではないところに影響が出ていました。
そこで念のため問い合わせた次第です。


回答を要約すると、

```
・Product Nameは変更しても問題ない
・最近、この不具合がわかった
・一通りテストして大丈夫か確認して
```

とのことでした。

Test Flightで一通りテストして、リリースしました。


# 修正版のiOS14.x

一応、修正版はいつリリースか、どのバージョンかも問い合わせましたが、未定のことでした。

早く治って欲しいです。



ps, Product Nameは英字にしておきましょう。
AWS DataPipelineに関して

## AWS Data Pipelineとは
AWS DataPipelineとはデータの移動や変換を自動化できるウェブサービスになります。DataPipelineは保存場所にあるデータに定期的にアクセスし、必要なスケールのリソースを使用して変換と処理を行っていきます。

## 実際に触ってみる。
それではさっそく触っていきたいと思います。

### ロールの作成
まずは二つのロールを作成します。IAMのロールのところからロールの作成を選択し作成します。![2020-10-02 (2).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/fa589785-0c06-6217-43b5-ed08a2830153.png)
![2020-10-02 (3).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/51db9d42-4527-09fa-af4b-ee538309e818.png)

### DynamoDB テーブルの作成
DynamoDBに以下のようなテーブルを作成しました。
![2020-10-02 (4).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/02760da3-49e4-396c-060d-6cb9659e41bb.png)

### S3バケットの作成
DynamoDBデータをエクスポートする先になるS3バケットを作成します。
![2020-10-02 (5).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/7205b568-7a68-044d-d88e-e90615c7f755.png)

### パイプラインの作成

Data Pipelineを作成します。
Name:自分自身で設定
Source：Build using a templateを選択しExport DynamoDB table to S3を選択します
Parameters：ここでDynamoDBにあるS3にExportしたいテーブルを選択し、Export先のS3のフォルダを指定します。DynamoDBのRegionも間違えないように設定をします。
![2020-10-02 (6).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/c1d338f1-6d32-355a-2ead-9adba5154a4a.png)


Pipeline configuration:ここでlogを出力するバケットを指定します。
![2020-10-02 (7).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/5bd75c4d-1248-ecb4-2f7e-58a8621be1a8.png)

Acitveを行いStatusがFinishedになるまで待ちます。
![2020-10-02 (8).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/4fc696fb-ced1-769e-e5f6-42a8cda36e04.png)



### S3にあるか確認する
S3バケットにデータがあるか確認してみます。実際にバケットに移動してみると以下のようなファイルが作成されていました。しっかりとデータが入っているのかを確認するためにエディタで確認してみます![2020-10-02 (10).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/d6ef8d92-5b23-6914-3ed2-c1dcbb1acc19.png)


しっかりとデータが入っているのかを確認するためにエディタで確認してみます。そうするとしっかりとデータがS3にエクスポート出来ているのが分かります。![2020-10-02 (9).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/676443/205eaafd-c92d-61d4-8f0d-0f9cab1fbc81.png)









＜参考資料＞
<a href = 'https://www.yume-tec.co.jp/column/awsengineer/1906'>AWSエンジニア入門：AWS Data Pipelineとは</a>
<a href = 'https://dev.classmethod.jp/articles/cm-advent-calendar-2015-getting-started-again-datapipeline/'>AWS再入門 AWS Data Pipeline編</a>
<a href ='https://dev.classmethod.jp/articles/20190821-dynamodb-s3-export/'>AWS Data Pipeline を使用して DynamoDB データをエクスポートおよびインポートする</a>
IPA 安全なウェブサイトの作り方の所感

#背景
初めて投稿します。
私はITの知識ゼロからエンジニアとして学んでいる、新卒１年目の初心者になります。

研修を通して、WEBシステムについて調べたり、
簡単なログイン機能のあるWEBサイトを作る経験をさせていただきました。
現在は、業務をを通して少しずつ知見を広げている最中になります。

今回は、今まで特に意識していなかった、「セキュリティ」についての学習のため、
IPAの「_安全なウェブサイトの作り方_」という
資料を読んだので所感を綴らせていただきたいと思います。


#安全ウェブサイトの作り方とは
>IPAが届出を受けた脆弱性関連情報を基に、
>届出件数の多かった脆弱性や攻撃による影響度が大きい
>脆弱性を取り上げ、ウェブサイト開発者や運営者が
>適切なセキュリティを考慮したウェブサイトを
>作成するための資料です。

[IPA「安全なWebサイトの作り方」](https://www.ipa.go.jp/security/vuln/websecurity.html)


#読んでみて感じたこと
研修で実装したウェブサイトでは、PHPでMySQLに接続し、
ユーザ名、パスワードやメールアドレス等を操作していました。

私が実装した際にセキュリティ面で考慮したことは
　・HTTPSで通信できるようにする
　・パスワードをハッシュ化してDBに置く
程度で、とりあえず「機能要件を満たす」ということを重視していました。

というのも、クライアントへ操作を求める際（アカウント作成や、ログイン時など）
攻撃される可能性があるということを理解していませんでした。

安全性の低いウェブアプリケーションを実装すると、
個人情報など外部に漏らしてはいけない情報が
インターネット上に晒されている状態になってしまいます。
非常に危険なことだと今は認識しています。


#特に重要だと感じた部分
ここ必要だったな、と感じた部分や、なるほどと思った部分を
自分の学習も兼ねてまとめます。


###SQLインジェクション
SQLインジェクションは、パスワードなど入力時に悪意のあるユーザが、
データベースへ不正な命令文を送信する攻撃です。

危険性としてはこのようなことが挙げられます。
　・DBの情報を見られてしまう 
　・DBの情報の改ざん　
　・ストアドプロシージャ等でOSの操作

ユーザの入力情報をそのままSQLに連結してしまうと、
不正なSQLを実行してしまう可能性があるため非常に危険です。

なので、SQL文に入力情報を使う場合は
情報が入る場所(プレースホルダ)を設定し、割り当て(バインド)する必要があります。
また、特別な意味を持つ記号文字を文字列として認識させる処理(エスケープ)をします。

PHPでMySQLを接続するのにPDOを使ったのですが、意味もあまり理解していませんでした。
しかし、SQLインジェクションによる不正操作を防ぐ役割もあるということが理解できました。


###クロスサイトスクリプティング
クロスサイトスクリプティングは、入力時にスクリプト等を埋め込まれて、
不正な操作をされることです。

危険性としては下記のようなものになります。
　・本来とは異なる表示、スクリプトの実行
　・スクリプトによってCookieを取得されたり、改ざん

クライアントの入力した情報を出力する場合などには
クロスサイトスクリプティングの注意が必要です。

自分の作ったウェブサイトでは、ログイン後のホーム画面に
入力したユーザ名を表示させるという処理をしていました。　　　　　　　
しかし、HTMLテキストのエスケープ処理をしていなかったため、
スクリプトを表示されてしまうという脆弱性が確認できました。

対策として、ウェブページに出力する要素にエスケープ処理を施し、
不正な表示をさせないようにさせる必要があったなと感じています。


###クロスサイトリクエストフォージェリ
クロスサイトリクエストフォージェリは、ログインしたクライアントが、
ウェブサイトに意図しないリクエストをさせられることになります。

危険性としては、これらが挙げられます。
　・ログイン後に利用可能サービスの悪用
　・ログイン後に編集可能な情報の改ざん

cookieやセッションでログイン状態を保持したり、ベーシック認証でアクセス許可する
場合などには注意が必要です。
罠サイトなどでこれらの情報が抜き取られ、攻撃が行われてしまう可能性があります。

対策としては、セッションにワンタイムトークンなどを利用することが挙げられます。
クライアントにhiddenパラメータとして、トークンをPOSTメソッドで送信させ、
セッションと一致するか確認することで、不正なリクエストを判断できます。
またログイン中でも、重要な処理を実行する直前で再度パスワードを求めることや、
リファラーのリンク元を確認などで、不正か判断する方法もあります。

実習では、セッションを利用してログイン状態を判断していました。しかし、
そこでは、ユーザのメールアドレス(ユーザの一意な情報)を使用していました。
これでは、罠サイトにアクセスしてしまった場合、非常に危険だったと反省しています。

加えて、新規アカウント作成時に、メールアドレスが使用済みの場合バリデーションを
表示していたので、使われているかが分かってしまう仕様でした。
もしセッションIDがメールアドレスだと分かっていたら、
成りすましてログインされてしまうという可能性もにも気づくことができました。

#最後に
今まで意識していなかった「セキュリティ」について、
どのような視点から考えればよいのか、という基本的な視点を理解できました。
また、ある脅威に対して、根本的対策だけでなく、保険的な対策をすることで
より安全で安心して利用できるウェブサイトになると分かりました。
今後開発に関わる際には、どんな攻撃を受ける可能性があるか、
考えられる脆弱性はないかという視点も持ちながら
実装できるように学習していきたいと思います。
OS情報を調べる

## Linux

```
# uname -a
Linux aws-2 3.14.48-33.39.amzn1.x86_64 #1 SMP Tue Jul 14 23:43:07 UTC 2015 x86_64 x86_64 x86_64 GNU/Linux
```
```
# file /sbin/init
/sbin/init: ELF 64-bit LSB shared object, x86-64, version 1 (SYSV), dynamically linked, interpreter /lib64/ld-linux-x86-64.so.2, for GNU/Linux 2.6.18, BuildID[sha1]=323b47644cac5cfdaeed808653714728d2650cb3, stripped
```
x86_64, amd64 は64ビット
i386, i686, x86 は32ビット

```
# cat /etc/redhat-release
CentOS release 6.6 (Final)

# cat /etc/issue
CentOS release 6.6 (Final)
Kernel \r on an \m
```
フッターを最下部、コンテンツを上下中央にする

コンテンツが少ない場合でもフッターを最下部にするコードはよく見かけますが、
合わせてコンテンツを上下中央にする場合に悩んでしまったので投稿します。

## HTML

`body` 要素直下に `header`、`main`、`footer` 要素を配置します。

```html:index.html
<body>
  <header>
    <p>ヘッダー</p>
  </header>
  <main>
    <p>メイン</p>
  </main>
  <footer>
    <p>フッター</p>
  </footer>
</body>
```

## CSS

`main` 要素がない場合でも `footer` 要素がページ下部に配置されるようにしてあります。

```css:style.css
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
main {
  flex: 1;
}
footer {
  position: sticky;
  top: 100vh;
}
```

## DEMO

<p class="codepen" data-height="500" data-theme-id="light" data-default-tab="css,result" data-user="taqumo" data-slug-hash="ExKBOKo" 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="フッターを最下部、コンテンツを上下中央">
  <span>See the Pen <a href="https://codepen.io/taqumo/pen/ExKBOKo">
  フッターを最下部、コンテンツを上下中央</a> by Takuya Mori (<a href="https://codepen.io/taqumo">@taqumo</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>
そもそも関数とは？専門用語を使わずに分かりやすく説明するよ！

プログラミングの勉強をしていると、関数や引数など普段生活する上で馴染みの薄いワードがよく出てきます。
そもそも関数や引数とはなんぞや？
今回は、専門用語をなるべく使わずに説明します！

## 定義ってなに？
定義とは、言葉の意味を決めることです！

例えば、
「ファシってすごいよね」という文がある。
この文だけだと、ファシってなに？ってなりますよね。
そこで、

`ファシ = 芸能人`

という定義を与えればこの文を解釈する事ができます。
このように＝（イコール）で意味を与えることを定義するといいます。

そして、定義は共通していないと意味のやりとりをできません。
例えば、
`ファシ = 果物`
と思っている人と
`ファシ = 芸能人`
と思っている人がいたら話が噛み合いませんよね。
このように言葉には、定義が共通していないと解釈が異なってしまうのです。

ではなぜ関数の話をする前に定義の話をしたのでしょうか。

1. まず日本語は自然言語の一種です。
1. 自然言語は言語の一種です。
1. 言語は記号列（文字の集まり）の一種です。

プログラミング言語も、言語なので定義という考え方が使えます。 
この定義という道具がなければ関数というワザが使えないのです！

## 変数ってなに？
変数とは、式に名前をつけることです。

`ファシ = 芸能人`

芸能人という式に、ファシという名前をつけました。
定義の項目で書いた式と全く同じですよね？
「定義する」ということは、プログラミングにおいては変数を作ることなのです。

## じゃあ関数ってなに？
関数とは変数を変換するものです。
どのように変換するかを「関数の定義」といいます。
「関数の定義」があれば「関数の適用」という行為ができるようになります。
「関数の適用」とは次のような記号列の置き換えルールのことです。

### 置き換えルール
`f a = aを使った式`
と関数の定義をしたとき、
`f 式 を aを使った式`
に置き換える。

この置き換えルールをつかえば、`()`を使うことで複数回、式を置き換えれます。

たとえば、`g (f 式A)` は次のように置き換えられます。
fとgの定義を次のようにしたとき

```
f a = 変数aを使った式F
g a = 変数aを使った式G
```
1. g (f 式A)
1. g 変数aを使った式F
1. 変数aを使った式G

と置き換えることが可能です。

## 問題
f ○ = □
と定義したとき、
f ○ 
を置き換えるとどうなりますか？

答えは、□ですね！
単純ですが、これが「関数を定義」ということなのです。

## まとめ
今回の記事をメタ的にいえば、
いま私は、関数という意味を定義したことによってプログラミングによって関数を使えるようになった。
この記事自体が関数の定義なんです。
ってなにいってるか意味不明になってきました^^;
専門用語を使わずに用語を説明するというのは難しいことなのです（たぶん）
【Android Studio】エミュレータのプロキシ設定してインターネット接続 【リモートデバッグ】

# Android エミュレータでプロキシ設定 からの リモートデバッグ
・デフォルトのAndroidWifiではインターネットに接続できない（できるようにしてほしい・・・）
・AVDマネージャにも設定項目があるがうまく行かない場合
・Fiddler随時使ってるので、例によって忘備録です
・ついでにリモートデバッグまでやります

## 環境
・Windows10 64bit
・Android Studio 4
・エミュレータ: Pixel 

## AndroidVirtualDevice (AVD)Manager起動
・VirtualDevice を起動する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/e7109fdb-e711-ba0c-5689-aa7337476485.png)

・言語で日本語の設定（省略）

## エミュレータ設定
・「設定」、「ネットワークとインターネット」、「AndroidWifi」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/420e2c9a-c01c-5d74-d919-29d5c1662746.png)

・「編集」アイコンを押す
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/3d39df9c-b317-bb3d-bd63-a2ccb95630e6.png)

・「詳細設定」、「プロキシ」、「手動」を押す
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/761bb10c-a1ac-6632-9041-9d133e81aaea.png)

・プロキシの設定
・・ホストマシンに設定する場合は　10.0.2.2
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/1bb85efa-b453-2b8c-5fff-3f477c2af42d.png)

## ブラウザを起動
・インターネットに接続できればOK！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/06093e1a-4920-cb5d-4b44-ac152d9d38ff.png)

## エミュレータでデバッグ出来るように設定
・「設定」、「システム」、「エミュレートされた端末について」を押す
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/d4153bfe-d6ae-6e16-d785-d73184c116d6.png)
・「ビルド番号」の所を７回押すと開発者向けオプションが有効になる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/a266a608-f340-91ce-1d4a-91b66b2c0400.png)
・「設定」、「システム」、「詳細設定」、「開発者向けオプション」でUSBデバッグが有効化されているのを確認
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/54058184-c1da-23f3-2c23-3dc7b8eca466.png)


## ホストで chrome 起動
・chrome://inspect/#devices　を開く
・・しばらくすると自動的に接続しているエミュレータが追加される
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/58c91870-d609-3b73-7845-a7b07003875c.png)
・デバッグしたいタブの inspect を押すとデバッグ用のウインドウが立ち上がる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/108113/70b57a83-1990-4431-9258-2ed7590cc1cd.png)
・デバッグし放題！
・・ホストに接続する場合はホストの実IPにすると接続できました。
(10.0.2.2では接続できず、プロキシから見えるIPということですかね)

以上、お疲れさまでした。
Xcodeの複数管理

iOS の開発してると、Xcode って複数使いますよね
Apple の気持ちとしては、Mac App Store で他のアプリと同じように使って欲しいっぽいですけど

# Mac App Store からダウンロードする方式

https://apps.apple.com/jp/app/xcode/id497799835
これって、iPhone とかでアプリをダウンロードするのと同じやり方なんで
新しいXcodeのバージョンが出ると、インストール済みのXcodeを上書きして新しいバージョンにしちゃうじゃないですか
これって困るんですよね

以前のバージョンも保持しておかないと困ること多いし
うっかりアップデートしちゃった日には、元に戻さないと開発が滞っちゃうし

# 直接ダウンロードする

https://developer.apple.com/download/more/?name=Xcode
developer.apple のアーカイブページから直接ダウンロードして
Macに複数のバージョンを置いとく方法。
これが普通ですよね？
自分は `/Applications/Xcodes/12.0/Xcode.app` みたいな感じで並べて管理してます

# パスは？

Mac って暗黙的にXcode を使ってるツールがちょくちょくあります。git を使う時もまず Xcode をインストールしろって言われますし
MacにXcodeのパスを指定するコマンドが用意されてます
まずは現在のパスがどこを指しているか確認。

```sh
$ xcode-select --print-path
```

通常、これは `/Applications/Xcode.app` ってなってます。
普通にインストールしてアプリケーションフォルダに配置した場合はここに置きますよね

でも前述の通りバージョンを自分で管理してるんで、この場所には Xcode がない。
なので、パスを変えることになります

パスを指定するコマンド

```sh
$ sudo xcode-select --switch /Applications/Xcodes/12.0/Xcode.app
```

こうすると、バージョン12.0のXcodeを指すことになります

# 新しいバージョンをダウンロードしたら？

でもこれはこれで困ることが。
さらに新しいバージョン 12.1 をダウンロードしたとき、また上記コマンドを打ってパスを変えないといけないわけです

そこで、常に最新のXcodeを指す `Latest` というリンクを作っておきます

```sh
$ ln -s /Applications/Xcodes/12.0/ /Applications/Xcodes/Latest
```

こうしておいて、

```sh
$ sudo xcode-select --switch /Applications/Xcodes/Latest/Xcode.app
```

Latest に対してパスを設定しておけば、こちらの修正はする必要がありません
新しいバージョンをダウンロードするたびに `Latest` のリンク先だけ変更していればOKです
HMS Account Kitの利用時にHuaweiIdAuthButtonも合わせて使いましょう

# ログイン画面実装時の厄介な作業
Androidのレイアウトの実装時に、開発者がよく直面する問題の一つはUIパーツ実装の厄介さです。たとえば、このボタンの実装は技術的に全然難しくないのに、marginとか、paddingとか、パーツの間隔とか、いろいろ定義しなければならないし、デザイナーによってデザインが微妙に違うし、同じボタンのはずなのに、なぜか各画面ではデザインが統一されていない、といったことがよくあるのではないでしょうか？

HuaweiIdAuthButtonはこういった悩みを解放してくれるHMSの贈り物です。

# HUAWEIログインのボタンデザインは定められている
[HMS Account Kit実装入門](https://qiita.com/Rei_2020/items/81001ffc6299e56401c8)と[HMS Account Kit実装入門（Authorization Code編）](https://qiita.com/Rei_2020/items/3eb5cb484be0cea9c640)でも述べましたが、ファーウェイはこのログインボタンのデザインを細かく定めています。この規定から外れた場合、アプリがAppGalleryの審査に落ちる可能性があります。

デザインについてはこちらをご参照ください。
[HUAWEI ID Sign-In Icon Specifications](https://developer.huawei.com/consumer/jp/doc/HMSCore-Guides-V5/dev-specifications-0000001050048916-V5)

# HuaweiIdAuthButtonとは何か？
AppGalleryの審査を通りたい、でもいろいろ細かい規定がある。どうしよう？と思う方が多くいらっしゃると思います。ファーウェイもこの状況を想定したはずです。ですから、HuaweiIdAuthButtonが提供されていると思います。

HuaweiIdAuthButtonはデザイン規定を適用したログインボタンです。
<img alt="huaweiLoginButton.png" src="https://communityfile-drcn.op.hicloud.com/FileServer/getFile/cmtyPub/011/111/111/0000000000011111111.20200930110614.89153673577679132769540158640830:50510930061339:2800:AB88047AECAB9BAF67822B9AAFF78D52B4A5A769569D5D114DD5E0413FE52B62.png">

# HuaweiIdAuthButtonの使い方

### 前準備
[HMS Account Kit実装入門](https://qiita.com/Rei_2020/items/81001ffc6299e56401c8)に書かれた前準備をご参照ください。

### 実装
XMLレイアウトの実装は次の通りです。

```xml:Layout.xml
<com.huawei.hms.support.hwid.ui.HuaweiIdAuthButton
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	app:hwid_button_theme="hwid_button_theme_full_title"
	app:hwid_color_policy="hwid_color_policy_red"
	app:hwid_corner_radius="hwid_corner_radius_large"
	/>
```

実装はこれだけです。

# 感想
HuaweiIdAuthButtonはデザインをすべて管理してくれるので、開発が楽になるし、開発時間もけっこう短縮できます。HMS Account Kitを実装しているときにHuaweiIdAuthButtonも合わせて使いましょう。

# 参照サイト
HuaweiIdAuthButton Usage Guide : [https://developer.huawei.com/consumer/jp/doc/HMSCore-Guides-V5/huaweiidauthbutton-0000001050179025-V5](https://developer.huawei.com/consumer/jp/doc/HMSCore-Guides-V5/huaweiidauthbutton-0000001050179025-V5)
HUAWEI ID Sign-In Icon Specifications : [https://developer.huawei.com/consumer/jp/doc/HMSCore-Guides-V5/dev-specifications-0000001050048916-V5](https://developer.huawei.com/consumer/jp/doc/HMSCore-Guides-V5/dev-specifications-0000001050048916-V5)
PowerVS IBM i 日記(12): サーバー詳細の編集 - 課金金額の最適化とライセンスの追加購入

# サーバー詳細の編集 - 課金金額の最適化とライセンスの追加購入

「サーバー詳細」に「詳細の編集」という箇所があります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/59f39305-0141-5f2e-fed5-97fb737de6d0.png)

今回は、こちらでできることを確認します。

## 名前、VMピン、プロセッサータイプの変更

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/e008ee79-e4db-0c8f-6da8-8887fe7356cf.png)

ポータルに表示する名前を変更することができます。
ここで変更するのは、あくまでポータルに表示されるもので IBM i 内で使われるシステム名ではありません。

VMピンをどうするかの変更も可能です。
VMピンのモードの説明はこちらです。

https://cloud.ibm.com/docs/power-iaas?topic=power-iaas-power-iaas-faqs#pinning

こんな感じですね。

オフ: なにかあったら自動マイグレーションする。もとのホストが作動状態に戻ってもマイクレーション先でそのまま稼働する。
ソフト: なにかあったら自動マイグレーションする。もとのホストが作動状態に戻ったら、もとのピン留めされたホストに戻ってくる。
ハード：なにかあってもマイグレーションしない。特定のホストのみで稼働する。

プロセッサーのタイプは、VM がシャットダウン中のみ変更できます。

## CPU 数・メモリー量の変更による課金金額の最適化

PowerVS はシャットダウンしても課金が停止しません。
その代わりに、稼働状況に応じて CPU 数やメモリー量を変更することで、課金金額を調整することができます。

稼働中は、起動時の 1/2 倍から 2 倍の範囲で変更できます。
シャットダウン中は、自由な変更が可能です。
(シャットダウン中でも、もともとの値の 1/2 倍から 2 倍の範囲でしか変更できないことがありました。この場合でも、複数回繰り返すことで希望の値にすることができました。)

変更すると、下の部分に変更内容の変更による金額差が表示されます。
同意にチェックをいれると、注文がクリックできるようになります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/a4a1b6dd-71f9-13a5-2aa7-6f7672bbf9cb.png)


## ライセンスの追加購入とキャンセル

PowerVS IBM i には追加購入できる S/W が現在 4 種類用意されています。
ここでは、5770-WDS を 1 ユーザー買ってみたいと思います。

PDM を使ったところ 5770-WDS 5103 で 許可ユーザー 0 に対して超過ユーザー 1 が記録されました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/7dc0b922-982a-bc89-31e6-bc4df3411ed9.png)


5770-WDS の 1 ユーザーラーセンスを指定し注文します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/298086fd-93a2-0d2d-5a7b-2ab35c2c7532.png)

すぐに QSYSOPR にライセンス追加のメッセージが表示されました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/92c26c09-b7c5-9d87-a14b-14493ceb7c33.png)

購入したのは「1」ですが Usage Limit は「*NOMAX」の登録になっています。
もちろん、ライセンスの管理はユーザー側の責任です。「1」を指定して購入した以上、ユーザーの責任で「1」の範囲を守らなければいけません。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/8f64013f-e849-28eb-fbd7-91c9e72d387e.png)

ポータル上にも購入したライセンスが表示されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/78b85d22-3592-c1ee-045d-7526bb9c56ed.png)

では、キャンセルしましょう。

チェックを外します。減額金額が表示されます。注文します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/bf7052ec-7092-8776-5b06-8f4080ad0d29.png)

即時に Usage Limit が「0」に戻りました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/184930/e3fe9f8e-7672-961d-ac4d-8130f6a7ae9a.png)

PowerVS ではサーバーの柔軟が編集が可能です。
賢く無駄なく使いたいですね。

---
2020/10/03 WDS を購入せずに PDM を利用する方法を「[AMT で WDS に課金せずに PDM を利用する](https://qiita.com/6onoda/items/3e4437b71ea24c7d670c)」記載しました。

---
当日記のIndexは[こちら](https://qiita.com/6onoda/items/f146c78c0c1bbe905a42)です。

---
許可の無い転載を禁じます。
この記事は筆者の個人的な責任で無保証で提供しています。
当記事に関してIBMやビジネスパートナーに問い合わせることは、固くお断りします。
【Rails】f.labelのラベル名の変更

# 問題
新規登録画面のユーザー名を入力する項目だけが英語表記の「name」になってしまっているので、日本語表記の「ユーザー名」に変更したい。

# 解決法

```ruby:app/views/devise/registrations/new.html.haml
# before
.field-label
  = f.label :name
  ↓
# after
.field-label
  = f.label :name, "ユーザー名"
```

# どう変わったか
### before
![スクリーンショット 2020-10-02 午後4.24.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/547640/e32effb3-7e36-f187-b91e-153c0c130ffb.png)

### after
![スクリーンショット 2020-10-02 午後4.23.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/547640/474e74ca-8bee-11f1-dd0c-301d69045ef0.png)

# 参考記事
[form.labelの使用方法](https://qiita.com/foot_raming/items/a0c9951365e41d66dac8)
Python OpenCVチュートリアルメモ

http://labs.eecs.tottori-u.ac.jp/sd/Member/oyamada/OpenCV/html/py_tutorials/py_tutorials.html


## OpenCV-Pythonを始めよう

ここはインストールだけだったので省略

## OpenCVのGUI機能

### 画像を扱う
cv2.imread()
cv2.imshow()
cv2.imwrite()

についての軽い説明だけ。他、動画、描画、マウスでのペイント、カラーパレットは省略・

## 基本的な処理
### 画像上の基本的な処理

※ここ重要っぽい

このセクションで仕様する処理はopenCVというよりNumpymに関係しています。最適化されたOpenCVのコードを書くにはNumpyに関する知識が必要になります。

#### 画素値のアクセスと変更方法
カラー画像をimread()で読み込む。
ある画素の行と列の座標を指定することで画素値にアクセス出来ます。
BGR画像の画素値は色成分の値の配列
グレースケールの画像の画素値は明るさの値を返します。

```
>>> px = img[100,100]
>>> print px
[157 166 200] # 座標:x:100, y:100の[B, G , R]の値

#Blueの数値だけほしい場合
>>> blue = img[100,100, 0] # B:0, G:1, R:1
157
```

### 画像の属性情報の取得

```
>>>img.shape()
(342, 548, 3) # 行数、列数、チャネル数(BGR３つ..?)

>>>img.size()　# 画素数

>>> img.dtype # データ型
```

### 画像中の注目領域(ROI)
画像の特定の領域に対して何らかの処理をする必要が生じることがあります。画像中から目を検出するときなら、まずは画像全体に対して顔検出を行い、次に検出した顔の内部で目の検出をしますよね。この方法は精度の工場をするとともに、（目の検出は画像中の一部の領域飲みに益陽すればよくなるため）パフォーマンスの向上にもつながります。
」

```
ball = img[100:150, 200:250] # top:bottom, left:right で切り抜き

img[200:250, 200:250] = ball # コピー 
```

### 画像の色成分の分割と統合
画像の青、緑、赤成分は必要であれば独立した色成分へと分割できます。独立した色成分を統合してBGR画像をもう一度作ることも可能です。

```
b, g, r = cv2.split(img)
img = cv2.merge((b,g,r))
```

あ特定の色成分だけ抽出することができる。
` b = img[:, :, 0] #x軸範囲（全部） y軸範囲(全部) 0=B`
これで全座標のBの数値を配列で取得できる。

設定もできる`[:, :, 0] = 0`