OmniAICreator/Qiita-1.07M huggingface dataset:
Fluxxor で "Could not find flux on this.props or this.context of XXX" と言われる場合


[Fluxxor](http://fluxxor.com/) を使っていると次のようなエラーに出くわすことがある。

```
Uncaught Error: Could not find flux on this.props or this.context of XXXX
```

Fluxxor によって作られる Flux フローに関連するコンポーネント (React) は、Fluxxor Flux インスタンスを持っている必要があるが、これが見つからないと言われてしまっている。

原因
---

簡単に言うと、FluxMixin されたコンポーネントにおいて本来であれば render() で生成される子コンポーネントに対して自動的に Flux インスタンスが付与される処理が盛り込まれているが、それ以外の方法で生成されたコンポーネントにはそれがなされないから。


例
----

比較的キャッチーな [React Bootstrap](http://react-bootstrap.github.io/) の Modal component を用意した。


```
var MyModal = React.createClass({
    mixins: [ FluxMixin ],

    render: function() {
        return (
          <Modal {...this.props} title="Modal heading" animation={false}>
            <div className="modal-body">
              <h4>Text in a modal</h4>
            </div>
          </Modal>
        );
    },

	// ...
});

var ModalTrigger = React.createClass({
    mixins: [ FluxMixin ],

    render: function() {
        return (
          <ModalTrigger modal={<MyModal />}>
            <Button bsStyle="primary" bsSize="large">Launch demo modal</Button>
          </ModalTrigger>
        );
    },

	// ...
});

var flux = new Fluxxor.Flux(stores, actions);
React.render(<ModalTrigger flux={flux} />, document.getElementById("open-modal"));
```

細かな内容はさておき、上記コードを動かすと前述の Fluxxor エラーが MyModal に対して発生する。MyModal の生成が ModalTrigger によって行われているため。

なので、同一の Flux インスタンスをコンポーネント生成時に渡すようにしてしまえばいい。

```
var ModalTrigger = React.createClass({
    mixins: [ FluxMixin ],

    render: function() {
        var flux = this.getFlux();

        return (
          <ModalTrigger modal={<MyModal flux={flux} />}>
            <Button bsStyle="primary" bsSize="large">Launch demo modal</Button>
          </ModalTrigger>
        );
    },

	// ...
});
```


まとめ
----

特定の振る舞いをしたりコンポーネントを生成したりする Mixin を使っていたりすると、どこかで親子関係による Flux インスタンスのチェーンが切れてしまってこの状況になることが多そう。

なので、上記例のように関係が切れてしまいそうな箇所で落ち着いて getFlux() して生成されるコンポーネントのプロパティに渡してあげる。
delegateを共通部分だけ、実装したり、差し込んだり。

# はじめに

delegateを普通に実装していると、表示部分とイベント部分が一緒に定義されていて、表示は共通で実装したいが、イベントはそれぞれの呼び出し元で実装したいことがあります。
クラスを継承すれば、とりあえずは実装できますが、別のdelegateを定義しなくてはならなくて、スマートではないので、既存のプロトコルを生かした形で実現できる方法をまとめます。

# オリジナル

## プロトコル

```objc:OriginalDelegate.h
@protocol OriginalDelegate : NSObject

- (void)doCommon;

- (void)doPartly;

@end
```

## インターフェース

```objc:Original.h

@interface Original : NSObject

@property (nonatomic, weak) id<OriginalDelegate> delegate;

@end

```

# オリジナルを継承した実装

## インターフェース

```objc:Extend.h

@interface Extend : Original <OriginalDelegate>

@end
```

## 実装

```objc:Extend.m

@interface Extend () <OriginalDelegate>

// 呼び出し元を設定するdelegateを別名で定義
@property (nonatomic, weak) id<OriginalDelegate> originalDelegate;

@end

@implementation Extend

@synthesize delegate = _delegate;

- (void)init {
    if (self = [super init]) {
        //delegateを共通部分を実装しているインスタンスに設定
        _delegate = self;
    }
}

- (id<OriginalDelegate>)delegate {
    return _delegate;
}

// 呼び出すdelegateを設定
- (void)setDelegate:(id<OriginalDelegate>)delegate {
    self.originalDelegate = delegate;
}

- (void)doCommon {
    // doSomething.
}

- (void)doPartly {
    // 呼び出し元をcall
    // ここにも共通の処理を実装できる
    [self.originalDelegate didPartly];
}

@end

```

# 最後に

これで、呼び出し元でオリジナルと同様のインターフェース/プロトコルで実装できます。
'.'ドットで区切られた文字列が"0以上255以下で無い"または"整数で無い"場合に"False"を返す

### コード

```php:tekito.php
<?php

$str = "100.100.100.100";
$octet = explode('.', $str);

foreach ($octet as $x) {
    if (($x < 0) || ($x > 255) || (ctype_digit($x) == FALSE)) {
        echo "False" . PHP_EOL;
        break;
    }
}

?>
```



## 使用例
文字列（100.100.100.100）

```shell-session
$ php tekito.php
$
```

文字列（100.256.100.100）

```shell-session
$ php tekito.php
False
```

文字列（100.100.hoge.100）

```shell-session
$ php tekito.php
False
```


## 使用した関数
- explode
- ctype_digit



## ポイント
Falseは1回だけ返したいので条件にマッチしない文字列が出現した際に`echo`した後に`break`で`foreach`を抜ける。



## よくわからないところ
~~$octetを`var_dump`してみると全てデータ型が文字列(string)なのに、`ctype_digit`で整数とみなされるのはなぜなんだ。というかstringなのに数値比較も出来るのか。。うーむ。~~
コメントにて解決。ありがとうございます！
【AngularJS】$resourceからメソッドを生やす - ぼくが考えたngResourceべすとぷらくてぃす

`$resource`をModelとして扱いたい．
そうするとビジネスロジックをメソッドとして生やしたくなる．

ここでは`name`，`email`を属性としてもつ`User` Modelについて考える．

（ぼくは普段**CoffeeScript**を利用していますので，サンプルもそれでいきます）

# 下準備

## Moduleを作る

第2引数を与えると新規に作成（省略すると既存のが返ってくる）．

```coffeescript:sample_app.js.coffee
angular.module 'SampleApp', ['ngResource']
```

## Modelを作る（基本形）

DIしたら`User`（実態は生成された`Resource`）が注入される．

```coffeescript:user.js.coffee
User = ($resource) ->
  url = '/api/users/:id.json';
  defaultParams = { id: '@id' }
  actions = {}

  $resource(url, defaultParams, actions)

app = angular.module 'SampleApp'
app.factory 'User', [
  '$resource'
  User
]
```

## Controllerをつくる

さきほどの`User`を注入し，`/api/users`からユーザの一覧を取ってきている．

```coffeescript:users_controller.js.coffee
class UsersController
  constructor: (@$scope, @User) ->
    @users = @User.query()

  submit: (user) ->
    console.log 'Not yet implemented.'

app = angular.module 'SampleApp'

app.controller 'UsersController', [
  '$scope'
  'User'
  UsersController
]
```

## Viewをつくる

ユーザの一覧，`name`と`email`の更新フォームを生成してる．

```html:users/index.html
<ul ng-controller="UsersController as ctrl">
  <li ng-repeat="user in ctrl.users">
    <label>
      name: <input ng-model="user.name">
    </label>
    <label>
      email: <input ng-model="user.email">
    </label>
    <button ng-click="ctrl.submit(user)">送信</button>
  </li>
</ul>
```

# リクエストを飛ばすメソッドを生やす

ここから本題．

たとえば`PATCH`，更新処理とかに使うやつですね．
標準だと`$resource`から生えてこないので，オプションとして与えてあげましょう．

```coffeescript:user.js.coffee
User = ($resource) ->

  url = '/api/users/:id.json';
  defaultParams = { id: '@id' }
  actions = {
    update: { method: 'PATCH' }
  }

  $resource(url, defaultParams, actions)
```

`Users#$update()`が生えているので，それ呼び出したら`PATCH`メソッドで送られる．
便利だ．

```coffeescript:sample_app_controller.js.coffee
class UsersController
  
  # 省略

  submit: (user) ->
    user.$update()
```

# それ以外のビジネスロジック

たとえばValidation？
ここでは簡単に，&quot;`name`及び`email`は空になってはならない&quot;というものについて考える．

Railsで言うとこんなかんじ．

```ruby:user.rb
class User
  include ActiveModel::Model

  attr_accessor :name, :email

  validate :name, presence: true
  validate :email, presence: true
end
```

実際の実装．
`user.validate()`で結果をboolで返すだけのもの．
（これぐらいだとビジネスロジックとは言わないか…）

```coffeescript:user.js.coffee
User = ($resource) ->

  url = '/api/users/:id.json';
  defaultParams = { id: '@id' }
  actions = {
    update: { method: 'PATCH' }
  }

  User = $resource(url, defaultParams, actions)

  angular.extend User.prototype,
    validate: ->
      @name? && @email?
```

`class User < $resource()`したいところなんだけど，これには問題がある．
実は，レスポンスは必ず`Resource`でラップされてしまう（[ngResource 591行目付近](https://github.com/angular/angular.js/blob/master/src/ngResource/resource.js#L591)参照）．

ということで，`$resource()`の生成物（=`Resource`）の`prototype`を`angular.extend()`で拡張してメソッドをぶち込んでる．
かなしみ．

```js:src/ngResource/resource.jsより抜粋
if (action.isArray) {
  value.length = 0;
  forEach(data, function(item) {
    if (typeof item === "object") {
      value.push(new Resource(item));
    } else {
      value.push(item);
    }
  });
}
```

# 参考文献

* [AngularJSリファレンス](http://tatsu-zine.com/books/angularjs-reference)
ブラウザで開いているサイトを、直接編集できるようにするブックマークレット


地味にべんり。

HTML5 の contenteditable 属性を true にすることで、表示されている内容をブラウザから直接書き換えることができるようになります。

ということで `<body>`タグの contenteditable属性をオン／オフできるようにするブックマークレットを作った。


### コードはこちら

```javascript
javascript:(function(b){var a = b.getAttribute('contenteditable'); b.setAttribute('contenteditable', (a !== 'true' && a !== ''));})(document.body);
```

呼ばれるたびに編集モードがオン／オフになる感じです。地味にべんり。
Rails4でDBに依存しないモデルオブジェクトを作る

## はじめに

RailsはFormとDBの連携が簡潔便利に書けますが、
今回は中間モデルやコンバータ的に使えるモデルオブジェクトを作ります。

## 実装

### Model

```models/params/hoge.rb
# models/params/hoge.rb

module Params
  class HogeParam
    include ActiveModel::Model

    # 紐付くパラメータ群
    attr_accessor :name, :category

    # バリデーション定義
    validates :name, presence: true
    validates :category, presence: true
  end
end
```

### Controller

```controllers/fugas_controller.rb
# controllers/fugas_controller.rb

class FugasController < ApplicationController
  def index
    # リクエストパラメータからModelを生成
    @param = Params::HogeParam.new(params)
    
    # valid?でバリデーションを実行
    puts @param.valid? # => true | false
    
    # バリデーションの結果、エラーの場合はActiveModel::Errorsが入る
    puts @param.errors.messages # => {:name=>["can't be blank"]}
    
    render formats: [:json]
  end
end
```

## 参考
ActiveModel::Modelでは便利な機能が多数用意されているので、
公式リファレンスも参照ください。

<http://api.rubyonrails.org/classes/ActiveModel/Model.html>
RubyMine Tips ファイルタブを見やすく



デフォルトだと、タブが重なってしまって、沢山表示すると見えなくなるんですよね。
そこで、タブを複数行に表示する設定。

`Show tabs in single row`のチェックを外します。

![Preferences_と_dispatch_spec_rb_-_ehonclub_-____guild_ehonclub_.png](https://qiita-image-store.s3.amazonaws.com/0/15529/66a71b29-6e5d-f264-4b0f-b18d85612dc7.png "Preferences_と_dispatch_spec_rb_-_ehonclub_-____guild_ehonclub_.png")




こんな感じになります。

![new_html_haml_-_yuk-blog_-____ror_yuk-blog_.png](https://qiita-image-store.s3.amazonaws.com/0/15529/d078c70f-2fe6-b3d7-2b59-5065f3919662.png "new_html_haml_-_yuk-blog_-____ror_yuk-blog_.png")
Cordovaで端末情報を取得する

[org.apache.cordova.device][1] を使うことで、UUIDなどの端末情報を取得することができます。

インストール

```sh
$ cordova plugin add org.apache.cordova.device
```

devicereadyイベント後に以下のように取得できます。

```js
document.addEventListener('deviceready', function () {
    console.log('UUID: ' + device.uuid);
    console.log('model: ' + device.model);
    console.log('platform: ' + device.platform);
    console.log('version: ' + device.version);
}, false);
```

### 出力例

#### iOS

```
UUID: E5BA1AC9-6F7D-4815-AECB-3DF670281F81
model: iPhone5,2
platform: iOS
version: 8.1.1
```

#### Android

```
UUID: 7005121694c81ad5
model: FJL22
platform: Android
version: 4.2.2
```

 [1]: https://github.com/apache/cordova-plugin-device
dfコマンドとduコマンドの覚え書き

何となくしか知らなかったので、`df`コマンドと`du`コマンドの覚え書き。

```
$ df
Filesystem           1K-ブロック    使用   使用可 使用% マウント位置
/dev/mapper/VolGroup00-LogVol00
                      43390096  39005268   2145136  95% /
/dev/cciss/c0d0p1       101086     19252     76615  21% /boot
tmpfs                 12342044   6411624   5930420  52% /dev/shm
/dev/sdb1            1440465360 1243255776 124038116  91% /iscsi
```

```
$ df -h
Filesystem          サイズ  使用  残り 使用% マウント位置
/dev/mapper/VolGroup00-LogVol00
                       42G   38G  2.1G  95% /
/dev/cciss/c0d0p1      99M   19M   75M  21% /boot
tmpfs                  12G  6.2G  5.7G  52% /dev/shm
/dev/sdb1             1.4T  1.2T  119G  91% /iscsi
```

`df` = `disc free`の意味で、空きスペースを表示する。
ちなみにしばし混同するのは、`du` = `disc used` の意味で、ディレクトリ内のファイル容量を表示する。

```
$ du /home/hoge
4       /home/hoge/app
40      /home/hoge
```

```
$ du -h /home/hoge
4.0K    /home/hoge/app
40K     /home/hoge
```

`-h`オプションで見やすくなるだけ。どちらも`-h`オプションは有効である。
AngularJS + zepto.js でスムーススクロール

スムーススクロールのためにわざわざjQueryを入れたくなかったのでメモ。

```js
function scroll() {
      //第一引数にスクロールする位置  第二引数は速度
      $('body').scrollTo(0, 400);
    }

    // zeptoへの拡張(๑•̀ㅂ•́)و✧
    $.fn.scrollTo = function(scrollHeight ,duration) {
      var $el = this;
      var el  = $el[0];
      var startPosition = el.scrollTop || document.documentElement.scrollTop;
      var delta = scrollHeight - startPosition;

      var startTime = Date.now();

      function scroll() {
        var fraction = Math.min(1, (Date.now() - startTime) / duration);

        el.scrollTop = delta * fraction + startPosition;
        // IE対策_:(´ཀ`」 ∠):_
        if(!el.scrollTop) {
          document.documentElement.scrollTop = delta * fraction + startPosition;
        }

        if(fraction < 1) {
          setTimeout(scroll, 10);
        }
      }
      scroll();
    };
```

やってることとしては、zeptoの拡張なんだけど。。
こんな感じでいいのかな…？
（IE対策周りが自信ない。。）

AngularJSのdirectiveにした例がこちら
https://github.com/keyiiiii/smooth-scroll-directive/blob/master/to-top-directive.js

scrollToの引数は変数にするなり適宜かえてもらえればと。
SSZipArchiveで暗号化zipを解凍するとテキストファイルにゴミが入ることがある

# 現象

暗号化zipをMac上で以下のコマンドで作成して、iOSアプリでSSZipArchiveを使用して解凍していたら、どうもcsvファイル(ShiftJIS)にゴミが入る。

```
zip -r0 -P passward data data
```

先方の事情で、csvはWindowsExcelから吐くのでどうしてもShiftJISのままがいい。

# 対処

以下のコマンドに変えたらうまくいったよ。

```
zip -r -P passward data data
```

0は「無圧縮」の指定。
圧縮率は０〜９で、1→9で圧縮率が高くなる。
省略した場合は、6。

SSZipArchiveのせいとも一概には言えないが、今は一見うまくいっているので様子見。
0指定でうまく解凍できていたときもあるので、ファイルサイズとかcsvファイルの中身の文字とかに依存するのかなあ。。。
だとしたら、今後またファイルサイズが変わったら「圧縮率6」指定じゃうまくいかないパターンもあり得るね。。。
【FileMaker】ODBCアドミニストレータは標準ではなくなったよ

もうご存知の方も多いと思いますが、FileMaker ヘルプサイトの[ODBCクライアントドライバの設定](http://www.filemaker.co.jp/help/html/odbc_ess.20.2.html#1032798)が未だ古い情報なのでここで喚起です。
対象がFileMaker Pro 10なので、現状あってませんが、検索するとヒットしてくる確率が高いので。

Mac OSでのODBCドライバツールとして、ODBCアドミニストレータをアプリケーション／ユーティリティでとありますが、すでにバンドルされていません。（[4D Company Blog - ODBCアドミニストレータとODBCドライバ](http://www.4d.com/jp/blog/odbc-administrator.html))

しかも、Macバージョンは上記記事にあるAppleサイトからも消えてしまっていますので、要注意です。

FileMaker Pro 13の最新のODBC事情は、こちらの[PDF](https://fmhelp.filemaker.com/docs/13/ja/fm13_odbc_jdbc_guide.pdf)で。

FileMakerの製品CD（オンライン購入ならdmgファイル）にODBCドライバのパッケージがありますので、そちらをインストールしてくださいね。

![1216_0.png](https://qiita-image-store.s3.amazonaws.com/0/60538/77fccf48-5a2c-ddd4-355b-9435f642173a.png)

ではまた！
ti.map をちょっとだけ便利にしちゃう改造



### はじめに

iOS 用 ti.map モジュールの記事になります。Android な方はごめんなさい。

さて、この記事は ti.map モジュールの基本的な使い方ではなく、Objective-C では存在する機能を有効化するために、ちょっとだけ改造したものの解説になります。

### ti.map Gesture Recognizer fork

[https://github.com/k0sukey/ti.map/tree/GestureRecognizer](https://github.com/k0sukey/ti.map/tree/GestureRecognizer)

ti.map モジュールへタッチ系イベントを追加するフォークになります。よくある地図をタップした地点にアノテーションを追加したいときなどに使えるかと思います。また、ti.map には ```pitchEnabled``` と ```rotateEnabled``` はあるのですが、なぜか ```zoomEnabled``` が存在しません。地図をピンチで拡大縮小するのを許可するかしないか、ですね。このメソッドも追加してあります。

#### 使い方

```javascript
var Map = require('ti.map'),
	map = Map.createView({
		top: 0,
		right: 0,
		bottom: 0,
		left: 0,
		width: Ti.UI.FILL,
		height: Ti.UI.FILL
	});

map.addEventListener('click', function(e){
	// e.x, e.y, e.latitude, e.longitude
});

map.addEventListener('touchstart', function(e){
	// e.x, e.y, e.latitude, e.longitude
});

map.addEventListener('touchmove', function(e){
	// e.x, e.y, e.latitude, e.longitude
});

map.addEventListener('touchend', function(e){
	// e.x, e.y, e.latitude, e.longitude
});
```

コールバックでイベントが発火した地点の経度緯度、ビュー自体の xy 座標が返却されます。

### ti.map MKDirections fork

[https://github.com/k0sukey/ti.map/tree/MKDirections](https://github.com/k0sukey/ti.map/tree/MKDirections)

ti.map モジュールへ MKDirections を追加するフォークになります。MKDirections は Apple のサーバへ問い合わせをして、2地点間のルートを検索してくれます。

#### 使い方

```javascript
var Map = require('ti.map'),
	map = Map.createView({
		top: 0,
		right: 0,
		bottom: 0,
		left: 0,
		width: Ti.UI.FILL,
		height: Ti.UI.FILL
	}),
	directions = Map.createDirections({
		source: { // 六本木
			latitude: 35.665213,
			longitude: 139.730011
		},
		destination: { // 渋谷
			latitude: 35.658987,
			longitude: 139.702776
		}
	});

directions.addEventListener('success', function(e){
	// e.routes
	var route = Map.createRoute({
		points: e.routes[0].route
	});
	map.addRoute(route);
});

directions.addEventListener('error', function(){
	alert('oops!');
});
```

コールバックの返却値には ```Map.route``` でそのまま使えるオブジェクトが配列で格納されています。また、経路案内とその区間の距離（メートル）も格納されていますので、そのままナビアプリとして利用することができますね。

おまけで、該当ルートが表示している地図へちょうど収まるサンプルコードもどうぞ。

```javascript
var points = e.routes[0].route,
	maxLat, maxLng, minLat, minLng;

for (var i = 0; i < points.length; i++) {
	maxLat = maxLat ? Math.max(points[i].latitude, maxLat) : points[i].latitude;
	maxLng = maxLng ? Math.max(points[i].longitude, maxLng) : points[i].longitude;
	minLat = minLat ? Math.min(points[i].latitude, minLat) : points[i].latitude;
	minLng = minLng ? Math.min(points[i].longitude, minLng) : points[i].longitude;
}

map.applyProperties({
	region: {
		latitude: (maxLat + minLat) / 2,
		longitude: (maxLng + minLng) / 2,
		latitudeDelta: (maxLat - minLat) * 1.1, // マージン付き
		longitudeDelta: (maxLng - minLng) * 1.1 // マージン付き
	}
});
```

### 最後に

[八木さん](https://twitter.com/yagi_)の[TitaniumとPubNubでリアルタイムサービス](http://qiita.com/yagi_/items/5283249036feaf655b16)と組み合わせると、みんなで集合しながらメッセージが送り合えるアプリが作れちゃいそうですね！これを書いていてちょっと作ってみたくなっちゃいました。冬休みの宿題にしようかな？

さて、明日は八木さんの「Firebaseを使ってリアルタイムサービス」になります。楽しみですね！
記念すべき、第1回 milkcocoa Meetupで登壇させて頂きました。


昨日開催されたmilkcocoa Meetupで登壇させて頂いたので、登壇内容を少し整理して書いておきます。

![](http://i.gyazo.com/fa0b60f03209c16d3f1295c5f11b1af4.png)

資料はこちらです。 (milkcocoaのiOSとNode.js SDKを実案件で使ってみた話 http://slides.com/sugawararyousuke/milkcocoa-ios-node-js-sdk )

## 概要
milkcocoaのiOSとNode.js SDKを使った話をしました。milkcocoa自体は **現時点ではフロントエンドエンジニアがバックエンドの知識が無くてもデータベースやWebSocketが使えるよ!という位置づけ**だと思っています。

その認識は間違ってないと思うのですが、milkcocoaはそれだけでは無く、iOSやNode.jsといったその他のプラットフォームにも対応(or 今後対応)しています。

**今まではmilkcocoaといったら爆速でチャットが作れるアレ**というイメージだったかもしれないですが、 **違う側面での使い方の紹介**をしました。

## milkcocoa iOS SDK

一言で言うと、ROMOを使ってIoTなプロダクトを作った話をしました。 

![](http://i.gyazo.com/d35e505e4457054379f8bf399e7a7da6.png)

ROMOはiPhoneがラジコンになるおもちゃみたいなものです。(http://liginc.co.jp/web/programming/other-programming/130665)

@nobkzさんにiOS SDKを先行して使わせて頂き、Swift/ROMOとWebを連携させることに成功。

### Web屋がIoTやる時のジレンマとmilkcocoa
IoTなことをやろうとすると、センサーデバイス側やAndrod,iOSなどの幅広い知識が必要になることが多いと思います。ただ、私(達)はWeb屋なので **Webを超えた広い知識**はなかなか覚えられていません。カンタンなフラグ切り替えだったり、パラメーターを各デバイスに渡してあげるだけの実装だとしても、初歩的な部分でつまづいて、プロダクト全体や細部を作る時間が圧迫されがちになると思います。

milkcocoaを使うことで **デバイスの連携がカンタンにでき、プロダクトの設計などメタレイヤーに集中出来ました。**

## milkcocoa Node.js SDK
一言で言うと、サーバーの負荷分散にmilkcocoaを使ってみたという話です。

![](https://s3.amazonaws.com/media-p.slid.es/uploads/sugawararyousuke/images/933046/c14de5b929aa3444a9f1f3b5eec9ef1b.png)

自前でサーバーのオートスケールを考える時間、余裕、スキルが無い場合でもmilkcocoaを中間に挟むことで、同時アクセスをさばける構成を作れます。
>その分、milkcocoa側の負荷がかかるんじゃないのかとという疑問はあると思いますが、そこは料金との兼ね合いになると思うので、直接TechnicalRockstarsさんに聞いてみましょう。

今回はとある処理をNode.js側で行い、処理が終わったタイミングでmilkcocoa経由で見れているユーザーにお知らせするといった構成でした。
`Node.js -> milkcocoa`の一方通行な通信の場合はこの構成で十分な気がしています。

> milkcocoa側でユーザーイベントを取得してNode.js側に伝えるという`Node.js <- milkcocoa`の方向をやる場合はまた別の方法を考えたいですね。

### インタラクティブ時のジレンマとmilkcocoa
インタラクティブな案件の場合は、インフラ側は同時アクセス数をいかにさばけるかが大事になります。しかし、アクセス時のオートスケールだったりに掛かる作業コストを含めた金額面は安く無いです。ここをmilkcocoaにすることで、 **アプリ開発者はユーザーからの同時接続数を考える手間が無くなり、プロダクトの設計などメタレイヤーに集中出来る**というメリットを感じられました。

iOSとNode.jsの事例で両方で感じたことですが、milkcocoaを使うことで **ユーザーが作りたいものを作りやすくなる**っていう面が一貫していると感じました。milkcocoaの思想はそういった部分にあると思います。(このあとの@nobkzさんの話にもありましたね)

## milkcocoaのサポートが強い / サポートエピソード

限定的にiOS SDKを使わせてもらったときの話です。
![](https://s3.amazonaws.com/media-p.slid.es/uploads/sugawararyousuke/images/932940/580a682bb596fdc8ca3748cefb949cce.png)

CTOの@nobkzさんに **SDKの実装をObjective-Cで欲しいかSwiftで欲しいかを聞かれました笑**

そこでSwiftが良い!といったら **4日後にホントにSwift用でSDKを作っていただきました。**

Objective-CでもSwiftでも作っていただいたものを使おうとしていたので、これはかなり面食らいましたね笑



## 最後に
以上がスライドに載せた内容で伝えたかった部分の要約です。 もっと細かく書くと色々あるんですけど、開催報告レポートとかでまとめたいと思います。

@nobkzさんがエモい話をして **ブログ書いて下さい** とおっしゃっていましたね。みんな記事を書きましょう笑

##リンクなど
* イベントページ http://mlkcca.connpass.com/event/9891/
* ROMO http://www.romotive.jp/
* Tweetまとめ http://togetter.com/li/758049
* milkcocoaのiOSとNode.js SDKを実案件で使ってみた話 http://slides.com/sugawararyousuke/milkcocoa-ios-node-js-sdk
webプログラム環境構築に便利なサービス２０１４


追記16/12/2014 T.Nonaka
いくつかかき集めた記憶はあるのですが、どこだったけ？
元記事忘れてしまいました。すいません
私のオリジナルではないです。
元々、学生さん向けのまとめ資料なんです。

Bootstrap系

Bootstrap(最新：フラットデザイン)
http://getbootstrap.com/

Free Design Template
http://startbootstrap.com/ (おすすめ)
http://www.templatemag.com/free-bootstrap-templates/
http://www.blacktie.co/

有料でもよければ、
https://wrapbootstrap.com/

CSSアニメーション

Animate.css (おすすめ)
http://daneden.github.io/animate.css/
軽量でめちゃくちゃ使いやすい！

ロゴ作成

Squarespace (おすすめ)
http://www.squarespace.com/logo#

LOGASTER
https://www.logaster.com/

いろんなHTMLパーツジェネレーター

coveloping (おすすめ)
http://coveloping.com/
Priceページとか、色々なパーツを簡単に生成できるツールが集まっている

TeamPage.io
http://www.teampage.io/
簡単にチームメンバーページが作れるツール

FRAME
http://frame.lab25.co.uk/
それっぽいトップページ生成

UICloud
http://ui-cloud.com/
UIの参考パーツを検索できるgoogleみたいなサービス

画像サイズ圧縮

二つとも画質をほとんど落とさずにファイルサイズを半分以下くらいまで落としてくれる最強無料ツール

JPEGmini (おすすめ)
http://www.jpegmini.com/

TinyPNG (おすすめ)
https://tinypng.com/

画像加工

GIMP
http://www.gimp.org/

SeaShore(Mac)
http://seashore.sourceforge.net/The_Seashore_Project/About.html

Webサービス名ジェネレータ

Dislexicon: The English Language Extender
http://www.robobunny.com/cgi-bin/dislexicon
keyとなる英単語を入れると、それにまつわるイケテルサービス名を教えてくれる
Androidアプリも出てるので、気に入った名前を保存とかしておいてもいいかも

Webサービスネーミングアイデアツール
http://c.hrgrweb.com/naming/
DNSに登録されている英単語を繋ぎ合わせてサービス名っぽいものをランダムに表示してくれる
シンプルだけど地味に便利

かっこいいフリー画像

MEDIUMのブログにいい感じのリストがある
https://medium.com/@dustin/stock-photos-that-dont-suck-62ae4bcbe01b

かっこいいフリー動画

背景動画に使えるクールな動画集(※しかも個人商用利用可)
http://mazwai.com/#index
ちょ〜クールな動画がたくさん

VIDE 背景画像をすぐに実装できるjQueryプラグイン
https://github.com/VodkaBears/Vide#readme
マジで簡単！

アイコン

ICONFINDER
https://www.iconfinder.com/

SNSの顔写真素材ジェネレーター

uiFaces
http://uifaces.com/
SNSの顔写真を並べたいときとか、Demoで使いたいときに使えるサービス
APIもあるから結構使える！

多言語対応

Wovn.io
http://wovn.io/
ソースコードに1行足すだけで、全てのページを多言語化できる！

カラーパターン選定

Adobe Kuler (高機能)
https://kuler.adobe.com/create/color-wheel/

HUE/360 (シンプル)
http://hue360.herokuapp.com/

Web Colour Data
http://webcolourdata.com/
既存の有名Webサービスのカラーコード集

サービス紹介動画

Wideo
http://www.wideo.co/
パワーポイントみたいなイメージで紹介動画を作れるサービス

ソーシャルプラグイン

SNSのシェアボタンを簡単にまとめて生成できるツール

AddThis
http://www.addthis.com/

忍者おまとめボタン
http://www.ninja.co.jp/omatome/

サーバー

Heroku
https://www.heroku.com/
言わずと知れた無料でも使えるクラウドサーバー
プロトタイプを作ったりするのには最高

New Relic(Heroku:add-on)
https://devcenter.heroku.com/articles/newrelic
すごい簡単＆無料でHerokuに導入できるサーバー監視ツール
これを入れておけば、サーバーの負荷の詳細やエラー通知などを教えてくれる

メール配信

SendGrid
http://sendgrid.com/
Herokuのaddonで使うとより便利

HTMLメール

MailChimp
http://mailchimp.com/
HTMLメールを簡単に作れて、ステップメールの設定とかまでできてしまう神ツール

Zurb
http://zurb.com/ink/
レスポンシブ対応のHTMLメールを簡単に作れるテンプレートが充実
パーツごとのコーディング方法とかもドキュメントであるので便利

Antwort
http://internations.github.io/antwort/
自分でカスタマイズしたHTMLメールを作るときにはシンプルでいいと思うツール

ファビコン系

Favicon Generator
http://favicon-generator.org/
画像をアップするとfavicon.icoを生成してくれる無料ツール

Tinycon - ファビコンに数字のアラートを出せるjsライブラリ
https://github.com/tommoor/tinycon
BibLaTeXにおける書体の統一

<a href="http://qiita.com/mr_konn/items/3f523eb6dcf1d9837c92">日本語環境における文献処理について</a>の記事を参考に参照文献をBibLaTexで出したところ、<b>セリフ・サンセリフ・イタリック・ボールド（しかも英字和字それぞれ）全部のコンビネーションで表示される</b>というお祭り状態。



４時間くらい格闘しましたが、biblatex1.sty中の\emphを全て\rmに置換することで全部がロマン体で表示され解決したはず。


あとはURL:とか消したいんだけれどちょっとギブアップ。
あとはSIST02で表示するようにしたいんだけれどちょっとギブアップ。
nginxパフォーマンスチューニング〜静的コンテンツ配信編〜

今回はHTMLやCSS、Javascriptといった比較的軽量な静的コンテンツの配信をnginxでやるケースに絞ってチューニングする際のポイントについて紹介しようかと思います。

(注：`worker_rlimit_nofile`やsysctl.confのネットワーク周りの設定のような定石的なチューニングについてはあえて解説しないのであらかじめご了承ください。)

## コンテンツをgzip圧縮する

何はともあれgzip圧縮です。ネットワーク帯域に比べればCPUリソースなんて安いものです。

```nginx
# コンテンツをgzip圧縮する
gzip on;
```

しかし、多くの場合これだけでは十分ではありません。何故ならnginxはデフォルトではContent-Typeが`text/html`のコンテンツしか圧縮しないためです。圧縮対象のContent-Typeを増やすには`gzip_types`を使います。

```nginx
# text/htmlはgzip onであれば常に圧縮される
gzip_types text/css text/javascript;
```

単純なWebサイトであれば上記の設定で十分ですが、場合によっては`application/json`や`application/javascript`といったContent-Typeを加えるのもよいでしょう。

また、Apacheのmod_deflateと違ってnginxのgzip圧縮モジュールは`gzip_vary on;`と書かないとコンテンツをgzip圧縮した際に`Vary: Accept-Encoding`を付加しないので注意しましょう。

[コンテンツキャッシュとVaryヘッダとnginx](http://qiita.com/cubicdaiya/items/09c8f23891bfc07b14d3)

## gzip_staticモジュールで圧縮済みのコンテンツを配信する

「ネットワーク帯域に比べればCPUリソースなんて安いものです」とは言ったものの、やはり配信量が増えてくるとgzip圧縮によるCPUリソースの消費も無視できなくなってきます。

そういった場合に有効なのが`gzip_static`です。通常nginxでコンテンツのgzip圧縮を有効にした場合(`gzip on`)、コンテンツを配信する際に毎回コンテンツのgzip圧縮を行いますが、`gzip_static`を有効にすると既に圧縮済みのファイル(e.g. xxx.js.gz)があればそれをそのまま配信します。なのでこの機能を使うとCPUリソースを大幅に節約できます。また、gzip圧縮をサポートしていないクライアントにも配信する場合は`gunzip`を利用してgzファイルを展開するようにしましょう。

```nginx
# xxx.(css|js).gzが存在したらそれをそのまま配信する
# また、クライアントがgzip圧縮をサポートしてない場合はgzファイルを展開して配信する
location ~* \.(css|js)$ {
    gzip_static always;
    gunzip on;
}
```

あと、`gzip_static`と`gunzip`を利用するにはnginxのconfigure実行時に`--with-http_gzip_static_module`と`--with-http_gunzip_module`のオプションが必要です。

### zopfliでさらに圧縮する

[zopfli](https://code.google.com/p/zopfli/)はgzipやzlibが利用しているdeflate互換の圧縮アルゴリズム(とその実装)です。
deflateと互換性があるので[zopfli](https://code.google.com/p/zopfli/)で圧縮したコンテンツはdeflateで展開することができます。加えてzopfliはdeflateよりも圧縮率が高い(数％)という利点があります、その反面圧縮にかかるコストはdeflateに比べて非常に高いので、nginxでコンテンツを配信する際に毎回[zopfli](https://code.google.com/p/zopfli/)で圧縮するといったようなことは現実的ではありません。

しかし、`gzip_static`を利用しているのであれば話は別です。先述の通りzopfliはdeflateと互換性があります。zoplfliで圧縮したファイルはdeflateで展開可能なのでzopfliで圧縮したgzファイルを`gzip_static`で配信すればよいわけです。

## expiresでクライアントにキャッシュさせる

コンテンツを圧縮することでネットワーク帯域を節約できるのはよいことですが、もっと帯域を節約できるよい方法があります。それは一度アクセスしてきたクライアントには自身のキャッシュを利用するようにして配信サーバ自体は304を返すようにすることです。

今回は静的コンテンツの配信なのでnginxの場合は以下のように`expires`を設定するだけで十分でしょう。

```nginx
expires 30d;
```

`expires`は結構書式がいろいろあってややこしいので詳しくは[本家のドキュメント](http://nginx.org/en/docs/http/ngx_http_headers_module.html#expires)をご覧ください。

## open_file_cacheで配信コンテンツのファイル情報をキャッシュする

`open_file_cache`を利用するとファイルディスクリプタやサイズ、更新時間といった情報をキャッシュすることができます。

```nginx
# キャッシュのエントリー数(max)とアクセスがないキャッシュの有効期間を設定
open_file_cache max=100 inactive=10s;
```

主にファイルのopenやcloseに伴うシステムコールのオーバーヘッドを軽減する効果があります。
elispでgoroutine的なものを作ろうとした

# el-routine.el の紹介

Emacsでgoのgroutineのようなものを作ってみました。

- https://github.com/kiwanami/emacs-elroutine/blob/master/el-routine.el

まだ実験段階ではありますが、以下のようなコード片と引数を渡すと、別プロセスを立ち上げて実行します。結果はdeferredで返ってきます。

```lisp
(deferred:pp
  (elcc:routine-d '(lambda (x y) (+ x y)) 1 2))
```

`elcc:routine-d` で渡したタスク（コード片と引数）は、キューに積まれて、予め決められたワーカープロセスの数で処理されます。（今のところ、 `elcc:init-process`を実行した時点の`elcc:process-max-number` で決まりますが、APIがダサいので今後変わると思います）

`elcc:demo`では、以下のようにフィボナッチを並列に計算してみました。

```lisp
(defun elcc:demo ()
  (interactive)
  (lexical-let
      ((code '(lambda (x) 
                (let* ((f (lambda (f xx) 
                            (if (> 2 xx) 1 
                              (+ (funcall f f (- xx 1)) (funcall f f (- xx 2)))))))
                  (funcall f f x))))
       (begin-time (float-time)))
    (deferred:nextc
      (deferred:parallel-list
        (loop for i from 1 below 30
              collect
              (elcc:routine-deferred-internal code (list 30))))
      (lambda (xs) 
        (message "Result: (time %s) %S " (- (float-time) begin-time) xs)))))
```

手元の Intel(R) Core(TM) i7-4600U CPU @ 2.10GHz の 4 core でいくつかワーカーの数を変えて動かしてみました。

| worker num | time(second) |
|-----------:|------------:|
|         1  |  16.890     |
|         2  |  10.141     |
|         4  |  10.548    |

一応、1個よりは2個が速いのですが、2個で打ち止めになってしまいました。

# 考察など

まず、モチベーションとしては、Emacsでスレッドぽいものが出来ないかということからでした。

Emacsでの並行処理については[EmacsWiki:ConcurrentEmacs](http://www.emacswiki.org/emacs/ConcurrentEmacs)にまとめられていますが、なかなかむつかしそうです。

半年に一度ぐらい、emacs-develで、Emacs上のthreadについての[話題](http://thread.gmane.org/gmane.emacs.devel/163016)が出て盛り上がるのですが、個人的にはそんなに簡単にはうまく行かないのではないかと思っています。

Emacsでの別プロセスでの実行の簡単なパッケージとしては、emacs-asyncが有名です。

- https://github.com/jwiegley/emacs-async

これは、別プロセスのEmacsを毎回立ち上げてS式を実行させるもので、独立した単純な処理ではそれなりにうまく動きます。しかしながら、複数の処理をつなげるような場合にはかなり厳しいです。

非同期処理だと、拙作の [deferred.el / concurrent.el があります。deferred.el でemacs-asyncと似たようなことが出来ます。また、epc.el というRPCスタックもあり、これを使えばプロセス間で自由に通信が出来ます。

- https://github.com/kiwanami/emacs-deferred
- https://github.com/kiwanami/emacs-epc

今回は、これらを組み合わせて、タスクのキューを作り、とりあえず形だけ動かしてみました。
シングルスレッドのモデルの場合は、このようにプロセス間でメッセージを使った通信で並行処理を行うといいのではないかと思っています。

今後の方針として、`require`や関数の定義を渡したり、goのようにchannelで通信したり、Emacsらしくバッファをプロセス間で共有する仕組みなどを作ると便利なのかなとか思っていますが、自分でもこんなものが本当に必要なのだろうかと疑問に思っているため、もしかしたら続かないかも知れません。

以上でした。
MacのターミナルをCentOS風に色っぽくする方法

普段サーバーOSはCentOSを使っています。
クライアントはMacです。
ローカルの作業ではターミナルを使うのですが、CentOSのような色っぽくないのがとても寂しいのです。

![スクリーンショット 2014-12-16 2.21.27.png](https://qiita-image-store.s3.amazonaws.com/0/61439/1d17e50c-aac3-2795-a633-6663babc7323.png)

デフォルトだとファイルとディレクトリの区別は、パーミッション（drwx------）を見なければなりません。

色っぽくなるとどうなるかと言うと、こういうことです。

![スクリーンショット 2014-12-16 2.21.49.png](https://qiita-image-store.s3.amazonaws.com/0/61439/78a79665-4f96-7238-f632-0e3c9e334c5f.png)

違いがわかったでしょうか？
.sshとLibraryはディレクトリなのですが、水色表示になりパッと見わかりやすくなりました。
私のMacではこの設定をデフォルトにしています。

設定は自分のホームディレクトリにある、.profileに行います。
アカウントがyamadaの場合

vim /Users/yamada/.profile

```
export CLICOLOR=1
export TERM=xterm-color
export LSCOLORS=gxfxcxdxbxegedabagacad
```

.profileを保存後、ターミナルにログインし直すと設定が反映されます。
ターミナルのテーマによっては見辛くなるのでご注意下さい。
CentOS7のhttpd設定で詰まった点


初めてCentOS7を触ったのですが、いくつか詰まったところがあったのでまとめます。

## serviceではなくsystemctlを使う

今までhttpdなどのサービスは`service`コマンドを使っていましたが、CentOS7からは`systemctl`コマンドを使うことになります。

```bash
# sudo service httpd start の代わり
sudo systemctl start httpd.service

# sudo chkconfig httpd on の代わり
sudo systemctl enable httpd.service
```

末尾の`.serivce`は省略してもよいみたいです。

## ファイアウォール設定を要確認

`Firewall-cmd`というファイアウォールが自動的に有効になっている場合があり、見落としがちです。

ポート80 (http) と 443 (https)を開けるには、下記のようにします。

```bash
firewall-cmd --permanent --zone=public --add-service=http 
firewall-cmd --permanent --zone=public --add-service=https
firewall-cmd --reload
```

## 参考

[Install Apache, PHP And MySQL On CentOS 7 (LAMP) | HowtoForge - Linux Howtos and Tutorials](http://www.howtoforge.com/apache_php_mysql_on_centos_7_lamp)
Ubuntu+Pyenv+Python3の環境でmatplotlibのグラフ表示ができなかった時の対処

## 遭遇した現象
Ubuntu14.04上でpyenvを使ってPython3.4.2をインストールし、matplotlibをpipで導入したが、pyplotなどでshow()を実行してもグラフ表示がされなかった

## 原因
pyenvで3.4.2をインストールした際に、pythonからtkを利用するためのTkinterがインストールされていなかったため。python本体をインストールした後にTkinterをインストールしてもビルド時に参照されないため、先にTkinterをインストールしておく必要がある模様。

## 対処
もしかしたら、後でインストールしてもうまくいく方法があるのかもしれないけど、とりあえずうまく行ったのは以下。

* いったんpyenvで3.4.2をアンインストール

```shell-session
$ pyenv uninstall 3.4.2
```

* Ubuntuでインストールする場合のTkinterであるpython-tkをインストール

```shell-session
$ sudo apt-get install python-tk
```
（※その他のtkを利用するためのlibtkなどはインストール済み前提）

* pyenvで3.4.2を再インストール後、matplotlibをpipで再インストール

```shell-session
$ pyenv install 3.4.2
$ pip install matplotlib
```

自分の環境では上記の対応で表示できるようになった。インストール後に適当にグラフなど作成してみて表示できればOK。
apache2.confにNameVirtualHostを書いたらNameVirtualHost has no effect and will be removed in the next releaseと言われました

apacheでNameVirtualHostを使おうとしたら意味ないって言われました。環境はUbuntuです。

# apacheのバージョンは
Apacheのバージョンは2.4.7です。

```bash:apacheのバージョンを確認
Server version: Apache/2.4.7 (Ubuntu)
Server built:   Jul 22 2014 14:36:38
```

# NameVirtualHostを記述
バーチャルホストを使いたかったので、apache2.confにNameVirtualHostを記述しました。

```bash:apache2.confを編集
sudo vi /etc/apache2/apache2.conf

# 略

NameVirtualHost 3000
```
指定は80でないです。

# apacheの起動でメッセージ
apacheを再起動しました。

```bash:apache2を起動でメッセージ
sudo /etc/init.d/apache2 restart
 * Restarting web server apache2                                                                         AH00548: NameVirtualHost has no effect and will be removed in the next release 
```
次のリリースでなくなるよって言われました。
どうやら今度からNameVirtualHostは書かなくても、VirtualHostが動くみたいです。
NameVirtualHostは消してもOK！！

# 参考
http://qiita.com/tukiyo3/items/61202fdec60af854b3fe
choroplethr - Vignettes - f) 国勢調査の地図

Rのパッケージ`choroplethr`のビネットの翻訳です．
( 原文: http://cran.r-project.org/web/packages/choroplethr/index.html )

* a) [イントロダクション](http://qiita.com/nakamichi/items/23730349f31a377fb071)
* b) [アメリカの州単位コロプレス図](http://qiita.com/nakamichi/items/b8267674b610ef6e1cab)
* c) [アメリカの郡単位コロプレス図](http://qiita.com/nakamichi/items/2f63dcfb7b1cc407d87c)
* d) [アメリカの郵便番号に基づく地図](http://qiita.com/nakamichi/items/889d3883e9b2ff8e2cdf)
* e) [国家単位のコロプレス図](http://qiita.com/nakamichi/items/5090b4dadeed42c2e13c)
* f) [国勢調査の地図](http://qiita.com/nakamichi/items/de929da9335f96f6468c)
* g) [世界銀行データの地図](http://qiita.com/nakamichi/items/66fa782bb3104dd815bf)
* h) [コロプレス図の動画](http://qiita.com/nakamichi/items/02ca0f678933405cf18f)
* i) [自分の地図を作る](http://qiita.com/nakamichi/items/99ff93769f4f67b97d18)
* j) [行政区画レベル1の地図を作る](http://qiita.com/nakamichi/items/8fde40a12c6aca2abbd3)

----------

# 国勢調査の地図 #

`choroplethr` は，アメリカ合衆国国勢調査のデータからコロプレス図を作成する機能をネイティブで持っています．
この機能は`choroplethr_acs`関数によって使用することができます（`?choroplethr_acs`）．

`choroplethr`で利用可能なデータは [The American Community Survey (ACS)](https://www.census.gov/acs/www/)のサイトにあるものです．
これらのデータがどのようなものか感じをつかむには， このサーベイで尋ねられた[質問](https://www.census.gov/acs/www/methodology/questionnaire_archive/) のリストを見てみるのがよいかもしれません．


## しくみ ##

`choroplethr`はローカルにはデータを保持していません．
代わりにRの[acsパッケージ](http://cran.r-project.org/web/packages/acs/index.html)を使用して，国勢調査APIを通じてACSのデータを取得します. これは以下のことを意味しています．

1. この機能を使用するには，[国勢調査のAPIキー](http://www.census.gov/developers/tos/key_request.html)を持っている必要があります． キーは無料で簡単に取得できます. キーを手に入れたら以下のコードを入力してください．

```{r}
library(acs); 
api.key.install('<あなたの国勢調査APIキー>');
```

2. 最新のデータが利用可能になると直ちにアクセスできるようになります．

3. 国勢調査局が歴史的なデータをAPI経由では提供していないため，2010年以降のデータにしかアクセスすることができません．


## ACSのデータを地図にしてみる ##

1. 1，3，5年間の推計値の違いを[学びましょう](http://www.census.gov/acs/www/guidance_for_data_users/estimates/) 

2. 可視化したいサーベイを[選択しましょう](http://factfinder2.census.gov/faces/help/jsf/pages/metadata.xhtml?lang=en&type=survey&id=survey.en.ACS_ACS)．

3. 可視化したい表を[選択しましょう](http://factfinder2.census.gov/faces/help/jsf/pages/metadata.xhtml?lang=en&type=dataset&id=dataset.en.ACS_12_5YR)．いずれかのサーベイをクリックしてみると，利用できるデータの量に驚くことでしょう. 入門のために，よく知られた表をいくつか挙げておきます．

+ B01003: 総人口
+ B01002: 性別ごとの年齢中央値
+ B19001: 過去12か月の世帯所得


## 例 ##

2012年の5年間ACSデータの州別人口推計値を見る方法を示します．表の名前から自動的に地図のタイトルが生成されていることに注目してください． 
コードがコメントアウトされているのは，CRANサーバにはアメリカ合衆国国勢調査のAPIキーがインストールされていないためです．

```{r}
# choroplethr_acs("B01003", "state", endyear=2012, span=5)
```

![us-census.png](https://qiita-image-store.s3.amazonaws.com/0/58917/d42773d0-b907-4645-8beb-2e52f02e3640.png)
apache2を起動しようとすると、no listening sockets availableと言われる解決方法

apache2を起動しようとしたら失敗しました。環境はUbuntuです。

# apacheのバージョンは
Apacheのバージョンは2.4.7です。

```bash:apacheのバージョンを確認
Server version: Apache/2.4.7 (Ubuntu)
Server built:   Jul 22 2014 14:36:38
```

# apacheの起動で失敗
apache起動をしようとすると失敗してしまいます。

```bash:apache2を起動で失敗
sudo /etc/init.d/apache2 start
 * Starting web server apache2                                                                           AH00558: apache2: Could not reliably determine the server's fully qualified domain name, using 127.0.1.1. Set the 'ServerName' directive globally to suppress this message
(98)Address already in use: AH00072: make_sock: could not bind to address [::]:80
(98)Address already in use: AH00072: make_sock: could not bind to address 0.0.0.0:80
no listening sockets available, shutting down
AH00015: Unable to open logs
Action 'start' failed.
The Apache error log may have more information.
 * 
 * The apache2 instance did not start within 20 seconds. Please read the log files to discover problems
```
(´ﾟдﾟ｀)ｱﾁｬｰ80番ポートが使用されている場合にでるエラーのようです。

# Listenしているポートを変更
デフォルトの80番ポートではダメなので変更します。

```bash:ports.confを編集
sudo vi /etc/apache2/ports.conf

Listen 3000
```
いまの環境では3000番ポートでアクセスするので、80番から3000番へから変更します。

# apache2を起動
再度起動します。

```bash:apache2を起動
sudo /etc/init.d/apache2 start
 * Starting web server apache2
```
今度はうまくいきました(☝ ՞ਊ ՞)
コマンドを並列実行しつつエラーのあった実行のログを最後にまとめて出力するシェルスクリプト


並列実行というと `xargs` や `GNU parallel` を思い出しますが、「エラーのあった実行のログを最後にまとめて出力する」ということを考えるとどちらも不十分でした。（できるのであれば教えてほしい）

しかし、シェルには `wait` などの素敵な並列実行の仕組みが用意されているので、頑張って自分で実装してみました。

```bash
#!/bin/bash
#
# parallel.sh
# usage: echo 1 2 3 4 5 | parallel.sh my_script.sh
# 標準入力から受け取ったリストを引数として、引数で与えられたコマンドを実行する
# 成功したコマンドの結果を先に出力してから失敗したコマンドの結果を最後にまとめて出力する

list=$(cat)
tmpdir=$(mktemp -d)

for i in $list
do
  ($@ $i > $tmpdir/$i.log 2>&1; echo -n $? > $tmpdir/$i.status) &
done

wait

for i in $list
do
  [ $(cat $tmpdir/$i.status) -eq 0 ] && cat $tmpdir/$i.log
done

for i in $list
do
  [ $(cat $tmpdir/$i.status) -ne 0 ] && cat $tmpdir/$i.log && echo '*** error occurred!! ***'
done

code=0
for i in $list
do
  status=$(cat $tmpdir/$i.status)
  echo "status $status for command: $@ $i"
  [ $status -ne 0 ] && code=$(expr $code + 1)
done

rm -r $tmpdir
exit $code
```

http://qiita.com/geta6/items/199faca823e84026c10a ←この記事を読めば解説は不要です。要は、すべてのコマンドをバックグラウンドで実行し、出力を `$tmpdir/$i.log` に書いて、ステータスを `$tmpdir/$i.status` に書いていて、あとは一個一個それらを処理しているだけです。

## 実験

引数が3の倍数のときだけ失敗するこのようなスクリプトを用意し、

```bash
#!/bin/bash

if [ $(expr $1 % 3) -eq 0 ]; then
  echo $1
  exit 1
else
  echo $1
  exit 0
fi
```

`echo 1 2 3 4 5 6 7 8 9 | ./parallel.sh ./cmd.sh` のように実行すると、

```
1
2
4
5
7
8
3
*** error occurred!! ***
6
*** error occurred!! ***
9
*** error occurred!! ***
status 0 for command: ./cmd.sh 1
status 0 for command: ./cmd.sh 2
status 1 for command: ./cmd.sh 3
status 0 for command: ./cmd.sh 4
status 0 for command: ./cmd.sh 5
status 1 for command: ./cmd.sh 6
status 0 for command: ./cmd.sh 7
status 0 for command: ./cmd.sh 8
status 1 for command: ./cmd.sh 9
```

こうなるのがわかります。
'.'(ドット)で区切られた文字列の両端が整数で無い場合に'False'を返す

## コード
```php:tekito.php
<?php

$str="hoge.hoge.hoge.hoge";
$octet = explode('.', $str);
$octetcheck = $octet[0] . end($octet);

if (ctype_digit($octetcheck) == FALSE) {
    echo "False" . PHP_EOL;
}

?>
```


## 使用例
文字列（hoge.hoge.hoge.hoge）

```shell-session
$ php tekito.php
False
```

文字列（100.hoge.hoge.hoge）

```shell-session
$ php tekito.php
False
```

文字列（100.hoge.hoge.100）

```shell-session
$ php tekito.php
$
```


## 使った関数
- explode
- end
- ctype_digit
YosemiteにアップデートしてWi-Fiが不安定になったからやってみたこと

YosemiteにしてからWi-Fiが遅くなったり、突然切断するようになったので、
いろいろな方法を試しましたが、下記の設定でMacのWi-Fiが安定するようになりました。

参考URL
Having Wi-Fi problems on OS X Yosemite? Here's a possible fix!
http://www.imore.com/having-yosemite-wi-fi-problems-heres-possible-fix

システム環境設定→ネットワーク を開く

Wi-Fiの詳細を開く

![スクリーンショット 2014-12-16 1.37.13.png](https://qiita-image-store.s3.amazonaws.com/0/5509/83788ffc-8f40-30ad-ec18-35890c271c94.png)

管理者の承認を要求 の設定から 「ネットワークを変更」にチェックを入れてOKを選択

![スクリーンショット 2014-12-16 1.15.43のコピー.png](https://qiita-image-store.s3.amazonaws.com/0/5509/c49bbc12-584c-4a4c-0942-1e3bbe0738fe.png)

設定ができたら一度Wi-Fiを切にして再度 入に変更する

それでも直らなければ下記のURLの方法も試してみてください。

Fix Wi-Fi Problems in OS X Yosemite
http://osxdaily.com/2014/10/25/fix-wi-fi-problems-os-x-yosemite/
RubyでReactiveなフレームワーク、VOLTをさわってみた



#やっぱ時代はリアクティブでしょ

というわけでvoltさわってみた。

[![volt_logo.png](https://qiita-image-store.s3.amazonaws.com/0/54295/4229d8aa-cafe-223c-6946-bccbfb347746.png)](http://voltframework.com/)

# チュートリアル
[日本語版があります!](http://voltframework.com/docs)

まいどおなじみ、TODOリストでございます。

mongoDBが必要です。

```bash
$ gem install volt
$ volt new todo_example
$ cd todo_example
```

で雛形ができて、

```bash
$ bundle exec volt server
```

でサーバーが動きます。

![volt.png](https://qiita-image-store.s3.amazonaws.com/0/54295/922a4d02-2e12-7799-a24a-3d97b701a69f.png)

#Herokuにデプロイ
[書いてあるとおりにやったらできました。](https://my-volt-todolist.herokuapp.com/todos)
チェックボックスをチェックするとプログレスバーがうごいたりします。

![lgtm.png](https://qiita-image-store.s3.amazonaws.com/0/54295/f60dca09-c39a-87f8-ed5e-e6ae5619333d.png)

## 追記
そのままだとユーザー登録ができません。

```
$ heroku addons:add mongolab
```

してから

```diff:config/app.rb
  config.db_driver = 'mongo'
  config.db_name = (config.app_name + '_' + Volt.env.to_s)

-  if ENV['MONGOHQ_URL'].present?
-    config.db_uri = ENV['MONGOHQ_URL']
+  if ENV['MONGOLAB_URI'].present?
+    config.db_uri = ENV['MONGOLAB_URI']
  else
    config.db_host = 'localhost'
    config.db_port = 27017
  end
```

に変えたらできました。

#余談
Nitrous.IOで動かすと画面上部に
```
Connection Lost... All transports failed... 
```
というエラーメッセージが出ます。websocketのエラーみたい。
消し方がわからない...動くけど。

![error.png](https://qiita-image-store.s3.amazonaws.com/0/54295/fec495da-4e4b-55dc-859b-7c8b598f714c.png)

#参考
[これから来るか！？ Volt](http://qiita.com/5t111111/items/62eca0a3fb321db65e91)
[Volt チュートリアル](http://qiita.com/5t111111/items/e1c207d780b7af1aef8c)
https://github.com/voltrb/volt

#感想
meteorみたいな感じ？
内部的にはSockJSとかOpalというのを使っているみたいです。
もっと遊んでみようと思いました。
vfpclasspd

fp の値を分類します。

- QNAN
- +0
- -0
- +inf
- -inf
- denormal
- negative normal
- SNAN

の分類ができます。組み合わせて使えます。例えば +0 or -0 という判定ができます。

```cpp
#include <immintrin.h>
#include <stdio.h>
#include <math.h>

double in[8] = {NAN,
                1,
                INFINITY,
                1,

                1e-308,
                2.0,
                0,
                -0.0,
};

void
dump_bits8(__mmask8 a)
{
    for (int i=0; i<8; i++) {
        if (a & (1<<i)) {
            putchar('1');
        } else {
            putchar('0');
        }
    }
    puts("");
}

#define FPCLASS_PD(cond,v,imm)                                          \
    __asm__ __volatile__ ("vfpclasspd %[cat], %[src], %[dest]\n\t"      \
                          :[dest]"=Yk"(cond)                            \
                          :[cat]"i"(imm),                               \
                           [src]"v"(v)                                  \
                          :);                                           \

#define CLASS_QNAN (1<<0)
#define CLASS_POS_ZERO (1<<1)
#define CLASS_NEG_ZERO (1<<2)
#define CLASS_POS_INF (1<<3)
#define CLASS_NEG_INF (1<<4)
#define CLASS_DENORMAL (1<<5)
#define CLASS_NEGATIVE (1<<6)
#define CLASS_SNAN (1<<7)

int
main()
{
    __m512d v0 = _mm512_loadu_pd(in);
    __mmask8 cond_qnan;
    __mmask8 cond_pos_zero;
    __mmask8 cond_not_normal;
    for (int i=0; i<8; i++) {
        printf("%.1e, ", in[i]);
    }

    FPCLASS_PD(cond_qnan, v0, CLASS_QNAN);
    FPCLASS_PD(cond_pos_zero, v0, CLASS_POS_ZERO);
    FPCLASS_PD(cond_not_normal, v0, CLASS_QNAN | CLASS_POS_ZERO | CLASS_NEG_ZERO | CLASS_POS_INF | CLASS_NEG_INF | CLASS_DENORMAL | CLASS_SNAN);

    printf("%x\n", cond_qnan);

    printf("qnan     : ");
    dump_bits8(cond_qnan);

    printf("pos_zero : ");
    dump_bits8(cond_pos_zero);

    printf("!normal  : ");
    dump_bits8(cond_not_normal);
}
```

```
nan, 1.0e+00, inf, 1.0e+00, 1.0e-308, 2.0e+00, 0.0e+00, -0.0e+00, 1
qnan     : 10000000
pos_zero : 00000010
!normal  : 10101011
```

(+0はfpclassifyでのnormal判定されないと今知った)


vfpclasspd は、AVX512-DQという **また別の** 拡張になっていて(いったいいくつ拡張あるんだよ)、sde の挙動見ると、knl で動かない、skx で動くという状態のようです。


明日は @tanakmura が ' ' について書きます。
拡散する問題と収斂する問題

## 拡散する問題と収斂する問題

イギリスの経済学者[エルンスト・フリードリッヒ・シューマッハー](http://ja.wikipedia.org/wiki/%E3%82%A8%E3%83%AB%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BB%E3%83%95%E3%83%AA%E3%83%BC%E3%83%89%E3%83%AA%E3%83%83%E3%83%92%E3%83%BB%E3%82%B7%E3%83%A5%E3%83%BC%E3%83%9E%E3%83%83%E3%83%8F%E3%83%BC)によればこの世界には二種類の問題があります。(1)

 * 拡散する問題（divergent problems）
 * 収斂する問題（convergent problems）

![divergent-convergent-thinking.png](https://qiita-image-store.s3.amazonaws.com/0/3940/9816f561-b2f3-5434-2786-d065afec45f0.png)

例えば「新しくWebアプリケーションを作成する」事を考えてみましょう。もしそれまでにPHPを使用した事がなかったとしたら、どういう選択肢があるかあらゆるオプションをリサーチする必要があります。

フレームワークを使用するのか？そうならフルスタックか？マイクロフレームワークか？それらはどのような背景で設計され、どのようなコミュニティで運営されているのか？対象とするアプリケーションは？開発者は？パッケージは？エコシステムは？メンテナンスコストは？

そもそもPHPは必要なのでしょうか。JSフレームワークでSPA(single-page application)はどうでしょうか？

...これらは「拡散する問題」です。Webアプリケーションという１つの目的地にたどり着くため、選択可能なオプションを検討し問題は拡散していきます。

そしてある時点でマインドセット（思考態度）を変え、つまり問題を拡散から収斂のほうに変え、指針や指向を元に選択肢を減らし１つの解決策に導きます。拡散する問題は基本的に論理的な解決がなかなかできません。しかし設計指針（アーキテクチャ）という志向を与えることで問題を減らしていくことができます。

## 設計に必要なプロセス

これはシステムの設計に必要なプロセスだと考えます。（アプリケーションアーキテクト不在のシステムではこのプロセスは省略されます。ベストプラクティスのテンプレートを適用するだけのようなシステムはそうです。あるいは「今流行しているフレームワークはなんですか？」という問いはどうでしょうか。デファクトスタンダードの不在を嘆くということはどういうことでしょうか。）

## BEAR 0.x to 1.x

BEAR.Sunday0.xの版を重ねる度に問題を拡散し可能性を探ってきました。

 * Webエディタ
 * リソースのメタデータを表示する”ハロー”
 * リソースのリフレクション（一覧）
 * オブジェクトグラフビジュアライゼーション
 * Smarty / Twig テンプレートエンジン
 * AOPによるフォームの問題の解決
 * @Cache @CacheUpdateによる"なんちゃってCQRS"
 * シグナルパラメータ
 * ベストプラクティス
 * ランタイムコンテキストによる(AOPによる）DI
 * DIによるAOP（ルーターコレクションなど）

なかなか解決できない問題もありました。

 * アプリケーションコンテキスト
 * DIコンパイラ
 * AOPインターセプター

他にもいろいろあります。十分なフィードバックが得られたものもありますし、そうでないものもあります。

### コンバージェンス（収斂）としての1.0

そして、フィードバックや、いくつかのプロダクションを出荷して確信をもてたものに収斂するときが来ました。マインドセットを変えたのです。

きっかけは、なかなか改良の延長で解決できなかったRay.Diをv2.0としてOOPで完全に書き直したこと、phpnwの二度目の参加、その時のリチャードさんとのディスカッションなどです。他にも背景として、グラハムさんの余計なものを取り込むべきでないとのアドバイス、ネーテさんにインスパイアされたと言われたこと、QiitaやブログでのBEAR.Sundayの記事、Auraフレームワークの進化、これまでのissue..など様々な事もあります。

 * アプリケーション制約としてのフレームワーク
 * 接続フレームワークであること
 * クリーンでコンパクトであること
 * アプリケーションロジックをアスペクトとして実装するこ
と
 * アプリケーションの拡張ポイント
 * ハイパーメディア(REST)
 * DIをアプリケーション構成に使うとと
 * アプリケーションアーキテクトに良い制約を提供すること

これらのコアバリューだけに集中して、品質が高く、将来変更可能性のほとんどないものだけに取り組み1.0としてリリースすることを考えました。

＊以前の久保さんとフレームワーク拡張についてのディスカッションを再考し、これも"コンバージェンス"しました。

**フレームワーク構成**
https://github.com/koriym/BEAR.Sunday/tree/develop-2/src/Extension

## まとめ

1.0では0.xであった様々な付加的機能が集約されたり、一旦外されたりしています。例えば今現在はHTML出力やDBはオプション扱いでデフォルトのテンプレートエンジンやDB(ORM)ライブラリは付属しません。デバック出力のハローやHTMLエディタなどのデバック機能も一旦外していて付属しません。(HTMLを利用しない開発者には不要です）✴︎時間や労力をかけて苦労して作ったライブラリもほとんどの部分を外しています。

現在デフォルトでは**Webルーター**（オプションで**Auraルーター**）によるルーティング、JSON(オプションで**HAL**)出力が可能なAPIサーバーとして機能するものが提供されるのみです。

これではフレームワークと言えないと思われる方が想像できる一方で、これで十分だと思われる方がいることにも確信があります。アプリケーションやフレームワークの構成変更可能性は高く、アプリケーションアーキテクトの構成設計要求に応えれるものができているのではと考えています。

最後に1.0リリースで最も気を付けている事を紹介して、この記事を終わりにします。

> プラクティスではなくプリンシプル（原則）にフォーカスすること

### 参照

 1. https://cucumber.pro/blog/2014/10/21/the-two-modes-of-thought-you-need-for-bdd.html
[iOS] UIView をプルプルさせる

iOS デバイスのホーム画面でアイコンを長押しすると、アイコンがプルプルとふるえ出す。同じような効果を自作アプリでも実現するための汎用的なコード。UIView （サブクラスも）であれば、何でもプルプルできるよ。

```objectivec
static CGFloat
DegreesToRadians(CGFloat degrees) // XXX: マクロでも良いけど関数で実装
{
  return degrees * M_PI / 180.0f; // 度からラジアンに変換するだけ
}

static NSString * const kVibrateAnimationKey = @"VibrateAnimationKey";

-(void)vibrated:(BOOL)vibrated view:(UIView *)view
{
  if (vibrated) {
    CABasicAnimation * animation;
    animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
    animation.duration  = 0.25; // プルプル間隔（短いと早く、長いとゆっくり）
    animation.fromValue = @(DegreesToRadians(3.0f));  // プルプルの振れ幅（5.0fまでが無難）
    animation.toValue   = @(DegreesToRadians(-3.0f)); // プルプルの振れ幅（5.0fまでが無難）
    animation.repeatCount  = INFINITY;
    animation.autoreverses = YES;
    [view.layer addAnimation:animation forKey:kVibrateAnimationKey];
  }
  else {
    [view.layer removeAnimationForKey:kVibrateAnimationKey];
  }
}
```

仕組みは単純で、CALayer に回転アニメーションを無限に実行させているだけ。上記ソースコードのコメント付きの行の値を変更すれば、お好みのプルプル動作になると思う。

また、UIPanGestureRecognizer のドラッグ時に利用すれば、iOS のホーム画面でのアイコン移動と同じような雰囲気のアプリを作れるよ。
PostgreSQLにテストデータを作成するnode.jsスクリプト

PostgreSQLにテストデータを作成するnode.jsスクリプト
=======

[Couchbase編](http://qiita.com/fujisan3/items/cfc81c466c65beaf66a7)に続いて、PostgreSQLにテストデータを登録するスクリプトについて。

超メジャーなRDBなので、詳しい説明は省略。自分含めて初心者向けってことで、誰かの参考になるかもしれないので公開しておきます。

ポイントは、Clientオブジェクトのdrainイベントを拾ってるところで、クエリーキューが空になるまで待って、Clientオブジェクトをendしています。

一応、コールバックネストで処理はしているものの、さすがに1000件とかループすると、PostgreSQL側がクエリーを処理仕切れない内にスクリプトが終わろうとするので、スクリプト上にClient.end();を書くと、
`Error: Connection terminated`
って怒られます。

でも、Client.end()、もしくは、pg.end()を書かないと、スクリプトが終わってもイベントループのままでスクリプトが終わらない。

どうしたものかと思いつつ、クエリーキューかもと思って、
`client.on('drain', client.end.bind(client));`
と書いたら上手く行きました。参考：[brianc/node-postgres Queryqueue](https://github.com/brianc/node-postgres/wiki/Queryqueue)

## add-postgresql-data1.js
* 作成する件数は、`i < 1000` の部分を変更して下さい
* age の値は乱数で生成します（適当に編集して下さい）

### 利用モジュール
* node-postgres [brianc/node-postgres](https://github.com/brianc/node-postgres)
* async

### インストール
1．適当なディレクトリを作成
2．package.jsonファイルを作成

```package.json
{
  "devDependencies": {
    "pg": "*",
    "async": "*"
  }
}
```
3．npm installで依存モジュールをインストール
4．同ディレクトリに、add-postgresql-data1.jsファイルを配置する
5．事前にテーブルを作成しておく（スクリプト参照）

### 実行
`# node add-postgresql-data1`


### スクリプト
    var pg = require('pg');
    var async = require('async');
    
    var connectString = "tcp://postgres@localhost:5432/test_db";
    
    function randomInt (low, high) {
        return Math.floor(Math.random() * (high - low + 1) + low);
    }
    
    /*
    Data Format
    ---------------
    CREATE TABLE t_dummy
    (
        id character varying(100), 
        age integer,
    );
    
    data
        id  : "user-"[1=>i]
        age : random[10-90]
    ---------------
    */
    
    pg.connect(connectString, function(err, client) {
        if (err) {
            console.log('Connection Error:', err);
            throw err;
        } else {
            var counter = [];
            for (var i = 0; i < 1000; i++) {
              counter[i] = i;
            }
            async.eachSeries(counter, function(i, next) {
                var qs = "INSERT INTO  t_dummy (id, age) VALUES("
                            + "'" + "user-" + (i+1) + "', "
                            + randomInt(10, 90) + ");"
                console.log("qs=" + qs);
    
                client.query(qs, function(err, result) {
                    if(err) {
                        console.log('Insert Error! :' + (i+1));
                        throw err;
                    } else {
                    };
                });
                console.log('Inserted : ' + (i+1));
                next();
    
            }, function(err) {
                console.log('Finished!');
                client.on('drain', client.end.bind(client));
            });
        }
    });


なお、スクリプトはGithubにも公開しています。
[fujisan3/node.js-scripts](https://github.com/fujisan3/node.js-scripts/blob/master/add-postgresql-data1.js)