OmniAICreator/Qiita-1.07M huggingface dataset:
機械学習による株価予測で食っていくことは可能か[実施計画編]

# はじめに

本記事は、単なる思い付きで言っています。当方データサイエンティストでも意識高い系エンジニアでもないので、アカデミックな裏付け無しです。
単なるプー太郎の戯言です。

株価はランダムウォークということは、重々承知しているものの、過去の株価の機械学習で株価予測ができないかと常々思っている。
例えば、明日の値幅（引値と寄り値の差）がプラスかマイナスかを的中率60%の精度で予測できたとする。サイコロを振って予測した場合の的中率は50%なので、60%の的中率はそんなに無謀ではないように思える。

的中率60%ということは、10回予測すると6勝4敗で2回勝ち越しということ。毎回同額を投資したとし、的中して得た利益とはずして失った損失が、長い目で見て打ち消しあったとすれば、10回毎に2回分の利益が積み重なることになる。

個別銘柄だと、空売りでもしなければ、上がると予想した時しか購入チャンスがないので、現物買いだけで成立するようなスキームとする。
すなわち、日経225を予測対象とし、

+ 日経225が上がると予測したら、1570 NF日経レバレッジを購入
+ 日経225が下がると予測したら、1357 NF日経ダブルインバースを購入

とすれば、現物買いだけで回せるようになる。
手持ち資金が少ないので多少のレバレッジも効かせることができる。


# 日経225の値幅

そこでまず最初に、日経225の値幅がどのくらいあるのかを調べてみる。
日経225の時系列データをcsvに落として、

~~~csv:title=NIKKEI225.csv
Date,Open,High,Low,Close,Volume
2017-10-31,21896.38,22020.38,21840.07,22011.61,1055801728.0
2017-10-30,22047.95,22086.88,21921.24,22011.67,1397960064.0
2017-10-27,21903.27,22016.5,21815.72,22008.45,1241389952.0
2017-10-26,21698.95,21793.62,21688.56,21739.78,851784320.0
  ....

~~~

以下のようなコードを書いて確認。相場のトレンドによっては、上昇時と下落時の値幅の平均は異なるだろうが、ほぼボックス相場とみなし、値幅の絶対値の平均をとる。

~~~python:title=n225_statistics.py
import pandas as pd
import numpy as np
import matplotlib.pyplot as plt
import statistics

def calc_histgram(exchange):
    '''
    値幅分布の標準偏差算出とヒストグラム作成
    '''    
    # 寄値をlistに変換
    open_list = exchange['Open'].tolist()
    # 終値をlistに変換
    close_list = exchange['Close'].tolist()
    diff_list = ((np.array(close_list) - np.array(open_list))/np.array(open_list)).tolist()
    stdev = statistics.stdev(np.array(diff_list))

    # 値幅の平均値を算出する
    abs_diff_list = np.abs(diff_list)
    abs_diff_mean = statistics.mean(np.array(abs_diff_list))
    print('abs_diff_mean={}'.format(abs_diff_mean))
    
    # 値幅=20のヒストグラムを描画する
    plt.hist(diff_list, bins=80, rwidth=50)
    plt.title('n225 price range, sigma={}'.format(stdev))
    plt.show()

def main():
    nikkei_225 = pd.read_csv('NIKKEI225.csv').set_index('Date').sort_index()
    calc_histgram(nikkei_225)

if __name__ == '__main__':
    main()
~~~

![fig1-1_n225_sigma.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/483341/37abf8bd-47a0-4934-b8ad-5d43b98440a1.png)

2014-10-14～2017-10-31の平均値幅は、0.64%だった。


# 予測スキーム

今回のスキームでは、NF日経レバレッジ、NF日経ダブルインバースで2倍のレバレッジをかけるので平均値幅ΔはN225の2倍なので、Δ=0.64%×2=1.28%。

1か月に20回相場が開くとし、的中率60%の予測ができれば、月に4回勝ち越すことになり、月間利益は、1日当たりの投資金額×1.28%×4となる。
売買手数料（往復で0.064%）は20回分必要。
このほかに投信の手数料も必要だが、これは微々たる額なので無視。
勝ち越した4日分以外の損益はイーブンだったとする。

月間利益 = 1日当たりの投資金額×(1.28%×4－0.064×20)
         = 1日当たりの投資金額×3.84%
となる。

月利3.84%だと12倍すると年率46%。これはおいしい。本当だろうか？
1日当たりの投資金額を100万円とすれば、月間利益の期待値は38,400円。
いいお小遣いだ。
投資金額を1000万円にすれば、食っていけるやん。

どこかが間違っているとすれば、あやしいのは
「日経225の値幅の符号を60%の精度で予測する」というところだが。。。

ここを検証していきたいと思う。

# まとめ

日経225の値幅の符号を60%の精度で予測することができれば、年率46%の利益が得られるかもしれないという戯言。

<a href="https://qiita.com/SaturdayInThePark/items/5e14feca5857a132cc3d" target="_blank" rel="noopener noreferrer">機械学習による株価予測で食っていくことは可能か[機械学習編その１]</a>につづく。
MERNスタックを学べる動画をまとめてみた（外国語の動画です）

# MERNスタック is 何？
MongoDB, Express, React.js, Node.jsの4つを使った開発環境のアーキテクチャのことです。主に、Webアプリ開発に用いられます。

## MongoDBとは
ドキュメント志向のNo-SQLデータベース。データの保存などに使う。DBは、データベースの意。データがJSON形式みたいな感じなので非常にJavaScriptと相性が良い。

## ExpressJSとは
Node.jsのフレームワーク。Node.jsの機能と一緒に使う事で、バックエンドの構築が出来る。

## ReactJS
単一ページWebアプリのUIを作成するUIコンポーネントを構築出来る。アプリケーションのView部分を担っている。

## NodeJSとは
サーバサイドJavaScriptエンジン のことです。

# MERNスタックの良いところは？
ずばり！！
全部JaveScriptで書けることです！JavaScriptはフロントだけでしか使えへんやろ・・・。と思われがちですが、なんでも行けちゃうんです。もし、HTML,CSS,JavaScriptという静的なサイトしか作ったことがないという人は、新しく言語を学ばずともWebアプリケーションを開発することができるのでオススメです！！

# MERNスタックを学べる動画一覧（英語のみ）
Youtubeの動画か再生リストになっていて一年以内(2019年の8月以降)に投稿されているものをまとめました。

JavaScriptの勉強している人は分かると思いますが、アロー関数とか非同期処理(async await)とか、Hooksの書き方をしている教材がすくないですよね・・・。でも、こちらに挙げているものは、どれも最新の記法で書かれているのでコードを眺めるだけでもけっこう勉強になります！

[CODERS NEVER QUIT](https://www.youtube.com/watch?v=8BqA5DQp0j4&list=PLB97yPrFwo5g0FQr4rqImKa55F_aPiQWk)
インスタのクローンアプリが作れます。
動画本数：53本　1動画：10分前後　合計：9時間

[John Ahn](https://www.youtube.com/watch?v=SsMn8tT3ZBQ)
Youtubeのクローンアプリが作れます。
合計：4時間30分

[John Ahn](https://www.youtube.com/watch?v=VihRQ_uhHtE)
映画の紹介サイトが作れます。
合計：1時間30分

[John Ahn](https://www.youtube.com/watch?v=zaWtIkJgah4)
ECサイトが作れます。
合計：5時間

[Coding Garden with CJ](https://www.youtube.com/watch?v=5pQsl9u_10M&t=7358s)
旅行のログを投稿するサイト。Live形式です。
合計：4時間

[Programming with Jaiti](https://www.youtube.com/watch?v=VxHp958cXpk&list=PLbwarkNdAQxBb9DTTI63rAKTUjwocd9QG&index=1)
ログイン認証アプリが作れます。
まだ完成するところまでの動画はupされていませんが分かりやすいですね。


# おススメ勉強法
外国語だったとしてもコードの書き方は同じなので基本的な書き方さえ知っていれば分かります。しかし、この動画をみて学ぶのはファイル構成だったり、使用するライブラリの使い方、モダンな書き方を一から見て、自分で次に何かプロダクトを作るときに再利用することができるようにすることです。そのためにお勧めしたいのが・・・

コメントアウト勉強法です！

その名の通り、コメントアウトしまくります。どのタイミングでコメントアウトするかは人それぞれなんですが、一番良いのは再生リストになってるやつは一つの動画が終わるたびにコメントアウトするとよいですね。長い動画だと30分か、一つの機能を実装する度にすると良いと思います！

メリットとしては、コードを写経するだけだと見返したとしても何も覚えてなかったりしますが、これをすると自分の言葉でそのコードを表現する必要があるので、アウトプット要素が含まれます。本当のアウトプットは自分のプロダクトを作るときだとは思いますが、インプットと同時に簡単なアウトプットをしておくことで次にコードを見る時や他の人のコードを理解する時にも役に立ちます！ぜひお試しください！
【Python初心者】書いた記事を集めました


【Python初心者】if \_\_name\_\_ == '\_\_main\_\_'を手を動かして理解する。
https://qiita.com/Rihoritsuko/items/675d19119e311ea339be

【Python初心者】住所から都道府県と市区町村を抜き出す(3行)。
https://qiita.com/Rihoritsuko/items/638a90b4461e277600b3

【Python初心者】1つのリストを分割する(5行)。
https://qiita.com/Rihoritsuko/items/7c4bae67ad8193365d47

【Python初心者】2つのリストを交互に結合する(5行)。
https://qiita.com/Rihoritsuko/items/5ffc004cae89706f9cc3

【Python初心者】このフォルダにどんなファイルがあったっけ？」となった時に、1行で検索する。
https://qiita.com/Rihoritsuko/items/16044d8f06e4c155b8a7

【Python初心者】pip自体をupdateする
https://qiita.com/Rihoritsuko/items/e093ce01b5782d820997
ECRでKMSがサポートされるようになった

# アナウンス
https://aws.amazon.com/jp/about-aws/whats-new/2020/07/ecr-supports-encryption-images-aws-kms-keys/#:~:text=Amazon%20Elastic%20Container%20Registry%20(ECR,stored%20in%20your%20ECR%20repositories.&text=When%20this%20feature%20is%20enabled,and%20decrypts%20it%20when%20pulled.

# 仕様
https://aws.amazon.com/jp/blogs/containers/introducing-amazon-ecr-server-side-encryption-using-aws-key-management-system/

# ドキュメント
https://docs.aws.amazon.com/AmazonECR/latest/userguide/encryption-at-rest.html

時間があるときに試してみる。
リポジトリ作成後は有効化出来ないようなので、作成時に有効化する必要がある模様。

<img width="802" alt="スクリーンショット 2020-07-30 15.38.44.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254711/68130dad-fc7a-c2d4-7e71-df7978ba79fd.png">
Unity 3D入門 #11 [マウスによる一人称視点移動]

パソコンの一人称視点ゲームらしくマウスで視点変更できるようにします。

参考URL:https://mslgt.hatenablog.com/entry/2017/02/18/020630

上の手法ではクリックしている間しかカメラの移動ができないので、常にマウスの位置を追う実装にします。

```
private Vector3 lastMousePosition;
private Vector3 newAngle = new Vector3(0, 0, 0);

void Start() {
    newAngle = this.transform.localEulerAngles;
    lastMousePosition = Input.mousePosition;
}

void Update() {
    newAngle.y += (Input.mousePosition.x - lastMousePosition.x) * y_rotate * x_reverce;
    newAngle.x -= (Input.mousePosition.y - lastMousePosition.y) * x_rotate * y_reverce;
    this.gameObject.transform.localEulerAngles = newAngle;
    lastMousePosition = Input.mousePosition;
}
```

x_rotate, y_rotateはマウスによるカメラ回転の感度を、x_reverce, y_reverceは設定による反転(マウスを上に移動したら下に向くようにする)のための変数。

しかし、この実装ではマウスポインタがはじめから中央に無いと操作に違和感が出るかもしれません。(要検討)

また、一人称視点でカメラを回転させた時、カメラが壁を貫通して向こう側が見えるので、カメラが壁を貫通しないようにします。
カメラはプレイヤーと同じx,z座標に浮かんでいるので、プレイヤーのColliderの当たり判定を大きくしてプレイヤーが一定以上壁に近づかないようにするとカメラも壁にめり込むことはなくなりました。(もし、攻撃された時などの当たり判定は新しくそれ用のColliderを作ればOKのはず)
【Python初心者】住所から都道府県と市区町村を抜き出す(3行)。


結論
---

```python:都道府県
import re
#都道府県のみ
address = "東京都新宿区西新宿1-1-1"
matches = re.match('東京都|北海道|(?:京都|大阪)府|.{2,3}県' , address)
print(matches.group()) 
#--->東京都
```

```python:区
import re
#区のみ
address = "東京都新宿区西新宿1-1-1"
ku_number = address.find('区')
print(address[:ku_number+1])  #ない場合は空白が返される
#--->東京都新宿区
```


```python:市
import re
#市のみ
address = "東京都八王子市横山町1-1"
shi_number = address.find('市')
print(address[:shi_number+1])  #ない場合は空白が返される  #ない場合は空白が返される
#--->東京都八王子市
```

町村も同じく.find()で得ることができる。
CLI からカレントディレクトリを VSCode で開きたいのに code , ってタイポしまくったので関数を作った

# はじめに

コロン `.` とカンマ `,` って見た目も似てるしキーも隣だし、しょっちゅう打ち間違えます。
自分はいつも CLI から `code .` で VSCode を立ち上げるんですが、これを `code ,` と無限に打ち間違えてその度に `,` という名前の新規ファイルが VSCode 上で開くのが耐えられなかったので関数を作りました。

# 実装

もっと良い書き方があったら教えてください。

```shell:.zshrc
function vsc {
    if [ -z $1 ]; then
        code .
    elif test $1 = ","; then
        echo "コロンの間違いじゃない？"
    else
        code $1
    fi
}
```

これで CLI 上で `vsc` って打つだけでカレントディレクトリを VSCode で開けるようになったよ！やったね！

# 最後に

シェルスクリプト初心者なのでこれ書くのに2~30分くらいかかった気がしていて、今後 `code ,` とタイポして発生する手戻りと比較したら実は実装する方が損だったんじゃないかという気がしないでもないです。
が、無用なストレスは生まれなくなったので満足しています。
Vue.js、Svelte.js、jQueryのToDoアプリを作って構文を比較した

#Vue.js、Svelte.js、jQueryの構文比較

Vue.jsとSvelte.jsでそれぞれTodoアプリをつくって違いを見比べてみました。
作ったものがシンプルすぎるせいもありますが、ぱっと見では違いが分からないくらいには書き方が似ているので、Vueに慣れていたらSvelteの習得は楽だと思います。

![tasllist.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/10793/c7781ff7-0a3e-fdd7-8d32-dde3d881955b.png)


##Vue.jsでの実装
まずはVueでつくったToDoアプリのソースコードです。

```html:【Vue.js】
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Task list</title>
<style>
[v-cloak] {
	display:none;
}
</style>
</head>
<body>
<div id="app">
	<h2>Task list</h2>
	<input v-model="newTaskName">
	<button v-on:click="add">add</button>
	<ul>
		<li v-for="task in tasks">{{ task.text }}</li>
	</ul>
</div>
</body>
<script src="https://unpkg.com/vue"></script>
<script>
let app = new Vue({
	el: '#app',
	data: {
	tasks: [],
	newTaskName: '',
	},
	methods: {
		add: function(){
			if(this.newTaskName == "") return;
			this.tasks.push({text: this.newTaskName});
			this.newTaskName= '';
		}
	}
});
</script>
</html>
```

##Svelte.jsでの実装
つぎにSvelteでつくったソースコードです。
ループの書き方がVueとは異なりますね。またデフォルトのデリミタがVueは``{{``と中括弧２つなのに対して、Svelteの方は``{``と中括弧１つとなっています。

```haml:【Svelte.js】src/App.svelte

<div id="">
	<h2>Task list</h2>
	<input type="text" bind:value={newTaskName}>
	<button on:click={() => add()}>add</button>
	<ul>
		{#each tasks as task}
		<li>{task.newTaskName}</li>
		{/each}
	</ul>
</div>
<script>
let tasks = [];
let newTaskName = '';

function add(){
	if(newTaskName == '') return;
	tasks = [...tasks,{newTaskName}];　//スプレッド構文を使用
	newTaskName = '';
};
</script>
```

```javascript:【Svelte.js】src/main.js
import App from './App.svelte';

const app = new App({
	target: document.body
});

export default app;
```

上記２つを見比べると構文の雰囲気がよく似ている事が分かります。
現在Vueの方が日本語のドキュメントも充実しているし書籍も数多く出ているので学習環境は整っていますが、一旦Vueを習得してしまえばSvelteへの移行は非常に楽なんじゃないかと思います。

スプレッド構文の参考
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Spread_syntax


##jQueryでの実装(参考)
参考までにjQueryでも同じ挙動のToDoアプリを実装してみました。
この程度のアプリだったらむしろjQueryの方が分かりやすいかもしれません。
VueもSvelteもJavaScriptのソースコードにクリックイベントを記述する必要がないですが、jQueryの場合はclassやID等をトリガーとしてクリックイベントを設定する事が必須となります。

```html
<!DOCTYPE html>
<html lang='ja'>
<head>
<meta charset='UTF-8'>
<title>Task list</title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js'></script>
</head>
<body>
<h2>Task list</h2>
<input type='text' value='' id='text'>
<button id='add'>add</button>
<ul id='todo'></ul>
<script>
const App = class {
  add() {
    $('#add').on('click', () => {
      let text = $('#text').prop('value');
      let html = `<li>${text}</li>`;
      $('#todo').append(html);
      $('#text').prop('value', '');
      });
    }
  }
let todo = new App();
todo.add();
</script>
</body>
</html>
```

#所感
ちょっとSvelte.jsにもちょっかい出してみましたが、現状は日本語ドキュメントが充実しているVueの方が取っつきやすく、構文も見やすいなぁと感じました。
また、Svelteのうり？となっている実行速度の速さはある程度大きなアプリでないと体感し難いかもしれません。とりあえずフロントのフレームワークはjQuery以外では引き続きVueを勉強していこうって思いました。
WSL2でsshしようとしてBad owner or permissions

#現象

WSLをスルーしていたけど、ついにねんがんのWSL2環境にしたぞ！
```/home/username/.ssh -> /mnt/c/Users/Username/.ssh```などとシンボリックリンクを張って、
chownとchmodして、問題なくsshも接続できたぞ！ヨシ！mintty今までありがとう！

と安心していたら、少ししてから

```shell
$ssh -i filename username@hostname
Bad owner or permissions on /home/username/.ssh/config
```

が出てしまった。

```shell
$ls -al ~/.ssh/config
-rwxrwxrwx    1 username  username       3579 Jul 30 05:14 /home/username/.ssh/config
```

おや？
どうも、Windows側で.ssh/configを上書き保存すると、777に戻ってしまう様子。

```shell
$chmod 644 ~/.ssh/config
```
とすれば、使えるようになる。

# 環境
Apline WSL
https://www.microsoft.com/ja-jp/p/alpine-wsl/9p804crf0395?activetab=pivot:overviewtab

# 対策
Alpine Linuxのシェルはbashではなくash

```~/.bashrc``` → ```~/.ashrc```
```~/.bash_profile``` → ```~/.profile```
のように読み替えればほとんどbashと同じように使える。

```shell:.ashrc
# alias=''と同じように使える関数を定義
# $@ は引数すべて
function _ssh(){
  command chmod 644 ~/.ssh/config
  command ssh $@
}
```

```shell:.profile
source ~/.ashrc
```

このように書いて再起動に備えて、
今起動中のターミナルでも使えるようにして

```shell
$source ~/.ashrc
```

sshの頭に_を付けたaliasを定義したので、

```shell
$_ssh -i filename username@hostname
```

とする。
自分しか使わないので、これでしばらく様子見。

## 参考

ashとは？bashじゃないの？Alpine Linuxのコマンド
https://qiita.com/HorikawaTokiya/items/f9188d05a58bad47ce8d

bashで引数つきのエイリアスを設定する
https://hacknote.jp/archives/8043/

シェルスクリプトの特殊変数$@と$*の違い
https://hacknote.jp/archives/15421/
[Java]STSの導入からローカルホストでの動的ページの確認までの流れ(1/3)

会社の研修ではだいたい2~3人ぐらいのグループで仮想プロジェクトを作成することになっています。
プロジェクトはSpringToolSuite(STS)を使うのですが、研修生向けマニュアルのようなものが今までなかったので、導入からローカルホストを立ててWebページを確認するまでをまとめました。
初めてプログラミングの仕事に就く人向けですので、初歩的なところも端折らず書いています。

記事は3つに分割しています。
**1. MVCモデルの説明　←今ここ**
[2. STSの導入からPleiadesによる日本語化まで](https://qiita.com/aki0141/items/26f780da65c26924e740)
[3. プロジェクトの作成からローカルホストでページを確認するまで](https://qiita.com/aki0141/items/5dc0c9378c545cbaad98)

STSをダウンロードする前に、まずはWebアプリケーションの設計思想であるMVCモデルの説明から始めます。
最初から座学かよと思わず少しだけお付き合いください。

#MVCモデルとは
MVCモデルというのは、一言で表すとWebアプリケーションの設計思想の1つです。
Webアプリケーションを作る際に開発者が思い思いに実装すると、その人にしか理解できなかったりバグが発生したりとトラブルになりがちですし、クライアントの側から直接データを参照するのはセキュリティの面でもよろしくありません。
そのため、要所々々で何をどう動かすかのルールを決めて実装しようという話です。
それぞれの役割は以下の通り。

**M : Model** 
演算やデータ層へのアクセスなど、実際に何か処理を行う部分。ロジックやサービスという名前が付く。
Controllerによって呼び出されて演算結果やデータベースから取得したデータなどを返す。
**V : View** 
Controllerによって生成されクライアントに送られる。名前の通り見た目の部分であり、グラフや図のほか、Webページに必要なHTMLファイルもここに含まれる。
**C : Controller**
HTTPリクエストの内容を確認して適切なModelを呼び出し、演算結果やデータなどをViewとして生成してクライアントに送り返す（HTTPレスポンス）するもの。

例）
クライアントがWebページでキーワードを入力する
↓
Controllerがキーワードを受け取ってデータベースにアクセスするためのModelに飛ばす
↓
Modelがデータベースにアクセスし、キーワードに紐づくデータを取得してControllerに返す
↓
ControllerはViewとしてHTMLファイルを作成し、ファイル内にModelから取得したデータを記載してクライアントに送る
↓
Webページが遷移してキーワードに紐づいたデータの一覧が表示される

MVCモデルはあくまでも設計思想であり、開発において明示的にMVCモデルだと設定するようなことはありません。
そうは言ってもMVCモデルを意識しなければ、リクエストをController以外のものが受け取ってしまったり、全然関係ない演算処理を1つのModelに入れてしまったりということが起こるかもしれません。
実装した人にしか理解できないコードはその場では動いたとしても後々障害になりますので、頭の片隅に置きながら開発を進めるのが良いと思います。

以上がMVCモデルの簡単な説明でした。次回はSTSをダウンロードして日本語化するところまで進めたいと思います。

次回：[STSの導入からPleiadesによる日本語化まで](https://qiita.com/aki0141/items/26f780da65c26924e740)
AWS EC2にNginxをインストールする

# はじめに
## 環境
- EC2インスタンス作成済み
    - Amazon Linux 2 AMI (HVM), SSD Volume Type
    - 64 ビット (x86)
    - タイプ：t2.micro


# やったこと

## EC2サーバーでの操作

### 接続

```
$ ssh -i xxxx.pem ec2-user@パブリックIP（またはDNS）
```

### amazon-linux-extrasの確認

amazon-linux-extrasを使ってインストールできるパッケージの確認をします。

```
$ which amazon-linux-extras
$ amazon-linux-extras

  0  ansible2                 available    [ =2.4.2  =2.4.6  =2.8  =stable ]
  2  httpd_modules            available    [ =1.0  =stable ]
  3  memcached1.5             available    [ =1.5.1  =1.5.16  =1.5.17 ]
  5  postgresql9.6            available    [ =9.6.6  =9.6.8  =stable ]
  6  postgresql10             available    [ =10  =stable ]
  8  redis4.0                 available    [ =4.0.5  =4.0.10  =stable ]

   ...略

 38  nginx1                   available    [ =stable ]
 39  ruby2.6                  available    [ =2.6  =stable ]
 40  mock                     available    [ =stable ]
 41  postgresql11             available    [ =11  =stable ]

   ... 略
```

> 参考：
amazon-linux-extrasについて
https://aws.amazon.com/jp/premiumsupport/knowledge-center/ec2-install-extras-library-software/

### Nginxのインストール

```
$ sudo amazon-linux-extras install nginx1

$ nginx -v
nginx version: nginx/1.18.0
```

### 初期設定ファイルのバックアップ

```
$ sudo cp -a /etc/nginx/nginx.conf /etc/nginx/nginx.conf.back
```

### 起動設定

Nginx起動

```
$ sudo systemctl start nginx
```

インスタンス起動時にNginxも自動で起動させる

```
$ sudo systemctl enable nginx
Created symlink from /etc/systemd/system/multi-user.target.wants/nginx.service to /usr/lib/systemd/system/nginx.service.
```

設定確認

```
$ systemctl status nginx
● nginx.service - The nginx HTTP and reverse proxy server
   Loaded: loaded (/usr/lib/systemd/system/nginx.service; enabled; vendor preset: disabled)
  Drop-In: /usr/lib/systemd/system/nginx.service.d
           └─php-fpm.conf
   Active: active (running) since 木 2020-07-30 14:34:02 JST; 1min 20s ago

```

## ブラウザで確認

EC2接続時に使用したパブリックIP（またはDNS）をアドレスバーに入力して接続します。
![スクリーンショット 2020-07-30 15.13.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/395809/8cfea5b3-a620-b960-373b-8c5631672be0.png)

「正しくインストールできています」のページが表示されました:thumbsup::thumbsup::thumbsup:
レンダリング中に登場するwebapiをクロールしてたらCORSで弾かれたからなんとかする

### ことの始まり
python3を使って書いたあるページをクローリングするプログラムを動かしていたら
ある日こんなエラーが返ってくるようになった。

```
Access to XMLHttpRequest at 'https://target' from origin 'https://xxxxxxxxx' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
```
その時の実装は以下の通り。

```
import requests
res = requests.get("https://target") # webapiのURL
```

クローリングのターゲットとしていたページはbootstrapなんかでデータを読み込んで表示するようなページで、
レンダリング中にbootstrapから呼び出されているwebapiをターゲットにクロールしていた。

### 解決
selenium-wireを使ってクローリングする。
seleniumのwebdriverはレンダリング後のwebページしか取り扱えないがこれはレンダリング中の問い合わせの結果にもアクセスできる。
https://pypi.org/project/selenium-wire/

```
from seleniumwire import webdriver

driver = webdriver.Chrome()
driver.get("https://target") # TOPページのURL

for request in driver.requests:
    if "xxxxx" in request.url: # 結果が欲しいURLを絞り込む条件（webapiのURL)
        response_text = request.response.body.decode()
```

### 小噺
#### CORSってそもそも何
こちらの記事で勉強させていただきました。
https://qiita.com/att55/items/2154a8aad8bf1409db2b
なるほど、確かに必要。自分みたいなことする人がいるから。

#### CORSの処理をpythonで出来ないのか　→　簡単にはできなそう
あまり調べてないけど簡単にはできなそう。だから諦めた。
CORSではプリフライトリクエストというのを先に飛ばしてそれから実際にGETなりPOSTなりしているらしい。
https://developer.mozilla.org/ja/docs/Glossary/Preflight_request

この記事に`プリフライトリクエストは必要に応じてブラウザが自動的に発行します。通常、フロントエンドの開発者はそのようなリクエストを自分で作成する必要はありません。`と書いてあり、
ブラウザが勝手にやってくれる＝飛ばし方を隠蔽されてるくさいなと諦めた。
なんかやるにしてもFetchAPIとかXMLHttpRequest使えって記事が出てくるので、javascriptで動かすしかなさそう。

#### NodeJSならできる　→　できるかも（未検証）
javascriptということで。NodeJSでFetchAPIを使えるらしい。
https://www.npmjs.com/package/node-fetch
ラズパイ4BはグーグルGCE無料枠より遅かった（でも4K動画再生はできる）

iperf3 によるネットワーク速度計測とUnixBenchによる全般的な性能の比較を行った結果を紹介します。比較した機器は以下の３つ。Cコンパイラはすべて GCC 10。結論としてはグーグルGCE無料枠のディスクとネットワークを遅くしたものがラズパイ4Bの計算力だと言えそうです。

* ラズパイ 4B (メモリ8 GB)。ラズパイ社純正64bit版カーネルに[Debian 11 Bullseyeを導入](https://qiita.com/kakinaguru_zo/items/c6ca2d98c4196cabb76f)。
* [パナソニックノートパソコン CF-SZ6](https://panasonic.jp/cns/pc/support/products/sz6p/) (インテル® Core™ i7 7500U , SSD)。Ubuntu 20.04 Focal
* [グーグル Google Compute Engine 無料枠](https://qiita.com/Brutus/items/22dfd31a681b67837a74)、仮想CPUは実CPUの１／８。Ubuntu 20.04 Focal

## LANインターフェースの速さ
[iperf3](https://qiita.com/yokoc1322/items/bfd8b6e69d6bdb3bb1c6) を用いてラズパイの有線・無線ネットワークインターフェースを測定した。

### 有線LAN
ノートパソコン CF-SZ6 は 900 Mbps、ラズパイ4Bは600 Mbps

### 無線AN
ノートパソコン CF-SZ6 は 500 Mbps、ラズパイ4Bは90 Mbps❣驚異的に遅い。その理由の一つはラズパイ側で `iw wlan0 info` したときに表示される`width` が 40MHzしかないことで、ノートパソコンの方は80MHzで２倍帯域幅を使ってます

## Unix Bench
https://github.com/kdlucas/byte-unixbench のベンチマークです。CPU単一コアとCPU全コアによるベンチマーク値が得られますが、CPU全コアによる値だけを紹介します。結論としてはグーグルGCEとだいたい同じでディスク入出力が遅いことがわかります。

|比較項目|ノーパソ|ラズパイ4B|グーグル|
|:-------------:|-------------:|-------------:|-------------:|
|Dhrystone 2 using register variables|87130950.9|25134169.3|27299043.4|
|Double-Precision Whetstone|22264.4|4250.5|1317.6|
|Execl Throughput|8544.7|2688.4|1048.4|
|File Copy 1024 bufsize 2000 maxblocks(単位MBps)|361.6941|121.8182|312.3306|
|File Copy 256 bufsize 500 maxblocks(単位MBps)|95.2473|33.2260|88.2706|
|File Copy 4096 bufsize 8000 maxblocks(単位MBps)|1284.6244|356.0185|815.2016|
|Pipe Throughput|1775096.8|431364.2|395436.3|
|Pipe-based Context Switching|353649.3|78775.3|85185.1|
|Process Creation|24246.0|3829.1|3102.6|
|Shell Scripts (1 concurrent)|16728.5|4280.9|1743.3|
|Shell Scripts (8 concurrent)|2349.1|568.3|223.1|
|System Call Overhead|1007940.9|362395.5|238012.7|
|System Benchmarks Index Score:|1864.2|489.5|422.8|

## 4K動画再生
ラズパイ4BのミニHDMI出力を4Kディスプレイに繋ぐとしっかり4K表示できる。ラズパイ4Bに
[Ubuntu MATE for Raspberry Pi](https://ubuntu-mate.org/ports/raspberry-pi/)を入れてユーチューブの4K動画を再生すると、ウェブブラウザのウィンドウをそんなに大きくしなければ割とスムーズに再生する。全画面表示にするとさすがに7〜8fps程度しかでない…

[みんなのネット回線速度](https://minsoku.net/) を上記のノートPCで測ると800Mbpsくらいでるが、[Ubuntu Mate for Raspberry Pi](https://ubuntu-mate.org/ports/raspberry-pi/)だと120 Mbps、[Debian Bullseye Gnome](https://qiita.com/kakinaguru_zo/items/c6ca2d98c4196cabb76f)だと40Mbpsくらいしかでないため、ブラウザ動作が遅すぎてスピードがまともに測れていないようである。
JavaScript（jQuery）、preventDefault()で既定の動作をキャンセルしてみた

#preventDefault()で既定の動作をキャンセルしてみた

やりたいこと
画像をリンク化することで画像の元のサイズを取得できるようにする。
リンク先に飛ばずにモーダルウィンドウ表示にする。

下記の表示でリンク化された画像でリンク先に飛ばなくなる。

```js
  $('img').on('click', function (e) {
    e.preventDefault();
  });

```
【Python】内包表記について簡潔に書いてみる

#公開理由
・Qiitaのコメントで内包表現について言及して頂き、今が理解するチャンスだと思った為
　（『Pythonチュートリアル』で内包表記自体は聞いたことあるのですが、難しそうで逃げてました。今がチャンス！）

#内包表記の文法

文法自体は見た目ほど難しくなさそうです。
（難しそうと思って逃げたのが過去の自分・・・汗）


```
[処理内容 for x in リストなど]
```

個人的には次の様に分解すると個人的にしっくりきました。

![test.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/678439/d1d66eed-e768-6f2b-06f3-721ba7f29378.png)

「for」以降はPythonの普通のfor文と形に変わりはないですしね。
処理内容が前に来たfor文みたいな印象。

#サンプルコード（内包表記）
各要素を3倍するコード

```naiho.py
num_list = [-4, -3, -2, -1, 0, 1, 2, 3, 4]

naiho = [x * 3 for x in num_list]
print(naiho)
```

または、名前に苗字を入れるコード

```kawaii.py
gotobun = ["ithika", "nino", "miku", "yotsuba", "itsuki"]

hanayome = ["nakano " + z for z in gotobun]
print(hanayome)
```

#出力結果（内包表記）
計算は普通に出来るし

```
[-12, -9, -6, -3, 0, 3, 6, 9, 12]
```

文字列を作るのも簡単ですね。工夫すれば使える場面は多そう。

```
['nakano ithika', 'nakano nino', 'nakano miku', 'nakano yotsuba', 'nakano itsuki']
```

#サンプルコード（内包表記無ver）
上記2つのsampleコードをfor文で処理しようとすると次の様になりそうです。


```no_naiho.py
num_list = [-4, -3, -2, -1, 0, 1, 2, 3, 4]
not_naiho = []

for y in num_list:
  y *= 3
  not_naiho.append(y)

print(not_naiho) 
```

```no_kawaii.py
gotobun = ["ithika", "nino", "miku", "yotsuba", "itsuki"]
hanayome = []

for a in gotobun:
  a = "nakano " + a
  hanayome.append(a)

print(hanayome) 
```

#出力結果（内包表記無ver）
内包有無で変わりはないのですが、一応書いておきます。

```
[-12, -9, -6, -3, 0, 3, 6, 9, 12]
```

```
['nakano ithika', 'nakano nino', 'nakano miku', 'nakano yotsuba', 'nakano itsuki']
```


#感想

・内包表記を使うことで、for文を思ったより簡略に書くことが出来ると感じた
・内包表記に慣れていないのであれば、まずfor以下を書いてから最後に処理内容を書くようにすると
　迷うことが少なくなると思いました。
AWS SAMではまった箇所備忘録

Serverlessはなんとなくわかるけど、CloudFormationはほぼ触ったことない人間がSAM始めてみました。
はまりどころ多すぎてメモを残しておきます。※随時更新

## API
- ステージ：~~勝手に~~自動でProdとStageができる → [バグらしい](https://medium.com/veltra-engineering/avoid-aws-sam-stage-stage-45f7331b7b5d)

## Layer
AWS::Serverless::LayerVersion
AWS::Lambda::LayerVersion
の2種類があるらしく、AWS::Lambda::LayerVersionlayerの方でlayer単体でスタック作成しようとしたらエラーに...
cloudformationかsamの違いなのか？
→　AWS::Serverless::LayerVersionのドキュメントにて、`重要な注意点: 発売以来 置換ポリシーの更新 のリソース属性 AWS CloudFormation、 AWS::Lambda::LayerVersion (推奨)は、 AWS::Serverless::LayerVersion.`とのこと

## どちらかというとCloudFormation
- BucketName：大文字入力しててはまった...小文字だけにしましょう！
- Role：ResourceはAWS::IAM::Policyに別書きしないといけない
- 擬似パラメータ：使いたいときは、""の前に`!Sub`入れる
- 複数要素を設定できる属性には `-` を付けないとエラーになる、逆に１つしか設定できない属性に `-` 付けるとエラーになる
自分的にiPhoneシミュレータでiOS開発する際に欠かせない機能8つ

iOS開発には欠かせないiPhoneシミュレータ。

これが非常に出来がよく、実機で出来ることのほとんどをシミュレートしてくれるので、正直自分は実機よりもこちらを使って開発することが多いです。

Mac上でサクッと動作確認できることはもちろん便利なのですが、ショートカットキーを駆使すればキーボードに手を乗せたままいろいろ操作出来るのがこれまた便利。

また、一見出来なさそうに見えるアレやコレも実はシミュレート出来ちゃいます。

というわけで、個人的に便利だと思っているiPhoneシミュレータの機能をまとめてみました。

## 1. iPhoneシミュレータを回転させるショートカットキー

**「command + →」** で右回転、**「command + ←で左回転」** できます。

回転がほぼ必須なiPadアプリを開発するときは特に重宝します。

<div align="center"><img width="400" alt="iPhoneシミュレータを回転させるショートカットキー" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/339601/c7e95773-209c-3474-016f-5aa489db75a7.gif"></div>

## 2. 実は二本指のピンチも可能

**optionキーを押しながらトラックパッドに二本指を置いて片方の指を動かすとピンチできます。** (シミュレータ上に灰色のボタンが二つ表示されたら可能)

さすがにジェスチャ関係は実機を使った方がラクですが、サクッと確認したいときに結構重宝しています。

<div align="center"><img width="400" alt="実はiPhoneシミュレータは二本指のピンチも可能" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/339601/eaa9fc4a-0b2e-f815-fa33-52e0775bd9f4.jpeg"></div>

## 3. Color Blended Layers

レイヤーが重なっていればいるほど赤く表示してくれる「Color Blended Layers」ですが、 **自分は実際のUIパーツのサイズがどうなっているのかを確認するときによく使います。**

<div align="center"><img width="400" alt="Screen Shot 2020-07-30 at 14.23.12.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/339601/06a85a8c-cd2d-d3b9-4c9b-3e60a516fd2e.png"></div>

もちろん、ちゃんと見る場合はヒエラルキーを使った方が良いですが、サクッと確認したいときには重宝しますね。

**「メニューバー > Debug > Color Blended Layers」** で表示できます。

## 4. キーボードを表示・非表示するショートカットキー

UITextFieldもしくはUITextViewにカーソルを置いて、**「command + K」** を叩くとキーボードを表示・非表示できます。

なぜか、シミュレータだとキーボードが表示されない場合って結構あるのでこれを覚えておくと便利です。

<div align="center"><img width="400" alt="iPhoneシミュレータでキーボードを表示・非表示するショートカットキー" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/339601/3cdae735-aee4-678d-7539-e114e62c20a0.gif"></div>

## 5. 全てのデータを消去

**「メニューバー > Hardware > Erase All Content and Settings...」** で現在使用しているシミュレータの全データを削除できます。常識的なやつですが念の為。

## 6. ホーム画面に戻るショートカットキー

**「shift + command + H」** でホーム画面に戻ることができます。

ちなみに、 **「shift + command + H」を二連打すればアプリスイッチャーに遷移できるのでこれまた便利。** 捗ります。

<div align="center"><img width="300" alt="iPhoneシミュレータでキーボードを表示・非表示するショートカットキー" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/339601/5b04d44a-0570-0244-0c85-f0510ddf7d97.gif"> <img width="300" alt="iPhoneシミュレータでキーボードを表示・非表示するショートカットキー" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/339601/300da27f-76b9-7837-1795-d3bc3feef99e.gif"></div>

## 7. FaceIDもシミュレートできる

実はFaceIDもシミュレートできます。
まあ、FaceIDは実機を使った方がラクなのですが手元に実機がない場合は重宝します。

**「メニューバー > Hardware > FaceID」** から。

各項目の意味は以下の通り。

- Enrolled（FaceIDを使える端末として認識させる）
- Matching Face（FaceID認証が通ったことをシミュレート）
- Non-matching Face（FaceID認証が通らないことをシミュレート）

## 8. 位置情報を指定の場所にする

位置情報も指定できちゃいます。

**「メニューバー > Debug > Location > Custom Location...」** で緯度経度を指定できます。

<div align="center"><img width="400" alt="Screen Shot 2020-07-30 at 14.22.09.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/339601/6baa7d37-2c67-3845-1786-ab68a3953e6f.png"></div>

いや、「位置情報の開発はさすがに実機使うよ」という方は多いと思いますが、シミュレータは **どこでも** 行けるんです。

そう。例えばクパチーノでも。イタリアでも。もちろん北...極でも。

### 最後に
全部知っている方は少なくないと思いますが、自分がこれからiOS開発を始めるとしたらこれらを知ってると便利だと思うので書いておきます。

もし、この内のいくつかが参考になればこれ幸いです。
競技プログラミング練習記 No.59【ABC104練習】

初回 -> [はじめに](https://qiita.com/easychoco/items/a9ae28aca97cfe47091f)

[ABC104](https://atcoder.jp/contests/abc104)を解きました。
3完です！
C問題はコンテスト時間を過ぎて解きました。

|問題|時間|アルゴリズム|実行時間
|:-:|:-:|:-:|:-:|
| A |  2min |-| 8ms|
| B | 13min |-| 8ms|
| C | 102min |bit全探索+貪欲法| 5ms|

# まとめ
先にまとめを載せます。これ自体は最後に書いてます。

`char`型は内部では文字コードを数値で持っているので、その性質を小文字の判定に使えます。

C問題は2種類のアルゴリズムを組み合わせる問題ですね。
実はknapsackライクのDPでも解けて、初めはDPで解きました。
ですが、bit全探索を使うほうが単純で実行速度も速いのでこちらを載せます。
はじめから思いつきたかった。
DPの練習ができたのでいいということにします。。。


## A - Rated for Me
```c++
  int r;
  cin >> r;
  if (r < 1200) cout << "ABC";
  else if (r < 2800) cout << "ARC";
  else cout << "AGC";
```
入力値が`1200`未満・`2800`未満・それ以上の3通りを調べれば答えがわかります。

## B - AcCepted
``` c++
  string s;
  cin >> s;
  bool ok = (s[0] == 'A');
  int cnt = 0;
  for(int i = 1; i < s.length(); ++i)
  {
    if (s[i] == 'C') cnt += ((2 <= i && i <= s.length() - 2) ? 1 : 2);
    else ok &= ((int)'a' <= (int)s[i] && (int)s[i] <= (int)'z');
  }
  ok &= (cnt == 1);
  cout << (ok ? "AC" : "WA");
```
1文字目が`A`かどうかを判定
2文字目以降に`C`が来たら「何文字目か」と「これまでに出た`C`の個数」を判定
2文字目以降に`C`以外が来たら小文字かどうかを判定
で答えがわかります。
`char`型は内部では文字コードを数値で持っているので、その性質を小文字の判定に使いました。

## C - All Green

``` c++
  int d, g, p_input, c_input;
  cin >> d >> g;
  g /= 100;
  vector<int> point(d);
  vector<int> comp(d);

  for(int i = 0; i < d; ++i)
  {
    cin >> p_input >> c_input;
    c_input /= 100;
    point[i] = p_input;
    comp[i] = p_input * (i + 1) + c_input;
  }

  int mask = 1 << d;
  int ans = INF;
  while(mask--, mask >= 0)
  {
    int score = 0;
    int cost = 0;
    for(int i = 0; i < d; ++i)
    {
      if ((mask & (1 << i)) == 0) continue;
      score += comp[i];
      cost += point[i];
    }

    if (score >= g) 
    {
      ans = min(ans, cost);
      continue;
    }

    for(int i = d - 1; i >= 0; --i)
    {
      if(mask & (1 << i)) continue;

      int rest = (g - score) / (i + 1);
      score += min(rest, point[i] - 1) * (i + 1);
      cost += min(rest, point[i] - 1);

      if (score >= g) 
      {
        ans = min(ans, cost);
        break;
      }
    }
  }
  cout << ans;
```
各難易度の問題をコンプリートすると追加点がもらえます。
追加点がなければただの貪欲法なのですが、追加点があることで複雑になっています。

そこで、コンプリートする場合としない場合とで分けます。
コンプリートするかしないかをbit全探索をして、しない難易度の問題を貪欲法で解きます。
全探索は $O(2\ ^n)$ ですが、問題の難易度は最大で`10`通りなので計算が間に合います。

コンプリートによるスコアと解いた問題数を記憶した後、解いていない難易度について貪欲法に入ります。
点数の高い方からコンプリート1問手前まで問題を解いて、目標スコアを超えた時点での解いた問題数がわかります。
これを $2\ ^d$ 回続けて、最小となった問題数が答えです。

以上です。ありがとうございました。
Acquia認定サイトビルダー試験その②⇒開発者向け

#メニュー
  
##メニューリンク
  - module.links.menu.yml
  - hook_menu_links_discovered_alter()

```
module.scheduleList:
  title: "カレンダー一覧"
  description: "カレンダー一覧画面"
  route_name: entity.node_type.collection
  weight: -200
  parent: system.admin_content

module.addSchedule:
  title: "カレンダー登録"
  url: internal:/admin/content/event/calendar/add
  weight: -150
  parent: system.admin_content
```

##アクションリンク
 - module.links.action.yml


##ローカルタスク
 - module.links.task.yml

##コンテキストリンク
 - module.links.contextual.yml
 - hook_contextual_links_alter()

#TWIG
##if 
```
{{ content is node ? 'node' : 'not node' }}
```

##loop変数
 - loop.index	         ループの現在の反復。（1インデックス付き）
 - loop.index0	         ループの現在の反復。（0インデックス付き）
 - loop.revindex	ループの終わりからの反復回数（1インデックス付き）
 - loop.revindex0	ループの終わりからの反復回数（0インデックス付き）
 - loop.first	        最初の反復であれば真
 - loop.last	        最後の反復であれば真
 - loop.length	        シーケンス内のアイテムの数
 - loop.parent	        親コンテキスト

##for インデックス付き
```
<ul>
  {% for delta, value in items %}
    <li>{{delta}}: {{ value.content }}</li>
  {% endfor %}
</ul>
```

##if付for
```
<ul>
  {% for item in items if item.status %}
    <li>{{ value.content }}</li>
  {% endfor %}
</ul>
```

##else付for
```
 <ul>
  {% for item in items %}
    <li>{{ item.content }}</li>
  {% else %}
    <li>This list is empty</li>
  {% endfor %}
</ul>
```

##HTMLタグ間の空白を削除する
```
{% spaceless %}
<div>
    test
</div>
{% endspaceless %}
```

```
{%- for item in items -%}
  {{ item.content }}
{%- endfor -%}
```

##attributes
```
<div{{ attributes.addClass(classes).removeClass('my-special-class') }}></div>
<div{{ attributes.setAttribute('id', 'myID') }}>
<div{{ attributes.removeAttribute('id') }}>
{% if attribute.hasClass('myClass') %}
  {# do stuff #}
{% endif %}
<div class="{{ attributes.class }} my-custom-class"{{ attributes|without('class') }}>
```

#Drush
```
# メンテナンスモード有効
drush sset system.maintenance_mode 1 
drush cr

# メンテナンスモード無効 
drush sset system.maintenance_mode 0 
drush cr 

# テーマ
drush en mayo 
drush config-set system.theme default mayo

# ダンプ取得
drush sql-dump > backup.sql

# ダンプ導入
drush sql-query --file=backup.sql

```
Laravel artisanコマンド　【備忘録】

今後使わなくなっても、思い出しやすくするために書きました。


###Laravelで使うコマンド


#####基本形
```:ターミナル

$ php artisan コマンド
```


#####作成系
```:ターミナル

$ php artisan make:controller コントローラー名


$ php artisan make:migration マイグレーション名
```


#####マイグレーション実行
```:ターミナル

$ php artisan make:migrate
```


######サーバーを起動
```:ターミナル

$ php artisan serve
```









もっと価値ある情報発信できるようにならねば。
【Python初心者】1つのリストを分割する(5行)。

結論
---

```python:これを覚えよう
split_list(l, n)

#l: リスト
#n: サブリストの要素数
```

使い方
---

```python:リストを分断するよ
def split_list(l, n):
    for idx in range(0, len(l), n):
        yield l[idx:idx + n]
 
l = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] #元のリスト
result = list(split_list(l, 3)) #いくつの要素ずつに分けるか

print(result) # [[1, 2, 3], [4, 5, 6], [7, 8, 9], [10]]

```
SPSSを使用して時系列データの予測モデルを作成する3

SPSSを使用して、特になにの工夫もせずに未来の予測値を出力してみた。
[SPSSを使用して時系列データの予測モデルを作成する](https://qiita.com/hajime_y/items/4034efd70b1533f417dd)
[SPSSを使用して時系列データの予測モデルを作成する2](https://qiita.com/hajime_y/items/85c423e221f4a3680db3)

###やりたいこと
今回は、データに簡単な加工を加えることで予測精度を上げることができるか試してみる。

###データの加工
[前回までに使用していたcsv](https://qiita.com/hajime_y/items/4034efd70b1533f417dd)を、データ型から「グラフ作成」→「ヒストグラム」に接続する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421201/dfc9ab05-79c8-b2c6-e1f5-dcb4200a6af7.png)

「ヒストグラム」の「フィールド」をUriageに設定して確認してみると
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421201/15878f59-af80-b97e-4ac1-4a23e52c853e.png)

目的変数であるUriageが、かなり偏ったデータであることがわかる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421201/02188c8a-1e41-def5-884e-fed7b236d465.png)

そこで、Uriageを、平方根をとったUriageSqrtに置き換えてみる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421201/342067ee-c2e1-a12d-3544-790b2de641cc.png)

先程と同様にヒストグラムを取った結果が以下。平方根にすることで、少し標準化された感じに見える
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421201/dff451c5-cfa2-17fc-c305-6509d97351ee.png)

###SPSSでのモデルづくり＆予測値の取得
[前々回](https://qiita.com/hajime_y/items/4034efd70b1533f417dd)と同じ方法で予測値を取得する。（手法1、手法2の両方を試す）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421201/ddbf8b37-b0c2-5bd2-5371-70974f9da6d3.png)

手順は全く同じなので省略。

###精度検証

前々回の手法1および手法2と比べて、目的変数の平方根を取っただけでそれなりに改善が見られた。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/421201/b93bcd13-2de5-bf2e-098e-98873f1a6fa2.png)

###今後の予定
【js】更新1週間以内の記事にNEWを付ける

#概要
更新日から1週間以内の記事にNEWアイコンを付けたときのメモです。

#実装
今回はMTで記事一覧ページを作成して、jsで判定するようにしました。

※HTMLに出てくる`<MT:～>`はMTタグです。
　今回の実装とは特に関係ありまません。

## HTML
HTMLは下記とします。
更新日時の横に「NEW」を表示するようにしたいと思います。

```index.html
<div id="article_area">
  <ul class="article_list">
    <MT:PageContents count="10">
      <MT:Entries lastn="0">
        <li>
          <time class="created"><MT:EntryDate format="%Y.%m.%d"></time>
          <span class="category"><MT:EntryTitle></span>
          <!-- ここにNEWアイコンのHTMLを入れる -->
          <a href="<MT:Entrylink>" target="_blank"><MT:EntryTitle></a>
        </li>
      </MT:Entries>
    </MT:PageContents>
  </ul>
</div>
```

　
アイコン用のHTMLは以下です。

```html
<span class="icon_new">NEW</span>
```

## Javascript
jsで更新日時を判定してアイコン用のタグを挿入します。
ざっと以下のような流れで実装します。

```new_icon.js
// 記事一覧のliタグを全て取得
var list = document.querySelectorAll('#article_area li');

// liをループで処理
list.forEach(element => {
    // <span class="category"></span>の下にアイコンを入れたいので親要素として取得
    var parent = element.querySelector('span.category');

    // 更新日時（2020.7.1）を取得して、.で年月日に分ける
    var time = element.querySelector('time.created').innerText.split('.');

    // 公開日の日付オブジェクト生成
    var created = new Date();
    created.setFullYear(time[0]);
    created.setMonth(time[1] - 1); // setMonth()は0～11なので、1引く
    created.setDate(time[2]);
    created.setHours(0, 0, 0, 0); // 時間を00:00:00に指定

    // 今日の日時と1週間後の日時を生成
    var today = new Date(new Date().setHours(0, 0, 0, 0));
    created.setDate(created.getDate() + 7);

    // 公開から1週間以内ならNEWアイコンを付与
    if (created >= today) {
        // NEWアイコン用のHTMLを生成
        var icon = document.createElement('span');
        icon.className = 'icon_new';
        icon.innerText = 'NEW';
        parent.after(icon); // 親要素の後ろにNEWアイコンを挿入
    }
});
```

NEWアイコンを付けるため、タイトル一覧のliタグを取得して1つずつ日時を判定しています。
`setMonth()`は0～11の値（0が1月）なので、HTMLから取得した月から-1しています。


# ソースコード　
解説無しのソースは以下になります。

```new_icon.js
var list = document.querySelectorAll('#article_area li');

list.forEach(element => {
    var parent = element.querySelector('span.category');
    var time = element.querySelector('time.created').innerText.split('.');

    // 公開日の日付オブジェクト生成
    var created = new Date();
    created.setFullYear(time[0]);
    created.setMonth(time[1] - 1);
    created.setDate(time[2]);
    created.setHours(0, 0, 0, 0);

    // 今日の日時と1週間後の日時を生成
    var today = new Date(new Date().setHours(0, 0, 0, 0));
    created.setDate(created.getDate() + 7);

    // 公開から1週間以内ならNEWアイコンを付与
    if (created >= today) {
        var icon = document.createElement('span');
        icon.className = 'icon_new';
        icon.innerText = 'NEW';
        parent.after(icon);
    }
});
```
dockerでOpenLDAPを使う

# LDAP
- Lightweight Directory Service

# 環境

- Ubuntu20.04(wsl2)

# 手順
- https://hub.docker.com/r/osixia/openldap/
- Openldap用のイメージがある

## docker-comppose.yml

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

services:
  ldap-server:
    image: osixia/openldap:latest
    restart: always
    container_name: ldap-host
    environment:
      LDAP_ORGANISATION: "vamp"
      LDAP_DOMAIN: "vamdemic.black"
      LDAP_ADMIN_PASSWORD: "password"
    ports:
      - "389:389"
    networks:
      - webnet

  ldap-admin:
    image: osixia/phpldapadmin:latest
    restart: always
    container_name: ldap-admin
    environment:
      PHPLDAPADMIN_LDAP_HOSTS: "ldap"
      PHPLDAPADMIN_HTTPS: "false"
    ports:
      - "8080:80"
    links:
      - "ldap-server:ldap"
    networks:
      - webnet

networks:
  webnet:
```

## 起動

```
sudo docker-compose up -d
```

## 起動確認

```
yuta@DESKTOP-PT34LID:/mnt/c/Users/yuta/openldap$ sudo docker-compose ps
   Name            Command         State               Ports
------------------------------------------------------------------------
ldap-admin   /container/tool/run   Up      443/tcp, 0.0.0.0:8080->80/tcp
ldap-host    /container/tool/run   Up      389/tcp, 636/tcp
```

## PHPAdminへログイン
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/293481/aa7011f1-e36d-3a0d-b14d-7c2358511915.png)

- ユーザー名は`admin`
- `cn=admin,dc=vamdemic,dc=black`
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/293481/d5ebd4dc-8b06-36bb-bf4f-1a4c79fa7bea.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/293481/35286c1e-f8d8-17be-1779-4614ad5b3c13.png)

## ユーザーを作る

### まずOUを作る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/293481/cc8dac1a-63bb-c7b1-0f99-0d6fe7ff86c6.png)

### ユーザーを作る
- ouを選んでcreate new child entry
- `kolab user entry`を選ぶ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/293481/32ac8e17-e4ad-3227-60c0-a9030c747db1.png)

- Requireの箇所を埋めれば作れる

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/293481/db7fe61d-11d0-aecd-b0ab-223cba90e6ad.png)

### 結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/293481/7f7d5591-7fcc-e830-a0ac-573ff5295ddd.png)



![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/293481/f5ad4064-fcdd-c088-fbb4-e7a5e0d4549f.png)


### ldapsarchで検索をかける

```
ldapsearch -x -D "CN=admin,DC=vamdemic,DC=black" -w 'password' -h "localhost" -p 389 -b "OU=vamp,DC=vamdemic,DC=black" "cn=yuta"
```

インストールされていない場合
```
sudo apt install ldap-utils
```

出力

```
# extended LDIF
#
# LDAPv3
# base <OU=vamp,DC=vamdemic,DC=black> with scope subtree
# filter: cn=yuta
# requesting: ALL
#

# yuta, vamp, vamdemic.black
dn: cn=yuta,ou=vamp,dc=vamdemic,dc=black
sn: yuta
cn:: IHl1dGE=
objectClass: inetOrgPerson
objectClass: top

# search result
search: 2
result: 0 Success

# numResponses: 2
# numEntries: 1
```


# 参考
https://qiita.com/yoshiyasu1111/items/c2d7d5f9a70afdaa8372
【Python初心者】2つのリストを交互に結合する(5行)。


結論（交互に結合）
---
```python:list1とlist2を結合
list1 = ['1', '2', '3']
list2 = ['hello', 'world']
result = [None]*(len(list1)+len(list2))
result[::2] = list1
result[1::2] = list2

print(result)#['1', 'hello', '2', 'world', '3']
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/616412/bef2bf8b-ce0e-1192-b9f4-15896774fc19.png)
作業環境をcloud9からVScodeに変更した

Ruby on railsでアプリを作成し、ec2環境までのデプロイが完了した。
ここまでの作業環境としてAWSのcloud9を利用してきた。
作品のレベルを上げるためにdockerの導入を検討し、それならば、作業環境をcloud9から卒業しVScodeに移行しようと考えた。

docker.fileとdocker-compose.ymlを作成し、無事にdocker環境下でもアプリの動作が確認できた。

git hubでpushし、cloud9にgit pullでファイルを同期させたところ、cloud9環境下でエラーが発生した。

原因はdocker導入にあたり以下の変更を加えたことである。

```ruby:database.yml
default: &default
  adapter: mysql2
  encoding: utf8
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  username: root
  password: <%= ENV.fetch("MYSQL_PASSWORD", "password") %>
  # host: localhost 変更前
  host: db # 変更後
```
hostをdbに変更したことにより起きたエラーだった。

vscode環境でも動作が確認できているので、cloud9は捨てるか、こちらにもdockerをインストールするかだが、
cloud9はの環境はブラックボックス的な部分があり、知識が不足しているため安易な変更は加えたくない。。。

ひとまず今回の目的である、作業環境をvscodeに変更し、dockerを導入することは完了したのでOKとした。

cloud9上でdockerを導入している人がいたら教えていただけたら幸いです。
sidecarとApple Pencil(ipadpro)を使ってMacで手書き署名ができる

MacOS catalinaのsidecarとiPad Pro の Apple Pencilをミラーリングさせることにより、Macで文書や画像に手書き入力ができます。

この情報はネット上でいくつか紹介されていますが、具体的に使用した例が少なく、私の欲しかった情報が英語サイトにしかなかったので、ここで紹介しようと思います。

ここで紹介するのは、Mac上にあるpdf文書にアップルペンシルで署名（手書きサイン）を入れる方法です。

例えばPDFの公式文書が電子メールで送られてきて、それの名前欄に署名をする必要がある場合を例にとります。

sidecarの技術がなかった１年前までは、1.プリントアウトしてから名前欄にボールペンで署名する ２.iPadなどのペンが使える電子機器に転送してそこで電子署名を手書きしそこからpdfを送り返す、 などの方法が選択肢としてありました。

sidecarを使うと、以下のステップで簡単署名ができます。
1.catalinaとiOSをAirPlayでミラーリングし、画面を共有する。
2.Mac標準ソフト「プレビュー」でPDF文書を開く。
3.iOS側の画面に映っているそのpdf文書をapple pencilで編集する。
4.保存ボタンを押せば即座にMac側にある元のpdf文書に手書き編集内容が反映される。

です。

一番のポイントは、プレビューでpdfを開けば、apple pencilで編集ができるという点です。

手書きは、線ツールではなく、自由曲線ツールを使うことで、タイムラグなく手書きそのままの感覚で線や文字が描けます。

また、一度書いた署名は、アプリに自動で保存されていますので、次回別のpdf文書に署名をする場合には、一から手書き署名しなくても、前に書いた署名を好きな場所にただ貼り付けることが可能です。
raspberry pi 4にphpenvをインストール！！

とはいいつつ、基本的には公式サイトに掲載されている[#installation](https://github.com/phpenv/phpenv#installation)を参考にすればOKです。前提パッケージが無い場合コンパイルが失敗するので主にそっちのメモの意味合いが強いです...

# 前提パッケージ

```bash
sudo apt install \
build-essential \
libxml2-dev \
libkrb5-dev \
libonig-dev \
libxslt1-dev \
libtidy-dev \
libzip-dev \
libcurl4-gnutls-dev \
libjpeg-dev \
libpng-dev
```

上記が無いとコンパイル中にコケるので入れておきましょう。上記を実行した上で失敗した場合は**エラーログ**に必要なパッケージが書いてあるので、適宜追加して下さい。そして**教えて下さい。**追記致します。

# phpenvのinstall

[Github - phpenv/phpenv#installation](https://github.com/phpenv/phpenv#installation)を参考にして下さい(投げやり)

# トラブルシューティング

1. ダウンロードに失敗する場合
    - 自宅の回線速度が遅い場合、`openssl`云々という表示が出たりしてタイムアウト、失敗してしまいます。空いている時間帯にもう一度チャレンジしましょう。**Stay Home**の影響で固定回線も混雑しているんでしょうか...。
2. ダウンロードは出来たが、コンパイルに失敗する場合
    - コンパイルに必要なパッケージが足りないと思われます。ログを確認後、`apt search`などを駆使してそれっぽいのを入れてみましょう。

# 引用・出典・参考

1. [https://github.com/phpenv/](https://github.com/phpenv/phpenv/)
wget で OpenSSL のエラーが出た時の対応方法

Ubuntu 20.04 で、群馬県の新型コロナウイルス感染症患者の発生状況のPDFを取得しようとしたところエラーがでました。

コマンド

```bash
wget https://www.pref.gunma.jp/contents/100162018.pdf
```

エラーメッセージ

```text
OpenSSL: error:141A318A:SSL routines:tls_process_ske_dhe:dh key too small
SSL による接続が確立できません。
```

こちらのページに対応方法が記述されていました。
[Ubuntu 20.04 - how to set lower SSL security level?](https://askubuntu.com/questions/1233186/ubuntu-20-04-how-to-set-lower-ssl-security-level)

まず、設定ファイルのあるフォルダーを探します。

```text
$ openssl version -d
OPENSSLDIR: "/usr/lib/ssl"
```

設定ファイルの編集

```text:/usr/lib/ssl/openssl.cnf
openssl_conf = default_conf
（省略）
[ default_conf ]

ssl_conf = ssl_sect

[ssl_sect]

system_default = ssl_default_sect

[ssl_default_sect]
MinProtocol = TLSv1.2
CipherString = DEFAULT:@SECLEVEL=1
```

再び wget を実行

```text
$ wget https://www.pref.gunma.jp/contents/100162018.pdf
--2020-07-30 11:33:55--  https://www.pref.gunma.jp/contents/100162018.pdf
www.pref.gunma.jp (www.pref.gunma.jp) をDNSに問いあわせています... 111.87.89.70
www.pref.gunma.jp (www.pref.gunma.jp)|111.87.89.70|:443 に接続しています... 接続しました。
HTTP による接続要求を送信しました、応答を待っています... 200 OK
長さ: 269445 (263K) [application/pdf]
`100162018.pdf' に保存中

100162018.pdf       100%[===================>] 263.13K   909KB/s    in 0.3s    

2020-07-30 11:33:56 (909 KB/s) - `100162018.pdf' へ保存完了 [269445/269445]
```
kubectl apply したら please apply your changes to the latest version and try again エラーで困った

# 背景
GKE環境で、リリース済みのdeploymentのimageを更新してデプロイしたかった。

`kubectl get deployments deployment_name -o yaml` で対象deploymentのyamlを取得して、imageのリンクを編集し、applyかけようとしたらエラーが発生。

```bash

kubectl apply -f some_deployment.yaml
~略~
Operation cannot be fulfilled on deployments.extensions "xxx": the object has been modified; please apply your changes to the latest version and try again
```

# 解決方法
yamlから以下の項目を削除したらエラーが出なくなった。オブジェクト依存の項目はリリース時のyamlには必要ないのかな(?)

- deployment.kubernetes.io/revision
- creationTimestamp
- generation
- resourceVersion
- uid

# 参考

[Kubectl error: the object has been modified; please apply your changes to the latest version and try again](https://stackoverflow.com/questions/51297136/kubectl-error-the-object-has-been-modified-please-apply-your-changes-to-the-la)
UiPath Test Suite のトライアル方法について

※ 2020年07月30日時点での情報です

[UiPath Test Suite](https://www.uipath.com/ja/product/test-suite) は、2020年07月08日にGAにな通常になりまして、通常の方式でTrial が可能になりました。「テスト自動化の歴史と現状を紐解きながら、UiPathで、この領域での新たな最適解を導き出すことが出来るのか」…:frowning2:




[トライアル申込みページ：TRY IT](https://www.uipath.com/ja/start-trial)



![348c9c61-5963-4146-98da-5c4670239772.jfif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/261711/37ff7c7f-086f-8d8c-aa80-c0489f227b6c.jpeg)


# Community Cloud 
```
Studio (1 license), StudioX (1 license), 
Studio Pro (1 license), Attended Robots (1 license).  
```
-->Testing Robot (UR）とTest Manager は試せない。

# Studio
```
Studio (1 license), StudioX (1 license), 
Studio Pro (1 license), Attended Robots (1 license). 
```
-->Testing Robot (UR）とTest Manager は試せない。

# Enterprise Cloud 
```
Attended Robots (2 license),Unttended Robots (1 license),
Testing Robot(1 license) Studio Pro(2 license) 
```
-->Test Manager は試せない。

# Enterprise Server
```
Orchestrator (1 license), Studio (10 licenses), 
StudioX (10 licenses), Studio Pro (10 licenses：Test Developer Pro),
Attended Robots (10 licenses), Unattended Robots (10 licenses), 
Action Center (10 licenses), Insights (1 license).
```
-->全て試せる






学習資料
---
■関連ドキュメント（Test Manager は日本語。Studio はまだ、英語）
 https://docs.uipath.com/releasenotes/lang-ja/docs/test-manager-general-availability
https://docs.uipath.com/studio/lang-ja/docs/application-testing
■関連アカデミー（まだ、英語） 
https://academy.uipath.com/learningpath-detail/2582/3/0/6 



是非、触ってみてください。
raspberry pi 4 centos7 install on docker

raspberry pi 4 (raspberry pi os) 上でDockerを起動し、その上でCentos7を起動する
その構築メモです
（2020.07.30時点、作成中です）

環境：
raspberry pi 4
docker(openmediavaultの同梱機能にてwebインストール）

手順１
centos7のdockerイメージをインストール

>pi@raspi:~ $ sudo su
>root@raspi:/home/pi# docker pull centos:centos7

手順２
docker 起動
>root@raspi:/home/pi# docker run -it -d --privileged --name centos7-1 centos:centos7 /sbin/init

手順３
Portainerでcentos7-1のコンテナが起動していることを確認
Portainerのコンソールを起動し、以下を入力

>yum update
>yum install NetworkManager
>systemctl enable NetworkManager.service
>systemctl start NetworkManager.service
>yum -y install openssh-server
>systemctl enable sshd.service
>systemctl start sshd.service

手順４
色々インストールしておく

>yum install python3 python3-pip
>pip install flask

手順５
コンテナからイメージを作成しておく

>WEBコンソールからコンテナを停止する
>コンソールから以下のコマンドを実行
>docker commit centos7-1 centos7base:centos7base

centos7baseというイメージが出来上がるので、次回以降はこのイメージから起動する
pythonのlist comprehension（list生成法）について

# 最初に
ブロックチェーンの練習について初めてやってみたけど、かなり練習してきたpythonでもやはり忘れることが多く、一見してわかりそうなことが実はわからなかったりする。今回は実は、この`all(k in value for k in list1)`というコードに出会って、わけわからんと思って調べたら、得られた知識です。メモっておこうと思った。

# pythonのリスト生成法
pythonのリスト生成法は色々あるが、今回紹介するlist comprehensionはその中で最も優れている方法かもしれない。　　

早速例を見よ

``` shell
>>> list(range(1, 11))
[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
```
じゃ`[1*1, 2*2, 3*3, ..., 10*10]`のリストを作りたいけど、どうする？

``` shell
>>> L = []
>>> for x in range(1, 11):
...    L.append(x * x)
...
>>> L
[1, 4, 9, 16, 25, 36, 49, 64, 81, 100]
```
上記も行けるけど、もう少し簡単に書こう。

``` shell
>>> [x*x for x in range(1,11)]
[1, 4, 9, 16, 25, 36, 49, 64, 81, 100]
```
一発で書けたんだね。
非常に役に立つ書き方だ。覚えておこう。たくさん書くとなれていくよ。

もう少し複雑なやつだと、二重ループ

``` shell
>>> [m + n for m in 'ABC' for n in 'XYZ']
['AX', 'AY', 'AZ', 'BX', 'BY', 'BZ', 'CX', 'CY', 'CZ']
```

``` shell
>>> d = {'x': 'A', 'y': 'B', 'z': 'C' }
>>> for x in d.items():
...     print(x)
('x', 'A')
('y', 'B')
('z', 'C')
>>> for k, v in d.items():
...     print(k, '=', v)
...
y = B
x = A
z = C
```

ここで、問題を出そう。　　
リストに文字列、数字があるとする。この場合ですと、lower()関数を下のように使ったら、エラーが出てしまう。
どのように設定したら、エラーが出ずに、文字列だけを抽出してlower()関数で文字列を小文字にできるか？


``` shell
>>> L = ['Hello', 'World', 18, 'Apple', None]
>>> [s.lower() for s in L]
```

回答：

``` python3
# -*- coding: utf-8 -*-
L1 = ['Hello', 'World', 18, 'Apple', None]
L2 = [x.lower() for x in L1 if isinstance(x, str)]
print(L2)

# ["hello", "world", "apple"]

```