OmniAICreator/Qiita-1.07M huggingface dataset:
初心者から始めるJava、配列

#はじめに
この記事は備忘録である。
参考書レベルの内容だが、本記事に掲載するコードについては、
**間違えた**ものが中心となる。これは実際にコーディング中に間違えた部分を掲載し、自分で反省するために投稿するという目的によるもの。
また、後日にJavaSilver試験問題の勉強を兼ねて復習するため、深い部分の話はここでは触れない。

##環境
言語：Java11、JDK13.0.2
動作環境：Windows10

#配列
**配列（`array`）**は、同じ型の値をまとめて記憶する機能を持つ。配列を用意するには、以下の手順を踏む必要がある。

1. **配列変数を宣言する**
2. **配列の要素(`element`)を確保する**

```Java:配列の準備例
int[] arrayOfScore;
arrayOfScore = new int[40];
//int型の値を40個記憶できる配列要素の宣言

//もしくは 
int[] arrayOfScore = new int[40];
```
`new`演算子を使って配列の入れ物をメモリ上に準備できる。この`new`は`クラス`や`インスタンス`のときにまた扱う。
例では40を指定しているが、[ ]内の数字は添字(`index`)であり配列変数内に用意した配列の通し番号となる。この`index`だが、
**Javaにおける配列の`index`は0から始まる**
よって最大の番号は「要素数-1」になる。
例の場合、**`arrayOfScore[0]`から`arrayOfScore[39]`まで**を用意したことになるので、間違っても`arrayOfScore[40]`が存在するものとして呼び出してはいけない。

また、配列は1ラインで初期化することが出来る。

```Java:配列の初期化
int[] arrayOfScore = {50, 62, 71, 94, 16, 8,};
//これでarrayOfScore[0] = 50;（以下略）を格納したことになる。

//上記式は以下の式に等しい。
int[] arrayOfScore = new arrayOfScore[6];
arrayOfScore[0] = 50;
arrayOfScore[1] = 62;
arrayOfScore[2] = 71;
arrayOfScore[3] = 94;
arrayOfScore[4] = 16;
arrayOfScore[5] = 8;
```

「変数なのだから、変数として代入できるのではないか」という疑問について。確かに代入可能だが、注意点が一つ。
別の変数を用意してそこに配列変数を代入した場合、「**同じ1つの配列を、2つの変数から参照する**」ことになるので、片方の中身を変えるともう片方の中身も変わったように見える。
同じ値を持つもうひとつの変数を用意しているのではなく、**元となる1つの配列を参照している**だけということを忘れてはいけない。
##多次元配列
配列の要素をさらに配列にする、2次元以上にわたる配列として、Javaは**多次元配列**を作ることが出来る。Excelの表を想像すれば分かりやすいだろう。

```Java:2次元配列の準備
int[][] eightClassesScoreArray;
 = new eightClassesScoreArray[40][8]
eightClassesScoreArray[0][0] = 65;
//(以下省略) 

//こうしてもよい
int[][] eightClassesScoreArray = {/*(省略)*/},{0,1,2,3,4 ,5 ,6 ,7}
```
各要素の数は長さをそろえる必要がないため、上記の40対8の配列も可であり、3次元・4次元と次元数が上がり要素数がバラバラでも多次元配列として存在できる。

#実践

```Java:arrayOmikuzi
//(省略)

int arrayOmikuziPattern[][] = new int[][5];
//とりあえず大吉から5段階は決まった。
//動きだけ見たいから要素からっぽでもよしとする。

for(int checker = 0;checker <5;checker++)
{
System.out.println("あなたの運勢は" + "【未実装】" + "と出ました。）;
System.out.println("おみくじ側の結果は" + (arrayOmikuziPattern[][checker]+1) + "番が出ました。");
}
```
2次元配列の宣言時点でコンパイルエラー。
**多次元配列宣言のとき、1次元目の要素数を省略してはいけない**らしい。

#終わりに
配列が3Dデータに使われているという話はよく聞く。これからの仕事に直結する可能性もあるので、配列はまた時間をかけて理解したい。

#参考
出来るだけ自分で変数や式を書いてコンパイルしているので、完全に引用する場合はその旨記述する。

[やさしいJava 第7版](http://mana.on.coocan.jp/yasaj.html)
[Java SE11 Silver 問題集](https://book.impress.co.jp/books/1118101186)（通称黒本）
Ubuntu18.04にGoをinstallする作業ログ

# 記事の目的
Ubuntu18.04にgo-langをinstallする作業ログ。

# Ref
https://github.com/golang/go/wiki/Ubuntu

# 作業ログ
```bash:bash
$ sudo add-apt-repository ppa:longsleep/golang-backports
$ sudo apt update
$ sudo apt install golang-go
$ go version
go version go1.14 linux/amd64
```
3/9 授業ノート

#今日習ったこと
**CSS**
・white-spaceプロパティ：
　ソース中のホワイトスペース（連続する半角スペース、タブ）、改行の表示方法を指定
　値の種類→nomal(初期値)、pre、nowrap、pre-wrap、pre-lineがある。
nowrap：
　ソース中のホワイトスペースを無視
　ソース中の改行を1つの半角スペースとして表示
　ボックスサイズが指定されている場合にも自動改行しない
・overflow：はみ出た要素の表示方法を指定する
　値の種類→visible(初期値)、hidden、scroll、auto、no-display、no-content
hidden：
　内容がボックスに収まらない場合、収まらない部分は非表示となる
　内容が収まらない場合にも、スクロールバーなどは表示されない

ex:)text非表示にする
    ```p{
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}```

**reset css**
・縦方向の揃え位置を指定する
```img{
vertical-align: bottom;
}```

#ミス
h2属性にpaddingのような謎の余白が…
→文字に高さがあることを失念していて、resetCSSで```line-hight: 1;```の設定が抜けていた！


#休んでいた期間の内容
今週中に教科書の内容をまとめる
**HTML**
・カラムを意識したコーディング(CSSの内容まとめながら考える！)
苦手：まだdiv idとclassの使い分けが言語化できてない
参考：```http://webfeelfree.com/html5-2col-and-3col-base-layout/```

**CSS**
カラム構成について
・boxモデルについて(教科書P110～119)
・displayプロパティについて(教科書P120～121)
・floatレイアウトについて(教科書P150～166)
・flexboxレイアウトについて(教科書P178～200)

#感想
まさか通学期間中に盲腸で長期欠席する羽目になるとは…。
とりあえずついてはいけてるので、
理解が定着していない範囲をどんどんまとめて記事にしていこう。
めちゃくちゃ大変だ。
Empirical Analysis of Session-Based Recommendation Algorithmsの要点整理

# 元論文
[Empirical Analysis of Session-Based Recommendation Algorithms](https://arxiv.org/pdf/1910.12781.pdf)

# 参考論文
[Evaluation of Session-based Recommendation Algorithms](https://arxiv.org/pdf/1803.09587.pdf)
[Neural Aentive Session-based Recommendation](https://arxiv.org/pdf/1711.04725.pdf)

# 対象アルゴリズム
12個のアルゴリズムを比較（non-neuralが6個、neural系が6個）。
non-neuralメソッドはnearest neighborベースの手法がメイン。あとはco-occuranceだったり、マルコフモデルだったり。
neuralメソッドはRNN+αのものが多い印象。

# 結果
## ECデータセット
+ VSTAN強い
+ データセットごとにかなり違う結果になる
+ NEXTITNETは遅すぎて実施できず

## Music Domain
+ nearest-neighborメソッド強し。
+ データセットごとにかなり違う結果になるが、neauralメソッドの中ではNARMが良さそう。

# まとめ・感想
+ session-based recommendationという設定（今のセッションしか分からない）では、シンプルなnon-neuralメソッドの方が概して良い。
+ scalabilityや説明のしやすさを考えると、シンプルな手法の良さが際立つ。
+ neuralメソッドの方は多分設定に合ったモデルが今の所考案できてないんだろうな。
+ より最新のモデルが良いパフォーマンスを示すわけではない。
Vagrantで開発環境を用意する

# この記事の目的
Vagrantで開発環境を準備する作業ログ。
しょっちゅうやるので、備忘録的に残しておきます。

# 作業ログ

## Ubuntu18.04の環境を準備する場合

```bash:bash
$ mkdir test && cd test # ディレクトリ名は適当。今回の場合はtest
$ vagrant init bento/ubuntu-18.04
$ vagrant up
$ vagrant ssh
```
AthenaのQUEUEのステータス

みなさんAthenaを知っているだろうか。
S3のファイルにqueryを発行して中身を検索できるあれである（雑）

そのAthenaをプログラム上から使う場合、CLIかBoto3あたりを使用すると思う。
start_query_execution でqueryを実行し、
その終了を get_query_execution で監視すると思う。

コードでは、この get_query_execution をつかってqueryのステータスを監視し、waitしたりException吐いたりしたいと思う。
get_query_execution が返してくるqueryのstatusは以下である。

* QUEUED
* RUNNING
* SUCCEEDED
* FAILED
* CANCELLED

私はQUEUEDというステータスがあることを知らずにプログラムを組んだため
この世に新しいバグを生み出すという罪深いことをしてしまった。
みなさんが私と同じ罪を犯さないように、ここに記しておく。

参考資料
https://docs.aws.amazon.com/ja_jp/athena/latest/APIReference/API_QueryExecutionStatus.html
空間フィルタリング  〜平滑化フィルタ〜

#空間フィルタリングとは？？
**空間フィルタリング**は画像からエッジやコーナーなどの特徴点(**キーポイント**)を抽出するための操作で、注目する画素とその周辺画素を用いて計算する。
単に**フィルタ**と呼ばれることもある。

式で定義してみる。
###相関
入力画像をI(x,y)、出力画像をJ(x,y)とし、(2N + 1)×(2N + 1)の領域を利用するとき、
$$
J(x,y) = \sum_{j = -N}^{N} \sum_{i = -N}^{N}F(I,j)I(x+i,y+j)
$$
と計算されるものを**相関**という。
(2N + 1)×(2N + 1)の行列F(I,j)は**カーネル**または**マスク**と呼ばれ、これを変化させることで様々な出力が得られる。

###畳み込み
入力画像をI(x,y)、出力画像をJ(x,y)とし、(2N + 1)×(2N + 1)の領域を利用するとき、
$$
J(x,y) = \sum_{j = -N}^{N} \sum_{i = -N}^{N}F(I,j)I(x-i,y-j)
$$
と計算されるものを**畳み込み**という。
畳み込みは、
$$
J = F*I
$$
と表すこともある。
畳み込み演算は、相関のカーネルをx,y方向で反転させたものと同一と考えることができる。

#空間フィルタリングの種類
空間フィルタには、様々な種類があるが代表的な平均化フィルタ、ガウシアンフィルタ、ばいいラテラルフィルタを紹介する。

###平均化フィルタ
以下のようなカーネルを使用する。
$$
F = \frac{1}{9} 
\begin{pmatrix}
1 & 1 & 1 \\\
1 & 1 & 1 \\\
1 & 1 & 1 
\end{pmatrix}
$$
平均化フィルタを用いると、画像のノイズが低減される。これを**平滑化**という。
上で示したのは、3×3の平均化フィルタだが、サイズを大きくすることもできる。
カーネルサイズが大きくなると、平滑化の効果が大きくなるが、大きすぎると全体的にぼやけた画像になってしまう。

###ガウシアンフィルタ
以下のようなカーネルを使用する。
$$
G(x,y,\sigma) = \frac{1}{2π \sigma}exp(-\frac{x^{2} + y^{2}}{ 2\sigma^{2}})
$$
平均化フィルタでは、中心画素と周辺画素に同様の重み付けをしていた。
一方で、ガウシアンフィルタは中心に近いほど重みは大きくなり、遠いほど小さくなる。
ガウシアンフィルタは平均化フィルタ同様、入力画像の平滑化を行う。
$\sigma$は**スケール**といい、平滑化の範囲を定めるパラメータである。
$\sigma$が大きくなるほど、平滑化の範囲が広くなる。

これまでの２つを用いると、入力画像が平滑化されるが、全体的にぼやけてしまい、エッジやコーナーなどの重要な情報まで失ってしまう。そこで提案されたフィルタがバイラテラルフィルタである。

###バイラテラルフィルタ
入力画像をI(x,y)、出力画像をJ(x,y)としたとき、
$$
W(x,y,i,j) = exp(-\frac{(x - i)^{2} + (y - j)^{2}}{ 2\sigma_d^{2}} - \frac{|| I(x,y) - I(i,j) ||^{2}}{2\sigma_r^{2}})
$$
$$
J(x,y) = \frac{\sum_{j = -N}^{N} \sum_{i = -N}^{N}W(x,y,i,j)I(x-i,y-j)}{\sum_{j = -N}^{N} \sum_{i = -N}^{N}W(x,y,i,j)}
$$
で表されるフィルタが**バイラテラルフィルタ**である。
式を見てみると、ガウシアンフィルタと類似しているが、バイラテラルフィルタはさらに注目画素と周辺画素の輝度の差を用いて重み付けされている。

バイラテラルフィルタを用いると、平均化フィルタ、ガウシアンフィルタよりもエッジやコーナーがきちんと保持される。

#まとめ
空間フィルタリングは、画像に対してカーネルを掛け合わせる処理であり、カーネルの中身、大きさによって画像に様々な処理を施す。
入力画像の平滑化をするフィルタとして、平均化フィルタ、ガウシアンフィルタなどがあるが、これらはエッジ、コーナーなどの重要な情報まで失ってしまう。
これらの問題を解消したのが、バイラテルフィルタである。


###参考文献
[画像認識(機械学習プロフェッショナルシリーズ)](https://www.amazon.co.jp/dp/B0756V3TPG/ref=dp-kindle-redirect?_encoding=UTF8&btkr=1)
Kony Marketplaceの利用方法

# 目次
1. Kony Marketplaceとは？
2. 利用手順

# Kony Marketplaceとは？
Kony Marketplaceを使用すると、
コンポーネント、パターン、サービス、アダプターを探索・使用・提供することで、アプリを素早く設計および構築できる。

# 利用手順
## Kony Marketplaceにあるコンポーネントをダウンロードする手順
・以下リンクにアクセス
https://marketplace.kony.com
・必要なコンポーネントを選択する。
・「Import To Collection Library」をクリックする。
・「Library Name」と「Collection Name」を入力する　=> 「OK」を選択してインポートプロセスを実行する。
・インポートが正常に完了すると、画面の左下隅にある「My Libraries」タブにコンポーネントが表示される。
・そのコンポーネントを使用するには、事前に作成されたフォームが必要で、コンポーネントを「My Libraries」からその作成されたフォームにドラッグする。
・ユーザーは、「Templates」タブの「Components」セクションで、必要に応じてコンポーネントのインターフェイスまたはロジックをカスタマイズできる。
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">Market Placeからコンポーネントをダウンロードして使用する手順 <a href="https://t.co/XcD5Z62ZAW">pic.twitter.com/XcD5Z62ZAW</a></p>&mdash; Kony (@Kony12763790) <a href="https://twitter.com/Kony12763790/status/1244455811113353217?ref_src=twsrc%5Etfw">March 30, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

## コンポーネントを作成する手順
・既存のフォームからコンポーネントを作成するには、完全なコンポーネントを作成するすべてのウィジェットを含むflexContainerを作成する必要がある。
。そのflexContainerを選択し、右クリックして「Create Component」を選択する  =>  2つのオプションがある。
・w/o Contractのコンポーネントを使用すると、コンポーネントのプロパティ、イベント、およびメソッドの
どれを公開するかを制御、またカスタムプロパティ、イベント、およびメソッドも作成もできない。
・逆に、With Contractのコンポーネントを使用すると、コンポーネントのユーザーに公開するものを制御できる。
ターゲットオーディエンスが利用できるようにするプロパティ、イベント、およびメソッドのみを公開し、 さまざまなオーディエンス向けにデジタルアプリケーションを迅速に作成・展開する能力を強化する。
・「With Contract」または「w/o Contract」の形式でコンポーネントを作成した後、ユーザーは必要に応じて、コンポーネントのインターフェイスやコーディングロジックなどのカスタマイズができる。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">コンポーネントを作成する手順 <a href="https://t.co/JS1b8m4bLm">pic.twitter.com/JS1b8m4bLm</a></p>&mdash; Kony (@Kony12763790) <a href="https://twitter.com/Kony12763790/status/1244453909042589697?ref_src=twsrc%5Etfw">March 30, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

## 作成したコンポーネントをエクスポートする手順
コンポーネントをプロジェクトにインポートできるのと同じように、作成したコンポーネントをエクスポートできます。
その後、コンポーネントを別のプロジェクトにインポートしたり、他のプロジェクトと共有したりできます。

コンポーネントをエクスポートするには、次の手順に従います。

1. コンポーネントをコレクションに追加した場合は、[ テンプレート ]タブに表示されているコンポーネントを選択します。

2. コンポーネントを右クリックし、[ エクスポート ]を選択します。
3. コンポーネントをエクスポートする場所に移動し、[ 保存 ]をクリックします。Quantum Visualizerはコンポーネントをその場所にエクスポートします。

# 次の記事
次の章でいよいよ最後です！
開発中にエラーなどが発生した時に役立つ情報を記載しています。

是非次の記事もチェックしてくださいね！

▶︎[エラーが発生した時に確認する記事まとめ](https://qiita.com/Kony_Team/items/56867a7c8c977ba58e3c)

記事一覧：
https://qiita.com/Kony_Team/private/4c922fa016ce95c58406


**参考**
https://docs.kony.com/konylibrary/visualizer/visualizer_user_guide/Content/C_UsingComponents.htm#Publish
よく使うapacheの設定場所まとめ

#DocumentRootを確認する。
httpd.confの中にDocumentRootは存在します。

/etc/httpd/conf/httpd.conf


#error_logの場所

less /var/log/httpd/error_log

#access_logの場所
/var/log/httpd/access_log

#.htaccessの設定

.htaccessは、httpd.confで設定可能。

```
<Directory />
～中略～
AllowOverride None
～中略～
</Directory>


<Directory />
～中略～
AllowOverride All
～中略～
</Directory>
```

参考URL:https://www.be-webdesigner.com/technotes/server/httpd_conf/htaccess.htm
【Rails】独自ヘルパー(Helper)メソッドの使い方

#ヘルパーとは
`helper`(ヘルパー)を一言で表すと、
__「処理を別ファイルに分離し、viewをよりシンプルにDRYに書くためのモジュール」__
です。
(view以外もhelpできますが、基本的にはviewをhelpしてくれるものだと捉えましょう)

_※`DRY（Don’t Repeat Yourself）原則`とは
「同じコードを重複させない」という意味だけでなく、「1カ所の修正で済むのであれば、できる限りそうなるようにプログラムを作るべき」という意味をもつ原則です。_

Railsには、もともと用意されているhelper
→`link_to`、`form_with`、`image_tag`　などが存在しますが、

今回は、それとは別に独自ヘルパーについて説明します。

#独自ヘルパーの活用方法

ヘルパーモジュールは、`app/helpers`配下にあります。
ファイルの使い分けとして、

・`application_helper.rb`は、
アプリケーション全体にわたって使うヘルパーメソッドを定義
・`xxx_helper.rb`は、
その"xxx"だけで使うヘルパーメソッドを定義

と使い分けると、ヘルパーメソッドの管理が楽です。

※デフォルトでは、`application_helper.rb`ファイルが準備されていますが、
`xxx_helper.rb`は`rails g controller〜`の段階で一緒に作成されます。

###例
####①名前を入れるとこんにちは!〜を自動で追加する独自ヘルパーメソッド生成
```sumple_helper.rb

module SumpleHelper

  def hello(name)
    "こんにちは! #{name}さん。"
  end

end
```

####②実際に使用
```sumple.htmlerb

<%= hello("ミルクボーイ") %>
```

####③ブラウザでの実行結果
```

こんにちは! ミルクボーイさん。
```

となります。

#注意点
もし、同じ名前のヘルパーが読み込まれてしまうと、Viewファイルなどでヘルパーを使ったときにどちらのヘルパーが使用されるか分かりません。

そのため、ヘルパー名はの命名には気をつけましょう！

→他のViewファイル等で被らない独自の名前をつけるなど。
ちなみに今回のような`hello`は危険なヘルパー名と言えます。

#helperを活用する基準
●同じ表示が繰り返される場合
Railsアプリケーションのあらゆる箇所で、同じ内容を表示する場合は、ぜひ`helper`を利用しましょう。

→`helper`として1カ所にまとめておくことで、その内容の修正が簡単になります。

●ほぼ同じViewだが、属性などによって表示内容を変えたい場合
動的にHTMLを生成する場合、Viewファイル内にプログラムを記載することがあります。
しかし、そうするとViewファイルの可読性が悪くなります。
そんなときに、`helper`を使って分離してやることで、シンプルで綺麗なコードを実現できます。

#さいごに
今回紹介したように、独自の`helper`を定義して開発を進めていくことによって、よりスマートに開発を進めていけます。

これを機にRailsにはどんな`helper`が用意されているのか、またどんな独自`helper`を作ることができるのか。
調べてみてはいかがでしょうか！

【参考】
https://web-camp.io/magazine/archives/19136
[rails] [初学者向け]docker環境でbinding.pryを使ってデバックする方法

# 概要
今更ながらデバックを手助けてくれる
「**binding.pry**」さんを知り、実際にデバックしてみました。
私がrails初学者ということもあり、
導入出来ても、デバックの仕方が分からず思ったより時間がかかりました。

### 目的
1. **手順別に分かりやすく説明**
2. **デバック方法まで記述**
3. **メモ代わり**

# 環境
rails:5.2.3
ruby:2.5.6p201

# binding.pryの導入
```Gemfile.
group :development, :test do
  gem 'pry-rails'
  gem 'pry-byebug'
end
```
※gemfileに記述後、**bundle installを忘れずに！**

# docker-compose.ymlの書き換え
```docker-compose.yml
web:
  tty: true
  stdin_open: true
```
これでコンテナ内の標準入出力をローカルマシンのターミナルにアタッチしてくれるらしいです。

ここまでbinding.pryの環境が揃いました！
次は実際にデバックしてみます。
# 実際にデバックしてみよう！
## デバックしたい部分にbinding.pryを記述
今回はコメント機能を作り、コメントを投稿する際（createアクション）のbinding.pryを使ってparamsの中身を確認していきます。

テキストエディターでデバックしたメソッドの部分にbinding.pryを記述します。
こんな感じ。
<img width="704" alt="スクリーンショット 2020-03-09 19.44.48.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/504349/a2cb29a7-f304-b8e9-547e-707a6e1ee8db.png">

## ローカル環境で確認
ローカル環境でデバックしたいメソッドを実行します。
今回の場合だとcreateアクションをローカルで実行。
<img width="757" alt="スクリーンショット 2020-03-09 19.46.41.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/504349/8aacecdb-51e6-f538-601b-2baa49b13a29.png">
これでコメント投稿します。
ボタンを押すと、ローカルの環境が読み込みをします。
docker-compose upしたターミナルを確認すると、このように出てくると思います。

```docker-composeしたターミナル.
web_1  |     26: def create
web_1  |     27:   binding.pry
web_1  |  => 28:   @comment = Comment.create params.require(:comment).permit(:content, :image).merge(user_id: current_user.id)
web_1  |     29:   if @comment.save
web_1  |     30:     redirect_to('/comments')
web_1  |     31:   else
web_1  |     32:     redirect_to('/comments/new')
web_1  |     33:   end
web_1  |     34: end
```

## コンテナにアタッチ
別ターミナルで`docker ps`を実行。

```
CONTAINER ID        IMAGE               COMMAND                  CREATED             STATUS              PORTS                    NAMES
7fdf3a1fd61c        baukis_rails        "prehook 'ruby -v'..."   5 seconds ago       Up 4 seconds        0.0.0.0:3333->3000/tcp   baukis_rails_1 # attachしたいのはこれ
cb68afd353c8        baukis_spring       "prehook 'ruby -v'..."   5 seconds ago       Up 4 seconds                                 baukis_spring_1
7b86e4f07b20        postgres:9.6.2      "docker-entrypoint..."   6 seconds ago       Up 7 seconds        0.0.0.0:5432->5432/tcp   baukis_db_1
```
アタッチするコンテナの名前を確認して
`docker attach コンテナ名`
何回かエンターキーを押すとこのような感じになると思います。

```
[1] pry(#<CommentsController>)> 
[2] pry(#<CommentsController>)> 
[3] pry(#<CommentsController>)> 
```
出てきた`pry(#<CommentsController>)>` 後に確認したいもの（paramsとか）を入れると確認できます。

```
[5] pry(#<CommentsController>)> params
=> <ActionController::Parameters {"utf8"=>"✓", "authenticity_token"=>"ehW0cn0HjmT11Z2NprSp9G/IeJE0P97ylBfIrLOOzCsG1S2E6k/BSmRfc+JQsVUSEG1+FtGVjpQTXku1Th6m3w==", "comment"=>{"content"=>"テスト"}, "commit"=>"登録する", "controller"=>"comments", "action"=>"create"} permitted: false>
```


# 参考記事
[docker-compose上のRailsのデバッグを行う](https://budougumi0617.github.io/2017/09/02/debug-rails-on-docker/)
[docker-composeで作ったrailsの環境でbinding.pryを使えるようにする話](https://qiita.com/kosukeKK/items/f7111247f22050aeedad)
クラウドネイティブってなに？

クラウドネイティブとは、クラウド上での利用を前提して設計されたシステムやサービスのことである。

# 歴史

クラウドサービスが登場した当初は、自社のサーバーを使用する（オンプレミス）方式で用いられていたシステムをクラウドに移設して利用する方法が用いられた。
クラウドが普及・浸透したことで、はじめからクラウドで利用する想定で設計されたシステムが登場しはじめ、従来のシステムと区別する際にクラウドネイティブと呼ばれるようになっている。

# 定義

CNCF（Cloud Native Computing Foundation）クラウドネイティブなアプリケーションのためのオープンソースソフトウェアの開発を進めている団体ではクラウドネイティブのことを以下のように定義しています。

>クラウドネイティブ技術は、パブリッククラウド、プライベートクラウド、ハイブリッドクラウドなどの近代的でダイナミックな環境において、スケーラブルなアプリケーションを構築および実行するための能力を組織にもたらします。このアプローチの代表例に、コンテナ、サービスメッシュ、マイクロサービス、イミューダブルインフラストラクチャ、および宣言型APIがあります。
これらの手法により、回復性、管理力、および可観測性のある疎結合システムが実現します。 これらを堅牢な自動化と組み合わせることで、エンジニアはインパクトのある変更を最小限の労力で頻繁かつ予測どおりに行うことができます。

>Cloud Native Computing Foundationは、オープンソースでベンダー中立プロジェクトのエコシステムを育成・維持して、このパラダイムの採用を促進したいと考えてます。 私たちは最先端のパターンを民主化し、これらのイノベーションを誰もが利用できるようにします。
（引用：https://github.com/cncf/toc/blob/master/DEFINITION.md）

つまり、ソフトウェアの開発にあたっては、クラウドネイティブのほうが効率が良く、サービスの提供規模が拡大した際にも柔軟に対応できる的な感じ！


# じゃーよく聞く、クラウドファーストとクラウドのネイティブの違いは？
   
コンテナをしようする事が前提？かつ、アプリケーションの細分化しての開発の度合いか？

### とすれば、コンテナと仮想マシンの違いは？
    
![kz_kore1214_01.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/406727/1d9318cb-56da-4230-ae16-8f006b8e2a35.jpeg)

つまり、複数のOS上で稼働するのか？一つのOSで稼働するのか？ 
逆に言えば、OSがタスクをCPUへの割り当てを任意で変更することはできない？そういう状況を必要とするかはわからないが...

---
# 設計段階の違いは？

### オンプレミスの構築

システムが稼働キャパシティプランニングとしてシステムに必要な処理能力をあらかじめ予想し、その能力をある程度上回るサーバーやストレージを最初から用意する必要があります。そのうえでハードウェアを調達して構築するといったコストと手間が構築時に必要となる。

### クラウドファーストでの構築

稼働したあとでも、インフラ環境を追加したりといったことが柔軟に行える。そのため、比較的小さめのインスタンスやストレージを調達してクラウド上でシステムを稼働させたあとで、性能が必要になる場面で適切な大きさのインスタンスや高性能なストレージへ切り替えればよい、ということになります。つまり、初期コストを抑えて徐々に追加できる！！！

### クラウドネイティブでの構築
コンテナを利用することを前提としているため、開発段階でアプリケーションを機能ごとうに分解して設計し、それぞれの機能をコンテナに載せるイメージか。以降、状況によってコンテナを増設したり、追加の機能を拡張したりできる。かつそれぞれが独立していることによりリスク分散がされる。

---
# クラウドネイティブたる技術的要素

- マイクロサービス
    - マイクロサービスとは、アプリケーションの構成要素ごとに細分化して開発を行うアーキテクチャ（構築思想）です。
    - 機能ごとに細分化されているため、アプリケーション開発の効率が上がるだけではなく、障害等が発生した際にもその影響を最小限に留めることができます。
- コンテナ
    - マイクロサービスを利用したクラウドネイティブ実現のために利用するのが「コンテナ」です。コンテナはマイクロサービスそれぞれのプログラムの実行環境として機能します。
    - コンテナはアプリケーション層での仮想環境で動作するため、ひとつのOS上で実行できます。そのため、仮想マシンで複数のOS上で実行した場合に比べるとCPUやメモリのリソースも抑えられるメリットがあります。
- オーケストレーション
    - オーケストレーションは、コンテナを効率よく管理するために使われる技術です。
    - マルチホストでコンテナを稼働させる場合、ネットワーク接続や起動するホストの管理、動作状況の確認などが必要になります。これを司るのがオーケストレーションツールとよばれるもの。
- サービスメッシュ
    - サービスメッシュはマイクロサービス間の通信を担います。負荷分散や通信トラフィックの最適化、さらには安全な通信を実現するためのセキュア化などの役割も担っており、これらの機能をソフトウェアのレイヤーで実行します。


スッキリはしないが、イメージだけはなんとなく。。。。


>参考
>[クラウドネイティブとは？意味やIT組織に与える影響をわかりやすく解説【テクノロジー・AI 入門編】](https://www.iedge.tech/article/10682/2/)
BEMでhtmlにModifierつきのクラス名を付与だけでElementのスタイルも反映する

# いつもこうやっていた実装

BEMでModifierを使うとき、Elementのクラス名もhtmlに付与しないとElementのスタイルが付与されない。
htmlのclassがやたら長くなるので嫌だなーと思っていた。

```scss
.block {
  width: 300px;
  margin: auto;

  &__element {
    display: inline-block;
    border-radius: 3px;

    &--modifier1 {
      background: red;
    }

    &--modifier2 {
      background: blue;
    }
  }
}
```

```css:書き出し後
.block {
  width: 300px;
  margin: auto;
}
.block__element {
  display: inline-block;
  border-radius: 3px;
}
.block__element--modifier1 {
  background: red;
}
.block__element--modifier2 {
  background: blue;
}
```

```html
<div class="block">
  <div class="block__element block__element--modifier1"></div>
  <div class="block__element block__element--modifier2"></div>
</div>
```

# mixinで解決

mixin使って親スタイル持ってこれるようにすればできそう。

```scss
@mixin Element($blockName) {
  &__#{$blockName} {
    @content;
  }
}
@mixin Modifier($modifierName) {
  $parent: &;
  &--#{$modifierName} {
    @extend #{$parent};
    @content;
  }
}

.block {
  width: 300px;
  margin: auto;

  @include Element(element) {
    display: inline-block;

    @include Modifier(modifier1) {
      background: red;
    }

    @include Modifier(modifier2) {
      background: blue;
    }
  }
}
```

```css:書き出し後
.block {
  width: 300px;
  margin: auto;
}
.block__element, .block__element--modifier2, .block__element--modifier1 {
  display: inline-block;
}
.block__element--modifier1 {
  background: red;
}
.block__element--modifier2 {
  background: blue;
}
```

```html
<div class="block">
  <div class="block__element--modifier1"></div>
  <div class="block__element--modifier2"></div>
</div>
```

cssが太りそうだけど、htmlは多少すっきりする。
ローカルでRails sした際にA server is already runningと出た際の対処方法

#lsof -i:3000　とコマンドにうち、kill -9 (pid番号)で動いているpidを削除

自分のメモ用としてここに記述します。

Rails sすると

```
A server is already running 
```

と表示されて、既にサーバーは動いていますと表示されてしまった・・・。
サイトが更新されないのに、サーバーが既に動いていると表示されている。

#解決方法

①

```
lsof -i:3000
```
とターミナルにうつ

②表示されているpid番号を

```
kill -9 (pid番号)
```

でpidを削除する。

③
<b>Rails s</b>し、サーバーを起動する




#参考にさせていただいたサイト様
https://www.techry.net/blogs/451


以上となります。
間違っている、ここはこうしたほうが良い等ございましたらご指摘いただけますと幸いです。
マイグレーションのあれこれ

## マイグレーションに関すること

### マイグレーションの確認
現在どのファイルまでをマイグレーション実行したのかを確認するには

```:ターミナル
bundle exec rake db:migration:status
```
を実行する。
出力ではマイグレーションファイルの名前の横に[UP]または[DOWN]が出るが
UPはマイグレート済み
DOWNはマイグレート未実行
を表す。DOWNであれば削除しても構わない。

### マイグレーションの修正
マイグレート実行後に修正点を見つけ、修正を行いたい場合には
①bundle exec rake db:rollbackで一度マイグレートされていない状態に戻す
②マイグレーションファイルを修正する
③再びマイグレートを行う
この手順で行うことで修正が可能である。
bundle exec rake db:rollback STEP=x
xの部分に数字を入れることで任意の数分マイグレートを戻すことができる。

または修正を行うマイグレートファイルを新規作成しマイグレートすることで修正可能

### マイグレートファイルは消去してはいけない
ファイルを消去したからといって今後のファイルの実行に影響は出ないが、消去は絶対にしてはいけない
それは本番環境へデプロイする際にファイルをpushするが、それを元にマイグレートを実行するとローカルと異なるデータベースが作成されてしまうからである。
ActionMailerの件名に自前でprefixをつける

## 前提
Emailを送信するときの件名に 「[サービス名]新規登録が完了しました」 のように共通のprefixを付けていました。
そのために [email_prefixer](https://github.com/wireframe/email_prefixer) というgemを使っていたんですがメンテナンスが止まっておりgemのコードが原因のwarningに対処した話です。

```
DEPRECATION WARNING: `Module#parent` has 
been renamed to `module_parent`. 
`parent` is deprecated and will be removed in Rails 6.1. 
```

## コード

```app/mailers/applicatin_mailer.rb
class ApplicationMailer < ActionMailer::Base

  ..省略..

  after_action :append_prefix

  private

  def append_prefix
    mail.subject = if Rails.env.production? || Rails.env.development?
                     "［Qiita］ #{mail.subject}"
                   else
                     "［Qiita(#{Rails.env.upcase})］#{mail.subject}"
                   end
  end
end

```

## コードの中身
- email_prefixer gemの使用はやめました。
- ステージング環境かどうかははっきりさせたいので環境によって件名を変えています。
- after_action内のmailでいろいろと触れるのでやりたいことは大抵できるかと思います。
Linuxでファイル入出力のログを取りたい

#やりたいこと
ユーザがＰＣとＵＳＢメモリやＳＤカードをつないでデータを出し入れした時の
ログをとりたい。また、勝手にユーザが監視プロセスを落とせないようにしたい。
#インストール
inotify-toolsをインストール


```
sudo apt-get install inotify-tools
```
#試してみる
```
qiita@ubuntu:~$ inotifywait -m .&

```
mオプションをつけないと、１回出力するとコマンドが終了するとのこと。

```
qiita@ubuntu:~$ ls
Desktop  Documents  Downloads  Music  
./ OPEN,ISDIR
./ ACCESS,ISDIR
./ CLOSE_NOWRITE,CLOSE,ISDIR
qiita@ubuntu:~$
qiita@ubuntu:~$

```
lsで監視しているディレクトリにアクセスすると何か表示されている。

サブディレクトリはどうだろう

``` 
qiita@ubuntu:~$ mkdir hoge
./ CREATE,ISDIR hoge
qiita@ubuntu:~$ cd hoge
qiita@ubuntu:~/hoge$ ls
./ OPEN,ISDIR hoge
./ ACCESS,ISDIR hoge
./ ACCESS,ISDIR hoge
./ CLOSE_NOWRITE,CLOSE,ISDIR hoge
qiita@ubuntu:~/hoge$ mkdir hoge
qiita@ubuntu:~/hoge$ cd hoge
qiita@ubuntu:~/hoge/hoge$ ls
qiita@ubuntu:~/hoge/hoge$ 
```
監視されない
rオプションでサブディレクトリも監視されるようだ

```
qiita@ubuntu:~$ inotifywait -mr . &
[1] 2760
qiita@ubuntu:~$ Setting up watches.  Beware: since -r was given,
 this may take a while!
Watches established.

qiita@ubuntu:~$ cd hoge
qiita@ubuntu:~/hoge$ cd hoge
qiita@ubuntu:~/hoge/hoge$ ls
./hoge/ OPEN,ISDIR hoge
./hoge/hoge/ OPEN,ISDIR 
./hoge/ ACCESS,ISDIR hoge
./hoge/hoge/ ACCESS,ISDIR 
./hoge/ ACCESS,ISDIR hoge
./hoge/hoge/ ACCESS,ISDIR 
./hoge/ CLOSE_NOWRITE,CLOSE,ISDIR hoge
./hoge/hoge/ CLOSE_NOWRITE,CLOSE,ISDIR 
:%

```

ちなみに、作業中、firefoxを動作させていたのだけれど、

.cache/mozilla/firefox/
配下に書き込みがfirefoxから行われるようで、
大量のログがnotifywaitから書き出されていました。
ユーザを変えても、アクセスするとログは出力されました。

もし、ルートディレクトリを監視するとどうなるか？

```
qiita@ubuntu:~/hoge/hoge$ inotifywait -mr / &
[1] 2884
qiita@ubuntu:~/hoge/hoge$ Setting up watches.  
Beware: since -r was given, this may take a while!

qiita@ubuntu:~/hoge/hoge$ Failed to watch /; 
upper limit on inotify watches reached!
Please increase the amount of inotify watches allowed per user
 via `/proc/sys/fs/inotify/max_user_watches'.
```

大量のディレクトリは駄目なようです。

#では？
/dev配下を監視して、USBメモリのマウントを監視
マウントされたディレクトリへの読み書きを監視
で所要の目的は達成？
あとはデーモン化か？



#参考記事
[inotify-toolsでファイルやディレクトリを監視する](https://qiita.com/stc1988/items/464410382f8425681c20)
[[Linux] inotifywaitを使ってファイル更新時に任意のコマンドを実行する](https://qiita.com/sonodar/items/ddeeb98525ef4c03d48e)

#ストレージ接続の監視方法
/dev配下を監視しておけばいいのかな・・・
コロナウイルスによる中止イベントの可視化(開発中止)

# はじめに
コロナウイルスによって中止・延期となったイベント(音楽・演劇関係が中心)を、
LeafletとGoogleDataStudioで可視化しています。

# 成果物
## Map
https://iamakawa.github.io/CancelledEvtMapping_nCoV/
![スクリーンショット 2020-03-29 23.25.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90313/16a53f44-06cc-6e59-59b7-df032a0e6f1a.png)


## 集計結果(Google Data Studio)
https://datastudio.google.com/s/sjU5ysnZpbA
![スクリーンショット 2020-03-29 23.25.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90313/3e8529e1-ab1c-a80d-1c33-2f6d77c25385.png)
![スクリーンショット 2020-03-29 23.26.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90313/ac865c62-725a-129f-03fb-6691abc3b6c0.png)

# ReadME
## 「ジャンル」について
- ジャンル分けは作成者による判断です。

## URLについて
- 今後、削除される可能性が少ないURLで掲載されているもののみ表示しています
  - 主催者、会場の「個別の」Webページ
  - 主催者のSNS等による発信
- そのため、以下のような掲載方式の文書は掲載しません
  - 主催者や会場が更新すると掲載が削除される見込みのWebページ
  - 主催者のWebページにおいて、「index.html」「event.html」が随時更新されているだけのWebページが該当する

## 検索窓の仕様
- 住所/県/イベント名/ジャンル/イベント開催日でサーチすることができます
  - 年月日検索は「M/DD」で検索してください。 ex.)「3月1日」は、"3/01"で検索
  - 一括検索です。イベント名とジャンル名が重複する場合、検索結果が重複します。ex.)「A高校吹奏楽部　スプリングコンサート」は、"吹奏楽""コンサート"でも表示されます

# 仕様・技術情報
## 構成図
![コロナウイルスによる演奏会中止マップ_構成図.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/90313/69dba26f-8efa-8c4b-0565-1d49170d24cd.jpeg)
- Googleスプレッドシートにデータセットを記入
- GeoJSONの形式で出力してWebAPI化
- 地図はLeafletのピン機能
  - ピンはポップアップで開催日、開催内容、URLを表示する
  - 検索窓はプラグインを流用(https://github.com/8to5Developer/leaflet-custom-searchbox)
 
## Github
https://github.com/iamakawa/CancelledEvtMapping_nCoV

## データセット
https://docs.google.com/spreadsheets/d/1Dh04U5VrOvcms8CdDgPzBZhBCbjzqj221WRrOII8b-Q/edit?usp=sharing

※緯度・経度の抽出には下記を参考
https://qiita.com/blue_islands/items/d7e912fe21512cd4c9fd
※GoogleスプレッドシートによるJSONの出力は下記を参考
https://qiita.com/takatama/items/7aa1097aac453fff1d53

# おわりに
## 進捗
- 2020/5/7　別プロジェクト逼迫のため、データ収集を中断。現在4,800件
- 2020/4/4  4000件登録、東北地方対応、神奈川県の一部に対応
- 2020/3/28 3000件登録、福島県以外の東北地方に対応
- 2020/3/15 東京都 500人以上まで対応
- 2020/3/9　以下の情報まで更新
  - 千葉県、石川県、岐阜県、愛知県、福岡県、北海道の500人以上収容可能なホールについて手動で集計
  - 東京都は途中(1,4000人程度)
 
## 開発にあたっての思い
https://www.facebook.com/iori.amakawa/posts/2772117909573737
競プロ等におけるjavascriptの標準入力

普段javascript使っててもわからん。。。


ベース

```javascript
process.stdin.resume();
process.stdin.setEncoding('utf8');

var input_lines = [];
var reader = require('readline').createInterface({
  input: process.stdin,
  output: process.stdout
});

/* ーーーー入力ーーーー
　
ここに書くコードを変える

　 ーーーー出力ーーーー */
reader.on('close', () => {
  console.log(input_lines);
});

```

---------------------------------------
入力：改行型（行数指定不要。`string`形も同一）

```javascript
1
2
1
6
1
```

コード

```javascript
reader.on('line', (line) => {
  input_lines.push(line);
});
```


出力

```javascript
[ '1', '2', '1', '6', '1' ]
```

※Intで取りたい場合の入力

```javascript
reader.on('line', (line) => {
  input_lines.push(parseInt(line));
});
```

出力

```javascript
[ 1, 2, 1, 6, 1 ]
```

---------------------------------------
入力：連続文字

```javascript
10 20 00
```

コード

```javascript
reader.on('line', (line) => {
  input_lines = line.split(" ")
});
```

出力

```javascript
[ '10', '20', '00' ]
```

※Intで取りたい場合の入力

```javascript
reader.on('close', () => {
    var new_input_lines = [];
    for(var i=0;i<input_lines.length;i++){
        new_input_lines[i] = parseInt(input_lines[i]);
    }
    console.log(new_input_lines);
});
```

出力

```javascript
[ 10, 20, 0 ]
```


---------------------------------------
入力：複数行2数値

```javascript
1 2
3 4
5 6
7 8
9 0
```

コード（Intで取得）

```javascript
reader.on('line', (line) => {
  var nums = line.split(" ")
  for(var i=0;i<nums.length;i++){
      lines.push(parseInt(nums[i]));
    }
});
```

出力

```javascript
[
  1, 2, 3, 4, 5,
  6, 7, 8, 9, 0
]
```

---------------------------------------

入力：行列

```javascript
1 2 3 4
5 6 7 8
1 1 1 1
```

コード

```javascript
var row = 0
reader.on('line', (line) => {
  var column = line.split(" ")
  var new_input_lines = []
  for(var i=0;i<column.length;i++){
      new_input_lines[i] = parseInt(column[i]);
  }
  lines.push(new_input_lines)
});
```

出力

```javascript
[ [ 1, 2, 3, 4 ], [ 5, 6, 7, 8 ], [ 1, 1, 1, 1 ] ]
```

---------------------------------------

pythonの方が楽
俺のPHPUnit

この記事は移行しました！[最新の内容はこちら](https://naoqoo2.github.io/blog/%E4%BF%BA%E3%81%AEPHPUnit/)をご覧ください😀

Laravelでテスト書くときにどうやるんだっけ？というときのメモです。

# モック
## Auth::user()->id

```php
$mock = new User();
$mock->id = 999;
\Auth::shouldReceive('user')->andreturn($mock);
```

## Auth::guard('admin')->check()

```php
$mock = \Mockery::mock('MyClass');
$mock->shouldReceive('check')->andreturn(true);
\Auth::shouldReceive('guard')->andreturn($mock);
```

# 例外をテストしたい

```php
$this->expectException(\Exception::class);
// メッセージ確認 ※完全一致かと思ったけど部分一致だった
$this->expectExceptionMessage('例外でっせ。');
// 正規表現もある
$this->expectExceptionMessageMatches('/例外でっせ/');
```
VSCodeで競プロC++のテンプレート

VSCodeで自分が作ったスニペットを公開しておきます。

```json:cpp.json
{
	"Print to console": {
        "prefix": "tmp",
        "body": [
            "#include <bits/stdc++.h>",
            "using namespace std;",
            "typedef long long ll;",
            "typedef unsigned long long ull;",
            "typedef long double ld;",
			"#define REP(i,n) for(int i=0; i<(n); i++)",
			"#define REPR(i, n) for(int i = n;i >= 0;i--)",
            "#define FOR(i, m, n) for(int i = m;i < n;i++)",
			"#define ALL(n) begin(n),end(n)",
			"#define IN(a, x, b) (a<=x && x<b)",
			"#define INIT std::ios::sync_with_stdio(false);std::cin.tie(0);",
			"template<class T> inline T CHMAX(T & a, const T b) { return a = (a < b) ? b : a; }",
            "template<class T> inline T CHMIN(T & a, const T b) { return a = (a > b) ? b : a; }",
			"",
            "const long double EPS = 1e-10;",
            "const long long INF = 1e18;",
			"const long double PI = acos(-1.0L);",
			"",
            "int main()",
			"{",
			"    INIT;",
			"",
            "    return 0;",
            "}"
            ],
        "description": "template for competitive programming in cpp"
    }
}
```
ReactでcombineReducersを使った時にReduxからデータが流れてこなくてハマったのでメモ

## 個人的メモ

タイトルの通りReduxからデータがどうにもこうにも流れてこなくてウンウン唸って調べ回った結果、単にルールを知らなかっただけだったのでメモ。

### combineReducersを使った時にはmapStateProps内でPropsと接続する際にreducerも指定しましょう
以下の様に指定しないとデータが一向に流れてこない。

```javascript:reducer/index.js
import { combineReducers } from 'redux';
import xxxReducer from './xxxReducer';
import yyyReducer from './yyyReducer';

export default combineReducers({
  xxx: xxxReducer,
  yyy: yyyReducer
});
```

```javascript:container/xxxContainer.js
const mapStateToProps = (state) => ({
  data: state.xxx.data,
  error: state.xxx.error
});
```

知っていればどうってことない事ですが、データが流れてこない時はエラーも出ないしDevツール使ってもデータに問題はないしでかなり時間を使ってしまったので、同じ事をしない様にメモ。
breadcrumbs_on_railsを使ったパンくず実装

パンくず実装した際の備忘録として本記事は記載します。

環境構成について
rails 5.2.4
haml

今回つかったgemについて
breadcrumbs_on_rails

### 準備
gemのインストール

```rails:gemfile

gem 'breadcrumbs_on_rails'
```

そしてターミナル上で以下のコマンドを打ち込みます。

```
bundle install
```
これで準備完了。
すぐにでもパンくず実装できます。

### コントローラー側の入力

ここでは仮に、cardsというコントローラーで書くとする。（内容はクレジットカード登録画面）
コントローラーの名称はなんでも良い。あなたの好きなコントローラーで入力してほしい。
ちなみにmypageというディレクトリの以下にクレジットカード登録画面は置いております。

イメージとしては、
ホーム　＞　マイページ　＞　支払い方法　
というふうに表示するようにやってみます。

まずは、ものは試しに以下のコマンドを入力してみよう。

```rails:cards_controller.rb
class CardsController < ApplicationController
  add_breadcrumb "ホーム" ,:root 

  def index
    add_breadcrumb 'マイページ', mypage_path
    add_breadcrumb '支払い方法'
  end

  def show
    add_breadcrumb 'マイページ', mypage_path
    add_breadcrumb '支払い方法' cards_index_path
    add_breadcrumb 'クレジット詳細'
  end
end
```

入力できたかな？
2行目になにやら見慣れぬメソッドがございますなぁ。
これは、breadcrumbs_on_railsのメソッドです。
入力の式としては、

add_breadcrumb　<第一引数> ,<第二引数>

で表現できてます。

第一引数には、表示したい文字、第二引数には、パスが入っております。
第二引数は、関数内と関数外での記述は若干異なるので注意しましょうね。

関数外であれば、`:ルート名`
関数内であれば、`ルート名_path`
となります。

例としてroot_pathを登録したい場合
関数外 `:root`
関数内 `root_path`
となります。

関数外は ":" がいるんですなぁ。

また、イメージしたパンくずを表現したい場合、indexが該当します。
showは別のパンくずとなるんですなぁ。

順番としては、上から順番にパンくずは読み出されます。
今回は一番最初のadd_breadcrumbは、ホームなため、ホームが表示される。
そこからは、関数毎に分岐されるんですね。
ホームのみ関数共通になっているというイメージです。

cardsコントローラーを読み込むと以下のようになります。
indexは　ホーム　＞　マイページ　＞　支払い方法　
showは　ホーム　＞　マイページ　＞　支払い方法　＞クレジット詳細

しかしまだこの段階では、表示されない。

vew側でメソッドが必要なのです。
今回はhamlで書いてます。

```haml:index.html.haml
= render_breadcrumbs separator: ' > '
```

そうすると以下の画面のようにこうなる。
[indexの場合]
<img width="400" alt="Screenshot from Gyazo" src="https://gyazo.com/9aa132e3b03c5375fe6ce4b46b37b4d5/raw">

[showの場合]
<img width="400" alt="Screenshot from Gyazo" src="https://gyazo.com/9a936d991991e23ad9158dc9dc148e40/raw">

いかがでしょうか？
すごく簡単にパンくずって実装できちゃいます。
こっから独自のビュウを作りたいとなった場合は、方法もあるので、次回にアップしたいと思います。

ほな！

参考
https://pg-happy.jp/rails-pankuzu-list.html
VSCode+atcoder-cliの環境内でのAtCoderデバッグ環境構築.

半年くらいやっていなかった競プロを再び始めるにあたり環境構築をしました。
今まではPythonでPrintデバッグをしている身でしたが、環境構築までするならいっそのことC++に乗り換えようと言うことでC++にしました。
このサイト様を参考に進めていました。
https://blog.spiralray.net/cp/devenv-cpp

最終的な出来栄えはこのような感じ
<img width="1439" alt="スクリーンショット 2020-03-09 19.00.39.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/435662/454123cb-2133-e643-1ed8-f3237a8e21e2.png">

この状態ではコンテスト開催ページから引っ張ってきたテスト例を試す(デフォではctrl+t)ことができます。(本当はctrl+sでサブミットもできるらしいんですけど、acc sessionでログインがちゃんとできている状態なのに否、サブミット出来ない不具合があります。)

とはいえ、コーナーケースを試すためのデバッグ環境が欲しいと言うことで

https://qiita.com/tom_sapiens/items/c4c4b7de2201272a94db

この記事を参考にlaunch.jsonをいじったところ、mainのexecファイルが見つからないと言われました。
パスが原因のようだったので、${workspaceFolder}のところを修正し、

```launch.json
{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "(LLDB) Debug",
            "type": "lldb",
            "request": "launch",
            "program": "${fileDirname}/main",
            "args": [],
            "preLaunchTask": "clang++ build active file",
            "cwd": ""
        }
    ]
}
```

に変更したらOKでした。
Rails モデルのscope処理でコードを見やすくしよう

# 今日の目標　
RailsにおけるモデルのScope機能を学ぶ
ファットコントローラにならないようにモデルの定義を考える

## モデルのscope機能とは？

モデルのスコープ機能(scope)とは、モデル側であらかじめ特定の条件式に対して名前をつけて定義し、その名前でメソッドの様に条件式を呼び出すことが出来る仕組みのこと。

基本構文

```ruby:
class モデル名 < ApplicationRecord
  scope :スコープの名前, -> { 条件式 }
end
```

例えば　下記のようなインスタンス変数があったとします。

```Ruby:controller
def index 

 @ladies = Product.where(category_id: "1")
 @men = Product.where(category_id: "2")
 @home_appliances = Product.where(category_id: "8")
 @hobbies = Product.where(category_id: "6")

end
```

ここの部分をモデルで以下のように定義してあげると

```ruby:model
scope :category, ->(category_id) {where(category_id: category_id)
```
コントローラでの記述を直感的にすることが出来ます

```ruby:controller
 @ladies = Product.category(1) 
 @men = Product.category(2) 
 @home_appliances = Product.category(8) 
 @hobbies = Product.category(6) 
```
## なぜ？scope処理を使うのか

条件の追加が簡単にできる

`.order(created_at: "DESC")`の条件を加えたい場合　scopeメソッドを使わない場合

```ruby:controller
def index 

 @ladies = Product.where(category_id: "1").order(created_at: "DESC")
 @men = Product.where(category_id: "2").order(created_at: "DESC")
 @home_appliances = Product.where(category_id: "8").order(created_at: "DESC")
 @hobbies = Product.where(category_id: "6").order(created_at: "DESC") 

end

```
このように繰り返しの処理を連続して書かなくてはいけません。これはDRYの法則(Don't Repeat Yourself)に反します。
また、常日頃から簡潔なコードを書くことを心がけていないと追加機能を実装する機会が限られてしまいます。

scopeメソッドでは　`.order(created_at: "DESC")`の一文を書き加えるだけで済みます。

```ruby:model
scope :category, ->(category_id) {where(category_id: category_id).order(created_at: "DESC")}
```
さらに　.limit(10) を加えたい場合

```ruby:controller
def index 

 @ladies = Product.where(category_id: "1").order(created_at: "DESC").limit(10) 
 @men = Product.where(category_id: "2").order(created_at: "DESC").limit(10) 
 @home_appliances = Product.where(category_id: "8").order(created_at: "DESC").limit(10) 
 @hobbies = Product.where(category_id: "6").order(created_at: "DESC").limit(10) 

end
```
どんどん記述が長くなってしまいます。

scopeメソッドを使うと
モデルの記述に条件を加えるだけ

```ruby:model
scope :category, ->(category_id) {where(category_id: category_id).order(created_at: "DESC").limit(10)}
```
モデルに記載してあげることで　コントローラの肥大を防ぐことができます。

```ruby:controller
def index
    @ladies = Product.category(1)
    @men = Product.category(2)
    @home_appliances = Product.category(8)
    @hobbies = Product.category(6)
end
```


# まとめ
## 条件式に名前を付けられるので、直感的なコードになる
## 修正箇所を限定することが出来る
## コードが短くなる

コードの記述を整理することで様々な機能の追加が実現出来る時もあると思います。

fat-controllerにならないようにモデルで上手く定義しましょう！

## 参考資料
https://pikawaka.com/rails/scope
【Unity】Oculus Questでものを掴みたい

##ハマったこと
- Questでものを掴みたかったのですが、チュートリアルの記事などを読んでも全くうまくいきませんでした。
- OculusのSDKは頻繁に更新されているので、それのせいもあるかもです
    - 実際、AvatarGrabとかいうサンプルシーンは最近(1.43以降)はありません。
    - ただ、それを前提に書かれた記事も多いです(仕方ない)

##環境
- Oculus Unity Integration 1.43.0
- Unity 2019.2.16f1

##やったこと
まず、[この動画](https://www.youtube.com/watch?v=sxvKGVDmYfY)をみます。
以上です。

##ものを掴むと吹き飛ぶ問題について
[この動画](https://www.youtube.com/watch?v=weL4aRe1FRk)をみましょう。6分あたりからかな？吹き飛ぶ問題が見事に解決されます。

##参照
[過去のunity向けOculusSDK](https://developer.oculus.com/downloads/package/unity-integration-archive/1.42.0/)
残業報告を手軽にしたい

働き方改革が始まり、会社でも残業過多にならないようにチェックが始まりました。
15日時点での残業時間、月末時点残業時間予想を報告しなければならないことになっており、
難しくない作業ではあるが、意外とひと手間かかる作業なので、面倒に思っていました。
GoogleAppsScriptでなんとかできないか考えてみました。

#手作業での運用
1. 人事担当から「15日時点での報告お願いします」メールが届く
2. チーム内メンバから15日時点での作業時間を教えてもらう
3. 作業時間から残業時間、月末時点での残業時間予想を算出する
4. 「15日時点での報告お願いします」メールに対して残業時間、月末時点予想時間を入力し返信する

#入力シートの作成
各自のタイムカードから自動で取り込めれば楽なのですが、諸事情があり、無理と判断しました。
入力シートを用意してそこに入れてもらうようにしました。
![スプレッドシート.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/230735/67567344-cd0c-a467-00dc-e3dfe8e93831.png)
ここでは関数の説明は割愛します。


```javascript:コード.gs
function SearchMail() {

  var mailbody = createDraft();
  
  //Gmailで検索する条件を作成
  var serchInfoMap = {};
  serchInfoMap['subject'] = "15日時点での報告お願いします";    // 検索する件名
  serchInfoMap['after'] = "2019/12/01";                     // 検索する範囲（以降）

  
  //検索条件で取得したスレッド単位のメッセージリスト（2次元配列で縦がスレッド、横がメッセージ）
  var messageList = searchMessageList(serchInfoMap);

  //スレッド単位にループ
  for(var index in messageList){

    //引用文形式に力技で変換する
    var lastMail = messageList[index][messageList[index].length - 1];
    var quteBody = generateQuoteMailBody(lastMail.getPlainBody(), lastMail.getDate(), lastMail.getFrom());
    var createMailBody = mailbody;

    //返信メールを下書きに作成
    var replayMailDrfut = lastMail.createDraftReply(createMailBody);
    var replayMailMessage = replayMailDrfut.getMessage();

    replayMailMessage.getPlainBody(), mailArgs) ;
  }
}


function createDraft() {
  var values = SpreadsheetApp.getActiveSheet().getDataRange().getValues();
  var spreadsheet = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = spreadsheet.getActiveSheet();
  var to = "hogehoge@test.com,mokemoke@test.com";
  var cc = "hogehoge2@test.com";
  var subject = "";
  var body = "";

  // 件名を編集  
  var range = sheet.getRange("A1");
  subject = "Re: " +  range.getValues()

  // CCを編集
  var mailArgs = {cc: cc}
  
  // 内容を編集
  var values = sheet.getRange('A4:D11').getValues();     

  body += 'hogehogeさん、mokemokeさん' + '\n\n';
  body += 'お疲れさまです。' + '\n';
  body += '〇〇です。' + '\n\n';
  body += '＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝' + '\n';
  var range = sheet.getRange("D1");
  body += range.getValues() + '\n\n';
  body += '常駐先：〇〇システム（東京）' + '\n';
  body += '部署名：開発部' + '\n\n';
  body += '氏名：' + '\n';

  for(var i = 0; i <= 7; i++) {
    if (Math.round(values[i][3]) >= 45) {
        body += values[i][0]    　　　　　               ; //名前
        body += '　①' + Math.round(values[i][2])       ; //①15日時点残業時間
        body += '　②' + Math.round(values[i][3]) + '\n'; //②予想残業時間
    } else {
        body += values[i][0] + '　①②問題なし' + '\n'     ; //問題なし
    }
  }
  body += '\n' + '＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝' + '\n\n';
  body += '以上、よろしくお願いします。' + '\n';

  GmailApp.createDraft(to, subject, body,mailArgs);

  // 直接送付
  //MailApp.sendEmail(to, subject, body,mailArgs);
  return(body);

}
````
#説明
1. まず「createDraft()」を実行しスプレッドシートからメール内容を作り上げます。
2. メールの内容を作成後に、件名と以降を検索するために条件を指定します。
3. "searchMessageList"を使ってメールリストを取得します。
4. 取得したメールに対して返信指定で1.で作成したメール内容を挿入して、返信メールを作り上げます。
5. 下書きボックスに格納して完了です。

#結果
こんな感じで出来上がりました。
![キャプチャ.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/230735/483d0823-ce00-7372-ea72-cf4444be4f52.png)
JavaScriptの分割代入


こんなデータを受け取ったとして

```js
const data = {
   name: 'hoge',
   age: '25',
   public: true
}
```

こうすると

```js
const { name, age, public } = data
```

dataオブジェクトのプロパティを取り出して、別個の変数に代入することができる
※配列もできる

```js
console.log(name)
// hoge
```

変数名とオブジェクトのキーの値は同じ必要がある

でも変数は別名にしたい時はこうする

```js

const { name, text, public: publicKey } = data
```

jsの予約語と同名のキーでも、これで安心:metal:

```js
console.log(publicKey)
// true
```
【手抜き】STM32の使い方まとめ 3.STM32CubeIDEの日本語化

#前書き
引用主体の記事です。
基本は[今日の引用](#今日の引用)に沿って進めてください。
この記事を書いているころにIDEバージョン1.3.0(CubeMXVer5.6.0)が出ました。
ついにRunコマンドが出たので一部のIDE入門のサイトではRunを勧めるようになるのかな…


#テーマ概要
CubeIDEの日本語化です。特に障害なくすんなりできると思います。

#今日の引用
今回は@yosihisaさんの記事です。

> [CubeIDEの日本語化](https://qiita.com/yosihisa/items/0b82c94363e2b988c105)

#引用の補足
###環境

|||
| --- | :---: |
| Windows10 | 1809 |
|CubeIDE|1.2.1|
|Nucleo|F303k8 or F446RE|

###利点

eclipse系が初めてな方は特に入れた方が良いと思うのです。
「なんか使いづらい…」と思ったときにIDEの設定をいじるためには、それなりのググりと設定項目の読み込み＆理解が必要になると思います。
細かい設定では日本語化されてると語感でわかるときがあるので重宝しています。
私は英弱なので（）

###失敗する：インストール先をデフォルトから変えた人

なんかうまくいかないダイアログが出るんですよね。
私は書き込み権限の問題でした。
インストール先の"stm32cubeide.exe"直上のフォルダのプロパティ→セキュリティ→編集→Administratorsのフルコントロールに✅
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/481835/bb7c4059-bb2e-e2aa-e60b-18374f1d92c4.png)
で、Pleiadesのsetup.exeを管理者権限で実行してうまくいきました。

###文字化け
こちらを参照してください

[番外.STM32CubeIDEと日本語の文字化け](https://qiita.com/nabeya11/items/beac1586510d357bf911)


#相互リンク(随時更新@2020/03/09)
**【手抜き】STM32の使い方まとめ**
（まだない記事は今後変更の可能性があります）

- [0.STM32のご説明](https://qiita.com/nabeya11/items/9ee076933983ed7ae3b6)
- [1.STM32CubeIDEの導入とLチカ](https://qiita.com/nabeya11/items/0859271c1307d88d6891)
- 2.GPIOでデジタル入力
- 3.STM32CubeIDEの日本語化
- 4.STM32CubeIDEでGit
- 5.標準タイマを使う
- 6.タイマ割り込みで等時間制御
- 7.PWM波形の出力
- 8.I2CのMemWrite/Read()
- 8.Encoderモードの使い方
- 9.UART~送信:DMAとprintf少数表示まで~
- 10.MCSDKでブラシレスモータを回す
- 11.RS485
- 12.CAN
- 13.STM32CubeIDEでデバッグ
- [番外. 「私、マクロを使えって言ったよね！？」](https://qiita.com/nabeya11/items/c901c5c0ccd61f9cc01a)
- [番外.STM32CubeIDEと日本語の文字化け](https://qiita.com/nabeya11/items/beac1586510d357bf911)
【手抜き】STM32の使い方まとめ 番外.STM32CubeIDEと日本語の文字化け

#前書き

日本語化したんですよ。。でもなぜか文字化けする…特にマイコンの画面からGenerateしたあとに化ける。。
後気がつけばコメントアウトのスラッシュ直後の文字が□に！

以上の方々、この記事で直ればいいですね…応援しております。

#対処方法
###文字コード

一応デフォルトでutf-8になってるはずなのですが、確認です。
上のメニューバーで、
ウィンドウ→設定→一般→ワークスペース　にて「テキスト・ファイル・エンコード」がuft-8になっていますでしょうか？
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/481835/2a956f38-723a-4b94-3c5c-a455402f2b05.png)


### Javaとuft-8?

これはよく理解していないのですが、次の記事を参考にしてやると、Generate後の文字化けが解消されました。
> [STM32CubeMXのコード生成時にUTF-8が文字化けしないようにする](https://qiita.com/ty103q/items/dea08785391eaaae6fec)


### コメントの先頭が文字化けする：フォントの設定

~~これは **おい！**と思ったことですが、どうやらデフォルトフォントは日本語対応がいまいちらしい…
変更方法です。~~
~~自分はMeiryoですが、理由はありません。好きな字体をこのタイミングで探すのはよいことと思います。
~~> [Eclipseでコメントの前の方だけ文字化けする](https://qiita.com/segur/items/60b3711c0c9207d23b2f)~~


<font color="red">
2020/09/24追記
もっと根本的な原因を発見しました。
</font>

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/481835/548a6adc-ee40-e040-a24b-7acd0ab19470.png)

設定の
一般→外観→色とフォント　の　C/C++のエディターのフォントを「編集」します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/481835/0cd4a4ec-8a37-4f5c-03eb-0d822b6a05b3.png)
この右下。「文字セット」がおそらく「__欧文__」になってませんか！？
これを日本語に修正すれば解決すると思います。


#相互リンク(随時更新@2020/03/09)
**【手抜き】STM32の使い方まとめ**
（まだない記事は今後変更の可能性があります）

- [0.STM32のご説明](https://qiita.com/nabeya11/items/9ee076933983ed7ae3b6)
- [1.STM32CubeIDEの導入とLチカ](https://qiita.com/nabeya11/items/0859271c1307d88d6891)
- 2.GPIOでデジタル入力
- [3.STM32CubeIDEの日本語化](https://qiita.com/nabeya11/items/fb6e0c4fe3156e307f6a)
- 4.STM32CubeIDEでGit
- 5.標準タイマを使う
- 6.タイマ割り込みで等時間制御
- 7.PWM波形の出力
- 8.I2CのMemWrite/Read()
- 8.Encoderモードの使い方
- 9.UART~送信:DMAとprintf少数表示まで~
- 10.MCSDKでブラシレスモータを回す
- 11.RS485
- 12.CAN
- 13.STM32CubeIDEでデバッグ
- [番外. 「私、マクロを使えって言ったよね！？」](https://qiita.com/nabeya11/items/c901c5c0ccd61f9cc01a)
- [番外.STM32CubeIDEと日本語の文字化け](https://qiita.com/nabeya11/items/beac1586510d357bf911)
Laravel Collectionのメソッドの引数にcallbackを与えてパワフルに使う

[コレクション 5.8 Laravel](https://readouble.com/laravel/5.8/ja/collections.html#method-splice) のメソッドの解説では省かれてしまっているけど、コレクションの持つ多くのメソッドは引数に`callable`を受け取ることができる。

自分で実際に使って「しゅげ〜」って思ったものを備忘録的にいくつか書いておきます。

# `sortBy()` / `sortByDesc()`
例えば、こんな構造のCollectionがあったとする。

```
$collection = [
    {
        id: 1,
        children: {
            id: 3
        }
    },
    {
        id: 2,
        children: {
            id: 2
        }
    },
    {
        id: 3,
        children: {
            id: 1
        }
    }
]
```
※ 配列の書き方は適当です。

これを、こうできる

```php
$collection->sortBy(function($it){
    return $it['children']->id;
});
```

```
[
    {
        id: 3,
        children: {
            id: 1
        }
    },
    {
        id: 2,
        children: {
            id: 2
        }
    },
    {
        id: 1,
        children: {
            id: 3
        }
    }
]
```

与えたコールバックが`return`した値によって並び替え処理が行われる。
確実に値さえ返せればソートが行われるので、ネストされているものがオブジェクトだろうがなんだろうが関係ない。すごい。

# `groupBy()`
コールバックが返す値が同じものをグルーピングしてくれる。

```
$collection = [
    {
        date: new Carbon('2020-03-09')
    },
    {
        date: new Carbon('2020-02-10')
    },
    {
        date: new Carbon('2020-01-11')
    },
    {
        date: new Carbon('2019-12-12')
    },
    {
        date: new Carbon('2019-11-13')
    },
    {
        date: new Carbon('2019-10-14')
    },
]
```

```php
$collection->groupBy(function($it){
    return $it->date->year;
});
```

```
{
    2020: [
        {
            date: new Carbon('2020-03-09')
        },
        {
            date: new Carbon('2020-02-10')
        },
        {
            date: new Carbon('2020-01-11')
        },
    ],
    2019: [
        {
            date: new Carbon('2019-12-12')
        },
        {
            date: new Carbon('2019-11-13')
        },
        {
            date: new Carbon('2019-10-14')
        },
    ]
}
```

キーにはグループで共通の値になるのもとっても良い...！

# `avg()`
返した値の平均が取れるので、`Carbon`を使う時とかも便利だった。

```
$collection = [
    {
        date: new Carbon('2020-03-09')
    },
    {
        date: new Carbon('2020-03-10')
    },
    {
        date: new Carbon('2020-03-11')
    },
    {
        date: new Carbon('2020-03-12')
    },
    {
        date: new Carbon('2020-03-13')
    }
]
```

```php
$avg = $collection->avg(function($it){
    return $it->date->timestamp;
});

var_dump(Carbon::createFromTimestamp($avg));
// 2020-03-11 ぐらいになる
```

--- 

Laravelで配列を使うならCollectionを使いまくろう！
CSRFとは

## CSRFとは
WEBエンジニアとして仕事する上でセキュリティ対策は非常に重要である。
今回はCSRF(クロスサイトリクエストフォージェリ)について簡単にまとめる。


webアプリケーション内の脆弱性、もしくは脆弱性を利用した攻撃方法のことである。
掲示板やお問い合わせフォームなどを処理するアプリケーションが本来拒否すべき他サイトからのリクエストを受信して処理してしまう。

## どのように攻撃されるか

・攻撃者は攻撃用Webページを準備し、ユーザがアクセスするよう誘導する
・ユーザが攻撃用Webページにアクセスすると、攻撃用Webページ内にあらかじめ用意されていた不正なリクエストが攻撃対象サーバに送られる
・攻撃対象サーバ上のWebアプリケーションは不正なリクエストを処理し、ユーザが意図していない処理が行われる

## どのような被害があるか

・いたずら的書き込み、不正サイトへの誘導、犯罪予告といった掲示板やアンケートフォームへの不正な書き込み
・不正な書き込みを大量に行うことによるDoS攻撃
なりすましによる犯行を行える。
※DoS攻撃とは
Denial of Service attackの略で、攻撃対象であるサーバーやサイトに大量に情報を送りつける攻撃のこと。

## railsでの対策
railsには最初からApplicationControllerに対策が用意されています。

protect_from_forgery with: :exception　この部分

Railsが生成するすべてのフォームやAjaxリクエストで自動的にセキュリティトークンを含めるものです。もしセキュリティトークンが想定されている値と一致しなければ、例外（エラー）が投げられます。

## 参考記事
[クロスサイトリクエストフォージェリ（CSRF）](https://www.trendmicro.com/ja_jp/security-intelligence/research-reports/threat-solution/csrf.html)
[
DoS攻撃・DDoS攻撃とは？攻撃の目的や種類、事例、対策方法を解説](https://cybersecurity-jp.com/security-measures/18262#DoS)
[「Ruby on RailsのCSRF対策」](https://www.transnet.ne.jp/2016/10/26/%E3%80%8Cruby-on-rails%E3%81%AEcsrf%E5%AF%BE%E7%AD%96colnd/)
Google Drive にファイルを直接ダウンロードする（Google Colaboratory使用）

## 背景・使い所
#####ファイルサイズの大きい機械学習の学習済みモデルや動画、大量の画像ファイルなど、モバイルルーター利用などで自身の回線が弱いときでも、自分の回線を使わずにダウンロードできます。 もともとgoogleさんが拡張機能を用意してたようなのですが廃止するとのことで、書くことにしました。

## 結論から。サンプルコード
```
from google.colab import drive 
drive.mount('/content/drive')
!wget -P "/content/drive/My Drive/download" https://xxxxx.xxx
```

Google Colaboratory は便利極まりないですね。googleさん、ありがとうございます。

## 解説
Colaboratoryを利用してGoogleDriveにWeb上のファイルを直接ダウンロードする方法です。

３行ですが、上の２行と下の行は分けて記載してください。それぞれ第１セル、第２セルとします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/123399/1d3c08eb-1ce1-9303-0fe6-a915190ba554.png)

第１セルでdrive にマウントします。実行すると入力を求められます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/123399/51e130a8-e56d-0c92-a3f4-e8be645105bf.png)

出力されるリンク先をクリックするとGoogleアカウントにログインできます。トークンを入力を受け付けている部分にコピペしてください。Google Driveがマウントされます。

第２セルの wget -P で出力先を指定します。 "/content/drive/My Drive/" で、マイドライブのルート。download は、ドライブに作成した任意のフォルダ名です。

第２セルを実行すればOKです。

## Colaboratory の使い方
他もいろいろありますので参考にしていただけると幸いですが簡単に記載いたしますと、
・Colaboratory 初期画面からnotebook を新規作成する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/123399/f03eb8be-b9d4-aedc-f70b-e3a5f1af99ff.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/123399/4ee1865c-2c56-74f8-ed83-127f3ed01e63.png)
・上の２行をコピペして、セル左側の 三角マーク（実行マーク）を押す
・認証する

・＋ でセルを新規作成する。
・３行目をコピペして、URLと保存先を書き換える。
・セル左側の 三角マーク（実行マーク）を押す。

以上です。