OmniAICreator/Qiita-1.07M huggingface dataset:
getElementsByTagNameの戻り値がNodeListじゃなかった件

~~Chromeだけなんでしょうか？~~
~~他のブラウザでは確認してません。要調査~~

仕様です。
think49様のコメントを参照。

経緯
-------
以下のようなNodeListの拡張をして、Arrayっぽく使ってやるぜ！と書いてみたんですが、
querySelectorAllでは動くのにgetElementsByTagNameでは動きませんでした。(chrome)

```js
['forEach','map','reduce','filter','every','some'].forEach(function(v) {
  Object.defineProperty(NodeList.prototype, v, {value:[][v]});
});
```


なんでやろなぁと思って、コンソールで確認してみたら↓...

![無題.png](https://qiita-image-store.s3.amazonaws.com/0/65757/202dfda8-ba54-83ae-2072-a6003e3712a2.png)

ファッ？！ HTMLCollection？！
知らなかったそんなの...

でもW3Cの仕様書にはNodeList返すって書いてあるんだけど、違うの？
https://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-1938918D


対応
----

とりあえず、今まで通りcall使って書きます。。。
HTMLCollectionの方も拡張しちゃえば良いといえば良いんですが、管理できなくなっちゃいそうな予感がするのでやめときます。
そもそもprototype拡張は筋が悪いんでしょうかね？

```js
[].forEach.call(document.getElementsByTagName('p'), function(el) {
  alert(el.innerText);
});
/*
// こう書きたかった
document.getElementsByTagName('p').forEach(function(el) {
  alert(el.innerText);
});
*/
```


禁止ワード
---------

jQuery

```js
$('p').each(function(){ alert(this.innerText); });
```
CentOSにHerokuをインストールしようとしたら、エラーが出た。

####概要
***
CentOSでHerokuをインスールしようとしたら、下記のエラーが出ました。

```bash:
[vagrant@localhost ~]$ heroku --version
/usr/local/heroku/lib/heroku/updater.rb:3:in `require': /usr/local/heroku/lib/heroku/helpers.rb:303: syntax error, unexpected ':', expecting ')' (SyntaxError)
...de('utf-8', 'binary', invalid: :replace, undef: :replace).sp...
                              ^
	from /usr/local/heroku/lib/heroku/updater.rb:3
	from /usr/local/heroku/bin/heroku:18:in `require'
	from /usr/local/heroku/bin/heroku:18
```

***

インストールした手順としては、

[Heroku Toolbelt ](https://toolbelt.heroku.com/standalone)のStandaloneからのインストールです。

```bash: 
[vagrant@localhost ~]$ wget -O- https://toolbelt.heroku.com/install.sh | sh
# PATHを通します。
[vagrant@localhost ~]$ echo 'PATH="/usr/local/heroku/bin:$PATH"' >> ~/.bash_profile
# 適応します。
$ source ~/.bash_profile

# インストールされたか、確認してみます。
[vagrant@localhost ~]$ heroku --version
/usr/local/heroku/lib/heroku/updater.rb:3:in `require': /usr/local/heroku/lib/heroku/helpers.rb:303: syntax error, unexpected ':', expecting ')' (SyntaxError)
...de('utf-8', 'binary', invalid: :replace, undef: :replace).sp...
                              ^
	from /usr/local/heroku/lib/heroku/updater.rb:3
	from /usr/local/heroku/bin/heroku:18:in `require'
	from /usr/local/heroku/bin/heroku:18
```

**原因追求**
Rubyのバージョンを確認

```bash:
[vagrant@localhost ~]$ ruby --version
# ちょっと古い？
ruby 1.8.7 (2013-06-27 patchlevel 374) [x86_64-linux]
```

rbenvでRubyのバージョンを2.3.0にあげてみる。
(rbenvについては省略します)

```bash:
[vagrant@localhost ~]$ rbenv install -l
Available versions:
  1.8.6-p383
  1.8.6-p420
  1.8.7-p249
 ~~
  2.3.0

[vagrant@localhost ~]$ rbenv install 2.3.0
~
[vagrant@localhost ~]$ rbenv global 2.3.0
~
vagrant@localhost ~]$ ruby --version
ruby 2.3.0p0 (2015-12-25 revision 53290) [x86_64-linux]

```

herokuを確認してみます。

```bash:
# きちんとインストールされています。
[vagrant@localhost ~]$ heroku --version
heroku-toolbelt/3.43.0 (x86_64-linux) ruby/2.3.0
~
```
レコメンドエンジン(協調フィルタリング)をPHP+Redisで実装


PHPで使えるレコメンドエンジンはいくつか存在しますが、ドキュメント不足だったり、非推奨な関数が使われていたりで満足いくものではありませんでした。

ですので、自分で実装することにしました。

※2016/08/25追記 ライブラリ化しました！
https://github.com/YuzuruS/redis-recommend

packagistに登録もしてあるので、composerを使って簡単にインストールできます。

```composer.json
{
    "require": {
       "yuzuru-s/redis-recommend": "1.0.*"
    }
}
```

### 協調フィルタリング型レコメンドとは？

今回実装する協調フィルタリング型レコメンドとは、Amazonにあるコレ↓です。

![協調フィルタリング.png](https://qiita-image-store.s3.amazonaws.com/0/3962/c9238eb6-1576-28ea-e4fb-4c07fbf606c7.png)


たとえば以下のデータがあったとします。

| 名前 | 本1 | 本2 | 本3 |
|-----------|------------|------------|------------|
|Aさん|1|1|1|
|Bさん|1|1|-|

Aさんが本1、本2、本3を閲覧しました。
Bさんが本1、本2を閲覧しました。

AさんBさんともに本1,本2を閲覧しているので、Cさんが本1を閲覧した時に、本2をレコメンドする。という仕組みです。


上記は数が少ないので見た目で分かりますが、実際のサービスは商品の数が圧倒的に多いので、類似度を計算して高い順からレコメンドします。

### Jaccard(ジャッカード)指数
類似度の計算ではJaccard(ジャッカード)指数を使うのが一般的なようです。

AとBそれぞれを集合とすると、Jaccard(ジャッカード)指数は以下のように定義できます。

```math
Jaccard(A,B) = \frac{|A∩B|}{|A∪B|}
```

この計算式を使って下記のデータを計算すると

- 本1と本2を両方購入した人はEさん1名 (A∩B)
- 本1もしくは本2を購入した人はA,B,C,D,Eの5名 (A∪B)

以上より本1と本2の類似度は0.2になります。

| 名前 | Aさん | Bさん | Cさん |Dさん |Eさん |Fさん |Gさん |
|-----------|------------|------------|------------|------------|------------|------------|------------|
|本1|1|-|1|-|1|-|-|
|本2|-|1|-|1|1|-|-|

### PHP+Redisによる実装
Redisには取り出しやすい便利な型SortedSetがあるのでそれを類似度の保存に使います。

#### 商品閲覧を記録
```addViewer.php

/**
 * $item_id => 商品ID
 * $user_id => ユーザーID
 */ 
$Redis->lRem('Viewer:Item:' . $item_id, $user_id);
$Redis->lPush('Viewer:Item:' . $item_id, $user_id);
$Redis->lTrim('Viewer:Item:' . $item_id, 0, 999); // 1000個以降削除 記録する商品や顧客数が増えると計算量が爆発して死ぬので。

```

#### Jaccard(ジャッカード)指数を計算

```calc.php

/**
 * $item_ids => 商品IDの配列 [1,2,3,4,5]のような配列
 */

foreach ($item_ids as $item_id1) {
	$base = $Redis->lRange('Viewer:Item:' . $item_id1, 0, 999);
	if (count($base) === 0) {
		continue;
	}
	foreach ($item_ids as $item_id2) {
		if ($item_id1 === $item_id2) {
			continue;
		}
		$target = $Redis->lRange('Viewer:Item:' . $item_id2, 0, 999);
		if (count($target) === 0) {
			continue;
		}

		# ジャッカード指数を計算
		$join = floatval(count(array_unique(array_merge($base, $target))));
		$intersect = floatval(count(array_intersect($base, $target)));
		if ($intersect == 0 || $join == 0) {
			continue;
		}
		$jaccard = $intersect / $join;

		$Redis->zAdd('Jaccard:Item:' . $item_id1, $jaccard, $item_id2);
	}
}

```

#### レコメンド商品idの取得
```getRecommend.php
$Redis->zRevRange('Jaccard:Item:' . $item_id, 0, -1);
```


### 参考記事
http://qiita.com/haminiku/items/cdbf8eb488e0cf6a62fe
policy.xmlが使えない古いImageMagickでImageTragickを回避する

インターネット一般を眺めると、ImageTragickの[緩和策](http://www.openwall.com/lists/oss-security/2016/05/03/18)として`policy.xml`で危険なコーダを禁止するという方法が示されている。

[ImageMagickのChangeLog](http://legacy.imagemagick.org/script/changelog.php)によれば、`policy.xml`は、ちょうど七年前、二〇〇九年五月四日に`6.5.2-1`で初めてサポートされたという。

手元のCentOS 5を眺める。インストールされているRPMは`ImageMagick-6.2.8.0-15.el5_8`である。どうして、いまだにCentOS 5なんて使っているのだろう。ビジネスだからだ。ビジネスだったらしかたがない。ともあれ、このバージョンでは`policy.xml`は使えない。やれやれ。

さて、どうしてくれようか。ソフトウェアのバージョンを変えずにやりすごす方法を沈思黙考する。[緩和策](http://www.openwall.com/lists/oss-security/2016/05/03/18)の`policy.xml`を眺める。

``` xml
<policymap>
    <policy domain="coder" rights="none" pattern="EPHEMERAL" />
    <policy domain="coder" rights="none" pattern="URL" />
    <policy domain="coder" rights="none" pattern="HTTPS" />
    <policy domain="coder" rights="none" pattern="MVG" />
    <policy domain="coder" rights="none" pattern="MSL" />
</policymap>
```

すなわち、`EPHEMERAL`,`URL`,`HTTPS`,`MVG`,`MSL`というコーダを禁止している。`EPHEMERAL`は昔は存在していなかったようだ。だとすると、残りの四個を動かなくしてやればいい。

まず、`HTTPS`を禁止しよう。これは`delegates.xml`で禁止してやればよいだろう。手元の環境ではふたつ存在していた。

```
/usr/lib64/ImageMagick-6.2.8/config/delegates.xml
/usr/lib/ImageMagick-6.2.8/config/delegates.xml
```

それぞれの`delegates.xml`から、次の一行を削除する（いっそ`<delegatemap>`の中身を空にしてもよいかもしれぬ）。

```
  <delegate decode="https" command='"wget" -q -O "%o" "https:%M"' />
```

残りの`URL`,`MVG`,`MSL`を設定ファイルでどうにかするのは無理であるように思われた。ありがたいことに、しかし、それらはそれぞれ共有リンクライブラリになっていた。こいつらをどこかに投げやってしまえばよい。

```
/usr/lib64/ImageMagick-6.2.8/modules-Q16/coders/msl.la
/usr/lib64/ImageMagick-6.2.8/modules-Q16/coders/msl.so
/usr/lib64/ImageMagick-6.2.8/modules-Q16/coders/mvg.la
/usr/lib64/ImageMagick-6.2.8/modules-Q16/coders/mvg.so
/usr/lib64/ImageMagick-6.2.8/modules-Q16/coders/url.la
/usr/lib64/ImageMagick-6.2.8/modules-Q16/coders/url.so
/usr/lib/ImageMagick-6.2.8/modules-Q16/coders/msl.la
/usr/lib/ImageMagick-6.2.8/modules-Q16/coders/msl.so
/usr/lib/ImageMagick-6.2.8/modules-Q16/coders/mvg.la
/usr/lib/ImageMagick-6.2.8/modules-Q16/coders/mvg.so
/usr/lib/ImageMagick-6.2.8/modules-Q16/coders/url.la
/usr/lib/ImageMagick-6.2.8/modules-Q16/coders/url.so
```

これにて、とりあえず、PoCは動かなくなった。

【二〇一六年五月六日追記】

[ImageMagick Filtering Vulnerability - CVE-2016-3714](https://access.redhat.com/security/vulnerabilities/2296071)のResolveのRHEL 5のMitigationでは、`mvg.so`, `msl.so`, `label.so`をリネームしている。CVE-2016-3717を防ぐために`label.so`をリネームするというわけみたい。
マクロで関数を生成する


macroを使って関数を定義します。

例としてEmacsから`open`コマンドを使用してデフォルトブラウザでWebサイトを開くサンプルです。

```el
;; パターン1
(defmacro my-create-open-url-fn1 ($fn-symbol-without-quote $url)
  (declare (indent 1))
  `(defun ,$fn-symbol-without-quote ()
    (interactive)
    (shell-command (format "open %s" ,$url))))

;; パターン2
(defmacro my-create-open-url-fn2 ($fn-symbol-with-quote $url)
  (declare (indent 1))
  `(defalias ,$fn-symbol-with-quote
     (lambda ()
       (interactive)
       (shell-command (format "open %s" ,$url)))))

;; パターン1 関数名に quote なし
(my-create-open-url-fn1 my-open-url-cocoapods "https://cocoapods.org")
;; パターン2 関数名に quote あり
(my-create-open-url-fn2 'my-open-url-bing "https://www.bing.com")
```

通常の関数のように使えるようになります。

`M-x my-open-url-cocoapods`
`M-x my-open-url-bing`
SublimeText風のマルチ選択をAndroid Studioでも使いたい

Sublime Textでテキストを選択してCtrl+Dすると、カーソル位置より先にマッチするテキストを探して選択状態を追加し、同時に編集できるようになるという**超便利機能**があります。
(Sublime Textを使ったことのない方は、どういう動作か[Sublime Text公式ページのスクリーンショット動画](https://www.sublimetext.com/)で見てみてください)

このマルチ選択機能をAndroid Studioでも使いたい！と思って調べてみたら[機能としては存在している](https://plus.google.com/+PhilippeBreault/posts/fM1vq4xPpLc)ようでした。
初期設定では *Alt+J* にショートカットキーが割り当てられているようですが、Sublime Textと同じようにCtrl+Dで使えるようにしたかったので設定してみました。

設定は File -> Settings と辿って、 Keymap の中で Main menu -> Edit -> Find -> Add Selection for Next Occurrence という項目を探します。右上の検索ボックスに `occur` 等と入力するとすぐ見つかります。
![1.png](https://qiita-image-store.s3.amazonaws.com/0/56668/8788cc77-b5fa-f020-4325-631bc085e70c.png)
見つけたら右クリックして Add Keyboard Shortcut をクリック。 Ctrl+D を押せばショートカットキーが変更されます。
raspberry pi2を引っ張りだす

掃除してたらほこりをかぶったraspi2を発見。購入したはいいけど、ほとんど使わなかった。いや、まったく使わなかった。可哀想なので、火をいれましょ。そうだ、最近時々見かけるradiko録音をためしてみましょう。

※ 環境はmacっす。

##1)Raspbian(jessie)をインストール
サイトからダウンロード。不安あるなら、md5を確認してもいいかもね。

##2)SDカードをフォーマット
SD Associationのを使うのが吉らしい。昔、デジカメで言うことが聞かないSDカードが生まれたり。そんなときに大活躍だったような気がするけど、今となってはraspiの時にしか使わないね。

##3)SDカードに書き込み
USBは接続、でもunmountされている状態で、
>sudo dd bs=1m if=2016-03-18-raspbian-jessie.img of=/dev/**HOGE**

imgファイルは、DLしたものを。**HOGE**のところは、接続されているデバイス名を。普通はdisk2かな。Disk Utility.appで確認してね。この書き込みは結構時間かかる。我慢できる人でないと、先に勧めない。挫折リスクがここにある。dd終わると、下記のようなメッセージがでる。
>3847+0 records in
> 3847+0 records out
>4033871872 bytes transferred in 290.277467 secs (13896607 bytes/sec) 

##4)SDカードを取り出して、raspi2に差し込み電源入れる
いきなり、Xが立ち上がる。一安心。いやいやさっさと、キーボードとかマウスとかHDMIとか外したいよね。華麗な小型がケーブルで汚れている。泣けてくる。

##5)設定
メニューから設定を選ぶ。CUIの起動が選べるからそれを選ぶ。それと、SDカードの容量を最大限利用できていないという罠があるので、Expand Filesystemをクリックする。CUIだと、raspi-configで設定をいじれる。んで、再起動。

##6)固定IP化
さっさとSSHで他から弄りたい、HDMIとキーボードとマウスをさっさと外したい。自分は有線LANを利用。固定IPの対応は/etc/dhcpcd.confの下部に下記を追記。エディタはviもしくはnanoが動くはず。
>interface eth0
>static ip_address=192.168.0.10/24
>static routers=192.168.0.1
>static domain_name_servers=192.168.0.1

上の例は、固定先が192.168.0.10で、サブネットマスクが255.255.255.0の24bitだった場合のこと。再起動でもすれば、固定化されるはず。

##7)SSHでLAN内から遠隔操作
ターミナルからSSHログイン。僕はmacのiTermを利用。初期設定のママなら
>ssh pi@192.168.0.10

これでログインできる。パスワードはraspberryだね。ま、自宅LAN内なら変更しなくてもいいか。ここはセキュリティの捉え方しだいだね。ま、どうせ、貴重なデータは入れないし、遅いから踏み台にもならないしね。

##8)最新化
>リポジトリのアップデート
>sudo apt-get update

>インストールされているパッケージのアップデート
>sudo apt-get upgrade

>ファームウエアのアップデート
>sudo rpi-update

ときどき、これを行えばいいかな。SDカードのサイズは初期設定のままでは、小さすぎてダメなので、raspi-configのexpand filesystemの設定は大切。上の命令すら容量不足で受け付けない。これで、小型linuxマシンのできあがり。小型は正義だな。radikoは明日かな。
dockerのphp:7-fpm-alpineイメージでCakePHP3を動かす

# dockerのphp:7-fpm-alpineイメージでCakePHP3を動かす

> ※この記事は私の[ブログ](http://nmtysh.hatenablog.com/entry/2016/05/04/234011)でも掲載しています。

PHP7を試すための[docker-compose.yml](https://github.com/matayoshi/docker_cakephp3_tutorial)を作って、CakePHPをいざ試そうとすると色々モジュールが足りなかったり、VirtualBoxでBoot2Dockerを動かしているために発生する問題があったので、その対処のためにイメージをカスタマイズしました。  

このDockerfileで行っていることは、intlとpdo_mysqlモジュールの追加です。
あとVirtualBox固有の問題としてHost側の領域の所有者がvboxfs(user.id=1000, group.id=50)になるため、それに合わせるためにphp-fpmの実行ユーザーを作りなおしています。
(そうしないとCakePHPがtmp領域などに書き込めない)

```Dockerfile
FROM php:7-fpm-alpine
RUN set -x && \
  apk add --no-cache icu-libs && \
  apk add --no-cache --virtual build-dependencies icu-dev && \
  NPROC=$(grep -c ^processor /proc/cpuinfo 2>/dev/null || 1) && \
  docker-php-ext-install -j${NPROC} intl && \
  docker-php-ext-install -j${NPROC} pdo_mysql && \
  apk del --no-cache --purge build-dependencies && \
  rm -rf /tmp/pear
RUN set -x && \
  deluser www-data && \
  addgroup -g 50 -S www-data && \
  adduser -u 1000 -D -S -G www-data www-data
```

後は作成したdocker内に接続してcomposerを通してCakePHP3を展開します。
それ以降はCakePHPの[チュートリアル](http://book.cakephp.org/3.0/ja/quickstart.html)に則って試すことができます。  

```bash
$ docker exec -it cakephp3_phpfpm_1 /bin/sh
/var/www/html # curl -s https://getcomposer.org/installer | php
/var/www/html # php composer.phar create-project --prefer-dist cakephp/app bookmarker
```

-----

###### 関連

- [クイックスタートガイド — CakePHP Cookbook 3.x ドキュメント](http://book.cakephp.org/3.0/ja/quickstart.html)  
- [matayoshi/docker_cakephp3_tutorial](https://github.com/matayoshi/docker_cakephp3_tutorial)
Formtasticでオリジナルinputを作ってみた

## シチュエーション

Formtasticは最初から多数のinput形式が利用可能で、大半の要件はその範囲内で片付きますが、たまにその範囲を逸脱したい場合があり、そのために自作inputを作れるようになっています。この機能を使って、「textareaが2つあるinput」を作ってみました。

## 実装

```app/inputs/double_text_input.rb
class DoubleTextInput < Formtastic::Inputs::TextInput
  def to_html
    # FIXME: gemとかに切り出すときは width:calc(40% - 22pt) というstyleを適用させる
    input_wrapping do
      label_html <<
      builder.text_area(method, input_html_options) <<
      build_second_text_area
    end
  end

  private
  def build_second_text_area
    original_method = method
    self.method = :"#{original_method}_2"
    text_area = builder.text_area(method, input_html_options)
    self.method = original_method
    text_area
  end
end
```

呼ぶときは `f.input :description, as: :double_text` という感じで呼びます。そうすると

```html
<li class="double_text input optional" id="item_description_input">
  <label for="item_description" class="label">Description</label>
  <textarea rows="20" id="item_description" name="item[description]">
  </textarea>
  <textarea rows="20" id="item_description_2" name="item[description_2]">
  </textarea>
</li>
```

こんな感じのhtmlが出力されます。見ての通り、2つ目のtextareaのnameに_2をつけてるだけなので、受け取る方が_2をつけた項目を受け取れるようになっている必要があります。

## 解説

### 概要

[README](https://github.com/justinfrench/formtastic/tree/3.1.3#modified--custom-inputs)に記載の通り、to_htmlメソッドで返す文字列がそのinputの部分htmlとして使用されるので、ここをいじります。
今回は普通のTextInputのtextareaのうしろに2つ目のtextareaを追加しています。
Formtasticのメソッドの切り方に起因して、ちょっと追加する修正でも親クラスのメソッドをコピーして修正するようなやり方が必要になるケースがままあります。

### build_second_text_areaメソッドの処理内容

一時的にmethodというインスタンス変数（[Inputクラス共通でattr_accessorが定義してあります](https://github.com/justinfrench/formtastic/blob/3.1.3/lib/formtastic/inputs/base.rb#L5)）の内容を書き換えています。これには以下の2つの目的があります。

* textareaのname属性（builder.text_areaの第1引数が使われる）が被らないようにすること
* input_html_optionsメソッドの中でmethod変数をtextareaのid属性を構成するのに使っていて、そのままtextareaを出力してしまうと、2つのtextareaのid属性が被ってしまうので、それを避けること
ハッカテンで開発した家族写真撮影のシステム構成

２月に参加したハッカテンで開発した家族写真撮影システムについてのまとめです。

# 「ハッカテン」とは？
ハッカテンは読売テレビの企画で、「オープン・イノベーション」が生み出す無限大の可能性を追究する特別番組で、大阪城と海遊館を舞台に、企画から現地でプロトタイプの発表までを追ったドキュメンタリー番組です。

「ハッカテン」や僕が参加したチームの企画である「おおさかな大学」の全体像については、公式サイトやチームリーダーの記事もご覧ください。5/8まで見逃し配信実施中です。

- [ハッカテン公式サイト](http://www.ytv.co.jp/hackaten/)
- [読売テレビ企画「ハッカテン」で、どのように海遊館をハックしたのか。](http://qiita.com/hal_sk/items/d3c4678a3258790afe93)

# 開発のきっかけ
「きれいな家族写真を撮影してあげたい」という海遊館の方の思いが開発のきっかけです。
館内は展示のために照明が抑えられており、またフラッシュ撮影禁止であるため人物が暗くなりがちです。
その課題を解決するために、人物と水槽を別々に撮影し合成するシステムを考えました。

# 使用した機材
- [OLYMPUS AIR A01](https://olympus-imaging.jp/product/opc/a01/)
- [ヒューマンビジョンコンボ家族目線](http://plus-sensing.omron.co.jp/kazoku-mesen/)
- Raspberry Pi 2

人物と水槽を別々のカメラで同時に撮影するという仕組みが必要であったため、SDKが公開されている OLYMPUS AIR A01 を利用しました。
また、普通に撮影するよりも笑顔の検出をきっかけに撮影をした方が面白いのではと思い、家族目線と組み合わせています。

機材の貸し出しをしていただいたオリンパス様、オムロン様、ヤフー様（myThingsハンズオン用Raspberry Piセット一式）、栄和様（ダンボ＆IoTバッテリー）、改めてお礼申し上げます。

![機材縮小後.png](https://qiita-image-store.s3.amazonaws.com/0/51911/73e81e32-12d5-7adc-5ba5-e7df8f90f923.png)

# 仕組み
家族目線の笑顔検知をトリガーに２台のOLYMPUS AIRで写真を撮影し、その写真を合成します。
２枚の写真はOpenCVを使ってクロマキー合成しました。
人物撮影用と水槽撮影用機材が離れた場所にあり、同一ネットワークにできなかったため、Firebaseを使ってイベントの通知を行っています。





![システム構成.png](https://qiita-image-store.s3.amazonaws.com/0/51911/da166077-6ed2-e6f7-df2a-ce5d60c84e1b.png)

# 開発にあたり悩んだこと
今回の開発で一番悩んだのは、「どうやって２枚の写真を合成するか？」という部分です。
色々と調べていたところ、ガチャピンが消えたというニュースを見つけクロマキー合成を使うこととしました。
[【放送事故】生番組のクロマキー合成でガチャピンが消える珍事発生!!](http://rocketnews24.com/2016/02/05/704964/)

今回はクロマキー合成を使いましたが、撮影用機材の準備、設営が必要なので別の方法で合成できないかと考えています。

ハードウェア制御については、OLYMPUS Air, 家族目線共にサンプルが充実しており、それをベースに開発したため、ほとんど苦労することなく開発できました。自分で書いたコードは全部で300行もないはずです。

開発とは全然関係ないですが、校歌のレコーディングもなかなか大変でした。

# 本番当日
テザリングや自宅WiFiでは問題なく稼働していましたが、当日用に調達したモバイルWiFiルータ経由でRaspberry PiからFirebaseやAWSへ接続することができませんでした。
もう少し時間をかければ解決できたと思うのですが、他の準備もあったので調査を打ち切り、水槽側カメラでのトラブルに備えて事前撮影しておいた水槽写真と合成することで対応しました。


# 感想
家族写真撮影については、本番当日に水槽側システムが使えないという状態になりましたが、「おおさかな大学」に参加していただいたお客様には、用意したコンテンツを楽しんでいただくことができ嬉しく感じています。
当日オペレーションの重要性、電源とネットワークがないとほとんど何もできないということを身をもって学ぶことができました。

現地確認の為に何度も館内をご案内してくだたった海遊館の皆様、撮影・機材調達、その他色々とお世話になった読売テレビの皆様、そして企画から開発まで１ヶ月を共にしたチームの皆様、ありがとうございました。
Webテキスト解析のRubyのGem作った (Gem編) 


開発合宿で作ってみて楽しかったので記事化
社会人はアウトプットが大事ってどっかの偉い人が言ってたし。。。

tf-idfって何？って人はこっち → [tf-idf編のqiita記事](http://qiita.com/nao215/items/b7a1585e2cd254793a31)

Mecabが入ってない人はこっちで入れてください！（Mac） → [Mecabインストール](http://qiita.com/tstomoki/items/f17c04bd18699a6465be)

[GEMのGithubレポジトリ](https://github.com/nao215/analy_z)


## インストール

Gemfileに
 
```Gemfile
gem 'analy_z'
```
と書いて


    $ bundle install

するだけ！！

## 使い方

例：

```ruby
require 'analy_z'

a = AnalyZ::HTML.word_val(file_path, selector)

a.tf          # tf
a.idf         # idf
a.tf_idf      # tf-idf
a.hse_tf_idf  # hse-tf-idf
a.words       # words analy_z analyzed
a.texts       # texts analy_z analyzed
a.sentences   # sentences analy_z analyzed
```


まず`require 'analy_z'`をしてから

`AnalyZ::HTML.word_val(file_path, selector)`

にファイルのパス名とセレクターを渡す。

file_pathの中身には必ず複数のhtmlもしくはテキストファイルが当てはまる正規表現、例えば
`htmls/*.html`みたいなものを渡してください！

selectorはoptionなのでなくても動くけどもちゃんとテキストを解析したい場合余計なものを入れたくないと思うので、例えば解析したい記事のコンテンツのみを抽出する際に使います。

qiitaだとコンテンツ部分は`#main`なのでこれを引数に入れると無駄なフッターとかヘッダーを解析対象から外してくれる。


そうすればちゃんと解析してくれる、はず。。。


## hse_tf_idfってなんだ？

鋭い人は気付いたかもしれないけどhse_tf_idfというのが混ざってる

これは僕が勝手に考えたもので、（tf-idfは結構ありふれてるので。。）

**HTML Semantic Element**の略称
※もうちょいいい名前あると思うのでコメントくださいw

何をしているかというとHTML要素を解析して単語の重要度に影響を与えようというもの

例えばh1タグやh2タグに含まれている単語を他の単語と同じように扱うのはおかしい

フォントサイズや太さがそもそも違って視覚的にそもそも重要度が全然違うのにそれを考慮しないと適切なwebのテキスト解析ができない。

なので今回はhタグの評価を実装　評価は

| tag name   | font-size   | font-weight  | valuation  |
|:----------:|:-----------:|:------------:|:----------:|
| h1         | 2           | 1.75         | 3.5        |
| h2         | 1.5         | 1.75         | 2.625      |
| h3         | 1.17        | 1.75         | 2.0475     |
| h4         | 1           | 1.75         | 1.75       

これをもとに成り立ってる。



計算は単純で、

`重要度 = font-size * font-weight`

で計算している。

他にもcssのfont-sizeやfont-weightをそれぞれ独自で計算、font-colorの目立つ色の重要度を上げるなどを検討中。。。

## まとめ

- hse-tf-idf使うとただのテキスト解析からWebテキスト解析になる,はず
- いい案あったらこちらもコメントください
- プルリク、issue他コメント待ってます
- 最近同期に文句言うなら仕事しろよと言われて辛い
- メディア解析エンジンもこの開発合宿で作ったので解析させてくれるメディアさん募集中！！


Issue,プルリク,他コメントください！！ →　[analy_z](https://github.com/nao215/analy_z)
Pyenv経由でインストールしたAnacondaで仮想環境を作る


## 参考

[公式ドキュメント](http://conda.pydata.org/docs/index.html)

## 仮想環境のセットアップ

仮想環境を作成

```sh
conda create -n hoge anaconda
```

作成した環境を確認

```sh
conda info -e
```

作成した環境へ切り替える

```sh
source activate hoge
```

作成した環境から戻る

```sh
source deactivate
```

以下のエラーが出るはず

```
Error: activate must be sourced. Run 'source activate envname'
instead of 'activate envname'.

Usage: source activate ENV

adds the 'bin' directory of the environment ENV to the front of PATH.
ENV may either refer to just the name of the environment, or the full
prefix path
```

pyenvのactivateコマンドが実行されてしまっているため、
condaのコマンドが実行されるようにフルパスで入力して実行するか、aliasにでも登録しておく

```sh
# .zshrcに追記
# for anaconda activate/deacitvate cmd
alias activate="source $HOME/.pyenv/versions/anaconda3-2.5.0/bin/activate"
alias deactivate="source $HOME/.pyenv/versions/anaconda3-2.5.0/bin/deactivate"
```

作成した環境を削除

```sh
conda remove --name hoge --all
```
Arduino M0 Pro でマルチタスクプログラミング : Zumo

#はじめに

この記事では，TOPPERS/R2CAによる [Zumo Shield](https://www.pololu.com/product/2508)の使い方について説明します．

#Zumo Shieldについて

[Zumo Shield](https://www.pololu.com/product/2508)は，タンク型のロボットを制御可能なAruduinoのシールドです．以下のアクチュエータやセンサーを持っています．

- LED
- ブザー
- 左右モータ
- フォトリフレクタアレイ
- 三軸加速度センサ
- 三軸磁場センサ

[Arduino用ライブラリ](https://github.com/pololu/zumo-shield)も公開されています．Zumo Shieldは，Arduino Uno/Leonardo用に開発されているため，そのままではM0では動作しません．そもそもハードウェアが5VI/Oを前提に作られているので，3.3VI/OのM0で動作するか不明でした．

回路図等を見る限りは3.3VI/Oでも動作することが分かりました．ライブラリも一部変更することでM0で使用出来ることが分かり，R2CAに加えました．

<img width="400" alt="aFullSizeRender.jpg.jpg" src=https://qiita-image-store.s3.amazonaws.com/0/106870/390b2c2f-186f-bf5b-62f0-253386d7293e.jpeg>


# 必要なハードウェア

- [Arduino M0 Pro](http://www.arduino.org/products/boards/4-arduino-boards/arduino-m0-pro) 
- [Zumo Shield](https://www.pololu.com/product/2508)
 - 完成品が[スイッチサイエンス](https://www.switch-science.com/catalog/2075/)や[Tech Share](http://store.techshare.jp/shopdetail/000000000832)で購入可能です．
- XBeeシールド等
 - M0を直接Zumo Shieldに差すとコネクタが干渉してボタンが押しにくくなります．そのため，干渉が少ないシールドで浮かしてやる必要があります．将来的に無線通信をすることを考えて今回はXbeeシールドを使用します．
- Windows PC
 - Windows7とWindows10で動作を確認しています．
- USB(microB)ケーブル
 - ボードには付属していないので用意して下さい．

# ハードウェアセットアップ

ジャンパが2箇所ありますので次の様に設定します．

- フォトリフレクタアレイ
 - 裏側から見て下にDIPを設定します．D2で制御が可能になります．

<img width="400" alt="aFullSizeRender.jpg.jpg" src=https://qiita-image-store.s3.amazonaws.com/0/106870/7baaf72f-7f8a-95ea-9f00-ed5d8f605897.jpeg>


- 本体
 - BuzzerのDIPを32U4の方に設定します．

<img width="400" alt="aFullSizeRender.jpg.jpg" src=https://qiita-image-store.s3.amazonaws.com/0/106870/4b888db5-1b82-7e69-5d44-ac3c187a14bf.jpeg>

最後にM0と他のシールドをZumo Shieldを接続します．下記の写真では，[Xbeeシールド](https://www.switch-science.com/catalog/1972/)に[NCES WiFi ボード](http://homepage3.nifty.com/fpga/files/board/nces_shield/)を付けて使用しています．これにより，Wifi接続も可能となっています．

<img width="400" alt="aFullSizeRender.jpg.jpg" src=https://qiita-image-store.s3.amazonaws.com/0/106870/390b2c2f-186f-bf5b-62f0-253386d7293e.jpeg>

##ソフトウェアセットアップ

ZumoのサンプルはR2CAの以下の場所にあります．

- examples\Zumo\

r2ca_app.cpp内に複数のサンプルが入っており，先頭のマクロのいずれかを有効にすることで動作します．

```examples\Zumo\r2ca_app.cpp
#define BUTTON_BASIC
//#define MOTOR_BASIC
//#define BUZZER_BASIC
//#define GYRO_BASIC
//#define REFLECTANCE_BASIC
//#define COMPASS_BASIC
//#define RELECTORNCE_STOP
//#define ROTATIONRESIST
//#define FORCEUPHILL
//#define LINEFOLLOWER
//#define BORDERDETECT
//#define SUMOCOLLISIONDETECT
//#define MAZESOLVER
```

それぞれのサンプルの内容は次の通りです．

- BUTTON_BASIC
 - ボタンのサンプルです．
- MOTOR_BASIC
 - モーターのサンプルです．
- BUZZER_BASIC
 - ブザーのサンプルです．
- GYRO_BASIC
 - ジャイロによって起動時の方向からの差分を出力するサンプルです．
- REFLECTANCE_BASIC
 - フォトリフレクタアレイの値を出力するサンプルです．
- COMPASS_BASIC
 - 電子コンパスによって向いている方角の角度を表示します．キャリブレーション値は固定値なので，キャリブレーションした方がよいかもしれません．
- RELECTORNCE_STOP
 - 黒い線を見つけると止まるサンプルです．
- ROTATIONRESIST
 - ジャイロを使って常に同じ方向を向くサンプルです．
- FORCEUPHILL
 - 加速度センサを使って坂の上を見るサンプルです．
- LINEFOLLOWER
 - ライントレースのサンプルです．
- BORDERDETECT
 - 相撲リングから出ないように走るサンプルです．
- SUMOCOLLISIONDETECT
 - 相撲ロボットとして動作するサンプルです．
- MAZESOLVER
 - 迷路を解くサンプルです．コースがないため動作確認はしていません．

実行方法は他のサンプルと同様です．


#おわりに
この記事では，TOPPERS/R2CAによる Zumo Shield の使い方について説明しました．今後はWifiを使ってIoTサーバーとの連携等を進めたいと考えています．
wp2txtでハマった話

# 何をしたかったか
　去年あたりから有名な、Word2Vecを触ることになった。

　Word2Vecはどんなものかというと、単語の意味を文脈（単語の前後にある一連の単語）から判断し、100~200次元くらいの空間に射影するのだとか。単語がベクトルを持ち、このベクトルの向きがその単語の意味に相当するので、意味の足し引きなどができるようになるそう。Word2Vecについて詳しくは↓
[米googleの研究者が開発したWord2Vecで自然言語処理(独自データ)](http://qiita.com/okappy/items/e16639178ba85edfee72)

　Word2Vecは文脈から判断するために、分かち書きされた大量の文書データを必要とするそうだ。

　日本語のデータを分かち書きするには、MeCabというアプリケーションが使われる。MeCabは辞書を元に確率的に解析して、文書の中で分けるのに最適な部分を見つけてくるのだとか。辞書にない言葉は認識できないので、分かち書きしたい文書のジャンルによっては、そのジャンルの辞書が必要だ。


　そこで試しにWikipediaのダンプデータから辞書を作ったり、コーパスを作ったりしたい。


　まずwp2txtというrubyのgemを使って、wikiのダンプをパースするのだが、このwp2txtでハマった。以下はその時のメモ代わり。


# 環境
　Windows 8.1上で vagrant + VirtualBox を使って仮想OS Ubuntu14.04 を導入してある。また、UbuntuはPythonが2系なのが気に入らないので、3系の環境をAnacondaで構築。さらにRubyも一応入れてあるところからスタート。
そのときの努力は[ここ](http://qiita.com/daikw/items/a77e5dc69c08f4855c17)。


# wp2txtのワナ
　[本家](https://github.com/yohasebe/wp2txt)(githubレポジトリ)には一行でインストールできると書いてある。

```
$ gem install wp2txt
```

しかしエラー。。。

```
root@ubuntu-1404:/home/vagrant# gem install wp2txt
Building native extensions.  This could take a while...
ERROR:  Error installing wp2txt:
        ERROR: Failed to build gem native extension.

    current directory: /var/lib/gems/2.3.0/gems/nokogiri-1.6.7.2/ext/nokogiri
/usr/bin/ruby2.3 -r ./siteconf20160503-3778-1cu9phe.rb extconf.rb
mkmf.rb can't find header files for ruby at /usr/lib/ruby/include/ruby.h

extconf failed, exit code 1

Gem files will remain installed in /var/lib/gems/2.3.0/gems/nokogiri-1.6.7.2 for inspection.
Results logged to /var/lib/gems/2.3.0/extensions/x86_64-linux/2.3.0/nokogiri-1.6.7.2/gem_make.out

```
ちゃんと読むと、nokogiriとやらで詰まっていること、mkmfがヘッダを見つけられなかったことが分かる。

bundleで入れようとしたり([1](http://qiita.com/nekakoshi/items/98bcdf0137e55a0b2395), [2](http://qiita.com/wwacky/items/8a9eb543171afea90c0a))、なぜかrailsを入れようとしてみたり（wp2txtと同様、nokogiriで全く同じエラーを吐く）したがまあダメ。
[mkmfが無い場合はruby-devをインストール](http://www.xmisao.com/2014/07/06/cannot-load-such-file-mkmf.html)が惜しかったがこれもダメだった。


- 解決
-
結局Stack Overflow（本家の）を読んで解決した。

[Error while installing json gem 'mkmf.rb can't find header files for ruby'](http://stackoverflow.com/questions/20559255/error-while-installing-json-gem-mkmf-rb-cant-find-header-files-for-ruby)

rubyのバージョンを確認すると次の通りだった。

```
root@ubuntu-1404:/# ruby -v
ruby 2.3.0p0 (2015-12-25 revision 53290) [x86_64-linux-gnu]
```

よって

```
root@ubuntu-1404:/home/vagrant# sudo apt-get install ruby2.3-dev
```

とすると、

```
root@ubuntu-1404:/# gem install wp2txt
Fetching: wp2txt-0.8.0.gem (100%)
Successfully installed wp2txt-0.8.0
Parsing documentation for wp2txt-0.8.0
Installing ri documentation for wp2txt-0.8.0
Done installing documentation for wp2txt after 0 seconds
1 gem installed
```

となって解決。
ちなみに、原因はいろいろあるよう。


# その他参考にしたページ
やりたいことが全く同じ
http://eyepodtouch.net/?p=77

wp2txtをこれで知った
http://saiyu.cocolog-nifty.com/zug/2014/02/word2vec-1867.html

青空文庫で試してる例
http://tjo.hatenablog.com/entry/2014/06/19/233949

nokogiriをビルドできない
http://qiita.com/chobi9999/items/7b66677b3bf3da8acc14
Windowsで、Linuxのpython仮想環境を構築するまで。

# 導入： 何番煎じか分かりませんが...
Windowsマシンしか持ってないけれど、Linux環境が欲しくなったので、そのときやったことのメモ。
Pythonの仮想環境もついでに作る。

# 実行環境
    - OS: Windows10
    - CPU: intel core i5
    - memory: 4GB
    
# 背景知識として
ホスト（今回はWindows10）上でVirtualBoxが動き、その上でゲスト（今回はUbuntu14.04）が立ち上がる。
ホスト-ゲスト間の通信はSSHで行うのが一般的。

# 前準備： 各種ツールのインストール
- VirtualBox
- 
仮想化ソフトのうちの一つ。インストーラが以下で入手できる。
[Downloads - Oracle VM VirtualBox](https://www.virtualbox.org/wiki/Downloads)

ホストによってインストーラが違うので注意。今回はVirtualBox 5.0.20 for Windows hosts  x86/amd64　をインストールした。

- Vagrant
-
こいつで仮想環境を管理するとべんり。CLI(Command Line Interface)から扱える。インストーラは以下から。
[Vagrant by HashiCorp](https://www.vagrantup.com/)


vagrant-teraterm
teratermで仮想OSにSSH接続する際に、いちいちポート番号を確認するのが面倒なので、プラグイン作った人がいる。下記をプロンプトで実行してインストール。

```
vagrant plugin install vagrant-teraterm
```

- Packer
- 
OSのISOイメージから、各種設定項目を記述したjson形式のテンプレートファイルを元に、仮想OSイメージを作成する。出力はVMwareで読めるものとVirtualBoxで読めるものを両方作れるが、今回はVirtualBoxだけ。インストーラは下記より。
[Downloads - Packer by HashiCorp](http://www.packer.io/downloads.html)

# 導入手順
1. ISOからBoxを生成
2. Boxから仮想OSを初期化し、仮想OSへSSH接続
4. 仮想OSへPythonの仮想環境を構築

以下詳述。

- 1. ISOからBoxを生成、vagrantに追加
-
[A list of base boxes for Vagrant - Vagrantbox.es](http://www.vagrantbox.es/)
上記に、各種BoxのURLがある。BoxのURLを、以下のようにしてBoxを追加できるが、だれが作っているのか分からないので、安全性に？が付く。なるべく自分で作ることをお勧めする。

```
vagrant box add {title} {url}  //{title}はosの名前で任意
```

Boxを自分で作るには、ISOイメージを落としてきて、これをPackerに投げる。
Packerに投げてBoxを生成するときの各種設定項目は、json形式で与えることができる。このjsonテンプレートは時雨堂が配布してくれている。
https://github.com/shiguredo/packer-templates

Packerの使用法は、下記を参考にした。
[Packerを利用したUbuntu14.04 ServerのVagrant用Boxファイルの作成](http://stupiddog.hatenablog.com/entry/2014/05/22/215516)


- 2. Boxから仮想OSを初期化し、仮想OSへSSH接続
- 
1. でBoxが追加されているなら、

```
vagrant init {title}
vagrant up
```

で初期化、起動できる。一つのディレクトリに一つの仮想OSであることに注意。作りたいディレクトリで初期化を実行する。
初期化には結構時間がかかるが慌てず、放置しておｋ。

起動後は、予め追加しておいたteratermプラグインで、

```
vagrant teraterm
```
で自動的にteratermへSSH接続してくれる。本来なら、いちいちポート番号とパスワードを要求してくるところを、一行でできるようになっている。便利な世の中である。
ちなみに、パスワードはvagrant。

- 3. 仮想OSへpythonの仮想環境を構築
- 
これは非常に簡単で、次を参照した。
[Ubuntu14.04にpyenv,Anaconda,MeCabをインストールしPython3環境構築](http://toukei.runble1.com/ubuntu-python-mecab/)

{version}には、

```
pyenv install --list
```
で確認できるバージョンを入力してあげればおｋ。

```
sudo apt-get install git gcc g++ make openssl libssl-dev libbz2-dev libreadline-dev libsqlite3-dev
git clone https://github.com/yyuu/pyenv.git ~/.pyenv
echo 'export PYENV_ROOT="$HOME/.pyenv"' >> ~/.bashrc
echo 'export PATH="$PYENV_ROOT/bin:$PATH"' >> ~/.bashrc
echo 'eval "$(pyenv init -)"' >> ~/.bashrc
exec $SHELL
pyenv install anaconda3-{version}
pyenv rehash
pyenv global anaconda3-{version}
```

以上。
Webテキスト解析のRubyのGem作った (tf-idfとは？編) 

開発合宿で作ってみて楽しかったので記事化
社会人はアウトプットが大事ってどっかの偉い人が言ってたし。。。
[Gemの使い方は長くなるので別記事へ](http://qiita.com/nao215/items/3ba07e142e38a0b07a53)
[GEMのGithubレポジトリ](https://github.com/nao215/analy_z)

## tf-idfとは??

もうすでに有名かと思われるが一応説明。
知ってる人は飛ばしてください！！

### TF

Term Frequencyの頭文字をとったもの

#### 計算式

tf = 単語の頻度 / 文章中の単語数

#### 説明
"たくさん出てくる言葉ほど重要"を数値化するもの

例えば
`りんごおいしい。りんご好き。りんご神。`

と言う言葉があった場合、６つの単語から成り立つ文書の出てくる単語の回数はそれぞれ
りんご：3, 好き：1, おいしい：1, 神: 1
となる。

よってこのりんごという単語のtfは
3("りんご"が文章中に出てくる回数) / 6（文章中の単語数）
となり、tfは`0.5`となる。

また同様に神という単語のtfは
1 / 6 なので `0.166…` である。

### IDF

Inverse Document Frequencyの頭文字をとったもの

#### 計算式

- idf = log(文章数 / その単語が出てくる文章数)

#### 説明
よく使われる単語は重要ではないと判断するためのもの。
"こと"とか"もの"って重要な単語じゃないからそれを重要語から除くためにある

例えば

【文章１】りんごおいしい。りんご好き。マジりんご大好き。
【文章２】みかんも好き。おいしいよね。
【文章３】なしは普通。おいしいけどね。

という３つの文章があった場合、りんごという言葉の出てくる文章は１つしかない。一方好きという単語の出てくる回数は3である。

つまりりんごという単語の出てくる文章は１、おいしいという単語の出てくる文書は３であるので
りんごという単語のidfは
`log(3 / 1) = 0.477`
であり、"おいしい"のidfは
`log(3 / 3) = 0`

となる。

### tf-idf

tfとidfが計算できたのであとはこれをかけるだけ。
【文章１】りんごおいしい。りんご好き。マジりんご大好き。
【文章２】みかんも好き。おいしいよね。
【文章３】なしは普通。おいしいけどね。

こういう文章が出てきた際に重要語を抽出しようとすると
りんごという単語は
`tf-idf(0.2385) = tf(0.5) * idf(0.477)`
となる。

他の単語も調べてみたい人はGem使ってね(ﾟ∀ﾟ)

https://github.com/nao215/analy_z



## まとめ

### 用語

tf 	= Term Frequency
idf = Inverse Document Frequency

### 計算式

- tf-idf = tf * idf
- tf = 単語の頻度 / 文章中の単語数
- idf = log(文章数 / その単語が出てくる文章数)

### 雑感

tfとかidfは分子や分母に文章数の単語数を取るので、同じ程度の分量の文章じゃないと比較できない？　のかと思った
例えば

`りんごおいしい。`という文章と
`りんごおいしい。りんご好き。マジりんご神`という文章ではtf等しいけど下の文章の方が長い文章で何度もりんごが出てきているのだからより重要なのでは。。。

標準化する仕組みが必要なんじゃないかな
詳しい人コメントください。。。
Android Gradle Plugin 2.1.0にしたらエラーが出たので解消した


Android Gradle Pluginのバージョンを上げたところエラーが。

```gradle
buildscript {
    dependencies {
        classpath 'com.android.tools.build:gradle:2.1.0'
    }
}
```

```
22:12:37 UnsupportedMethodException
         Unsupported method: InstantRun.getRestartDexFile().
         The version of Gradle you connect to does not support that method.
         To resolve the problem you can change/upgrade the target version of Gradle you connect to.
         Alternatively, you can ignore this exception and read other information from the model.
```

なんだろーなと思ってもろもろのバージョンを確認してみたんですが...。
**Android Studioのバージョンを2.1.0にあげてなかっただけでした！！**

よく見るとInstantRun関係のエラーなのでAndroid Studio関係でしたね。一件落着。
【WIP】機械学習ライブラリ比較

|項目|TensorFlow|Chainer|Caffe|
|:--:|:--:|:--:|:--:|
|公式サイト|https://www.tensorflow.org/|http://chainer.org/|http://caffe.berkeleyvision.org/|
|OSS|O|O|O|
|開発元|Google| Preferred Networks|Berkeley Vision and Learning Center (BVLC) |
|対応言語|Python, C++|Python||
|ソフトウェアライセンス|Apache 2.0 open source license|MIT License|BSD 2-Clause license|
|GPU対応|O|O|O|
Jupyter notebook で HTML も自動作成


Jupyter notebook は快適だけれども、昔のノートブックを見るためにサーバーをわざわざ起動させるのが気分的に面倒ということがある。同僚と情報を共有するのに HTML のほうが良いということもあるかもしれない。そういう時のために、自動的に HTML ファイルと py ファイルを保存するようにしておくと便利。

まず、（なければ）設定ファイルを作る。

```bash
% jupyter notebook --generate-config
```

作られた `~/.jupyter/jupyter_notebook_config.py` を開いて

```python
#-----------------------------
# Configurable configuration
#-----------------------------
```

の下にでも

```python
import os
from subprocess import check_call

def post_save(model, os_path, contents_manager):
    """post-save hook for converting notebooks to .py scripts"""
    if model['type'] != 'notebook':
        return # only do this for notebooks
    d, fname = os.path.split(os_path)
    check_call(['jupyter', 'nbconvert', '--to', 'script', fname], cwd=d)
    check_call(['jupyter', 'nbconvert', '--to', 'html', fname], cwd=d)

c.FileContentsManager.post_save_hook = post_save
```

これで、ipynb が作られると同時に同名の html と py (あるいは r など）が作られる。


### 参考
[Jupyter Notebook for Data Science Teams (O'Reilly)](http://shop.oreilly.com/product/0636920044260.do)

http://bit.ly/jupyter_profile

`ipython nbconvert` は古いという警告がでるので、参考元のコードの ipython を jupyter に変更しました。
Dockerで固定IPアドレスを使う。

# Dockerで固定IPアドレスを使う。
最近のDockerでは固定IPアドレスが普通に使えるようになっていたのでメモ。
試した環境はCentOS7です。
## 新しいバージョンのDockerをインストールする。
現在、CentOSのリポジトリにあるDockerが1.9.1と若干古めで固定IPアドレス設定に対応していません。
そこで、dockerオフィシャルリポジトリからインストールします。

まず、リポジトリ設定

    $ sudo tee /etc/yum.repos.d/docker.repo <<-'EOF'
    [dockerrepo]
    name=Docker Repository
    baseurl=https://yum.dockerproject.org/repo/main/centos/$releasever/
    enabled=1
    gpgcheck=1
    gpgkey=https://yum.dockerproject.org/gpg
    EOF

CentOSのリポジトリからインストールしていたらアンインストールする。

    $ sudo yum remove docker docker-selinux

普通にyumを使ってインストール

    $ sudo yum install docker-engine

サービスを起動

    $ sudo systemctl start docker

簡単ですね。

## ユーザ定義ネットワークの作成
デフォルトで用意されているネットワークでは固定IPアドレスオプションが使えないので、
ユーザ定義ネットワークを作成します。

    $ docker network create --subnet=192.168.56.0/24 user_defined_nw
前にVirtualBOX+Vagrantで環境作っていたのでその名残で192.168.56.0/24を使っていますが、ここはお好みで。
細かいオプションは

    $ docker network create --help
で見てください。
## docker run
ユーザ定義ネットワークの作成が完了したら、あとはdocker runするだけです。
ポイントは`--net=`と`--ip=`です。

    $ docker run -it --name test --net=user_defined_nw --ip=192.168.56.100 -d centos:centos6 /bin/bash
## 状態の確認
割り当てられたIPアドレスの確認は

    $ docker network inspect user_defined_nw
もしくは

    $ docker inspect -f "{{ .NetworkSettings.Networks.user_defined_nw }}" test
でてきます。

参考
https://docs.docker.com/engine/installation/linux/centos/
https://docs.docker.com/engine/userguide/networking/work-with-networks/
「end」というカラム名の影響でPostgreSQLだとエラーが発生する

# メモ

- localで動いているtaskが、herokuだと動かなかった
- 「end」というカラム(boolean)を
 ```where('end = ',false)``` という形で用いるとエラーが発生した
- ```where(end: false)``` のように、シンボルで表記するとエラーは発生しなかった

# エラーログ

```
rake aborted!
ActiveRecord::StatementInvalid: PG::SyntaxError: ERROR:  syntax error at or near "end"
```
starmapでPythonでの並列処理の結果をリストで受け取る


## はじめに
- pythonの並列処理といえばmultiprocessモジュール
- 結果がリストで欲しいときは、mapを使う
- しかし、mapでは、複数の引数を渡すことができないみたいです
	- 機械学習等の数値実験用に、引数を色々変えて実験することが多いため、一つはちょっと。。
- Python 2.X では、mapに複数の引数を渡すために、wrapper関数を定義してそれを渡すように記述する必要があったが、Python 3.3 以降は starmapでもっと楽に記述できるようになった
- starmapの使い方の自分メモです

## サンプルコード

```
#!/usr/bin/env python3
from itertools import product
from multiprocessing import Pool

# 並列処理したい関数
def multi_test(arg1, arg2, arg3):
    return(arg1+arg2+arg3)

# 並列数を決めて、Poolを用意
pool = Pool(3)

# 引数のバリエーションをタプルのリストで用意
multi_args = []
for iter1, iter2, iter3 in product(range(1,4), range(1,4), range(1,4)):    
    multi_args.append((iter1,iter2,iter3))
print(multi_args)    
[(1, 1, 1), (1, 1, 2), (1, 1, 3), (1, 2, 1), (1, 2, 2), (1, 2, 3), (1, 3, 1), (1, 3, 2), (1, 3, 3), (2, 1, 1), (2, 1, 2), (2, 1, 3), (2, 2, 1), (2, 2, 2), (2, 2, 3), (2, 3, 1), (2, 3, 2), (2, 3, 3), (3, 1, 1), (3, 1, 2), (3, 1, 3), (3, 2, 1), (3, 2, 2), (3, 2, 3), (3, 3, 1), (3, 3, 2), (3, 3, 3)]

# 並列処理実行
results = pool.starmap(multi_test, multi_args)  
print(results)
[3, 4, 5, 4, 5, 6, 5, 6, 7, 4, 5, 6, 5, 6, 7, 6, 7, 8, 5, 6, 7, 6, 7, 8, 7, 8, 9]
```

## おわりに
- シンプルに記述できた。使い始めたばかりですので、おかしいところは教えてください。

## 参考
- [Python multiprocessing pool.map for multiple arguments](http://stackoverflow.com/questions/5442910/python-multiprocessing-pool-map-for-multiple-arguments)
- [multiprocessing — プロセスベースの並列処理](http://docs.python.jp/3/library/multiprocessing.html)
- [Pythonで並列分散処理（multiprocess）](http://nonbiri-tereka.hatenablog.com/entry/2014/11/25/104714)
Linux環境で共用アカウントを使用する場合にパスワードを使用しない

背景
----

* サーバアプリケーションを動かす環境として、アプリケーション専用アカウントを用意している。
* アプリケーションのメンテナンス作業は複数の担当者が行えるようにしたい。
* 上記担当者にはアプリケーションのメンテナンス作業だけ行えるようにして、システム管理者権限は与えたくない。
* アプリケーション専用アカウントのパスワードの共用はやりたくない。
* そもそも、アプリケーション専用アカウントはログイン禁止にしたい。

環境
----

```sh
$ cat /etc/os-release | grep PRETTY_NAME
```

* `PRETTY_NAME="CentOS Linux 7 (Core)"`
* `PRETTY_NAME="Ubuntu 14.04.4 LTS"`


内容
----

sudoコマンドで`su - アプリケーション専用アカウント`のみ実行できるように設定する。
設定例は以下の通り。

```sh
$ sudo visudo
```
```text:/etc/sudoers
%git ALL=(ALL:ALL) /bin/su - git
```

hogeアカウントを作成する。

```sh
$ sudo useradd -m hoge
$ sudo passwd hoge 
```

hogeアカウントに`su - git`権限を付与する。

```sh
$ sudo gpasswd -a hoge git
```

gitアカウントのパスワードログインを禁止する。

```sh
$ sudo moduser -L git
```


補足
----

`sudo su - git`権限の付与はシステム管理者の特権になりますが、`sudo su - git`権限を持つ人が`~git/.ssh/authorized_keys`に公開鍵を登録することで、SSHログインを許可することができるため、これを防ぐ世為にはgitアカウントで公開鍵認証を禁止する必要があります。設定は以下の通り。

```conf:/etc/ssh/sshd_config
Match User git
  PubkeyAuthentication yes
```

※SELinuxで制限かけたほうがよさそうな気がするけど、やり方わからん。気が向いたらそのうち調べる。
【なんか】投函専用FTPサーバのプロトタイプ【できた】

TL;DR
---

- できあがりはこちら → [koshigoe/transpotter](https://github.com/koshigoe/transpotter)
- ProFTPD を採用
- FTP, SFTP に対応
- 投函専用 = put-only = アップロードされたファイルは S3 に転送して抹消
- FTP アカウントは DB テーブルを使って認証
- FTP アカウントを WebAPI 経由で管理できる様にした
- ホストを disposable にできている、気がしている(FTP サーバ機能については)
- DNS ラウンドロビンを雑に試した


未解決
----

- PUT 乱発による S3 破産問題
- ディレクトリの上限問題
- Vagrant で検証している時に FTP だけ `SQLUserInfo` が効かなくなった問題(VM を作り直したら解決したが……)
- 本当にこんなものが必要なのか問題


感想
----

何か書けるかなと思いましたが、普通に ProFTPD を使っているだけなので特に書く事がありませんでした。ひとまず、試作品の披露くらいはしておこう、という思い出 Qiita です。

ProFTPD について今回得た知識をひねり出すと↓くらいでしょうか。

- `Global` ディレクティブ内で宣言したディレクティブは `VirtualHost` などに引き継がれる(設定の共通化)
- `VirtualHost` ディレクティブでホスト名を使った場合、起動時に名前解決できないと起動に失敗する
- mod_exec モジュールで実行するコマンドの実行時の環境変数はまっさら
    - `/etc/environment` とか systemd の `EnvironmentFile` とかが使えるのかと思いましたがそんな事は無く
- mod_exec モジュールで実行したコマンドの標準出力、標準エラーがどこにいくのかよくわかってません

正直、本題よりも itamae と戯れていた思い出の方が強いのですが、itamae について書けることも特になく。

敢えて挙げるとすれば、[`itamae ssh` に ssh_config のパスを指定するための `--ssh-config` を追加する PR](https://github.com/itamae-kitchen/itamae/pull/211)を送った事くらいでしょうか。ただ、 `-F` オプションのネーミングセンスについて指摘をもらって修正したら、急に CI が通らなくなりました。塩漬け濃厚です。bundle の man ページが開いてキー入力待ちになって wercker がタイムアウトするとか、何が起きているのかよく分かりません。ローカルで再現できるなら調べようもあるのですが。

そんな感じです。


おまけ：思い出
---

- [ELBはなんでもロードバランスできると聞いたのでFTPしてみる - Qiita](http://qiita.com/koshigoe/items/7e4e9466e821df547192)
- [【写経】vsftpd のバーチャルユーザを使ってみる - Qiita](http://qiita.com/koshigoe/items/9060ad685903b069200b)
- [【写経】ProFTPDでバーチャルユーザ - Qiita](http://qiita.com/koshigoe/items/b506e187f06e24ae2c43)
- [Pure-FTPd の存在を知ってしまったので試さざるを得ない - Qiita](http://qiita.com/koshigoe/items/92aaf30966dfe65be85f)
- [ProFTPD の HiddenStores で atomic なアップロード - Qiita](http://qiita.com/koshigoe/items/6b577510e29e836ba77d)
MySQL ver5.7でrootのパスワードを忘れた場合の再設定方法

# MySQL ver5.7でrootのパスワードを忘れた場合の再設定方法

下記の方法でOK
1. MySQLを停止
2. MySQLをセーフモードで起動
3. mysql DBを使用
4. パスワード変更
5. FLUSH PRIVILEGES;

```
[root@vagrant-centos65 log]# service mysqld stop
[root@vagrant-centos65 log]# mysqld_safe --skip-grant-tables &
mysql> use mysql;
mysql> UPDATE mysql.user
    ->     SET authentication_string = PASSWORD('新パスワード'), password_expired = 'N'
    ->     WHERE User = 'root' AND Host = 'localhost';
mysql> FLUSH PRIVILEGES;
```

公式サイト
https://dev.mysql.com/doc/refman/5.7/en/resetting-permissions.html
読書しよう、読書

# 世間では読書なんていらないなんてこともたまに言われますが
そうは思わない。
本というのは知識はさることながら、時間まで凝縮されてる。
自分でやったら1年かかることでも本を読んだら数時間で知識を手に入れられる可能性がある。
なのに読書しないなんてもったいないよ。

# いつ読めばいいの？
読む時間なんてそこら中に転がってる。
朝活、通勤、ランチ、帰宅時……。
昔の上司は常に文庫をポケットに忍ばせておいて、ちょっとした休憩に読んでいた。
技術書は大きいものが多いので難しいけど、最近は電子書籍をスマホで読む、という選択肢もとれる。
ちょっとした待ち時間にどんな本でも読めるのはスマホの利点だ。

# 読んでも覚えられない……
もし、そんな理由で読書を辞めている人がいるなら、そんなことは気にしないでいいんだ。
誰だって一回読んだくらいじゃ本の内容なんて完璧に (いや、ほとんど) 覚えてられない。
印象に残るのなんてほんの数行、ひと言……そんなもんだ。

もちろん世界には本当に一回読んだだけで覚える人もいるかもしれないが、他人は他人。
書評とかをまとめている人たちは、メモを取って紹介したい場所を外部に記憶しているだけ。覚えていられないんだから、メモっておけばいいというわけだ。

# ただし何度も読む
同じ本を繰り返し読むのは正直しんどい。流し読みでもしんどい。
だから同じ分野の本、同じ人が書いている本を数冊読む。
同じ人が書いた同じテーマの内容でも、たとえ話や別確度からの内容が書かれていることがよくある。
そうやって同じようなテーマの本を3～5冊読めばおぼろげながら (もしくはかなりはっきりと) いろいろ掴めてくるはずだ。


# 技術書読むの？
まずは興味のある分野の本を手に取ろう。
自分がやりたい開発の本じゃなくても構わない。
私の場合、結構デザインの本とか仕事術、自己啓発と幅広く読んでいる。
自分が興味があるなら何でも片っ端から読んでいけばいい。


# 気楽に読もう
どんな本でも気楽にいこう。
つまらなかった次にいっちゃえばいい。

本の読み方にコレってことはない。
とにかく、流し読みでも何でもいいから気楽にいこう。
MacからCentOS7へSSH接続するためにやった事

CentOS7(RHEL7)からsystemctlコマンド(systemd)とfirewall-cmdコマンド(firewalld・・内部的にはiptablesらしい)が一級市民になってるので慣れないといけない。

# ポート番号の変更

49152とかに変更する。セキュリティのためというより、そのままだと/var/log/secureが見づらくなるというのが私の動機として大きい。

### firewalldの設定
http://qiita.com/DQNEO/items/5780d81b2e0af4cc1544

### /etc/ssh/sshd_config

```shell-session
Port 49152
```

# クライアント(Mac)側で鍵生成

```shell-session
cd .ssh
ssh-keygen -t rsa -f hoge
scp ~/.ssh/hoge.pub username@servername:
```

# クライアント(Mac)側で接続設定

```shell-session
cd .ssh
vi config
```

```
Host hoge
 HostName servername
 Port 49152
 User username
 IdentityFile ~/.ssh/hoge
```

# サーバ(CentOS)側で鍵登録

```shell-session
ssh servername
cat hoge.pub >> .ssh/authorized_keys
```

# SSH2のみ許可

/etc/ssh/sshd_config

```shell-session
Protocol 2
```

# 公開鍵認証のみ許可

/etc/ssh/sshd_config

```shell-session
PasswordAuthentication no
GSSAPIAuthentication no
```

# rootでの接続を禁止し、特定のユーザのみSSH接続を許可

/etc/ssh/sshd_config

```shell-session
PermitRootLogin no
AllowUsers username
```

# 再起動

```shell-session
systemctl restart sshd
```
再起動後、接続確認がとれるまでは既存セッションを切らないほうが良い。
Jupyter notebook で R を使う (IRkernel)


依存関係を良きにはからってくれないので、メモ。

まずは zmq をインストール:

```bash
% brew install zmq
```

R に入って、rzmq をインストール:

```R
> install.packages("rzmq")
```

このふたつを入れれば、[IRKernel](https://github.com/IRkernel/IRkernel) の公式の方法でインストールできる:

```R
> install.packages(c('repr', 'IRkernel', 'IRdisplay'),
repos = c('http://irkernel.github.io/', getOption('repos')))

> IRkernel::installspec()
```

Jupyter notebook を起動すると、右上の　New から R を選べるようになっているはず。

![screenshot.png](https://qiita-image-store.s3.amazonaws.com/0/63210/07aea1bb-06fa-7857-e60b-a21eaf112429.png "screenshot.png")

## 蛇足

### Bash 

```bash
% pip3 install bash_kernel
% python3 -m bash_kernel.install
```

### Javascript


```bash
% brew node
% npm install -g ijavascript
```

一度は

```bash
% ijs
```

で Jupyter notebook を起動。
踏み台経由でMySQLにアクセスする方法、多段sshトンネリング

# 多段sshトンネリングしてみるｗ
[踏み台経由でMySQLにアクセスする方法、sshトンネリング](http://qiita.com/murachi1208/items/fae39969d1288a9f1b1b) で作った環境で、多段sshトンネリングしてみる。メリットは、php, java で直接MySQLにアクセスできるようになるので（PDOで、sshトンネリングする方法が判らなかっただけですｗ）いいかなと。

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/5440cb8e-bb45-8916-f75e-083df5722343.png)

矢印が間違っていたら指摘してくださいｗ

# windowsのコマンドでssh使うお
コマンドラインで「ssh」が使えればいいので、手っ取り早いのは [msysgit をインスコ](http://d.hatena.ne.jp/xyk/20130920/1379659991)する。open-ssh 入るなうｗ

で、Git Bash を立ち上げます（Cygwinみたいだけど）。ssh コマンドを使えるか確認しておきます。

## 段階的にコマンドを実行する

192.168.11.119:22 <--> localhost:30022 にsshトンネリングする。

```
$ ssh -L 30022:192.168.11.119:22 -fN vagrant@192.168.11.118
vagrant@192.168.11.118's password:
```

192.168.11.121:3306 <--> localhost:30023 にsshトンネリングする。

```
$ ssh -L 30023:192.168.11.121:3306 -fN -p 30022 vagrant@localhost
vagrant@localhost's password:
```

## A5:SQL Mk-2 でアクセスしてみる

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/1c0b8a98-9d93-da1f-9bf3-ff99e87c6eb1.png)

きたー

## PDO 経由でもｗ
phpで当然のことながらｗ

```
$dsn = 'mysql:dbname=mysql;host=localhost;port=30023';
$user = 'root';
$password = '';
 
try{
    $dbh = new PDO($dsn, $user, $password);
}catch (PDOException $e){
    print('Error:'.$e->getMessage());
    die();
}
```

できたー

# 参考にさせて頂きました
> [多段ローカルポートフォワード（PostgreSQL接続）](http://yanor.net/wiki/?SSH%2F%E5%A4%9A%E6%AE%B5%E6%8E%A5%E7%B6%9A%2F%E5%A4%9A%E6%AE%B5%E3%83%AD%E3%83%BC%E3%82%AB%E3%83%AB%E3%83%9D%E3%83%BC%E3%83%88%E3%83%95%E3%82%A9%E3%83%AF%E3%83%BC%E3%83%89%EF%BC%88PostgreSQL%E6%8E%A5%E7%B6%9A%EF%BC%89)
> [teratermを使用した多段ssh転送Add Star](http://d.hatena.ne.jp/jranar/20120317/1331962461)
sidekiqでログローテーション

sidekiqのログをローテーションさせる方法をネットで調べると、USR2シグナルを送るべしという情報を見つけることができます。中でも以下のサイトは、そのものズバリのコンフィグが用意されていました。

[Sidekiq で logrotate を使うときは USR2 シグナルを送る](http://yamayo.github.io/blog/2014/07/03/sidekiq-logrotate-usr2/)

ただ残念ながら、多分コンフィグにバグがある（`test -s $pid`ではなく`test -s $sidekiq_pid`）と思われます。実際試してみると、修正前ではうまくローテーションされず修正後だとローテーションされました。

なので、修正したスクリプトを以下に記しておきます。

```sh:/etc/logrotate.d/my_rails_app
/data/my_rails_app/shared/log/*.log {
  daily
  missingok
  rotate 10
  size 10M
  dateext
  notifempty
  copytruncate

  compress
  delaycompress

  lastaction
    unicorn_pid=/data/my_rails_app/shared/tmp/pids/unicorn.pid
    test -s $unicorn_pid && kill -USR1 "$(cat $unicorn_pid)"

    sidekiq_pid=/data/my_rails_app/shared/tmp/pids/sidekiq.pid
    test -s $sidekiq_pid && kill -USR2 "$(cat $sidekiq_pid)"
  endscript
}
```
踏み台経由でMySQLにアクセスする方法、sshトンネリング

# 踏み台経由のMySQLアクセス
クラウド上にWebサーバー・MySQLサーバーがある場合、通常はMySQLサーバーに直接アクセスするこができないようにセキュリティ上するわけで、でも開発者はアクセスしたい訳ですよ。そんなとき、踏み台経由でMySQLサーバーにアクセスするーっていうのが一般的ですよね。

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/637ddf86-64fe-8c44-ca68-6c3a157d6626.png)

と、そんな状況になったのでまた自分メモですｗ

# sshトンネリングを使って、A5:SQL Mk-2 でアクセスしてみる方法
とりあえず TeraTerm だったら誰でもインスコしてそーなのでsshトンネリングしてみる。

「矢印方向」アドレスのみ受け付けるようFWを設定し疑似環境をvagrantで用意する。
MySQLのユーザ「root」は、192.168.11.119 からのみ受け付けるって設定をしておく。

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/943fcc4b-dcc3-6712-5df7-351c4496a1f2.png)

## TeraTerm のssh転送設定
メニューから「設定」-「SSH転送」を選択し押下、追加ボタンを押下し、SSHポート転送で画面のとおり入力し OKボタンを押下する。

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/11227e0a-fadd-88e4-3ce9-3ef493940265.png)

## 踏み台サーバーにアクセス
踏み台サーバー(192.168.11.118)にログインする。コマンドラインで以下を実行し、119.168.11.119 サーバにアクセス＆SSHトンネリングを開始する。

```
$ ssh -C -N -L 20022:localhost:22 192.168.11.119
```

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/c1a8c843-e33d-103e-95fa-49dcfa7f7bfa.png)

このままの状態にしておきつつ、別のTeraTermを立ち上げ localhost:20022 にアクセスしてみる。
id/pw 聞かれるが、192.168.11.119 にログインできることが確認できる。

## A5:SQL Mk-2 でアクセスしてみる
ssh2トンネルのタグで、踏み台サーバ経由でsshトンネリングしlocalhost:20022に割り付けてあるのでそれを指定する。

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/4cb0755c-b00b-3e6b-2691-bbb2eb0ec250.png)

基本タグは、接続したいアドレス(192.168.11.121)を指定する。sshトンネリングしているので踏み台から、接続先のDNSが引ければDNS名でもよい。

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/0850c110-90ed-c8a7-7c36-640e7c5b202f.png)

## 以上！
アクセスできたーｗ
Matt-Esch/virtual-dom で HTML を encode せずに表示する

# 問題

[Matt-Esch/virtual-dom][] 2.1.1 を使用している状況で、HTML を encode せずにそのまま表示したい。

# 解決策

`VNode` の `innerHTML` 属性を使う。[公式の document に書いてある](https://github.com/Matt-Esch/virtual-dom/blob/v2.1.1/docs/vtext.md#html-injection)

[Matt-Esch/virtual-dom]: https://github.com/Matt-Esch/virtual-dom
jupyter触ってみた

#Ipythonを使ってみた

###Ipython NoteBook(jupyter)の使い方

##1. Ipythonの立ち上げ
	
	```
	$ ipython
	```
	terminal上でと打ち込むと
	
	```
	$ ipython
	Python 3.5.1 |Anaconda 2.5.0 (x86_64)| (default, Dec  7 2015, 11:24:55)
	Type "copyright", "credits" or "license" for more information.
	
	IPython 4.0.3 -- An enhanced Interactive Python.
	?         -> Introduction and overview of IPython's features.
	%quickref -> Quick reference.
	help      -> Python's own help system.
	object?   -> Details about 'object', use 'object??' for extra details.
	
	In [1]:
	```
	
	
このように出てくる
ここでいつも通りpythonのインタラクティブモードと同じように使える
	
##2. Ipython notebook(jupyter)の立ち上げ


teminalで入力
	
	```
	$ ipython notebook
	[I 18:53:37.307 NotebookApp] The port 8888 is already in use, 	trying another random port.
	[I 18:53:37.373 NotebookApp] Serving notebooks from local 	directory: /Users/hoge/test
	[I 18:53:37.374 NotebookApp] 0 active kernels
	[I 18:53:37.374 NotebookApp] The Jupyter Notebook is running at: 	http://localhost:8889/
	[I 18:53:37.374 NotebookApp] Use Control-C to stop this server 	and shut down all kernels (twice to skip confirmation).
	```


こんな感じにteminalがなる
そしてブラウザ上にjupyterが起動する
	


![スクリーンショット 2016-03-03 18.54.24.png](https://qiita-image-store.s3.amazonaws.com/0/89142/0962b614-51cd-56ef-e38d-73c924d7c8d0.png "スクリーンショット 2016-03-03 18.54.24.png")

次に1.と同じような画面を出します

![スクリーンショット 2016-03-03 19.10.01.png](https://qiita-image-store.s3.amazonaws.com/0/89142/0a43379f-3c2b-73a2-5c65-775c356ab053.png "スクリーンショット 2016-03-03 19.10.01.png")
Notebooksのところのpythonのバージョンが書いてあるところをクリック
ここでは、 *python3* をクリック

![スクリーンショット 2016-03-03 19.13.27.png](https://qiita-image-store.s3.amazonaws.com/0/89142/efcec868-c099-4e30-3afa-f6760eff6312.png "スクリーンショット 2016-03-03 19.13.27.png")
このようになり、ここで、pythonのコードを打ち込み作業をしていきます
書いたものは自分のipython notebookを起動したディレクトリに保存されていきます
ブラウザ上で実行とセルフやしを同時に行うには[ *Command + return* ]で可能です

終了するときは [ *Command + C* ] で終了できる。