OmniAICreator/Qiita-1.07M huggingface dataset:
エンジニアの二年目病とその予防法②

こんばんは。10分で生産的なミーティングができるWebサービス「[minmeeting](https://minmeeting.jp/)」を開発している伊勢川です。

<a title="minmeeting - 10分で生産的なミーティングができる会議ツール" href="https://minmeeting.jp/" target="_blank"><img width="100px" src="https://qiita-image-store.s3.amazonaws.com/0/199506/32e65577-a5bb-2c3b-4d30-4690c3c5ce0f.png" /></a>

3月に突入し、もうすぐ新人エンジニアの皆さんも二年目の先輩エンジニアになることでしょう。そこで、余計なお世話ですが、<B>二年目エンジニアが陥りがちな症状と予防法</B>を何回かの連載で紹介しています。

昨日は、普通の二年目がなりそうな症状を挙げてきましたが、本日は少し意識高めの人がなりがちな症状を取り上げます。

# すぐできる・なんでもできる病

二年目にもなってくると、それなりに方式設計ができるようになってきます。ITシステムはほとんどが論理の世界で完結しているため、データがあってネットワークがつながりさえすれば、だいたい何でも理論上は実現できます。しかし、<B>理論上できるからと言って、現実的なコストで実現できるかは別の話</B>です。<B>理論上はできる、頑張ればできる、やればできることを、自分ならすぐできると勘違い</B>してしまうことを、「すぐできる・なんでもできる病」と呼ぶことにします。

## 症例
プロジェクトマネージャーにいつまでにこのタスクができるのかと聞かれ、うまくいけばコーディングは3日でできると思ってテストやドキュメンテーションやその他雑用の工数を無視して「3日できます」と答えてスケジュールを遅延させる。

ITに詳しくない営業の同期に相談をされて、実現コストを無視して、こうすればできると気軽に答えてしまい、後からバカ高い見積もりを出すハメになってお客さんに呆れられる。

ディープラーニングで、手描きの数字の認識がかなりの高精度でできるというデモを見て、githubのソースをフォークして自分で動かして見る。これを応用すれば、ホワイトボードの写真をとって日本語などの文字を認識するアプリもできるだろうと思うが、サンプルコードを動かしただけで満足してしまって、実際には何も作らない。

新しい技術について勉強会に参加し、これを応用するといろいろできそうだと思い、いろいろ関連した情報などを調べたり本を買ったりするが、勉強しただけで満足してしまって、結局何も作らない。

## 予防法
<B>理論上・設計上実現可能だと分かった時点で満足するのはやめましょう</B>。設計ができても実現できなければ誰も使えないし、何の価値も生み出しません。

「やればできる、頑張ればできる」ではなくて、<B>実際に自分の手を動かしてやってみましょう</B>。そうすれば頑張ってもうまくいかない部分が必ずといっていいほど出てきます。それをクリアして実現することで、真の実力をつけることができます。

# バックナンバー
1. [エンジニアの二年目病とその予防法①　Google依存症](https://qiita.com/Akira-Isegawa/items/220dcbd9a1639099a325)
Reactでstateless functionで書くときのstyle指定

es6のclassを使わずに、returnでDOMを返す時のstyleの書き方になります。

```
const hoge = () => {
  const colorStyle = {
    color: '#000',
    backgroundColor: '#FFF',
    padding: '5px',
  };
  return (
    <span style={colorStyle}>fuga</span>
  );
};

export default hoge;
```
まだ静的HTMLで疲弊しているの?

# はじめに

* 昨今のWeb開発、主にRails等で開発していると思われます。
* (別にRailsじゃなくてもいいんですが…)、たとえ**管理画面**の開発だったとしても、静的HTMLのみで完結するケースは稀。。。
* 動的な表示や処理が発生した段階で、どのJSアーキテクチャを選定するか必要に駆られる…
* 最初から動的表示のアーキテクチャを選択していれば、**疲弊することもない。**
* 他にも静的HTMLで疲弊してしまうポイントはいくつかある

---
# フレームワークアーキテクチャに縛られ、疲弊してしまう

* 自由なルーティングが組めなくて疲弊してしまう
* モデルの設計に縛られ、疲弊してしまう
  * Rails等で、モデル構造から乖離した画面設計をすると疲弊してしまう
  * 表示側であればPresenter層、フォーム側であればForm層を導入するなどして凌いでいる
  * Rails本来のアーキテクチャからは乖離してしまっている…

---
# ページ読み込みパフォーマンスに囚われ疲弊してしまう

* 静的ページであるがゆえ、全ての情報が取得できなければページは真っ白なまま…
* とても取得に時間が掛かるが、さほど重要度が高くない要素であれば、バックグラウンドで実行し、情報が取得できた段階で表示すればいい。
* とりあえず画面には何かしら出しておいて、Loading表示にする、取得できた部分から表示していく、と言った事も可能

---
# SPAを恐れない / SPAは難しくない

* **SPAは難しくない**
* 殆どの部分は素のHTMLを書いて、本当に必要な箇所だけ動的にする事が出来る。(React, Vue, Angular等の各フレームワーク)
* ページごとにファイルは分け(`.jsx`,`.vue`等)てしまい、`if`で分岐すればOK
* 共通部分を部品化する事も出来る。Railsの`layouts`や`helper`のような事もたやすく出来る
* 大量のAPIを生やす必然性も無く、表示する情報を**ページ内に直接ハッシュで書き込んでしまえばよい**

---
# フレームワークアーキテクチャから開放され、自由にコードを書ける

* **「これRailsだと難しいんですよね。」**問題から解放される
* URLについて**ケチ**を付けられても自由に手直しする事が出来る
* React, Vue, AngularJS(← 最近あまり聞かない…) 等を適切に使っていれば無秩序になることもない。(気がする)

---
# アーキテクチャは React か Vue か Angular か

* Angularは最近は余り聞かない…
* 個人的にはReactが好みですが、Vueでも良く、ほぼ **“好み”** の問題だと思われる
* Reactもコンポーネント分けがうまくないと、**カオス**になるけど結局慣れな気がする(これについてはまた別途、そのうち書きたい)。

---
# まとめ
* (割と当たり前の事を書いたけど)、[GoogleのクローラもSPAを正しく解釈する](https://support.google.com/webmasters/answer/35769)、と言う話だし、静的HTMLに縛られている必然性は**もはや今の時代には無い。**
* 現代のコンテンツで動的要素はほぼ不可欠だし、なるべく静的要素のみで表現しようと凝り固まってしまうのは **表現の可能性を狭めてしまっている。**
Django上で動くlint-pluginを作ってみた

## 背景

Djangoは開発中`runserver`でサーバーを立ててやっていると、コードの変更がある時それに合わせて自動でサーバーを再起動してくれて非常に便利ですが、これに合わせてlintしてくれるやつがあるかなーと思ったらなかったので作って公開しました。

commandでlintしてくれるのはありますが、欲しいのはcommandではなくhookで再起動に合わせて自動でlintしてくれるやつです。

こんな感じで開発サーバーに起動に合わせて自動でlintしてくれます。

<img width="1128" alt="Screen Shot 2018-03-07 at 19.45.27.png" src="https://qiita-image-store.s3.amazonaws.com/0/72314/ab4d1d88-ae02-28eb-b7da-180b68206de8.png">

レポジトリは以下になります。
https://github.com/t-hiroyoshi/django-lint2
https://pypi.org/project/django-lint2/

## 使い方

pipでlint2と内部で利用しているflake8をインストールします。

```sh
pip install flake8 django-lint2
```

次に、Djangoで読み込むために`settings.py`の`INSTALLED_APPS`にlint2を追加します。

```settings.py
INSTALLED_APPS = (
  ...,
  'lint2',
)
```

これだけでも`runserver`すればlintが働いて、コードチェックをしてくれますがflake8の設定もできるようにしてあります。

```settings.py
LINT2 = {
  'max_line_length': 120,
}
```

`settings.py`にこんな感じでflake8のoptionsを書いていただければ、適用されるようになっています。

将来的にはflake8のみでなくいろんなlinterに対応していきたいですね。

もしよければ便利なので使ってみてください、コントリビュートお待ちしております。
Rails5でfont-awesome5を使う

##環境
Rails 5.1.5

##構築方法
application.html.erbのヘッダーにCDNのURL入れてたんだけど、turbolinkの影響でページを遷移すると動かない。
font-awesome-saasが使えた。
ネットで記事はfont-awosome4のの時のものが多かったけど、きちんと5も対応していた

公式：
https://github.com/FortAwesome/font-awesome-sass

##実装
公式に従って以下だけ

```Gemfile
gem 'font-awesome-sass', '~> 5.0.6'
```
bundle

```application.css.scss
@import "font-awesome-sprockets";
@import "font-awesome";
```

fontawosome
https://fontawesome.com/
文字列を改行、スペース、カンマ区切りで配列へ格納する


#### 改行区切りでの入力を期待していたが、カンマ区切り、スペース区切りになっていたり、前後にスペースを含んでいる。

```
panda
cat

dog, cow

  elephant squirrel

 cat,
dog
```


#### 区切る & トリム & 空文字除去 & 重複除去

```php
// delimiterが複数あるので、explode　でなく正規表現を使う。
// \R は \r\n, \r, \n を含む 
$array = preg_split('/\R|,| /m', $array);

// 配列の各要素にtrim関数を適用
$array = array_map('trim' $array);   

// 空文字（""）を除去
$array = array_filter($array);

// 重複を除去
$array = array_unique($array);

// 添え字を振り直す（飛び飛びになっているので）
$array = array_values($array);

```

関数化すると、

```php
/*
 * テキストエリアからの入力を、スペース、タブ、改行で区切って配列で返す
 *
 * @param string $text
 * @param array $seperators
 *
 * @return array $arr
 */
function text2array($text, $seperators=[',', ' ', '\R']) {

    $seperator = implode('|', $seperators);
    $pattern = "/{$seperator}/m";

    // 区切り & トリム & 空文字除去 & 重複除去 & 添え字振り直し
    $arr = preg_split($pattern, $text);
    $arr = array_map('trim', $arr);
    $arr = array_filter($arr);
    $arr = array_unique($arr);
    $arr = array_values($arr);

    return $arr;
}
```

#### 結果

_GETで入力を受け取ると以下のようになっている

```php
$text = "panda\r\ncat\r\n\r\ndog, cow\r\n\r\n  elephant squirrel\r\n\r\n cat,\r\ndog";
$array = text2array($text);
```

変換して出力

```php
php > print_r($array);
Array
(
    [0] => panda
    [1] => cat
    [2] => dog
    [3] => cow
    [4] => elephant
    [5] => squirrel
)
```

重複も空文字も削除されます。
辞書から要素を取り出すいろいろ。

```python:sample
>>> print jobs
#配列が入り組む場合
{u'status': 0, u'result': [{u'name': XXXX', u'class': u'A', u'date': u'YYYY-MM-DD'}]}
>>> jobs["result"][0]["date"]
u'YYYY-MM-DD'
>>> 
```
```python:sample2
>>> print jobs
#配列が入り組む場合
{u'status': 0, u'result': [{u'name': XXXX', u'class': u'A', u'date': u'YYYY-MM-DD'}]}
>>> jobs.get("result")[0].get("data")　#getメソッドでも"[0]"を付ければ辞書型として取り出せる
u'YYYY-MM-DD'
>>> 
```
head内の記述を書き換える

head内のcopyrightを書き換えるためのもの
（いつ使うのか、よくわからない…）
SEO的に、copyrightが空白の時に書き換えを行ったらどういう判定を行うのだろうか…
head内のものであれば、応用が利くので自分用メモということで。

```js:qiita.js
$(function(){
    var x = document.head.children;
    var y = x.length;
    for(var i = 0;i < y;i++){
    var proper = x[i].getAttribute('name');
    if(proper === 'copyright'){
            var z = x[i];
            z.setAttribute('content','©Copyright ');
        }
    }
   }
);
```
GCE(Google Compute Engine)で起動して一定時間後に自動でシャットダウンする方法

#うっかりミスによるムダな課金を防ぎたい
GCEをビルドマシンとして使っています。
CPUコアの数やメモリサイズによって時間単価が異なるので、普段は1コアで使っていて重たいビルドをするときだけ4コアや8コアに切り換えて使っています。
貧乏性なので、8コアにしたまますっかり忘れて課金されるのが心配でたまりません。(まだ無料期間なのですが。)

そこで、一定時間後に自動でシャットダウンするスクリプトを作って、/etc/rc.local から起動するようにしました。

#仕様
CPUのコア数でシャットダウンまでの時間を変える。
1個なら8時間、2個なら6時間、3個なら5時間、4個なら4時間、それ以外は3時間。

シャットダウンする60分前、15分前、5分前にwallコマンドで警告メッセージを表示する。

時間になったらシャットダウンする。念のため5分後にもシャットダウンする。

自動シャットダウンをキャンセルしたいときはそのスクリプトのプロセスをkill すればよい。

#準備

rootユーザーで(`sudo su`　を実行した状態で) Cloud SDKをインストールして、cloud コマンドが使用できるようにしておきます。
https://cloud.google.com/sdk/downloads?hl=ja

(2018.4.16 追記。)
Cloud SDKをインストールしなくても、単に `shutdown -h now` でシャットダウンすることができます。ただし、GCEのWeb UIにその状態が反映されるのに数分の遅延があります。
`gcloud compute instances stop`のコマンドでシャットダウンした場合は、Web UIにすぐに反映されます。

#スクリプト

しくみは簡単で、sleepしてから何かを実行するだけ。
今後改変すると思うので、gistに貼っておきます。
https://gist.github.com/tetsu-koba/d1dbefac761aea5bc5c402c1465db04b

このファイルを/root/autoshutdown.sh で保存して、/etc/rc.local からこれを実行するようにします。

#コメント歓迎
なにかもっといい方法があれば。

最初はatコマンドでやろうとしたけど、これだと時間になる前に手動でリブートしたときにもその時刻にシャットダウンするという情報が残ったままになってしまうのでよくなかった。
python 学習日記No.1

#まずはじめに
最近、刺激が足りないなぁ。と感じて、何かないかと探していて偶然見つけたプログラミングを勉強しようと思い投稿してみました。
あと、なぜpythonなのかといいますと、実際にアプリケーションを作ってみたく、初心者おすすめの言語だったからです。
何卒よろしくお願いします！(^^)/
##
Rust エンコーディング メモ

## ベクタ->スライス->文字列

```Rust
extern crate encoding_rs;

use encoding_rs::*;

let v = vec![0x61, 0x62, 0x63];
let (cow, encoding_used, had_errors) = UTF_8.decode(&v[..]);
println!("{:?}", cow);
```

## ベクタ->バイト列->文字列

```Rust
extern crate bytes;
extern crate encoding_rs;

use bytes::Bytes;
use encoding_rs::*;

let v = vec![0x61, 0x62, 0x63];
let b = Bytes::from(v);
let (cow, encoding_used, had_errors) = UTF_8.decode(&b);
println!("{:?}", cow);
```
Linuxでプロセスが存在しない場合にコマンドを実行するには

お題の通りです。

例えば、常駐型のプロセスがあって、`cron` でそのプロセスの死活チェックを行い、死んでいたらプロセスを復活させたい場合などに使えます。

1. `ps` でプロセスを表示。
2. `grep` でプロセスをフィルタリング。
3. `grep -v grep` で、`grep` 自身のプロセスを除外。
4. `||` でつないで、コマンドが失敗（プロセスが存在しない）場合にコマンドを実行。

```shell
ps -ef | grep 探したいプロセス | grep -v grep || プロセスが存在しない場合に実行したいコマンド
```

例えば、`hoge.jar` を実行するJavaプロセスが存在しない場合に、`hoge.jar` を起動したい場合はこんな感じです。

```shell
ps -ef | grep hoge | grep -v grep || java -jar hoge.jar
```

### 参考

* [sudo (grep or pgrep -f) はプロセス数がsudo分増えるよ](https://qiita.com/khsk/items/2d0d762b1784b5f2fd7f)
* [KITA Eng. Cronの自動処理を多重起動させないための方法を調べたら...。](http://kitaeng.hateblo.jp/entry/2016/05/01/113114)
[memo] RSpec install

## **RSpec install**
```ruby:Gemfile
group :development, :test do
  gem 'rspec-rails'
  gem 'factory_bot_rails'
  gem 'rails-controller-testing'
end
```

```
$ bundle install
```

```
$ bundle exec rails g rspec:install
```

## **実行**
```
$ bundle exec rspec
```
テストコードが何もないので、何もテストされず終了する。

### **補足**
事前にSpringを入れていた場合はrspecをbin/rspecとする事。

```
$ bundle exec bin/rspec
```


以上
はじめてのrundeck

インフラ勉強会で知った rundeck を本気で業務に取り入れるべく勉強中

> https://wiki.infra-workshop.tech/%E5%8B%89%E5%BC%B7%E4%BC%9A%E3%83%AD%E3%82%B0/2018/02/10/%E3%82%B8%E3%83%A7%E3%83%96%E7%AE%A1%E7%90%86%E3%81%A7cron%E3%81%AF%E9%99%90%E7%95%8C%E3%81%8C%E3%81%82%E3%81%A3%E3%81%9F%E3%81%AE%E3%81%A7Rundeck%E4%BD%BF%E3%81%A3%E3%81%A6%E3%83%8F%E3%83%83%E3%83%94%E3%83%BC%E3%81%AB%E3%81%AA%E3%82%8A%E3%81%BE%E3%81%97%E3%81%9F


## context-variables 予約語？予約変数？

デフォルトで用意される変数がある。

```
${job.id} 
${job.name}
${node.hostname}
など
```

> http://rundeck.org/docs/manual/jobs.html#context-variables

## カスタム変数

Options を使う。

```
VAR=123
```
 は

```
Option Name: VAR
Default Value: 123 
```

になるみたい。よくわかってない。どうやってdefault value上書きするんだろ。

ただ、使い方が謎。

Usageには３つの使い方が載ってて

```
$RD_OPTION_VAR
${option.var}
@option.var@ 
```
とある。

これ command(１行ワンライナーbash) ではうまくいくけど、複数行のscriptだと挙動がおかしい。

早速emailっぽく @ とつなげようとしたらどれも使えなかった。

```
echo "hoge@@node.hostname@@"
```

syntax errorになるみたい。escape？の方法はmanual流し読みしても触れてない気がした。

> http://rundeck.org/2.0.0/manual/job-options.html#using-secure-options-with-job-references

結局こうした。これ、全部のstepに書かないといけないの・？？

```
HOSTNAME=@node.hostname@
echo "hoge@$HOSTNAME"
```

## 冗長化

swarmとかkubeだとデータの変化についていけないし、lsyncサービス立ち上げるのもアレなのでこれはどうだろう。

> rundeckの簡単冗長化（コールドスタンバイ）思いついた。webをhaproxyで2台backendにしといて、zabbixのシナリオコケたらactionでrsyncしてupする。resolveしたら同じくactionでdownさせる。slaveのlogは捨ててok. いいんじゃないか？？

## 設定のgit管理

これから考える。ヒントある人、教えて。


## docker連携

nodeを登録してそこで実行させれば `ssh` いらずで直 `docker exec` 叩ける。便利。

あとは `docker exec` が連続コマンド叩きづらいとこが難点だけど・・まあ仕方ない。
GAE/goでTaskQueueのペイロードにJSONを利用する

皆さん、今日もtaskqueue使ってますか？
最近Windowsとイチャイチャしがちなchidakiyoです。

## 動機

社内で GAE/J を利用しているプロジェクトがあり、TQ のペイロードに JSON（application/json) を利用していた。（GAE/J => TQ => GAE/J)
GAE/go で TQ を Add するようにしたところ、GAE/J 側でペイロードが読めなくなったという社内からの問い合わせが。。（GAE/go => TQ => GAE/J)

そこで、TQが `application/x-www-form-urlencoded` しか使えないと思っていた自分は、えっ？えっ？となる。

TQ のペイロードは `application/x-www-form-urlencoded` しか利用できないと思い込んでいたが、go でも `application/json` を利用できるということに気づいたのでその恥ずかしい気持ちを記事にしました。


# まず、TQ で application/json が利用できないと思っていたきっかけ

GAE/go で TQ を利用する場合のサンプルとして、Googleのドキュメントには例として以下のようなコードが載っています。

NewPOSTTask を利用してTaskを作成し、それを taskqueue.Add で突っ込むと言うかたち

```go:TQサンプルコード
func f(ctx context.Context) {
        err := datastore.RunInTransaction(ctx, func(ctx context.Context) error {
                t := taskqueue.NewPOSTTask("/worker", url.Values{
                // ...
                })
                // Use the transaction's context when invoking taskqueue.Add.
                _, err := taskqueue.Add(ctx, t, "")
                if err != nil {
                        // Handle error
                }
                // ...
                return nil
        }, nil)
        if err != nil {
                // Handle error
        }
        // ...
}
```
ドキュメントへの[リンク](https://cloud.google.com/appengine/docs/standard/go/taskqueue/push/creating-tasks#enqueuing_tasks_in_cloud_datastore_transactions)

このまま疑問に思わずに利用すると、taskqueue.NewPOSTTask の中が以下のようになっているので

```go:taskqueue.go
// NewPOSTTask creates a Task that will POST to a path with the given form data.
func NewPOSTTask(path string, params url.Values) *Task {
	h := make(http.Header)
	h.Set("Content-Type", "application/x-www-form-urlencoded")
	return &Task{
		Path:    path,
		Payload: []byte(params.Encode()),
		Header:  h,
		Method:  "POST",
	}
}
```

ソースコードへの[リンク](https://github.com/golang/appengine/blob/master/taskqueue/taskqueue.go#L139-L149)

`Content-Type` が `application/x-www-form-urlencoded` で、ペイロードもパラメータ形式にエンコードされたものになってしまいます。

つまり、ドキュメントのとおりに利用すると `application/x-www-form-urlencoded` でしか利用できないように思いがち。

## どうすれば TaskQueue のペイロードを application/json として利用できるか

上の `NewPOSTTask` は Task を生成して返すだけなので、以下のような function を作成して利用する
やっていることは、content-type を `application/json` にし、 payload を `json` に変換してるだけ。

```go:TQでapplication/jsonを利用する
func NewJsonPOSTTask(path string, params url.Values) *Task {
    h := make(http.Header)
    h.Set("Content-Type", "application/json")
    data, _ := json.Marshal(params) // TODO エラー捨ててるYO.
    return &Task{
        Path:    path,
        Payload: []byte(data),
        Header:  h,
        Method:  "POST",
    }
}
```

とすることで、TQ の受信側も `application/json` のリクエストをそのままオブジェクトにマッピングするなどできる。

めでたしめでたし。
DartでFizzBuzz

# Install
インストール方法は公式にあるのでそちらを参照。
https://www.dartlang.org/install
当方はMacなので、Homebrewでインストールする形。

```bash
brew tap dart-lang/dart
brew install dart
```

# コード

```dart:app.dart
const start = 1;
const stop  = 100;

fizzBuzz(int num, [int fizz = 3, int buzz = 5]) {
  if (num % fizz == 0 && num % buzz == 0) {
    return "FizzBuzz";
  } else if (num % fizz == 0) {
    return "Fizz";
  } else if (num % buzz == 0) {
    return "Buzz";
  } else {
    return num;
  }
}

main(List<String> args) {
  for (var i = start; i <= stop; i++) {
    var result = fizzBuzz(i);
    print("${i} is ${result}");
  }
}
```

# 実行

```bash
dart app.dart
```

# 結果

```
1 is 1
2 is 2
3 is Fizz
4 is 4
5 is Buzz
6 is Fizz
7 is 7
8 is 8
9 is Fizz
10 is Buzz
11 is 11
12 is Fizz
13 is 13
14 is 14
15 is FizzBuzz
16 is 16
17 is 17
18 is Fizz
19 is 19
20 is Buzz
21 is Fizz
22 is 22
23 is 23
24 is Fizz
25 is Buzz
26 is 26
27 is Fizz
28 is 28
29 is 29
30 is FizzBuzz
31 is 31
32 is 32
33 is Fizz
34 is 34
35 is Buzz
36 is Fizz
37 is 37
38 is 38
39 is Fizz
40 is Buzz
41 is 41
42 is Fizz
43 is 43
44 is 44
45 is FizzBuzz
46 is 46
47 is 47
48 is Fizz
49 is 49
50 is Buzz
51 is Fizz
52 is 52
53 is 53
54 is Fizz
55 is Buzz
56 is 56
57 is Fizz
58 is 58
59 is 59
60 is FizzBuzz
61 is 61
62 is 62
63 is Fizz
64 is 64
65 is Buzz
66 is Fizz
67 is 67
68 is 68
69 is Fizz
70 is Buzz
71 is 71
72 is Fizz
73 is 73
74 is 74
75 is FizzBuzz
76 is 76
77 is 77
78 is Fizz
79 is 79
80 is Buzz
81 is Fizz
82 is 82
83 is 83
84 is Fizz
85 is Buzz
86 is 86
87 is Fizz
88 is 88
89 is 89
90 is FizzBuzz
91 is 91
92 is 92
93 is Fizz
94 is 94
95 is Buzz
96 is Fizz
97 is 97
98 is 98
99 is Fizz
100 is Buzz
```
HTMLのタグに属性を書く時に先頭に来るのはidとclassどちらか気になったのでいろいろ見てみた。

たわいもないことなんだけれどもついつい気になるんです。
CSSだけならclass属性先頭でもいいのですが、JavaScriptも書くのでid属性先頭が好きです。
しかし、お仕事はたくさんの人々とやります。世の中的にはどっちがいいのか気になりました。

# class属性が先頭
[コーディングガイド by @mdo](http://kia-king.com/code-guide/)
> 属性の順序
HTMLの要素は可読性の向上のために、適切な順序で記述しよう。
>
class
id, name
data-*
src, for, type, href, value
title, alt
aria-*, role
classは最も再利用されるコンポーネントなので最初にくる。idはより詳細で、最小限の使われ方（ページ内のブックマークとか）をするべきなので、二番目にくる。

# id属性が先頭
[HTMLの属性を書く順序 - Hail2u](https://hail2u.net/blog/webdesign/html-attribute-order.html)
> 今のところ以下のような順序が良さそうだと感じている。
>
id属性
class属性
style属性
他属性をアルファベット順で
WAI-ARIA（role属性とaria-*属性）
data-*属性
Microdata（item*属性）
id属性とclass属性を先頭にするのはCSSとの兼ね合いで、これらだけ知りたいというケースが多いからだ。使われることが多いclassが前の方が効率的だろうと思われるが、一意に確定されるidの強さを先頭にすることで表現したい。

[[プログラマの人向け(?)]私が考えたHTML/CSS コーディング規約 - Qiita](https://qiita.com/kyutaro/items/1bf13c0b88227e0f6244)
> 属性の順序
以下の順序に沿って属性を記述していく
id属性
class属性
他属性
style属性

# その他
**よくある属性先頭**
[HTML での要素の属性の順番について皆様は何かこだわりなどはあり... - Yahoo!知恵袋](https://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q12103015722)
> 当たり前の属性ほど左にしてます。
>
例えば､
`<div roll="" id="" class="">`

**気にしなくてOK**
[HTMLの書き方－HTMLの基本](http://www.htmq.com/htmlkihon/003.shtml)
> 複数の属性を指定する場合には、以下の例のように半角スペースで区切って記述します。属性を記述する順序は問われません。
>
`<p id="sample" align="center">段落となります。</p>`
【Spring Boot】WebMVCのControllerでValidatorをバインドしてるとテストで「java.lang.IllegalStateException: Invalid target for Validator...」って言われる

やってることは単純なのですが、うっかりはまってしまって一時間くらい悩んだのでメモしておきます。

### 環境
- Windows10
- java8
- Spring boot 2.0.0.RELEASE

### 結論
こーんなコードがあって、そいつテストを書くぜ！というときに。

```
@Controller
@RequestMapping("/test/aaa")
public class SampleController{
    
    @Autowired
    SampleValidator validator;

    @InitBinder("sampleForm")
    public void validateBinder(WebDataBinder binder){
        binder.addValidators(validator);
    }

    @GetMapping("/")
    public String index(@ModelAttribute SampleForm form){
        // なんかしらの処理
        return "sample/form";
    }

}
```

こうやってかくとよい。

```
@RunWith(SpringRunner.class)
@WebMvcTest(SampleController.class)
@ContextConfiguration(classes = ApplicationTest.class)
public class SampleControllerTest{

    @Autowired
    private MockMvc mockMvc;

    @MockBean
    SampleValidator validator;

    @Before
    public void before(){
        when(validator.supports(any())).thenReturn(true);
    }

    @Test
    public void test1(){
        // test
    }
}
```

#### 補足
↑の例で `before()` の処理がないと

```
java.lang.IllegalStateException: Invalid target for Validator [xxx.SampleValidator#0 bean] : SampleForm(xxx)
```

みたいな例外が出てしまってテストが起動しません。

テスト実行時に（実態はMockになっている）`SampleValidator` が `SampleForm` に適用できるかどうかのチェック処理（ `SampleValidator#supports()` ）の戻りが `null` になっているのが原因だったようです。
なので、モックのふるまいとして常にOKを返すように定義したらちゃんと動作しましたよ、というメモでした。
Unityのgradleビルドでエラー

Unityで、FacebookやらFirebaseやらいろいろライブラリを入れていたら、以下のエラーが出た。
https://developer.android.com/studio/build/multidex.html

なので、gradleでビルドすることに。
そしたら、こんなエラーで毎回コケる。

```
* What went wrong:
Execution failed for task ':transformClassesAndResourcesWithProguardForRelease'.
> java.io.IOException: Please correct the above warnings first.
```

対策としては、
{Android sdk}/tools/proguard/proguard-android.txt 
の末尾に、以下を追記したら、無事ビルド通った。

```
-ignorewarnings
-keep class * {
    public private *;
}
```
無視しちゃって大丈夫なのかがちょっと心配ではあるけど。。。
とりあえず問題なさそう。

僕もこんな備忘録みたいなのだけじゃなく、体系的に書きたいけど、
書かないよりは書いた方がまし、と思って残しておきます。
オフラインリアルタイムどう書く F10 の問題


オフラインでリアルタイムに「どう書く」をやるイベント( https://yhpg.doorkeeper.jp/events/70864 )を行っています。

問題は「ぐねぐねスクエア」という名前で、詳細は
http://nabetani.sakura.ne.jp/hena/ordf10updown/
です。

出題者の気分としては、問題を読み始めてから解けるまで1時間あれば大丈夫と思ってますが、ひとそれぞれで。

実装ができた方はこちらのコメント欄からリンクを張っていただくと見つけやすくて助かります。

似たような問題をもっと解きたいという方は、
https://nabetani.hatenadiary.com/entry/yhpg_list
に過去問リンク集がありますので、そちらをご覧になると良いと思います。
rails s したときになぜかCSSファイルが表示されない

先日、新しいvagrant環境に社内環境をgit cloneし、いろいろ整えたのち、いざ rails s と叩いたら、、、
なぜかCSSファイルが読み込まれない、、、

DBに問題があるのかと思い、db create:resetしたら環境が壊れかける始末。

巡り巡って見つけた原因、
それはconfig/environment/development.rbにありました。

```config/environment/development.rb
Rails.application.configure do
  # Settings specified here will take precedence over those in config/application.rb.

  # In the development environment your application's code is reloaded on
  # every request. This slows down response time but is perfect for development
  # since you don't have to restart the web server when you make code changes.
  config.cache_classes = false

  # Do not eager load code on boot.
  config.eager_load = false

  # Show full error reports.
  config.consider_all_requests_local = true

  # Enable/disable caching. By default caching is disabled.
  if Rails.root.join('tmp/caching-dev.txt').exist?
    config.action_controller.perform_caching = true

    config.cache_store = :memory_store
    config.public_file_server.headers = {
      'Cache-Control' => "public, max-age=#{2.days.seconds.to_i}"
    }
  else
    config.action_controller.perform_caching = false

    config.cache_store = :null_store
  end

  # Don't care if the mailer can't send.
  config.action_mailer.raise_delivery_errors = false

  config.action_mailer.perform_caching = false

  # Print deprecation notices to the Rails logger.
  config.active_support.deprecation = :log

  # Raise an error on page load if there are pending migrations.
  config.active_record.migration_error = :page_load

  # Debug mode disables concatenation and preprocessing of assets.
  # This option may cause significant delays in view rendering with a large
  # number of complex assets.
  config.assets.debug = true

  # Suppress logger output for asset requests.
  config.assets.quiet = true

  # 引き継ぎ設定
  config.assets.raise_runtime_errors = true
  config.action_controller.asset_host = 'localhost:3000'
  config.action_mailer.asset_host = config.action_controller.asset_host

  # For send mail on ubuntu
  config.action_mailer.delivery_method = :smtp
  config.action_mailer.smtp_settings = { address: 'localhost', port: 1025 }
  config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }

  config.logger = Logger.new("log/development.log", 5, 10 * 1024 * 1024)

  # Raises error for missing translations
  # config.action_view.raise_on_missing_translations = true

  # Use an evented file watcher to asynchronously detect changes in source code,
  # routes, locales, etc. This feature depends on the listen gem.
  config.file_watcher = ActiveSupport::EventedFileUpdateChecker
end
```

真ん中あたりの、 #引き続き設定　の項目に注目です。
ここでhostのipアドレスは `localhost:3000` となっています。

しかし、vagrant本体で、Vagrantfileで指定していたprivate networkのipアドレスを見たところ、 `http://192.168.33.10` でした。

ここが一致していないのが原因でした…。

ここを本体のipアドレスに書きかえたところ、無事にCSSファイルが読み込まれるようになりました。
めでたしめでたし。
[memo] Spring install

## **Spring install**
```ruby:Gemfile
group :development, :test do
  gem 'spring'
  gem 'spring-watcher-listen', '~> 2.0.0'
  gem 'spring-commands-rspec'
end
```

```
$ bundle install
```

```
$ bundle exec spring binstub --all
* bin/rake: spring inserted
* bin/rails: spring inserted
```
bin/rake bin/rails が更新され、新たにbin/springが作成される。

## **Spring起動**

現在のSpringの状態を確認、初期状態ではSpringは起動していない。

```
$ bundle exec spring status
Spring is not running.
```

```rails console```を起動させるとSpringが自動的に起動する。

```
$ rails c
Running via Spring preloader in process 6833
Loading development environment (Rails 5.1.5)
[1] pry(main)>
```

改めてSpringの状態を確認、起動していることが確認できる。

```
$ bundle exec spring status
Spring is running:
```

次回以降のrails consoleの起動が早くなる。
railsの他、rake rspecも同様に高速化される。

以上
Chrome での DevTool 検知について

## コード

```js
var e = Object.defineProperty(document.createElement("DevToolDetector"), "id", {
  get: () => {
    // detect devtool
  }
})
console.dir(e)
```

## 仕組み

console.dir が DOM 要素を展開しようとする時、DevTools が開いていれば、 element.id 要素を取得しに行く。その結果 getter が走ことで検知できる。

## 使えるのか

Chrome Canary (67) では対策済みなので、次のバージョンぐらいでは使えなくなると思います。
Django入門 - Django2.0対応 (2018年版)


Djangoのプログラムを最新のDjango2.0を使って、最短で作ってみます。
ブラウザ上でウェブ開発ができる [PaizaCloud](https://paiza.cloud/ja/)を使います。

以下の記事に沿ってすすめます。

http://paiza.hatenablog.com/entry/2018/02/28/paizacloud_django

## 開発環境の準備

[PaizaCloud](https://paiza.cloud/ja/)に接続し、アカウント作成後、サーバを作成します。
MySQLを使う場合は、起動時に有効にしておくと便利です。

## Djangoプロジェクト作成

Djangoプロジェクトを作成します。

```
$ django-admin startproject mysite
```
## ALLOWED_HOSTS設定

Cloud IDEを利用する場合、ALLOWED_HOSTSを設定しておきます。

mysite/mysite/settings.py:

```
ALLOWED_HOSTS = ['*']
```
## サーバ起動

では、Djangoサーバを起動してみましょう。

```
$ cd mysite
$ python3 manage.py runserver
```

[PaizaCloud](https://paiza.cloud/ja/)画面左側に地球のアイコンと"8000"と書かれたボタンが表示されますので、クリックしてみましょう。

Djangoが起動しましたね！

以下の記事に沿っていくと、さらにToDoアプリも作れます。

http://paiza.hatenablog.com/entry/2018/02/28/paizacloud_django
Unityのチュートリアルにある「画面が薄暗くなるバグ」の対応方法


## はじめに

Unityのチュートリアル [はじめてのUnity](https://unity3d.com/jp/learn/tutorials/projects/hajiuni-jp) を進めていて、最後の最後に以下のような記載があります。

> ※なお、Unity 5.5現在シーンをロードした際に画面が薄暗くなるバグが発生するかもしれません。

最新バージョン (2017.3.1f1) でも発生したんですが、チュートリアルに記載の手順ではイマイチ要領を得ないので、きちんと手順をまとめてみます。

### 確認環境

念のため、私の環境を記載しておきます。

* macOS High Sierra (10.13.3)
* Unity 2017.3.1f1 Personal (64bit)


## 対応手順

(1) メニューから Window -> Lighting -> Settings を選択します。

![スクリーンショット 2018-03-07 17.34.21.png](https://qiita-image-store.s3.amazonaws.com/0/39362/1efc9ff4-1632-85de-ac74-893f15772f47.png "スクリーンショット 2018-03-07 17.34.21.png")

(2) `Auto Generate` のチェックを外し、`Generate Lighting` のボタンをクリックします。

![スクリーンショット 2018-03-07 17.34.35.png](https://qiita-image-store.s3.amazonaws.com/0/39362/b9ac9e3c-7ca5-1ed7-5215-338731cda8b8.png "スクリーンショット 2018-03-07 17.34.35.png")

小さいモーダルダイアログが表示され、プログレスバーがチラッと出てきますが、すぐに処理が終わります。

この状態で再生すれば、 LoadSceneメソッド実行後も画面が暗くなりません。

------

この辺りのUIがバージョンによって変更があるみたいで、ググっても実際の画面と違う解説がチラホラありました。
チュートリアルこそ、こういう部分はキチンと書いておいて欲しいですね。
ruboty-cron(add)が動かない時の対処法

## Rubotyとは

[Ruboty](https://github.com/r7kamura/ruboty)とは、Slackなどで動くBOTフレームワークの一つです。
簡単にRubyでボット書けるとても便利なフレームワーク。

## ruboty-cronとは

rubotyには[便利なプラグイン](https://github.com/r7kamura/ruboty#brain)が多数あり、代表的なものの一つとしてruboty-cronがあります。
ruboty-cronは、cron形式でジョブ（定期的にチャットにポストするメッセージ）を登録できる優れものです。
もちろん、定期的にボットコマンドを登録しておけば、時間指定でボットに何かをさせることもできます。

```
$ bundle exec ruboty
Type `exit` or `quit` to end the session.
> @ruboty add job "* * * * *" @ruboty ping
Job 3117 created
pong
pong
pong
> @ruboty list jobs
 3117: "* * * * *" @ruboty ping
> @ruboty delete job 3117
Deleted

```

## 本題

ruboty-cronでジョブを登録する際に 以下のコマンドを何度実行しても処理されませんでした。
（一切応答もない。。）

実行コマンド： `ruboty add job "* * * * *" ruboty echo hoge`

`ruboty help` してみると 
`ruboty /add job "(?<schedule>.+?)" (?<body>.+)/m - Add a new cron job`
と表示されるので、シンタックスはあってるはず。

## 原因

原因は Macのスマート引用符でした。（macOS High Sierra）

#### ダメな場合
<img width="402" alt="スクリーンショット 2018-03-07 17.29.53.png" src="https://qiita-image-store.s3.amazonaws.com/0/51108/306a68c7-dd2d-669d-8b32-036810288cb3.png">

#### うまくいく場合
<img width="401" alt="スクリーンショット 2018-03-07 17.31.48.png" src="https://qiita-image-store.s3.amazonaws.com/0/51108/c95533a9-0f1a-11c3-df1f-d851cb6bf7b4.png">

##### 両方並べて拡大した画像
<img width="656" alt="スクリーンショット 2018-03-07 17.36.25.png" src="https://qiita-image-store.s3.amazonaws.com/0/51108/7695ac6b-a9b6-0cd8-03a1-c63c8533974a.png">

引用符が違うのわかりますか？
ということで、Mac標準機能で引用符が勝手にスマートなやつに変わるのが原因でした。

これをやめるには、[環境設定] - [キーボード] からユーザ辞書をを開き、
`スマート引用符とスマートダッシュを使用`のチェックを外します。

`<img width="468" alt="スクリーンショット 2018-03-07 17.42.07.png" src="https://qiita-image-store.s3.amazonaws.com/0/51108/e93aa937-3d43-1729-8f58-f4a48b139339.png">

これで add できるようになります！！

ちなみにスマート引用符でググると
[Mac でコーディングする人は「スマート引用符とスマートダッシュ」を OFF にしようという話](http://beniyama.hatenablog.jp/entry/2015/09/24/234838)
[OS X のスマート引用符(怨)を止めさせる](https://qiita.com/Balacker/items/67497f3ac181cf980ff1)
など見つかるので、エンジニアのみなさんは無効化しておいた方がよさそうです。
R の http クライアントの使い方 (Post)

次のページを参考にしました。
[httr quickstart guide](https://cran.r-project.org/web/packages/httr/vignettes/quickstart.html)

```r:http_post.R
# ---------------------------------------------------------
#	http_post.R
#
#				Mar/07/2018
#
# ---------------------------------------------------------
write("*** 開始 ***", stderr())
library (httr)
rr <- POST("https://httpbin.org/post", body = list(user = "jiro", password="123456"))
print ("---------------------")
http_status(rr)
print ("---------------------")
str(content(rr))
print ("---------------------")
rr
write("*** 終了 ***", stderr())
# ---------------------------------------------------------
```

実行コマンド

```bash
Rscript --no-restore --no-save http_post.R
```

次のバージョンで確認しました。

```text
$ Rscript --version
Rscript (R) version 4.2.1 (2022-06-23)
```

Get の例はこちら
[R の http クライアントの使い方 (Get)](https://qiita.com/ekzemplaro/items/ccc96f59c49fa5270f29)
PDO::ATTR_EMULATE_PREPARESのON/OFF比較

# これを見るといい

[PHPでデータベースに接続するときのまとめ](https://qiita.com/mpyw/items/b00b72c5c95aac573b71#エミュレーションに関するまとめ)

これ以上の簡潔な説明はない。

# 検証してみる

> プリペアドステートメントのためにデータベースサーバと通信する必要が無くなるため，エミュレーションを行ったほうがパフォーマンスは向上する．

ということなので検証して差別化。

## 検証

PHP 7.1 と MySQL 5.7 です。

```php
<?php

class FetchClass {
  public $id;
  public $varchar_1;
  public $text_1;
  public $int_1;
  public $int_2;
  public $int_3;
  public $timestamp_1;
  public $timestamp_2;
}

function profile($emulates) {
  $pdo = new PDO('mysql:host=localhost;dbname=any_db', 'root', 'pass');
  $pdo->setAttribute(PDO::ATTR_EMULATE_PREPARES, $emulates);

  $start = microtime(true);
    foreach(range(0, 9999) as $i){
    $id = 1000000 + $i;
    $st = $pdo->prepare('select id, varchar_1, text_1, int_1, int_2, int_3, timestamp_1, timestamp_2 from any_table where id = ?');
    $st->setFetchMode(PDO::FETCH_CLASS, 'FetchClass');
    $st->bindParam(1, $id);
    $st->execute();
    $rows = $st->fetchall();
  }
  return microtime(true) - $start;
}

$on_time = profile(true);
$off_time = profile(false);

echo "emulate  on : time : $on_time";
echo "emulate off : time : $off_time";
```

## 結果

```text
emulate  on : time : 0.87435293197632
emulate off : time : 1.4851009845734
```

今回の計測では約1.7倍の差。かなりエミュレートモードが早い！
なので一概に「エミュレートモードをOFFにしよう」にはならない。

## 検索結果の型情報

MySQLではエミュレートモードを使うと検索結果の型情報が失われる。
検索結果を`var_export()`したものがこちら。

```text
-- emulate on : 全部文字列 --
FetchClass::__set_state(array(
   'id' => '1000000',
   'varchar_1' => 'name',
   'text_1' => 'comment',
   'int_1' => '1',
   'int_2' => '155',
   'int_3' => '161',
   'timestamp_1' => '2017-12-13 11:28:09',
   'timestamp_2' => '2017-12-13 11:28:09',
))

-- emulate off : カラムの型通り --
FetchClass::__set_state(array(
   'id' => 1000000,
   'varchar_1' => 'name',
   'text_1' => 'comment',
   'int_1' => 1,
   'int_2' => 155,
   'int_3' => 161,
   'timestamp_1' => '2017-12-13 11:28:09',
   'timestamp_2' => '2017-12-13 11:28:09',
))
```

これを`json_encode()`して、ブラウザやアプリに渡すこともあると思うが
ブラウザはJavaScriptなので型が緩くて良いが、アプリだと型の不一致となって困る。
R の http クライアントの使い方 (Get)

次のページを参考にしました。
[httr quickstart guide](https://cran.r-project.org/web/packages/httr/vignettes/quickstart.html)

## パッケージのインストール

```text
> install.packages("httr")
```

Ubuntu でのインストール

```bash
sudo apt install r-cran-httr
```

## プログラム

```r:http_get.R
# ---------------------------------------------------------
#	http_get.R
#
#				Mar/07/2018
#
# ---------------------------------------------------------
write("*** 開始 ***", stderr())
library (httr)
rr <- GET("https://httpbin.org/get")
print ("---------------------")
http_status(rr)
print ("---------------------")
str(content(rr))
print ("---------------------")
rr
write("*** 終了 ***", stderr())
# ---------------------------------------------------------
```

実行コマンド

```bash
Rscript --no-restore --no-save http_get.R
```

次のバージョンで確認しました。

```text
$ Rscript --version
Rscript (R) version 4.2.1 (2022-06-23)
```
Unityを見た感想

ゲームをまともに作ったことないから触ってみたよ。組み込み系で C 言語メインにさわってたよ。

# 感想
プログラミングの知識はそんなに必要ないが、Unity 専用の知識が必要だね。3Dの知識もあると便利かも。あまり気にしなくても大丈夫だけど。

# ボトムアップ
物語は主人公がいないと始まらない的な。とりあえず動かしておく物おいといて、後からロジックくっつけたり、パラメータ設定したりするよ。逆にはじめからきちんと設計できれば実装までは遠いけどその後が楽になりそうだよ。手当たり次第に作ると go to hell.

# ゲームオブジェクト
表示物はぜんぶゲームオブジェクト。プレハブというのはゲームオブジェクトのあつまりみたいな。いわゆるオブジェクト指向なのかな

# シーン単位
シーンの中でゲームオブジェクトをいろいろプログラミングするよ。プログラミングと言うよりデータを入力する感じだね。

# 機能
たくさんありすぎてめまいがするよ。本当に必要な機能やパラメータを探すのが大変だ。

# つまるところ
蛇の道は蛇

何ができるかでは無く何がしたいか、を間違えると大変だね。
Garstner Waveについて

Garstner Waveについて

表面にある点Aが、波の動きと共に動かない点Bの周りを回転しているかのように動かす仕組み。
画像の色ごとの意味

黒：点
青：波
赤：点Bを中心にした円

![Garstner Wave.jpg](https://qiita-image-store.s3.amazonaws.com/0/242436/48abda3c-616f-b9bd-276d-72a430234add.jpeg)

これを三角関数と上手く兼ね合わせて、各座標を更新させると波の形状を表現することが可能になることが分かりました。

今回の記事は自分が忘れない為に書いている為、理屈だけ記入しておりソースコードの詳細は記載しておりません。
SmartGit > タグとコミット間の差分を確認する手順

```txt:動作環境
C++ Builder XE4
Windows 7 Pro (32bit)
SmartGit Version 17.1.5 #11217, installed: #11182
```

SmartGitでのタグとコミット間の差分を確認する手順は以下のようだ。

1. Log for .ウィンドウを開く (Ctrl + l)
2. Commitsペインにおいて、確認対象のコミットをクリックする
3. BranchesペインのTagsの確認対象のタグ上で右クリックし、Compare with Selected Commitを選択する

Filesペインに変更のあったファイルリストが表示される。
各ファイルをクリックすると変更を確認できる。
Laravelでコマンドをつくる


`app/Console` ディレクトリ内でつくることができる。

# コマンドの処理を書くクラスを作成

```
php artisan make:command test
```

### `protected $signature`

コマンド名。実行するときは `php artisan` をつけて以下のように実行。

```
php artisan command:name
```


### `handle()`

ここに処理を書く。

![スクリーンショット 2017-04-26 15.18.44.png](https://qiita-image-store.s3.amazonaws.com/0/109241/a003483d-60ef-fe42-cbcd-63116f37c89c.png "スクリーンショット 2017-04-26 15.18.44.png")

# コマンドを使えるように登録

`Kernel.php` で

```
    protected $commands = [
        test::class,
    ];
```


としてコマンドを登録する。
VSCodeでFlutterの開発環境を整える

## 概要

- VSCodeでFlutter(Dart)の拡張を入れる手順

## VSCodeに拡張機能を追加

- 以下の2つを入れるだけでOK
    - VSCodeの再起動は忘れずに

### Dart Code

- https://marketplace.visualstudio.com/items?itemName=Dart-Code.dart-code

<img width="760" alt="スクリーンショット 2018-03-07 17.13.00.png" src="https://qiita-image-store.s3.amazonaws.com/0/175213/3b821b6c-c233-420a-f229-f45e667cc3f2.png">

### Flutter Snippets for vscode(from IntelliJ IDEA)

- https://marketplace.visualstudio.com/items?itemName=franzsilva.fs-flutter-snippets

<img width="761" alt="スクリーンショット 2018-03-07 17.13.18.png" src="https://qiita-image-store.s3.amazonaws.com/0/175213/160e1ac0-8054-5f00-dea4-b27a81008404.png">

### その他

- 設定を変えたければ`cmd + ,`でuser settingsを開いてデフォルトを上書けばいい

<img width="797" alt="スクリーンショット 2018-03-07 17.17.02.png" src="https://qiita-image-store.s3.amazonaws.com/0/175213/31813a1c-a149-98af-bb6d-df23e9d798c4.png">
LinqのSelectはこういう使い方もできるんだと知った


```
public class Member{
    //年齢
    public int Age {get; set;}
    //性別コード。値は任せる。
    public int GenderCode {get; set;}
    //ストライクの人に立てるフラグ
    public bool IsStrike {get;set;}
}

public void foo() {
    //この時点ではAgeとGenderCodeだけが入ったリストを作ったとする。
    List<Member> Members = GetMember();
    //スペックがストライクゾーンの人にフラグを立てる。
    Members = Members.Select(m => {
        m.IsStrike = m.Age >= 28 && m.Age < 42 && m.GenderCode == 1;
        return m;
    }).ToList();
}
```

いまいちピンときてないけど出来た。こういう理解できてないけどできた！ってのが一番厄介なんだよな。。。
Xaudio2のカスタムエフェクトについて 

##今回Xaudio2のカスタムエフェクトについて

今回のサウンドエフェクトはVisualStudio2015でDirectXSDK(June)を使っており、C言語で書いております。
又ソースコードに関してですが、エフェクト実装だけ触れる感じになります。

今回、私が行おうとしていたサウンドエフェクトに関する流れを書きます。

![SoundEffect.jpg](https://qiita-image-store.s3.amazonaws.com/0/242436/4fa23288-c00d-5bee-a1b1-f8d290e0fc28.jpeg)

ざっとこんな感じの流れになります。

理由としては、エフェクト音の生成をし基準となる情報値から好きなように操作して色々ためせるような環境にしようと思いました。

余談はこれぐらいにして、本題に入りたいと思います。

※※エフェクト生成（初期化部分で）※※

	IUnknown XAPO;
	XAUDIO2_EFFECT_DESCRIPTOR descriptor;
	XAUDIO2_EFFECT_CHAIN chain;

	descriptor.InitialState = true;
	descriptor.OutputChannels = 2;
	descriptor.pEffect = XAPO;


	chain.EffectCount = 1;
	chain.pEffectDescriptors = &descriptor;

	pSourceVoice->SetEffectChain(&chain);
	XAPO->Release();

解説
	①IUnknown, XAUDIO2_EFFECT_DESCRIPTOR, XAUDIO2_EFFECT_CHAIN型の変数を作ります。
	②XAudio2CreateReverb(**IUnknownの変数）;　//リバーブの作成です。第二引数もありますが、今回は書いておりません。
	③DESCRIPTORに情報を入れます。
	(1)DESCRIPTOR.InitialState = true;
	(2)DESCRIPTOR.OutputChannels = 2;
	(3)DESCRIPTOR.pEffect = *IUnknownの変数；
	③チェーンに情報を入れます。
	(1)CHAIN.EffectCount = 1;
	(2)CHAIN.pEffectDescriptors = &DESCRIPTOR;
	④IXAudio2SourceVoice型のデータにCHAINの情報をセットします。
	⑤IUnknown型(XAPO)の情報破棄します。

※※エフェクトの基準値を設定する（初期化部分で）※※

    XAUDIO2FX_REVERB_PARAMETERS Effectinfo;

	Effectinfo.ReflectionsDelay = XAUDIO2FX_REVERB_DEFAULT_REFLECTIONS_DELAY;
	Effectinfo.ReverbDelay = XAUDIO2FX_REVERB_DEFAULT_REVERB_DELAY;
	Effectinfo.RearDelay = XAUDIO2FX_REVERB_DEFAULT_REAR_DELAY;
	Effectinfo.PositionLeft = XAUDIO2FX_REVERB_DEFAULT_POSITION;
	Effectinfo.PositionRight = XAUDIO2FX_REVERB_DEFAULT_POSITION;
	Effectinfo.PositionMatrixLeft = XAUDIO2FX_REVERB_DEFAULT_POSITION_MATRIX;
	Effectinfo.PositionMatrixRight = XAUDIO2FX_REVERB_DEFAULT_POSITION_MATRIX;
	Effectinfo.EarlyDiffusion = XAUDIO2FX_REVERB_DEFAULT_EARLY_DIFFUSION;
	Effectinfo.LateDiffusion = XAUDIO2FX_REVERB_DEFAULT_LATE_DIFFUSION;
	Effectinfo.LowEQGain = XAUDIO2FX_REVERB_DEFAULT_LOW_EQ_GAIN;
	Effectinfo.LowEQCutoff = XAUDIO2FX_REVERB_DEFAULT_LOW_EQ_CUTOFF;
	Effectinfo.HighEQGain = XAUDIO2FX_REVERB_DEFAULT_HIGH_EQ_GAIN;
	Effectinfo.HighEQCutoff = XAUDIO2FX_REVERB_DEFAULT_HIGH_EQ_CUTOFF;
	Effectinfo.RoomFilterFreq = XAUDIO2FX_REVERB_DEFAULT_ROOM_FILTER_FREQ;
	Effectinfo.RoomFilterMain = XAUDIO2FX_REVERB_DEFAULT_ROOM_FILTER_MAIN;
	Effectinfo.RoomFilterHF = XAUDIO2FX_REVERB_DEFAULT_ROOM_FILTER_HF;
	Effectinfo.ReflectionsGain = XAUDIO2FX_REVERB_DEFAULT_REFLECTIONS_GAIN;
	Effectinfo.ReverbGain = XAUDIO2FX_REVERB_DEFAULT_REVERB_GAIN;
	Effectinfo.DecayTime = XAUDIO2FX_REVERB_DEFAULT_DECAY_TIME;
	Effectinfo.Density = XAUDIO2FX_REVERB_DEFAULT_DENSITY;
	Effectinfo.RoomSize = XAUDIO2FX_REVERB_DEFAULT_ROOM_SIZE;
	Effectinfo.WetDryMix = XAUDIO2FX_REVERB_DEFAULT_WET_DRY_MIX;

XAUDIO2FX_REVERB_PARAMETERS型の変数を作成して、既定の数値を入力していきます。
※XAUDIO2FX_REVERB_PARAMETERS型を作らず、自前で構造体を作って行うのも良いと思われます。

	SourceVoice->SetEffectParameters(0, &Effectinfo, sizeof(Effectinfo));

あとはサウンド再生中に、この作った情報の数値を更新するタイミングで計算させ、ソースボイスにこのエフェクト情報をセットさせることでエフェクトの様々な効果を出せることができます。
Raspberry piに接続したWebカメラの映像をiOSのアプリで表示させる



同じLANに接続されたRaspberry PiおよびiOSデバイスでWebカメラの映像をiPadで
表示するものです．
監視カメラの映像をiPadで閲覧するといったことに有用であると考えます．

#使用機器
1.RaspberryPi 3
2.Webカメラ Logicool c270

#使用ソフト
1.mjpg-streamer（動画ストリーミングソフトウェア）
2.Xcode(iPadアプリ開発)

#インストール手順
## mjpg-steamerをインストールする
###最新のパッケージを取得
```
sudo　　apt-get update
```
###subversion,libjpeg-dev,imagemagickをインストール
```
sudo apt-get install subversion libjpeg-dev imagemagick
```
###ソースファイルの取得
```
svn co https://svn.code.sf.net/p/mjpg-streamer/code/mjpg-streamer mjpg-streamer
```
###make
```
cd mjpg-streamer
make
```
#動画ストリーミングソフトウェアの起動
```
sudo ./mjpg_streamer -i "./input_uvc.so -f 10 -r 320x240 -d /dev/video0 -y -n" -o "./output_http.so -w ./www -p 8080"
```


#iPadアプリ開発

##View Controller　にWebViewを配置する
![図1.png](https://qiita-image-store.s3.amazonaws.com/0/156101/0fe52243-3f59-7a5b-9cd5-e154c40703b6.png)
##ViewController.swiftにControlキーを押しながら配置したWebviewをドラック＆ドロップ
![図2.png](https://qiita-image-store.s3.amazonaws.com/0/156101/1c2e27d0-3052-02bd-834d-028a194838e6.png)
##以下のようにコーディングする
```ViewController.swift
    override func viewDidLoad() {
        super.viewDidLoad()
        loadCamView()
    }

    func loadCamView(){
        var url: String = "http://[Raspberry pi のアドレス]:8081/javascript_simple.html"
        let requestURL = NSURL(string: url)
        let req = NSURLRequest(URL: requestURL!)

        MonitorWebView.loadRequest(req)
    }
```
##http通信を許可する

こちらのサイトを参考にしてください．
【swift】http通信を許可する方法
http://fukatsu.tech/permit-http-ios

##ビルドする
![図3.png](https://qiita-image-store.s3.amazonaws.com/0/156101/762cee82-1a67-c5ef-823a-a1171dfccea7.png)


#参考文献
WEBカメラで動画ストリーミング
http://www.hiramine.com/physicalcomputing/raspberrypi/webcamstreaming.html
Raspberry piとApacheとWebカメラで外部から見られる監視カメラを作った話。
http://qiita.com/CST_negi/items/a329cc98fb1aa33f33d3
Raspberry Piでwebカメラの映像を配信する方法(MJPG-streamer編)
https://www.smartllc.jp/blog/20150222-how-to-stream-webcam-with-mjpgstreamer-on-raspberrypi/
職場での隠しカメラの使用

携帯性があり、小さなレンズが装備されています。ナイトビジョン機能が搭載され、高品質のビデオが生成されます。さらに、製品は本当に手頃な価格です。どこにでも持ち込むことができます。家庭の保護アイテムとして役立ちます。電球型 カメラは周囲の環境に容易に溶け込むことができます。
http://www.bouhannstore.com/miniature-camera-quality.html
高画質な写真や動画を撮影したい場合は、カメラ各種からユーザーの用途に合う製品を選ぶのがおすすめです。まざまな画角で撮影できるペン型カメラです。初心者の方でも扱いやすいのが魅力です。大きく高画質な撮影が可能となります。レンズの種類も豊富にあります。
http://www.bouhannstore.com/infrared-camera-cheap.html
ナイトビジョンを提供する隠しカメラを選択することをお勧めします。暗視での撮影に対応できるようになります。セキュリティを強化することは大丈夫です。隠されたカメラと呼ばれる、小さくて、技術的に進歩した製品です。家の周りに行方不明の事件があり、あなたは実際の事実を知らずに人を告発したくない。
http://www.bouhannstore.com/spy-camera.html
slackの絵文字を'@'で左右反転させる拡張機能

# 私は知ってしまった

![panyainfo.png](https://qiita-image-store.s3.amazonaws.com/0/118352/05d467c5-9bdf-285f-e5f2-21a4276a4e0e.png)

そういうわけで天の声に導かれ、[例の拡張機能](https://qiita.com/asny/items/346b0bd3dd9ccb2c5c54)に追加することにしました。


# 左右反転するには
これは簡単な話で、CSSの[transform](https://developer.mozilla.org/ja/docs/Web/CSS/transform)を使えばよいです。

```css
transform: scaleX(-1);
```

# が、一筋縄ではいかない

SlackのメッセージはJSでロード、レンダリングされるため反転処理を `window.onload` 等で実行しても効きません。
今回は[MutationObserver](https://developer.mozilla.org/ja/docs/Web/API/MutationObserver)を使い、DOMが書き換わったら `@絵文字` を探して左右反転処理をします。
超簡単に書くとこんな感じ。

```javascript
var transformMessage = function(records) {
  // 省略するけどrecords(変更されたノードの配列)から`@絵文字`を探してスタイルを適用する処理
}

window.onload = function() {
  var messageObserver = new MutationObserver(transformMessage);
  messageObserver.observe(document.getElementById('messages_container'), {childList: true, subtree: true});
}
```

# やってみよう
こんな感じで `#messages_container` なエレメントが書き換えられたら `transformMessage` を呼び出してね、とします。

[そんなスクリプト](https://github.com/asny23/slack-emoji-modifier/blob/master/script.js)を追加して久しぶりに更新し、こんなふうになりました。

<img width="556" alt="スクリーンショット 2018-03-07 14.42.42.png" src="https://qiita-image-store.s3.amazonaws.com/0/118352/80a99b1c-5560-0b40-a213-e0b922ea69fe.png">
↑で送信すると

![スクリーンショット 2018-03-07 14.43.00.png](https://qiita-image-store.s3.amazonaws.com/0/118352/2e7b2419-7c49-27d4-0c37-581942328768.png)

↑こうなります。

`@` はSlackではメンションに使う記号なので絵文字反転に使うのは若干よくないのですが、今回はそういう要望だったのでそういうことにしたのでした。
FlutterでHelloWorldを動かすまで

## 概要

- 公式のGetStartedをやって動くものが見えるまでの手順
- https://flutter.io/setup-macos/

## 前提

- OSはmac
- Xcode/AndroidStudioはインストール済

## Flutterのインストール

- 以下のコマンドでインストール&パスを通す

```
git clone -b beta https://github.com/flutter/flutter.git
export PATH=`pwd`/flutter/bin:$PATH
```

- `flutter --version`が動けばOK
- `export`は適宜`.bashrc`なり`.zshrc`に書いておく

## その他のライブラリインストール

- 以下のコマンドを叩くと足りていないライブラリを教えてくれる
    - 結果が出るまでかなり時間かかった

```
flutter doctor
```

- 自分の場合は以下のコマンドを実行しろと言われたので実行

```
brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy
```

- IDEに関しては使わないものは無視して問題なし
    - 自分の場合VSCodeを使うのでIntelliJの部分は無視した

<img width="597" alt="スクリーンショット 2018-03-07 16.48.04.png" src="https://qiita-image-store.s3.amazonaws.com/0/175213/105d10ee-9127-018d-030f-8ec9a3cd7c48.png">

## アプリの作成/起動

- 以下のコマンドで雛形を作成できる

```
flutter create myapp
```

- シミュレータを起動させた状態で以下のコマンドを実行するとアプリを起動できる
    - 起動までかなり長い
    - 実機でもOK

```
flutter run
```

<img width="319" alt="スクリーンショット 2018-03-07 16.57.48.png" src="https://qiita-image-store.s3.amazonaws.com/0/175213/d3879e5b-71a9-960d-7b94-0161e4269228.png"><img width="297" alt="スクリーンショット 2018-03-07 17.10.14.png" src="https://qiita-image-store.s3.amazonaws.com/0/175213/19637e3d-3ab3-8cb2-ec0a-8fed1c7815bc.png">
ターミナル上での検索とかgrepとか

# はじめに
ターミナル上で頻繁に使う`find`や`grep`ですが、何度使っても文法を忘れるので一回まとめることにしました。

## TL;DR
あるディレクトリ下の、特定のパターンのファイル名に対してgrepしたい場合は以下のコマンドで解決できます。

`grep <pattern> --include=<filename> -r`
※2019/8/8更新。@tsuyoshi_cho さん、コメントありがとうございます！ 
（参考リンク: https://boxnos.hatenablog.com/entry/20071003/1191351963 ）

`find`と`xargs`を使った方法もあります。
`find <dirpath> -name <filename> | xargs grep <pattern>`

以下では、`find`、`grep`、そして`xarg`についての簡単な解説をします。

# find
検索コマンド。
指定したディレクトリ配下を再帰的に検索する。

```bash
# 基本形
find <dirpath> -name <name>

# 例
find ~/ -name *.py # HOMEディレクトリ以下の.pyファイルを検索
```

他にも、ファイルサイズとかで検索可能だが説明は割愛。

# grep
ファイルの中を検索するコマンド。

```bash
# 基本形
grep <pattern> <path> # patternは正規表現を使用可能。

# 例
grep pd.read_csv *.py # カレントディレクトリに存在する.pyファイルについて、pd.read_csvを検索
grep pd.read_csv ./work_directory/src # 指定したディレクトリに存在するファイルについて、pd.read_csvを検索
```

## 拡張子を指定しつつ、ディレクトリ内を再帰的に検索したいとき
`grep`では、拡張子を指定しつつ、ディレクトリ内を再帰的に検索することはできません。
しかし、拡張子を指定しながらgrepしたいということは頻繁にあります。

そこで、`xargs`を利用します。

```bash
# 基本形
find <dirpath> -name <filename> | xargs grep <pattern>

# 例
find ./work_directory/src -name "*.py" | xargs grep pd.read_csv # 指定したディレクトリ以下の.pyファイルについて、pd.read_csvを検索する
```

# まとめ
* `grep <pattern> --include=<filename> -r`
* `find <dirpath> -name <filename> | xargs grep <pattern>`

を覚えて帰ろう。
ERC20トークンの問題

ethereumで取引されるトークンの標準規格となっているERC20トークンだが２つの重大な問題が存在する。

##１．トランザクションハンドリングの欠如

ERC20トークンでトランザクションを実行するには次の2つの方法がある。
1.transfer()
2.approve+transferFrom()

どちらの場合もトークンを送信したとき受信側はトークンを受け取ったことに気づくことができない。

##approve+transactionFrom()における二重支払い

approveを使って転送許可を与えることを考える。転送許可するトークンの量を変更する場合、変更前に転送許可を与えられた者がトークンを受け取ると変更前のトークン量と変更後のトークン量の両方を受け取ることができてしまう。

##参考
https://medium.com/@dexaran820/erc20-token-standard-critical-problems-3c10fd48657b
OSをSSD/HDD に移動することについて

現在、コンピューターは単なるデータの保存と交換のメディアではなく、娯楽も提供しています。使用者はいい音楽曲目と映画をハードドライブにダウンロードしていつでも楽しめます。ハードドライブに保存するファイルサイズの上昇につれて、コンピューターの運転速度と反応速度は激しく影響されます。一方、SSDが世に出ることはユーザーにいい経験をもたらしてくれます。ですから、古いハードドライブを新しいSSDに替えるあるいはOS を新しいSSDに移動するのは何よりもコンピューターの性能と速度を高める選択になります。

また、ある大型なネトゲをハードドライブにダウンロードしなければなりません。これで、ハードドライブの空間は使い切れやすいです。この問題を解決するように、もっとも直接な有効な方法は古いハードドライブをもっと大きな新しいSSD/HDに替えるに越したことはありません。

使用者がWindowsまたプログラムを再インストールしたくないあるいはデータを無くしたくない場合、ぜひMiniTool Partition Wizard (http://www.partitionwizard.jp/) の[OS をSSD/HDに移行]機能に頼ってください。

以下はOSの移動についての MiniTool Partition Wizard のチュートリアルです。

ヒント:
その移動操作は ターゲットディスクの中の全てのデータを毀損します。予めデータをバックアップするあるいはほかの装置に移すことをお薦めします。ソースディスクの中のデータをちっとも影響しません。

OSをSSD/HD に移動する方法
１、 MiniTool Partition Wizard をスタートして、メイン画面に入ります。

２、 ツールバーの「OS をSSD/HDに移行」をクリックします。 
![migrate-os-to-ssd-hd-1[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/c8d781e4-68ae-29cb-d209-c04222deae35.jpeg)
３、正しい方式を選択してOSを移動します。「次へ」をクリックします。
![migrate-os-to-ssd-hd-2[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/92bbbe4e-99f4-2444-04d1-462619ab576b.jpeg)
システムディスクを置換します。
まず、システムディスクを移動する目的地である ターゲットディスクを選びます。「次へ」をクリックします。
![migrate-os-to-ssd-hd-3[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/7e3c02b8-74db-95ba-0742-164affcbadcc.jpeg)
それから、コピーオプションを選択します。または、MB/GP/TB単位で手動に明確なパーティションサイズを入力します。
![migrate-os-to-ssd-hd-4[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/77f604ab-8bac-45f5-8d58-2720fd75caf3.jpeg)
 ヒント:

    「パーティションを1MBに調整します」オプションはSSD あるいはアドバンストフォマートディスクの性能を高めます。そのような装置を使うなら、選択してください。
    「対象ディスクにGUIDパーティションテーブルを使用します」オプションを選択したら、2TB以上のハードディスクスペースを使うのは可能です。しかし、BIOSでUEFI起動を有効に設定しなければなりません。
    ターゲットディスクに対して「GUIDパーティションテーブル」を使ってMBRディスクのOSを移行することを MiniTool Partition Wizard 無料版はサポートしません。
    GPTディスクにインストールしたWindowsを移動しようとするなら、「対象ディスクにGUIDパーティションテーブルを使用します」オプションが見えません。


そして、ポップアップノートを読んで、「完了」をクリックして続けます
![migrate-os-to-ssd-hd-5[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/b0689850-3ea1-327d-d3ea-6b0d52d2c241.jpeg)
最後に、「適用」をクリックして、保留中の操作を実行します。ダイアログの「はい」をクリックして変更を適用します。

![migrate-os-to-ssd-hd-6[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/9a8874ac-4f1c-7592-c255-429d885cd16b.jpeg)
Windowsだけ移動する
![migrate-os-to-ssd-hd-7[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/a9553a7c-f93e-d1e0-c9e4-d24eb21f65a3.jpeg)
ターゲットディスクを選択してWindows10を移動します。「次へ」をクリックします。
![migrate-os-to-ssd-hd-8[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/3e075a5e-c7d0-353e-788f-cbd81aa06890.jpeg)
それから、コピーオプションを選択して「次へ」をクリックします。 
![migrate-os-to-ssd-hd-9[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/0b98cb37-7f84-08c0-3751-9e0cbade8166.jpeg)
ブートノートを読んで「完了」をクリックします。 
![migrate-os-to-ssd-hd-10[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/d8882d50-612b-4032-dd78-3053ae5d2ef0.jpeg)
最後に、ツールバーの「適用」をクリックして、保留中の操作を実行します。ダイアログの「はい」をクリックして変更を適用します。
![migrate-os-to-ssd-hd-11[1].jpg](https://qiita-image-store.s3.amazonaws.com/0/134328/ccbda7ba-83f5-d001-7d84-858dbeb740e0.jpeg)
Dartでtypedefせずに高階関数を使う

Flutter のソースを見てると高階関数の定義を毎回 typedef していた。

```dart
typedef void Callback(int);
Callback f = (int n) {print(n);};
```

これを typdefせずに書くにはどうするか。
ググって全然見つからなかったが、Flutterのソースからそれっぽいのを探したりした結果、こんな感じだった。

```dart
void Function(int) f = (n) {print(n);};
```

パーサの気持ちになるのが難しいが、`(型表現)(\s型表現)+\s(シンボル)\s*?=右辺` みたいな感じっぽい。単に関数の型含めて型表現なんだろうけど

じゃあ「関数を返す関数」は？

```dart
int Function(int) Function(int) f = (a) => (b) => a * b;
```

型が前置な関係で対応順が逆になる。
JavaやC++の人は自然だろうけど、TypeScriptや他の関数型を知ってる人はウーってなってしまいそう。
【WordPress】custom_permalinks_post_linkが使えなくなった件

# WordPress運用メモ書き

## 事象
Custom Permalinksプラグインを最新（1.2.17）にアップデートしたらPHPエラーが発生した。
PHP Fatal error:  Uncaught Error: Call to undefined function custom_permalinks_post_link()
Custom PermalinksプラグインでURLをカスタマイズしているサイトのため、記事のURLを取得するときはcustom_permalinks_post_linkを使っていた。

## 時期
最後にアップデートしてから時間が経ってしまったので、どのバージョンからかは不明。

## 回避策
古いバージョン（1.0.2）に手動で戻した。

本番で発生しなくて良かった。。
curlでIPアドレスからsslの検証を行う

`curl` で IPアドレスに対してSSLの検証を行う場合、 `-H` で `Host:`を指定してもverificationが失敗してしまいます。そのような場合には

```
curl --resolve '<domain>:443:<IP>' https://<domain>
```

のように`curl`自身に名前解決させると良いです