OmniAICreator/Qiita-1.07M huggingface dataset:
javascriptでURLをパース

URL関数を使ってパースする。caniuseを調べたら、IE11に対応していないことがわかりました。
http://caniuse.com/#feat=url

```javascript
var parser = new URL("http://www.example.com/files-tmb/1234/abc.png?key=val");

parser.href;      // "http://www.example.com:8000/files-tmb/1234/abc.png?key=val"
parser.host;      // "www.example.com"
parser.hostname;  // "www.example.com"
parser.origin;    // "http://www.example.com"
parser.password;  // ""
parser.pathname;  // "/files-tmb/1234/abc.png"
parser.port;      //  "8000"
parser.protocol;  // "http:"
parser.search;    // "?key=val"
```

ファイル名を取得

```javascript
parser.pathname.split('/').pop(); // abc.png
```

クエリを確認、取得

```javascript
parser.searchParams.has("key"); // もしクエリに"key"というキーがあったら、(bool)TRUE が返ってくる
parser.searchParams.get("key"); // val
```

### 引用

コメントにURL関数が紹介されたので、試してみたものをこちらの記事に議事録として残させていただきます。
http://qiita.com/johna1203/items/cef6826c1824228850a8#comment-4d2c81dfd2c5eb6eb804
VimでTwitter

## TwitVim

[TwitVim - Twitter client for Vim](https://github.com/twitvim/twitvim)

日がな一日黒い画面と対峙するVimmerには、必携のVim pluginです。
お好きなプラグインマネージャーでインストールしましょう。

## Tips

部署異動に伴って、生活環境を見直していたのですがTwitVimを更新するとユーザ認証でコケるというトラブルに直面しました。

- [Encoding '&' on Zsh · Issue #7 · twitvim/twitvim · GitHub](https://github.com/twitvim/twitvim/issues/7#issuecomment-289390267)

issueを投げたところ、あの[mattnさん](https://github.com/mattn)にサポート頂いたので浮かれて投稿してます。
issueに記載してますが、以下の対応でVimでTwitter出来るようになりました。

- URIをshell用に置換する際の関数がよろしくなかった
	- mattnさんに最新版を ```git push``` して頂きました。
- Python 3だとタイムアウトしたので、Python 2.7を利用するように設定した

参考までにvimrcの一部を貼っておきます。

```vim
" TwitVim
NeoBundle 'twitvim/twitvim'
let twitvim_enable_python = 1
```
RailsPanelでrailsの内部処理をdebugする

性能改善するための分析に期待できる。

参考：　https://github.com/dejan/rails_panel

## 三つステップで使用できる
1. Gemfile設定

```rb
group :development do
  gem 'meta_request'
end
```
2.RailsPanelをchromeに入れる
https://chrome.google.com/webstore/detail/railspanel/gjpfobpafnhjhbajcjgccbbdofdckggg

3.chrome developer toolsのrailsタブでrailsの内部処理を確認する。
CognosレポートをCSV形式でダウンロードすると拡張子が.xlsになる

##概要
もはやCognos関係者の間では暗黙の了解になっていて、Cognos環境を新規に構築した場合には、何も考えずに設定しておいた方が良い話です。

Cognos BI&AnalyticsでレポートをCSV形式でダウンロードすると、ファイルの拡張子がデフォルトで.xlsとなります。
当然ながら.csv拡張子でダウンロードして欲しいのですが、ずっと以前のバージョンから.xlsでダウンロードされる動作のままなので、CSVは.csv拡張子でダウンロードされるように強制するパラメーターが多くの環境では設定されています。

レポートをCSV形式で実行
![image](https://qiita-image-store.s3.amazonaws.com/0/147246/37e2f057-3c73-be68-09f3-7b6c5b1c4292.png)

.xls拡張子でダウンロードされてしまう。
![image](https://qiita-image-store.s3.amazonaws.com/0/147246/c4912ca8-67f4-8f4a-1c26-b2ae180628cc.png)


##設定内容
Cognos Administrationの「設定」タブの「ディスパッチャとサービス」からReport Serviceのプロパティを開きます。
![001.PNG](https://qiita-image-store.s3.amazonaws.com/0/147246/350102d8-7798-f52b-ddab-b00a62e87ebb.png)

「詳細設定」で赤枠のパラメーター：RSVP.CSV.MIMETYPE、値：applicaton/csv、を指定します。
![002.PNG](https://qiita-image-store.s3.amazonaws.com/0/147246/cb4f7541-a2f0-6a46-7f78-c4fd81ae823e.png)

ここで要注意ですが、値に指定するのは、application/csv(アプリケーション/シーエスブイ)ではなく、applicaton/csv(アプリカートン/シーエスブイ)です。
誰もが必ず一回間違えますので、ご注意下さい。

これにより、.csv拡張子でダウンロードされるようになります。
Cognos Analyticsでも同様の動きをしますので、Cognos環境を新規に構築の際には、この設定は何も考えずに自然と設定するようにしましょう。

元ネタはこちらです。
**How to change the file extension from .XLS to .CSV for report output format 'Delimited text (CSV)'**
http://www-01.ibm.com/support/docview.wss?uid=swg21586401
【解決】Google Tag AssistantでInvalid or missing account IDが出る問題

## ケース
最新のGoogle Tag Manegerを使ってるページでGoogle Tag Assistantを開いたらこんなエラーが。

Invalid or missing account ID

<img width="391" alt="20161124182137.png" src="https://qiita-image-store.s3.amazonaws.com/0/29792/820a4672-ac0c-19ed-ae46-14ebb5e187d1.png">


## 解決

最新のGoogle Tag Manegerを使うと`<script\>`タグに含まれるGTM-XXXXXX(account ID)のXの部分が7桁になる。
しかしGoogle Tag Assistantは4-6桁以外だと警告を出す。 
それでもgtm.jsはちゃんとダウンロードできてるから大丈夫ですよ。
とのこと

ソース: [Invalid Account ID with Google Tag Manager - Google+](https://plus.google.com/u/0/+SimoAhava/posts/WVSWfxpjScj?sfc=true)

## 結論

このエラーは無視でよしめでたしぃいいいいいいいいいいいいいいいいいいいいいいいい
CarrierWaveで元画像のサイズ(高幅x横幅)を取得する

<img width="512" alt="20161212123706.png" src="https://qiita-image-store.s3.amazonaws.com/0/29792/04bf32ef-61b1-7ef5-a491-ce7320d8b9de.png">


## やりたいこと

CarrierwaveでS3にアップロードした画像のサイズを取得できるようにしたい

## シチュエーション

- `resize_to_limit` を使っている。

- AMP対応につきリサイズされた画像のサイズを正確に知っておきたい。

- 画像はS3上にある

- S3にリクエスト投げて画像サイズを取得するのはまじで嫌だ(例: `MiniMagick::Image.open(article.image_url)[:dimensions]`)

## 解決法

app/uploaders/thumb_uploader.rb

    def filename
      "#{secure_token}.#{file.extension}" if original_filename.present?
    end

    def dimensions
      path.scan(/\d+x\d+/).to_s.scan(/\d+/)
    end

    protected

    def secure_token
      var = :"@#{mounted_as}_secure_token"
      return model.instance_variable_get(var) if model.instance_variable_get(var)
      width, height = ::MiniMagick::Image.open(file.file)[:dimensions]
      size_with_random = "#{width}x#{height}_#{SecureRandom.uuid}" 
      model.instance_variable_set(var, size_with_random)
    end

## 解説

1. 画像保存時にファイル名を`<横幅>x<縦幅>_<ランダム>.<拡張子>`と言うフォーマットにする。

2. ファイル名からサイズを取得(`Article#thumb#dimensions`)
rails locale設定の自動ロード

参考資料：　http://api.rubyonrails.org/classes/ActiveSupport/FileUpdateChecker.html

ファイルconfig/initializers/locale_yml_reloader.rbを作成し、中身は下記ようにする。

```rb
if Rails.env.development?
  locale_yml_reloader = ActiveSupport::FileUpdateChecker.new(Dir["config/locales/**/*yml"]) do
     I18n.reload!
  end

  ActiveSupport::Reloader.to_prepare do
    locale_yml_reloader.execute_if_updated
  end
end

```
超安全にデータ管理! Android用ファイルマネージャアプリ「Amaze File Manager」

<img width="512" alt="20170314122349.png" src="https://qiita-image-store.s3.amazonaws.com/0/29792/5d7d6428-2445-5ad7-d96a-42cf7d9402db.png">

## ファイルマネージャアプリとは
別名**データ管理アプリ**、**ファイルアプリ**、**ファイルエクスプローラーアプリ**などなど
スマホ内のフォルダの中身を見るアプリのことです。例えばスマホにダウンロードしたPDFファイルを探すときなどに使うやつです。


## ファイルマネージャアプリの危険(ウイルス)について

ファイルマネージャアプリをインストールしたときに、アプリはスマホ内のフォルダにアクセスする権限を取得します。
なので、アプリはその権限を使って勝手にファイルをインターネットにアップロードしたり勝手にスマホ内にウイルス(マルウェア)を保存したりすることができるのです。

ですので、ファイルマネージャ系のアプリはむやみにインスールするべきではないです。

## 安全なファイルマネージャアプリの選び方

アプリの中にはオープンソースなアプリというものが存在します。プログラムをすべて公開しているアプリのことです。
オープンソースなアプリが個人情報を抜き取るなどの不正行為をしていたり、ウイルス(マルウェア)が含まれていれば、他のプログラマがプログラムを読んだときにバレてしまいます。 
ですのでオープンソースなアプリを選ぶのが超おすすめです。  

## 結論

以上の理由で私はAmaze File Managerというオープンソースなファイルマネージャアプリを使っています。  

リンクも張っておきますが、ぜひアプリストアで「[Amaze File Manager](https://play.google.com/store/apps/details?id=com.amaze.filemanager&hl=ja)」と検索してみてください！
【保存版】GitHubのショートカットキーすべて

GitHubのショートカット使ってない人は目を通したほうがいい確率100%だよ！


## サイト全体で使える

| キー | 説明 |
| ------------- |-------------|
| s | 検索窓にカーソルを移動 |
| g + n | 通知一覧ページに遷移 |

## レポジトリ以下のページで使える

| キー | 説明 |
| ------------- |-------------|
| g + c | レポジトリトップに遷移 |
| g + i | イシューページに遷移 |
| g + p | プルリクページ一覧に遷移 |
| g + w | Wikiページ一覧に遷移 |

## ソースコード閲覧中に使える

| キー | 説明 |
| ------------- |-------------|
| t | ファイルファインダー起動 |
| l | 行数指定移動 |
| w | ブランチ移動 |
| i | コメント表示非/表示 |

## コメントフォームで使える

| キー | 説明 |
| ------------- |-------------|
| command/control + b | 太字入力 |
| command/control + i | イタリック入力 |
| command/control + k | リンク作成 |

## イシュープルリクページで使える

| キー | 説明 |
| ------------- |-------------|
| c | イシュー作成 |
| / | 検索窓にカーソルを移動 |
| u | 投稿者で絞込み |
| l | ラベルで絞込み |
| m | マイルストーンで絞込み |
| a | アサインで絞込み |
| o + enter | イシューを開く |

## 通知ページで使える

| キー | 説明 |
| ------------- |-------------|
| e or l or y | 既読にする |
| shift m | スレッドをミュート |

## ネットワークグラフ

| キー | 説明 |
| ------------- |-------------|
| ← or h | 左スクロール |
| → or l | 右スクロール |
| ↑ or k | 上スクロール |
| ↓ or j | 下スクロール |



こんなショートカットあるの知らなかった。

`s`, `w`, `g + c`, `g + p`, `t`, `l`
めっちゃいいやん。
AMP Analyticsで自社(特定)のIP Addressからのアクセスを除外する方法

amp-analytics ではIP Addressの一部が暗号化されるので従来のやり方ではうまくうごきません。
## 手順
### 1. IP Addressを調べる
http://test-ipv6.com/ にアクセスして取得
例:
  IPv4であれば`245.123.345.456`みたいなやつ
  IPv6であれば`23d2:424d1:1234:2345:9c49:29e5:2415:13e9`みたいなやつ

### 2. Analyticsでフィルタに設定する
Google Analytics > 管理 > ビュー > フィルタにアクセスしてフィルタを作成する  
<img width="512" alt="20170201160647.png" src="https://qiita-image-store.s3.amazonaws.com/0/29792/9b3e01f3-ce47-022b-33ce-f13cce09f3df.png">

画像のように「除外」「IPアドレスからのトラフィック」「前方が一致」を選択してIP Addressの一部を入力する  
IP Addressは**最初の3オクテットのみ**入力します。  
例:
  IPv4であれば`245.123.345`まで
  IPv6であれば`23d2:424d1:1234`まで  

## amp-analytics の注意点
amp-analytics ではIP Addressの一部を暗号化しているためそのままIP Addressを指定するとうまく動きません。
IPv4であれば最期の1オクテット、IPv6であれば最期の5オクテット(最期の80bit)が0に変換されてしまうとのことです。

> the last octet of the user IP address is set to zero while still in memory (If the IP address is an IPv6 address, the last 80 of the 128 bits are set to zero.)
> > 参考: https://support.google.com/analytics/answer/2763052
怖くない例外と冗長なnullチェック（過剰な防衛)について

## ReadMeFirst

最近、業務でエラーの握りつぶしとか、nullチェックとかで
いろいろ辛い気持ちになったので、IMO（我思う)な記事を書いてみました。

よくある困ったコード(phpを例に)

```php
public function example(args) {
	if args === null {
		return false
	}
	...(処理内容)
	return "example"
}

public function useExample() {
	ret = example()
}
```

を例に話してみようかなと思います。

## 困るところ

* 失敗した際にfalse以上の情報を `example`関数から得る事ができないので、失敗理由が複数ある場合、理由別のハンドリングができない。
* php7以前は返り値の型が指定できないのもありますが、文字列を返したり、真偽値を返したり、だと、`example`を使う側が冗長なチェックをする必要がある。

(補足) 型がないのがそもそも(ry みたいな論議もありますが
返す型は１つで固定されている方が圧倒的に使う側は楽ですし、関数の利用側が考慮することが減るので`返り値の型は１つ` にした方が良いです。`instanceOf ` とかを使う羽目になった時は赤信号。

## 改善案

例外を使いましょう。

```php
public function example(args) {
	if args === null {
		throw New InvalidArgumentException("error message")
	}
	...(処理内容)
	return "example"
}

public function useExample() {
	try {
		ret = example()
	} catch (InvalidArgumentException e) {
		//badArgumentな時の回復処理
	} catch (HogeHogeException e)
		// HogeHogeExceptionな時の回復処理
	} catch (FugaFugaException e)
		// 何もしない。 Badな例
	} catch (Exception e)
		ret = false //失敗を握り潰すBadな例
	}
	....
}
```

とすることでexampleの返り値はstringを守りつつ、
例外の型で失敗のContextを利用者側に伝えることができ、失敗理由に
応じた回復処理を行うことができます。

## point

* 基底の例外を使わず独自の例外を定義する

基底例外ではエラーメッセージ以外から失敗した理由や背景を伝える事ができません。
エラーの理由が言語やライブラリが吐くような ` 技術的な例外 ` はそもそも回復可能じゃないケースが多いし、想定しててもキリがないので、意図がないならcatchせずフレームワークや上位層でごそっと捕まえて、ロギングなりをした方がスッキリします。

そうでない例外のみを意識して扱かう方が良いかな
と思います。

(補足) 勿論ユースケースや処理内容にもよります。

* 回復処理がないなら無理にcatchしない

サンプルコードに書きましたが、理由なく例外を無理に握りつぶさない、何もしないならcatchせず例外を上の層まで伝播させた方が良いです。

* 早めにクラッシュさせること

達人プログラマ本やエッセイの[死ぬはずのプログラムを無理に生かしておいてはいけない](http://プログラマが知るべき97のこと.com/エッセイ/死ぬはずのプログラムを無理に生かしておいてはいけない)でも
語れていますが、無理に生かすと開発やテスト段階で気付きづらいので、問題を検知しやすい事も重要です。

* そもそもこのnullチェックはエラーするべきなのか。

`そのnullはユースケースにおいて、通常起き得るnullなのか？` と言う観点で決めれば良いと考えています。
想定するユースケースにおいて、nullが起きないのであれば、`nullで呼び出しが起きている事自体` 
がエラーなのでエラーを起こした方が、問題の検知が容易です。

ここら辺の呼出側、呼ばれる側の責務分担については[契約による設計](https://ja.wikipedia.org/wiki/契約プログラミング)でも語れています。


## Goでも同じ

PHPがダメなんでしょ?みたいな話に比較的なりがちですし、
Goは例外がなく、errorを値として扱うので差異はありますが、
`エラーの扱い`や、ここでは書いていませんが、`契約プログラミング`については、活用できるかなと。

## まとめ

Goでも ` errorを握りつぶしてlogだけして返さない ` コードや冗長なnilチェックが
よくあって例外というか、エラーの扱い方について、辛い気持ちになったので書いてみました。

例外については、設計が難しいという議論もありますし、使いすぎると複雑性を上げる、
` tryCatch全部外してアプリが動かないなら ` 使い方を間違えているという強い意見もありますが
個人的には、節度と用法を守って使い方を定めればメリットを享受することができる、と
思います。

## 参考

[プログラマの知るべき97のこと](http://プログラマが知るべき97のこと.com/エッセイ)
[例外設計における大罪](https://www.slideshare.net/t_wada/exception-design-by-contract)
Animate.css を使って一定間隔でアニメーションさせる

要素に色々な動きをつけてくれる Animate.css

公式サイト: https://daneden.github.io/animate.css/

やり方はとても簡単で、animate.cssを設置したら、Classに「animated」とつけたい動きの名前を入れれば、さくっと複雑な動きをしてくれます。

例）

```html
<div class="animated flash">点滅させる</div>
```

これだと、１回きりなので、ずっと動かしたいときは、「infinite」をつけます。

例）

```html
<div class="animated flash infinite">ずっと点滅させる</div>
```


とはいえ、これだとずーーーーと点滅していて目がチカチカする！
他の動きもそうですが、**一回動いたらしばらく止まって、で、また動いて欲しい！**
ということもあるはず、

で、いろいろ調べた結果、やっぱりそこはJavascriptで制御しないといけないようなので、
サンプル書いてみました。

簡単にいうと、Javascriptで、一定間隔でClassを取ったりつけたりするだけです。

```js
setInterval("goFlash()",4000);

function goFlash() {
	$('#target').addClass('animated flash');
	setTimeout("removeFlash()",2000);
}

function removeFlash() {
	$('#target').removeClass('animated flash');
}
```

setInterval() を使って、一定の間隔でClassを追加
Classを追加後、そのあとすぐ消すとアニメーションしてくれないので、setTimeout()を使って、少し経過したらClassを取るという動作です。

これで、アニメーションが、動いたあとしばらく動かず、また動くという動作ができます。
金融関係のデータをpythonで取得する（then ちょっといじる）


## バージョンの確認

今回使ったpythonのバージョンは以下です．

```sh
python --version
Python 3.5.1 :: Anaconda 4.0.0 (x86_64)
```

今回使うものをインストールします．

```sh
pip install quandl
pip install pandas-datareader
pip install jsm
pip install stockstats
```

## 金融関係のデータの取得
まず結論としては，Quandl, pandas_datareader, jsmあたりが存在し，Quandl, pandas_datareaderを使うのがよさそうです．（他にもあれば教えてください．ありそう．）

### Quandl

公式のドキュメントは[ここ](https://docs.quandl.com/docs/)．
とりあえずアップルの株価を取得してみます．

```python
import quandl

d = quandl.get("WIKI/AAPL")

d.columns
# Index(['Open', 'High', 'Low', 'Close', 'Volume', 'Ex-Dividend', 'Split Ratio',
#        'Adj. Open', 'Adj. High', 'Adj. Low', 'Adj. Close', 'Adj. Volume'],
#       dtype='object')

d.shape
# (9162, 12)
```
ここになぞのWIKIというワードが入っていますが，これはデータの公開元で，[このへん](https://docs.quandl.com/docs/data-organization)に書いてあります．

データは日時のみっぽい．

また，過去の記事で`import Quandl`となっているものもありますが，途中から小文字になったようです．

### pandas_datareader
公式の[ドキュメント](https://pandas-datareader.readthedocs.io/en/latest/)．

```python
import pandas_datareader as pdr

d = web.DataReader("AAPL", 'google')

# Parameters
# ----------
# name : str or list of strs
#     the name of the dataset. Some data sources (yahoo, google, fred) will
#     accept a list of names.
# data_source: {str, None}
#     the data source ("yahoo", "yahoo-actions", "yahoo-dividends",
#     "google", "fred", "ff", or "edgar-index")
#以下略

d.shape
(1831, 5)

d.columns
# Index(['Open', 'High', 'Low', 'Close', 'Volume'], dtype='object')

```
一つめの引数でアップルを指定し，データソースにgoogleを指定しています．

データは同様に日次のみな模様．

取得期間の指定は以下のようにできる．


```python
import pandas_datareader as pdr
import datetime

start = datetime.datetime(2015, 1, 1)
end = datetime.datetime(2017, 4, 12)
d = pdr.DataReader("AAPL", 'google', start, end)

d.shape
# (574, 5)
```


### jsm
[jsm](https://pypi.python.org/pypi/jsm/0.19)は2015年で開発が止まっている上に，yahooからデータをスクレイピングしていると書いてあります．
yahooは[ここ](https://www.yahoo-help.jp/app/answers/detail/p/546/a_id/93575/~/yahoo%21%E3%83%95%E3%82%A1%E3%82%A4%E3%83%8A%E3%83%B3%E3%82%B9%E6%8E%B2%E8%BC%89%E6%83%85%E5%A0%B1%E3%81%AE%E8%87%AA%E5%8B%95%E5%8F%96%E5%BE%97%EF%BC%88%E3%82%B9%E3%82%AF%E3%83%AC%E3%82%A4%E3%83%94%E3%83%B3%E3%82%B0%EF%BC%89%E3%81%AF%E7%A6%81%E6%AD%A2%E3%81%97%E3%81%A6%E3%81%84%E3%81%BE%E3%81%99)でスクレイピングは禁止と言っており，使わない方がいいかなあ，という感じです．

## 金融データをいじる
### stockstats
取得した金融データをいじるパッケージとして，stockstatsがあります．

```python
import stockstats
import quandl

d = quandl.get("WIKI/AAPL")

d.shape
# (9162, 12)

type(d)
# pandas.core.frame.DataFrame

stock = stockstats.StockDataFrame.retype(d)

type(stock)
# stockstats.StockDataFrame

```
stockstatsは，retypeメソッドによってpandas dataframeを拡張した，stockstats.StockDataFrameという型にかえてくれます．これによって，たとえばMACDの計算などを，

```python
stock['macd']
# Date
# 1980-12-12    0.000000
# 1980-12-15   -0.033654
# 1980-12-16   -0.104902
# 1980-12-17   -0.112351
```

このように簡単に行ってくれます．

retypeに渡すデータフレームのkeyは，中のコードをみるとlower関数で小文字にしているので，大文字小文字の違いは吸収してくれそうですが，計算したいもののデータがない場合はkey errorになります．なので普通使われない変数を使うとき，もしくは変数が少ないときは，pandasのままの書いた方がいいかもしれません．
Google モバイルフレンドリーテストAPIのRubyサンプルコード

2017 2/1にモバイルフレンドリーテストAPIが公開されたのでRubyでサンプルコード書きました。
## モバイルフレンドリーテストAPIとは

[(APIではない)モバイルフレンドリーテスト](https://search.google.com/search-console/mobile-friendly?hl=ja)は特定のページのスマホ表示に問題がないかをそのページのURLを手入力するだけで確認できる神ツールです。この記事を読むようなWeb担当者、SEO担当者、開発者には親しみ深いものだと思います！

それに対し[モバイルフレンドリーテストAPI](https://developers.google.com/webmaster-tools/search-console-api/reference/rest/v1/urlTestingTools.mobileFriendlyTest)はこの作業を自動化するためのものです。
プログラムを使って確認したいページのURLをモバイルフレンドリーテストAPIに投げることによってスマホ表示に問題がないかを確認することが出来ます。

一日一回サイト内の全ページのスマホ表示に問題ないか確認するという、手作業でやったら27時間とかかかりかねない作業もプログラムを使えば自動で出来ます。(モバイルフレンドリーテストAPIしゅごい)

## Ruby サンプルコード
最新版はこちらhttps://gist.github.com/awjecc/94003e238a160c8a15bd01cc5c61470f

    require 'uri'
    require 'net/http'
    require 'optparse'
    
    ##################
    # READHERE
    ##################
    # 使い方:
    # % ruby url_testing_tools_sample.rb --api=<YOUR API KEY> --url=<URL>
    # Google API Manager(https://console.developers.google.com)で
    # Google Search Console URL Testing Tools APIを有効にして
    # 認証情報を作成してAPIキーを取得し、<YOUR API KEY>の部分を置き換えてください。
    
    ##################
    # Initialize
    ##################
    URL_TESTING_TOOLS_URL = 'https://searchconsole.googleapis.com/v1/urlTestingTools/mobileFriendlyTest:run'
    options = {}
    OptionParser.new do |opts|
      opts.banner = 'Usage: url_testing_tools.rb [options]'
    
      opts.on('-u', '--url=VALUE', 'Url you want to test.') do |v|
        options[:url] = v
      end
      opts.on('-a', '--api=VALUE', 'Your API key.') do |v|
        options[:api_key] = v
      end
    end.parse!
    
    if options[:url].nil? || options[:api_key].nil?
      puts 'error: Please pass options. See --help.' 
      exit 1
    end
    
    ##################
    # Execution
    ##################
    api_uri = URI(URL_TESTING_TOOLS_URL)
    res = Net::HTTP.post_form(api_uri, url: options[:url], key: options[:api_key])
    puts res.body
vi覚書

vi覚書

## 1. 画面分割
`:sp`

分割した画面間の移動
`ctrl + wp`

## 2. 指定行へジャンプ
`:[行番号]`

## 3. ある行をマーク＆マークした行へジャンプ
マーク：　`m[任意のキー(a-z)]`
ジャンプ：　`'[任意のキー(a-z)]`


## 4. シンタックスカラー使用、行番号表示、タブ文字数を４に　

.vimrc (.exrc)

```
syntax on
set nu
set tabstop=4
```
インストール不要のアプリ「Instant Apps」とは？使い方は？

# Android Instant Apps リリース
2017 2/14にAndroid Instant Appsのリリースが確認されました。
Webページ感覚でアプリが開けるのでこれからのウェブページのあり方やSEOに影響を与えそうですね。
普段Web関係のソフトウェアエンジニアをしてるので知識のキャッチアップも含めまとめました。      
**この記事では実際にAndroid Instant Appsとはなにかと実際に使う手順を説明します。**  

※ 海外端末のNexus 6Pにて検証済みのソースを元にしてます。手元のNexus5Xでは設定のInstant Appsが表示されませんでした。ソースは記事下部のリンク集に貼ってます。

## Android Instant Apps とは

- **インストール不要**で実行できるアプリ
- Googleの**検索結果**から直接開ける
- もちろんPlay StoreやApp Storeにアクセスする必要もない
- 限られた開発者しか作ることを許されていない(2017 2/15時点)
- (Webページで言うAMPに似てる)

## Android Instant Appsを使う方法
※ Nexus 6Pにて検証済みのソースを元にしてます。手元のNexus5Xでは設定のInstant Appsが表示されませんでした。ソースは記事下部のリンク集に貼ってます。

### 事前準備
1. Android 7.1.1以上にアップデート
2. https://play.google.com/store/apps/details?id=com.google.android.googlequicksearchbox&hl=en からGoogleの最新版をインストール
3. 設定 > Google > Instant Apps > 従って「Yes, I'm in.」をタップ

### Android Instant Appsを開く
1. Googleで「Wish」と検索
2. 詳細部にInstantと書かれてるリンクをタップ
3. 「Open App」をタップ

![20170215105749.jpg](https://qiita-image-store.s3.amazonaws.com/0/29792/67929363-7f71-843d-ef6c-4244feda14a1.jpeg)


## リンク集

Android Instant Appsとは？をまとめた記事: http://japanese.engadget.com/2016/05/18/android-instant-apps/
ついにリリースされたよって記事:
http://www.androidauthority.com/instant-apps-rollout-749455/
Nexus6Pでの動作確認記事:
http://www.androidauthority.com/use-android-instant-apps-749544/
CLLocationManager に位置情報更新通知の遅延を要求する

## 概要

```swift
func allowDeferredLocationUpdates(untilTraveled distance: CLLocationDistance, timeout: TimeInterval)
```
[allowDeferredLocationUpdates(untilTraveled:timeout:)](
https://developer.apple.com/reference/corelocation/cllocationmanager/1620547-allowdeferredlocationupdates)

GPS精度の位置情報が必要だがすぐには必要ないという場合にこのメソッドを活用することで、バックグラウンドでの位置情報更新を遅延させてバッテリーの使用を最適化する。システムはこのメソッドで指定された距離、時間を条件として遅延を実施する。遅延している間の位置情報はGPSハードウェアにキャッシュする。

遅延された位置情報更新通知が実行されると、デリゲートの `locationManager(_:didFinishDeferredUpdatesWithError:)` が呼び出される。そしてキャッシュされた位置情報が ` locationManager(_:didUpdateLocations:)` に渡される。

## 実装例

**条件：** 100m 移動、10秒経過

```swift
manager.allowDeferredLocationUpdates(untilTraveled: 100, timeout: 10)
```

**条件：** 100m 移動、時間未指定
`CLTimeIntervalMax` で時間を未指定。

```swift
manager.allowDeferredLocationUpdates(untilTraveled: 100, timeout: CLTimeIntervalMax)
```

**条件：** 移動距離未指定、10秒経過
`CLLocationDistanceMax` で距離を未指定。

```swift
manager.allowDeferredLocationUpdates(untilTraveled: CLLocationDistanceMax, timeout: 10)
```

## 注意

一般的には `locationManager(_：didUpdateLocations :)` でこのメソッドを実行する。

GPSを利用可能であり、位置情報サービスの精度が `kCLLocationAccuracyBest` `kCLLocationAccuracyBestForNavigation` である場合にのみ有効。

`distanceFilter` プロパティには `kCLDistanceFilterNone` を指定しなければならない。

エラー時には [`CLError.Code`](https://developer.apple.com/reference/corelocation/clerror) が返却される。

このメソッドを連続して実行すると、以前の処理がキャンセルされ、デリゲートに `deferredCanceled` が返却される。

システムが停電力状態にしか動作しない。アプリがフォアグラウンドにある場合やデバッグ最中には遅延が実施されない。Xcodeに接続中は停電力状態にならないので注意。
Rubyのよく忘れる演算子一覧メモ

## 概要
Rubyで使われる演算子のうち、よく忘れるものの一覧メモ。
随時追加していきます。

## ===

| 状況 | 動作 |
| --- | --- |
| 左辺が単独のStringやIntegerオブジェクトの場合 | ==と同じ動作 |
| 左辺がClassオブジェクトの場合: | `右辺.is_a(左辺)` と同じ |
| 左辺がRegexオブジェクトの場合: | 右辺とマッチするかどうかを取れる |

引用元：[Rubyの===演算子についてまとめてみた](https://techracho.bpsinc.jp/hachi8833/2017_01_19/32941)

## !!
左に`!!`を付けると、`nil`の場合でも、`false`が返るようになる。

```rb
puts !!nil # false
puts !!false # false
puts !!true # true
puts !!'' # true
puts !!0 # true
puts !!1 # true
puts !!'sample' # true
```

## 参考
[Rubyの===演算子についてまとめてみた](https://techracho.bpsinc.jp/hachi8833/2017_01_19/32941)
[[Ruby]!!(bouble bang)エクスクラメーション2つのRuby演算子について](http://to-developer.com/blog/?p=1862)
http://ref.xaio.jp/ruby/classes/module/eqq
Node.jsのアップグレード

# 環境

    $ cat /etc/redhat-release
    CentOS Linux release 7.3.1611 (Core)


# 前提

+ Node.jsがインストールされている
+ gitがインストールされている


# アップグレード前の状態

    $ node -v
    v6.2.2
    $ npm -v
    3.9.5

# 手順
## nvmのインストール

gitからnvmをcloneする。

    $ git clone git://github.com/creationix/nvm.git ~/.nvm

.bash_profileに以下の記述を追記する。

    $ vi .bash_profile    

    # nvm
    if [[ -s $HOME/.nvm/nvm.sh ]] ; then source $HOME/.nvm/nvm.sh ; fi

ログインし直し、以下のコマンドを実行する。

    $ nvm --version

バージョンが表示されればOK。

# Node.jsのインストール

[nodejs.org](https://nodejs.org)で最新LTSを確認し、インストールする。（本記事執筆時点では、v6.10.2が最新のLTS）

    $ nvm install v6.10.2

バージョン確認。

    $ node -v
    v6.10.2

ただしこのままではターミナルからログアウト→再度ログインするとバージョンが戻ってしまう。

    $ node -v
    v6.2.2

.bash_profileを編集し、export PATHの前に以下を追記する。
(nvm関連記述より後に記述するように注意する）

    $ vi .bash_profile

    NODE_HOME=$HOME/.nvm/versions/node/v6.10.2/bin
    PATH=$NODE_HOME:$PATH

再度ログイン・ログアウトし、バージョンが新しくなっていればOK。

    $ node -v
    v6.10.2

npmも同時にアップグレードされている。

    $ npm -v
    3.10.10
HTMLのマークアップの方法について

##HTMLマークアップの目的
・ブラウザに適切に認識される（SEOとか？）
・理解しやすい（他のプログラマーさんや、見返したとき用）
・修正がしやすい。


いろんなサイトのマークアップを見ていると、違いがあったので、自分なりに違いを考察してみます。今回AサイトとBサイトを見比べていたのですが、

Aサイト
特徴：最低限のhtml要素 + 構造化タグにclass/idを振る。

```
<html>
  <body>
    <header>...</header>
      <section class="frame">...</section>
    <footer>...</footer>
  </body>
</html>
```

Bサイト
特徴：構造化タグ頻繁に使用 + デザイン用のdiv等のタグをつくり、そこにid/classを振る。

```
<html>
  <body>
    <header>...</header>
      <main>...</main>
    <footer>...</footer>
  </body>
</html>
```

という特徴があったので、自分も、理解しやすいように、、


・構造化タグ使用。=>header、main、aside、nav、article 、section、h1等。
・デザイン用に別途タグを作る => 必要なときは。

としていこうと思います。
デザイン用に別途タグを作る理由は、構造に比べデザインの方が寿命が短く頻繁に更新される可能性が高いので、別に分けると良いとされています。（ただ自分でもしっかり例を踏まえて説明できるほどわかっていない。）


わかりやすい内容は、こちらの記事に書いています。↓
http://qiita.com/yuku_t/items/726a67d8ae74eea2540a
PHP AWS

![20170414.png](https://qiita-image-store.s3.amazonaws.com/0/95187/82aba03b-c330-d48d-5213-eee1344574f2.png)


###**オンプレミス**
on-premise
企業などが情報システムを自社で保有し、自社の設備において運用することである。
premise→構内、店内、敷地、土地

###**Vagrant**
仮想環境構築ツール
もう１つ仮想のOS作る。
仮想マシーンをとても簡単シンプルに構築するソフトウェア。Linux、Windows、Mac上に仮想マシーンを簡単に構築できる。

英vagrant→気まぐれな

###**Docker**
仮想化のためのオープンソースソフトウェア。
Dockerを使うことで1つのホストOSの上で仮想的に複数のOSを軽快に簡単に動作させることが出来るようになる。

###**Amazon RDS**
Xamppの高級ver
Amazon Relational Database Service (Amazon RDS) を使用すると、クラウド内でリレーショナルデータベースを簡単に設定、運用、およびスケールできます。このサービスは、手間のかかるデータベースの管理タスクをお客様の代わりに行いながら、コスト効率がよく、サイズ変更が可能な容量を提供します。

###**Amazon VPC**
Amazon Virtual Private Cloud
セキュリティグループ。

[VPC](http://qiita.com/hiroshik1985/items/9de2dd02c9c2f6911f3b#%E5%89%8D%E5%9B%9E%E3%81%BE%E3%81%A7)

---

環境を意識
クラウドで動いてるのか
OSはなにか
サーバー何使ってるか
クラウドかオープレミス
PHPは環境に左右される
オープレミス

PC台数制限
ベーグラントvagrant
仮想マシーン
もう一つ仮想のOS作る
Docker
vagrantに近い

RDS　データベース
750時間
アクセス数が増えると
容量がいっぱいになる

EC2、サーバー
AWSの中にEC2のインスタンスを立てると
webサーバーとしてインスタンスが動いてくれる
webサーバーのインスタンスを立てるための仕組みがEC2
イラスティックビンズトーク→Heroku
サーバー
PHPが動くサーバーを自動で立ててくれる
EC2のインスタンスを立てるのを自動的にやってくれる
RDS　Xamppの高級version
容量がいっぱいとかアラートしてくれるのがRDS
vpcをつなげないとデータベースできない
EC2のインスタンス　＝　webサーバー
もう使えなくなったVista機にRasbberry Pi Pixel for PCを入れる


戻ってきたWindowsVista機にラズパイ用のOSを突っ込むという壮大でもないプロジェクト


# 準備編


## Download OS Image


ここから落とします。

https://www.raspberrypi.org/blog/pixel-pc-mac/

ページ中段にダウンロードリンクがあります。


## Download Etcher

次に、PixelのOSイメージをUSBメモリに書き込むためのソフトを用意します。

ここからEtcherをダウンロードします。
https://etcher.io/


## Etcherを使ってOSイメージを書き出す

使い方は簡単。
ダウンロードしたISOイメージと、フォーマットされてもいいUSBメモリを指定するだけ。

![image](https://qiita-image-store.s3.amazonaws.com/0/97156/d6180209-ab60-b0a0-f5e8-f32865cf6f88.png)



# 起動

刺して起動。


以上。




# HDDブートにしたい！

なんとこのPixel、インストールするなんていう機能がないため
自分でごにょごにょする必要があったのだ。


## 参考サイト

このサイトを参考に作業を進める
https://www.downtown.jp/~soukaku/archives/2016/1227_225704.html


### 起動後

ターミナルを起動し、

```shell-session
$ sudo bash
```
※以降の作業も、再起動したらbashに切り替えるのを忘れずに。

```shell-session
# dd if=/dev/sdb of=/dev/sda bs=1M
```

あとはUSBメモリを抜いて再起動。

このままではUSBメモリと同じ容量しか使えていないので、パーティションを分ける。

再起動後、

```shell-session
# fdisk /dev/sda/
Command: p  <- パーティションの一覧が出る
```

その後、

```shell-session
Command: n
Partition type: p
```

と打ち込んでいき、残りの容量を持ったパーティションを作成する。
(Defaultを指定するだけなので、エンター連打でOK)

もう一度再起動。


## 最後に

#### 文字コードを変更

```shell-session
# dpkg-reconfigure locales
```

ja_JP.UTF-8 UTF-8を選択

#### タイムゾーンを Asia/Tokyo" に変更
```shell-session
# dpkg-reconfigure tzdata 
```
GUIが出るので、Asia->Tokyoと選択する。

#### 不足している日本語関連パッケージをインストール

```shell-session
# apt install task-japanese-desktop 
```


以上！
プレーンテキスト書類をすばやく作る

## はじめに

新しい PC をセットアップするときに必ずやることなので、手順を備忘録として書いておきます。

Windows 7 以降です。それ以前だと [X] の代わりに [W] だったかな？

もし Mac の Finder で同じことができる方法をご存知の方は教えてください（切実）。Neu だと「すばやく」ないんです。

（...いや、今度作ろうかな）

## 手順

1. [EmEditor](https://jp.emeditor.com/) をインストールする。
1. EmEditor のメニュー「ツール」->メニューアイテム「設定の関連付け」を選択。ダイアログ「設定の関連付け」が開く。
1. ボタン「EmEditor と関連付け(E)...」をクリックする。UAC が起動する。
新たに開いたダイアログの関連付けファイル一覧には「テキストファイル」だけがあると思う。それを選択して削除する。
1. 追加ボタンをクリックしてテキストファイルを追加する。このときファイルの種類では「テキストファイル」ではなく「Text ファイル」と入力する。

これで、**エクスプローラー上で右クリック->[X]->[T]** でプレーンテキストファイルが作れます。

レジストリを編集する方法があると思うのですが、毎回忘れるし、操作ミスが少なそうなので EmEditor を使っています。
CakePHP3のバリデーションエラーに関する備忘録

こんな質問を見つけた。

【CakePHP3】バリデーションエラーのメッセージに入力内容を表示させる方法
https://teratail.com/questions/72187

なるほどなーと思ってCookbook探したらこんなところに書いてあった

データの検証
https://book.cakephp.org/3.0/ja/orm/validation.html#id7

`$value` なり `$context` なりで取得したデータを`return false`の代わりに
返してやればいいってことですね。
大変勉強になりました。
ES6でFizzBuzz

#ES6の標準的な書き方でFizzBuzz書くメモ

関数をくっつけるためのシンタックスシュガーが標準で欲しい

 - 変更(4/15)ykztsさんがspread構文で書いたらシンプルになることを教えてくれました

```js:fizzbuzz.js
const compose = ([f, ...fs]) => f? f(compose(fs)): (x) => x;
const num = () => (x) => x.toString();
const fizz = (f) => (x) =>  x % 3 == 0? 'Fizz': f(x);
const buzz = (f) => (x) =>  x % 5 == 0? 'Buzz': f(x);
const fizzbuzz = (f) => (x) => x % 3 == 0 && x % 5 == 0? 'FizzBuzz' : f(x);

const f = compose([fizzbuzz, buzz, fizz, num])

Array(100).fill().map((_, i) => f(i+1)).map(s => console.log(s));
```
Swift3 で Value of type 'string' has no member 'containsString'

# 最近急に猫舌になりました

[don't think twice it's alright](http://off.tokyo/blog/2017/04/13/swift3-value-of-type-string-has-no-member-containsstring/)

# エラー実装

```
return string.containsString(searchString)

```

# 解決

```
return string.contains(searchString)

```


# 参考

[Value of type 'string' has no member 'containsString'
](http://stackoverflow.com/questions/42804031/value-of-type-string-has-no-member-containsstring)
C++ Builder XE4, 10.2 Tokyo > TStringGrid > 編集可能にする > Options: goEditingをtrueにする

```txt:動作環境
C++ Builder XE4
RAD Studio 10.2 Tokyo Update 2 (追記: 2017/12/28)
```

TStringGrid において各セルを編集したい。
フォームデザインにて「Optionsプロパティ」にある「goEditing」をtrueにすればいいようだ。
RailsでDigest認証をする際にタイムアウト時間を変更する



[Railsでpublicフォルダ含む全てのページにBasic認証やDigest認証をかける](http://qiita.com/k-motoyan/items/6053cbc52c397e19cee2)を参考にして、以下のコードでダイジェスト認証を設定しました。

```ruby:digest認証
USERS = { ENV['USER'] => ENV['PASS'] }

before_action :digest_auth

def digest_auth
  authenticate_or_request_with_http_digest do |user|
    USERS[user]
  end
end

```

しかし、5分でタイムアウトしてしまうため、タイムアウト時間が短すぎるので、伸ばしたい。
該当する箇所の actionpack-5.0.2/lib/action_controller/metal/http_authentication.rb を見たところ、タイムアウト時間を変更する手段が設定されてなかった……。
その為、以下のファイルを用意して、対応しました。

```ruby:config/initializers/digest_auth_timeset.rb
require 'action_controller/metal/http_authentication' 
module ActionController
  module HttpAuthentication
    module Digest
      def validate_nonce(secret_key, request, value, seconds_to_timeout=30*60)
        return false if value.nil?
        t = ::Base64.decode64(value).split(":").first.to_i
        nonce(secret_key, t) == value && (t - Time.now.to_i).abs <= seconds_to_timeout
      end
    end
  end
end
```

変更する手段が用意されてないのは変わってない……。
一定間隔でアクセスするサンプル

※ 攻撃には用いないでください。

```bash:watchをいれる
$ brew install watch
```


```bash:アクセス
# 3秒間隔
$ watch -n 3 curl https://example.com/

# ベーシック認証ありのページにアクセス
# ユーザー: user
# パスワード: passwd

$ watch -n 3 curl -u user:passwd https://example.com/

# いろいろ捨てたいとき
$ watch -n 3 curl -u user:passwd https://example.com/ > /dev/null
```
Ansible ファイルを書き換える方法


サーバー構築作業を行う際、設定ファイルに何かを書く作業は欠かせない。
Ansibleは多数のモジュールを提供していて人によって設定ファイルの書き方は様々だ。
この記事は私なりのベストプラクティスであり、正解ではない。

## command系（shell含め）

command系は使い勝手がいいが、冪等性が保証されない。
これはAnsibleだけではなくChefとかも同じだ。
そもそも何が実行されるのか分からないので、Ansibleが冪等性を保証することはできない。
使用者が直接やるしかない。
ファイルが存在したらTaskを実行しないとかプロセスが立ち上がったらTaskを実行しないとかなど。

__command系のTaskはPlaybookを実行するたびに毎度実行される。__
__最初1回だけ実行したい場合は「args」のcreatesを追加する。__

```yaml
- name: create a file
  shell: echo "hello world!" > /tmp/hello
  args:
    creates: /tmp/hello
```

これは「/tmp/hello」というファイルが存在する場合は二度と実行されない。
しかし、変更事項があって適用したい場合は元のファイルを消す必要がある。
いろいろ面倒な手間がかかるので、次のcopyモジュールを使うことを推奨する。

## copy

copyモジュールは単純にファイルをコピーするときだけ使うものではない。
ファイルの生成に関わるほとんどの操作はcopyモジュールで実現できる。

```yaml
- name: create a file
  copy:
    dest: /tmp/hello
    content: hello world
```

__contentの内容に変更がない場合はchangedにならない。__
__contentの内容に変更がある場合はchangedになり、変更内容が反映される。__
command系よりシンプルで使い勝手がいい。

## replace

既に存在するファイルからマッチするところだけ変更したい場合は、replaceモジュールを使う。
lineinfileはregexpでマッチされる最初１回は問題がないが、再び実行するとマッチされないから新しくlineを追加してしまう。

```yaml
- name: modify a file
  lineinfile:
    dest: /tmp/hello
    regexp: '\sworld$'
    line: ' ansible'
```

これで試してみると「hello world」が「ansible」になっている。
そして再び実行すると「ansible」が２行になっている。
またlineinfileはマッチする部分だけではなくマッチされたらそのlineが新しいlineに変更されるので、注意を払う必要がある。
勘違いによる不具合が発生する可能性が高いのであまり推奨しない。
command系もそうだがどうしても使いたい場合はstatとregisterを組み合わせて、lineinfileのところでwhenでregisterの変数をチェックして修正が要らない場合はskipするようにする。

それに比べて__replaceはマッチされる部分だけ変更ができるし、マッチされなかったらchangedにならない。__

```yaml
- name: modify a file
  replace:
    dest: /tmp/hello
    regexp: '\sworld$'
    replace: ' ansible'
```

## blockinfile

マッチされるところの前後に何かを追加したい場合は、blockinfileを使う。
__追加する内容に変更がない場合はchangedにならない。__
再び実行しても最初実行したときと同じだ。

```yaml
- name: add a new line
  blockinfile:
    dest: /tmp/hello
    insertafter: '^hello world$'
    content: hello ansible
```

markerが自動で追加されてlineの前後についてしまう。
markerの内容は修正が可能だ。
（https://docs.ansible.com/ansible/blockinfile_module.html#examples）

```sh
cat /tmp/hello

hello world
# BEGIN ANSIBLE MANAGED BLOCK
hello ansible
# END ANSIBLE MANAGED BLOCK
```
C++ Builder XE4, 10.2 Tokyo > TStringGrid > csv文字列をセルに追加する実装

```txt:動作環境
C++ Builder XE4
RAD Studio 10.2 Tokyo Update 2 (追記: 2017/12/28)
```

csv文字列をTStringGridの最後の行に追加する実装。

```cpp
#include <memory>

// 中略

void __fastcall TFormUserList::addLine(String csvline, TStringGrid *dstPtr)
{
	if (dstPtr == NULL) {
		return; // error
	}

	std::unique_ptr<TStringList> line (new TStringList);

	line->StrictDelimiter = true;
	line->Delimiter = L',';
	line->DelimitedText = csvline;

	int last = dstPtr->RowCount;
	dstPtr->RowCount = last + 1;

	for(int idx=0; idx < line->Count; idx++) {
		dstPtr->Cells[idx][last - 1] = line->Strings[idx];
	}
	dstPtr->Refresh();
}
```

### 使用例
(追記 2018/10/17)

以下のような使い方ができる。

```cpp
addLine(L"PI,3.141592", StringGrid1);
addLine(L"Napier,2.7182", StringGrid1);
addLine(L"Avogadro,6.0221023", StringGrid1);
```
Elastic Beanstalk 環境名とCNAMEの命名の仕方と罠

*デフォルトで環境名とCNAMEは同じになる*が、それってどうなのかという話です。
僕が`babaa.com`というババアの情報サイトの運営主だったとして話を進めていきます。

## 環境名とCNAMEの命名の結論(読むのだるい人向け)
環境名には意味のない番号を振り、CNAMEは役割に応じた命名をする。

    本番環境:
      環境名: babaa-env01
      CNAME: babaa-production-env
    ステージング(テスト)環境:
      環境名: babaa-env02
      CNAME: babaa-staging-env

理由等はこの後から説明します〜

![20170304111052.png](https://qiita-image-store.s3.amazonaws.com/0/29792/68396d4d-e9ab-5c87-760c-9791a40533e5.png)


## 運用の前提
- 本番用のCNAMEとドメインが結びついている
- 環境は本番環境とステージング環境のみ
- 普段はステージング環境を終了しておく
- デプロイ時に`eb clone`でステージング環境を作成し、`eb deploy`で更新し`eb swap`で本番環境と入れ替える

## Elastic Beanstalkで環境名とCNAMEを同じにしない理由
`eb swap`ではCNAMEのみ入れ替えるので`eb swap`し続けた時にわけわからなくなるから  
例えば、次のような環境があったとする

    本番環境:
      環境名: babaa-env01
      CNAME: babaa-env01
    ステージング環境:
      環境名: babaa-env02
      CNAME: babaa-env02

その状態で`eb swap`すると

    ステージング環境:
      環境名: babaa-env01
      CNAME: babaa-env02
    本番環境:
      環境名: babaa-env02
      CNAME: babaa-env01

稼働中の本番環境のCNAMEはbabaa-env01だが、扱ってる本番環境の名前はbabaa-env02となる。  
シチュエーションによってはさらに多くの環境を立てるので、運用が続き`eb swap`し続けると以下の様なわけのわからない状態になる。

    ステージング環境:
      環境名: babaa-env02
      CNAME: babaa-env04
    本番環境:
      環境名: babaa-env03
      CNAME: babaa-env01

しかし、もしもCNAMEをちゃんと設定していれば次のような状態になる

    ステージング環境:
      環境名: babaa-env02
      CNAME: babaa-staging-env
    本番環境:
      環境名: babaa-env03
      CNAME: babaa-production-env

こうなってしまえば環境名に惑わされないのでハッピー！
C++ Builder / TStringGrid > 固定列上でマウスクリックした場合に{Row, Col}を取得する

```txt:動作環境
C++ Builder XE4
```

参考 http://www.delphigroups.info/2/18/296188.html

MouseToCell()を使うようだ。

ためしに、クリックしたところが固定列かどうかチェックする関数を実装してみた。

```cpp
bool __fastcall TFormUserList::isFixedColMouseUp(int X, int Y, TStringGrid *srcPtr)
{
	if (srcPtr == NULL) {
		return false;
	}
	int Row, Col;
	srcPtr->MouseToCell(X, Y, Col, Row);

	if (Col < 0 || Row < 0) {
		return false;
	}

	if (Col < srcPtr->FixedCols) {
		return true;
	}
	return false;
}
```

TStringGridのOptionsプロパティに「goFixedColClick」という項目があり、Falseとしていた。ここをTrueにすれば、通常のクリックイベントでも処理できるかもしれない。
DeviseにBootstrap3のスタイルを適用させるgem「devise-bootstrap-views」

# 概要

* railsにユーザー認証機能をつけるgemであるdeviseにbootstrapのデザインを適用させる

こんな感じのフォーム画面が...
<img width="554" alt="スクリーンショット 2017-04-13 12.49.48.png" src="https://qiita-image-store.s3.amazonaws.com/0/174052/a8c0826e-26fe-1ac8-d262-b66136f7f4ea.png">

こんな感じになります
<img width="1097" alt="スクリーンショット 2017-04-13 13.00.58.png" src="https://qiita-image-store.s3.amazonaws.com/0/174052/3256162a-9e8c-9be5-ef83-ab562f308a2f.png">


## 環境

* Rails 5.0.2

* ruby ruby 2.2.6p396 (2016-11-15 revision 56800) [x86_64-darwin15]


## インストール

gemが公開されているGitHubのURL
<https://github.com/hisea/devise-bootstrap-views>

Gemfileにgemを追加

```ruby:Gemfile
# Deviseはすでに導入されているとします。
gem 'devise-bootstrap-views'
```

インストールします

```
$ bundle install --path vendor/bundle
```


## deviseにbootstrapのスタイルを適用
 
以下の文言を追加

```:application.css
# SASS
*= require devise_bootstrap_views

# LESS
*= require devise_bootstrap_views_less
```

boostrapに対応したフォームのテンプレートを作成

```
$ rails g devise:views:bootstrap_templates
```

サーバーを再起動して確認。
これで簡単にBootstrap3に対応したフォームを作ることができました。
Push通知用のP12ファイルの取得

#全体の流れ
1. プッシュ用証明書の取得
2. キーチェーンに登録
3. P12ファイルのエクスポート

#プッシュ用証明書の取得
AppleDeveloperConsoleにログインし、対象の証明書をダウンロードする

#キーチェーンに登録
ダウンロードした証明書をダブルクリック
キーチェーンアクセスを起動し、追加されていることを確認する

#P12ファイルのエクスポート
キーチェーンアクセスを起動
対象証明書を右クリック
「xxxxxxxxを書き出す」を選択
保存場所を選択し、パスワードを設定し、保存
gifを表示する - amp-imgとamp-animのサンプルコードと違い

AMP Htmlでのgifアニメーションの**書き方**と`amp-img`と`amp-anim`の**違い**について書きます。  
AMP Htmlでgifアニメーションを表示する方法を調べてみると、`amp-anim`を使ってgifアニメーションを表示する方法が出て来ます。
しかし``amp-img``でもgifアニメーションを表示することはできます。だとすると`amp-anim`はなんのためにあるのか、`amp-img`との違いは何か。という話です。

## gifアニメーション表示サンプルコード(`amp-img`と`amp-anim`両方)
実際に書いてみると`amp-anim`でも`amp-img`でも同じようにgifアニメーションが表示されるのがわかります。

![20170325190637.gif](https://qiita-image-store.s3.amazonaws.com/0/29792/a25cd25b-7290-5169-f7ad-08fd822ae33d.gif)

    <!doctype html>
    <html ⚡>
    <head>
      <meta charset="utf-8">
      <script async src="https://cdn.ampproject.org/v0.js"></script>
      <script async custom-element="amp-anim" src="https://cdn.ampproject.org/v0/amp-anim-0.1.js"></script>
      <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
      <link rel="canonical" href="https://ampbyexample.com/components/amp-anim/">
      <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
    </head>
    <body>

      <h2>amp-animで表示するgifアニメーション</h2>
      <amp-anim width="245" height="300" src="/img/gopher.gif">
      </amp-anim>

      <h2>amp-imgで表示するgifアニメーション</h2>
      <amp-img width="245" height="300" src="/img/gopher.gif">
      </amp-img>
    </body>
    </html>
※ **[AMPのPlayground](https://ampbyexample.com/playground/)を開いてコードを貼り付けると、実際に動いてる様子が確認できます。**


## `amp-img`と`amp-anim`の違い
- `amp-anim`はプレイスホルダー(gifが表示されるまでの間に表示する画像)を設定できる
- `amp-anim`はCPUの使用率を節約できる

> Thus, the difference currently is really performance thing. If we could pause animation for GIF, we'd do that. But for now, `amp-anim` allows us to reduce CPU usage and GPU vetoing when it's off screen.
>> 参考: https://github.com/ampproject/amphtml/pull/8116#issuecomment-287202023

## 結論
私はプレースホルダーを設定する予定がないのでわざわざ`amp-anim`を使うことはないと思い`amp-img`を採用しました。  
`amp-img`と`amp-anim`がいずれ統合されるような気もしますし！
mysql 5.6でインストール直後にrootのパスワード変更が出来ない場合の対処法

Amazon linuxで、mysqlをyumからインストールした際に、ルートのパスワード変更が出来なくて困ったのでそれの対処法です。

以下のコマンドでmysqlインストールを実行した際に、

```
sudo yum install mysql56-server mysql56-devel mysql56
```

以下のメッセージが表示がされていましたが、インストールはうまくいってそうな感じだったのでそのまま突進しました。
```
Failed to set locale, defaulting to C
```

そして、```service mysqld start```で立ち上げたら、初期設定に関するメッセージが出てきて、まずはパスワードを設定せよと記載があったので以下のコマンドを実行しました。
```
/usr/libexec/mysql56/mysqladmin -u root password 'new-password'
```

そしたら以下のエラーメッセージが発生してパスワード変更もできず。。。

```
/usr/libexec/mysql56/mysqladmin: unable to change password; error: 'Can't find any matching row in the user table'
```


やったこと
1./etc/environmentに以下を追加

```
LANG=en_US.utf-8
LC_ALL=en_US.utf-8
```

2.source /etc/environmentを実行


3.いったんmysqlをアンインストール

```
sudo yum remove mysql56-server mysql56-devel mysql56
# rm -rf /var/lib/mysql #データが入っているフォルダも削除
```

4.再度インストール

```
sudo yum install mysql56-server mysql56-devel mysql56
```

以上です。

追記：



### 以下、参考にしたサイト
http://qiita.com/Kaisyou/items/9c2c5f5e1b28c24e91b7
http://qiita.com/rojiuratech/items/80dda65d832b407322f1
http://kajuhome.com/patio_thread/1009.shtml
swiftlint 0.18.1 までの rule まとめ

#swiftlint
https://github.com/realm/SwiftLint

#バージョン
0.18.1
2017/04/13時点での最新

Swift3.1にも対応しているみたいです。

#参考
http://qiita.com/KAGE_MIKU/items/80e6d905dc0059c342b3

#本題
上記の記事の後に追加されたルールが何個かあって、調べたので書き残しておきます。
※順番に関しては、上記の記事の後に追加されたルールをabc順に並べてます。

##explicit_type_interface
クラス変数とかインスタンス変数とかには"型"を記述しろ的なことだと思います。

```swift:だめな例
var myVar = 0
let mylet = 0
static var myStaticVar = 0
class var myClassVar = 0
```

```swift:いい例
var myVar: Int? = 0
let myVar: Int? = 0
static var myVar: Int? = 0
class var myVar: Int? = 0
```

##fatal_error_message
fatalErrorを使う場合はメッセージをちゃんと書きなさいということですね

```swift:だめな例
fatalError(\"\")
fatalError()
```

```swift:いい例
fatalError(\"Foo\")
fatalError(x)
```

##implicitly_unwrapped_optional
暗黙的なUnwrapはだめだよ的な感じ。
主に変数とかを宣言するときに!を使って宣言しないで、？を使うか、初期値をいれろってことですね。
ただ、例外的にIBOutletはOKみたいです。

これが原因で落ちることがちょいちょいあるのでいい！

```swift:だめな例
let label: UILabel!
let IBOutlet: UILabel!
let labels: [UILabel!]
var ints: [Int!] = [42, nil, 42]
let label: IBOutlet!
let int: Int! = 42
let int: Int! = nil
var int: Int! = 42
let int: ImplicitlyUnwrappedOptional<Int>
let collection: AnyCollection<Int!>
func foo(int: Int!) {}
```

```swift:いい例
@IBOutlet private var label: UILabel!
@IBOutlet var label: UILabel!
@IBOutlet var label: [UILabel!]
if !boolean {}
let int: Int? = 42
let int: Int? = nil
```

#ルールの見方
https://github.com/realm/SwiftLint/tree/master/Source/SwiftLintFramework/Rules
上記にアクセスすると全ルールが見れます。
各ファイルの`triggeringExamples`が悪い例で'nonTriggeringExamples'がいい例です。
よくわからない場合はその上に書いてある'description'を読んだら良いと思います。

#最後に
漏れとかあったら教えていただければ追加しておきます。
AWS SNS から iOSアプリに Push通知する

AWSのSNS を利用して、iOS アプリにPush通知をしたときのメモ。

#全体の流れ
1. 必要なもの
2. AWSSNSの設定
3. Push通知実行

#必要なもの
プッシュ通知用のP12ファイル

#AWSSNSの設定
##iOSアプリケーションの追加
AWS SNSにアクセスする。

「Create Platform application」からアプリケーションを追加する。
「Application name」を設定する。
「Push notification platform」に「Apple development」を選択する。
「Choose P12 file」に「プッシュ通知用のP12ファイル」を指定する。
「Enter password」に「プッシュ通知用のP12ファイル」をエクスポートする際に指定したパスワードを入力するする。（「Certificate」と「Private key」が設定される。）

##エンドポイントを追加する
「Application」から対象のアプリをチェックする。
「Create platform endpoint」を選択。
「Device token」にPush通知を受信するiOS端末のデバイストークンを設定する。

#Push通知実行
「Application」から対象アプリのARNを選択。
送信対象のToken をチェックし、「Publish to endpoint」をクリック。
「Message format」をJSONを選択。
「Message」に下記を入力。

```
{
    "default": "プッシュ通知", 
    "APNS": "{\"aps\":{\"alert\": \"プッシュ通知\",\"sound\":\"default\",\"badge\":1} }", 
    "APNS_SANDBOX":"{\"aps\":{\"alert\":\"プッシュ通知\",\"sound\":\"default\",\"badge\":1}}"
}
```

「Publish Message」をクリックし、送信する。
drone.io（OSS版）で並列テストを実行してビルド時間を削減する


プロダクトが成長してテストコードの規模が大きくなってくるとテスト実行時間も延びてきます。成長は嬉しいけど、ビルド時間が延びるのは嬉しくないです。そこでテストを並列で実行できるようにdrone.ioを設定してみます。

なお、CircleCI2.0での並列テストの方法は同僚が試してくれました。以下の記事を参考にしてください。

- [CircleCI 2.0 で並列テストするサンプル（Rails）](http://qiita.com/mochizukikotaro/items/b887288100bc759ea6cd)

## マトリックスビルド

drone.ioにはマトリックスビルドという機能があります。これを使うことで複数のworker（Dockerコンテナ）を並列で実行させられます。設定は簡単です。

### .drone.yml

```yml

pipeline:
  build:
    image: hoge/piyo
  commands:
    - RAILS_ENV=test bundle exec rspec ${TESTFOLDER}

matrix:
  TESTFOLDER:
    - spec/models
    - spec/requests
```

これだけで2つのworkerが立ち上がり、それぞれで `spec/models` と `spec/requests` のテストを実行してくれます。やったね🎉 でも実際これは上手くいきません。なぜなら最も実行時間のかかるリクエストテストが1つのworkerに集中してしまっているからです。片方はすぐ終わるのに、結局全体の実行時間はあまり改善されません（CircleCIなら勝手にランダムにしてくれるんだけどな…）。

### テストコードファイルを分散する

というわけで、テストコードのファイルを分散するようにします。雑に書いたスクリプト例です。

```ruby
require 'fileutils'
require 'pathname'

class RandomDistSpec

  def initialize
    FileUtils.rm_rf("matrix_specs")
    @worker_num = 4
  end

  def copy_ruby_spec
    specs = Dir.glob("spec/**/*_spec.rb").shuffle
    copy specs
  end

  private
  def copy specs
    slice_num = (specs.size / @worker_num).ceil

    1.upto(@worker_num) do |i|
      FileUtils.mkdir_p("matrix_specs/#{i}") unless FileTest.exist?("matrix_specs/#{i}")

      files = specs.slice!(0, slice_num)
      files.each do |file|
        dir = Pathname(file).dirname.to_s
        FileUtils.mkdir_p "matrix_specs/#{i}/#{dir}"
        FileUtils.cp file, "matrix_specs/#{i}/#{file}"
      end
    end
  end
end

spec = RandomDistSpec.new
spec.copy_ruby_spec
```

こうすることで、 `/matrix_specs/n` ディレクトリにランダムにファイルが配置されます。合わせて `.drone.yml` も修正します。

```
matrix:
  TESTFOLDER:
    - matrix_specs/1
    - matrix_specs/2
```

これでテスト実行時間が無事削減できました。

CIは非常に便利ですが、CIでのビルド時間が長いと改善サイクルが上手く回せません。待ち時間が発生し、集中力を取り戻すのにコストがかかります。なのでCIは積極的に改善をしていくべきところだなぁと思いました。
【git】リポジトリにコードを初めて上げる、もしくはリポジトリから初めてコードをとってくる

開発を行う際には、GitHubやBitbucketなどを使用してでソースコードを共有することが多いと思います。
最初の一歩として次の2パターンがあると思います。

- 自分が最初のコードを書いてリモート(GitHubやBitbucket)に上げて、メンバーはそのソースコードを取得する
- ほかの誰かが書いてアップしてくれたソースコードをリモートからとってくる

それぞれの手順についてまとめます。


#自分でコードを書いて初めてリモートに上げる

###前提
- ローカル環境でgitコマンドを使用できること

###手順

####1. リモート(githubやbitbucketなど)にリポジトリを作成する
Webから作ることができます。

####2. コードを作成し、コミットする
自分のローカルでの作業になります。
最初にアップするコードを作成し、コミットします。
詳しくは[こちら](https://qiita.com/chihiro/items/09282c06850598000d0c)です 

####3. リモートリポジトリをgitに登録する

```bash
$ git remote add <repo_name> <url>
```
1の手順で作成したリモートリポジトリを登録します。
`<url>` は1の手順で作成したリモートリポジトリのurlです。
`<repo_name>` はなんでもOKです。複数のリモートリポジトリを紐づけることが可能なため、名前をつけることができます。筆者の経験上、 `origin` とつける人が多いです。


####4. 作成したコードをpushする

```bash
$ git push <repo_name> <local_branch>:<repo_branch>
```
リモートリポジトリにコードをpushします。
3の手順で登録したリモートリポジトリの名前は `origin` 、ローカルでは `master`ブランチで作業しているとします。
その場合は以下のようなコマンドになります。

```bash
$ git push origin master:master
```
ここまで実行することで、1の手順で作成したリポジトリをWebからみると、自分で書いたコードを確認できるはずです。


#ほかの誰かが書いてくれたコードを初めてリモートからとってくる

###前提
- ローカル環境でgitコマンドを使用できること
- リモート(githubやbitbucketなど)にリポジトリ(コードも)が存在していること

###手順

####1. リモートリポジトリをcloneする
コードを格納したい場所で以下のコマンドを実行します。

```
$ git clone <url>
```
`<url>` はリモートリポジトリのurlです。
これでローカルにリモートリポジトリと同じものが生成されているはずです。
Python > id() / global を試してみた > id()が返すID / 代入先の辞書 {ローカル辞書 / グローバル辞書} | locals(), globals()

@ Introducing Python: Modern Computing in Simple Packages by Bill Lubanovic
(No. 2852 / 12833)

`id()`と`global`の例がある。

参考: [id(object)](https://docs.python.jp/3/library/functions.html#id)
参考: [global](http://www.ops.dti.ne.jp/ironpython.beginner/global.html)

試してみた。

http://ideone.com/7ZBN92

```py
animal = 'dog'

def my_func_local():
	animal = 'cat'
	print(id(animal))

def my_func_global():
	global animal
	animal = 'wyvern'
	print(id(animal))
	
print(id(animal))
my_func_local()
print(animal)
my_func_global()
print(animal)
```

```txt:run
47889501431096
47889502846848
dog
47889501431208
wyvern
```

dogとwyvernは同じidかと思うと違った。
stringsがimmutableであること関係あるのか未消化。

### 教えていただいた事項

@yubaさんの[コメント](http://qiita.com/7of9/items/c93925f315cfc5e45788/#comment-a6c7a963d73bebdfc4e5)にて`id()`が返すIDについて教えていただきました。

情報感謝です。

@shiracamus さんの[コメント](http://qiita.com/7of9/items/c93925f315cfc5e45788/#comment-f447c96608cfdb89173a)にて、代入先の辞書（ローカル辞書、グローバル辞書）について教えていただきました。

情報感謝です。
CarrierWave 複数の画像をコード三行で一つのカラムに保存する

RailsのCarrierWaveというgemを使って`@article.images`で複数画像を呼び出せるようにする方法です。
「CarrierWave 複数画像」調べると画像の情報を保持するためのImagesテーブルを作って、`has_many :images`とする方法が出てくる。  
しかし、CarrierWaveバージョン1.0.0から複数画像は公式でサポートされていて、上記の方法よりかなり簡潔に実装することが可能になっているのでそれを紹介します。

<img width="512" alt="20170323192211.png" src="https://qiita-image-store.s3.amazonaws.com/0/29792/ddb232d7-ee83-3c6b-44e7-6c67a6776282.png">

## CarrierWaveで一つのオブジェクト(レコード)に複数の画像を保存する

複数の画像をアップロードする方法だけにフォーカスするためにCarrierWave自体のセットアップ方法についてはここでは触れません。
そもそもCarrierWave使っていないよ。という方には「[Rails 超お手軽な画像アップローダー CarrierWave の使い方](http://www.workabroad.jp/tech/1118)」がわかりやすくておすすめです。

古いバージョンのCarrierWaveを使っている場合は`gem 'carrierwave', '~> 1.0.0'`でバージョンを*1.0.0以上*にしておいてください。  
### 実装 
Articlesテーブルにimagesカラムを作ってそこに複数の画像を保存するという例でサンプルコードを記述します。

#### Articlesテーブルにimagesカラムを追加

    $ rails g migration add_images_to_articles images:json
    $ rake db:migrate

#### ImageUploaderを`images`カラムにマウント
```app/models/article.rb
class Article < ActiveRecord::Base
  mount_uploaders :images, ImageUploader
  # Rails5.0未満を使ってる場合は以下のコードも必要
  # serialize :images, JSON
end
```

#### 画像アップロード用のフォームを作成

```app/views/articles/show.html.erb
<%= form.file_field :images, multiple: true %>
```

#### strong parameters に`images`追加
```app/controllers/articles_controller.rb
params.require(:article).permit(:title, :body, {images: []})
```

以上です。  
うまくいかない、カスタマイズが必要といった人は[公式README.mdのMultiple file uploads](https://github.com/carrierwaveuploader/carrierwave#multiple-file-uploads)の項と[画像の追加と削除の仕方](https://github.com/carrierwaveuploader/carrierwave/wiki/How-to:-Add-more-files-and-remove-single-file-when-using-default-multiple-file-uploads-feature)に目を通すと幸せになれると思います！
Python > decoratorを試してみた

@ Introducing Python: Modern Computing in Simple Packages by Bill Lubanovic
(No. 2777 / 12833)

decoratorという機能があるようだ。

試してみた。

http://ideone.com/6rPiXX

```py
def decorate_it(func):
	def new_function(*args, **kwargs):
		print('***MAY I HAVE YOUR ATTENTION, PLEASE***')
		print('This is 7of9, Tertiary Adjunct of Unimatrix Zero One.')
		print('I have something to tell you, today')
		result = func(*args, **kwargs)
		print('Thank you for your attention')
		print('Have a good day')
		print('By the way, your aunt has often told me that ...')
		return result
	return new_function
	
def say_hello(word):
	print(word)

@decorate_it
def say_decorated(word):
	print(word)
	
say_hello('Nice to meet you')
say_decorated('Nice seeing you')
```

```txt:run
Success	time: 0.01 memory: 28384 signal:0
Nice to meet you
***MAY I HAVE YOUR ATTENTION, PLEASE***
This is 7of9, Tertiary Adjunct of Unimatrix Zero One.
I have something to tell you, today
Nice seeing you
Thank you for your attention
Have a good day
By the way, your aunt has often told me that ...
```