OmniAICreator/Qiita-1.07M huggingface dataset:
オブジェクト指向と24年くらい戦ってわかったこととか

#この記事の内容とか
- [オブジェクト指向と10年戦ってわかったこと](http://qiita.com/tutinoco/items/6952b01e5fc38914ec4e)
- [オブジェクト指向と20年戦ってわかったこと](http://qiita.com/shibukawa/items/2698b980933367ad93b4)

というのを読んで、オブジェクト指向ならちょっとだけ長いので私も書いてみようと。
**文長い**よ、という人は**強調**の部分だけ読めば、だいたい**意味が通じる**はずです。
That's M's format!

#オブジェクト指向って誤解招くよねとか

オブジェクト指向って言葉自体が誤解招く言葉だと思いませんか。
たぶん**皆様が戦われている**のはオブジェクト指向ではなくて**オブジェクト指向言語**です。
たとえば私がオブジェクト指向に初めて触れたのは「オブジェクト指向方法論ＯＭＴ」という本でした。
以下、記憶違いだったらごめんなさい。
この本はオブジェクト指向言語を方法論として逆輸入した内容で、この中で記載されていた三原則が
- カプセル化
- 多様性、多態性（ポリモーフィズム）
- 継承
の３つで、この頃のオブジェクト指向ってのは３原則だったのねーって感慨が。

言語より先に方法論を学ぶという謎の学習順だったため、オブジェクト指向と言われると先に方法論が浮かんでしまうというレアな存在。
そのせいで、オブジェクト指向言語だけをターゲットとした話なのにオブジェクト指向と言われると、もやっとしてしまうお年頃です。
ちなみに私のオブジェクト指向言語初体験はその直後にやったTurboC++だったりします。

#オブジェクト指向言語の原則とか

この３つの**原則を説明するわけではありません**。
そもそもこのポエム開いた人が知らないわけないでしょうし。
そんな原則に**なんのメリット**があるの？
なんでそんなものを原則と言ってるの？
という点を説明したいと思います。
##何のための３原則なのかとか
この原則って、つまりところ**構造化言語**の**問題**に対する**解決策**なのですよ。
と、どこかの原理主義者から大量にマサカリが飛んできそうな発言をしてしまいましたけど、論理的な話や経緯はともかく、高級言語→構造化言語→オブジェクト指向言語と流れた現場の人間にとっては真実です。


CとかPASCALとかって構造化言語は非常に便利な反面、問題も多いものでした。
たとえばライブラリロードしたら、そこで使用されている関数名と**同じ関数名は定義できません**。
そのため、**関数名**はひたすら**長くなって**いきます。
たとえばWin32APIのGetPrivateProfileSectionNamesなんて関数名、正気を疑いますよね。
しかも**パラメータは全て引数で渡す**必要があるため、**引数の数も多く**なります。
たとえばWin32APIのCreateWindowEx、引数が12個もあるんですよ。おまけにExがついていない、引数が11個のCreateWindowと別にあるという。
CUIが主体の頃は、それでもなんとかなっていたのですが、これがGUIになった瞬間、崩壊。
**9割同じ**でも、ちょこっと違う処理でも**別の関数、別の名前**。
引数がchar*でなくてintだと別の関数、別の名前。
便利なライブラリがあると飛びついてみれば、関数名がバッティングして使えない。てめこのやろ変な名前でdefine切ってるんじゃねーよ！的な何か。
**リファレンス引いたりヘッダで引数調べる時間のほうがコード書く時間より長い**とか、やってられませんよね！

そこで颯爽と登場したのが**オブジェクト指向言語**。
構造化言語でみんなが**困っていたこと**が「原則」で全て**解決**したのです。

##実際に解決した内容とか
・**カプセル化**
　クラスが異なれば**同じ関数名つけても問題ない**ので、関数名を長くする必要がありません！
・**多様性、多態性（ポリモーフィズム）**
　**引数の型**が違っても**同じ関数名つけられる**ので、関数名が短くなり、**覚えなければならない関数**の数も**激減**しました。
・**継承**
　ちょこっと違う、**似たような処理**なら継承で**どうにかできる**ようになりました。特にボタンなどのGUIパーツが楽になること楽になること。

こんな楽になるなんて、と当時構造化言語でひいこらGUI書いてた人は随喜の涙を流したという。

#最後にぶっちゃけるとか
**再生産性とか飾り**なんです。一応基底クラスからの継承というのは再生産性なのですけど、自分でコードを書くときに再生産性意識したりはしないんです。それでも便利なんです。みんなハッピーなんです。
もちろん、全てが良かったなんてことはなくて、その後に潜在的メモリリーク・リソースリーク問題とか新たな問題が沸いたりするのですけど、それはまた別のお話。
remark.jsで作ったスライドをPDF化

作成した資料をPDFで置いておきたいと思って簡単に探しても日本語記事がなかったので記録しておきます。


remarkのレポジトリの[issue](https://github.com/gnab/remark/issues/50#issuecomment-25602044)によると、Chromeのエクスポート機能を利用すればよいとのこと。

ということで[この辺](https://wayohoo.com/google-chrome/beginners/how-to-make-a-web-page-pdf-on-google-chrome.html)を参考にしてPDF化すればOKでした。
compassのsprite化でのエラー

# エラー文
```No files were found in the load path matching```

## 事前に確認
sprite化できるのはpngだけ。jpgになっていないか確認

## 対処1
sassのバージョンを変更する。

自分がいつも使っているバージョン → 3.4.19

エラーの出るバージョンを使っている場合、一旦アンインストールしてから再インストール
```gem uninstall sass```
```gem install sass -v3.4.19```
設定系のKVSなのでActiveRecordパターンなORMでいいんじゃね って思った。


# 概要
社内で書いた日報の転記です。
正直、読みにくいポエムだとは思いますし、ブログに書けよｗｗｗって感じもするのですが、ブログとかやってないので、ここにメモっとく感じで置いときます。

# 以下、転記。

表題の通りであり、そのままなのだが。「設定系のKVSなのでActiveRecordなORMでいいんじゃね」って思った。
設定は、以下の様に、Key-Value のペアで表現される。

* Primary Keyが単純な1カラムだけだろうが、複合主キーになっていようが、それはKeyであることに変わりはない。
* 設定内容は、Valueである。
* それに追加で、create_at とか update_at があるかないか、という些細なフレーバーがあるかもしれない。

設定を保存しておく[リポジトリ](http://qiita.com/koutalou/items/07a4f9cf51a2d13e4cdc#repository)なんて、この程度だ

で、KVS[リポジトリ](http://qiita.com/koutalou/items/07a4f9cf51a2d13e4cdc#repository)なら、ActiveRecordパターンでいい。

## 各PHPのフレームワークでのActiveRecordパターン（的なもの）の実装
ところで、ActiveRecordパターンは「"Modelの作成"を如何にして実装するか」というそもそもの問題がある。
大抵の場合、フレームワークレベルで対応している。

* [Larave  （Eloquent ORM）](https://laravel.com/docs/5.2/eloquent)
* [CakePHP  （フレームワークのプラグイン）](http://bakery.cakephp.org/2012/06/29/Active-Record-pattern-for-CakePHP.html)
* [FuelPHP  （ただのORMだけど）](http://fuelphp.jp/docs/1.4/packages/orm/crud.html)

## ActiveRecordパターンってなんぞ
これについては、「ActiveRecordパターンの要件」を以下のようにすげ替えて、問題を解消した。
個人的には、以下の要件を満たしていれば、ActiveRecordだと思うことにした。

* MVCのModel （Clean Architecture なら、[ドメインレイヤのRepository](http://qiita.com/koutalou/items/07a4f9cf51a2d13e4cdc#domain-layer)） として使えるだけの実装がある
* saveメソッドをインターフェースとして持っている。
* 1インスタンスがリポジトリの1レコード（DBならテーブルの1行、Redisなら1KV）に相当する

上記の3つの使用は、[クラスの3つの役割](http://d.hatena.ne.jp/nishiohirokazu/20101008/1286540000) について言及した形となっている。
実用する場合は、どうせオブジェクト指向にするので、"ActiveRecord抽象クラスを継承する" or "ActiveRecordインターフェースを実装する"になるだろう。（メッセージ指向、クラス指向の両方の意味で、"オブジェクト指向"と言っている。）
なので、実装する上での指針を示す形で、要件を定義した。

### この要件にすげ替えた言い訳
多分だけど、[WikipediaのActiveRecord](https://ja.wikipedia.org/wiki/Active_Record)を見ている限りだと、これで「ActiveRecordパターン」って言い張っても大丈夫なのかなぁと思ったりした。
embedded.mobileprovision: UDID一覧


- テスト用IPAパッケージからUDIDを抜く

~~~bash
#!/bin/bash

CODE="
from plistlib import readPlist;
from sys import stdin;
print '\n'.join(readPlist(stdin)['ProvisionedDevices']);"

IPA=$1
GREP_OPTIONS=
exml=$(unzip -Z1 $IPA | grep mobileprovision)
unzip -p $IPA ${exml[0]} | security cms -D | python -c "$CODE"
~~~
visibilityのcapybaraテスト

# 目的
普段は`visibility: hidden;`になり表示されないけど何かのボタンを押した瞬間表示される
よね？というテストを書きたい。

## 結論
have_selectorにvisibleオプションをつけてテストすればOK

# アプローチ
## 失敗
`expect(page).to have_no_css(識別子名)`では意味がない。
隠れているだけで要素そのものはブラウザに読み込まれているから。

## こうした
```rb
expect(page).to have_selector(識別子名, visible: false)

$(なんかのボタン).click

expect(page).to have_selector(識別子名, visible: true)
```

これで動く
deviseでカラムを追加した時

カスタマイズ用のビューファイルを生成する

```bash
$ rails g devise:views
```

`-v 生成するビュー`コマンドで生成するビューファイルを指定することができる。

今回は新規登録用のビューファイル`registations`とログイン用のビューファイル`session`を指定する。

```bash
$ rails g devise:views -v registrations sessions
```

フォームを追加する。今回は名前を追加する。

```erb:registrations/new.html.erb
<%= form_for...do |f| %>

<%= f.text_field :name %>

<% end %>
```

nameの入力フォームはできたが、deviseはデフォルトではemailとpasswordの値しか保存できないようになっている。nameの値を保存したい場合は、applicationコントローラで下図のメソッドを作成し、before_actionで呼び出す必要がある。
これはストロングパラメータのようなもの。

```Ruby:application_controller.rb
class ApplicationController < ActionController::Base

before_action :configure_permitted_parameters, if: :devise_controller?

private
def configure_permitted_parameters
 devise_parameter_sanitizer.for(:sign_up) << :name
end
```
リソースとパス

パスを返すメソッドは、コントローラでもビューでも使える。ビューの中で会員一覧のページ(indexアクション)へのリンクは次のように作れる。
前提条件
ルーティングを
`resouces :members`で入力しているとき
`link_to "会員一覧", members_path`

`member_path`と`edit_member_path`のように、個別のリソースを扱うアクションへのパスを得るには、引数にモデルオブジェクトを渡す。すると、モデルのidがidパラメータになる。
たとえば、会員詳細の情報ページ(showアクション)へのリンクは次のようになる。

```Ruby:
link_to @member.name, member_path(@member)
```

削除のためのリンクでmethodオプションにDELETEメソッドを指定すれば、destroyアクションへのリンクになる。

```Ruby:
link_to "削除", member_path(@member), method: :delete
```

#オブジェクトでパスを表す
さらに簡略化したパスの表現。
`link_to`メソッドの第２引数にモデルオブジェクトを渡すと、`/members/123`のように`member_path`メソッドと同じパスに変換される。

```Ruby:
link_to member.name, @member
link_to "削除",　@member, method: :delete
```

editアクションやsuspendアクションのように、個別のリソースを扱うアクションは、配列を使って[: アクション名, オブジェクト名]で表せる。次の例は`/members/123/edit`や`/members/123/suspend`のようなパスになる。

```Ruby:
link_to "編集", [:edit, @member]
link_to "停止", [:suspend, @member], method: :patch
```

indexアクションやnewアクションのようにidパラメータを取らないアクションでは、前述の`◯◯_path`の`_path`をとった文字列をシンボルにしたものが使える。

```Ruby:
link_to "会員一覧", :members
link_to "新規追加", :new_member
```

以上のモデルオブジェクト、配列、シンボルで表したパスは、コントローラのredirect_toメソッドの引数としても使える。

以下はどれも同じshowアクションへのパスになる

```Ruby:notes_controller
redirect_to note_path(@note.id) #◯◯_pathの引数に表示したいnoteのidを渡す
redirect_to note_path(@note) #引数の.idは省略することができる
redirect_to @note #更にこのように省略できる。この場合@noteはnote_path(@note)と解釈される。
#redirect_toはデフォルトでgetのリクエストを送信する。
GolangのORマッパー gormを使ってみた


## 課題

golangのデフォルトコネクタ`database/sql`だと生クエリを叩くことになるので、SQLインジェクション対策をしたいなと思っていたが、SQLインジェクション対策を0から実装するのは面倒なので、ORマッパーのプラグインを導入

## gormって?

- RailsやLaravelっぽいORマッピングを実装してくれる
- Modelとなるstructに対し、`gorm.Models`というパラメータをつけるだけで`ID`, `updated_at`, `created_at`, `deleted_at`等をつけてくれる
- リレーションもstructの中に定義しておけば勝手にやってくれる
- structを元にマイグレーションをやってくれる
- 使い方は`database/sql`に近い

## 実装方法

コネクション作成周りは`database/sql`と同じでいけます

```go:main.go
import (
	"github.com/jinzhu/gorm"
	_ "github.com/jinzhu/gorm/dialects/mysql"
)
...
toml.DecodeFile("config.toml", &config)
dbconf := config.Mysql.User + ":" + config.Mysql.Pass + "@tcp(" + config.Mysql.Host+ ":3306)/" + config.Mysql.DB
db, err = gorm.Open("mysql", dbconf)
if err != nil {
	panic(err.Error())
}
defer db.Close() // 関数がリターンする直前に呼び出される
```

リレーションに関しても

```go:main.go
type User struct {
	gorm.Model
	Api Api `json:"api" gorm:"ForeignKey:UserId"` // Has one
}
type Api struct {
	gorm.Model
	UserId int
	ApiId int `json:"api_id"` // Belongs To
	AccessToken string `json:"access_token"`
	RefreshToken string `json:"refresh_token"`
}
```

とかしておけば、勝手に解決してくれます。
jsonの受け皿としても使えるので、リクエストのbodyに対して、自動割当も可能です。

```go:main.go
func register(w http.ResponseWriter, r *http.Request) {
	docoder := json.NewDecoder(r.Body)
	var user User
	err := docoder.Decode(&user)
	if err != nil {
		panic(err)
	}
}
```
更に、マイグレーションに関しても

```go:main.go
	db.AutoMigrate(&User{}, &Api{})
```
とやるだけ。
HTTPのメソッド


| メソッド　　　| 機能　　　　　         | アクション
|:----------- |------------:        |----------:
| GET         |リソースの要求 　　　　　|
| POST        |リソースの送信 　　　　　|
| HEAD        |ヘッダー部分だけを要求 　|　
| PUT         |リソースの置換 　　　　　|
| PATCH       |リソースの一部更新 　　　|update
| DELETE      |リソースの削除　　　　   | destroy

|操作|Verb |
|:--|----:|
|create|POST|
|read|GET|
Update|PATCH|
Delete|DELETE|
デフォルトHTML


```
<!DOCTYPE html><!--DOCTYPE宣言,HTMLのバージョンを宣言するためのもの。ここではHTML5-->
<html lang="ja"><!--言語の指定-->

<head><!--ページに表示されない内容(hp作成に関する情報)-->

    <meta charset="utf-8"><!--HTML5での文字コードはUTF-8が推奨(文字化け対策)-->

    <title>タイトル</title><!--タブに表示されるタイトル-->

    <link rel="stylesheet" href="style.css"><!--cssの読み込み-->

</head>


<body><!--ページに実際に表示される内容-->



</body>

</html>

```

#リンクを新しいタブで開かせる方法

```
<a href="https://www.google.co.jp/" target="_blank">Google</a>
```

#なぜdivタグで囲むのか？

divで囲むと一気にcssを適用できる

ulタグをfloatするときは`overfow: hidden
floatした時はoverflow hidden

float left rightしたときはclear bothすること

cssでbackground imageでしたほうがよい

border-radius 50%にすると（height width)丸くなる

<a class="img"....
などクラスを指定することもできる。

aタグはインライン要素になるので、幅や高さを指定できない。
そのためinline-blockに変更する
containerにmargin 0 autoとすることで全てが中央寄せになる。
renderの特殊な使い方


```Ruby:
<%= render @notes %>
```
↑は↓のコードを生成する。

```Ruby:
<%= @notes.each do |note| %>
<%= render note %>
<% end %>
```

```Ruby:
<%= render note %>
#同じ↑↓
<%= render 'noets/note', note: note %>
```
gitまとめ


1. gitでバージョン管理したい場合は、必ずバージョン管理下におきたいディレクトリの直下に、`git init`を実行する。
1. ワーキングツリーの状態（変更が加わっているかなど）を確認する場合は、`git status`を実行する。
1. ワーキングツリー下で変更が起きたら、それを`git add`することによってステージングにアップする。全部したい場合は`git add .`※スペース注意！
1. ステージングに上がったものは、`git commit`をすることによって、`コミットメッセ ジ`とともに、リポジトリにバージョンとして登録される。メッセージを登録する場合は`git commit -m "ここにメッセージ"`
1. コミットログを一覧で確認するには`git log`を実行する。
1. コミットの詳細（歴史の詳細）を確認するには、`git show<コミットID>`を実行する。`git log -p`でも確認可能。
<hr>
公開鍵と秘密鍵の生成はすでに終了している

```
$ ls ~/.ssh
$ ssh-keygen -t rsa -C "your_email@example.com"
$ cat ~/.ssh/id_rsa.pub
```

1. リモートリポジトリの追加`git remote add origin git@github.com:USER_NAME/git_test.git`
2. 誤ってヒモ付けてしまった場合は、git remote rm originとコマンドする
2. git remote -v
3. git push -u origin master
vagrant upしたらエラーが起きた。


```
Failed to mount folders in Linux guest.
```

vboxsfが壊れているらしい。

#vboxadd setupを再実行
ゲストOSで下記コマンドを実行する
エラーが起きていてもsshでログインしちゃってください。
$ vagrant ssh

```
[vagrant@vagrant-centos65 ~]$ sudo /etc/init.d/vboxadd setup

Removing existing VirtualBox non-DKMS kernel modules       [  OK  ]
Building the VirtualBox Guest Additions kernel modules
The headers for the current running kernel were not found. If the following
module compilation fails then this could be the reason.
The missing package can be probably installed with
yum install kernel-devel-2.6.32-431.3.1.el6.x86_64

Building the main Guest Additions module                   [FAILED]
(Look at /var/log/vboxadd-install.log to find out what went wrong)
Doing non-kernel setup of the Guest Additions              [  OK  ]
```

#kernelをインストール(これは無くてもいいっぽい)

```
[vagrant@vagrant-centos65 ~]$ sudo yum install http://vault.centos.org/6.5/updates/x86_64/Packages/kernel-devel-2.6.32-431.3.1.el6.x86_64.rpm

[vagrant@vagrant-centos65 ~]$ sudo yum install gcc
```

再度setup

```
[vagrant@vagrant-centos65 ~]$ sudo /etc/init.d/vboxadd setup
```

# ゲストOSをログアウトして、ホストOSで再起動

```
[vagrant@vagrant-centos65 ~]$ exit
$ vagrant halt
$ vagrant up
```
Railsに特定のホスト名でアクセスする方法

利用者ごとのトップページを別々のURLに設定する方法。
仮想マシン上で動いているRailsアプリケーションに特定のホスト名でアクセスする必要がある。
そこでlocalhostに相当する127.0.0.1というIPアドレスに独自のホスト名を設定する方法。
`/private/etc/`の`hosts`ファイルをいじる必要がある。

`/private/etc`ディレクトリに移動する。

```
$ cd /private/etc
```

viコマンドで編集

```
$ vi hosts
```

しかし、これで編集して保存しても、権限がないと怒られてしまう。
そのため、`sudo`をつける。

```
$ sudo vi hosts
```

`i`を押してインサートモードにしてから、独自のホスト名を設定する。
今回はexample.comとsample.comという２つのホスト名を設定する。

```
127.0.0.1 example.com sample.com
```

`esc`でインサートモード終了。`:wq`で保存して終了する。

すでに`127.0.0.1 localhost`が存在していると思うが、削除せずに追加すること。

動作確認。rails sでアプリケーションを起動し、ブラウザで
- http://example.com:4000
- http://sample.com:4000
にアクセスする。
どちらの場合でもwelcome aboardと表示されればOK!
Slackで複数チームに入ってる人のためのiOSアプリ作った

## TL;DR

SlackのチームをまたいだChannelの切り替えが簡単にできるiOSアプリを作りました。

AppStore: [MultiTeam for Slack](http://apple.co/1T23lYm)

## なんで作ったん？

- Slackで7つのチームに入ってて、うち4つは今もアクティブ
- 基本家でも会社でもPCでSlack使ってるから、iPhoneアプリは出先でぱっと見てぱっと返す用途にしか使ってない
- 本家のアプリやと、ぱっと見ようと思った時にチーム切り替えんのがめんどい
    - 昔:
        1. 右上の `...` ボタンをタップ
        1. `Switch Teams` タップ
        1. 目的のチームをタップ
        1. 左上のSlackアイコンをタップ
        1. 目的のChannelをタップ
    - 最近(昔から？):
        1. 目的のチームまで3本指スワイプ（スワイプした先がどのチームかわかりにくい・・・）
        1. 左上のSlackアイコンをタップ
        1. 目的のChannelをタップ
- そうじゃなくて、Facebook Messengerみたいに全チームのChannel一覧を出して欲しい
- そしてFacebook Messengerみたいに新着メッセージがあるChannelを上にもってきて欲しい
- そういうアプリ誰か作ってるやろー300円ぐらいやったら買うのにーと思ったらなかったから作った

## どんなん作ったん？

- Facebook Messengerみたいに全チームのChannel一覧を出す
- そしてFacebook Messengerみたいに新着メッセージがあるChannelを上にもってくる
- こんな感じ

<img width="320" alt="1.png" src="https://qiita-image-store.s3.amazonaws.com/0/15470/18a27d83-a6df-6355-c4d8-116cff1de33d.png">

- メッセージを読み書きする画面も極力本家に合わせて違和感ないように

<img width="320" alt="2.png" src="https://qiita-image-store.s3.amazonaws.com/0/15470/bb60914b-cbb3-f5f3-e91b-0ab25bdf185d.png">

これで、チームをまたいだChannelの切り替えが、

1. 左上の `Channels` ボタンをタップ
1. 目的のChannelをタップ

で済むようになりました。しかも大体は上の方（もしくは一番上）にあるChannelに行きたいから探すのも楽。

せっかく作ったから小遣い稼げたらいいなと思って、

- 無料で使えるけどチームは3つまでしか追加できない。バナー広告あり。
- 360円のアプリ内課金をすると、チーム数無制限＆広告なし。

っていう風にしてます。

とりあえず自分で使えるレベルにはなったのでリリースしましたが、まだまだ細かいところで使いにくい部分はあるので（現時点でTrelloのTODOが26個・・・）、ちまちま直してはアップデートしてます。バグ報告とか機能要望とかこちらのコメントでいただけたら嬉しいです。

## おまけ

### 利用している主なライブラリ

- [OAuthSwift](https://github.com/OAuthSwift/OAuthSwift): Slackログインを実装するのに利用。
- [SlackKit](https://github.com/pvzig/SlackKit): Slack APIのラッパーライブラリ。がっつりプルリク送った。
- [TTTAttributedLabel](https://github.com/TTTAttributedLabel/TTTAttributedLabel): メッセージのUILabelのテキストの一部をhtmlのaタグみたいにリンク化するために利用。
- [KMPlaceholderTextView](https://github.com/MoZhouqi/KMPlaceholderTextView): UITextViewに簡単にplaceholderを実装するためのライブラリ。Storyboard上でplaceholderに表示する文字と文字色を設定できるのが地味によい。

### こぼれ話

- 最初SlackMessengerっていう名前で申請したらさすがにリジェクトされた
- SlackのOAuthの部分で審査通すのに苦労した。
    - 最初はOAuthのログインページを外部Safariで表示するようにしてたら、In-app Safariを使えって言われた
    - In-app Safariに変更して再申請したら、今度は「SlackのPriceページが開けちゃう。appleを通さない課金システムへの動線はアウト。」って言われた。そんなん言われてもそのページ使わなSlackログインできひんし・・・と思って、他におんなじことしてるアプリを引き合いに出したりして戦ったけどあかんかった。
    - 結局In-app Safariも諦めて `OAuthWebViewController` を継承した自前の `WebViewController` を作って、Slackの料金ページを開くとアラート出してWebView閉じるっていう処理を入れたらやっと審査通った
WordPress the_content で本文が展開される前または後にフィルターをかけるには

記事本文を加工・解析したい場合は `the_content` に対してフィルターをかけます。

優先度を設定せずに (デフォルト `$priority = 10` ) ただ普通にかけた場合は、下記ファイル内に定義されているように、本文内のショートコードが展開される前に実行されてしまうので

```wp-includes/default-filters.php
// Shortcodes
add_filter( 'the_content', 'do_shortcode', 11 ); // AFTER wpautop()
```

展開後にフィルターをかけたい場合は

```php
add_filter('the_content', 'the_content_after_filter', 12);
```

のように設定します。

ちなみに展開前にフィルターをかける前は

```php
add_filter('the_content', 'the_content_before_filter', 10); // 第三引数は省略しても同じ
```

のように設定します。
Clojureの評価の仕様を読んでみた（REPLの仕様も読んでみた）

社内勉強会の事前準備として下記を短くまとめてみました．

http://clojure.org/reference/evaluation

* 評価はフォーム（スペシャルフォーム，マクロを除く）を元に値を返す．
* 文字列，数字，etc なリテラルは自分自身の値を返す．
* シンボルはあちこち探して解決を試みる．見つからなければエラー
* シンボルにメタデータがある場合，コンパイラーが使うかもしれないが戻り値には使われない．
* vector, set, mapには評価された後の値が入る．
* 空のリストを評価すると空のリストになる．
* 空でないフォームは他のスペシャルフォーム，マクロ，関数に対する呼び出しとして扱われる．
* スペシャルフォームはClojureの言語に組み込まれているフォーム．
    * destructuringも実はスペシャルフォームという発見があった
* マクロは評価の前に引数のフォームに対して操作を行う．
* スペシャルフォーム，マクロでないフォームは関数呼び出しとして扱う．
    * （演算子　引数．．．）を左から右に評価した後，IFｎ型にキャストしinvoke()メソッドを呼び出す．
* 記載のないものは自分自身を返す．
* (eval ...)で上記の仕様を実感できる．

全体として序文に下記が書いてあったが意味するところがわからなかったので深く調べて見ようと思う．
> If an expression needs to be compiled, it will be. There is no separate compilation step, nor any need to worry that a function you have defined is being interpreted. Clojure has no interpreter.

また，
http://clojure.org/reference/repl_and_main
も読んだ．

* *1 *2 *3でREPL上で１回前，２回前，３回前の評価結果を取得できる，
* *e で前回発生した例外のインスタンスを取得できる．
* ソケットサーバーでREPLを立ち上げることができる
    * 動いているシステムをアドホックに修正できる．
* REPLのname space用の便利な関数がある．（doc等）
GitHubメモ


用語

| 用語 | 説明 | 
|:-----------|:------------|
| Fork |GitHub側にある特定のリポジトリを自分のアカウント以下のリポジトリに複製すること。ForkしたリポジトリはFork元とは異なるリポジトリとなり、自分の好きなように編集することができる。|
|Branch||
|Topic Branch||


| 用語 | 説明 | 
|:-----------|:------------|
|トピックブランチを作成|git checkout -b {ブランチ名} {元になるブランチ名}|
|ブランチを確認する| git branch -a |
|修正の確認|git diff|
|手元のリポジトリにコミット| git add |
||git commit -m|
|GitHub側のリポジトリに修正を加えたブランチを作成|git push origin {ブランチ名}
|ブランチを削除|git branch -D {ブランチ名}


###ブランチ間の差分を見る
URLを修正することで可能。 compare/{ブランチ1名}...{ブランチ2名}
https://github.com/tadayasu/first-pr/compare/gh-pages...work

###リポジトリを最新の状態にする
フェッチしてマージする

```
git fech
git merge
```

-開発中のPull Requestは誤ってマージされないために、タイトルの先頭に[WIP]と挿入するのが一般的。... WIP[Work In Progress]
class構文で関数を作るクラスを定義


二つの方法があります。

1. コンストラクタで関数を生成する
2. Functionコンストラクタを継承する

Chrome 50.0.2661.102とNode v6.1.0で確認しました。

# コンストラクタで関数を生成

class構文のcontstructorはreturn文で、生成するオブジェクトを上書きできます。

http://www.2ality.com/2015/02/es6-classes-final.html
> Overriding the result of a constructor

> Just like in ES5, you can override the result of a constructor by explicitly returning an object:

    class Foo {
        constructor() {
            return Object.create(null);
        }
    }
    console.log(new Foo() instanceof Foo); // false
> If you do so, it doesn’t matter whether this has been initialized or not. In other words: you don’t have to call super() in a derived constructor if you override the result in this manner.

関数を生成してreturnすれば、関数を返すクラスを定義できます。

```js
class Hoge {
  constructor() {
    return function(val){
      console.log(val)
    }
  }
}
```

```
new Hoge()('hi')
```

## 継承

[setPrototypeOf](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf)を使って、prototypeを設定します。

```js
class Fuga {
  hi(){ console.log('hi') }
}
class Hoge {
  constructor() {
    function log(val){
      console.log(val)
    }
    Object.setPrototypeOf(log, new Fuga)

    return log
  }
}
```

```
new Hoge().hi()
```

## 感想
```js
class Fuga {
  hi(){ console.log('hi') }
}
function Hoge
  console.log(val)
}
Object.setPrototypeOf(Hoge, new Fuga)
```

の方が、良いのでは？という気持ちになります。

# Functionコンストラクタを継承

[Function](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Function)を継承して、superでFunctionコンストラクタを呼び出すと、関数をつくれます。

```js
class Hoge extends Function {
  constructor() {
    super('val', 'console.log(val)')
  }
}
```

## 継承

```js
class Fuga extends Function {
  hi(){ console.log('hi') }
}
class Hoge extends Fuga{
  constructor() {
    super('val', 'console.log(val)')
  }
}
```

## 感想
Functionコンストラクタを使うことに、なぜか恐怖を覚えます。

# おまけ

## Functionコンストラクタは[Spread operator](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Spread_operator)も使える

```js
new Function('...rest', 'console.log(...rest)')
```
Sync の GitHub 連携をさっそく試してみました

Wantedly のチャットツール Sync で「**GitHubとの連携**」ができるようになったので、なにかよい活用方法がないかを探るためにさっそく試してみました。

詳しい設定方法は次の記事を参照してください。

> 『業界初！「psd/aiファイルのプレビュー」と、「GitHubとの連携」が可能に』
http://sync-blog.wantedly.com/entry/feature1

>『Hackathonで勝つために!! 2分でGithub連携チャットルームを作る方法』
http://qiita.com/awakia/items/75e752d18edc5ada63fe

<br />

# **届いた通知**[^1]

[^1]: 自分が試したのがこれだけです。

- **issue の open / close**
- **issue にコメント**
- **pull request の open / close**[^2]
- **pull request に コメント**

[^2]: pull request の merge は pull request の close として届きました。

<br />

# チャット画面（Mac 版 Sync）


## pull request の open

![スクリーンショット 2016-05-17 6.40.18.png](https://qiita-image-store.s3.amazonaws.com/0/105213/89f8607c-57ef-81ae-eee9-2cef42528864.png)

## issue の open

![スクリーンショット 2016-05-17 6.59.21.png](https://qiita-image-store.s3.amazonaws.com/0/105213/63fe6061-9470-bb4e-464e-8306494be52d.png)

## pull request の close / issue の close（pull request の merge）

![スクリーンショット 2016-05-17 7.23.07.png](https://qiita-image-store.s3.amazonaws.com/0/105213/54e560ec-ea13-b2d9-d70c-fdae992079c8.png)

## issue にコメント

![スクリーンショット 2016-05-17 8.05.34.png](https://qiita-image-store.s3.amazonaws.com/0/105213/7729c356-c60d-6ceb-1f4c-cead10245930.png)

## pull request に コメント

![スクリーンショット 2016-05-17 8.11.20.png](https://qiita-image-store.s3.amazonaws.com/0/105213/d374e0a4-9a4c-d5b8-ebaf-88b37785e7a7.png)

<br />

# チャット画面（iPhone 版 Sync）

当たり前ですが iPhone でも同じ通知を確認することができます。（Push 通知あり）

<br />

![Screen Shot 2016-05-17 at 7.39.01.png](https://qiita-image-store.s3.amazonaws.com/0/105213/ec4cff72-1f1f-d4c0-2d6a-af249c0d28f4.png)

![Screen Shot 2016-05-17 at 8.15.06.png](https://qiita-image-store.s3.amazonaws.com/0/105213/86dddcb1-fa00-9486-d75c-9405f653a8d8.png)

<br />

# 雑感

リポジトリを指定するので大量に飛び交う通知を簡単に絞ることができますね。

個人的には Travis CI の通知を受け取りたいところですが、それは別の方法で工夫する必要があります。
ただ「他の連携先も準備中」と記載されていますので、今後も継続して使ってよい方法を探ってみます。

<br />

![スクリーンショット 2016-05-17 7.52.48.png](https://qiita-image-store.s3.amazonaws.com/0/105213/9ca5d5de-b70f-206c-eef5-b391bb93620f.png)
【Unity】シーンのアンロード時に（SceneManager.Unload）フリーズする

バグでも無限ループでも強制終了でも無く、ピタッとフリーズする事があんまり無かったUnity。
そんなUnityが音だけプープー鳴らしたままフリーズしたのでメモ。

### SceneManager.Unload
Version 5.3.2f1にて遭遇

> 参考
> http://polaris-bear.lolipop.jp/shunroom/300
> https://issuetracker.unity3d.com/issues/unity-hangs-on-scenemanager-dot-unloadscene

自分が遭遇した時はOnTriggerではなくAnimation clipのイベントとして呼び出した関数内でSceneManager.Unloadを使って、そこでハング。
参考でもあるように、呼び出し関数ではフラグだけ立ててUpdate時にUnloadを処理するようにしたら落ちなくなりました。

まとまった単位メモリから上げ下げするのって、やっぱり難しいんですかね ^^;
【たまに更新】Inspiration for Data Visualization

#全般
- [Gallery · d3/d3 Wiki](https://github.com/d3/d3/wiki/Gallery#examples)
- [christopheviau.com/d3list/gallery.html](http://christopheviau.com/d3list/gallery.html)
- [Data Mining and Data Visualization | Exploring Data](http://exploringdata.github.io/)
- [Infographics & Data Visualisations - Visualoop](http://visualoop.com/)
    - Dribbble for infographic & data visualization artists
- [information aesthetics - Data Visualization & Information Design](http://infosthetics.com/)
- [Top 20 Most Beautiful Data Visualization Examples - Data-Visualization.org](http://www.data-visualization.org/top-20-beautiful-data-vizs.html)

#Lab
企業のビジュアライズ事例など。

- [nytlabs](http://nytlabs.com/)
    - NY Times
- [Twitter #interactive visualizations](https://interactive.twitter.com/)


#Typography
- [Google Trends - Hot Searches](https://www.google.com/trends/hottrends/visualize)

#Mapping
- [Aaron Koblin - Flight Patterns](http://www.aaronkoblin.com/work/flightpatterns/)
    - アメリカの航空機の航路をビジュアライズ
- [Tekja - Housing](http://tekja.com/dev/unsustainable_london/app/)
    - Londonの地価
- [Producthunt WebGL Globe](http://varunmalhotra.xyz/producthunt_globe/)
- [Pistats.io / Your Uber and Lyft rides visualized](https://pistats.io/)
- [The flow towards Europe - Lucify](http://www.lucify.com/the-flow-towards-europe/)
    - React
    - [lucify / lucify-refugees · GitLab](https://gitlab.com/lucify/lucify-refugees)
    - 難民の移動

#Music Visualization

- [therewasaguy/p5-music-viz: Workshop on music visualization with p5.js from Eyeo '15, previously MozFest '14, NYU ITP](https://github.com/therewasaguy/p5-music-viz#dig-deeper-into-web-audio-music-visualization)
    - Demo
    - JSライブラリ紹介
- [Kandinskify](http://jasonsigal.cc/kandinskify/)
    - [therewasaguy/kandinskify: Kandinsky-inspired music visualization](https://github.com/therewasaguy/kandinskify)
    - カンディンスキーにインスパイア

#Github Visualize
- [Codeology](http://codeology.braintreepayments.com)
- [Github Visualizer](http://veniversum.me/git-visualizer/?owner=atom&repo=atom)

#Sports
- [Buckets: NBA Shot Visualization](http://peterbeshai.com/buckets/app/#/playerView/201935_2015?playerSelector=true)

#Pinterest
- [Pinterest • 世界中のおしゃれアイデアまとめ](https://jp.pinterest.com/search/pins/?rs=ac&len=2&q=data+visualization&0=data%7Cautocomplete%7C0&1=visualization%7Cautocomplete%7C0)

#Advent
- [Data Visualization Advent Calendar 2014 - Qiita](http://qiita.com/advent-calendar/2014/dataviz)
- [Data Visualization Advent Calendar 2015 - Qiita](http://qiita.com/advent-calendar/2015/dataviz)

#D3.js

##ラッパー描画ライブラリ
- [Rickshaw: A JavaScript toolkit for creating interactive time-series graphs](http://code.shutterstock.com/rickshaw/)
- [NVD3](http://nvd3.org/)

#Conference
- [OpenVis Conf by Bocoup](https://openvisconf.com/)

# 編集リクエスト歓迎
一人で更新していくのは大変なので編集リクエスト受け付けております :pray: :pray: :pray:
【Unity】シーン読み込み時に暗くなる

既知の事でも永らく解決出来なかったのでメモ。
間抜けを刻んで知識に変えませう。

## SceneManager.LoadScene(sceneName)
上記コマンドでシーンを読み込んだ時、作業時よりも暗く表示される事がある場合は、LightingタブのライトマップのBuildがAutoになっているから、らしい。

> 参考
> http://d.hatena.ne.jp/funct/20150926/1443279282
> http://marumawa.hateblo.jp/entry/2016/01/04/192151
> http://ysh-urasoe.seesaa.net/article/417853507.html
>

宛先シーンのライトマップ情報が無い場合、特に参照すべきReflection probeが無くて暗くなっているように見受けられるので、手動で焼けば問題なし。
staticなモデルが無いからライトマップ不要じゃいと思っていたけど、必ずしもそうではなかった。
反省…^^;
TechEnglish > Listening > RAZER mechanical keyboard

英語Listeningの練習

RAZER キーボードの宣伝動画

https://www.youtube.com/watch?v=kC93-h3nprs&index=49&list=WL

赤文字ははっきり聞き取れない部分。(Red part is what I couldn't listen correctly).
青文字はそのように聞き取れるが、文法的にしっくりいかない部分。(Blue part is what I listened, but the grammar does not sit well).

(00:00-)
What does it take to make a RAZER mechanical switch? It takes components of a highest quality, made <font color=red>XXX1(specifically?)</font> for one purpose. It takes cutting-edge technology to achieve precision down to hundredth of a millimeter. It takes one of the precious metals for only gold plate <font color=red>XXX2</font> can assure every electrical contact exactly where it has to be.

(00:32-)
It takes absolutely air-free assembly of each component. It takes high speed camera and infrared sensors to detect incorrect <font color=red>XXX3(minu?)</font> or regularities. Those <font color=red>XXX4(later?)</font> invisible to the naked eye. And the calibration of these sensors, three times a day, to ensure tolerance levels are kept close to zero. 

(01:00-)
It takes careful planning to force exhaust <font color=red>XXX5</font> click. But it needs <font color=red>XXX6</font> actuation points <font color=red>XXX7</font> exactly the same for the first to 80 million key stroke. It takes extremely heat and almost freezing temperatures. Intense vibrations. Countless drop test. It takes endurance test to simulate the use of ten years in just six weeks.

(01:28-)
It takes unforgiving professional to scrutinize every detail. In the most demanding situations, to help find all aspects. But above all, it takes <font color=red>XXX8(unwavering?)</font> passion to pursuit in the <font color=red>XXX9</font> perfection.
Zybo > Chronicles blog 14 > PLL > ARM PLL / I/O PLL / DDR PLL

MicroZed Chronicles リスト http://adiuvoengineering.com/?page_id=285
@ Adam Taylor blog
https://forums.xilinx.com/t5/Xcell-Daily-Blog/MicroZed-Timers-Clocks-and-Watchdogs-Adam-Taylor-s-MicroZed/ba-p/399219

> The PS clock provided by the hardware drives three PLLs (phase-locked loops), which are used to multiply the Zynq’s input clock frequency. Each of these PLLs has a different function within the Zynq PS (processor system):

PSサイドでは3つのPLLがある

> - ARM PLL  - Usually used to clock the CPU, SCU, OCM and AXI GP Interconnect
- I/O PLL – Used to clock the I/O Peripherals
- DDR PLL – used to clock the DDR memory and the AXI HP (high-performance) interconnect
Zybo > Chronicles blog 14 > Timers > TTC / SWDT > Block Diagramで使用設定する

MicroZed Chronicles リスト http://adiuvoengineering.com/?page_id=285
@ Adam Taylor blog
https://forums.xilinx.com/t5/Xcell-Daily-Blog/MicroZed-Timers-Clocks-and-Watchdogs-Adam-Taylor-s-MicroZed/ba-p/399219


関連 http://qiita.com/7of9/items/23c586bbbafe80ed1cc5

> The Zynq SoC’s private timers, watchdog and global timer do not require any changes to the Vivado project to use. However, you must  enable the TTC or the system watchdog Timer within the processing system definition in a Vivado project to use them.

タイマーのうち、デフォルトで使用可能なタイマーとBlock Diagram画面で設定して使えるタイマーがあるとのこと。
vagrantで作成したLinux boxから Xアプリケーションを起動したい

#環境
*host OS: Windows7 64bit 
*VMM: Virtualbox Version 5.0.20 r106931
*guest OS: bento/centos-7.2 (2.2.6)

#やったこと
1. ホストマシンにXサーバを入れとく。
Windowsだと Xmingが安定ですね。

2. VagrantfileでX11フォワード設定をする。
`config.ssh.forward_x11 = true`
[see, X forwardingがうまくいかないとき](http://qiita.com/ocadaruma/items/1d472ec3e87d41ca3494#x11-forwarding%E3%81%8C%E3%81%86%E3%81%BE%E3%81%8F%E3%81%84%E3%81%8B%E3%81%AA%E3%81%84%E3%81%A8%E3%81%8D
http://qiita.com/ocadaruma/items/1d472ec3e87d41ca3494#x11-)

3. Linux-boxに xauthを入れとく。
これを忘れてると、なぜか $DISPLAYが設定されず焦ります。最近はミニマムなOSイメージが流行ってますからね。
`$ssh yum install xauth`

#備考
[▼最近の豪華なX11環境でsshを使ってＸプロトコルを中継する▼](http://vega.sra-tohoku.co.jp/~kabe/vsd/ssh-x.html)
Zybo > Chronicles blog 14 > Timers > SCUTIMER / SCUWDT / GT / SWDT / TTCs

MicroZed Chronicles リスト http://adiuvoengineering.com/?page_id=285
@ Adam Taylor blog
https://forums.xilinx.com/t5/Xcell-Daily-Blog/MicroZed-Timers-Clocks-and-Watchdogs-Adam-Taylor-s-MicroZed/ba-p/399219

> The Zynq All Programmable SoC has several timers and watchdogs available. These on-chip peripherals are either private to a CPU or a shared resource available to both CPU’s:

Zynqでは複数のCPUを持つものがあり、それぞれのCPUに対するタイマーと、両方のCPU共通のタイマーがあるようだ。

タイマーの種類は以下。

>
- CPU 32-bit timer (SCUTIMER) clocked at half the CPU frequency
- CPU 32-bit watch dog (SCUWDT) clocked at half the CPU frequency
- Shared 64-bit Global Timer (GT) clocked at half the CPU frequency. Each  CPU has its own 64-bit comparator, which drives a private interrupt for each CPU
- System Watchdog Timer (SWDT), which can be clocked from the CPU clock or an external source.
- Two Triple Timer Counters (TTCs). Each TTC contains three independent timers that can be clocked by the CPU clock or by an external source from the Zynq SoC’s MIO or EMIO (in the Zynq SoC's PL).
Zybo > Chronicles blog 13 > GPIO > interrupt > ISR設定 > XGpioPs_SetCallbackHandler(Gpio, (void *)Gpio, IntrHandler);

MicroZed Chronicles リスト http://adiuvoengineering.com/?page_id=285
@ Adam Taylor blog
https://forums.xilinx.com/t5/Xcell-Daily-Blog/More-About-MicroZed-Interrupts-Adam-Taylor-s-MicroZed-Chronicles/ba-p/398357

> The interrupt set-up function will also define the ISR, which will be called when an interrupt occurs. We use this function:

```
XGpioPs_SetCallbackHandler(Gpio, (void *)Gpio, IntrHandler);
```

Gpioとは以下のようにして定義されたもの.

```
static XGpioPs Gpio;     //GPIO Device
```
Gemで最新版(x.x.x.rc)がインストールできない

RubyGemでxxxxx.rcとなっているバージョンのgemがインストールできなかったのでメモ。今回は「ec2ssh」というGemをインストールしようとしてみました。

# 結論

以下のように明示的にrcのバージョンを指定すればインストールできます。

```bash
$gem install ec2ssh -v 3.1.0.rc2
```

# 検証した時のメモ

インストール対象のgemについて検索してみます。

```bash
$gem search -r ^ec2ssh$ -d

*** REMOTE GEMS ***

EC2ssh (0.1.6)
    Author: Ramon Salvad&#243;
    Homepage: http://github.com/rsalvado/ec2ssh

    A script to make it easier to ssh into running amazon EC2 instances.

ec2ssh (3.0.3)
    Author: Issei Naruta
    Homepage: http://github.com/mirakui/ec2ssh

    A ssh_config manager for AWS EC2
```

こうなっていますが、実際にrubygemsのページを確認すると「ec2ssh」の最新版は3.1.0.rc2となっています。

他のgemではどうなるのか確認してみます

```bash
$gem search -r ^mime-types$ -d

*** REMOTE GEMS ***

mime-types (3.0)
    Author: Austin Ziegler
    Homepage: https://github.com/mime-types/ruby-mime-types/

    The mime-types library provides a library and registry for
    information about MIME content type definitions
```

普通に最新版が表示されています。
ということは検索などのコマンドには問題がなさそうでバージョン名にrcというのが入っているのがポイントだと思われますね。。。

次に利用できるバージョン一覧をqueryコマンドを使って確認します。

```bash
$gem query -ra ^ec2ssh$

*** REMOTE GEMS ***

EC2ssh (0.1.6, 0.1.5, 0.1.4, 0.1.3)
ec2ssh (3.0.3, 3.0.2, 3.0.1, 3.0.0, 2.0.8, 2.0.7, 2.0.6, 2.0.5, 2.0.4, 2.0.3, 2.0.2, 2.0.1, 2.0.0, 1.0.3, 1.0.2, 1.0.1)
```

一覧にも表示されませんね。。。
とはいえ一応できるかやってみます。

```bash
$gem install ec2ssh -v 3.1.0.rc2
Fetching: ec2ssh-3.1.0.rc2.gem (100%)
Successfully installed ec2ssh-3.1.0.rc2
1 gem installed
```

あら、できますね。。。。
末尾にrcと付くバージョンをダウンロードする場合には明示的にバージョンを指定しないとダメなんですね。。。

無事ダウンロードできました。

```bash
$ec2ssh version
ec2ssh 3.1.0.rc2
```
ESP8266 > 回路 > ADCでのVCC測定時のTOUTピンの扱い > OPENにしておく

http://qiita.com/ryokai/items/5ec7e0d88f4dc08dff69
で気になった、VCC測定時のTOUTの配線。

http://arduino.esp8266.com/versions/1.6.5-947-g39819f0/doc/reference.html
> To read VCC voltage, ADC pin must be kept unconnected. 

元記事の方が書いている「かつ、TOUTに信号が入力されると、電源電圧の測定値にぶれが出ると思われます(未検証)」というのは本当のようだ。

レジストリを切り替えて内部的にVCC測定とTOUT測定を排他にする、というような回路にはなっていないようだ。
技術英語 > can’t [break that fried chicken habit] when trying to diet.  

http://www.scientificamerican.com/podcast/episode/people-pick-familiar-foods-over-favorites/

> can’t <font color=red>break that fried chicken habit</font> when trying to diet.  

手当たり次第にTutorialなど見る、という悪い習慣をどうにかしないといけない。

時間がある時はこういう習慣でもいいが、忙しくなってしまった場合は要再検討。

自分が目指しているものを再度確認して、その過程で必要なものを適宜学習するように、スケジュールを整理しないといけない。
R の chartr() を Python でやるには

R には `chartr()` という便利な関数がある。
これは、二つの文字列を指定すると、それらの対応する一文字ずつをそれぞれ置換するという関数である。
実際に例を見てみる。

```r:R
txt <- "I like orange"
chartr("abcde", "ABCDE", txt)
```

```:結果
[1] "I likE orAngE."
```

これを、Python でやるには、次のようにする。

```py:Python
import string

txt = "I like orange."
trans = string.maketrans("abcde", "ABCDE")
result = txt.translate(trans)
print(result)
```

```:結果
I likE orAngE.
```

Enjoy!

### 参考

- [R の文字列処理関数 - RjpWiki](http://www.okadajp.org/RWiki/?R%E3%81%AE%E6%96%87%E5%AD%97%E5%88%97%E5%87%A6%E7%90%86%E9%96%A2%E6%95%B0)
- [Pythonでの文字列置換をマスターする - orangain flavor](http://orangain.hatenablog.com/entry/20100503/1272900555)
NCMBとMONACAを使ってアプリ開発（roleとfetchUserをまとめる）

#fetchUserの使い方
roleにいるユーザー一覧を取得するためのfetchUser。これは使い方的には簡単。なぜなら解説があるから。

[NCMBのサンプルのページ（会員のグルーピング）](http://mb.cloud.nifty.com/doc/current/user/manage_privileges_monaca.html#会員・子ロールの取得)

ちょっと使い方が整理しないとわからなかったから整理がてら。

##ほぼサンプルと同じサンプル
```
function getUserBelongGroup(roleName){
    ncmb.Role.fetchAll()
             .then(function(results){
                return results[0].fetchUser(); ←ここでroleに所属しているユーザーがとれる
             })
             .then(function(users){
                alert(users.length);　←すぐに使うとobject Promiseになるけど、一回thenを挟むと大丈夫。なぜ？
                alert(users[0].userName);
                alert(users[1].userName);
             })
             .catch(function(err){
                 alert(err);
             })   
}
```

#自分が所属しているroleを取得する（グループ一覧）の方法考察
自分が所属しているrole一覧を取得するには、全部のroleをfetchUserして、その中に自分がいたらRoleの名称をどっかにつっこむ、的なのがいるのか？それとも、自分がroleに入った時に、USERコレクションのaclに追加しておくべきか。多分後者が楽な気がするがどうだろう。。。速度的には後者な気がする。もしくはUserコレクションにroleフィールドを持たせて配列で中に突っ込んどくとか？

次回は自分が所属しているrole一覧を表示、をやります。
ES5で書くAngular v2（２）「双方向バインディング」

※現在この方法は推奨されません

[前回](http://qiita.com/puku0x/items/f8546f1380bfb5b680e1)はES5で簡単なAngular v2のサンプルプログラムを書きました。

今回はAngularJSの特徴でもあった「双方向バインディング」をやってみましょう。

メインのHTMLは前回とあまり変わりません。

```html:app.html
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/Rx.umd.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/angular2-polyfills.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/angular2-all.umd.dev.js"></script>
        <script src="components/hello-component/hello-component.js"></script>
    </head>
    <body>
        <hello-component></hello-component>
    </body>
</html>
```

今回からコンポーネントごとにフォルダを分けます。
<img src="https://qiita-image-store.s3.amazonaws.com/0/106886/7097f9a9-510d-c08d-8534-493fc3a0885f.png" width="320px"/>

※ app.jsは今回は使わないため空でもOKです。

```js:app.js
'use strict';
(function() {
})();
```


まずはJavaScriptから。templateに直書きするとコードが汚れるのでtemplateUrlを使います。

```js:components/hello-component/hello-component.js
(function(app) {
    app.HelloComponent = ng.core
    .Component({
        selector: 'hello-component'
    })
    .View({
        templateUrl: 'components/hello-component/hello-component.template.html'
    })
    .Class({
        constructor: function() {
            this.name = 'world';
        }
    });
    document.addEventListener('DOMContentLoaded', function() {
        ng.platform.browser.bootstrap(app.HelloComponent);
    });
})(window.app || (window.app = {}));
```

テンプレートHTMLの中身はこのようになっています。

```html:components/hello-component/hello-component.template.html
<p>Hello, {{name}} !</p>
<input type="text" [(ngModel)]="name" />
```

Angular v2では、**[(ngModel)]="変数名"** と書くと関連付けられた変数（今回はthis.name）が双方向バインディングされます。

ちなみに、**[ngModel]="変数名"** と書くと単方向バインディングとなり、inputの初期値は入りますが、文字を入力しても画面に反映されなくなります。

今回のサンプルはCodepenでも公開しております。
https://codepen.io/puku0x/pen/zqQNea

# まとめ

Angular v2の記法を用いて、双方向バインディングができました。
v1.x系と比べてかなり独特な書き方なので、最初は混乱するかもしれませんが頑張って慣れましょう。
[次回](http://qiita.com/puku0x/items/99a0602bf248ce42e8f6)は繰り返し処理をやります。
ES5で書くAngular v2（１）「Hello, world」

※現在この方法は推奨されません

Angular v2がベータ版からRC版となりました。正式リリースが楽しみですね。

1.x系からの変更やTypescriptの採用など、移行に向けて覚える事が多く大変です。

**「まずは現行のJavaScriptで動かせないか？」** と思い試行錯誤してみた結果を、
拙筆ではありますが「ES5で書くAngular2」と題して紹介していこうと思います。

# Angular v2の入手
自分でnpmしたりビルドできる人はそうされることをおすすめします（最新版を使えるため）。
そうでない場合や手っ取り早くAngular v2を動かしたい場合はCDNを利用すると良いでしょう。

```html:Angular v2&nbsp;Beta.17の利用例
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/Rx.umd.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/angular2-polyfills.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/angular2-all.umd.dev.js"></script>
```

# Hello world サンプルを作る

まずはHTML側を書いていきましょう。
Angular v2はコンポーネント指向であるため、内容は非常にシンプルです。

```html:app.html
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/Rx.umd.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/angular2-polyfills.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/angular2-all.umd.dev.js"></script>
        <script src="hello-component.js"></script>
    </head>
    <body>
        <hello-component></hello-component>
    </body>
</html>
```

次にJavaScript側です。

```js:hello-component.js
'use strict';
(function() {
    var app = ng.core
    .Component({
        selector: 'hello-component'
    })
    .View({
        template: '<p>Hello, {{name}} !</p>'
    })
    .Class({
        constructor: function() {
            this.name = 'world';
        }
    });
    document.addEventListener('DOMContentLoaded', function() {
        ng.platform.browser.bootstrap(app);
    });
})();
```

Componentにはコンポーネント名を、Viewには表示するためのHTMLテンプレートを、Classにはデータモデルの結び付けや処理の内容を書いていきます。

これを実行すると「Hello, world !」と表示されるはずです。
https://codepen.io/puku0x/pen/jqoyXB

# まとめ

ES5でもAngular v2を動かすことができました。
今回は簡単なサンプルでしたが、[次回](http://qiita.com/puku0x/items/48f13804251e9b9cd0d7)からいろいろやっていく予定です。
OpenStack neutronのrouter, firewall, security_groupを外部仕様から理解する


OpenStack(Icehouse)を前提。
（注意点のいくつかは最新のバージョンでは直っているかも？）


# Neutronとはなにか

お客さんごとに独立した通信（＝マルチテナント）を実現するための、ネットワーク管理機能を提供するコンポーネント

以下説明は、networkとsubnet,およびportについての理解を前提としています。

## router

subnet同士を接続し、L3レベルのルーティングを行う。
（一般的なルーターと概念はよく似ている）

【最も簡単な構成例】

```
-subnet 1-------------------------------
         |
       [router 1]
         |
-subnet 2-------------------------------
```

上記の構成で、subnet1上のマシンからrouter1に向けてパケットが送られると、
宛先をsubnet2上でも探す。


【routerにルーティングを設定する場合】

routerは以下のように、ルーティングを設定できる。

```bash
neutron router-update router1 --routes type=dict list=true \
destination=XX.XX.XX.0/24,nexthop=[router 2のIP]
neutron router-update router2 --routes type=dict list=true \
destination=YY.YY.YY.0/24(subnet2のCIDR),nexthop=[router 1のIP]
```

例えば、上記のルーティングを以下のネットワーク構成で設定すると、
subnet2のマシンとrouter2を経由した外のsubnetと通信することが可能になる。

```
                       ︙ 
                   [router 2] 
                       |
-subnet 1-------------------------------
         |←(デフォルトゲートウェイ)
       [router 1]
         |←(デフォルトゲートウェイ)
-subnet 2-------------------------------
```

注意点: 

routerが所属するサブネットへのルーティングには注意が必要
例えば、「100.100.10.0/24」のサブネットに属するrouterに
destination=100.100.10.0/24のルーティングを追加すると、
他のルーティングが無効になる。
そのため、「destination=100.100.10.0/25」と「destination=100.100.10.128/25」に分割するなどの工夫が必要


## firewall

firewallはrouterに被せて設定する。各概念は以下の対応関係となっている。

```
[router]---1:1---[firewall]---1:1---[firewall policy]---1:N---[firewall rule]
```

firewall-ruleに通信の許可/拒否ルールを設定する。
設定できるのは以下

- source-ip-address(通信元IP)
- destination-ip-address (通信先IP)
- source-port (通信元ポート番号)
- destination-port (通信先ポート番号)
- protocol (tcp,udp,icmp,any)
- action (allow,deny,reject)
- ip-version (4,6)

firewall-policyに設定されたfirewall-ruleは、**設定順に**評価される。
順序の制御は、`neutron firewall-policy-insert-rule`
で行う。

注意点：

firewallを設定すると、firewallが設定されたrouterを経由した通信は、
行きと帰りの通信経路を一致させなければいけない

## security_group

security_groupはportごとに設定可能。

```
[port]---1:N---[security_group]---1:N---[security_group_rule]
```

※portはVMのNICごとと考えて良い

**security_groupは許可のルールのみしか設定できない**
**なにも設定されていない場合は、すべての通信ができない**

security_group_ruleに設定できる項目は以下

- direction (ingress,egress) ※portの入ってくる通信か出て行く通信か
- protocol tcp, ipなどを設定(プロトコル番号を指定することもできる）
- port-range-min ポート番号の範囲の最小
- port-range-max ポート番号の範囲の最大
- remote-ip-prefix 通信を許可する、CIDRを指定する
- remote-group-id 通信を許可する相手先のsecurity_group_idを指定する
Stage3Dをワイヤーフレーム表示する

小ネタです。

#ワイヤーフレームモード

あまり知られていませんが、Stage3Dにはポリゴンを塗りつぶして表示するだけでなく、ワイヤーフレーム表示する機能があり、これを使うことで重なりなった複雑な3Dモデルの状況確認や、メッシュの分割形状の確認など、デバッグなどに活用することができます。

<img width="86" alt="スクリーンショット" src="https://qiita-image-store.s3.amazonaws.com/0/8302/c045cbbc-40cb-d087-fdbc-ecf2b24aef50.png"> <img width="93" alt="スクリーンショット" src="https://qiita-image-store.s3.amazonaws.com/0/8302/d6f67ac3-0163-1384-2ca5-909fd514ca91.png"> 
Starling2.0のCanvasクラスで描画したサークル(左)をワイヤーフレーム表示すると右のようになります。このようにポリゴン分割されているんですね。

コードも簡単です。Starlingでの例を下に書きます。（Stage3Dの機能なので、Starlingを使っていなくても利用できます。）

```sample.as
// 現在のStarlingからContext3Dを取得する
var context:Context3D = Starling.current.context;
// ワイヤーフレーム表示にする
context.setFillMode(Context3DFillMode.WIREFRAME);
// ワイヤーフレーム表示をやめて元に戻す
context.setFillMode(Context3DFillMode.SOLID);
```

初期化時だけでなく、動作中に表示を交互に切り替えることも可能です。

別の表示例を示すと、以前投稿したマップ表示は
<img width="532" alt="スクリーンショット" src="https://qiita-image-store.s3.amazonaws.com/0/8302/f4b37c3a-9255-3e1e-25b4-83647113879e.png">

下記のようになります。
<img width="542" alt="スクリーンショット" src="https://qiita-image-store.s3.amazonaws.com/0/8302/2940d3a4-d902-3c74-0966-506db27538a1.png">
タイル状にマップチップを並べているのがよくわかります。ワイヤー表示となった線の部分でもテクスチャのサンプリングは行われるようですね。

#制限事項
この機能ですが、実はモバイルで使用することができません。とはいえ、自分の場合、開発デバッグ以外でこの機能を使うことはなさそうですし、モバイルのコンテンツ開発もMac上で行っています。(DesktopのAIRアプリとして開発して、モバイルはコア部分のソースを共有して別プロジェクトで最後にビルドする。ANEは適当なインターフェースでラップして抽象化した状態で使いDesktop側プロジェクトでコンパイルエラーがでないようにする。）利用する際に制限が問題になることはなさそうです。

また、DesktopにもレンダリングのプロファイルがBASELINE設定以上という制限がありますが、こちらは今時のマシンで問題になる事はさらにないでしょう。

以上、知られていなそうなので記事にしてみました。情報は、こちらの記事を参考にしました。
[Stage3D Wireframe Mode Support](http://www.adobe.com/devnet/flashplayer/articles/stage3d-wireframe-mode-support.html)
MarkdownをIPython Notebookにオンラインで変換する「nbify」

Markdown を IPython Notebook にオンラインで変換する [nbify](https://nbify.herokuapp.com) というWebサービスをリリースしました。
Markdown で記述した記事や教材を、IPython Notebook 形式に変換してダウンロードすることが出来ます。または、ダウンロードせずに nbviewer 上で直接見ることも出来ます。

nbify がどのような働きをするのか、この記事を使って解説します。
例としてこれから matplotlib に関する説明を少しだけ挟みます。

## [Sample] matplotlib の使い方

`pip install` で matplotlib をインストールしよう。

```py
%matplotlib inline
import matplotlib
```

matplotlib をインストールし終えたら、自由にグラフを描いてみよう。

> 以下のコードは、 [matplotlib.org: mplot3d example code: 2dcollections3d_demo.py](http://matplotlib.org/examples/mplot3d/2dcollections3d_demo.html) のサンプルを使用している。

```py
from mpl_toolkits.mplot3d import Axes3D
import numpy as np
import matplotlib.pyplot as plt

fig = plt.figure()
ax = fig.gca(projection='3d')

x = np.linspace(0, 1, 100)
y = np.sin(x * 2 * np.pi) / 2 + 0.5
ax.plot(x, y, zs=0, zdir='z', label='zs=0, zdir=z')

colors = ('r', 'g', 'b', 'k')
for c in colors:
    x = np.random.sample(20)
    y = np.random.sample(20)
    ax.scatter(x, y, 0, zdir='y', c=c)

ax.legend()
ax.set_xlim3d(0, 1)
ax.set_ylim3d(0, 1)
ax.set_zlim3d(0, 1)

plt.show()
```

## .ipynbへ変換

この記事のMarkdown版のURLを [nbify](https://nbify.herokuapp.com) のフォームに入力して、[View on nbviewer] を押すと、nbviewer でこの記事を見ることが出来ます。もしくは[このリンク](http://nbviewer.jupyter.org/url/nbify.herokuapp.com/http://qiita.com/uetchy/items/221da126f92e7c016beb.md)から、直接nbviewerにアクセス出来ます。

> Qiitaでは、記事のURLに `.md` を付け足すことで、内容をMarkdown形式で見ることが出来ます。
> 実際に付け足すと、以下のようになります。
> __http://qiita.com/uetchy/items/221da126f92e7c016beb.md__

## ブックマークレット

Qiitaの記事をその場でIPython Notebookに変換するブックマークレットを作りました。

```js
javascript:(function(){window.location.href="http://nbviewer.jupyter.org/url/nbify.herokuapp.com/"+window.location.href+".md";})();
```

このコードをブックマークに追加して、Qiitaの記事を開いたページで実行すると、nbviewerが開いて記事を.ipynb形式で見れます。

## md2ipynb

MarkdownをIPython Notebookに変換するために、[md2ipynb](https://github.com/uetchy/md2ipynb) という小さなライブラリを作りました。今のところ、Pythonのコードブロックにしか対応していませんが、他の言語を追加することは難しいことではないでしょう。

## 結論

- 記事中のコードをその場で実行しつつチュートリアルを読み進めることが出来るようになりました
- インタラクティブにコードを弄って挙動の変化を確かめることが出来るので、手を動かして覚えたい時に良いかもしれません
RealmSwift でハマったのでリベンジしてみた。

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">ちなみに、来週、Realm使って岡山Swiftもくもく会やろうと思うんだけど、最近、Realm使えなくなったよね。<br>まず、ここから、解決しないと。。 <a href="https://twitter.com/hashtag/okswift?src=hash">#okswift</a> <a href="https://t.co/QPESkjKeFU">https://t.co/QPESkjKeFU</a></p>&mdash; イルカ＠新米プログラマー (@ikkitang) <a href="https://twitter.com/ikkitang/status/731360713822732288">2016年5月14日</a></blockquote>

先日、こんな所ではまりました。  
再挑戦してみました！

# 参考にしたサイト

[Realm公式サイト](https://realm.io/jp/docs/swift/latest/) を参考にさせていただいております。

# テストプロジェクトを作成

testRealm1 ってプロジェクトを作りました。  
Master-Detail Application
<img width="185" alt="20160515231632.png" src="https://qiita-image-store.s3.amazonaws.com/0/66498/88c5a28d-448d-db2c-7e3b-ee00656a1886.png">


※ まずは、動作チェック
<img width="278" alt="20160515231804.png" src="https://qiita-image-store.s3.amazonaws.com/0/66498/7e393f8f-4b49-1f7d-e77e-2b2eef6e43de.png">


ターミナルでアクセスして、CocoaPodsでインストールを試みます。

```
$ pod version
    1.0.0.beta.3
$ pod init 
```

`$ vi Podfile` で PodFileを修正します。
<img width="512" alt="20160515232256.png" src="https://qiita-image-store.s3.amazonaws.com/0/66498/f77fc6a1-bfc2-6adf-aae4-45043174f1f5.png">

`$ pod install` 結果はこんな感じ。
<img width="512" alt="20160515233642.png" src="https://qiita-image-store.s3.amazonaws.com/0/66498/eba17c0d-54d9-4d31-e0ae-fdf608684038.png">

入ったように見える。
フォルダ内部はこんな感じに変更になりました。
<img width="198" alt="20160515233936.png" src="https://qiita-image-store.s3.amazonaws.com/0/66498/2ffc6e81-56dc-da4a-cfff-e249dda086de.png">


```
$ open testRealm1.xcworkspace 
```

取り敢えず、Realmを何も使っていない状態で、動くかどうかの動作チェックとして、ビルドしてみました。

<img width="512" alt="20160515234425.png" src="https://qiita-image-store.s3.amazonaws.com/0/66498/8ac2a639-168e-9ee3-0b15-b45bb3b7c998.png">

<img width="512" alt="20160515234439.png" src="https://qiita-image-store.s3.amazonaws.com/0/66498/9f1151a3-9b69-7ee7-6552-3b00565dd4e2.png">

## umbrella header 'Realm.h' not found!

。。。。？？？ (´・ω・｀)
同じ、エラー、、、。。 辛い。

# 解決方法

どうやら、 CocoaPods 1.0 以上が、Realm対応していない、みたいな話らしいです。
[参考： realm / realm-cocoa](https://github.com/realm/realm-cocoa/issues/2558)

cocoapods の バージョンを指定して、インストールしてみる事とします。

皆、大好き、Qiitaより、調べました。 [参照先](http://qiita.com/AcaiBowl/items/f48f9d0f53f1448720ec)

bundler を インストールします。
```
$ gem install bundler
$ cd ~~/testRealm1
$ bundle init
```

`vi Gemfile` で、設定を指定します。
<img width="247" alt="20160516004047.png" src="https://qiita-image-store.s3.amazonaws.com/0/66498/d7ef8abc-79b2-8e7b-2ee6-b2d1928bfb96.png">

`$ bundle install --path vendor/bundle` で、Gemfileに従って、インストールを行います。

```
$ bundle exec pod --version
   0.39.0
$ bundle exec pod install
```

って事で、CocoaPods のバージョンが 0.39.0 で指定されて、Realmがインストールされました。

解決して、ビルドも通りました！！ よっしゃ！！

# 宣伝

私事で恐縮ですが、現在、岡山で月一でSwiftのもくもく会を開いております。  
興味有る方は是非、いっしょにもくもくしましょう！

![image](https://qiita-image-store.s3.amazonaws.com/0/66498/a63f1bbd-1073-e31d-451e-682ab040fd93.png)
[第五回岡山Swiftもくもく会 申込ページ](https://okswift.doorkeeper.jp/events/43856)
Twitter ハッシュタグ: `#okswift`