OmniAICreator/Qiita-1.07M huggingface dataset:
スクロール量の変化で何かをする

#背景
デザイナーから依頼があったｗ
スクロールやリサイズを常時監視する系のスクリプトは個人的に嫌いだけど要望なのでいたしかたない・・・。
ロード時には発火しないのでPSIスコアに大きな影響が出なさそうなのがせめてもの救いか！？

##完成形の仕様
- 画面右端中央にページ内リンクのナビゲーションを固定配置
- スクロールしページ内リンクに対応するブロックに到達したら該当リンクに変化（色を変える）をつける

##必要なもの
- 各ブロックのY座標
- スクロール量の監視

##暫定版（とりあえず動くレベル）
```hoge.haml
.nav#js-pageScroll
  %ul
    -(1..5).each do
      %li
        = link_to '' do
          ●
-(1..5).each do |num|
  %div{class: "box#{num}"}
    = num
```
```hoge.scss
@for $i from 1 through 5{
  .box#{$i}{
    height: 500px;
    background-color: #CCC;
    border-bottom: 4px solid #000;
  }
}
.nav{
  display: inline-block;
  width: 60px;
  text-align: center;
  background-color: #F00;
  position: fixed;
  top: 50%;
  right: 0;
  a{
    text-decoration: none;
    color: #333;
    &:hover, &.active{
      color: #FFF;
    }
  }
}
```
```hoge.js
function getCoordinate(target1, target2, target3, target4, target5){
  if(document.getElementById('js-pageScroll') != null){
    var boxes = [target1, target2, target3, target4, target5];
    var boxCoordinates = [];
    boxes.forEach(function(box){
      boxCoordinates.push(document.querySelector(box).getBoundingClientRect().top);
    });
    window.onscroll = function(){
      scrollPosition = window.pageYOffset;
      if(boxCoordinates[1] > scrollPosition){
        document.querySelectorAll('#js-pageScroll ul li a').forEach(function(anchor){
          anchor.removeAttribute('class');
        });
        document.querySelectorAll('#js-pageScroll ul li a')[0].setAttribute('class', 'active');
      }else if(boxCoordinates[2] > scrollPosition && boxCoordinates[1] < scrollPosition){
        document.querySelectorAll('#js-pageScroll ul li a').forEach(function(anchor){
          anchor.removeAttribute('class');
        });
        document.querySelectorAll('#js-pageScroll ul li a')[1].setAttribute('class', 'active');
      }else if(boxCoordinates[3] > scrollPosition && boxCoordinates[2] < scrollPosition){
        document.querySelectorAll('#js-pageScroll ul li a').forEach(function(anchor){
          anchor.removeAttribute('class');
        });
        document.querySelectorAll('#js-pageScroll ul li a')[2].setAttribute('class', 'active');
      }else if(boxCoordinates[4] > scrollPosition && boxCoordinates[3] < scrollPosition){
        document.querySelectorAll('#js-pageScroll ul li a').forEach(function(anchor){
          anchor.removeAttribute('class');
        });
        document.querySelectorAll('#js-pageScroll ul li a')[3].setAttribute('class', 'active');
      }else{
        document.querySelectorAll('#js-pageScroll ul li a').forEach(function(anchor){
          anchor.removeAttribute('class');
        });
        document.querySelectorAll('#js-pageScroll ul li a')[4].setAttribute('class', 'active');
      }
    };
  }
}
getCoordinate('.box1', '.box2', '.box3', '.box4', '.box5');
```

#付記
とりあえず動かすだけのスクリプトなので関数名が変だったり無駄だらけな書き方なのはスルーで。
これからリファクタします。
LambdaのNode.js 10.xでエラー返却時に自動的にCloudWatch Logsへ書き込まれない問題

## update
**2019/06/03に確認したところログへの書き込みは修正されていました！**

`ERROR Invoke Error` というprefixと共に書き込まれていました。エラーの種類でこのあたりは変わるのかもしれません。

![スクリーンショット 2019-06-03 13.45.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1295/82c1f207-1255-372e-2ac3-f12d738756c9.png)


## AWS LambdaのNode.jsランタイムが10.xをサポートしました 🎉
v6系がEoSになってもなかなか来なかったので、どうした事かと思っていましたが自動的な10.x系でのランタイムバージョンアップ機能やAmazon Linux2への対応で時間がかかっていたのでしょう。

# さっそく踏み抜いた

前回 [LambdaのNode.js v8.10でタイムゾーンを指定してもDateがUTCになる問題](https://qiita.com/r_plus/items/96678b432a1f4fdfc318) と同様にさっそく喜び勇んでランタイムを変更したところ不具合を踏み抜きました。

## エラー時の自動的なCloudWatchLogsへの書き込みが動作しない

以下のドキュメントにあるようにエラーを返却するとエラーのstring representationがCloudWatch Logsへ自動的に書き込まれます。
https://docs.aws.amazon.com/lambda/latest/dg/nodejs-prog-model-handler.html

```text
The callback method automatically logs the string representation of non-null values of error to the Amazon CloudWatch Logs stream associated with the Lambda function.
```

が、nodejs10.x環境だと動作しません。以下の再現コードを利用すると

```javascript
exports.handler = async (event) => {
    throw new Error("my error");
};
```

### nodejs10.x

v8.10の時とは内容に若干違いがあるものの、レスポンスにはエラーが返ってきますが下部にあるCloudWatch Logsの方には出力がありません。

![スクリーンショット 2019-05-17 11.13.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1295/29b26ba3-b609-eafc-cc6c-61ace9a3a1f3.png)

### nodejs8.10

nodejs8.10だとCloudWatch Logsにも出力されています。

![スクリーンショット 2019-05-17 11.13.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1295/b25974a2-8f70-5174-365c-b06a1568852d.png)

# 仕様 or 不具合

サポートに問い合わせたところ想定外の挙動で今後修正が予定されるとのことです。仕様変更じゃなくてよかった。

# 修正されるまで

`console.log` での出力は普通にされるので、しょうがないのでcatchしてログ記録してエラーを投げなおすか修正待ちになるかなと。
こんな感じになるでしょうか。美しくないですね。私は修正待ちにしようかと思います。

```javascript
exports.handler = async (event) => {
    try {
        throw new Error("my error");
    } catch(e) {
        console.log(e);
        throw e;
    }
};
```
#bash で実行権限付きのスクリプトを set -x オプションのコマンド詳細表示的なモードで実行する方法

# script.sh

```
#!/usr/bin/env bash

echo "Hey!"
```

直接実行だと -x オプションをつけられない

```
$ ./script.sh
Hey!

```

直接 bash から実行する

```
$ bash -x /tmp/script.sh
+ echo 'Hey!'
Hey!


```


# Original by Github issue

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








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
Mysqlの基本コマンド

#起動
`mysql.serever start`

#ログイン
`$ mysql -u [ユーザー名] -p`
※ユーザ名はデフォルトだと`root`

#データベースの一覧を見る
`mysql > show databases;`
※databaseじゃなくてdatabase"s"

使うデータベースを選ぶ
`use データベース名;`
ChromeでAndroidアプリのビルドのトレースする手順

Google I/Oであったやつです。
https://youtu.be/LFRCzsD7UhY?t=1958
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/27388/90e13f7f-a1ec-376d-06e3-90d6fe93523c.png)

# 手順

## Android Studioでの手順
Preferenceから-Pandroid.enableProfileJson=trueをGradleのオプションに追加
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/27388/ce9ab93e-46d8-7845-4fff-330c9e923af8.png)

この状態で、普通にビルドするとプロジェクトルート/build/android-profile/profile-2019-05-17-10-57-32-744.jsonみたいなファイルができます。

## Chromeでの手順

Chromeで新しいタブを開いて、メニュー -> その他のツール -> デベロッパーツールを開く。
Performanceタブを開いて、このボタンをクリックするとProfileの選択画面になるので、そこで先程のjsonファイルを選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/27388/e877b16d-5d4a-8369-927a-a2398e125c67.png)

これで見れました。
Docker+LaravelでMailhogを使う

## Mailhogとは
メール送信テストツール。Dockerには公式にイメージが用意されている。

## Docker環境にMailhogを導入する
環境：
Docker version 18.09.2 
docker-compose version 1.23.2
Laravel Framework 5.5.45

以下に環境変数を変更。

```:/laradock/docker-compose.yml
version: '3'

### Mailhog ################################################
    mailhog:
      build: ./mailhog
      ports:
        - "1025:1025"
        - "8025:8025"
      networks:
        - frontend
        - backend
      image: mailhog/mailhog #追加
```

```:/laravelプロジェクト/.env
MAIL_DRIVER=smtp
# MAIL_HOST=smtp.mailtrap.io
MAIL_HOST=mailhog
# MAIL_PORT=2525
MAIL_PORT=1025
# MAIL_USERNAME=null
MAIL_USERNAME=任意のユーザー名
# MAIL_PASSWORD=null
MAIL_PASSWORD=任意のパスワード
MAIL_ENCRYPTION=null
```

コンテナ起動

```bash
$ docker-compose up -d --build nginx mysql mailbag workspace ...

# コンテナ確認
 docker ps -a
CONTAINER ID        IMAGE                 COMMAND                  CREATED             STATUS                     PORTS                                            NAMES
eddbac17aed5        mailhog/mailhog       "MailHog Mailhog"        4 seconds ago       Up 2 seconds               0.0.0.0:1025->1025/tcp, 0.0.0.0:8025->8025/tcp   laradock_mailhog_1
fea975349d03        laradock_mysql        "docker-entrypoint.s…"   3 days ago          Up About a minute          0.0.0.0:3306->3306/tcp, 33060/tcp                laradock_mysql_1
# 〜以下省略〜
```

ブラウザでlocalhost:8025にアクセスして確認
<img width="718" alt="スクリーンショット 2019-05-17 9.47.58.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/364667/ff1b825b-881a-af3a-ff65-2179574db353.png">

導入完了です！

## テスト送信
### メールクラスとテンプレートを作成

```bash
$ php artisan make:mail TestMail --markdown=email.testmail
```

以下のフィアルが生成されたのを確認。
/app/Mail/TestMail.php
/resources/views/email/testmail.blade.php

### ルートに追加

```php:/routes/web.php
use Illuminate\Support\Facades\Mail;
use App\Mail\TestMail;

Route::get('/testmail', function(){
	Mail::to('test@example.com')->send(new TestMail);
	return 'メール送信完了';
});
```
ブラウザでlocalhost/testmailにアクセスする。
<img width="715" alt="スクリーンショット 2019-05-17 10.14.25.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/364667/31049c54-fb06-cdfb-da30-9b29c60a2ef9.png">

Mailhogでも確認する。
<img width="1376" alt="スクリーンショット 2019-05-17 10.23.03.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/364667/d64c075f-fd77-88c2-9c52-5f1ad41f1589.png">


### 参考
https://windii.jp/backend/laravel/laravel-mailhog-docker-compose
CloudWatchAgentのStatsDを試してみる

CloudWatchAgentを設定をしていると、statsDとかcollectdとか名前が出てきますが、どうやらOSSの数値レポーティングツールらしいです。

prometheusを主に使っているので困ったことがなくて所見ですが、今回はstatsDを試してみました。

# どんなもの？

https://github.com/statsd/statsd

- StatsDはプロトコルの名前、サーバとクライアントの実装がちゃんとあるぞ
- push系だぞ
- UDP使っちゃうぞ
- nodejsでできているんだぞ。
- 自身のアプリケーションに仕込んだりできるぞ
- クライアント側で使える言語は豊富だぞ

ってことらしいです。
CloudWatch Agentにはサーバ側が内包されているのでONにするだけです。(ウィザードで選択すればOK)

# CloudWatchAgentでStatsDを有効にする

適当なCloudWatchAgentが動いている(動く)サーバでStatsDを有効にします。

amazon-cloudwatch-agent-config-wizard で下記らへんですね。

```
Do you want to turn on StatsD daemon?
1. yes
2. no
default choice: [1]:

Which port do you want StatsD daemon to listen to?
default choice: [8125]

What is the collect interval for StatsD daemon?
1. 10s
2. 30s
3. 60s
default choice: [1]:

What is the aggregation interval for metrics collected by StatsD daemon?
1. Do not aggregate
2. 10s
3. 30s
4. 60s
default choice: [4]:
```

設定ファイルに直接追加するならこちら参考に。
https://docs.aws.amazon.com/ja_jp/AmazonCloudWatch/latest/monitoring/CloudWatch-Agent-custom-metrics-statsd.html


# クライアント側のコードを作る

ライブラリは豊富にあります。 https://github.com/statsd/statsd/wiki

プロダクトのプログラムの中に仕込めればいいんだけどとりあえずお試しなので、gethからblockを取得してstatsDを経由してCloudWatchに表示するってのをやってみます。
gethが入っていて、golang環境があるのでgolangで書きました。
golangはよく知らないのでテキトーです！

```go
package main

import (
    "context"
    "strconv"
    "log"
    "github.com/ethereum/go-ethereum/ethclient"
    "github.com/cactus/go-statsd-client/statsd"
)


func main() {

    url := "http://localhost:8545"
    client, err := ethclient.Dial(url)
    if err != nil {
        statsd_push("0")
        log.Fatal(err)
    }

    header, err := client.HeaderByNumber(context.Background(), nil)
    if err != nil {
        statsd_push("0")
        log.Fatal(err)
    }


    statsd_push(header.Number.String())

}

func statsd_push(bno string) {
    // first create a client
    // The basic client sends one stat per packet (for compatibility).
    client, err := statsd.NewClient("127.0.0.1:8125", "statsD-client")

    // handle any errors
    if err != nil {
        log.Fatal(err)
    }
    // make sure to clean up
    defer client.Close()

    i64, err := strconv.ParseInt(bno, 10, 64)
    // log.Println(i64)
    // Send a stat
    client.Gauge("block-number", i64, 1.0)
}
```

`    client, err := statsd.NewClient("127.0.0.1:8125", "statsD-client")`
localhostの8125でStatsDがたっているのでそいつにぶん投げればCloudWatchAgentが値を拾ってawsにぶん投げてくれます。

`    client.Gauge("block-number", i64, 1.0)`

メトリクスのタイプは https://github.com/statsd/statsd/blob/master/docs/metric_types.md 

# 定時実行する

Crontabに登録しちゃった。(ダサい)

# 確認する

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/56925/f80907ec-cdcd-b2c1-a817-74ce9b531263.png)


こんな感じで出てきました。
あとはアラームを設定するなりなんなりと。

# まとめ

- サーバからデータを送る方法の１つとして使えると思います。
- udpで投げっぱなしにできるので、コードの中に仕込んでおいてモニタリングとかもできちゃう。（そういうモチベらしい）
- いいとおもいます！
接点入力付きボタンデバイスにいたずら防止機能を付与する

# はじめに

ソラコムさんの LTE-M ボタンデバイスを屋外とかに設置する際、誤って押されたりイラズラされる可能性があるから、と導入に否定的な意見をもらう機会がありました。

確かにボタンを見てしまうと [「押すなよ！絶対に押すなよ！」](https://dic.nicovideo.jp/a/%E7%B5%B6%E5%AF%BE%E3%81%AB%E6%8A%BC%E3%81%99%E3%81%AA%E3%82%88) と言われてもつい押したくなる気持ちはわかるのですが、実際に業務とかで使う場面ですと、そういった気持ちはノーサンキューなわけです。

そんな中、接点入力付きのボタンデバイス [SORACOM LTE-M Button Plus](https://www.soracom.jp/products/gadgets/button_plus/) が登場し、イタズラ防止の簡単なしくみを組めたので、参考までに紹介したいと思います。

![ひげボタン](https://www.soracom.jp/img/products_soracom-lte-button-plus.png)

# 用意するもの

|部品名|説明|参考URL|
|:-----------------|:-----------------|:----------------|
|押しボタンスイッチ|メインのボタンスイッチ|[パネル取り付け用押しボタンスイッチ（赤）](http://akizukidenshi.com/catalog/g/gP-04580/)|
|リードスイッチ|イタズラ防止用のスイッチ|[ドアセンサースイッチ（リードスイッチ） SPS-320](http://akizukidenshi.com/catalog/g/gP-13371/)|

# 構成

押しボタンスイッチとリードスイッチを直列につなげ、SORACOM LTE-M Button Plus の接点入力へ直結します。

![60840896_2210307735751219_7643480892685418496_o.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/49240/bff296fe-7d49-2e73-154d-de48e4e6d17e.jpeg)

# どうしてイタズラ防止になるの？

リードスイッチの機能として、磁石を近づけたときにスイッチ内部の接点が閉じ、磁石を離すと接点が開きます。
参考：[磁気形近接センサ（原理と構造）](https://www.fa.omron.co.jp/guide/special/knowledge/prox/magnetic_type/principle_structure.html)

その特性を利用して、リードスイッチが設置されている箇所にマグネットを近づけた状態（リードスイッチの接点ON）で押しボタンスイッチを押さないと、回路全体が閉じない＝通電しないので、単純にボタンだけを押しただけじゃボタンは動かなくなります。

上のタッパーウェアではハウジングが透明でリードスイッチの位置が丸見えなので意味がないのですが・・・非透明のケースに入れておいて、特定の場所にマグネットをかざすようにすれば、それを知らない人は操作できないよ、ということです。

まあ設置する箇所の付近に強磁性体があったら使えないのですが。

そういう場合は [キー形セレクタスイッチ](https://www.monotaro.com/g/02894487/) とかを使いましょう。
そうなると押しボタンスイッチすら要らなくなりますが（本末転倒

# おわりに

今回は安価に余計なことをせずイタズラ防止の方法を組んでみましたが、もちっと複雑なことをするならば Arduino とかのマイコンボードと連携するのが簡単だと思います。

例えば Grove センサには指紋センサ（[Grove - Fingerprint Sensor](http://wiki.seeedstudio.com/Grove-Fingerprint_Sensor/)）などもありますので、指紋別に接点をON/OFFすることもできるのかもしれません（未検証）

![Grove - Fingerprint Sensor](https://raw.githubusercontent.com/SeeedDocument/Grove-Fingerprint_Sensor/master/img/Print_Sensor.jpg)

そのあたりの使い方は SORACOM エンジニアブログ の [SORACOM LTE-M Button Plus と Arduino をつなげて活用する方法](https://blog.soracom.jp/blog/2019/05/07/soracom-lte-m-button-plus-with-arduino/) を参考にどうぞ。

# 参考
* [Day1 Let's try IoT プロトタイピング〜ドア開閉をモニタリングしよう〜](https://pages.soracom.jp/20190514_IoT_Prototype_seminar.html)
* [Day2 Let's try IoT プロトタイピング〜ドア開閉をモニタリングしよう〜](https://pages.soracom.jp/20190515_IoT_Prototype_seminar.html)

※上記セミナーの資料は後日公開されるとのことです。
observer pattern

# observer pattern

## ケース
あるオブジェクトの状態に依存する複数のオブジェクトがある場合

## 結果
### pros
抽象に依存できる。
各々がイベントの通知、受信に専念できる。

### cons

observer から更新のコストが見えない


## detail
push or pull
pushはsubjectが情報を送る。observerは必要のない情報も受け取りうる。
pullはobserverが必要なデータを要求する。

notifyの内部外部
subjectのnotifyがsubject自身の状態変化にhookされるか、外部から呼び出されるか。

event filtering
observerが特定のeventのみsubscribeできるようsubjectのインターフェイスを拡張する。
observerがsubscribe時に受けたいeventの種類を渡す。

複数のsubject, observerが依存する時、中間クラスChangeManagerの導入を検討。
目的は整合性を保って通信の最小化

## example
```
protocol SubjectProtocol {
    func register(observer: ObserverProtocol)
    func remove(observer: ObserverProtocol)
}

protocol ObserverProtocol {
    func update()
}

class Timer: SubjectProtocol {
    private var observers: [ObserverProtocol]

    func notify() {
        observers.forEach { $0.update() }
    }
    func register(observer: ObserverProtocol)
    func remove(observer: ObserverProtocol)

    func start() {
        // after some seconds, call notify
    }
}

class TrainingPerson: ObserverProtocol {
    func update() {
        stopTraining()
        streach()
    }
}

class SleepingPerson: ObserverProtocol {
    func update() {
        wakeUp()
        goToilet()
    }
}

```
Autmation Anywhere で変数を使ってファイルパスを指定する方法

loopコマンドを使うとCurrentDirectoryなどのシステム変数を使うことが多々あると思います。
CurrentDirectoryではフォルダのフルパスが使用できますが
その中に含まれる子フォルダやファイルまでは指定できません。

例えばですが以下の画像のようなフォルダの中に含まれているフォルダまで指定したいとき
![ファイル.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/418186/8a10788e-8054-72a3-8da4-ae88f028c099.png)
openコマンドでoutフォルダを開きたいときは以下の画像のように入力すれば指定できます
![FolderOpenウィンドウ.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/418186/4bcf435a-f071-537d-e3d3-2fecd6b0ca55.png)
このときCurrentDirectoryに含まれるフルパスは「C:\OCRデータ」です。
この変数はloopを行っているフォルダなどで変わります。
ファイルパスを入力するときはエクスプローラーで指定するときと同じ入力を行ってください。

フォルダ内に含まれているファイルを開く方法については別途次の記事で解説します。
ReactのPropTypesで特定のキーを持つオブジェクトの型を定義して再利用する

一箇所で使う場合は個別のコンポーネントに記載すれば良いが、別の場所で利用する場合に同じ内容を各コンポーネントで記述するのは冗長になる。

なので対象オブジェクトのPropTypesを定義したconstを定義しておき、利用すれば良い。

```javascript
const hogePropTypes = PropTypes.shape({
  foo: PropTypes.string.isRequired,
  bar: PropTypes.bool
})

const HogeComponent = (props) => {(...)}

HogeComponent.propTypes = {
  piyo: PropTypes.string.isRequired,
  bar: hogePropTypes,
}
```

APIのModelから動的に生成してくれたりするライブラリないかな...
Vueで背景画像を設定するときのメモ

Nuxt( v2.4.0 ) + Vuetify( v1.5.5 ) でサイトを作成しているときに，背景画像が表示されなくてハマったのでメモ．

## やりたかったこと
styleタグでDiv要素に背景画像(background-image)を設定したかった．

## でも
```vue
<div class="bg" />

<style>
  .bg {
    background-image: url("/assets/foo.jpg");
  }
</style>
```
や，staticに画像を置いて

```vue
<div class="bg" />

<style>
  .bg {
    background-image: url("foo.jpg");
  }
</style>
```
とか他にもいろいろやってみても全部画像が表示できない・・・

## 解決方法
```vue
<div class="bg" />

<style>
  .bg {
    background-image: url("~@/assets/foo.jpg");
  }
</style>
```
でうまく表示されました！

それでは良いVueライフを👋
よく忘れるショートカット備忘録

#1. はじめに
参画するプロジェクトが変わったりして、しばらく触れていないと忘れるようなショートカットをメモするページ


## Visual Studio

| ショートカットキー |説明　　　　　　　　|
|:-----------------|:-----------------|
|`Ctrl+\`, `Ctrl+M`|チームエクスプローラータブを選択する|
|`Shift+F5`|デバッグを停止する|
|`F5`|デバッグを開始する|
|`Ctrl+l`|行を切り取る|
|`Ctrl+D`|行を複製する|
|`複数行選択してTab`|選択した範囲をインデント|
|`複数行選択してShift+Tab`|選択した範囲のインデントを削除|


## サクラエディタ
| ショートカットキー |説明　　　　　　　　|
|:-----------------|:-----------------|
|`Ctrl+Shift+E`|行を削除する|
|`Ctrl+u`|行を切り取る(行頭まで)|
|`Ctrl+k`|行を切り取る(行末まで)|


#### その他

##### 表の中でバーティカルバーを使う方法
バーティカルバー（vertical var）をテーブル内で表示する方法もついでにググってみたところ、出てきたのでこれもメモ。

1. 文字参照を使う

[MarkdownでTables内に'|'（バーティカルバー,縦線）を使う方法](https://qiita.com/18sasaki/items/87fd1cadc35acdfe5861)

| 記号 |読み方　　　　　　　　|
|:-----------------|:-----------------|
|&#x7C;|バーティカルバー（vertical var）|
|&#124;|バーティカルバー（vertical var）|

```:書き方
| 記号 |読み方　　　　　　　　|
|:-----------------|:-----------------|
|&#x7C;|バーティカルバー（vertical var）|
|&#124;|バーティカルバー（vertical var）|
```


2. テーブルタグを使う
<table>
<tr>
<th>記号</th>
<th>読み方</th>
</tr>
<tr>
<td>|</td>
<td>バーティカルバー（vertical var）</td>
</tr>
</table>

```:書き方
<table>
<tr>
<th>記号</th>
<th>読み方</th>
</tr>
<tr>
<td>|</td>
<td>バーティカルバー（vertical var）</td>
</tr>
</table>

```
facade pattern

# facade pattern
## ケース
複雑なシステム(オブジェクト群)に単純なインターフェイスを提供する

## 結果
### pros 
システムとクライアントの結合を弱める。

## example
swift の動画、カメラライブラリのAVFoundation例

```
class CameraFacade {
    var device: AVCaptureDevice
    var session: AVCaptureSession

    func recordVideo() {
        // device.someMethod
        // session.someMethod
    }
}
```
Raspbianの固定ローカルネットワークアドレスの設定

## IPの設定
まず`/etc/dhcpcd.conf`を開きます。

ここで固定IPを設定します。

```
interface eth0
static ip_address=192.168.10.33/24
static routers=192.168.10.1
static domain_name_servers=192.168.10.1 8.8.8.8
```

`ip_address`は設定したいRaspberryPiのIPアドレス。
`router`は同ネットワークのルーターのIPアドレス。
`domain_name_servers`はDNSと呼ばれるもので名前解決するサーバーのIPアドレス。


設定が通らない時はいくつかのパターンがあります。

- ルーターのIPアドレスが間違っている。
 -サブネットが間違っている。
- 物理的にネットワークに繋がっていない。
- `domain_name_servers`の指定が間違っていたりして、`/etc/resolve.conf`に正常な設定がされない。

## 確認

まずはネットワークが設定されているか確かめましょう。
適当な所で`Ctrl+c`を入力して終了しましょう。

```
$ ping 8.8.8.8

PING 8.8.8.8 (8.8.8.8) 56(84) bytes of data.
64 bytes from 8.8.8.8: icmp_seq=1 ttl=49 time=10.9 ms
64 bytes from 8.8.8.8: icmp_seq=2 ttl=49 time=5.33 ms
64 bytes from 8.8.8.8: icmp_seq=3 ttl=49 time=5.52 ms
64 bytes from 8.8.8.8: icmp_seq=4 ttl=49 time=5.46 ms

^C
--- 8.8.8.8 ping statistics ---
```

もしここで`ping: icmp open socket: Operation not permitted`といったエラーが発生した場合はpingコマンドの設定をしましょう。

```
$ sudo chmod u+s /bin/ping
```

これで繋がります。


## SSH

RaspberryPi3にSSHする場合、専用の設定をしておかなければSSHができません。

これについては簡潔な[外部記事](https://qiita.com/hikobotch/items/a33fc77114a4963cc68b)(1分程度)を貼っておきますのでそちらをご覧ください。

## まとめ

以上で設定は終了です。

同じネットワークに属す別のPCからSSHしてみましょう。
ユーザー名など変更していないのであれば`pi`のままです。

```
$ ssh pi@192.168.10.33
```

yes/noの質問が出たらyesを入力しておけば大丈夫です。
【UE4】StreamableManagerについて

# StreamableManagerを使用する目的
ゲーム中に必要なアセットを動的にロードするときに使用します。
基本的な動作を記載いたします。
※4.2xの内容です

# 使用する前に
このクラスはゲーム中に複数存在すると、
ロードしているものの管理が困難になってしまいます。
ゲーム上に1つだけ存在する設計をオススメします。

# ロード方法

```C++:EX
// シングルトン的なものから取得することを想定してます.
FStreamableManager &StreamableManager = MyApp::GetStreamableManager();

// ex : "Foo/AssetName.AssetName"
FStringAssetReference AssetReferense(TEXT(" ロードしたいもののパス "));

// 動的ロードを行います.
StreamableManager.RequestAsyncLoad(AssetReferense);
```

このようにロードします。
ロード状況などを調べたいときは戻り値でハンドルが渡されますので、
そちらを使用するとうまくいきます。
完了したときはコールバックを呼んでもらうこともできます。※後述

また、パスを直接ソースコード中に書くとアレなので、
外から取得したいときはソフトリファレンスを利用すると良いと思います。

```C++
// ソフトリファレンスしたオブジェクトからパスを受け取る例
TSoftObjectPtr<UDataTable> LoadObject = /* ... */
:
const FStringAssetReference& AssetPath = LoadObject.ToSoftObjectPath();
```

# ハンドル（FStreamableHandle）
## 進行中かどうか確認する
ロード中かどうかなどはリクエストしたときに貰う **FStreamableHandle** で判断できます。
同じアセットに対してロードリクエストを2回以上行うと、
既にメモリにのっているので破棄されるまではすぐにロードがすぐ終わり、コールバックが呼ばれます。
（ハンドルの Handle->IsLoadingInProgress() が true）

```C++
FStreamableHandle Handle = StreamableManager.RequestAsyncLoad(AssetReferense);

// 存在しないものなどをリクエストし、
// 失敗したときはnullptrになっているので、スマートポインタのチェックが必要です.
if ( Handle.IsValid() == false ) return;

// ロードが完了したかどうか（2回目のロードならすぐtrue）.
if ( Handle->HasLoadCompleted() )
{
     // ロード完了.
}

if ( Handle->IsLoadingInProgress() )
{
    // ロード進行中.
}
```

## ロードをキャンセルする
ロード中であればキャンセルすることができます。
<font color="Crimson">**キャンセルするときは、
登録していた完了コールバックは呼ばれません。**</font>
また、すでにロードが完了していればキャンセルできません。

```C++
Handle->CancelHandle();
```
## ロードしたものを取得する
ハンドル側からロードしたものを取得できます。

```C++
Handle->GetLoadedAsset()
```

# コールバック
## 完了したときに呼ばれるコールバック
完了したときにコールバックを受け取ることができます。
AssetReferenseをTArrayで複数リクエストしたときは全て終わったときにコールバックが返ってきます。
ここではLambdaで記載します。

```C++:
StreamableManager.RequestAsyncLoad(AssetReferense, []()
    {
        // 完了したときのコールバックをここに書きます.
    });
```

## その他コールバック
完了時だけでなく他にもコールバックには種類があります。
また、コールバックを登録し直すこともできます。
<font color="Crimson">ただ、ロードが完了するまでに登録しなければ登録できないので注意です。</font>
（特に2回以上呼び出されたときはロードがすぐ終わります）

```C++
// 完了したときのコールバックを登録できます.
Handle->BindCompleteDelegate( ... )
// キャンセルしたとき.
Handle->BindCancelDelegate( ... )
// 更新したとき.
Handle->BindUpdateDelegate( ... )
```

# :warning:気をつけること:warning:
### メモリ管理
ロードした数だけ使用するメモリは増えます。
不要なものはロードしない＆メモリから破棄することを忘れないようにしましょう。

### 破棄のミス
ロードをリクエストした後、
そのロードが完了する前にレベルを遷移してしまい、
遷移後に完了コールバック処理が呼ばれてエラーに…ということがありました:sweat_smile:
ロード中に遷移するようなシーンはキャンセルが必要だと思います。

# 最後に
メモ書きに近い内容でしたが、
読んでいただきありがとうございました。
間違っている所があれば修正いたします。
# singleton pattern

# singleton pattern
インスタンスの存在を唯一にする。

## 結果
### pros
インスタンスへのアクセスを制御できる
グローバル変数よりまし
リスコフ置換原則が満たされてる前提でサブクラス化により内部表現を変えれる 
### cons
なし


## example
```
class SomeUniqSpecialClass {
    static let instance = SomeUniqSpecialClass()
    private init() {}
}
```
インタラクティブになるまでの時間(TTI: Time To Interactive)とは何か

# 2020/6/3 追記

本家レポートより**PageSpeed Insightsのスコア改善が捗る裏レポートツール**を公開しました。併せてご参考ください。
https://simulate.site/cheatspeed-insights/

# インタラクティブになるまでの時間

英語では**Time To Interactive**またはその頭文字をとって**TTI**と表記されます。Webページ表示の体感速度を決める重要な指標です。

[PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights/?hl=ja)でも最も重視されていて、[点数の1/3がこの指標で決まります](https://qiita.com/miyanaga/items/d38124cdd64a1999fed9)。

Googleによると以下の説明ですが、

> 「操作可能になるタイミング」とは、レイアウトが安定して、主要なウェブフォントが表示され、メインスレッドでユーザー入力を処理できる状態になるタイミングとして定義されます。
https://developers.google.com/web/tools/lighthouse/audits/time-to-interactive?hl=ja

フワッとしているのでもう少し具体的に調べてみました。

# ユニークな測り方

TTIは少し変わった指標です。ページの読み込み開始からしばらくブラウザの挙動を観察して、振り返って**「あのときがTTIだったね」**と決める感じです。

https://github.com/WICG/time-to-interactive/blob/master/README.md
![tti-diagram.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35178/598912d4-88f2-3ad5-b8ed-38f803e48d26.png)

1. `DocumentContentLoaded`(図表の`DCLEnd`)以降で、
2. ネットワーク接続が2本以下かつLong task(50ms以上の処理)がない5秒の期間ができたら、
3. その前の最後のLong taskが終わったタイミングをTTIとする。

# TTIを遅らせるのは何か

実はTTIの決め方は、調べた記事よって少しずつ記述が違いました。ネットワークについての記述がなかったり、Long taskは100ms以上としていたり、`DOMContentLoaded`または`FMP`としていたり…

特にChromeがどのような実装なのかは調べていません。なのでこの記事は具体的なノウハウではなく、一般論としての考察としてお読みください。

また、私も勉強中なのでご指摘やアドバイスもお待ちしてます。

## DOMContentLoaded(DCL)までの時間を短く

DOMツリーが構築されたときに発生するイベント(タイミング)です。以下`DCL`とします。DCLが遅いとその分TTIは後ろにずれ込むので、まずはここを改善します。

正確には`DOMContentLoaded`発火の瞬間ではなく、イベントハンドラ完了のタイミング`DOMContentLoadedEnd`です。

一般的なフロントエンドの軽量手法が`DCL`までの時間短縮に直結します。

* HTML(DOM)をシンプルにする
* CSS・JavaScriptを軽くする
* 外部のCSS・JavaScriptは少ないファイル(コネクション)に束ねる
* それらをHTMLで適切に参照したり、インライン化を活用する
* DOMContentLoadedやjQuery.readyでのJavaScriptでの重たい処理を避ける(大量のDOM操作や同期通信など)

## Long taskを見つけて対処する

Long taskは50ms以上継続する処理です。正確にはメインスレッドの占有ですが、Webページ上のほとんどの処理はメインスレッドで行われます。

DevToolsの`Performance`タブでチェックできます。`Main`タイムラインで赤いマークが付いている処理がTTIの悪化を招いているLong taskです。`Bottom-Up`で原因となっているスクリプトを調べることができます。

<img width="793" alt="Chrome DevTools" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35178/f134671e-cb7d-d0e1-15c8-6c6f151746d9.png">

* JavaScriptでのアニメーションをやめてCSSで実現する
* 大量のDOM操作はVirtualDOMで行う
* 長時間の処理は分割する
* Service Workerの利用を検討する

など[技術的な対策](https://developers.google.com/web/fundamentals/performance/rendering/optimize-javascript-execution?hl=ja)も考えられますが、コンテンツや表現を見直す方が総じて効果的です。

## トラッキングタグやサードパーティJavaScriptに注意

タイムラインの終盤でLong Taskを発生させているのはトラッキングタグやウィジェットなどのサードパーティJavaScriptであることが多いです。

呼び出しはインライン化されていてレンダリングをブロックしなくても、その後でLong taskで暴れ放題なスクリプトを埋め込んでいるかもしれません。

必要最低限に絞り、どうしても外せないスクリプトがLong taskを招いている場合は改善を依頼してみましょう。

## ページ下部の画像は遅延読み込みを

画像が多いページでは、`DOMContentLoaded`の後にも画像のダウンロードが続きます。その分ネットワークビジーの状態が続くので、TTIも遅くなると思われます。

実際に画像の数とPageSpeed Insightsのスコアには弱い相関性が見られます。

スクロールが必要なページ下部の画像は遅延読み込みにすることをおすすめします。
elmのLSPサーバー(メモ)


elmのLanguage Serverについて調べたところ、一応いくつかあったのでメモ。
おそらく一番上に書いてある[elm-tooling/elm-language-server](https://github.com/elm-tooling/elm-language-server)がベストっぽい。
~~どれもまだ発展途上で`diagnostics`のみのものしかなかった。~~
2019/06/07更新: [elm-tooling/elm-language-server](https://github.com/elm-tooling/elm-language-server)が更新され、機能強化されました。

# [elm-tooling/elm-language-server](https://github.com/elm-tooling/elm-language-server)

Langserver.orgに載っているLSPサーバー
2019/06/07更新: 大幅に機能強化され、実用的になりました。

最終コミット(2019/06/07時点): 2019/06/07

|                    | 対応状況 |
| :-:                | :-:|
| Diagnostics        | O |
| Code completion    | O |
| Hover              | O |
| Jump to definition | O |
| Workspace symbols  | O |
| Find references    | x |
| Formatting         | O |


# [antew/elm-lsp](https://github.com/antew/elm-lsp)

最終コミット(2019/05/17時点): 2019/04/25

|                    | 対応状況 |
| :-:                | :-:|
| Diagnostics        | O |
| Code completion    | x |
| Hover              | x |
| Jump to definition | x |
| Workspace symbols  | x |
| Find references    | x |
| Formatting         | x |


# [jaredramirez/elm-language-server](https://github.com/jaredramirez/elm-language-server)

最終コミット(2019/05/17時点): 2019/04/01

|                    | 対応状況 |
| :-:                | :-:|
| Diagnostics        | O |
| Code completion    | x |
| Hover              | x |
| Jump to definition | x |
| Workspace symbols  | x |
| Find references    | x |
| Formatting         | x |


# [elm-tooling/elm-language-server-haskell](https://github.com/elm-tooling/elm-language-server-haskell)

おそらく過去のレポジトリ。

最終コミット(2019/05/17時点): 2018/11/28

|                    | 対応状況 |
| :-:                | :-:|
| Diagnostics        | O |
| Code completion    | x |
| Hover              | x |
| Jump to definition | x |
| Workspace symbols  | x |
| Find references    | x |
| Formatting         | x |
RStudioの便利なショートカットを使いこなそう

RStudioはXcodeやeclipseと同じでIDE(Integrated Development Environment)、統合開発環境です。
要はプログラミングにあたって便利な機能がたくさん搭載されています。
今回は筆者が使っていて便利だなー、と感じた機能を紹介していきます。
紹介する以外にも多くのショートカット機能が使えますが、紹介するもの以外を知りたい方はRStudioを開いて**Alt + Shift + K**でキーボードショートカット一覧を表示させて色々試してみると良いでしょう。

![RStudio-shortcuts.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/1ceb349a-5734-d9e8-dd33-3a8913d4b395.png)


###フォーカス移動
**Ctrl + 1:ソースへ移動**
**Ctrl + 2:コンソールへ移動**

大半はソース部分でコーディングを行いますが、ちょっとした動作確認をしたいときはコンソールで書きたくなったりします。
そんな時に便利なショートカットです。

###タブ移動
**Ctrl + Shift + .:タブの切り替え（タブのリストが表示される）**
**Ctrl + Tab:右隣のタブを開く**
**Ctrl + Shift + Tab:左隣のタブを開く**

複数のソースファイルを管理しながらコーディングしているとき、切り替えに便利なショートカットです。特に「Ctrl + Shift + .」はタブのリストを表示してくれて一発でタブ切り替えができるので便利です。

![tabchange.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/7470ee1e-1556-42d8-7613-9d4ff47c89bd.gif)



###ソースナビゲーション
**Ctrl　+ F:検索**

![find.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/f34dcae3-d7c2-7757-8c07-fe1ad660a3ee.gif)


ソース内でキーワード検索したいときに便利です。よく使うので覚えておきましょう。

**Ctrl + Shift + O:アウトラインの表示**

![outline.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/e62cc77d-4c96-8722-6f0c-cf095413dc63.gif)


セクションを書いていればアウトラインをソース右側に表示してくれます。
アウトラインからセクション選択でジャンプすることもできます。
ソースコードが長くなれば長くなるほどに有難みを感じるコマンドです。


###ソースコード補完
**Ctrl + Shift + R:セクションの挿入**
![insert_section.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/b6e2a33b-3967-4699-06bb-082aea185752.gif)

セクションを挿入するコマンドです。
セクションは絶対に書き忘れないようにしましょう。
後々自分が何をしたのか混乱を防ぐためにも重要です。


**Alt + Shift + J:セクションの移動（セクションのリストが表示される）**

![jump_section.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/c696b2df-dcd5-820f-31b5-1bf81d4bfd6e.gif)


任意のセクションに移動ができる便利なコマンドです。
セクション挿入のコマンドとセットで覚えておきましょう。

**Ctrl + Space:入力補助**

![code_navigate.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/4bf68adf-3462-776b-a3ef-3f1c593dde93.gif)


入力の途中で、「あれ？何て入力するつもりだったっけ？」と思ったらこのコマンドを実行しましょう。
入力補助として候補が一覧に表示されます。
未入力だと何も表示されないので、何かしら入力してから実行するようにしましょう。
とても便利なので覚えておきましょう。

**Ctrl + Shift + M:pipe演算子(%>%)の入力**

![insert_pipeoperation.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/345e8e58-674a-163f-7fb7-1559616d8865.gif)


おそらくほとんどのR開発者が使うであろうpipe演算子をショートカットで呼び出してくれます。
~~筆者はどっちかっつーとpipeRが好きなのであまり使わないんですけどpipeRも標準ショートカット実装してくれないかな開発者さん~~
使わない手はないでしょう！

**Ctrl + D:一行削除**

![delete.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/3489cd50-f166-fe1b-ff4b-9e631c447021.gif)


説明の通りです。素早く一行だけ削除したいときに便利なコマンドです。

**Ctrl + Shift + Alt + M:スコープ内の名前を一括変更**

![namescopechange.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/e8c1c2ab-685b-f521-65f9-4d342991a542.gif)


変数名を変更したとき、全ての変数を置換するのは面倒ではありませんか？
一発で変換してくれるので重宝します。

###コンソール
**Ctrl + L:コンソール表示をクリアする**

![clear_console.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162354/d2fa5270-8811-700d-d55d-82ce1c23f8be.gif)


コンソールがごちゃっとなっているとき、すっきりさせたくなることはありませんか？
筆者にはある。というわけで紹介。

いかがでしたでしょうか。
上手く使いこなせれば作業の効率化を図れます。
やっていきましょう。
WindowsでUnityにml-agents(0.8.1)を導入して機械学習を試してみる

Unityで機械学習を使うためのml-agentsアセットを導入し、Windows環境で3DBallというサンプルを動作させるための手順をまとめました。

色々ぐぐると今とはバージョンがずれていたりエラーが出たりフォルダ構成が違ってたりするので
自分用メモ代わりにまとめます。

# 導入するもの一覧
- Unity Hub
- Unity(2017.4以降なら問題なさそう、今回は2019.1.2f1)
- Anaconda 2019.03 for Windows 64bit Python3.7
- TensorFlow 1.7.1
- ml-agents 0.8.1
- pillow 5.4.1(公式の手順で進めると6.0.0がインストールされてしまうので手動でインストールします)

# 導入手順
+ Unity Hubのインストール

https://unity3d.com/jp/get-unity/download

最初にUnity Hubをインストールします。Unityの各バージョンを管理できるパッケージ管理ツールです。Unityはプラグインがバージョンに依存する場合も多く、入れておいた方がいいと思います。

+ Unity(2017.4以降)のインストール

Unity Hubを起動し、インストールボタンを押すと各バージョンをインストールできます。
今回は2019.1.2f1をインストールしてください。

+ Anacondaのインストール

https://www.anaconda.com/distribution/#download-section

Windows 64bit Python3.7をインストールします。

+ 「Anaconda Navigator」を起動

スタートメニューで「Anaconda Navigator」と入力すると起動できます。
起動時に各種初期設定を行うので起動が終わったら閉じて大丈夫です。

+ ml-agentsのダウンロード

https://github.com/Unity-Technologies/ml-agents

ここからzipファイルでダウンロード、またはgitでクローンしておきます。

+ Pythonの導入

ml-agents(0.8.1)のドキュメントを読むと
Python3.6が指定されているのでその通りインストールします。

```
> conda create -n ml-agents python=3.6
> conda activate ml-agents
```

+ Tensorflow1.7.1のインストール
```
> pip install tensorflow==1.7.1
```

+ ml-agents用の環境のインストール
※ml-agentsが自動でインストールするpillowが6.0.0なのでここでエラーになります。
以下のコマンドを入力してバージョンを5.4.1に差し替えます。

```
> pip uninstall pillow
> pip install pillow==5.4.1
```

ローカルに展開したml-agentsのフォルダに移動します。

```
> pip install mlagents
> cd ml-agents-envs
> pip install -e .
> cd ../ml-agents
> pip install -e .
```

# いよいよ学習

+ Unityを起動、UnitySDKプロジェクトを開く
Examples/3DBall/Scenes/3DBallを開いてください。

+ 学習モードをセットする
HierarchyのBall 3D Academyを選択し、Controlチェックボックスをつけてください。
このチェックが付いていると学習モード、外すと再生モードになります。

+ 学習開始

以下のコマンドを実行してください。

```
> mlagents-learn config/trainer_config.yaml --run-id=firstRun --train 
```

Playボタンを押してと表示されたらUnityのPlayボタンを押す

デフォルトだと50000回まで学習する設定になっていますが、好きな時にCtrl+cを押して終わらせる事で
N回学習したデータとして学習結果が保存されます。

+ 学習結果を再生してみる

models/firstRun-0/3DBallLearning.nnを
UnitySDK/Assets/＜好きな名前＞.nnにコピーする（例. own_3DBallLearning.nn)

Brains/3DBallLearningのプロパティでModelをown_3DBallLearningに変更
HierarchyのBall 3D Academyを選択し、Controlチェックボックスを外す

UnityのPlayボタンを押す

→学習結果が再生される

# 学習回数ごとの結果、まとめ

## 1000回
ちょっと動いていますが、まだぼろぼろと球が落ちます

![3dball-1k.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/160143/3d8bda85-126d-ac06-dbff-5b6c3315a1e9.gif)

## 5000回
だいぶうまくなってきました。数秒持つけど落としちゃう。みたいな

![3dball-5k.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/160143/d798d1fd-12b9-5204-e590-49e73186c2bc.gif)

## 10000回
球を落とさないという意味ではもう収束しているようですね。多少板の上で球が動くくらいです。

![3dball-10k.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/160143/f20887e7-e66b-edf5-2ef5-5bc8dfa8a755.gif)

## 50000回
もうあまり10000回と変わりませんでした。板を曲面にするとかもう少し難しくしたりしてみると面白いと思います。

![3dball-50k.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/160143/ffb27c26-d943-d983-6b39-8ec047f88298.gif)
「DB設計したいNight #4 そーだいさんと失敗から学びながらDB設計したいnight」に参加してきました

# < 初めに >
* 失敗から学ぶRDBの正しい歩き方、書きました by そーだいさん

# < ディスカッション形式 >
## 【みんなどんな失敗してきたの？】
### 型が違う問題
* 最初にもらってた数値が想定と違うのよくある
* 無理に頑張って対応したらテストやばく大変だった

A1.支店マスタテーブルと支店名テーブルを分ける、などテーブル追加がいいかも
A2.スーパーな発想で解決はしないで、基本通りに

### 賃貸売買のテーブルについて、一箇所しかデータ違うのに、別のテーブル・コードにするのはなんか気持ちわるい
* コードは継承を使いたいからSTI（テーブルにカラムを打ち込む）で。。。

A. Web系commonテーブルみたいなのやりたがるけど、この設計をしてしまうと実際のデータが入らないとどっちのデータかわからない

        * つまり、外部参照成約とか作りづらい
        * 親子関係はちゃんとわかりやすいように作るべきなので、無理にアプリに寄せる必要はない
        * いっそ親子関係逆にするとうまくいくケースもある
        * よく使うテクは賃貸用・売買用のViewを作って親子関係をわかりやすくする
        * あとは、ほんとに共通なの？を考えたほうがいい
        * 一つのテーブルにデータいれて、typeで分けるとかも
        * あとから追加は楽だが、最初からひとつに入れてから分けるのはしんどいよ？
        * ひとつのテーブルに2つ以上の状態を持たせない
        * また、いくつかの条件を入れないと出せないようなテーブルになるなら分割したほうがいい
        * わかりやすさとかは何かとトレードオフの関係なので、そこは注意

### 飲食店むけ求人店舗でViewがすべてを集約していて、規約でViewだけをつっつけと言われPerformanceでなかった
から別の求人サイトで必要なデータだけを取得するViewを作った
　⇒ viewの数が200以上、Viewの依存4階層 
　= 恐ろしいピタゴラスイッチになった

* Viewってどんな感じにつくってます？
* A. joinの解決策としてviewはよく使われる
    * あんまり変わらないテーブルの情報もある
    * そういうデータをjsonとかにしてS3においておいて、PGから呼び出すとかにするとむしろ良くなる
    * マテリアルView使ってマテリアルViewを作るのは絶対やっちゃダメ！！2階層のキャッシュは全体あかん！！
    * それとは別でjoinがいっぱいあるものをどうやってくっつけるかはデータの寿命と相談
    * 今あるものをsplitするのはDBではできない
    * データ量多いものをパーティション区切ることはできるが
    * 内包して参照するものがあれば、そのViewはいらないのでは？
    * 物理設計と論理設計を一緒にやるのはNG
    * 論理設計を最初にやって細かくして、その後物理設計をやるのがおすすめ
    * マテリアルViewを使いたくなったときは設計の考慮漏れの可能性が高いので、見直したほうがいい
    * View画使ったほうがいい方法
        * リファクタリングのために使ってその後消す (AをB,Cに分割したい、とかのパターン)
        * セキュリティ的に見せたくないものをとき (あるテーブルの特定のカラム, rowを見せたくな時にユーザーごとに権限分割できる)
        * アプリ都合でViewを使うケース (親子関係が3階層とかになってる場合で削除フラグが全部にある時など = 設計が悪い)
    * RDBで無理してやらなくてもいいんでない？
        * REST APIがViewnになることもああるので、それを利用するのもあり
        * リポジトリパターンとかで隠してあげるのもいいかも

## 【素朴な疑問】
### いらないカラムは消す？残す？
A. 自信を持て消せるなら、消すべき
    最初からちゃんと設計できていれば、抽象化しといてあげれば遊びの部分があるから変更に対する影響が少ないので消しやすい
    ただし、テーブルが多くなったりするので量が増える

Q. unusedとかプレフィックスつけるのはあり？
A. oldとかだと残り続けるので、コメントに「いつまでに消す」ということを書いて期限が消すようにする
    oracleだとmetaデータとして非表示にすることができる。実行計画やindex、select全てシカトして確認することができる

Q. 消して困ったことある？
A. ないが、キャッシュがある場合はエラーになったりすることもあるのでちょっと注意が必要

### ログテーブルいつ消す？
A. RDBに入れて検索性を高めて、一定期間を過ぎたらS3に入れてる
    課金系のものとかはパーティション切って小さい単位で削除してる（ロックしないように）とかもしてる
    ⇒　結構まちまちな模様

# < 感想 >
• 開発自体にも言えることだが、DB設計にもトレードオフの関係はとても大事な要素となっているので忘れないように心がけていきたい
GRAV CMS が仮想環境上の windows server で超遅い

IIS でも Apache でも nginx でも同じくらい遅い。

→ grav のキャッシュ設定を変えてみる
キャッシュの確認方法 を Folder timestamps などにしてみる。

キャッシュの効かない管理画面系は遅いです。

実マシンの windows10 上の IIS 上では遅くなかったです。
仮想環境のせいか、windows server のせいなのか、ファイルの日付確認が遅いんですかね？
久しぶりに macOS 上で php の build したメモ

開発環境はもうすっかり docker さんにお世話になりっぱなしなので、ローカルの php は PhpStorm の phpmd とか csfixer に用意してただけなのですが、諸事情で(サボってて)久しぶりに macOS 上で php を build したので改めてメモ。

```
$ phpenv install 7.3.5

-----------------
|  BUILD ERROR  |
-----------------

Here are the last 10 lines from the log:

-----------------------------------------
configure: error: Please reinstall the libzip distribution
-----------------------------------------
```

あーエラー。。

`libzip` 無いんだって。

というわけで、とりあえず、

```
$ brew install libzip
```

する。

で、無事 Install 終わって。

で、再度。

```
$ phpenv install 7.3.5
```

んだら、問題なく終わったね。

特に問題無くてよかったね。というメモでした。
Automation AnywhereでDate変数をyyyy/MM/ddにする方法

Automation Anywhereで日付を入力したかったが
用意されているフォーマットにyyyy/MM/ddがなかったため
自力でフォーマットを作る手法を考えたのでご紹介。

Date変数を使ってフォーマットを設定する方法は以下を参照
1. ワークベンチで、上部または右側のタブにある [変数マネージャー] アイコンをクリックします。 
2.[システム変数を表示] リンクをクリックします。 
3.変数の [日付/時刻] リストから Date 変数を選択し、[...] ボタンをクリックします。 
4.[日付形式の選択] ポップアップ ウィンドウで、日付の形式を選択します。

ウィンドウにあるフォーマットで一番近い形であるyyyy-MM-ddを選択

Replaceコマンドを呼び出して「-」を「/」に変更
![Replaceウィンドウ.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/418186/ca96af3f-15ff-65d7-b4b6-c4bbe08c3397.png)

これで出力すると「2019/05/17」と表示されます。
php-master-changes 2019-05-16

今日はテストに使うファイルをリネームする修正があった！

# 2019-05-16
## petk: Rename *.tif to *.tiff for consistency
- https://github.com/php/php-src/commit/ab2710c8d0261b4e3a5b1efcd86256134b9905d0
- テストで使う *.tif を *.tiff にリネーム
docker-compose.ymlの書式

#基本形
```
version: "3"
services:
  kafka:
    image: wurstmeister/kafka
    ports:
      - 9092:9092
    depends_on:
      - zookeeper
    environment:
      KAFKA_CREATE_TOPICS: "topic:1:1"
    volumes:
      - /var/run/docker.sock:/var/run/docker.sock

```


- version
	書式のバージョン

- services
	アプリケーションを動かすための各コンテナ。その名称が並ぶ。

- build
	コンテナイメージを作成するためのDokerfileのパス。

- image
	コンテナイメージ名

- environment
	コンテナ内の環境変数定義

- ports
	コンテナのポート。guest(ホストOS側):host（コンテナ側）

- volumes
	マウントするファイルのパス指定。- ホスト側パス:コンテナ側パス

- depends_on
	どのサービスに依存するか、そのコンテナ名を列挙

- container_name
	起動時のコンテナ名
Windows10でのLaravel Homestead構築方法 まとめ

ども、dog-earsです。
今回は、Windows10上でLaravel Homestead 環境構築をする方法について、まとめました。

**■Laravel 5.8 Laravel Homestead（公式）**
https://readouble.com/laravel/5.8/ja/homestead.html

## (1) virtual boxをインストールする。

**■virtual box**
https://www.virtualbox.org/

## (2) Vagrantをインストールする。

**■Vagrant**
https://www.vagrantup.com/

## (3) ローカルにプロジェクトフォルダを作成し、コマンドプロンプトでそこに移動する。
以後、[project folder]とする。

## (4) boxファイル作成

```
vagrant box add laravel/homestead
```

途中の質問は、「virtualbox」と回答

## (5) Gitリポジトリのクローン

```
git clone https://github.com/laravel/homestead.git Homestead
cd Homestead
```

この時点で、ディレクトリ構成は下記のようになっています。
[project folder]
- Homestead

## (6) 初期化＆Homestead.yamlの設定変更

初期化する

```
init.bat
```

コードを置くフォルダとssh鍵を置くフォルダを、下記のように作る。

[project folder]
- .ssh
- code
- Homestead

Homestead.yamlを修正する。

```
folders:
    - map: C:\[project folder までのフルパス]\code
      to: /home/vagrant/code

sites:
    - map: homestead.test
      to: /home/vagrant/code/public
```

ポイントは２つ。

foldersのmapは、絶対パスで指定する。
（初期値の~/codeだとつながりませんでした。）

sitesのmapは、デフォルトのhomestead.testがおすすめ。
サイトによっては、homestead.appとしている記事もありましたが、
.appは実在するため、問題が発生するようです。

## (7) hostファイルに以下追加。

C:\Windows\System32\drivers\etc\hosts

```
192.168.10.10 homestead.test
```

## (8) SSH鍵の作成

.sshフォルダに移動してから、

```
ssh-keygen -t rsa
```

デフォルトで、
・id_rsa
・id_rsa.pub
ができるはず。

## (9) vagrant 起動

```
vagrant up
```

## (10) sshで仮想マシンに入る

```
vagrant ssh
```

あとは、

```
sudo composer self-update
composer create-project laravel/laravel code --prefer-dist
```

などでLaravelをインストールすれば、

http://homestead.test/

で、サイトが見えるようになります。

ただし、このままdusk（ブラウザテスト）を走らせようとすると、
問題が発生するようです。

~~dusk環境構築については、別の記事にまとめる予定です。~~
↓まとめました。

■Windows10上のHomesteadで、Laravel dusk環境を作る方法（Failed to connect to localhost対策含む）
https://qiita.com/dog-ears/items/fb7fd6110702537a1dea

ではー。
メモ

■概要
・自動車業界ではCASE（コネクテッド、自動運転、セキュリティ、電動化）とMaaS（Mobility as a Service）によるモビリティ革命が進行
・L4自動運転は、ルール化された遠隔監視による実証実験多数
・実証実験では、マスコミや一般市民は安心しており、エンジニアの方が心配している。
・鉄道の安全は、同じ企業が運航管理することにより実現している。
・自動運転により、自動車交通の鉄道化が進む。ただし、異なる企業が関与する点が鉄道と異なる。
・自動運転への火付け役はGoogle。
・2013年にNEDOの隊列走行実験により自動運転に注目が集まる。
・自動運転は、人間にできないことをやるのが重要。例：車間距離4mでの高速運転は、物流、環境面でニーズがある。無人の電子連結にOEMはネガティブであったが、先頭有人・後続無人に対してはポジティブ。
・受容性評価のエコシステム構築が重要。
・自動運転のニーズ　１）隊列走行、２）自動バレーパーキング、３）ラストワンマイル
・SAEがL5（完全自動運転）を提言。L3-5の実現には道交法の改定が必要。
・L3が可能なのは、職業ドライバーのみだろう。第3種免許のようなものが必要になる。
・自動運転のニーズは、L2（安全運転支援）とL4（無人運転）に二極化するだろう。
・L4は経験を積んで、ODD（Operational Design Domain）になっていく。
・自動運転への近道：既存の公共オペレータ（欧州の小型バス実験）
・自動運転は、地域の様々な課題解決に有効。
・人間と自動運転の共存が一番難しい。
・自動運転のHMIが重要。無人であっても人間への情報デザインが重要。
・一般ドライバー：心理負担の軽減
・隊列走行ドライバー：割り込まれないようにすること。
・HMIの例：外部への表示、電子ミラーへの表示（レーンチェンジのシナリオ）
・安全性の評価：検証の方法、サイバーセキュリティ
・自動運転車のメンテナンス：OTA（Over the Air、遠隔ソフト更新）
・社会受容性の検討状況
　－経産省　自動走行ビジネス検討会にて、模擬裁判、損得アンケート、シンポジウム（これから免許を取る若い人向け）を実施

■
・隊列走行に割り込まれた時の異常処理は？
先頭有人の場合は、人が対応。
完全無人の場合は、割り込み禁止などの制度つくりが必要。
・自動運転車の社会受容性醸成のために何が必要か？
　周囲から見て自動運転車とわかることが重要。走行方向も。
　実証実験では、表示が必要な旨をガイドラインで示している。
・人間の場合は、他の車両とのインタフェースはウインカーやアイコンタクトだが、自動運転では？
　通信によるコミュニケーションが研究されている。
・自動運転車時代の道路交通インフラはどのようになると思われますか？
　V2Xなど通信により自動車と道路交通インフラがコミュニケーションするようになるだろう。しかし、通信に対して期待はするが、過度に当てにはしない。
・道路交通のルールは国によって異なるが、対応は？
　輸出時にローカライズする必要がある（ハンドル左右、一旦停止可否など）。
　しかし、地図は完全に標準化されておらず課題。
　ダイナミックマップは、日欧は連携の動き。中米は個別。ニュージーランドは日本の中古車も多く、対応が課題。
・自動運転過渡期は反って渋滞が起こるという予測もあるが・・・
　今のルールのままで自動運転車が走行すると渋滞は増えるだろう。
　自動運転車に合わせたルールの改定が必要。例えば、合流調停の加速レーンの設置など。
・自動運転により、どのようなMaaSの可能性があるか？
　自動運転による配車サービスが期待されている。Uberで鉄道チケットもとれるようになるかもしれない。それを実現するのは通信キャリアかもしれず、業界間競争が起こる。
・自動運転車の安全基準と評価方法は？
　経産省のPJのテーマである。
　ソフトウェアのアップデートは誰の責任で実施するか、PL法の対象にソフトは入っておらず、自動運転車の場合、どうするかが課題。
・自動運転車のためのエコシステムの構築状況は？
　日本は現状優先であり、議論が遅れている。自動運転車時代へのマイグレーションデザインが必要。例えば、キャッシュレスやインフラ老朽化への対応も一機にやってはどうか？

以上
「明示的にポート番号を指定したhttpアクセス」をしたいのにhttpsへのアクセスに自動的に切り替わって悩んだ(HTTP Strict Transport Security(HSTS)有効化に伴う影響)

自分用のメモ。
#事象
- 次の２つのサイトがあったとする
 - サイト1(HTTPS). https://www.example.com/
 - サイト2(HTTP). http://www.example.com:8080/
-  サイト1.へのアクセス後、サイト2.にアクセスしようとすると、次のHTTPSへのアクセスに自動的に切り替わった。
 - サイト3(HTTPS). https://www.example.com:8080/

#原因
サイト1.で、HTTP Strict Transport Security (HSTS) が有効になっていたため。
(「事象が起こっているサイト（サイト2）」ではなく、サイト1.の方に原因があり、すぐには気付けなかった。)

HTTPで"80"以外のポート番号を明示的に指定した場合、意図的にポート番号を保持する("80"の場合は"443"に置き換える)こと、それによって、実はHTTPSへの切り替えが間違いの場合があることも含めて、HSTSの設計時より想定されていた挙動のようである。([RFC6797 の 8.3](https://tools.ietf.org/html/rfc6797#section-8.3) および [Appendix A.6](https://tools.ietf.org/html/rfc6797#appendix-A) を参照のこと。）

#解決
サーバ側およびクライアント側の双方で対応が必要。
(尚、サイト2.のHTTPS化については、今後の課題。)

###サーバ側

　サイト1.のHTTP Server にて、HSTSのレスポンスヘッダにおいて、max-age に0に指定[^1]。

>Strict-Transport-Security: max-age=0

HSTSのヘッダを削除する方法ではないことに注意。今回の事象が発生した場合、既に、クライアント側のHSTSキャッシュが使われている可能性があり、サーバ側上記手順とクライアント側の手順とを合わせて実施することで、クライアントの「次回」アクセス時に、そのキャッシュが使われないようになる。

###クライアント側

  サーバ側で上記対応後、サイト1.にアクセスする[^2]


[^1]: 今回は includeSubDomains は指定しなかったが（サブドメインでサービスを提供していないことが明らかであったため）、HSTSのプリロードリストに登録するは includeSubDomains が必要のようだ。詳細は参考資料などに譲る。
[^2]: 　尚、ブラウザの種類によっては、当該ドメインのHSTSキャッシュを直接削除することもできるようだ。詳細は参考資料などに譲る。

#[参考資料]
[httpでアクセスしたいのにhttpsへリダイレクトされて悩んだ（HSTSまたはStrict-Transport-Securityの沼）](https://qiita.com/tmasu/items/14632bf45cf05b90d0c9)
[Strict-Transport-Securityヘッダ（HSTS）のキャッシュを無効化する方法](https://riatw.me/blog/strict_transport_security_disabled.html)
[HSTSとは?推奨される理由とプリロードリスト登録方法](https://www.blogging-life.com/hsts-preload/)
[RFC6797 - HTTP Strict Transport Security (HSTS) ](https://tools.ietf.org/html/rfc6797)
Flutter 開発環境構築

## はじめに
- Flutter Webも登場してFlutter触ってみたくなった
- まずはFlutter WebではなくAndroidでやってみる
- ほんとうはAR CoreかAR KitやりたいんだけどFlutterでできるのかは分からない
- Nest Hubのアプリ開発もやりたい
- 取り敢えず公式のインストール手順どおりにやった記録
  - https://flutter.dev/docs/get-started/install

## 環境
- Linux(Ubuntuデスクトップ)
- Androidターゲット
- Flutter、Androidともに未経験のおっさん

## Flutterインストール
```
$ cd
$ curl -O https://storage.googleapis.com/flutter_infra/releases/stable/linux/flutter_linux_v1.5.4-hotfix.2-stable.tar.xz
$ tar xf flutter_linux_v1.5.4-hotfix.2-stable.tar.xz
$ rm flutter_linux_v1.5.4-hotfix.2-stable.tar.xz
```

## PATH追加
```
+# Flutter
+export PATH="$HOME/flutter/bin:$PATH"
+
```

## 必要な依存関係を解決する
```
$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[!] Flutter (Channel stable, v1.5.4-hotfix.2, on Linux, locale en_US.UTF-8)
    ✗ Downloaded executables cannot execute on host.
      See https://github.com/flutter/flutter/issues/6207 for more information
      On Debian/Ubuntu/Mint: sudo apt-get install lib32stdc++6
      On Fedora: dnf install libstdc++.i686
      On Arch: pacman -S lib32-gcc-libs

[!] Android toolchain - develop for Android devices (Android SDK version 27.0.3)
    ✗ Flutter requires Android SDK 28 and the Android BuildTools 28.0.3
      To update using sdkmanager, run:
        "/home/hammer/Android/Sdk/tools/bin/sdkmanager" "platforms;android-28" "build-tools;28.0.3"
      or visit https://flutter.dev/setup/#android-setup for detailed instructions.
    ✗ Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses
[!] Android Studio (version 3.0)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[!] IntelliJ IDEA Community Edition (version 2018.1)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[!] VS Code (version 1.29.1)
    ✗ Flutter extension not installed; install from
      https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter
[!] Connected device
    ! No devices available

! Doctor found issues in 6 categories.
```


## 対応した作業
```
# [!] Flutter
$ sudo apt-get install lib32stdc++6
# [!] Android toolchain
$ "/home/hammer/Android/Sdk/tools/bin/sdkmanager" "platforms;android-28" "build-tools;28.0.3"
# [!] Android Studio (version 3.0)
# GUIでAndroid Studioの新しいやつ (version 3.4)をインストール
# GUIでAndroid StudioにFlutterとDartプラグインをインストールしてAndroid Studioを再起動
```
IDEはAndroid Studioでいいかな？と思ってInntelliJとVS Codeの部分は対応しなかった
deviceは持ってなかったのでPixel 3aを発注した

## プロジェクト作成
- Android StudioでNew Flutter Project
- Flutter applicationを選択してプロジェクト作成

## 起動確認
- Android Studioのツールバーからrunアイコンをクリック
- エミュレータでアプリ起動が確認できたらOK
線形重回帰による決定係数の算出とモデルの選択

# はじめに
　線形回帰を実施するとき、どのモデルが最も効率が良いのか試行する。データはscikit-learnのbreast_cancerを用いて実装する。このデータはウィスコンシン乳癌データセットと呼ばれるもので、腫瘍が良性であるか悪性であるかを判定したものである。データは569あり、そのうち良性は212、悪性は357、特徴量は30種類ある。これらのデータを用いて腫瘍が良性か悪性かを判定するモデルを作成し、最も決定係数が高くなるものを選択する。

#シリーズ
- [線形重回帰による決定係数の算出とモデルの選択](https://qiita.com/FujiedaTaro/items/4ef757370ca19abe783c)
- [線形重回帰による決定係数の算出とモデルの選択 part_2](https://qiita.com/FujiedaTaro/items/a7a23ce321f7733ae9cf)
- [単回帰分析による寄与率の算出](https://qiita.com/FujiedaTaro/items/090bad07672c322bceeb)
- [線形回帰と特徴量の絞り込み](https://qiita.com/FujiedaTaro/items/3fd874ae91b511eb1d1f)
- [ロジスティック回帰(分類)とハイパーパラメータのチューニング](https://qiita.com/FujiedaTaro/items/5784eda386146f1fd6e7)
- [線形SVC(分類)とハイパーパラメータのチューニング](https://qiita.com/FujiedaTaro/items/3e469688ad6f0dca62c0)
- [非線形SVC(分類)とハイパーパラメータのチューニング](https://qiita.com/FujiedaTaro/items/e5583f8767173e6a6f9a)
- [決定木とハイパーパラメータのチューニング](https://qiita.com/FujiedaTaro/items/47e06c758b451cbda412)
- [決定木とハイパーパラメータのチューニング２](https://qiita.com/drafts/0cc107bd69e9a0d2ce38/edit)

#線形回帰の手法
線形回帰の手法は次の４種類で実施する。
最も高い決定係数のモデルは線形回帰となった。

|線形回帰の手法|メソッド|汎化手法|決定係数|
|:---|:---|:---|:--:|
|線形回帰|LinearRegression()|-|0.73|
|Lasso回帰|Lasso()|L1正則化|0.61|
|Ridge回帰|Ridge()|L2正則化|0.72|
|ElasticNet回帰|ElasticNet()|L1 & L2正則化|0.66|
※今回のElasticNet回帰はL1：L2 = 50：50

>決定係数
>　独立変数（説明変数）が従属変数（被説明変数）のどれくらいを説明できるかを表す値である。寄与率と呼ばれることもある。標本値から求めた回帰方程式のあてはまりの良さの尺度として利用される。（wikipediaより）

>正則化
>　機械学習で過学習を防いだり、逆問題での不良設定問題を解くために、追加の項を導入する手法である。（wikipediaより）
>
>L1正則化
>　予測に影響を及ぼしにくいデータにかかる係数をゼロに近づける手法
>
>L2正則化
>　係数の大きさが大きくなりすぎないように制限する手法

# 手順
- 乳癌のデータセットを読み込む
- 訓練データとテストデータを分離する
- 分析手法をmethodsに格納する
- 決定係数の最大値を初期化する
- methodsに格納したそれぞれの線形回帰手法で決定係数を求める
- 最も決定係数の高かった線形回帰手法を選択する

# pythonによる実装
```python
import numpy as np
from sklearn.datasets import load_breast_cancer
from sklearn.linear_model import LinearRegression, Lasso, Ridge, ElasticNet
from sklearn.model_selection import train_test_split

#データの読み込み
cancer_data = load_breast_cancer()

#訓練データとテストデータを分離
train_X, test_X, train_y, test_y = train_test_split(cancer_data.data, cancer_data.target, random_state=0)

#分析手法をmethodに格納
methods = np.array([LinearRegression(), Lasso(), Ridge(), ElasticNet()])

#決定係数の最大値を初期化
maxvalue = 0

#学習と予測
for idx, method in enumerate(methods):
    model = method
    model.fit(train_X, train_y)
    score = model.score(test_X, test_y)

    if idx == 0:
        index = "線形回帰"
    if idx == 1:
        index = "Lasso回帰"
    if idx == 2:
        index = "Ridge回帰"
    if idx == 3:
        index = "ElasticNet回帰"

    print("{:<15}：{:.2f}".format(index, score))
    
    if score >= maxvalue:
        maxvalue = score
        index_max = index
            
print("")
print("最も決定係数の大きいモデルは\nモデル：{} 決定係数{:.2f}".format(index_max, maxvalue))
```
出力

```python
線形回帰           ：0.73
Lasso回帰　　      ：0.61
Ridge回帰　　      ：0.72
ElasticNet回帰　　 ：0.66

最も決定係数の大きいモデルは
モデル：線形回帰 決定係数0.73
```
# おわりに
　今回実施した４種類のモデルの中では、線形回帰が最も決定係数が高い結果となった。しかし、ElasticNet回帰はL1：L2 = 50：50のみの試行であったため、次回はこの割合を変更してより決定係数が高くなるモデルがないか試行する。