OmniAICreator/Qiita-1.07M huggingface dataset:
HighchartsとData Tablesを使ってみた

Qiitaでは初めての記事です。

Wordpressでこれまで自分のブログを書いてました。

人工知能スタートアップ取締役 橋崎良哉のブログ
http://yoshiyah.com/

基本的には人工知能やVR/AR、IoT、チャットボットみたいなところの潮流を能動的に追いかける＆自分の脳の体操ということもあり、新規事業や新規取り組みのアイデアをひたすら考える、ということをやって記事にしています。

で、最近プログラミングを始めたので、技術系の話はQiitaで書いていければと思って初投稿。

会社でも、ビジネス側をまるっと担当していて、プログラミングについては具体的な中身を分かっていなかったということもあり、
技術ブログの書き方があんまり分かってませんｗ

ゆっくり慣れていければ、という感じで進めていきます。


ということで、初稿は既存ブログの転載＋追記で。

------------------------------------------------------

プログラミングに関しての前回の記事はこちら。

http://yoshiyah.com/2016/09/19/%E3%80%90%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E3%80%91%EF%BC%88%E8%B6%85%E7%B0%A1%E5%8D%98%E3%81%AA%EF%BC%89web%E3%82%A2%E3%83%97%E3%83%AA%E9%96%8B%E7%99%BA%E3%82%92/

で、今開発を進めているのが、以下のサイトです。

https://herokucards.herokuapp.com/cardsapp/template/

Python、Django、開発環境はMySQL、Heroku（PostgreSQL）で作っていて、
ブログの題材である新規事業/アイデアを考えていくためのwebアプリ、ということで随時機能を追加していっています。


今回は2点追加で実装しました。


<strong>1,Highchartsで事業評価をバブルチャートにして見える化</strong>

<strong>2,Data Tablesを用いて、これまでの事業アイデアをソート、検索、なども出来るテーブルで一覧で見れるように</strong>

&nbsp;

という形です。

まあどちらもテンプレート/プラグインのカスタマイズをしているだけなので、

難しい話ではないのですが、また色々はまりつつも実装出来ました。

&nbsp;
<h3>1,Highchartsで事業評価をバブルチャートにして見える化</h3>
![image](https://qiita-image-store.s3.amazonaws.com/0/82726/52f64596-bdaf-54e4-8898-c4a6f0f36f1f.png)


上記図のようなバブルチャートを作成しました。

&nbsp;

このブログで書いた記事を

・X軸：事業開始の気軽さ（コスト量、投資回収期間）

・Y軸：市場の魅力度（収益性、競争優位性）

・バブルの大きさを市場規模

として、XYは独自に評価をしつつ、バブルチャートとしてプロット出来るようにしてみました。


データ形式をJSONでやるということで、

データそのものは事前にMySQLに投入しておき、DjangoのREST frameworkを使って、

JSON形式でDBの内容を吐き出す、という流れを作り、

HighchartsでJSONのデータを受け取ってバブルチャートに出す、

ということをやりました。

Hightcharsのバブルチャートのデモは以下から。

http://www.highcharts.com/demo/bubble

基本デモのものをそのまま使ってて、多少色や項目を変えた程度です。

&nbsp;

【参考にさせてもらった記事】

<a href="http://qiita.com/kimihiro_n/items/86e0a9e619720e57ecd8" target="_blank">http://qiita.com/kimihiro_n/items/86e0a9e619720e57ecd8</a>

http://racchai.hatenablog.com/entry/2016/04/12/Django_REST_framework_%E8%B6%85%E5%85%A5%E9%96%80

http://flame-blaze.net/archives/4999
&nbsp;
<h3>2,Data Tablesで<strong>これまでの事業アイデアをソート、検索、なども出来るテーブルで一覧で見れるように</strong></h3>
![image](https://qiita-image-store.s3.amazonaws.com/0/82726/c02e54f6-ec1a-ec5b-eef2-a126411121ca.png)

テーブル上に一覧化されていて、それを検索出来るものを作りたかったところ、

ソート機能までついてきて非常に便利なData TablesというJqueryのプラグインを見つけました。

前述のJSONのデータをそのままData Tablesに渡して完成。

URLのところが横に間延びしてダサいので直したいのですが、

とりあえずやりたかったことは実現出来たのでよかったかなと。

&nbsp;

【参考にさせてもらった記事】

http://qiita.com/nissuk/items/7ac59af5de427c0585c5

&nbsp;


ということで、次は、スクレイピングをやりたい。頑張ります。
EmacsでSQL文を整形する

## はじめに

[SQL文を整形する](http://qiita.com/sambatriste/items/2ff0d39d5070f4e9c3e4)という記事を書きました。
なぜこんなことがしたいかというと、Emacs上でSQL文を整形したいからです。

Emacsには`shell-command-on-region`という関数があります。

これは、リージョン内のテキストを標準入力に渡して外部プログラムを実行します。
そして、その結果でバッファを書き換えることができます。

これを利用してSQL文の整形をEmacs上で行うことができます。

## 前準備

SQLを整形する外部プログラムを用意します。
標準入出力が使えればなんでもいいのですが、ここでは[前述の記事](http://qiita.com/sambatriste/items/2ff0d39d5070f4e9c3e4)で作成した拙作(といってもライブラリを呼び出すだけ)のsql-formatterを使用します。Java(JRE)が必要です。

https://github.com/sambatriste/sql-formatter/tree/master/binary からjarをダウンロードします。

~/.emacs.dに置いてまとめてバージョン管理しておくのが良いと思います。

## 設定

init.elに以下のように記述します。

```lisp
;;; SQL文の整形をする設定
;; 実行する外部コマンド
(setq sql-format-external-command
  (concat "java -jar " (expand-file-name "~/.emacs.d/lib/sql-formatter-1.0.0-jar-with-dependencies.jar")))

;; SQL文をフォーマットする関数
(defun my-format-sql ()
  "バッファまたはリージョン内のSQL文を整形する。"
  (interactive)
  (let (begin end)
    (cond (mark-active
           (setq begin (region-beginning))
           (setq end (region-end)))
          (t
           (setq begin (point-min))
           (setq end (point-max))))
    (save-excursion
      (shell-command-on-region
       begin
       end
       sql-format-external-command
       nil 
       t ; replace buffer
       ))))

;; キーバインド設定
(with-eval-after-load "sql"
  (define-key sql-mode-map (kbd "C-S-f") 'my-format-sql))
```

`shell-command-on-region`関数の第3引数を変更すれば、他の外部プログラムでも同じことができます。

## 実行

以下のようなバッファがあるとします。

```sql
SELECT * FROM HOGE WHERE HOGE.FUGA = :fuga
```


こののバッファ(sql-mode)で`C-S-f`または`M-x my-format-sql`とします。


そうすると、バッファの中身が、

```sql

    SELECT
        * 
    FROM
        HOGE 
    WHERE
        HOGE.FUGA = :fuga 
```

のようになります。

リージョン指定している場合は、その範囲だけが整形されます。
自分用CSSメモ③

#フォーム関連のタグ
-　入力されたデータそ送信するために必要なURLなどの設定情報を指定する`<form>`タグ
-　閲覧者が操作できるコントロールを表示するためのタグ
`<input>`,`<textarea>`,`<select>`タグ

####`<input>`タグはtype属性の値によって様々なコントロールを表示可能
ex.
`<input type="text">`=><input type="text">
 
また、すべてのコントロールはname属性を持つ。

#`<form>`タグ
`<form>`タグはフォーム領域を作成すると同時に、入力された内容を送信する先のURLを指定する役割を果たす。

method属性 => HTTPメソッドの種類？　要出典
action属性 => 送信先URL

#プルダウンメニュー
プルダウンメニューは`<select name="hoge">`タグと`<option value="hoge">`タグを組み合わせる。
`<select name="hoge">`の子要素としては、選択肢の数だけ`<option value="hoge">`を含める。
それぞれname,value属性は必須

```contact.html
<div>
      <select name="kind">
        <option value="reservation">パーティの予約について</option>
        <option value="contact">一般的な問い合わせ</option>
      </select>
    </div>
```

#ラジオボタン
同じ質問に対する選択肢は同じname属性にしておくことが必要
value属性は必須
片方にはchecked属性を追加してある。これはデフォルトの値を指定するため。


```contact.html
<div>
      はじめてのお問い合わせですか？<br>
      <input type="radio" name="first" value="yes" checked>はい
      <input type="radio" name="first" value="no">いいえ
    </div>
```
#チェックボックス
同じ質問に対する選択肢は同じname属性にしておくことが必要。
value属性は必須。

```contact.html
<div>
      当カフェをお知りになったきっかけは?<br>
      <input type="checkbox" name="how" value="friends">知り合いの紹介で
      <input type="checkbox" name="how" value="magazine">雑誌・Webサイトで見て
    </div>
```

#テキストフィールド
改行はできない。

```contact.html
<div>
      お問い合わせの件名<br>
      <input type="text" name="subject" value="お問い合わせ">
</div>
```

#テキストエリア
複数行の入力が可能。
name属性は必須だが、value属性は存在しない。
デフォルトの値を入れておきたい時は
`<textarea name="hoge">デフォルト値</textarea>`とする。


```contact.html
<div>
      お問い合わせの具体的な内容<br>
      <textarea name="message"></textarea>
</div>
```

#送信ボタン
```contact.html
<input type="submit" id="title" name="submit" value="送信">
```

#ラベル
`<label>`タグとコントロールを関連付けるには2つの記述法がある。

####1.for属性とid属性に同じ値をつける
プルダウンメニューにラベルを付加する

`<label>`タグのfor属性には関連するコントロールのid属性と同じものをつける。ただし、`<label>`タグでコントロールを囲むときはfor属性はつけない。

####2.コントロールやラベルのテキストごと`<label>`タグで囲む
どのコントロールとも関連づいていない`<label>`タグを記述することも可能。

```contact.html
<div>
      <label>当カフェをお知りになったきっかけは?</label><br> /* どのコントロールとも関連付けられていない */
      <label><input type="checkbox" name="how" value="friends">知り合いの紹介で</label>
      <label><input type="checkbox" name="how" value="magazine">雑誌・Webサイトで見て</label>
    </div>
    <div>
      <label>お問い合わせの件名<br> /* テキストフィールドと関連づいている */
      <input type="text" name="subject" value="お問い合わせ">
      </label>
    </div>
```

#属性セレクタ
タグの属性や値を判断する。
`input[name=subject]` =>`<input>`のうちname属性値が"subject"の要素にマッチする。つまり、以下の部分

```contact.html
<div>
      <label>お問い合わせの件名<br>
      <input type="text" name="subject" value="お問い合わせ">
      </label>
    </div>
```

`input[type=submit]`　=>`<input>`のうちtype属性が"submit"の要素、すなわち送信ボタンにマッチする。


```style.css
/* contact.html */
form div {
  padding: 12px;
  border-bottom: 1px dashed #d6c2b5;
}
select{
  width: 30em;
}
label {
  color: #442220;
}
input[name=subject] {
  width: 30em;
}
textarea {
  width: 30em;
  height: 6em;
}
input[type=submit] {
  margin: 20px 12px;
  width: 30em;
}
```
sinatraをサブディレクトリ（sub uri）で動かす

#先に結論

sinatraに飛ばすloationの中で、リクエストURIルートを差し替えておく。
以下、ningx.confの抜粋

``` 
location /subdir/ {
  rewrite /subdir/(.*) /$1  break; #ここでURLを差し替える
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  proxy_set_header Host $http_host;
  proxy_pass http://supapp;  #upstream で定義したドメインソケットにプロキシ
}
```

# こう書いていいこと

`http://domain/subdir/`

とアクセスされても、

`get '/' do`

で、受け取れるようになる。配置するディレクトリ（実際にはサブURI）によって、アプリのソースを書き換えないでいい。


# 副作用
htmlの中に、
src="/js/xxxx.js"
なんて書いてると、やっぱりディレクトリがずれちゃうので、そういうことをしたかったら、Railsみたいな、フルスペックのフレームワークに頼った方がよくなる。Railsでもサブディレクトリをつかうのはちょっと面倒。

nginxとアプリケーションサーバを使いたいのなら、アプリケーション単位でルートを切るのが無難。公開ディレクトリにフォルダ解凍するだけで別アプリが配置できるのは、Apche＋phpの特殊機能と割り切った方がいい。
Grape でAPIを作るときにハマったこと

# やりたいこと
railsでのAPI作成の学習のためにgrapeを使ってかんたんなAPIを作る。
学習のための備忘録。

# 手順

1. grapeのインストール
2. プロジェクト内にapiディレクトリを作成してルーティングを設定する

grapeのインストール

```bash
$ gem install grape

#or
$ emacs Gemfile
# grape を追加

$ bundle install
```

ディレクトリの構成

```
app
 |- apis
      |- api
           |-v1
```

みたいな感じで構成
grapeはapi周りのファイルをapp以下のapiというディレクトリにいれる。

![スクリーンショット 2016-10-09 19.35.40（2）.png](https://qiita-image-store.s3.amazonaws.com/0/28230/f75ab3ec-088e-370e-8bff-874f5484f774.png)

上記のようなディレクトリ構成とroutingのためのroot.rbをapiディレクトリとapiのバージョンのディレクトリに作成する。

まずはapiディレクトリ配下のファイルを読み込むためにオートローディングの設定を行い、その後、/apiのURLをapiディレクトリに合わせる設定を行う

```config/application.rb

# 以下二行を追加。やっていることはpathの追加とautoloadの設定
config.paths.add File.join('app', 'apis'), glob: File.join('**', '*.rb')
config.autoload_paths += Dir[Rails.root.join('app', 'apis', '*')]

```

これでAPIというモジュールが動作します。

```config/route.rb
Rails.application.routes.draw do
  mount API::Root => '/api' # 追加
end
```

/apiというURLが呼ばれた際はapis/api以下のファイルが呼ばれます。
使用するAPIを指定するために、api以下のディレクトリをマウントします。

```apis/api/root.rb
module API
  class Root < Grape::API
    mount API::V1::Root
  end
end
```

最後にv1以下のルーティングを呼ぶ設定をします。

```apis/api/v1/root.rb

module API
  module V1
    class Root < Grape::API
      version 'v1', using: :path
      format :json

      get '/' do
        puts 'test'
      end
    end
  end
end
```

domain/api/v1を実行して、コンソールに'test'が表示されればOK。

#はまったところ。
最初以下のようなディレクトリ構成にしていたらNameMethodエラーが起きてしました。
route.rbでapiディレクトリのroot.rbを指定してたのですが、APIがそもそもインスタンス化されいない？というエラーが出てしまい思いっきりハマりました。

最初のオートロード設定

```config/applicaiton.rb
config.paths.add File.join('app', 'api'), glob: File.join('**', '*.rb')
config.autoload_paths += Dir[Rails.root.join('app', 'api', '*')]
```

```
最初のディレクトリ構成
app
 |- api ←ここにオートロードがあっていない。
      |-v1
```

これで`Uninitialized constant API`エラーが発生してしまってました。

原因と解決策なのですが、app以下のapi関連のファイルを入れるディレクトリの階層を現在と同じにしたら解消しました。
autoloadingの設定あたりがうまく行ってなかったのかなーと思ったんですが、apiに関連するファイルするディレクトリの階層と名前空間？の関連性がいまいち理解できていなかったのが原因だったのかなと。
【Objective-C】デバッグログを開発環境だけで表示する


はじめに
---
NSLogを使用し出力させたログを開発環境でのみ出力させる方法を備忘録として書き記します。


手順1
---
まずは、適当なSampleプロジェクトを作成し、「Supporting Files」の中にprefix.pchを作成します。(どこでもよいですがXcode6以前は「Supporting Files」にプロジェクト作成時からあったようなのでこの中に)

![PCH File作成.png](https://qiita-image-store.s3.amazonaws.com/0/134872/7afa9ca2-8507-0d00-3145-7b4f6037c5a7.png "PCH File作成.png")

名前はプロジェクト名Prefix.pchにします。
ここではSamplePrefix.pch

![PrefixFile.png](https://qiita-image-store.s3.amazonaws.com/0/134872/5fc6bf3e-d189-295f-86b2-62f6715bb947.png "PrefixFile.png")

手順2
---
Build Settingsから
Apple LLVM 7.1 - Language(本環境は7.1)の
Prefix Headerにパスを追加します。
手順１と同じ場所に追加したならパスは
「プロジェクト名/ファイル名.pch」となります。

![path.png](https://qiita-image-store.s3.amazonaws.com/0/134872/2ee9c34e-2db5-ea62-47f4-20d48ecd1dc9.png "path.png")

手順３
---
手順1で作成した「SamplePrefix.pch」に下記のコードを追加

```
#ifdef DEBUG
#   define NSLog(...) NSLog(__VA_ARGS__)
#else
#   define NSLog(...)
#endif
```
![Macro.png](https://qiita-image-store.s3.amazonaws.com/0/134872/d664780e-62dd-ef00-ce03-b6204495c93b.png "Macro.png")

※prefix.pchに書いた内容はimportしなくてもすべてのファイルに適用されます

試してみる
---
下記のようにViewController.m内のviewDidLoad内でNSLogを使用してみます。
通常当たり前ですが下記のようにログが出力されます。

![NSLog.png](https://qiita-image-store.s3.amazonaws.com/0/134872/d6f37540-5b96-8e87-fa85-1bb244f554a0.png "NSLog.png")

Schemeの設定を下記の手順で変更

・Sample（プロジェクト名）を押下

![Scheme位置.png](https://qiita-image-store.s3.amazonaws.com/0/134872/16033242-1baa-05b5-803d-5a810cbf5ab5.png "Scheme位置.png")

・Edit Schemeを押下
![スクリーンショット 2016-10-09 18.55.52.png](https://qiita-image-store.s3.amazonaws.com/0/134872/0ba5f219-d654-652b-ed5f-6e3bab0ae24f.png "スクリーンショット 2016-10-09 18.55.52.png")

・Build ConfigurationをDebugからReleaseに変更
![スクリーンショット 2016-10-09 18.56.12.png](https://qiita-image-store.s3.amazonaws.com/0/134872/52f51aa3-c3a3-7286-4af2-0aaf2095d17e.png "スクリーンショット 2016-10-09 18.56.12.png")

再度Buildすると、下記のようにNSLogをコメントアウトしていないのに、ログが出力されない
![スクリーンショット 2016-10-09 18.58.38.png](https://qiita-image-store.s3.amazonaws.com/0/134872/d562833d-8d21-4f63-cdd1-39069a8a9326.png "スクリーンショット 2016-10-09 18.58.38.png")

さいごに
---
プロジェクト作成時に今回の手順をふめば、Release時うっかりNSLogを消し忘れていたということにも対応できると思いました。
また、本番環境と開発環境でAPIKeyやURLなどが違う場合も今回のmacroを使うことで使い分けることができます。
libGDXの基礎１６ MathUtils

libGDXにはシンプルでわかりやすい単体クラスも多いです。今回はMathUtilsを紹介します。

#MathUtilsとは

mathUtilsは数値計算系の便利なメソッドを持つクラスです。staticクラスなので気軽に使えます。沢山ありますが、一部を紹介していきます。


#浮動小数点のイコール判定

浮動小数点はイコールで判定してはいけません。しかし、判定はしたいことはあります。

```java
import com.badlogic.gdx.math.MathUtils;

public class MathUtilTest1 {

    public static void main(String[] args) {
        //どちらも同じ0.1のつもり
        float a = 0.1f;
        float b = 1 - 0.9f;

        System.out.println("a=" + a);
        System.out.println("b=" + b);

        System.out.println("==:" + (a == b));
        System.out.println("EQ:" + MathUtils.isEqual(a, b));
    }
}
```

実行結果

```
a=0.1
b=0.100000024
==:false
EQ:true
```



#2のべき乗

特定の数値が収まる2のべき乗を返すメソッドです。主にロードするテクスチャサイズの計算で利用します。

```java
import com.badlogic.gdx.math.MathUtils;

public class MathUtilTest2 {

    public static void main(String[] args) {

        System.out.println("10   => " + MathUtils.nextPowerOfTwo(10));
        System.out.println("100  => " + MathUtils.nextPowerOfTwo(100));
        System.out.println("1000 => " + MathUtils.nextPowerOfTwo(1000));
        System.out.println("128  => " + MathUtils.nextPowerOfTwo(128));
    }
}
```

実行結果

```
10   => 16
100  => 128
1000 => 1024
128  => 128
```


#乱数

random系の命令はたくさんあります。

今回は特定の範囲の乱数を取得する命令を紹介します。

```java
int hoge = MathUtils.random(1, 100);
```

これは１~100のランダムな数値を取得します。確率計算系でよく使いますね。

乱数はアプリによってアルゴリズムなどを変えたい場合もありますが、MathUtilsクラス内でstaticでRandomクラスを保持しているので、これを変えることによって自由な乱数を利用できます。

実際、libGDXでのデフォルトはRandomクラスをそのまま利用していません。拡張していて高速化したアルゴリズムとなっています。

時間を計測してみます。

```java
    public static void main(String[] args) {
        long start = System.nanoTime();
        for (int i = 0; i < 100_000_000; i++) {
            MathUtils.random(1, 100);
        }
        long end = System.nanoTime();
        System.out.println((end - start) / 1000 / 1000 + "ms");
    }
```

デフォルト実装で約260ms。


```java
    public static void main(String[] args) {
        MathUtils.random = new Random();//差し替え

        long start = System.nanoTime();
        for (int i = 0; i < 100_000_000; i++) {
            MathUtils.random(1, 100);
        }
        long end = System.nanoTime();
        System.out.println((end - start) / 1000 / 1000 + "ms");
    }
```

JavaSEのデフォルト実装に差し替えたものは約1120ms。
4倍以上速いですね。
perl使いのpythonメモ - 特殊変数


- pythonであれ？とおもったことをメモしときます。

## こういうの→ \_\_name\_\_

- perlも$_をはじめとして、さまざまな特殊変数があるので謎言語とも言われますが、どんな言語でもお約束なキーワードって最初は戸惑いいますよね。最初に気づくのはこれだとおもいます。

```python
if __name__ == '__main__':
```

## そもそもアンダースコアが特殊

- 日本語の説明がありました。[予約済みの識別子種](http://docs.python.jp/3.5/reference/lexical_analysis.html#reserved-classes-of-identifiers)
- 本家の説明。[Reserved classes of identifiers](https://docs.python.org/3.4/reference/lexical_analysis.html#reserved-classes-of-identifiers)

- システムで使用するアンダースコアが２つのやつ（\_\_xxx\_\_）をいくつか試してみます。

1. \_\_name\_\_

- スクリプトで実行すると'\_\_main\_\_'となり、モジュールから呼ぶとモジュール名、関数から呼ぶと関数名となるそうです。

```python
>>> __name__
'__main__'
>>> def hoge():
...     print(u'hello')
... 
>>> hoge.__name__
'hoge'
```

1. \_\_init\_\_とか

- クラスの定義とかででてきますね。

```python
>>> class MyClass:
...     def __init__(self):
...             self.name = "anonymous"
... 
>>> a = MyClass()
>>> a.name
'anonymous'
```

- [特殊メソッド名](http://docs.python.jp/3.5/reference/datamodel.html#special-method-names)もいろいろ説明があります。これをきっちり覚えると開発もスムースに行きそうですね。

## objective-cでも...

- メンバ変数で\_をつけるのはobjective-cでもありますね。
- メンバ変数にアンダースコアつけて直接アクセスするな！って意味はほぼ同じかな？
C++,Cにおける４つのメモリ領域

プログラム領域
機械語が翻訳されたプログラムが格納される領域

stack領域：静的なメンバ変数
自動変数(局所変数)、関数の引数、戻り値、長い計算式等の一時変数などが格納される

静的領域：静的なグローバル変数
プログラム実行時に確保される固定サイズのメモリ領域

heap領域：動的変数(vector型の配列など)
動的にサイズが確保されるもの(malloc関数やnew演算子など)が格納される
TensorFlow > I tensorflow/stream_executor/dso_loader.cc:105] Couldn't open CUDA library libcupti.so. LD_LIBRARY_PATH: :/usr/local/cuda/lib64 の対応

```txt:動作環境
Ubuntu 14.04 LTS desktop amd64
GeForce GTX 750 Ti
ASRock Z170M Pro4S [Intel Z170chipset]
TensorFlow v0.11
cuDNN v5.1 for Linux
CUDA v7.5
```

https://www.tensorflow.org/versions/master/tutorials/mnist/tf/index.html#tensorflow-mechanics-101
にあるコードを実行中。

以下のエラーが出た。

```
$ python mnist_with_summaries.py 
I tensorflow/stream_executor/dso_loader.cc:111] successfully opened CUDA library libcublas.so locally
I tensorflow/stream_executor/dso_loader.cc:111] successfully opened CUDA library libcudnn.so locally
I tensorflow/stream_executor/dso_loader.cc:111] successfully opened CUDA library libcufft.so locally
I tensorflow/stream_executor/dso_loader.cc:111] successfully opened CUDA library libcuda.so.1 locally
I tensorflow/stream_executor/dso_loader.cc:111] successfully opened CUDA library libcurand.so locally
Extracting /tmp/data/train-images-idx3-ubyte.gz
Extracting /tmp/data/train-labels-idx1-ubyte.gz
Extracting /tmp/data/t10k-images-idx3-ubyte.gz
Extracting /tmp/data/t10k-labels-idx1-ubyte.gz
I tensorflow/stream_executor/cuda/cuda_gpu_executor.cc:925] successful NUMA node read from SysFS had negative value (-1), but there must be at least one NUMA node, so returning NUMA node zero
I tensorflow/core/common_runtime/gpu/gpu_device.cc:951] Found device 0 with properties: 
name: GeForce GTX 750 Ti
major: 5 minor: 0 memoryClockRate (GHz) 1.202
pciBusID 0000:01:00.0
Total memory: 2.00GiB
Free memory: 1.50GiB
I tensorflow/core/common_runtime/gpu/gpu_device.cc:972] DMA: 0 
I tensorflow/core/common_runtime/gpu/gpu_device.cc:982] 0:   Y 
I tensorflow/core/common_runtime/gpu/gpu_device.cc:1041] Creating TensorFlow device (/gpu:0) -> (device: 0, name: GeForce GTX 750 Ti, pci bus id: 0000:01:00.0)
Accuracy at step 0: 0.144
Accuracy at step 10: 0.6902
Accuracy at step 20: 0.824
Accuracy at step 30: 0.8624
Accuracy at step 40: 0.8782
Accuracy at step 50: 0.8818
Accuracy at step 60: 0.8882
Accuracy at step 70: 0.8895
Accuracy at step 80: 0.8907
Accuracy at step 90: 0.8964
I tensorflow/stream_executor/dso_loader.cc:105] Couldn't open CUDA library libcupti.so. LD_LIBRARY_PATH: :/usr/local/cuda/lib64
F tensorflow/core/platform/default/gpu/cupti_wrapper.cc:58] Check failed: f != nullptr could not find cuptiActivityRegisterCallbacksin libcupti DSO; dlerror: /home/yasokada/tensorflow-GPU/local/lib/python2.7/site-packages/tensorflow/python/_pywrap_tensorflow.so: undefined symbol: cuptiActivityRegisterCallbacks
中止 (コアダンプ)
```

以下のエラーを解決しないといけない。

```
I tensorflow/stream_executor/dso_loader.cc:105] Couldn't open CUDA library libcupti.so. LD_LIBRARY_PATH: :/usr/local/cuda/lib64
```

`ls /usr/local/cuda/lib64/`で確認したがlibcupti.soというのは見当たらない。

https://devtalk.nvidia.com/default/topic/936212/tensorflow-cannot-find-cudnn-ubuntu-16-04-cuda7-5-/
に以下の記載がある。
> sudo apt-get install libcupti-dev zlib1g-dev

上記のapt-getを実行したらエラーが出なくなった。

libcuptiが何かというと以下。
http://packages.ubuntu.com/ja/trusty/libcupti-dev
> NVIDIA CUDA Profiler Tools Interface development files
HotKey から起動した iTerm2 を full screen に重ねて表示する

# やりたいこと
iTerm2 をインストールした時点では、iTerm2 が動いている Desktop 以外で HotKey から起動すると、Desktop が切り替わる動作になってしまう (フルスクリーンのアプリの上には iTerm2 を重ねることができない)。
しかし設定をいじるとフルスクリーンのアプリであっても iTerm2 を重ねて表示することが可能となる。

# 設定方法
iTerm2 の設定画面にいきます (`Cmd` + `,` またはメニューから Preference)

1. Appearance メニューで "Show tab bar in fullscreen" にチェックをいれる。"Auto-hide menu bar in non-native fullscreen" にチェックをいれる。あとTab bar location を Bottom にしておく・・・一番上の行が隠れるのでこうしておかないと不都合多いです
<img width="773" alt="スクリーンショット 2016-10-09 18.37.52.png" src="https://qiita-image-store.s3.amazonaws.com/0/62450/7eb7c227-c480-7a2b-7be3-4057beebd18f.png">
2. Profile → Window → Settings for New Windows で、Style を Fullscreen, Screen を Screen with Cursor, Space を Current Space に設定
<img width="909" alt="スクリーンショット 2016-10-09 18.44.31.png" src="https://qiita-image-store.s3.amazonaws.com/0/62450/29b926ca-2c6b-b64a-6aea-14b9ede13e6c.png">
3. Keys → HotKey で、 Hotkey toggles a dedicated windows with profile にチェック。プロファイルはさっき設定したプロファイルで。(画像では "Default" を使っている)
<img width="933" alt="スクリーンショット 2016-10-09 18.44.41.png" src="https://qiita-image-store.s3.amazonaws.com/0/62450/194ced8c-81bd-4d93-e355-07d39b68fac7.png">
4. Advanced から "hide" で検索をかけて、General → Hide iTerm2... を Yesに、Hotkey のふたつの設定を Yes に変更。
<img width="1011" alt="スクリーンショット 2016-10-09 18.44.52.png" src="https://qiita-image-store.s3.amazonaws.com/0/62450/814d4a66-347f-ba03-ffcf-0016446598e2.png">

全部終わったら iterm2 を再起動 (Docker から終了させるか、それができなければアクティビティモニタからタスクキルする。Window をすべて閉じても終了されるとは限らないので注意！)

あとは設定した Hotkey を押せばどのDesktopでもフルスクリーンのアプリでもちゃんと遷移なしで iterm2 が重ねて表示されるようになる
TensorFlow > link >  TensorFlowを遊び倒す！ 3-1. TensorFlow Mechanics 101 > ソースコードのリンク切れ

株式会社ブレインパッドの佐藤貴海さんによる記事。
http://blog.brainpad.co.jp/entry/2016/03/28/170000

mnistのソースコードのリンクがあるが、リンク先はnot foundになっている。
リンク切れしたのかもしれない。

> ソースコードが以下のURLに掲載されています。
https://tensorflow.googlesource.com/tensorflow/+/master/tensorflow/examples/tutorials/mnist/

おそらくこちらのコードなのだろう。
https://github.com/tensorflow/tensorflow/tree/r0.11/tensorflow/examples/tutorials/mnist
TensorFlow > link > Device Placement > Variableを置く位置の指定 (CPU / GPU) > Device placement is particularly important when running in a replicated setting

Variables: Creation, Initialization, Saving, and Loading
https://www.tensorflow.org/versions/master/how_tos/variables/index.html
を読んでいて気になった機能。

[Device Placement](https://www.tensorflow.org/versions/master/how_tos/variables/index.html#device-placement)

```
# Pin a variable to CPU.
with tf.device("/cpu:0"):
  v = tf.Variable(...)

# Pin a variable to GPU.
with tf.device("/gpu:0"):
  v = tf.Variable(...)

# Pin a variable to a particular parameter server task.
with tf.device("/job:ps/task:7"):
  v = tf.Variable(...)
```

この機能が効果を発揮するのはreplicate settingにおいてとのこと。
> Device placement is particularly important when running in a replicated setting. See [tf.train.replica_device_setter()](https://www.tensorflow.org/versions/master/api_docs/python/train.html#replica_device_setter) for details of a device function that can simplify the configuration for devices for a replicated model.

今のところよくわかっていない。
MacでEclipseを導入して「日本語化」するのが超ハイパーメディア難しい件

MacでEclipseを導入して「日本語化」するのが超ハイパーメディア難しい件
についてです


<h1>１．概要</h1>
MacでEclipseを導入して「日本語化」したい

EclipsとはJavaなどをMacで扱える「エディタ」のことです

「日本語化」する理由は、したいからです。
（Xcodeを英語のまま使ってる人が多い2016年のご時世では、日本語化するしないも人によって趣味嗜好が分かれるのではないでしょうか）

前提として、Javaの開発環境JDKのインストールが必要です（約１０分）


<h1>２．なぜ超ハイパーメディア難しいのか</h1>
<h2>（０）前提</h2>
具体的な方法については、
【Eclipse】Neon日本語化計画【in Mac】
http://tech.pjin.jp/blog/2016/08/02/tips_mac_eclipse_neon_ja/

こちらの記事がとてもわかりすかったです
失敗例を挙げてくれているからです
あと、２０記事くらい見ましたが、どの記事も似たようなことを言っていますが、
今回は細かいところを間違えると失敗します

※私の記事は、こちらの記事と合わせて読んでください

たかがインストールですが、かなりの難易度です


<h2>（１）Appをインストールするけど起動してはいけない </h2>
インストールするけど起動してはいけない
インストールするけど起動してはいけない
インストールするけど起動してはいけないんです

インストールするけど起動してはいけないんですよ
こんなの初めてだよ


<h2>（２）プラグインが100ある中から本物のverを見抜く</h2>
（見抜くには1年間の滝修行が必要） 

プラグインのページには、
・今までの歴代バージョン
・windowsバージョン、MacOS向けバージョン
・srcバージョン（＞＞謎）
・安定バージョン（＞＞謎）
・通常バージョン

などと、AKB48の初回限定CDよりも種類があるので、その中から正しいものを判別するには、冒頭の記事を１０分間は解読する必要があります（まじで）

※解説ページによっては、この部分は異なってるものが多いので、注意が必要です。
もちろんどれも間違ってはいない（と思う）のですが、私のようにJavaを編集したいだけの人は、「通常バージョン」でOKです

つまり、お目当のカップリング曲が聞きたいだけなので、初回限定版AのCDを買うだけでいいです。（劇場限定版握手券付きをダウンロードすると、容量が1Gもあって時間かかります）


<h2>（３）プラグインファイルを追加してコードを書き換える（書き換えるには念の習得が必要）</h2>

コード書き換えの部分ですが、慣れてないとちょっと戸惑うと思います
メモ帳やCotEditer（人気ナンバー１のコード編集ソフト）などを使用します

規定の行を書き加えて、「保存」して「閉じます」




<h1>３．結論</h1>
なんで、ソフトをインストールする段階で、こんなに複雑なの…
そもそもなんで日本語パッケージがプラグインとして存在しないの、ドイツ語はあった
（pleiades作者様には本当に感謝）






--
HTMLとは何か

HTMLはHypertext Markup Languageの略です。
マークアップ言語とはタグで文章の構造を表現するコンピュータ言語のことを示します。
HTMLはタグで文章を表現しますよね。
このような文章のことを構造化文章と呼びます。
HTMLには2つのメディアタイプが存在します。
「text/html」と「applicaton/xhtml＋xml」です。
「text/html」はSGMLベースのHTMLを、「application/xhtml＋xml」はXMLベースのXHTMLを示します。
MySQL入門


# 用語

- データベース
	- スプレッドシート的な
- テーブル
	- 表
- フィールド
	- 列
- レコード
	- 行

# コマンド

起動

```
mysql -u root
```

パスワード設定

```
set password for root@localhost=password('hogehoge');
```

dbを作る

```
creata database ghogehoge
```

dbを削除

```
drop database hogehoge
```

特定のdbを使う

```
use db;
```

作業用ユーザを作成してみる

```
grant all on hoge_db.* to dbuser@localhost identified by 'hogepass';
```

テーブルを作成

```
create table users (
 id int,
 name varchar(255),
 email varchar(255),
 password char(32)
);
```

テーブルを削除

```
drop table users;
```

# 扱えるデータ

数値
- int 
- double

文字列
- char(固定長)
- varchar()
- text(どれだけ長くなるかわからない場合)

日付
- date
- datetime

それ以外
- enumなど
Xcode8に上げたら画像が表示できなくなってしまった

## ImageViewが表示されない...!?
先日バージョンを上げたXcode8でビルドしたアプリ上で、
ImageViewの画像が表示できないという問題が発生しました。
問題のImageViewはURLを指定することで、
サーバから画像を取得して表示しているものでした。

# 原因
xibを一度Xcode8で開き、
`choose device`することで差分が発生していたことが原因でした。

# 応急処置
ファイルを開くXcodeのバージョンをXcode7.x系に下げてビルドしてあげることでひとまず応急処置をしました。

![dce6273f-cc45-c779-aeb5-5145e7d20af5.png](https://qiita-image-store.s3.amazonaws.com/0/120969/72f545fd-b0a5-ed07-9c96-c5502a5075e6.png)

うーん...。
結局なぜ画像は表示されなかったんでしょうか...。
根本的原因が判明したら追記します！
（コメントでご指摘いただけてもうれしいです！）

##　参考
* http://qiita.com/Fusapiens/items/180268c384fd6b274ee5
* http://stackoverflow.com/questions/39497572/layout-issues-after-updating-to-xcode-8
TensorFLow > link > Deep MNIST for Experts > ネットワーク画像

株式会社ブレインパッドの佐藤貴海さんによる記事。
http://blog.brainpad.co.jp/entry/2016/02/25/153000

そこにあるソースを勉強中。

第１層の畳み込み層から６層目のSoftmax Regression層までのわかりやすい図を探してみた。

http://www.slideshare.net/ssuser06e0c5/explanation-on-tensorflow-example-deep-mnist-for-expert
のp2にてある程度イメージがつかめる。

convolutionとpoolingを一緒にしているのはわかりやすいかも。
AWS 謹製 aws-serverless-express を使って APIGateway + Lambda + Node + Express で RESTful サービスの雛形を最速で作る

# はじめに
AWS と言えば Lambda、Lambda と言えば サーバレス ですが、サーバレスでサービス全体を作るのはしんどいなと思っている昨今、皆様いかがお過ごしですか。

そんな折、10/04付け AWS ブログで以下の記事がポストされました。

「AWS Lambda と Amazon API Gateway で Express アプリケーションを実行」
https://aws.amazon.com/jp/blogs/news/running-express-applications-on-aws-lambda-and-amazon-api-gateway/

Lambda で Express が動くだと!? なんて日だ！


# 手順


 1. ローカル環境
  Lambda の Node は 4.3.2 なので、ローカル開発環境も、念のため、合わせておく

    ```
$ nodebrew use v4.3.2
$ node -v
v4.3.2
```

 1. サンプルコード取得
  GitHub からサンプルコードを取得する

    ```
$ git clone https://github.com/awslabs/aws-serverless-express.git
$ cp -r ./aws-serverless-express/example ~/projects/yourProject
$ cd ~/projects/yourProject
```

 1. コンフィグレーション
  以下で、コンフィグレーションを行う

    ```
$ npm run config <アカウントID> <バケット名> ap-northeast-1
```

    |パラメータ|意味|
 |----|----|
 |アカウントID |AWS コンソールの アカウント情報で表示されている ID|
 |バケット名 |S3 のバケット名。全世界で唯一の名前である必要がある。<br>指定したバケットが存在していないなら、自動で作成してくれる。<br>Lambda にコード一式をアップロードするために使用されるだけ。|
  ![スクリーンショット_2016-10-09_16_36_33.png](https://qiita-image-store.s3.amazonaws.com/0/69410/6548c8ca-1341-5baa-832c-b31637f05dd6.png)

 1. セットアップ
  たった、これだけ。

    ```
$ npm run setup
```

 1. 動作確認
CloudFormation が CREATE_COMPLETE になれば、成功。
Outputs タブに、作成された画面へのリンクが、表示されている。
![スクリーンショット_2016-10-09_16_35_08.png](https://qiita-image-store.s3.amazonaws.com/0/69410/e5f65a1a-57d9-e21a-4f12-557464d89002.png)
   - ApiUrl  
  サンプル users の RESTful API が表示されている。  
動く、動くよ！
![スクリーンショット_2016-10-09_16_21_48.png](https://qiita-image-store.s3.amazonaws.com/0/69410/eb395bf9-5c29-9ce9-f1c3-322434d2a224.png)
   - APIGateway
![スクリーンショット_2016-10-09_16_35_33.png](https://qiita-image-store.s3.amazonaws.com/0/69410/ef49fa0b-d8bf-d032-fdbe-73464b9ab1dd.png)
   - Lambda  
このような Lambda 関数が生成される。これ自体は、たった4行。この Lambda 関数をいじることはない。
![スクリーンショット_2016-10-09_16_35_49.png](https://qiita-image-store.s3.amazonaws.com/0/69410/3d6d4a15-b0ee-e97d-c810-e2be8e5655c9.png)

# カスタマイズ

 1. カスタマイズ
  app.js をカスタマイズしていけばよい。
  ここは、今まで通りの、普通の Node + Express だ。

 2. 反映
  次のコマンドで、AWSに反映できる。これだけだ。なんて日だ！

    ```
$ npm run package-upload-update-function
```

# ローカル テスト
70行目付近を修正して、ローカルの node で起動してテストできるようにしておきます。

 1. コード修正

    ```
// The aws-serverless-express library creates a server and listens on a Unix
// Domain Socket for you, so you can remove the usual call to app.listen.
//app.listen(3000)
process.env.PORT && app.listen(process.env.PORT)
```
 1. 起動

    ```
$ export PORT=3000
$ node app.js
```

# おわりに
 - コマンドを 3,4 個実行するだけで、ここまでできるとは驚きです。
 - aws-serverless-express の登場で、いきなり、サーバレスでサービスを実現できる気がしてきた。
 - あとは、MongoDB のマネージドサービスがあればなぁ。

# TODO
ぱっと思いつくだけでも、まだ先は長い。わかり次第、追記していきます。

 - [ ] Lambda での params, context の扱い
 - [x] ローカルでの実行方法、デバッグ方法など
TreeTagerをMacで使えるようにする. ( Install編)

## はじめに

MacでTreeTaggerを使いたいと思い、インストールしてみましたが色々とめんどくさかったのでメモ。

## 環境

* Mac OSX 10.11.6

## 注意！！

これから手順通りにやっていきますが、以下のことを守ってください。

* わかりやすい場所 ( Desktop等 )に`TreeTagger` という名前でフォルダを作っておく
* ダウンロードしたファイルは __全て__ そのフォルダに入れる
* ダウンロードしたファイルは __解凍しない__ 。

## TreeTaggerのインストール

まずは [公式サイト](http://www.cis.uni-muenchen.de/~schmid/tools/TreeTagger/)から必要なファイル群をダウンロードしてきます。

```
Download the tagger package for your system (PC-Linux, Mac OS-X (Intel-CPU), PC-Linux (version for older kernels)).
```

<img width="934" alt="1.png" src="https://qiita-image-store.s3.amazonaws.com/0/29844/a8ad88ae-64c1-03cb-ad80-5eba129459e7.png">

自分の環境にあったパッケージをダウンロードしろと書いてありますが、今回はMacなので `Mac OS-X (Intel-CPU)` を選択。


<img width="934" alt="2.png" src="https://qiita-image-store.s3.amazonaws.com/0/29844/3285551b-2167-339f-a7b1-4f38706d7bc3.png">

```
Download the tagging scripts into the same directory.
Download the installation script install-tagger.sh.
```

`tagging scripts` , `install-tagger.sh` をダウンロードします。

<img width="934" alt="スクリーンショット_2016-10-09_16_58_40.png" src="https://qiita-image-store.s3.amazonaws.com/0/29844/5dd5052c-f88e-ceb0-c048-473928842ed7.png">

```
Download the parameter files for the languages you want to process.
```

最後に `parameter files` をダウンロードします。今回は英語なので、英語のパラメータファイルをダウンロードします。

<img width="769" alt="3.png" src="https://qiita-image-store.s3.amazonaws.com/0/29844/539fc266-c24c-350a-deba-3e251200d5e8.png">

`English Parameter file` をクリックしてダウンロードします。

---

全てインストールし終えると、以下の状態になっていると思います。

![スクリーンショット_2016-10-09_17_11_03.png](https://qiita-image-store.s3.amazonaws.com/0/29844/b5f327a4-2702-b37c-4d28-279184a4c26f.png)

まずは、このフォルダをアプリケーションフォルダに移動しましょう。 ( ずっとDesktopにあると汚いので )

次にターミナルで、このフォルダを開き、以下のコマンドを叩きます。

```
sh install-tagger.sh

(~/Desktop/TreeTagger) RINDO ~> sh install-tagger.sh

Mac OS-X version of TreeTagger for Intel CPUs installed.
Tagging scripts installed.
English parameter file (Linux, UTF8) installed.
Path variables modified in tagging scripts.

You might want to add /Applications/TreeTagger/cmd and /Applications/TreeTagger/bin to the PATH variable so that you do not need to specify the full path to run the tagging scripts.
```

これで公式にある

<img width="352" alt="スクリーンショット 2016-10-09 17.17.07.png" src="https://qiita-image-store.s3.amazonaws.com/0/29844/0b75c040-633e-9ad4-098d-ee9fc17653d1.png">

が実行できるようになります。

## PATHを通す

`echo 'Hello world!' | cmd/tree-tagger-english` は実行できるようになりましたが、 `cd`すると使えないのでPATHを通していきます。

引き続きターミナルで作業してきます。

```
$ vim ~/.bash_profile

# 以下の行を追加
export PATH=$PATH:/Applications/TreeTagger/cmd
export PATH=$PATH:/Applications/TreeTagger/bin
```

追加し終わったら、以下のコマンドを叩きます。

```
source ~/.bash_profile
```

これで、以下のようにして使うことができます。

```
echo 'Hello world!' | tree-tagger-english 
```
バッチ処理の設計の基本について調べたメモ

良いバッチ処理の設計について調べ中なので、基本からまとめていきます。
随時追記していこうと思うので、ほんとにまだメモです。

# バッチ処理の構成の基本

バッチ処理は以下の3つのパートに分類して考えるのが基本です。

- 1．入力
- 2．加工
- 3．出力

設計の時に意識すると綺麗に切り分けられそうです。
切り分けた部分を再利用できるように考えておくと良いです。

# バッチ処理の課題の基本

2016年現在、バッチ処理に関して以下の課題が増大し続けています。
この課題を改善できる設計を考えていく必要があります。

- データ量の増大
- データの種類の増大

# 再実行の基本

エラー等で途中で終了しても簡単に再実行できるように設計する事が大事です。
その為の工夫に以下のようなものがありそうです。

- トランザクションを利用して、処理が全て終了してからコミットする。
- 時間のかかる処理は分割して、中間データを出力する。

# ログ管理の基本

バッチ処理はログを残さないと処理の結果が分かりずらいです。見やすいログを残すのが大事です。

- 一か所に集める。
- 独自フォーマットを作らない。

# パフォーマンス維持の基本

バッチ処理はループが多いと思うので、ちょっと遅い処理が大きな問題になります。

- できるだけメモリ上で処理する。（ディスクアクセスを減らす）
- 性能の高いディスクを選ぶ。

# バッチ処理用のフレームワーク

- jBatch … Javaのバッチフレームワーク。

# バッチ管理に使えそうなツール、サービス

- ジョブスケジューラ
- AWS Elastic Beanstalk (https://aws.amazon.com/jp/elasticbeanstalk/)



（分かった事を更新していきます）
TensorFlow > link > プーリングとストライドの説明画像

株式会社ブレインパッドの佐藤貴海さんによる記事。
http://blog.brainpad.co.jp/entry/2016/02/25/153000

そこにあるソースを勉強中。

```
        # オリジナル画像が28x28で、今回畳み込みでpadding='SAME'を指定しているため
        # プーリングでのみ画像サイズが変わる。2x2プーリングで2x2でストライドも2x2なので
        # 縦横ともに各層で半減する。そのため、28 / 2 / 2 = 7が現在の画像サイズ
```

プーリングはキーワードとして知っていたが、ストライドの概念が未消化。

Qiitaの記事を検索して、@jkkchさんによる以下の良い説明を見つけた。
http://qiita.com/jkkch/items/001ad5bfb97004cb02a7
プーリング層の節を参照。

tensorflow.orgのTutorialは文字だけで理解に時間がかかる。
DPDK 入門資料

# Outline

- Motivation
- DPDK 概要
- DPDK 誕生の背景
- DPDKの動作概観
- DPDKのユースケース
- HOW TO USE DPDK
- Reference
- まとめ

---
# Motivation
DPDK (Data Plane Development Kit)が発表された2014年からだいぶ月日は立っています。
ネットワーク業界でネットワークスタックの高速化話すると言葉を聞かないことがないDPDKについて、簡単ですが、自分の理解をまとめてみようと思います。

---
# DPDK 概要
- Data Plane Development Kit の略
- ネットワーク処理に特化したアプリケーションを作成するためのソフトウェアライブラリ
- 特定のCPUコアをネットワークスタック処理するためのアプリケーションに割り当てて、集中的にアプリケーションがネットワーク処理を実行する
    - DPDKで割り当てられたCPUは、NICの受信データを割り込み駆動ではなく、ポーリングして監視しているところがポイント
- 余談：Intel DPDKとDPDKは同等の意。Intelが途中からDPDKに変更

---
# DPDK 誕生の背景
- 従来
    - 専用機器を作ってパケット処理を実行
- 近年
    - クラウド技術の流れを受けて、専用機器で実行していたパケット処理をソフトウェア実行することが流行り始める
    - ソフトウェア化による大幅な性能低下が浮上
     - e.g., 10Gbps NICのパケット処理不可能

- ソフトウェアによる高速ネットワーク処理を実現するため、Intelが提案したのが、DPDK

---
# ソフトウェアでパケット処理ときのオーバヘッド
例．カーネルで受信パケットカウント処理を実行する場合の処理シーケンス
  1. NICがカーネルに割り込み発生させる
  2. カーネルが割り込み処理するために、コンテキストスイッチを発生させる
  3. カーネルがNICに対応するDriver処理を実行する
  4. カーネルがネットワークスタック処理を実行する
  5. カーネルがパケットカウント処理（アプリケーション）を実行する

**処理2**と**処理3**, **処理4**のソフトウェアオーバヘッドが大きい

---
# DPDKの動作概観
アプリケーションはDPDKが提供するライブラリを使用することで、NICの送受信データとアプリケーション間でダイレクトにクセス可能

![alt](https://media.licdn.com/mpr/mpr/shrinknp_800_800/AAEAAQAAAAAAAAaNAAAAJGU1YzE5NjBlLTExMTEtNDBiYS1hMjc4LTYwODNjYTFkMTQ4Yw.png)

--- 
# DPDKのユースケース [1/2]
下記のリンクに設定方法、サンプルコードと一緒にユースケースがリスト化されているので便利
http://dpdk.org/doc/guides-16.04/sample_app_ug/index.html

---
# DPDKのユースケース [2/2]
例：Software Router

- 用途：性能評価
- アプリケーションでネットワークスタック生成を行うことで、キャッシュなど最適化がアプリケーションレベルで操作できるため、ソフトウェアオーバヘッドを最小化できる
- イメージ図
![alt](http://image.slidesharecdn.com/dpdk-150212031625-conversion-gate01/95/understanding-dpdk-38-638.jpg?cb=1457282075)

---
# HOW TO USE DPDK
下記のスライドがよくまとまっている
http://blog.slankdev.net/2016/05/08/dpdk-setup/

---
# Reference
- "DPDK Documentation"
http://dpdk.org/doc/guides-16.04/index.html
- "Understanding DPDK"
www.slideshare.net/garyachy/dpdk-44585840
- "第53回　NFVとIntel DPDK（前編/後編） (中井悦司)"
https://www.school.ctc-g.co.jp/columns/nakai/nakai53.html
http://www.school.ctc-g.co.jp/columns/nakai/nakai54.html
- "Intel DPDK の環境構築 [実機編]”
http://blog.slankdev.net/2016/05/08/dpdk-setup/

---
# まとめ

- DPDK
 - 専有的にCPUコアをアプリケーション処理に割り当てることで実現するネットワーク処理を高速化するためのツールキット
 - ネットワークスタック処理の高速化手段として期待されている

---
# 用語説明
- Hugepages: ユーザスペースの1pageのサイズを大きくする仕組み
- PMD: CPUがドライバをポーリングするために使用するドライバーをPMD
- UIO: ユーザスペースにドライバを作成するための機能

---
iPhone6s以降の内蔵スピーカーは再生周波数48kHzのみ対応

#はじめに

タイトルの通りなんですが、大昔に作ったiOSアプリがiPhone7だと音割れするという報告を当時の担当者から受けて(ただし業務外)、調べた(ただし業務外)結果がこれでした。

#Technical Q&A QA1631

AVAudioSession - Requesting Audio Session Preferences
https://developer.apple.com/library/content/qa/qa1631/_index.html
>Important: Different hardware can have different capabilities. For example, **the internal speaker on the iPhone 6S models only support a sample rate of 48kHz** while previous iPhone models supported a collection of sample rates. If you assume current values will always be your preferred values and for example fill our your client format using the hardware format expecting 44.1kHz when the actual sample rate is 48kHz, your application can suffer problems like audio distortion with the further possibility of other failures.

簡単に訳すと、
>重要: それぞれの機種が異なる機能を持つ可能性があります。例えば、以前のiPhoneは複数の再生周波数に対応していましたが、**iPhone6Sの内蔵スピーカーは48kHzにのみ対応しています**。実際のハードウェアの再生周波数が48kHzなのに44.1kHzであることを期待してフォーマットを設定すると、あなたのアプリは音割れなどのさまざまな問題に苦しむことになります。

#言い訳

こんな重要な事をQ&Aにしれっと書くなー！！と言いたいところですが、仕方ありません。えぇ、おっしゃる通り、44.1kHz決め打ちで実装していました。

AudioSessionという低レベルオーディオAPIを使用し、もちろんAudioSessionSetPropertyで44.1kHzに設定していたんですが、当時のiPhoneは全部44.1kHzだった事もあり、44.1kHz非対応だった場合の対応が不十分だったわけです。そもそも、そういう場合はサンプリングレートコンバートしてくれるものと思っていたのに、それに近いハードウェアが対応している再生周波数に適当に設定されてしまうんですねー。それを取得してチェックすべきでした。

我々のアプリだけではなく、いくつかの大手のアプリでも音割れが発生しているという話なので、引っかかりやすいポイントだったのではないかなと思います。確かWindowsのWASAPI(CoreAudio)もそういう仕様だったはず。

なお、AudioSession APIはすでにExpiredとなっているので(iOS7からAVAudioSessionに移行)、Apple側の対応は期待できません。

#おわび

で、アプリ側で修正すればもちろん直るんですが、実はそのアプリ、すでにサービス終了しちゃってるから直せない。愛あるプレイヤーの皆さん、ごめんなさい…。
TensorFlow > 縦横のストライド > 画像の縦横

株式会社ブレインパッドの佐藤貴海さんによる記事。
http://blog.brainpad.co.jp/entry/2016/02/25/153000

そこにあるソースを勉強中。

```
def conv2d(x, W):
    """2次元畳み込み関数
    """
    return tf.nn.conv2d(x,
                        W,
                        strides=[1, 1, 1, 1], # 真ん中2つが縦横のストライド
                        padding='SAME')
```

> `# 真ん中2つが縦横のストライド`

という記載がわかりにくかった。

https://www.tensorflow.org/versions/master/tutorials/mnist/pros/index.html#deep-mnist-for-experts

```
x_image = tf.reshape(x, [-1,28,28,1])
```

> To apply the layer, we first reshape x to a 4d tensor, with the second and third dimensions corresponding to image width and height, 

tensorflow.orgによると[-1, 28, 28, 1]の真ん中２つは画像の縦横、とのこと。

~~ストライドの概念を学習したら、上記のコメントで意味が通じるのかもしれない。~~

https://www.tensorflow.org/versions/master/tutorials/mnist/pros/index.html#deep-mnist-for-experts
> Our convolutions uses a stride of one and are zero padded so that the output is the same size as the input. 

画像「縦横のストライド」を１にする、とある。

ストライドについては以下のリンク先の画像を参照。
http://qiita.com/7of9/items/e65eedef8a4098aa5f2a

ストライドを１にしているので、ストライドによるサイズ縮小はないということか。
Meteor 1.4以上のアプリをAWS EC2へ簡単デプロイ

Javascript Fullstack framework Meteor。開発時はめっちゃ便利なんですが、運用環境へのDeployがむっちゃ大変--;。そういう方向けのシンプルなDeploy方法です。

#1 はじめに
Amazon EC2のUbuntu環境へMac book ProからDeployする方法です。
MeteorのDeploy方法はMeteor Developersの[Deployment and Monitoring](https://guide.meteor.com/deployment.html,"公式ページ")を見ると色々とありますが、この中で**Meteor Up(mup)**を利用する方法を説明します。
このツールは、Deploy先のクラウド環境に、Meteorアプリケーションの実行用仮想化環境をDockerを用いて自動構築しその上にアプリケーションをDeployしてくれます。
ですので、**Deploy先の環境でDockerを利用されている方はご注意ください。**

#2　準備
以下、全てmacで実行します。
##2.1 mupのインストール
利用するmupは、Meteorのバージョンによって異なります。

(1) The mupx branch (best for pre-Meteor 1.4)
(2) The kadirahq/mup fork (best for Meteor 1.4 or higher)

今回は、Meteor 1.4以上なので、(2)を利用します。
[mup](https://github.com/kadirahq/meteor-up,"mup")をインストール

````
npm install -g mup
````

次に、Meteorアプリのフォルダに移動".deploy"フォルダを作ってその下で、mup initを実行。初期ファイルが生成されます。

````
cd my-app-folder
mkdir .deploy
cd .deploy
mup init
````

続いて、自動生成された、mup.jsを以下の通り編集。**フルパス指定**が必要となる癖のある設定ファイルなので注意してください。

````js:mup.js
module.exports = {
  servers: {
    one: {
      host: 'a.b.c.d', // awsのpublic ip
      username: 'ubuntu',
      pem:"/Users/xxx/xxx.pem" // ssh接続で利用するpemのフルパス
    }
  },

meteor: {
    name: 'my-app-folder',
    path: '/Users/xxx/my-app-folder', //アプリのフルパス
    servers: {
      one: {}, two: {}, three: {} // list of servers to deploy, from the 'servers' list
    },
    buildOptions: {
      serverOnly: true,
      debug: true,
      // cleanAfterBuild: true, // default
      buildLocation: '/Users/xxx/my-app-folder', // defaults to /tmp/<uuid> //デプロイ用テンポラリファイル生成先のフルパス
    },
    env: {
      ROOT_URL: 'http://a.b.c.d',
      MONGO_URL: 'mongodb://localhost/meteor'
    },
    deployCheckWaitTime: 60 //default 10
  },

  mongo: { // optional
    oplog: true,
    port: 27017,
    servers: {
      one: {},
    },
  },
};
````

設定が終われば下記を実行します。

````
mup setup
````

すると、mupがAWS EC2へSSH接続し、DockerのインストールからMeteorの基本環境まで自動セットアップします。処理が完了すると、以下を実行。

````
mup deploy
````

Meteorのアプリビルドが開始され、ビルド後自動的にアプリがEC2へアップロードされ起動します。そのあと、ブラウザから```http://a.b.c.d```にアクセスするとアプリの画面が見られるはずです。
なお、アプリはport 80番で公開されるので、ご注意ください。

アプリの停止は、```mup stop```、起動は、```mup start```です。
Snap Remoteの音判別ロジックを自分のアプリでも使いたい人のためにライブラリをつくった

## まえおき: SnapRemoteとは

そもそもSnap Remoteってなによ？というのは、[紹介記事](http://www.tachitto.com/2013/11/snapremote.html?m=0)がわかりやすいのですが、
奇怪な音を発する小さいリモコンです。
その音に反応してカメラのシャッターを切るアプリがiOS版/Android版ともにストアにあります。

機械音に反応して何かをする、っていう仕組みじたいは汎用的でちょっぴり革新的なのに、それをカメラのシャッターきるのにしか使えないってちょっと残念ですよね。オープンソースとは無縁な会社が作ったんでしょうか・・・。

## ということでつくった

https://github.com/YusukeIwaki/snapremote_detector

OSSバンザイ（違ｗ

## ざっくり説明

詳細はGitHubのほうを見てほしいのでざっくりとだけ説明すると、

![fig](https://raw.githubusercontent.com/YusukeIwaki/snapremote_detector/master/example/src/main/res/drawable-xxxhdpi/fig_snapremote.png)

ライブラリを組み込んで、RecordingServiceというのを裏で動かしておけば、単純にブロードキャストレシーバーをひとつ実装するだけで、リモコンの音に反応する"何か"を作ることができます。

AボタンとBボタンで微妙に違う音がなるので、ブロードキャストのextrasにどっちのボタンかという情報も載せて飛ばしています。

自前で全部やろうとするとFFTとかAudioRecordとか結構めんどくさい実装になるので、その辺だけを狙って隠蔽してライブラリ化しました。


## で、なにに使うの？

いいアイディアがあれば是非コメントください(笑)
TensorFlow > Link > API > truncated_normal()

http://qiita.com/supersaiakujin/items/464cc053418e9a37fa7b#random-tensors

Constant Value Tensors
zeros
ones
fill
constant
Random Tensors
random_normal
truncated_normal
random_uniform
set_random_seed
Shapes and Shaping
Shape
get_shape(), tf.shape()
Slicing and Joining
slice
concat
split
tile
pad

@supersaiakujinさんの記事は非常に良いと思うが、Qiitaの検索で"truncated_normal"で検索すると、それを使うコードの記事が大量に出て、この記事に再訪しにくい。

head:truncated_normalとした時にこの記事(ヘッダにtruncated_normalを含む)に辿れる機能があれば。。。
Swift3 / Alamofire4 利用時に、__tcp_connection_write_eof_block_invoke Write close エラーがでて、Responseが読めない

```
Alamofire.request(url, method: .get, parameters: ["key": "value"], encoding: JSONEncoding.default, headers: nil)
   .responseJSON(completionHandler: { response in
```
として実装していたところ、長時間応答待ち状態になり、
最終的に
**__tcp_connection_write_eof_block_invoke Write**
というエラーが発生し、JSONが読めないという問題に遭遇しました。

いくつか調べているとiOS10での問題だとか、iPhoneのSocket実装の問題だからAlamofireの問題じゃないよ、という回答がいくつか見つかったのですが、解決策がなかったので、少し手間取っていました。

根本的に原因が追いきれていないので、完全な解決策ではないのですが、

```
// url を https://www.hogehoge.com/apiから
// https://www.hogehoge.com/api?key=valueに変更
Alamofire.request(url, method: .get, parameters: nil, encoding: JSONEncoding.default, headers: nil)
   .responseJSON(completionHandler: { response in
```

とすることで問題が解決しました。
もし原因をご存知の方がいらっしゃったらコメントください。

悩んでらっしゃる方、一度お試しください。
TensorFlow > link > ReLU > Compared to other functions the usage of ReLU is preferable, because it results in the neural network training several times faster

https://www.tensorflow.org/versions/master/tutorials/mnist/pros/index.html#deep-mnist-for-experts
において紹介されているReLU。

https://en.wikipedia.org/wiki/Rectifier_(neural_networks)
> A unit employing the rectifier is also called a rectified linear unit (ReLU).[4]


ReLUで検索すると用語の説明以外がたくさん検索される。こういう情報の探しにくさはどうにかしたい。

https://en.wikipedia.org/wiki/Convolutional_neural_network
> Compared to other functions the usage of ReLU is preferable, because it results in the neural network training several times faster,[35] 

[35] Krizhevsky, A.; Sutskever, I.; Hinton, G. E. (2012). ["Imagenet classification with deep convolutional neural networks"](https://papers.nips.cc/paper/4824-imagenet-classification-with-deep-convolutional-neural-networks). Advances in Neural Information Processing Systems. 1: 1097–1105.
TensorFlow > link > ADAM optimizer > echizen_tmさんの解説

https://www.tensorflow.org/versions/master/tutorials/mnist/pros/index.html#deep-mnist-for-experts
において紹介されているADAM optimizer。

> Train and Evaluate the Model
...
> We will replace the steepest gradient descent optimizer with the more sophisticated ADAM optimizer.


http://qiita.com/kenmatsu4/items/7b8d24d4c5144a686412
> Adamについては30分でわかるAdamでechizen_tmさんが解説してくれています。

https://ja.scribd.com/doc/260859670/30minutes-Adam

@kenmatsu4さんの情報提供に感謝。
Vagrantで作成したローカルサーバにFTPクライアント(Cyberduck)からログインできないときの解決法

# はじめに
`$ vagrant ssh` したときはログインできるのに、FTPクライアント(Cyberduckなど)からはログインできないときの解決法です。

#
Vagrant用に作成されたボックスからサーバを構築すると、通常はユーザ名が`vagrant`、パスワードも`vagrant`のユーザが作成されます(ボックスによってはそうでない場合もあります。詳しくは後述します)。

ところが、FTPクライアントで、ユーザ名`vagrant`、パスワード`vagrant`でログインしようとしても失敗することがあります。でも `$ vagrant ssh` ではログインできます。

こういうときは鍵認証でログインすることができます。

# 公開鍵認証を使用する
サーバが起動している状態で`Vagrantfile`があるディレクトリに移動して `$ vagrant ssh-config` を実行すると以下のように表示されます。

```
Host default
  HostName 127.0.0.1
  User vagrant
  Port 2200
  UserKnownHostsFile /dev/null
  StrictHostKeyChecking no
  PasswordAuthentication no
  IdentityFile /Users/username/path/to/servername/.vagrant/machines/default/virtualbox/private_key
  IdentitiesOnly yes
  LogLevel FATAL
```

FTPクライアントの設定でパスワード認証を公開鍵認証に変更します。するとファイルを選択するダイアログが表示されますので、上記コマンドで表示された`IdentityFile`のパスを指定します。

ただしこのパスは隠しフォルダ内にあるので、OSの設定によっては隠しフォルダを表示するように設定する必要があります。Macではファイル選択画面で`command+shift+g`を押すとファイルのパスを入力できるようになるので、そこに`IdentityFile`のパスをコピペして選択ボタンを押せばOKです。

ちなみにVagrant用に調整されていないボックスでは、ユーザ名が`vagrant`ではない(パスワードも`vagrant`ではない)場合があります(たとえばUbuntuではユーザ名が`ubuntu`だったりします)。FTPクライアントで設定するユーザ名は必ず`vagrant`とは限らないことに注意してください。`$ vagrant ssh-config` で表示された`User`の項目に表示されたユーザ名を指定してください。

正しくユーザ名、秘密鍵のパスを指定すればログインできるようになります。

# さいごに
（`PasswordAuthentication no` となっていても）ボックスによってパスワードでログインできるものとそうでないものがあります。この違いが何なのかはわかりませんが、パスワードでログインできないときは公開鍵認証でのログインを試してみてください。
SwiftでAPIを取得する（感情解析）

#環境

- Swift2.0
- Xcode7.3.1


#API

使用したのはMetadata社が提供する『Mextractr 感情解析API』です。登録して使いました。お好きなサイトから取ってきてください。

#コード

```swift:get.swift
import UIKit

class AnalyzeViewController: UIViewController {
     
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        let str = "私は嬉しい"
        let encodedString = str.stringByAddingPercentEncodingWithAllowedCharacters(NSCharacterSet.URLQueryAllowedCharacterSet())
            getAPI(encodedString!)
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    func getAPI(encordedstr:String) {
        
        let URL = NSURL(string: "http://ap.mextractr.net/ma9/emotion_analyzer?out=json&apikey=<APIキー>&text=\(encordedstr)")
        let req = NSURLRequest(URL: URL!)
        
        let config = NSURLSessionConfiguration.defaultSessionConfiguration()
        let session = NSURLSession(configuration: config, delegate:nil, delegateQueue:NSOperationQueue.mainQueue())
        
        let task = session.dataTaskWithRequest(req, completionHandler: {
            (data, response, error) -> Void in
            do {
               //やりたいことを書く
                let dict = try NSJSONSerialization.JSONObjectWithData(data!, options:NSJSONReadingOptions.MutableContainers ) as! NSDictionary
                
                print(dict)
                
            } catch {
                //エラー処理
            }
            
        })
        task.resume()
    }
}

```

こんな感じでgetJsonのメソッドでAPIを叩いてます。呼び出すときは

```swift:
getAPI(<文字列の名前>)
```

とかで読んでください。
文字列は、エンコードします。


#APIを叩いた結果

```swift
{
    "analyzed_text" = "%E7%A7%81%E3%81%AF%E3%80%90%E3%80%90%E5%AC%89%E3%81%97%E3%81%84%E3%80%91%20[2.00,2.00,0.00]%20%20%E3%80%91";
    angerfear = 0;
    joysad = 2;
    likedislike = 2;
}
```
analyzed_textは、解析した文字列です。デコードすると元に戻ります。
今回は、「私は嬉しい」なので、ポジティブな配点になっています。
いい感じにできました！！

#☆★☆★まとめ★☆★☆

APIは叩けると楽しい！
自分用CSSメモ①

#ボックス
`<body>`内に書かれ、ブラウザに表示される要素は自分の領域を確保する。これをボックスという。CSSはボックスに対して表示状態を設定する。

```example.html
<style>
* {
  outline: 1px solid #ff0000;
}
</style>
```

上のようにすると、すべてのボックスにアウトラインがつく。

#@ルール
CSSのルール(セレクタと宣言ブロックのセット)は`<body>`内の各要素に対して適用されるが、@ルールは要素に適用しない特殊なルール。
`@charset "UTF-8";`など。

#コメント
`/* コメント */`と書く。

#セレクタの種類
-全称セレクタ
`* { スタイル }`
-タイプセレクタ
`p { スタイル }`など
-idセレクタ
`#footer { スタイル }`など
-classセレクタ
`.photo { スタイル }`など

#セレクタの組み合わせ
`td.photo { スタイル }`みたいな。

#擬似クラス
要素が特定の状態の時のみマッチするようになるもの。
`a:hover { スタイル }` マウスボタンが乗っている時だけマッチ
`a:active { スタイル }` マウスボタンが押されている時だけマッチ

#子孫コンビネータ
特定の親要素に含まれる子孫要素にマッチさせるセレクタ。
`#nav li { スタイル }`は`<ul id="nav">`に含まれる`<li>`にマッチする

#複数のセレクタを選択
`th,td { スタイル }`

#継承について
ある要素に適用したプロパティはその子要素にも継承される。
-テキストを装飾するプロパティは継承する
-ボックスを捜査するプロパティ、背景を指定するプロパティは継承しない

#CSSの記述場所
基本外部ファイルだが、タグ内に記述、`<style>`タグの要素として

#style.cssへのリンクの作成
```index.html
<head>
<meta charset ="UTF-8">
<title>KUJIRA Cafeへようこそ</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
```

のように、`<head>`タグの中に記述する。
nginxとunicornとmysqlのよく使う基本コマンド

度々忘れちゃうので、メモがてら。

#nginx

#####・インストール

```
sudo yum install nginx
```

#####・起動

```
sudo nginx
```

#####・停止

```
sudo nginx -s stop
```

#####・再起動

```
sudo nginx -s reload
```

#####〜メインの設定ファイル〜

```
/etc/nginx/
```


#####〜サーバー毎の設定ファイル〜

```
/etc/nginx/conf.d/
(アプリ名.confという名前で設定ファイル作成)
```

#unicorn

#####・起動

```
bundle exec unicorn -E production -c config/unicorn.rb -D
(-Eは環境、-cは設定ファイルの位置、 -Dはデーモン化)
```

#####・起動済みのPID確認

```
ps -ef | grep unicorn | grep -v grep
```

#####・停止

```
kill -QUIT `cat /path/to/unicorn.pid`
(kill [PID番号]でも可)
```

#####・再起動

```
kill -HUP `cat /path/to/unicorn.pid`
```

#####・緩やかな再起動

```
kill -USR2 `cat /path/to/unicorn.pid`
```

#MySQL(多いので詳細は[こちら](http://qiita.com/ToruFukui/items/2c75bd4a11a7817e6c9e)参照)

#####・ログイン

```
mysql -u [ユーザー名]
(mysql -u root -p が初期設定)
```

#####・ログイン状態から抜ける

```
quit
```


#####・起動

```
sudo service mysqld start
```

#####・停止

```
sudo service mysqld stop
```

#####・再起動

```
sudo service mysqld restart
```


※随時更新