OmniAICreator/Qiita-1.07M huggingface dataset:
PVRDMAのメモ

https://docs.mellanox.com/pages/releaseview.action?pageId=15055422#How-to:ConfigurePVRDMAinVMwarevSphere6.5/6.7.-Setup

https://docs.microsoft.com/ja-jp/windows-server/storage/file-server/smb-direct

https://www.intel.com/content/www/us/en/support/articles/000031906/network-and-io/ethernet-products.html

https://docs.vmware.com/en/VMware-vSphere/6.7/com.vmware.vsphere.networking.doc/GUID-4A5EBD44-FB1E-4A83-BB47-BBC65181E1C2.html

ゲストOS間でSMB Directしたい。


> Guest OS Linux (64-bit)

なんだって！！
【1分解説】DISK容量が圧迫してる？と思ったときの確認コマンド【dfコマンド,duコマンド】

<h2>はじめに</h2>
DISK容量が圧迫してる？と思ったときの確認コマンドについて記載します。

<h2>まずはdfコマンドで全体のDISK使用量を確認しよう</h2>

```
[root@localhost ~]# df -Th
ファイルシステム       サイズ  使用  残り 使用% マウント位置
rootfs  rootfs           4.7G  138M  4.4G   4% /
udev  devtmpfs           10M     0   10M   0% /dev
・
・
・
```

<h2>duコマンドでさらに詳細にDISK使用量を確認しよう</h2>

```
[root@localhost ~]# du -sh /*
6.8M    /bin
48M     /boot
0       /data
0       /dev
14M     /etc
100M     /home
・
・
・
```

DISK使用量が多い領域が判明したら、該当領域でデータ整理を検討します。
【WordPress】記事に公開期限を設定する【Post Expirator】

##はじめに
WordPress環境で、記事を1ヶ月後に非公開にしたい！と思った時の対処法。

##プラグイン「Post Expirator」を利用しよう

WordPressの管理画面から「プラグイン」>「新規追加」で「Post Expirator」を検索。

インストールして有効化します。

##「Post Expirator」の使い方
1. 公開期限を設定したい記事を開く。
2. 投稿画面の右サイドバーに「Post Expirator」の欄が表示されていることを確認。
3. 「投稿有効期限を設定する」にチェックを入れ、公開しておきたい期限として年月日、時刻を入力。
1ヶ月後にしたい場合は、その年月日と時刻を指定します。
4. 期限が切れた時の処理を設定。
非公開にしたい場合は、「非公開」を選択。
5. 記事を公開。

これで、指定した期日を過ぎたら、該当の記事は非公開になります。
AWS Coud9 Laravel6.5 画像の保存と表示方法

# AWSのCloud9 Laravel環境下で画像を表示させる方法について説明します。

## まずCloud9でプロジェクトのフォルダに画像をアップします。

今回はLaravelを利用していますので、Laraveのルールに合わせて画像の保存先を決めて
画像ファイルをアップします。

Laravelでは基本的に　

```qiita:画像保存場所
{your project}\storage\app\public\
```
内に保存することが推奨されていますので、このフォルダに画像をアップロードします。
publicフォルダをクリックしてから、

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531595/f37b5b56-c8d3-c073-5116-7d03ca8f6f41.png)

[File[->[Upload Local File]を選択し、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531595/a9cb05b4-9bde-8516-2aae-24a1eeee93af.png)

画面上に以下のように表示された画像を選択します。
(個人的にはドラッグ＆ドロップでアップロードできる機能は好きです）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531595/d73ada77-384f-4cdf-b533-8f3eb1d57014.png)


次にアップロードした画像へのパスをLaravel上で簡単に呼び出せるようにします。

以下のコマンドをターミナルで実行します。

```qiita:ターミナル
$ php artisan storage:link
The [public/storage] directory has been linked.
```

これで設定は完了です。
Laravelの記述では

```
<img src='{{ asset('storage/picture.png') }}'>
```
というように明記すれば表示されます。

参考ページ
<a href="https://qiita.com/u-dai/items/8a904cc7fd2795c0e70d">[Laravel] ユーザーのアイコン画像を投稿、表示させる機能の実装したのでメモ（画像の保存場所は？シンボリックリンクって？）</a>
Go Conference 2019 Autumn にスカラシップ枠で参加してきた

# はじめに
[Go Conference 2019 Autumn](https://gocon.jp/) (通称:GoCon)が１０月２８日に東京で開催されました。
今回このカンファレンスに参加するにあたって、[株式会社メディアドゥホールディングス](https://www.mediado.jp/) さんにスカラシップ支援をしていただき、交通費と宿泊費を補助していただきました。また、カンファレンス翌日の企業見学等でも大変お世話になり、ありがとうございました。
また、このイベントの案内を下さった[株式会社ローカルイノベーション](https://local-innovation.com/) さんには就活等で普段からお世話になっていますが、このようなイベントも紹介していただけるので情報系学生にとっては非常に嬉しいです。心より感謝しています。

# Go Conとは
日本で開催される、Go言語に関する日本最大級のカンファレンスです。
イベント内容としては、Go言語についての仕組み・ツール・製作物等について、学生や社会人の方が登壇者として講義形式で発表します。
イベントは午前から午後にかけて行われ、夜は懇親会ということで、お酒を飲みながらLTやお話をして楽しめます。

# 参加したもの
講義は午前と午後行われましたが、講義以外にもGCPのハンズオンなどが行われていたので、そちらにも参加しました。
その中で、特に面白いと思ったものをいくつか紹介させていただきます。

## 午前講義
### [Go GC algorithm 101](https://gocon.jp/sessions/go_gc_algorithm_101/)
こちらは、ガベージコレクションの基本的な説明と、実際にGo言語で実装されているガベージコレクションのアルゴリズムの紹介をしていただきました。

最近授業でガベージコレクションについて習ったばかりなので、話について行きやすかったです。
ガベージコレクションには大きく分けて3種類あるのですが、Go言語にはその一つの「Mark & Sweep」というアルゴリズムが採用されているようです。
こちらの手法では、
>使うメモリにはマークをつけておくことで、マークがつけられていないメモリは使われないと判断することができる

という考え方でガベージコレクションを行います。
これはGCの中でも効率が悪いですが、現在はGoで実装されているらしい。
世代別GC(ジェネレーションスキャベンジング)がいつか実装されるかもしれないので楽しみです。


## 午後講義
### [Goでつくるゲームボーイエミュレータ、またはブラウザでの動かし方](https://gocon.jp/sessions/make_gameboy_emulator/)
こちらの講義は、[bokuweb](https://twitter.com/bokuweb17)さんによる、Go言語でゲームボーイのエミュレータを作ったお話です。[(bokuwebさんのリポジトリ)](https://github.com/bokuweb/gopher-boy)
全体の講義の中で一番独特な内容で、タイトルに惹かれてしまいましたww

エミュレータをGoで書いてて、CPUやレジスタを再現してて、そこだけでも「おぉ！」ってなったのですが、特にレジスタのA~Hの実装が全てbyte型になってたのが一番面白かったですw

実際にエミュレータを使うのにはブラウザで行うのですが、WebAssemblyを使っておられました。
自分自身WebAssemblyは聞いたことがある程度で何も知らなかったのですが、**ブラウザでバイナリが動く**ってすげぇな！と思いました。

bokuwebさんはCPUのテストを書くのに苦労してよくバグってたらしいのですが、先人の書いたテストケースが優秀だったそうで、そのテストケースをクリアしてからバグがなくなったそうです。
自分でもテストケースを考えるのは難しく、テストを書くのはなかなか気がすすみません。
しかし、こうやってテストを書かないとバグが生まれるとこを特定できないので、本当に大事だと思いましたし、他の人が書いたテストからどこが問題なのかを考えることができると思うので、今後の参考にしたいと思います。


# 感想
今回、たまたまこちらのイベントを知り、偶然にも参加することができて本当によかったです。
いろんなWeb業界の企業がGo言語を使い始めているのを知り、自分も今年からGo言語を触り始めました。
企業や個人でどのような開発をしているのか興味があったため、GoConはとても良い機会だと思い参加させていただくことになりました。
登壇内容も、gotestsのメカニズムやGoでのGraphQLの話といったようなGoのツールに関しての講義や、Goでゲームボーイエミュレータを作ったりコンパイラを作ったといったような開発の話など、様々な講義があり非常に興味深かったです。
また、スポンサー企業さんからグッズがいくつか配布されていたのですが、中にはWantedlyさんの非常にレアと言われる技術書があり、普通に興奮してましたw

自分は関西に住んでいるのですが、このような東京のイベントには金銭的にも参加するのが難しく、全くと言っていいほど機会がなかったので、スカラシップ制度で交通費・宿泊費を支援していただけたのは非常にラッキーでした。
もし、Go言語に興味があって、このようなカンファレンスに参加されたいと思った学生さん、特に地方の学生さんは、スカラシップ制度を利用すると５万円まで支援していただけるので、ぜひ気軽に参加していただきたいです！
MYSQL GCP から conoha へ移動

GCPのMYSQLを使うと、非常に料金が高い。
比べてみると、

同じレベルの速度を出すサーバー。
conoha の 1,750円/月 に比べると、 10,000円/月 位に跳ね上がる。
なんと6倍だ。

しかも、1つならまだしも2つとなると、さらに金がかかる。

自分で作ったサーバーは安定しない。。。
と思ってGCPに乗り換えたが、結局redisの設定間違っていて攻撃されまくっていたのが原因だと判明したので、conoha に戻すことにした。

そこで、エクスポートしたときのメモ。


```

・GCPのデータエクスポート時は、サーバーは止まらない。
・バケットにエクスポートされるので、ファイル名をダウンロードして取得
・1つのMYSQLに複数のデータベースを入れているとうまくインポートできない場合がある。

```

その際は、DBを一つずつエクスポートしてインポートを繰り返そう。
Ionic赤本への疑問がすごく鋭かったのでまとめて返事する記事

https://hackmd.io/0ephzNFASSCOVKpjfcr6xA で、おそらく他にも疑問に持たれる方がいる疑問を書いていただいてるので、記事にして私見やコメントをしておきます。この記事はIonic Advent Calendar 2019の1日目の記事にします。

# `ionic serve` と `ng serve` の違い
Ionic CLIでは、内部的にAngular CLIのコマンドを実行しておりますので、以下のようにコマンド以下に表示されるものが実行されるコマンドです。

```bash
sakakibara app % ionic serve
> ng run app:serve --host=localhost --port=8100  # これです
```

ちなみに、Ionic/Reactだったら `npm start` が実行されます。フレームワークやIonicのバージョン間の差分を吸収しながら実行することが目的ですので、Angular CLIのコマンドを打ち慣れていたら、そちらを実行して問題ありません。

# Ionicのライフサイクルフック用のinterfaceは無いのかな？
そういうプルリクエストはでています: https://github.com/ionic-team/ionic/pull/18044

個人的にはいずれマージされるとは思うのですが、Angularのライフサイクルのようにimplementsしないとlintエラーがでるようなことは起きないだろうと予測しています。

# Ionicではinterfaceの型にprefixとしてIをつける。例：`interface IPost {}`
完全に著者の好みです。IDEで `I` を打つと一覧で候補だしてくれるのが心地よくて・・・。ただ再利用しないinterfaceはserviceの中にそのまま挿入することもありがちなので、prefixつける方がとりまわしいい気がしています。ただ、筆者の好みです。

# Ionicのライフサイクルフックが動く詳細な条件は？
Pageコンポーネント、もう少し厳密にいうと `ion-app > ion-router-outlet` 以下のRouterで定義されているコンポーネントです。ただ、ライフサイクルをinjectableで挿入するプルリクエストがコアチームによってつくられているので、将来的にはもう少し自由がきくようになる可能性が高いです。

https://github.com/ionic-team/ionic/pull/19391

# Cordovaのスピリチュアルな後継ライブラリ > スピリチュアルとは？
開発意図としては後継ライブラリとして考えてるけど、Cordovaもまだ現行で、またCordovaチームがそう言ったわけでもないので「そういう考え方で開発しています」というニュアンスです。CapacitorはIonic teamによって開発が行われています。

# Capacitor NativeとかCapacitor Native for Webとかの謎プロダクトが作られて欲しい
NativeプロジェクトのWeb ViewにCapacitorを使うことができるという噂を聞いたことがあります（未検証）（でもできそう）

# クリアテキストのパーミッションとは？
HTTPで通信していると「HTTTPSにしなさい」と怒られるやつです。
https://qiita.com/b_a_a_d_o/items/afa0d83bbffdb5d4f6be

AndroidでCapacitorのライブリロードを使うと、Android的にはローカルファイルではなく、外部の `http://localhost:8100` というURLを内部に表示しますのでクリアテキストを有効にしないとエラーがでます。

# .toPromise(Promise) このPromiseはなんだろう
Promiseのインスタンス化に使用するconstructor関数なのです。といっても、確か不要だったと思います（明示するためだけに書いてます）
https://rxjs-dev.firebaseapp.com/api/index/class/Observable#toPromise

それでは、また。
Spring 案件ソルーション 画面系１　手順書フォルダ


#Spring 案件ソルーション 画面系１
##概要
プログラミング　＋　結合テストの場合
・最低限のつくりを掴む
https://macchinetta.github.io/server-guideline-thymeleaf/current/ja/Overview/SpringMVCOverview.html
←　図が参考になる。
https://qiita.com/wingsys/items/b5d3ae7329bd1ea940d1
←　Seriviceはインターフェースだということです。
・画面系のフレームワークを勉強する。
 https://www.marineroad.com/staff-blog/17761.html

##簡単な例を作ってみる。

| 概要   |役割 |
|:-----------|------------:|------------:|
| いわゆるHelloWorld| View + Controller|
| 計算機/画面遷移| View + Controller|
| 登録   　　　| View + Controller + (Service + Repository)      |
| 一覧・登録・更新・削除   　　　| View + Controller + Service + Repository |

##チュートリアルに沿ってやってみる。
発展問題まで行った。
設計の仕方など参考になる。
https://masahiroharada.github.io/spring-boot-primer/
https://github.com/noikedan/search
##用語
application.properties
##あれってあれなの？
用語を規定語で作ってしまった。
pythonのライブラリ図鑑

pythonではほとんどなんでもできると言っても過言ではないほど万能なのですが

それぞれどのライブラリを使えばできるのか把握するために簡単にまとめておきます

自分が現時点で知ってるもののみなので随時更新していきます


## ファイル処理

- os
- csv

## 計算系

- math
- numpy
- scipy

## グラフの描画

- matplotlib

## データ処理

- pandas


## web・通信系

- Django
- Flask
- socket

## スクレイピング

- beautifulsoup4
- requests


## 画像処理

- opencv
- pillow
- skimage 


## 日本語の音声認識

- SpeechRecognition
- julius


## 日本語の自然言語処理

- mecab
- janome


## 英語の音声認識

- pocketsphinx

## 英語の自然言語処理

- nltk
- polyglot
- treetager
- word2vec
- Doc2vec


## 機械学習

- sklean

## 時間

- datetime

## 乱数生成

- random

## qrcode生成

- qrcode

## 正規表現

- re

## GUI

- tkinter
Atom: Pugファイル保存時コマンドを走らせる

#Atom エディタで Pug ファイル保存時コマンドを走らせる

Atom エディタはプラグインが多くて使いやすいんですが、特定の目的でネットを検索しても見つからない項目ってのがどうしてもあります。

ここでは PUG ファイルを編集・保存後 HTML ファイルを自動更新する方法を説明します。それらしいタイトルが検索して出てこなかったのでタイトルでキーワード載せてみました。

HTMLを構造化して読みやすくしてくれる Pug は使いやすいです。そのままだと Pug ファイル形式はフォーマットできません。領域を設定してコメントアウトできないんですね。Atom で使うならプラグイン <a href="https://atom.io/packages/language-pug">language-pug</a> などあります。これを使うとコメントアウトできます。

#save-commands をインストール

ファイル保存時コマンドを走らせるプラグインはさまざまありますが、<a href="https://atom.io/packages/save-commands">save-commands</a> が便利です。

毎回毎回コマンドを走らせるってのはうざいですからぜひ自動化しましょう。

#設定ファイルを書く

Pug のコンパイルのコマンドの一例です。ファイルを指定し、<code>--out</code> オプションで作成した HTML ファイルを保存先を指定します。<code>--pretty</code> オプションで出力ファイルの形式を指定できます。

```
pug <source file> --pretty --out <dest>
```

このようなコマンドを走らせたい場合、<code>save-commands.json</code>ファイルを作成し、コマンドを記述します。拡張子<code>.pug</code> を持つファイルを保存時コマンドを走らせたい場合、ワイルドカードでファイルを指定し、コマンドを記述します。

```
{
    "commands": [
        "templates/pug/*.pug: pug {relPath}page.pug --pretty --out templates"
    ]
}
```

詳しくは本家サイトで。

```
{
	"commands": [
		"*.coffee : coffee -c {relFullPath}",
		"src/**/*.coffee : coffee -c -o dist{relPathNoRoot} {relFullPath}",
		"src/**/client/**/*.coffee : gulp browserify",
		"src/client/**/*.jade   : jade -P {relPath}{filename} -o dist{relPathNoRoot}",
		"src/client/**/*.jade   : gulp createTemplateCache",
		"src/server/**/*.jade : copy {relPath}{filename} dist{relPathNoRoot}",
		"src/**/*.styl   : gulp compileStylus",
		"src/**/*-spec.coffee : mocha src{relPathNoRoot}{name}.coffee --compilers coffee:coffee-script/register",
		"src/**/*.coffee : gulp runSpec --file=src{relPathNoRoot}{name}-spec.coffee --require coffee-script/register --compilers coffee:coffee-script/register"
	]
}
```
APIGateway Request Validationについて（GET/POST）

#お題
リクエストパラメーター（GET/POST）をチェックする。

#GETパラメーターのチェック
こちらは非常に簡単

メソッドリクエストで以下二つを設定すればよい。
①リクエストの検証に、クエリ文字列パラメータを含める
②URL クエリ文字列パラメータにパラメータを設定し必須にチェック

⇒これで、GETパラメータの必須チェックが完成
　※GETは必須チェックしかできないようにみえる（マニュアルを見る感じだと）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/350277/87eba09a-bca2-82b2-69b7-5a9547014973.png)

#POSTパラメーターのチェック
※これが最初よくわからなかった(笑)

▼メモ
・POSTパラメーターはリクエストボディにのる

POSTパラメーターはリクエスト本文のチェックである。
また、JSONスキーマモデルを作成しチェックを行う。
####①モデルを作成
str変数の必須/文字列チェック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/350277/c181a54f-d508-ab1b-7f2c-6897c401647b.png)

####②モデルをメソッドリクエストのリクエスト本文に紐づける
リクエストの検証に本文を含め、リクエスト本文にモデルを設定する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/350277/db0ccdaa-71c5-4582-49a0-8acd8077ccb9.png)

これにより、POSTのチェックが行われる。
正確にいうと、POSTのJSON形式（Content-Type: application/json）のチェックが行われる。

私が見慣れている画面入力をPOSTするような、Content-Type（application/x-www-form-urlencoded”）のデータはチェックできなさそう。。

あっているのか。。('ω')

``` application/json.
{
  "str": "abc",
  "int": 123
}
```

``` application/x-www-form-urlencoded.
str=abc&int=123
```

#仮にPOSTのWEBAPIを作成するとなったら、どちらを使うべきか
application/jsonのメリットは、ネストできる、型を指定できるところかな。

application/json
application/x-www-form-urlencoded

※API設計書にもcontent-typeを記載しないといけないですね。
　getの場合はcontent-type不要なので気にしていなかったですが。

#参考　勉強になりました！
>https://www.slideshare.net/pospome/rest-api-57207424
>https://www.slideshare.net/MonstarLabInc/rest-ful-api
>https://qiita.com/mserizawa/items/b833e407d89abd21ee72
たまに使うコマンド・shell メモ

# コマンド

#### フォルダ内の特定の拡張子ファイルを全て削除（サブディレクトリ以下も含める）

```
find ./ -type f -name "*.meta" -delete
```

#### 現在のフォルダ以下のファイルとフォルダをすべて削除

```
rm -rf *
```

#### [Ctrl+C] と [Ctrl+Z] の違い
```
Ctrl+C ： プロセス終了
Ctrl+Z : プロセス一時停止
```

# Git系

#### 最新のリモートブランチをローカルブランチに作成
```
git fetch
git checkout -b branch_name origin/branch_name
```

# Shell

### 仮画像用にファイルを連番にして大量に複製する

```shell:dummy_create.sh

#!/bin/bash

for (( i = 1 ; i <= 100 ; i++ )) {
	cp base.jpg "${i}.jpg"
}
```
任意フォルダに複製元のファイルを入れて、shellを実行する。

```
sh dummy_create.sh
```
APIGateway 統合タイプhttp アクセス制限

#目的
バックエンドをhttpタイプにした際に、
バックエンドへのアクセスをAPIGatewayのみに制限したい。
その方法を考えていく

##①クライアント証明書
APIGatewayからバックエンドへクライアント証明書を送信し、
バックエンドで認証する。

>https://docs.aws.amazon.com/ja_jp/apigateway/latest/developerguide/getting-started-client-side-ssl-authentication.html

##②httpヘッダーを追加
APIGatewayでhttpヘッダーを付与し、
バックエンドでhttpヘッダーをチェックする。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/350277/6999e180-0a28-9f50-e449-b02ffdb7ece6.png)

★私はここでめっちゃはまりました(笑)
マニュアルを見てhttpヘッダーの追加はできなさそうだなぁと思い、
代案として、リクエストボディにキーを追加してやろうかと試行錯誤していた(笑)
そして、コンソールのinfoを確認し、静的な値はセットできないかなーと思いきや
最後に静的な値・・・と。見逃して迷宮入りするところでした(笑)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/350277/e69c3b87-d4d9-a056-6e1c-e0a1c58bf22a.png)


#補足
仮に、apigatewayのアクセスをIPで制限することがあれば、
httpヘッダー(ip)をバックエンドにそのまま流して（マッピング or HTTP プロキシ統合の使用）
バックエンド側でIPもチェックすればバックエンドの制限も可能
margin-topを指定したら親要素を超えて上にはみ出た問題 ❏CSS❏

#例

すべてのツイートに`margin-top: 30px;`をしています。
しかし、一番上のツイートは親要素にmarginがあたってしまっています。
本来は一番上も白色にしたいのです。伝われ。

```xxx.css
.tweet {
  margin-top: 30px;
  略
}
```

<br>
###誤

<img width="685" alt="82ad18aa3f671a1a012c445094a333a3.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/529651/0a6d0b84-d722-1dd2-2d11-6d8423cf1f14.png">

###正

<img width="681" alt="fgfgf.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/529651/f7324b22-f740-9b7c-c2bd-839a45f0ed56.png">

<br>
#【答え】親要素に `overflow: hidden;`

```xxx.css
.tweets {
  overflow: hidden;
  略
}

.tweet {
  margin-top: 30px;
  略
}
```

これで解決！やったね！！

参考
>http://seto-abe.hatenablog.com/entry/2016/12/06/153305

<br>
ではまた！
height: 100%; で画面全体に ❏CSS❏

###ブロックに height: 100%; かければ画面全体に広がるっしょ！

いかない。。。なぜ。。。

#【結論】html,bodyにも height: 100%; をかける

元祖の親であるhtml,bodyタグにも指定する必要があります。

```css
html, body {
  height: 100%;
}
```

デフォルトでは`auto`です。

ど゛ぉ゛し゛て゛だ゛よ゛ぉ゛！（藤原竜也風）

<br>
神参考
>https://on-ze.com/archives/1431

<br>
ではまた！
【MySQL】テーブルコメント、カラムコメントの参照

# テーブルコメントの参照方法
```
-- 簡易ならこっち
show table status like '【テーブル名】';

-- 出力項目絞りたいならこっち
select TABLE_NAME, TABLE_COMMENT
from INFORMATION_SCHEMA.TABLES
where TABLE_SCHEMA = '【スキーマ名(DB名)】' and TABLE_NAME = '【テーブル名】'
;
```
# カラムコメントの参照方法
```
-- 簡易ならこっち
show full columns from 【テーブル名】;

-- 出力項目絞りたいならこっち
select TABLE_NAME, COLUMN_NAME, COLUMN_TYPE, IS_NULLABLE, COLUMN_KEY, COLUMN_DEFAULT, EXTRA, COLUMN_COMMENT
from INFORMATION_SCHEMA.COLUMNS
where TABLE_SCHEMA = '【スキーマ名(DB名)】' and TABLE_NAME = '【テーブル名】'
order by ORDINAL_POSITION
;
```
スクレイピング ❏Rails❏

#とは
Web上のHTMLからデータを取ってくる処理

#【その１】gemをインストール

```ruby:Gemfile
gem 'mechanize'
```

```:ターミナル
bundle install
```

<br>
#【その２】Mechanizeクラスを使うことを宣言
```ruby:scraping.rb
require 'mechanize'
```

<br>
#【その３】インスタンス生成
```ruby:scraping.rb
require 'mechanize'

agent = Mechanize.new
```

<br>
#【その４】URLからそのページのHTMLを取得
`get("URL")`

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

agent = Mechanize.new
page = agent.get("https://bluelog2.herokuapp.com/")
```

<br>
#【その5】要素を取得
`search('要素')`

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

agent = Mechanize.new
page = agent.get("https://bluelog2.herokuapp.com/")
elements = page.search('#bluelog')
```

タグ指定`('h1')`やクラス指定`('.manbow')`もできます。

複数続けて、ここの中のここ！みたいなこともできます。
`('h2 a')`→h2タグの中のaタグを指定

<br>
#【その６】テキストや属性値を取得
`inner_text`で中のテキスト

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

agent = Mechanize.new
page = agent.get("https://bluelog2.herokuapp.com/")
elements = page.search('#bluelog')

elements.each do |element|
  puts element.inner_text
end
```

<br>
`[:属性]`でその属性値

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

agent = Mechanize.new
page = agent.get("https://bluelog2.herokuapp.com/")
elements = page.search('#bluelog')

elements.each do |element|
  puts element[:href]
end
```

#実際にやってみる
適当なファイルを作って、以下をコピペ

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

agent = Mechanize.new
page = agent.get("https://bluelog2.herokuapp.com/")
elements = page.search('#bluelog')

elements.each do |element|
  puts element.inner_text
end
```

<br>
ファイルを置いたディレクトリに移動し

```:ターミナル
ruby scraping.rb
```
を実行

```:ターミナル
BlueLog
```

と表示されたら成功

ちなみにこのサイトは僕が作ったスキューバダイビングの記録をつけるアプリケーションです！

<br>
ではまた！
確率変数関数早見表―「確率変数を引数とした関数」の分布を求めたいときに読む記事

#第1章. まとめた動機
次のような問題の答え方、ネットで調べても意外と見つからない。
「$X$が一様分布の確率関数の時、$X^2$の分布を式で表せ」
<sub><sub>「確率変数を引数とした関数」で検索すると何故か特性関数(確率密度のフーリエ変換！)がヒットする。諦めずに「f(確率変数)」で検索すれば、今度は確率密度関数の結果がヒットする。「確率関数」で検索してもだめだった。こんな感じで数年間くらい、「『確率変数を引数とした関数』たる確率変数の確率密度関数」を見つけることができなかったのであるが、</sub></sub>
最近になってようやく、参考になるpdfを見つけたので、その内容をおいしいところだけ抜き出して紹介する。
#第2章. 1確率変数関数
確率変数$a$の確率密度関数を$f_a(a)$と書くことにする。
##2-1. 結論
連続型確率変数$a$、及びこれを引数として取る関数$b=g(a)$をおくとき、
$f_b (b)$は次のようにして$f_a ()$の式で表される。但し$g()$は微分可能な単調関数である必要がある。

```math
f_b (b)=\left|f_a (g^{-1} (b))  \frac{\mathrm d}{\mathrm d b} g^{-1} (b) \right|
```
##2-2. 例題1
区間$[0,1]$で一様分布、それ以外には一切分布しない連続型確率変数$a$を考えよう。$b=a^2$とするとき、
$f_b (b)$はどのようにして$f_a ()$の式で表されるか求めよ。

→

今回は$g(a)$=$𝑎^2$,$f_a(a)=$1なので

```math
f_b(b) 
=1 \times \left|\frac{\mathrm d}{\mathrm d b} g^{-1} (b) \right|
=1 \times \frac{1}{2 \sqrt{b}}
=\frac{1}{2a}
```

となる。

気が向いたら加筆します。
いいねがつくと気が向きます。

# 参考pdf
https://shoichimidorikawa.github.io/Lec/ProbDistr/s-p-r.pdf
http://www.math.s.chiba-u.ac.jp/~wang/teaching/a04s082.pdf
vue + electron で windowsデスクトップアプリを作成する

# 確認した環境

- windows 10 pro 64bit
- node v10.16.0


# 環境のセットアップ
Vue CLI + [electron-builderプラグイン](https://github.com/nklayman/vue-cli-plugin-electron-builder) で環境をセットアップします。
[electron-vueボイラープレート](https://github.com/SimulatedGREG/electron-vue)は更新が止まっているみたいなので使いません。

## Vue CLI
以下のコマンドで、Vue CLI をインストールします。

```
npm i -g @vue/cli
```

vueプロジェクトを作成します。プロジェクト名は`my-project`にしました。

```
vue create my-project
```


以下のコマンドで、Welcomeページが表示されるのを確認します。webブラウザに[http://localhost:8080/](http://localhost:8080/)を指定することで確認できます。

```
cd my-project
npm run surve
```

### electron-builderプラグイン
続けて、プロジェクトフォルダの直下で以下のコマンドを実行し、electron-builderプラグインをインストールして呼び出します。これにより、electronやその依存パッケージ、スクリプトが追加されます。

```
vue add electron-builder
```

途中でインストールするelectronのバージョンの選択を求められますが、6.0.0を選択しました。

最後に以下のエラーが表示されますが、使用に影響はないようです。


```
---(省略)---

16 packages are looking for funding.
Run "npm fund" to find out more.
-  Running completion hooks...
error: 'installVueDevtools' is defined but never used (no-unused-vars) at src\background.js:6:3:
  4 | import {
  5 |   createProtocol,
> 6 |   installVueDevtools
    |   ^
  7 | } from 'vue-cli-plugin-electron-builder/lib'
  8 | const isDevelopment = process.env.NODE_ENV !== 'production'
  9 |


1 error found.

```

# 実行とアプリケーションのビルド

### webアプリとして実行
```
npm run serve
```

### デスクトップアプリとして実行

```
npm run electron:serve
```

### ビルドしてデスクトップアプリを作成
プロジェクトフォルダ直下のdist_electronフォルダ内に実行ファイルが作成されます。

```
npm run electron:build
```

# ビルドオプション
プロジェクトのルートに`vue.config.js`ファイルを新規作成し、そのファイル内容を記述します。

記述例：

```Javascript:vue.config.js
module.exports = {
  pluginOptions: {
    electronBuilder: {
      builderOptions: {
        productName: "my-application",
        appId: "com.sample.myapplication",
        win: {
          icon: 'src/assets/app.ico',
          target: [
            {
              target: 'zip', // 'zip', 'nsis', 'portable'
              arch: ['x64'] // 'x64', 'ia32'
            }
          ]
        }
      }
    }
  }
}
```
### builderOptions:
  - productName : アプリケーションタイトル
  - appID : アプリケーションユーザーモデル ID (AUMID)として使用される。
  - win : windowsアプリの設定
    - icon : アプリケーションアイコンのパス
    - target :配布形態
        - 'zip' : zip圧縮
        - 'nsis' : Nullsoft Scriptable Install System
        - 'portable' : インストーラーのないポータブルアプリケーション
        - 'msi' : Microsoft Installer
        - 'appx' : UWPアプリパッケージ
      
    - arch: プラットフォーム
        - 'x64' : 64bitアプリケーション
        - 'ia32' : 32bitアプリケーション

参考：[Any Windows Target](https://www.electron.build/configuration/win)
年末まで毎日webサイトを作り続ける大学生 〜43日目 HTML5のcanvasを触る〜

##はじめに
こんにちは！@70days_jsです。

HTML5のcanvasを触ってみました。
とりあえず図形を描いて動かしてみました。

今日は43日目。(2019/11/30)
よろしくお願いします。

##サイトURL
https://sin2cos21.github.io/day43.html


##やったこと

前提
- Canvasとは？・・・HTML5・JavaScriptを使ってブラウザ上で図を描くための仕様
- canvas単体ではアニメーションできないので、js使う
-  canvasでレイアウトを決めた部分はcssを適用できない

円を書いて動かしました。↓
![test2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/516248/f2ee2add-c389-de80-4d8e-5f7eb647a54e.gif)


canvasタグを使って描画範囲を確保します。↓

```html
<body>
    <canvas id="canvas">
    </canvas>
</body>
```

cssで描画サイズを書きます。↓

```css
#canvas {
    width: 100vw;
    height: 50vh;
}
```

JavaScriptで動きをつけます。

```javascript
window.onload = function () {
    setInterval(draw, 10);
}

let canvas = document.getElementById('canvas');
let cvs = canvas.getContext('2d');
var x = 0;
let test = 0;
let test2 = 3;
let aa = 0.1;

function draw() {
    cvs.beginPath();
    cvs.arc(x, canvas.height / 2, 10, 0, Math.PI * test / 2, false);
    cvs.fillStyle = 'rgba(0,0,255,.1)';
    cvs.fill();
    cvs.closePath();

    cvs.beginPath();
    cvs.arc(x, canvas.height / 4, 10, 0, Math.PI * test2 / 2, true);
    cvs.fillStyle = 'rgba(255,0,0,.1)';
    cvs.fill();
    cvs.closePath();

    if (4 <= test) {
        test = 0;
        test2 = 0;
        x += 10;
    }

    test += aa;
    test2 -= aa;

}
```

円の書き方がいまいち分からず調べているとteratailさんに分かりやすい回答があったので参考にしました。↓
![スクリーンショット 2019-11-30 6.51.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/516248/15687854-f218-a27c-442b-a6a8d20da9f9.png)
引用: [JavaScript - CANVASのarcメソッドの引数が分からない｜teratail ](https://teratail.com/questions/94435#reply-149622)

gifに乗せた赤色の方が第六引数をtrueにした方です。
青色の方がfalseです。
デフォルトではfalseみたいですね。

testとtest2の値を0.1ずつ減らしたり増やしたりすることで、円が徐々に描かれているように見せています。

##感想
canvas面白かったです。今後も何かに使えたらなーと思いました。

最後までお読みいただきありがとうございます。明日も投稿しますのでよろしくお願い致します。

##参考
1. JavaScript - CANVASのarcメソッドの引数が分からない｜teratail (https://teratail.com/questions/94435#reply-149622)

とても分かりやすかったです。ありがとうございます！
Laravel ルーティング（web.php）の設定

Laravelのルーティング設定についてまとめました。

ルーティングとは、リクエストURLに応じて処理の受け渡しを決定する仕組みです。

## ルーティングの設定

`routes/web.php`に処理を記述します。

まず、useの処理を追記

```php:routes/web.php

<?php

use Illuminate\Support\Facades\Route;

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

// 追記
Route::get('hello', 'HelloController@index');

```

デフォルトは、return view('welcome');となっています。

新たにルートを定義するには、下記のように記述します。

`Route:get( path , action )`

- path: リクエストパス（'hello'とすると`http://127.0.0.1:8000/hello`がURLに表示）
- action：　実行するアクション（コントローラー名＠アクション名）


## 変数の定義

1.データベースからデータを取得して値を返す処理を追記
2.Bladeテンプレートで参照する変数名を引数に設定

```php
Route::get('/', function () {
    $変数名 = モデル名::all();
    return view('テンプレートファイル（blade）の最初の単語名', ['変数名' => $変数名 ]);
});
```


## フォームから入力したデータを受け取る


```php
Route::post('formのactionに指定したURI（パス）', function (Request $request) {
    $validator = Validator::make($request->all(),[
        'name' => 'required|max:255',
    ]);

    // データベースに登録する値の変数を宣言して、モデルのクラス定義からオブジェクトを作成
    $変数名 = new モデル名;
    $変数名->title = $request->name;
    $変数名->save();

    return redirect('/');

```

## 登録したデータを削除する

implicit binding（暗黙のバインディング）
→オブジェクトのID番号を返す処理

URIとidを同じ名前にすると、一致するインスタンスを返してくれる

```php
Route::delete('URI/{id}', function(モデル名 $変数名){
    $変数名->delete();

    return redirect('/');
});
```


>![スクリーンショット 2019-11-30 9.50.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/482880/1329839f-806f-2383-efec-b09e23757164.png)
※Laravelマニュアルより引用
Blazorの初期読み込み画面(Loading)を変更する

# 概要
Blazorで起動時のローディング画面を変更するための方法のメモ。

[デモ](https://nobu17.github.io/MatBlazorSample/)
[ソースコード](https://github.com/nobu17/MatBlazorSample)

![load.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/149198/202119a9-7e6d-9d08-604b-d5763707291e.gif)

# 背景
BlazorのデフォルトテンプレートからWEBサイトを作成すると、起動時のローディング画面は下図のような[Loading...]と表示されるだけの非常にシンプルな画面となっています。

|![loading.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/149198/32aa2313-b7bb-276c-5a36-62dfda7dbb5a.png)|
|:-:|

少し味気ないので、今風のWEBサイトのようにアニメーションでローディング画面を表示できるようにしたいと思います。

# 実装方法

## 変更対象のファイル
 wwwroot直下のindex.htmlが対象のファイルになります。

```dir
wwwroot
├ index.html
…(略)
```

中を見ると下記のようにLoading...と記載されたappタグがあります。
この部分を変更することで、ローディング画面をおしゃれにできます。

```html:index.html
<!DOCTYPE html>
<html>
<head>
…(略)
</head>
<body>
    <app>Loading...</app>
…(略)
</body>

```

## CSSの追加
該当の個所にスピナーを埋め込みます。
今回は下記のようなシンプルなCSSで実現しているものを埋め込みます。
https://projects.lukehaas.me/css-loaders/

お好みの色の設定をして、ViewSourceを押せばCSSが出力されるので取得します。

```css:loader.css
.loader,
.loader:before,
.loader:after {
    border-radius: 50%;
    width: 2.5em;
    height: 2.5em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: load7 1.8s infinite ease-in-out;
    animation: load7 1.8s infinite ease-in-out;
}

.loader {
    color: #ff8000;
    font-size: 10px;
    margin: 80px auto;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

    .loader:before,
    .loader:after {
        content: '';
        position: absolute;
        top: 0;
    }

    .loader:before {
        left: -3.5em;
        -webkit-animation-delay: -0.32s;
        animation-delay: -0.32s;
    }

    .loader:after {
        left: 3.5em;
    }

@-webkit-keyframes load7 {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

@keyframes load7 {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

```

画面の中央に配置するためのレイアウトのCSSを追加します。

```css:loader.css
.loading {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999999999;
    overflow: hidden;
}

```

作成したCSSの参照を追加し、appタグ内にスピナーを配置すれば完了です。

```html:index.html
<!DOCTYPE html>
<html>
<head>
…(略)
    <link href="css/loader.css" rel="stylesheet" />
</head>
<body>
    <app>
        <div class="loading">
            <div class="loader">
                <div class="dot-loader"></div>
                <div class="dot-loader dot-loader--2"></div>
                <div class="dot-loader dot-loader--3"></div>
            </div>
        </div>
    </app>
…(略)
</body>

```

以上で完了です。

CSSのスピナー等、いろいろなリソースがありますので、自分の好みに合わせて変えてみてください。
下記などもよさそうです。
https://github.com/jlong/css-spinners


# 参考

https://projects.lukehaas.me/css-loaders/

[デモ](https://nobu17.github.io/MatBlazorSample/)
[ソースコード](https://github.com/nobu17/MatBlazorSample)
これまで動かしていたPhoenixのプロジェクトでerlangのバージョンを変える

# 状況

すでにビルド済みのphoenixでなんらかの理由でerlangのバージョンを変更してビルドしたい

ちなみにerlangのバージョンを変えるだけだと怒られます

# 方法

思ったより簡単でビルド時に生成されるファイルをディレクトリごと吹き飛ばせばよいだけです

```bash
$ rm -rf _build
$ rm -rf deps
```

# ちなみに

この状況になったのはherokuでerlang 22.0が対応してなかったので手軽に使うためにerlang 21.0にしようとしたからです

動作しない訳じゃないけど面倒なので...
wordpressで特定のキーワードでの検索に引っかからない

現状起きている問題

xdomainでドメインを取得し、
xserverでサーバーを設置、
wordpressでブログ作成した。

ある単語で検索をかけても検索されない。
例:ビール大好き　で検索
　 結果93件のページが検索。
　 最も的確な検索結果を表示するために、上の 93 件と似たページは除外されています。

とのこと。

おかしい。
なんで?!
無理
謎

ということで忘備録です。

行っていること
1:search consoleの設定
2:サイトマップの設定


検証
インデックスには引っかかっているが、41件検索に引っかかる
site:domain.com
で検索

info:domain.com

可能性1
noindexをメディアの部分にチェックを入れていた
→変更したが、なんだか時間がかかるのか特に除外から外れているわけではない

可能性2
サイトマップでエラーを起こしていた
サイトマップ生成プラグイン がエラーを引き起こしていた

新たに、wordpressのプラグイン上で生成されているサイトマップを登録した。
エラー出なかった。
時刻は4:14am
様子をみる



後日
google search consoleより

noindexとマークされた送信済みURL

というエラー報告

https://shu-sait.com/noindex-error-taisyo/

htmlの部分のチェックを外した。11:10am
どのくらいで影響が出るのか確認。
[playframework2.6]Host not allowed エラー/AllowedHostsFilter

# 背景・問題点

やっとの思いでバージョンアップしてステージング環境にデプロイ。
実行して、ブラウザからアクセスしたら、BadRequest(400)エラー発生。はぁ・・・。

```
Host not allowed
```

# 原因
Play2.6では `AllowedHostsFilter` がデフォルトで有効で、アクセス許可されているのは`localhost`と`.local`だけ。
このため実サーバにデプロイして外部からアクセスするとエラーになる。という仕組み。
[移行ガイド](https://www.playframework.com/documentation/2.6.x/Migration26#AllowedHostsFilter)にも~~珍しく~~しっかり書かれていたのですが、ローカルでは動いていたので、見落としました。汗

```config
play.filters {
  hosts {
    allowed = ["localhost", ".local"]
  }
```

- [デフォルト値/reference.conf](https://www.playframework.com/documentation/2.6.x/resources/confs/filters-helpers/reference.conf)
- [Allowed Hosts Filter - 2.6.x](https://www.playframework.com/documentation/2.6.x/AllowedHostsFilter#Enabling-the-allowed-hosts-filter)

# 対処

上述した`play.filters.hosts.allowed`にホスト名もしくはIPアドレスを設定します。

なおELBヘルスチェックを使う場合は、全許可`['.']`にする必要があります。
C の配列を Swift が Tuple として扱うのが面倒なのを倒す

## 課題
Swift から C のライブラリを利用している際に、C の固定長配列を扱うのは少し煩わしいです。
なぜなら、Swift では Tuple として扱われるからです。
Tuple は Iteratable でないため、要素の参照に困ります。これをどうするか?

## 対応
### 方法1: reflection で倒す
https://qiita.com/codelynx/items/83f4b3829267d8d25b07 で述べられているように、reflection で Tuple を Array に変換する方法。
問題なくいけます。ただし、reflection は Compiler にとって負荷が高いため、積極的に使いたい方法とは言えないです。

### 方法2: ポインタで倒す
```swift
var foo_list = func_with_c()
let ptr = UnsafeMutablePointer<Foo>(&foo_list.foo.0)

// "固定長"のサイズをベタに書く。例えば長さが 34 だと知っているとする。
for i in 0..<34 {
    let foo = ptr[i]
    print(foo)
}
```

`var` を使うことになるのが嬉しくないのですが、reflection を行わないので Compiler に優しいです。
特段の理由が無ければこう書くことが多いのかな..?と思っています。

参考: [Swift Foundation UUID implement](https://github.com/apple/swift-corelibs-foundation/blob/master/Foundation/UUID.swift)
GitHub Actions で 自作Cocoapodsライブラリを自動デプロイする

[Treasure Advent Calendar 2019](https://adventar.org/calendars/3943) 7日目の記事です。

iOS向けライブラリを開発していたところ、バージョンを更新する際に毎回ローカルの環境で 
`pod trunk push Hoge.podspec` をやっていたのですが、毎回やるのは面倒だということで自動でデプロイされるようにしました。
仕組みを作ろうとした際にハマったりしたので今後やろうとしている方の参考になると幸いです。

## トークンを取得する
自作のCocoapodsライブラリをデプロイするためには環境変数にトークンを設定する必要があります。

### ユーザー情報を登録する
`pod trunk register` コマンドを使用してユーザー情報を登録します。
コマンドを打つとメールが届くので、メール内にあるリンクに飛び、アクティベーションします。

#### 例
```sh
pod trunk register ry-itto@example.com
```

### トークンをファイルから取得する
ユーザー情報を登録したらローカル環境の `~/.netrc` に以下のような情報が追加されていると思います。この情報の中の `password` がトークンに当たります。

```
machine trunk.cocoapods.org
  login ry-itto@example.com
  password jaeiwghwe83hlagw8
```

## リポジトリに登録する
GitHubのリポジトリにアクセスし、設定画面を開きます。
<img width="793" alt="スクリーンショット 2019-11-25 0.35.50.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180744/59bff68f-6a6f-d3c9-2601-901ba14d57ec.png">

設定画面を開いたら、その中の"Secrets" を開きます。
<img width="202" alt="スクリーンショット 2019-11-25 0.36.33.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180744/5c3fb6d9-f168-c3b7-4f21-3331f1a35242.png">

そしてその画面の中の"Add a new secret"を押し、
Nameに`COCOAPODS_TRUNK_TOKEN`, Valueに先ほど取得したトークンを入れます。

これでリポジトリへのトークンの登録は完了です。
<img width="662" alt="スクリーンショット 2019-11-25 0.40.29.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180744/bc1072f1-e6f2-8a12-3e61-ae15b494fec8.png">
このようになっていればOKです。

## ワークフローの設定ファイルを作成する
完成形は以下です。それぞれ部分ごとに説明をしていきます。
※ [ワークフローの構文](https://help.github.com/ja/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#onpushpull_requestbranchestags)

```yml
name: pod-deploy

on:
  push:
    tags: v*

jobs:
  build:
    runs-on: macOS-latest
    steps:
    - uses: actions/checkout@v1
    - name: Lint
      run: pod spec lint
    - name: Deploy
      env:
        COCOAPODS_TRUNK_TOKEN: ${{ secrets.COCOAPODS_TRUNK_TOKEN }}
      run: pod trunk push Hoge.podspec
```

### 処理を行うタイミングを設定する
`v` から始まるタグが作成された際に処理が行われるように設定。

```yml
on:
  push:
    tags: v*
```

### 行う処理を設定する
```yml
jobs:
  build: # 'build' という名前でジョブを作成
    runs-on: macOS-latest # GitHub Actionsで提供されているmacOSの最新版を使うように指定
    steps:
    - uses: actions/checkout@v1 # リポジトリの情報にアクセス
    - name: Lint
      run: pod spec lint # 作成したコードが正しいかチェック
    - name: Deploy
      env: # 環境変数に `COCOAPODS_TRUNK_TOKEN` を設定
        COCOAPODS_TRUNK_TOKEN: ${{ secrets.COCOAPODS_TRUNK_TOKEN }}
      run: pod trunk push Hoge.podspec
```

自作したライブラリを公開するために `COCOAPODS_TRUNK_TOKEN` を環境変数に設定する必要があります。ここには序盤でリポジトリのSecretsに設定したトークンを設定します。
なお、リポジトリのSecretsに設定した値は `secrets.設定したName` で取得できます。

## 終わりに
思いの外簡単に自動デプロイの仕組みを作成することができました。
GitHub ActionsはPublicなリポジトリなら無料で利用できるため、ぜひ試してみてください。

## おまけ
https://github.com/ry-itto/QiitaAPIKit
今回のワークフローを作成するにあたって自動化したライブラリです。フィードバックなどあればいただけるとありがたいです!

## 参考
[Automated CocoaPod releases with CI](https://fuller.li/posts/automated-cocoapods-releases-with-ci/)
#Ruby の pry を vim で複数行入力/ファイル編集できる edit コマンドが便利すぎる件 ( how to input multiline on ruby pry  )

- vimで複数行入力できる
- ~/.pryrc でエディタを設定すれば他のエディタも使えるはず
- 1回のセッション内だと、ファイル状態を覚えていてくれて、 edit コマンドで何回でも続きから編集・実行できる
- 今までの単一行で入力しづらすぎた苦労はなんだったのか、rubyファイルを作成してからincludeしようとしたり、エディタからコピペ実行したり、なんだかんだと
- 新しいバージョンでは複数行入力自体に対応していたかと思うけど、全く自由に入力できるこちらの方が数段良いね
- 全く知らなくてRuby人生の半分を損していた気がするのだが

```
gem install pry
```

```
pry
```

```
[1] pry(main)> edit
```


![image](https://user-images.githubusercontent.com/13635059/69862155-2cfbe700-12dd-11ea-803b-95f6df240986.png)
![image](https://user-images.githubusercontent.com/13635059/69862161-2ec5aa80-12dd-11ea-820a-cd701ec3eaf8.png)



[【Rails】Docker+Rails環境でpryの`edit`コマンドが使えなかったので、使えるようにした - Qiita](https://qiita.com/terufumi1122/items/fd6f361fab908a76fd37#_reference-0acfdf85ebbcbc41f278)

[Pry's edit command in semi-detail](https://kgrz.io/prys-edit-command.html)

[Need easy way to paste multiline code · Issue #1524 · pry/pry](https://github.com/pry/pry/issues/1524)

# Original by Github issue

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








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
イベントドリブンアーキテクチャ

今日からは話題がガラリと変わりまして、Kafkaを使った非同期処理についてみていきます。

これまでgRPCを使って同期的にコミュニケーションし、データベースにデータを保存するという言ってしまえばよくあるパターンをみてきました。
一方で弊社ではKafkaに代表されるようなストリーム処理基盤を使ったイベントドリブンなアーキテクチャを採用しています。
ログとしてキューにプッシュしたデータをSource of Truthとし、たとえDBが飛んでもログを初めから読み直せば元に戻せるような設計を心がけています。
またマイクロサービス間のコミュニケーションとしてもイベントキューを介した非同期な方法を非常に多く用います。

基盤とするソフトウェアは[Apache Kafka](https://kafka.apache.org/)を使うチームが多いですがこれも特に決まりはなく、[Benthos](https://www.benthos.dev/)やその他のツールを使うチームもあります。

ログやそれを応用したイベントドリブンアーキテクチャについてはKafkaの開発元でもあるLinkedInの[こちらの記事](https://engineering.linkedin.com/distributed-systems/log-what-every-software-engineer-should-know-about-real-time-datas-unifying)がとても参考になるので、少し長いですが興味のある方は読んでみてください。ログの考え方が変わるとてもいい記事です。

## イベントフォーマット

さてではイベントキューにどういったフォーマットでデータを残すかですがここでもprotocol bufferを使いたいと思います。

protocol bufferを使うと言っても、フォーマットがチームごとにバラバラだと、"イベントが送信された時間"などドメインに関わらず共通で残したいデータがあるときなどあまり利便性がよくありません。
そんなとき各チームが自由に定義する実際のイベントを包みこみ、メタデータなどを与える共通のフォーマットがあると便利です。

弊社で使っているフォーマットはオープンソース化されていないのでそのまま紹介することができませんが、以下のような雰囲気です。

```proto:proto/envelope.proto
syntax = "proto3";

import "google/protobuf/timestamp.proto";
import "google/protobuf/any.proto";

message Event {
    string id = 1;
    google.protobuf.Timestamp timestamp = 2;
    google.protobuf.Any payload = 3;
}
```

実際のイベントはpayloadとして渡します。
今回はこちらを使っていきたいと思います。

## Envelopeのコンパイル

以下の記述をMakefileのprotosタスクに追加してコンパイルします。

```diff
diff --git a/Makefile b/Makefile
index 0510df4..f5b531d 100644
--- a/Makefile
+++ b/Makefile
@@ -6,15 +6,22 @@ LINKFLAGS := -X main.gitHash=$(GIT_HASH)
 PROTO_DIR := ./proto
 GENERATED_DIR := ./internal/pb
 GENERATED_SERVICE_DIR := $(GENERATED_DIR)/service
+GENERATED_ENVELOPE_DIR := $(GENERATED_DIR)/envelope
+ENVELOPE_PROTO_MAPPINGS := Mgoogle/protobuf/timestamp.proto=github.com/gogo/protobuf/types,Mgoogle/protobuf/any.proto=github.com/gogo/protobuf/types
 
 .PHONY: protos
 protos:
-	mkdir -pv $(GENERATED_DIR) $(GENERATED_SERVICE_DIR)
+	mkdir -pv $(GENERATED_DIR) $(GENERATED_SERVICE_DIR) $(GENERATED_ENVELOPE_DIR)
 	protoc \
 		-I $(PROTO_DIR) \
 		-I $(GOPATH)/src:$(GOPATH)/src/github.com/gogo/protobuf/protobuf \
 		--gogoslick_out=plugins=grpc:$(GENERATED_SERVICE_DIR) \
 		service.proto
+	protoc \
+	  	-I $(PROTO_DIR) \
+		-I $(GOPATH)/src:$(GOPATH)/src/github.com/gogo/protobuf/protobuf \
+		--gogoslick_out=paths=source_relative,$(ENVELOPE_PROTO_MAPPINGS):$(GENERATED_ENVELOPE_DIR) \
+		envelope.proto
 
 
 mockgen-install:
```

無事`envelope.pb.go`ファイルが`internal/pb/envelope`以下に作成されていればOKです。

---

今日は導入ということでここまで。
明日はKafkaをデプロイしたいと思います。
Goのstruct(構造体)はフィールドなしでも定義できる

# 概要

タイトルのままです。

フィールドなしでメソッドだけ定義したかったのですが、パッと調べてもわからなかったので、実際に試して知りました。

『そんなもん知ってるわ！！』という方はブラウザバックどうぞ

# 検証結果

``` go:main.go
package main

import (
	"log"
)

func main() {
	n := Network{}
	log.Print(n.CreateURL())
}

type Network struct {
}

func (n *Network) CreateURL() string {
	// TODO: 引数を受け取ってURLを返す
	return "https://github.com/"
}
```

```bash:実行結果
# go run main.go
2009/11/10 23:00:00 https://github.com/
```

# 実際に動かせる

こちら =>

https://play.golang.org/p/cuQNOBeEdK_R
NuxtをNetlifyにデプロイする方法

# 背景
できるだけ手っ取り早くNuxtを使ったサービスをリリースしたいと思い、かなり簡単にまとめてみました。

# 環境
- Windows10
- Git bash
- yarn
- hub

# 事前に用意しておくこと
- GitHubのアカウントとSSH公開鍵の登録
- Netlifyのアカウント(GitHubからのソーシャルログインでもOK)
- Hub [ダウンロード](https://github.com/github/hub/releases)してインストール(install.batを叩くだけ)

# NuxtをインストールしてGitHubにPushする
```bash
yarn create nuxt-app
```
Nuxtアプリを作るための標準的なコマンド。
cliの指示に従いインストールします。


```bash
hub create
```

hubを使ってnuxtディレクトリと同名のGitHubリポジトリを作ります。

```bash
git add -A
git commit -m "initial commit"
git push -u origin master
```
コミット&pushします。


# Netlifyでデプロイする
Netlifyにログインしてから、New site from Gitをクリック。GitHubを選択すると、Netlifyが認可を求めてきます。指示に従い進めましょう。

先程pushしたリポジトリを選択してから、ビルドコマンドなどを以下のように設定します。
![WS000014.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/294146/87c79354-4655-c4fd-1a9b-613144159b37.jpeg)

Deploy siteをクリックすれば、デプロイ完了です！

# 終わりに
簡単ですね。


# 参考
[Let’s Build a JAMstack E-Commerce Store with Netlify Functions](https://css-tricks.com/lets-build-a-jamstack-e-commerce-store-with-netlify-functions/)
強制横スクロールアクションゲームを作る_1　~Unityで画像をObjectとして使う,Colliderをつける~

#はじめに
ゲームを作る練習として初心者がUnityを使って、強制横スクロールアクションゲームを作るお話です。出来るだけ細かくどのような作業をしたか書いていくつもりです。

#仕様
自転車に乗った人（＝Player）が穴に落ちないようにジャンプして進むシンプルなゲームです。

* Playerは右方向に等速で進んでジャンプは3段ジャンプまで
* 床がランダムに生成されて、大きすぎる穴ができないように
* Playerが床の横側にぶつかった時、画面下に落ちた時にゲームオーバー
* 右上に進んだ距離を表示
* ゲームオーバーになるとゲーム終了の画面でその距離を表示

#開発
ものすごくシンプルな仕様を元にゲームを作り始めました。
今回使用したUnityのバージョンは2019.2.6f1で、2Dのプロジェクトにしました。

##1.”自転車に乗った人”を作成
まずは自転車に乗った人の絵を[pixiv](https://sketch.pixiv.net/)というwebブラウザで使えるツールでお絵描きして作りました。

ログインを済ませたら”描く”を選びます。
![スクリーンショット 2019-11-30 2.22.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/279001/eb8cd3fd-9b44-1597-c8d5-0439afc8ecec.png)
できた絵がこちらです。なかなか味のある感じになりました笑
右上のボタンからPCにPNG形式で保存することができます。
![スクリーンショット 2019-11-30 3.00.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/279001/4efe92ce-bb70-ac1d-fd9b-2a554614f76a.png)
![スクリーンショット 2019-11-30 2.57.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/279001/03e5c49b-33cd-efd4-6488-49d02ff23b09.png)
この画像をゲームでそのまま使おうとすると背景の白い部分もオブジェクトとみなされてしまいます。
そこで背景を透明にしました。方法は他の人がまとめてくれたものを参考にしました。

* [Macで簡単に画像の背景とかを透明化(透過)する方法](https://qiita.com/na1412/items/90a9641d9644e1bfbb49)
* [WEBブラウザ上で簡単に透過PNG画像を作成できるツール | 無料](https://www.peko-step.com/tool/alphachannel.html)


背景が透明になった絵を（Unity内）Projectタブの中にあるAssetsにドラッグしてUnity内で使用できるようにしました。
その後、HierarchyにAssets内の画像をドラッグで持ってきて以下のような状態にしました。
![スクリーンショット 2019-11-29 21.22.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/279001/d25263ce-f942-d3b6-defe-6e8d18f4a4d5.png)

##2. ”自転車に乗った人”の物理挙動
自転車に乗った人（＝Player）には物理特性が必要なので、**Rigidbody2D**を使いました。
Playerオブジェクトを選択した状態でInspector内
Add Component --> Physics 2D --> Rigidbody 2D

さらに床（仮）を準備してPlayerの物理挙動を確かめます。

床（仮）の作成にあたっては、四角形がデフォルトの2D Objectに含まれていないため、”[Unityの2Dで四角形や三角形などの基本的なスプライトを使う方法](https://chappyworld.hatenablog.com/entry/2018/09/23/123925)”を参考に作成しました。

Playerと床（仮）が接触できるように**Collider (コライダー)**を使用しました。Colliderがどのようなものかは”[『Collider』をマスターする！](http://kimama-up.net/unity-collider/)”が参考になります。

まず床（仮）とPlayerに**BoxCollider2D**をつけました。次にPlayerの前輪と後輪にあたる部分に**CircleCollider2D**をつけました。
Add Component --> Physics 2D --> BoxCollider 2D, CircleCollider 2D 

Colliderのタブの中にある**Edit Collider**という四角いボタンを押すことでColliderの形をSceneタブ内で編集できます。**CircleCollider2D**についてはColliderのタブ内**Offset**のy座標の位置とRadius（半径）を揃えることでタイヤの高さを揃えました。ちなみに床（仮）には物理特性は不要なのでRigidbody2Dは使っていません。
![スクリーンショット 2019-11-30 0.11.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/279001/1ab632ab-9d99-c790-0f89-36c3ac4fa24f.png)


この状態で再生ボタンを押すとPlayerが床（仮）に着地します。

#まとめ
今回は自転車に乗った人をUnity内に用意して、物理特性とColliderを与えました。
BitbucketからGithubへのリポジトリ引っ越しについて

Githubのプライベートリポジトリが無料になって、BitbucketのリポジトリとGithubに移行したい という人もいると思います。わたしもその一人。

Githubの＋メニューから、「Import Repository」を選び、インポートしたいリポジトリのHTTPSなURLを指定すれば、すぐにリポジトリを引っ越すことができます。そんなに難しい話はありません。

が、それでもハマることはあるわけで。

* [BitbucketからGithubの移行で、しょうもなくハマる。 \| COTeggのバケツ](https://www.cotegg.com/blog/?p=2167)

わたしもハマりました。上記のような画面で止まって、パスワードを入れてもダメ。

![2019-11-30_01h07_07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14499/eee33e50-20f3-8b30-7543-35e7e3abae1b.png)

もちろんBitbucketのアカウント情報を入れたけど、もちろんダメ。なんでだろう。

と思ったら、わたしは二段階認証を設定していたのだった。この画面は二段階認証には対応していないので、このままパスワードを入れてもダメです。Bitbucketのほうに一度戻り、アプリパスワードを生成する必要があります。

Bitbucketの設定メニューからアプリパスワードを選び、すべての機能への読み取りアクセスができるパスワードを生成します。

![2019-11-30_01h15_33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14499/139c95dd-dd7e-fbce-c91e-c6eb7221e545.png)

「作成」ボタンを押して表示されるパスワードをコピーして、Githubのインポート処理画面のパスワード欄に貼り付けると、数分でインポートは完了します。ちゃんちゃん。
Robloxで武器を作る、そして振る

# 概要
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/35d34542-5158-0722-a62e-dbd149a66bfe.png)

# 手順
## 1. workspaceに「Tool」を追加。名前は適当にBomb
## 2. 追加したBombの下に、ScriptとPartを追加。Partの名前は必ず「Handle」にする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/5a8c935e-80f6-4da1-2c0e-48e7446f5b57.png)
## 3. Scriptの中身

``` Script.lua

local tool = script.Parent

local function onTouch(partOther)
	-- あたったものが人間かどうか判断
	local humanOther = partOther.Parent:FindFirstChild("Humanoid")
	-- 人間じゃなかったら何もしない
	if not humanOther then return end	
	-- 人間だけど、自分自身だったら何もしない 
	if humanOther.Parent == tool.Parent then return end
	-- それ以外、つまり人間で、他人なら、ダメージが５当たる
	humanOther:TakeDamage(5)
end

-- 攻撃の動作
local function slash()
	local str = Instance.new("StringValue")
	str.Name = "toolanim"
	str.Value = "Slash"
	str.Parent = tool
end

-- Activatedは、「装備してる状態で左クリックを押す」のこと
-- 左クリックしたらslashの動作をする
tool.Activated:Connect(slash)

-- もし武器に当たったら、onTouch関数が起動する
tool.Handle.Touched:Connect(onTouch)
```

# 使い方
- ぶつかるだけで武器がひろえる
- 「１」をおせば装備できる
- マウスの左クリックで攻撃

# ゲーム開始時に最初から持たせたいとき
- StarterPackフォルダにBombをいれておくだけ

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/7d89b3ee-5da3-fc1f-b62e-00cf49fb7461.png)

# 練習用の殴る相手の出し方
- HOMEのTOOLBOXをひらいて、「player」で検索するとたくさんでてくる

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/f565766a-f91d-53d2-eab4-a89ec05d56fa.png)


# 引用元
- https://developer.roblox.com/en-us/api-reference/class/Tool


# 追記 2019/12/6
## 武器を装備すると地面にめり込んでしまう問題
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/3d3dba78-6d72-9580-f2a3-841e0ab5dded.png)

- 解決方法
    - Handle(Partオブジェクト)の中のWeldを消す、これだけ
   
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/b764364b-403d-3e99-b589-96ee9891b8e0.png)
vim覚書

# モードの種類

vimを立ち上げた瞬間はノーマル・モードです。カーソルを移動したり、文字を削除したり、コピーした文字列を貼り付けたりすることができます。

モードには以下のものがあります。

- ノーマル・モード
- インサート・モード
- ビジュアル・モード
- ビジュアル矩形・モード
- コマンドライン・モード
- 検索・モード

## インサート・モード

文字を入力するにはキーボードのiを押します。コマンドライン（vimの一番下の欄）に入力可能になっていることがわかります。

```
-- INSERT --
```

または以下のように表示されます。

```
-- 挿入 --
```
この状態は入力が可能となります。インサート・モードを終わらせるにはキーボードのエスケープ・キーを押すか、ctrl+[を押します。

## ビジュアル・モード

ノーマル・モードでキーボードのvを押します。するとコマンドラインに以下のように表示されます。

```
-- VISUAL --
```

または以下のように表示されます。

```
-- ビジュアル --
```

ビジュアル・モードでは文字列をコピーしたり、削除したりすることができます。インサート・モードを終わらせるにはキーボードのエスケープ・キーを押すか、ctrl+[を押します。

## ビジュアル矩形・モード

ノーマル・モードでキーボードのctrl+vを押します。するとコマンドラインに以下のように表示されます。

```
-- VISUAL BLOCK --
```
または以下のように表示されます。

```
-- ビジュアル 矩形 --
```

ノーマル・モードに戻るにはエスケープ・キーまたはctrl+[を押します。

## 検索・モード

ノーマル・モードでキーボードの/を押します。コマンドラインにスラッシュが表示されます。続けて検索文字列を入力し、エンターキーを押します。

```
/検索文字列
```

ヒットした文字列がハイライトされます。複数の箇所がハイライトされている場合はキーボードのnキーを押すことによって次の該当箇所に移動します。

ハイライトを消すにはコマンドライン・モードでnohを入力すればよいです。

```
:noh
```

## コマンドライン・モード

ノーマル・モードでキーボードの:キーを押します。するとコマンドラインに:が表示されます。

```
:
```

続けてコマンドを入力します。例えば、lsを入力すると開いているファイル一覧が表示されます。

```
:ls
```

# ファイル操作関連

ファイルを開く。続けてファイルパスを入力。タブキーで補完可能。

```
:e ファイルパス
```

ファイルを閉じる。おそらく、buffer deleteの意味。

```
:bdelete
```

開いているファイル一覧を表示する。

```
:ls
```

表示しているファイルを変更する。ファイル一覧を表示する（:ls）すると開いているファイル一覧が表示され、ファイルに番号が振られていることがわかる。番号を確認してい以下を実行する。

```
:b ファイル番号
```

# 文字列削除

現在のカーソル位置から行頭までを削除（インサートモード）：コントロールキーを押しながらuを押す。

```
ctrl+u
```

# 検索

ノーマルモードでスラッシュ（/)を入力すると検索モードに移る。そして検索文字列を入力する。

```
/検索文字列
```
ヒットした文字列がハイライトされる。nを入力すると順番にハイライトされた箇所にカーソルが移動する。Nを入力すると逆の順番でカーソルが移動する。

# 置換

カーソル行の置換をする。ヒットした最初の文字列が置換される。

```
:s/検索文字列/置換文字列/
```

カーソル行の全体を置換をする。

```
:s/検索文字列/置換文字列/g
```

ファイル全体を置換をする。

```
:%s/検索文字列/置換文字列/g
```

置換する前に置換候補を確認する。

```
:%s/検索文字列/置換文字列/gc
```



# 表示関連

行番号を表示する：ノーマルモードで:set number

```
:set number
```
行番号を非表示にする：ノーマルモードで:set nonumber

```
:set nonumber
```

ハイライトを消す。文字を検索した後にハイライトが残るのでそれを消す。

```
:noh
```

# ファイラー

現在いるディレクトリのディレクトリとファイル一覧を表示する。

```
:edit .
```

日本語ドキュメント： https://vim-jp.org/vimdoc-ja/pi_netrw.html
バッチ処理の実行ログを日毎にローテーションする

実行ログを出力するシェルスクリプトというのは大抵以下のような形をしています。

```bash
# 変数定義
Log=/var/log/batch.log

# メイン処理
echo 処理開始 >> $Log
...
```

ちゃんと作るのであればログ出力などの一般的な処理は分割されていることが普通だと思いますが、ここでは単体のスクリプトの中にログ出力処理が実装されている場合を考えます。

さて、上記のままでは、バッチ処理が実行されるたびに延々と同じファイルにログを追記し続けることになり、ファイルはどんどん肥大化していきます。ログが肥大化すると管理しづらくなるので、あるタイミングでログを `batch.log_20191130` のように別名に変更（ローテーション）したくなります。ローテーションする条件は色々ありますが、今回は日付が変わったタイミングとしました。

ここで問題となったのは、バッチ処理が日付をまたぐ可能性があるという点でした。一連の実行ログは同じファイルに出力されていると見返すときに都合が良いですが、日付が変わった瞬間にローテーションしてしまうと実行ログが別々のファイルに分割されてしまいます。逆に、日付が変わってから十分に時間が経ってからローテーションすると、当日実行されたバッチ処理のログが前日分のファイルに混ざることなります。

この問題を解決するためには、「バッチ処理の開始日付」と「実行ログファイルの作成日付」を比較し、両者が同じであればログファイルに追記し、異なっていればローテーションを実行してから新しいログファイルを作成するのが良いと考えました。

バッチ処理の開始日付を得るには `date` の実行結果を利用しますが、後で比較がしやすいようにフォーマットを明示的に指定します。`%F`を指定するとISO形式(YYYY-MM-DD)の日付を得ることができます。

```bash:比較しやすい日付を得る
$TODAY=$(date +%F) # YYYY-MM-DD
```

一方で、実行ログファイルの日付は `ls -l` で取得できます。これも比較しやすいようにフォーマットを指定します。`--time-style=long-iso`でISO形式(YYYY-MM-DD)の日付を得ることができます。ただし、`ls` が既定で出力する日付は更新日付なので、作成日付を得るために `-c` を指定します。

```bash:比較しやすいファイル作成日付を得る
$FILE_CREATION_DATE=$(ls -lc --time-style=long-iso $Log | cut -d' ' -f6) # YYYY-MM-DD
```

一般的（？）に日時の比較は面倒ですが、今回は日付が同一かどうかなので簡単です。

```bash
if [ $FILE_CREATION_DATE != $TODAY ]; then
    # もしログファイルの作成日付が実行日付と異なるならローテーション
    mv $Log $Log_$FILE_CREATION_DATE
fi
```

この数行を、バッチ処理の前に書いておくことで、実行ログのローテーションが上手くできると思います。
もし、`$Log_$FILE_CREATION_DATE`が既に存在する場合は、ローテーションに失敗しつづけるので気をつける必要があります。

以上
HTMLで動的にクラス名をつける

HTMLでeachやtimesで同じクラスを複数個作成した時に一つだけに別のcssを当てたくなるような状況が出てきたので、いっそのこと繰り返し処理中に異なるクラス名を動的に作成できないかと思ってやってみました。

## どんな状況か
![](https://gyazo.com/647b7d7d319d2d5087b9b7fb2322e579.png)
![](https://gyazo.com/710e14dee7ba7bdac6ef0ac2a099d2a3.png)

よく見ると、２つの箱の重なる部分の線が太くなっています。
cssは箱のborderを囲うものを当てています。
この２つの箱は同じクラス名で、cssも同じものを当てているためこうなってしまいました。

### 実際のコード

```sample.html.haml
 - 2.times do |number|
   .history_single__category
     - case number
     - when 0
       = rec.donation_day
     - when 1
       = rec.inspection_method
```
このように、timesで2回同じクラスを作成しています。
そのため、上の図のようなことになっているので、動的にクラス名をつけてみたいと思います。

## 対策

```sample.html.haml
 - 2.times do |number|
   .history_single__category{class: "category#{number}"}
     - case number
     - when 0
       = rec.donation_day
     - when 1
       = rec.inspection_method
```
```sample.scss
 .category1 {
   border-left: none;
 }
```
今回の場合は、timesでnumberという変数を宣言しているので、それを使って２行目のようにクラスを動的に作成しています。
あとは、cssで２番目のクラス(今回の場合だとcategory1)に左のボーダーを消すようなcssを当てると、

![](https://gyazo.com/c7d67f01185a3e2ce59533da9a09386c.png)

このように他の部分と同じ線の太さにすることができました。

## 他にも
```sample.html.haml
 - @records.each.with_index(1) do |record, i|
   .sample{class: "result#{i}"}
```

each_with_indexでも同じように使うことができます。
また、番号が0から始まるのがわかりづらいときはこのように1から始まるように指定してあげたほうが良いのかもしれません。