OmniAICreator/Qiita-1.07M huggingface dataset:
Google Apps ScriptでEnterprise Licence Manager APIを叩く

## このAPIは何？
Google Appsのアカウントにライセンスを付与することができるAPIです。削除もできます。

## どんなライセンスが付与できるのか？
* Google Apps
* Google Drive
* Google Vault

参考資料：[公式ドキュメント](https://developers.google.com/admin-sdk/licensing/v1/how-tos/products)

https://developers.google.com/admin-sdk/licensing/v1/how-tos/products

## 本日のコード.gs

```js:コード.gs
function myFunction() {
  var pageToken;
    
  var list = AdminLicenseManager.LicenseAssignments
  .listForProduct('Google-Apps', '<your domain>', {maxResults: 500,
                                                  pageToken: pageToken});
  Logger.log(list);
  
  Logger.log("---------------");
  for(var i = 0; i < list.items.length; i++) {
    Logger.log(list.items[i].userId);
    Logger.log(list.items[i].skuId);
    Logger.log(list.items[i].selfLink);
    Logger.log(list.items[i].kind);
    Logger.log(list.items[i].etags);
    Logger.log("-----------------");
  }
}

function deletesample() {
  // これはできない。
  // Combination of product and sku is invalid or the product has auto-assigned feature enabled
  // var res = AdminLicenseManager.LicenseAssignments.remove("Google-Apps", "Google-Apps", "<your account>");
    
  //Logger.log(res);
}

function updatesample() {
  var res = AdminLicenseManager.LicenseAssignments.update({productId: "Google-Drive-storage",
                                                           skuId: "Google-Drive-storage-20GB",
                                                           userId: "<your account>"}
                                                          , "Google-Drive-storage", "Google-Drive-storage-20GB", "<your account>");
  Logger.log(res);
}
```

## APIを有効化する。
スクリプトエディタから、リソース→Googleの拡張サービス...を選択して下さい。

![LicenseManagerサンプル有効化.png](https://qiita-image-store.s3.amazonaws.com/0/11925/9026ee62-1381-90fe-9f3e-90f4bc28c87b.png "LicenseManagerサンプル有効化.png")

同時に、Developer Consoleの方も有効にしておきます。
![API_ライブラリ_-_LicenseManager.png](https://qiita-image-store.s3.amazonaws.com/0/11925/ced30073-2140-a3c7-a5fe-aaa712ff530d.png "API_ライブラリ_-_LicenseManager.png")

## 承認する。
実行前に承認します。
![許可のリクエスト_Licence.png](https://qiita-image-store.s3.amazonaws.com/0/11925/9a12524c-6d76-665e-5374-5cfadfc9ff59.png "許可のリクエスト_Licence.png")

## わかったこと
Google Apps無料版だと実行はできるけど、付与できるライセンスがないから（？）使えない。

## Disclaimer
* この記事は個人的なものです｡私の雇用者とは全く関係はありません｡（一応つけておきます）
ESP8266 への転送速度を3倍にして快適な開発生活をおくる

ESP8266 環境での開発はコンパイル後のバイナリサイズが大きいため、転送に時間がかかってしまい開発時の待ち時間が多分に発生してしまいます。そこで、シリアルUSBの転送速度を標準の 115200 から変更することで、転送にかかる時間を下げ、開発のサイクルを高速化します。

どこまで転送速度が上げられるかですが、ハードウェア的な制約のシリアルUSB変換チップの baudrate、今回使った FDTI の FT231X は最大 3M ですが、ESP8266 側は 921600 までのようです。

- https://github.com/igrr/esptool-ck/blob/master/serialport/serialport.c#L296

とコードの定義でも最大 921600 となっています。試しにそれ以上に上げてみましたがエラーでうまく転送できませんでした。

# 速度を測る

早速速度を測定してみましょう。約280KBのファームウェアを、標準の 115200 で転送してみます。

```bash
$ time esptool -vv -cd ck -cb 115200 -cp /dev/cu.usbserial-DA01219J -ca 0x00000 -cf firmware.bin
esptool -vv -cd ck -cb     0.02s user 0.10s system 0% cpu 36.238 total
```

36秒かかりますね。

では続いて 921600 にして転送してみましょう。

```bash
$ time esptool -vv -cd ck -cb 921600 -cp /dev/cu.usbserial-DA01219J -ca 0x00000 -cf firmware.bin
esptool -vv -cd ck -cb     0.02s user 0.10s system 0% cpu 13.089 total
```

13秒！約3倍の転送速度で完了しました。というわけでシリアルUSB変換チップが対応しているなら、921600 に変更するだけで気軽に開発速度を上げる事が出来るので、試してみると良いと思います。

## PlatformIO の場合

platform.ini に

```
upload_speed = 921600
```

を定義するだけで OK です。

## もっと速く転送する方法

あったら知りたいので教えて下さい！
クロスプラットフォーム開発のフォルダ構成について

一人(+α)アドベントカレンダー3日目。
Kotlin+RoboVMで挑むクロスプラットフォーム開発試行錯誤。

本日は、フォルダ構成などについて(12/7 : 書きぶりが拙かったので更新)。
クロスプラットフォーム開発環境を導入しての開発に値するアプリの基本形は、共通ロジックが大きめのもの。
すなわち、以下の形:

```
└─ android
 └── src/main/kotlin etc../ここにandroid向けViewコード(含、通信周りのコード)
└─ core
 └── src/main/kotlin etc../ここに共通ロジックコード(ここに多めのコード)
└─ ios
 └── src/main/kotlin etc../ここにios向けViewコード(含、通信周りのコード)
```

今回取り組むKotlin on RoboVMでは、具体的にはこんな感じになっている:
(初期フォルダ構成:再掲載) : ![スクリーンショット 2015-11-27 7.12.57.png](https://qiita-image-store.s3.amazonaws.com/0/16455/72962371-b4fc-8a0c-92aa-10a1c0fb62c4.png)

共通ロジックの最終形はこんな想定:

```
└─ core
 └── src/main/kotlin or java or scala/
　　　└─ share
　　　　 └── 音声インターフェイス(複数言語対応)
　　　　 └── 知能ロジック(判断支援、操作アシストなど)
　　　└─ abst #共通的な抽象ロジックを実装
　　　　 └── インターネット通信抽象ロジック
　　　　 └── ローカル通信抽象ロジック(bluetoothなど)
　　　　 └── 永続化関係抽象ロジック(モデルなど)
```

永続化など、各プラットフォーム実装の共通化は難しいところの抽象ロジックをabst以下に書く。

Android Studioで開発する場合、開発はJavaや今回のKotlin などのJVM言語で行う。共通ロジック部分は適宜サーバー側とも実装を共有すべきだから、サーバー側と同一の言語で実装するのが良いと考える。このあたりはエンタープライズなサーバーがJVM環境での選択肢は広い。もちろん、SpringBootなどではKotlinで行くのもあり。自分の場合は、知能ロジック系(ML等)が強いscalaでの実装を主に考えたい。

本日はここまで。
RealmObjectをDictionaryに変換する

# ObjectをDictionaryにする
Realm アドベントカレンダー三日目ですね．
ちっちゃな子ネタをどうぞ．



どれくらい思うことがあるのかわかりませんが，RealmのObjectをDictionaryとかに戻したい，相互変換したいって思ったことはありませんか？

私はあります．

```swift
import RealmSwift
extension Object {
    func toDictionary() -> Dictionary<String, AnyObject> {
        let properties = self.objectSchema.properties.map { $0.name }
        let dictionary = self.dictionaryWithValuesForKeys(properties)

        let mutabledic = NSMutableDictionary()
        mutabledic.setValuesForKeysWithDictionary(dictionary)

        for prop in self.objectSchema.properties as [Property]! {
            if let nestedObject = self[prop.name] as? Object {
                mutabledic.setValue(nestedObject.toDictionary() as NSDictionary, forKey: prop.name)
            } else if let nestedListObject = self[prop.name] as? ListBase {
                var objects = [AnyObject]()
                for index in 0..<nestedListObject._rlmArray.count {
                    let object = nestedListObject._rlmArray[index] as AnyObject
                    objects.append(object.toDictionary() as NSDictionary)
                }
                mutabledic.setObject(objects, forKey: prop.name)
            }
        }

        return mutabledic as NSDictionary as! Dictionary<String, AnyObject>
    }
}
````

簡単に解説してみると

```swift
        let properties = self.objectSchema.properties.map { $0.name }
        let dictionary = self.dictionaryWithValuesForKeys(properties)

        let mutabledic = NSMutableDictionary()
        mutabledic.setValuesForKeysWithDictionary(dictionary)
```
このあたりで，Realm固有の型以外をだいたいNSMutableDictionaryにコピーできています．

`objectSchema.properties` でObjectのschemaを取得できます．
`dictionaryWithValuesForKeys(properties)` でSchemaをザザっとNSDictionaryにコピーできてしまいます．

ここから下は，再帰したりしながらListBaseや，ObjectをDictionary化していくコードですね．

ついでに，Camel CaseをSnake Caseに変換するコードも用意しました．

```swift
extension String {
    func snakeCaseString() -> String {
        var result = ""
        self.characters.forEach( { char in
let string = "\(char)" as NSString
result += string.isEqualToString(string.capitalizedString) ? "_\(string.lowercaseString)" : "\(char)"
        })
        return result
}
```
やっていることは超単純で，文字を一文字づつチェックして，大文字だったら"_小文字"に置き換えるだけというものです．これでだいたいsnake caseにできちゃいます．


そして，このあたりを組み合わせてJSONにするとかすれば
````
API -> Object -> Dictionary -> JSON -> API
````
みたいな流れがすごくやりやすくなるかと思います．


私の場合は
````
APIKit → Himotoki → Object → Dictionary → Himotoki
````
みたいな変換をちらほらしています


参考：http://stackoverflow.com/questions/31150087/can-i-serialize-a-realmobject-to-json-or-to-nsdictionary-in-realm-for-swift
現場のSails.js #3 テスト編

# 概要

弊社では一部の社内プロジェクトでSails.jsを利用しています。その中で得られたベストプラクティスやらバッドプラクティスをまとめていこうと思います。
第3回はテストについて。

# 動作環境
node.js v0.12.7
Sails.js v0.11.2
sails-mysql v0.11.0

# テスト対象
今回はService層(Services -> Modelまで)のテストを行います。O/R MapperのWaterlineを通してDBアクセスまで正常に動作することを確認します。

# テストの構成

## ディレクトリ構成

```
test
 |
 |_fixture : テスト用データの定義
 |_services: (servicesの)テストコード
 |_utils: テストコードで使うユーティリティモジュール
 |_bootstrap.spec.js: テストの事前準備用モジュール
```

## Sailsの起動処理
`/test/bootstrap.spec.js`にてテストの事前準備としてSailsの起動を行っています。`/app.js`にある通り、`Sails.lift()`を実行することでSailsを起動することが出来ます。

``` js:/text/bootstrap.spec.js
var Sails = require('sails');

before(function (done) {
  Sails.lift({
    log: {
      level: 'silent'
    }
  }, function (err, sails) {
    if (err) return done(err);

    done();
  });
});
```

## Fixtureの活用
実際のDBにつないでテストを行うため、Fixtureを使って初期データを注入しています。[barrels](https://www.npmjs.com/package/barrels)というSails.js用のFixtrueがあるので、これを使用します。今回はサンプルとしてLocalDBを使用するため、初期化処理(`.tmp/localDiskDB.db`の削除)をしています。MySQLを使用している場合は`child_process`を使用してDDLを流すと良いでしょう。

``` js:/text/utils/FixtureFactory.js
var exec = require('child_process').exec;
var Barrels = require('barrels');
var fs = require('fs');

var FixtureFactory = {

  // データベースの初期化
  resetDatabase: function (){
    return new Promise(function(resolve, reject){

      fs.unlink('.tmp/localDiskDb.db', function(error) {
        if (error) return reject(error);

        resolve();
      });
    });
  },

  generateDataFromFixture: function(){
    var self = this;

    return new Promise(function(resolve, reject){
      self.resetDatabase().then(function(){

        var barrels = new Barrels();
        barrels.populate(['room'], function(err) {
          if(err) return reject(err);

          barrels.populate(['message'], function(err) {
            if (err) return reject(err);

            resolve();
          }, false);
        }, false);
      }).catch(function(err){
        sails.log.error(err);
        reject(err);
      });
    });
  }
};

module.exports = FixtureFactory;
```

## テストコード
Servicesモジュールを`require()`し、メソッドコールの結果を確認します。弊社ではテスティングフレームワークに`mocha`、アサーションは`power-assert`を使用しています。

``` js:/test/services/RoomService.spec.js
var assert = require('power-assert');
var FixtureFactory = require('../utils/FixtureFactory');

describe('RoomService', function() {

  var RoomService = require('../../api/services/RoomService.js');

  before(function(done) {
    FixtureFactory.generateDataFromFixture().then(function(){
      done();
    }).catch(function(err){
      done(err);
    });
  });

  context('find', function() {
    it('should return rooms', function(done) {

      RoomService.findAll().then(function(rooms) {

        assert(rooms.length !== 0);

      }).then(done, done);
    });
  });
});
```

# レポジトリ
上記の構成は、以下のレポジトリにまとめてあります(社内勉強会で使用した資料です)。
https://github.com/KeitaMoromizato/js-study-sailsjs-test
React Native - Android開発のはじめの方

今日はAndroidアプリをビルトしてみます。必要な環境は昨日の[React Native - iOS開発のはじめ方]()と同じです。Linux, Windows上でも開発できそうですが、私は両OSが手元にないのでOSXでの構築を前提とします。


## 開発環境の構築

1) [ここ](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html)から最新のJDKをインストールする。
2) Android SDKをインストールする

```
$ brew install android-sdk
```

3) 環境変数、ANDROID_HOMEの設定

```
$ echo "export ANDROID_HOME=/usr/local/opt/android-sdk" >> ~/.bash_profile
$ source .bash_profile # or open new terminal window
```

4) SDKの設定

```
 $ android
```

下記の３つにチェックを入れるのを忘れずに、画像を参照して"install packages"をクリックしてインストール開始。

 * Android SDK Build-tools version 23.0.1
 * Android 6.0 (API 23)
 * Android Support Repository

![](https://facebook.github.io/react-native/img/AndroidSDK1.png)

![](https://facebook.github.io/react-native/img/AndroidSDK2.png)

5) Genymotionのインストール
[ここ](https://www.genymotion.com/)からアクセスしてダウンロード。（注意：個人利用のみフリー）

任意のイメージを追加してエミュレーター起動する
![](https://qiita-image-store.s3.amazonaws.com/0/13663/aaf9d731-07d3-98e5-2a4d-94cd61c5861d.png)

6) 起動コマンドを走らせて、バイナリをpushする。

```
 $ react-native run-android
```

すると、アプリが起動します。command+Mでメニューが開き、ReloadをクリックするとJSファイルを再読み込みします。

![](https://qiita-image-store.s3.amazonaws.com/0/13663/f694189d-a7db-880c-1fb4-4ef8070aff8c.png)


7) エミュレーターのログは下記コマンドでtailできます。長いのでaliasでも設定しておくのがいいかと思います。

```
 $ adb logcat *:S ReactNative:V ReactNativeJS:V
 $ vi ~/.bashrc
 # add this. rnlog stands for react native log
 alias rnlog="adb logcat *:S ReactNative:V ReactNativeJS:V"
```

## JSファイルの配信

サーバ側はiOSと一緒です。クラインアント側はファイルを変更するのではなく、メニューを出してからホスト名を設定します。

Command+Mでメニューを出してからDev Settingを選択する
![](https://qiita-image-store.s3.amazonaws.com/0/13663/2003768c-701e-d028-b2bc-064d7b684a00.png)

次の画面下部の"Debug server host for device"を選択する
![](https://qiita-image-store.s3.amazonaws.com/0/13663/c444696d-1e53-1014-523e-ab74798778fb.png)

ここにIPを設定する
![](https://qiita-image-store.s3.amazonaws.com/0/13663/f21283bc-c540-38d4-d2ee-b7a0743bd971.png)


## Summary

私自身Androidを開発したことがないので良し悪しの比較が難しいのですが、割と簡単に始められると思います。iOS開発と比較するとJSファイルのReloadに２回アクションが必要なのが面倒な気がします。(iOS command-R, whereas Android command-M + click "reload")

明日はデバックの方法について書こうと思います。
pmjp.slack.comオフ会#1に参加して感じた、プロダクトマネージャーにとって大事なことをまとめてみた

<h2>pmjp.slack.comオフ会( <a href="http://pmjp.connpass.com/event/21561/">http://pmjp.connpass.com/event/21561/</a> )の目的</h2>
「Product Managers Japan( <a href="https://product-managers-japan.herokuapp.com/">https://product-managers-japan.herokuapp.com/</a> )のSlack全然盛り上がんねぇから、一旦リアルで交流しましょうや」

ごもっともである
<h2>オフ会の雰囲気</h2>
会場にいくつかテーブルが設置されており、それぞれのテーブルで集まったプロダクトマネージャーの方たちがざっくばらんに日々の悩み等を会話しました。
僕のテーブルには８〜１０人ほどの方がおり、もうそれはそれは非常に濃密な時間でした。

そこで、会話を聞いて、理解した内容をこの記事ではまとめることとする。
<h2>もう一言で言ってしまうと、「問題は、コミュニケーションのみから発生する」に尽きる</h2>
結局、そこに行き着きます。

よくありがちなのが、ビジネスサイドと開発サイドのギクシャクな関係。
ギクシャクな関係っていうのは、ビジネスサイドが開発のことを分かってないから、開発は無茶な要求ばかりされて疲れはてる。だから、ビジネスサイドはもっと開発のことを知るべきだ。といった雰囲気。

分かる、めっちゃ分かるぞ。

こういった問題って、<strong>会社、チーム固有の事情からくる多種多様な要因により、どんな要因にでも当てはめられる汎用的な解決方法はない</strong>じゃないですか？
ただ、こういう時って「ビジネスサイドと開発サイドでコミュニケーションを活発にしていく」っていう方向性になるんですが、その具体的な案はない。

&nbsp;
<h3>じゃあ、どうすんのよ。に対する３つのポイント</h3>
具体的な方法ではないものの、プロダクトマネージャーが知っておくべき内容があります。
<h4>1. これをやってはいけない。というアンチパターンを知る</h4>
「この機能、1時間もあればできるでしょ」
こういった地雷を踏まないということですね。

プロダクトマネージャーは、関わる人、関わる部署が広いがゆえに、地雷原の中で仕事してるようなもんです。
そのため、<strong>どんな地雷が自分の身の回りにあるのかを知ることが大事で、地雷を知る場として、交流会が重要</strong>です。
pmjp.slack.comオフ会でも、様々なエピソード of 地雷が聞けました。
<h4>2.細かいテクニックを知る</h4>
木を見て森を見ずの逆で、もう森を知ってるので、目の前の木を見てみましょう。という考え。
ここでいう森とは「本等から得られる体型的な知識」であり、木とは「実際に動くためのチップス」です。

木の具体例で言うと、社内でワークショップを行って改善していこう思ったものの、社内にやる気のない人が多数いて、うまくいかない場合の対処法があります。
その場合は、味方作りのためにやる気のある人だけを集めて、まずはワークショップを行い、社内で「なんかおもろいことやってるらしいで」という噂が流れ、少しづつ他の人も巻き込んでいける。といった内容です。

こういったチップスを知っておくことは、<strong>目の前で起きている問題の解決策になりうる手札を増やす</strong>こととなります。
<h4>3. 問題のない組織など存在しえない。ということを深く胸に刻み込む</h4>
<strong>全てうまくいって、エブリワン、エブリデイハッピーなど、荒唐無稽な夢物語です。</strong>
何かの問題を解決したら、別の問題に気付くなり、新たに登場するなり、常に問題はつきまとうものです。
それでもなお、常によりよい方向に導いていける存在がプロダクトマネージャーなので、みんなにとっての救世主みたいなもんです。
救世主は問題ばかり起きると悲観するのでも、また解決を諦めるのでもなく、それを当然のこととして動き続けることが肝要です。

以上、自戒の意味を込めてまとめました。
精進します。
Qtを使ってOS Xのアプリケーションメニューを適切な場所に表示する

OS X ではアプリケーションメニューと呼ばれるソフトの名前が表示された太字のメニューがファイルメニューの左側に存在しています．ここにはアプリケーションのバージョン情報や，設定，終了などのメニューがまとめられています． Windows や Linux では存在しないメニューですが， Windows や Linux との互換性を維持しながら，ここに確実にメニューを設定する方法を紹介します．

アプリケーションメニューとは
==========================
![applicationmenu.png](https://qiita-image-store.s3.amazonaws.com/0/56302/b1d9372e-6678-798d-c3e1-de4927a726d2.png)
上の画像に示したにあるメニューです．WindowsやLinuxには存在しません．なので，OS X向けには若干特別扱いしてあげる必要があります．

基本は名前から自動判別
====================

[QMenuBarのドキュメント](http://doc.qt.io/qt-5/qmenubar.html#qmenubar-on-os-x)にも書いてある通り，基本的には名前から自動的に判別されます．アプリケーション名はInfo.plistから取得されます．

|文字列マッチ|場所|メモ|
|:-------------|:--------|:---|
|about.*|Application Menu → About <application name>|なければ表示しない|
config, options, setup, settings or preferences|Application Menu → Preferences|なければ表示しない|
quit or exit|Application Menu → Quit <application name>|なければQApplication::quit()を呼び出すものを生成する|

![example1.png](https://qiita-image-store.s3.amazonaws.com/0/56302/9ce31063-93b2-115f-1dc5-5de4b752dbcc.png)
![example2.png](https://qiita-image-store.s3.amazonaws.com/0/56302/530abdb9-0c5e-f7dd-c425-0129f2dcbdfc.png)

この例では「File」メニューの下に Preferences... と Quit を用意していましたが，それ以外の項目がないので実行時には「File」メニューがなくなっています．

複数該当するものがあるときには？
-------------------------
![multiple.png](https://qiita-image-store.s3.amazonaws.com/0/56302/b63f4376-fff0-2a68-6a17-dc44c5bff329.png)
このように複数 Quit があるような場合には両方とも普通のメニューには表示されなくなって，アプリケーションメニューには下の物だけが採用されるようです．

明示的に設定する
=============
アプリケーションメニューに入ると困る場合や，通常と違う名前を付けたものをアプリケーションメニューに表示したいときには，MenuRoleを設定します．先ほどの例であれば

```cpp
ui->actionQuit->setMenuRole(QAction::QuitRole);
ui->actionQuit_B->setMenuRole(QAction::NoRole);
```

のようにして，`QAction`に対して`setMenuRole`を呼ぶことによりQuitとして扱うか，それともRoleなしで通常メニューとして扱うかを設定できます．もし，どれでもないけどアプリケーションメニューに表示したいときには`QAction::ApplicationSpecificRole`を設定しておくとAboutの下に表示してくれます．

![menu1.png](https://qiita-image-store.s3.amazonaws.com/0/56302/6dd3e076-1b56-28c0-01b8-f5cd82c3b6a2.png)

![menu2.png](https://qiita-image-store.s3.amazonaws.com/0/56302/3cf2f96b-a33f-300d-dc5f-382bc25d3289.png)

Macはメニューがウインドウにくっついていなかったりと他のOSと挙動が若干違いますが，Qtは必要に応じてヒントを与えてあげればうまく差を吸収してくれますので，ぜひ少しだけ気に留めていただけると OS X ユーザーが喜びます．
[*PhoneGap*] PhoneGap概要・環境構築

# はじめに
Apache Cordovaに引き続き、[PhoneGap](http://phonegap.com/)も一応環境構築してみます。
PhoneGapはAdobeの商標で、CordovaにAdobeさんが独自の機能をひっつけていたりするものらしいです。

# <i class="fa fa-cogs"></i> 環境構築
PhoneGapインストールとiOSでのシュミレート環境の構築。

**環境**
【OS】 OS X El Capitan

### PhoneGapインストール
以下を実行してインストール。

```bash
$ sudo npm install -g phonegap
```

インストールされていることを確認。

```bash
$ phonegap -v
5.3.9
```

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

```bash
$ phonegap create helloworld
```

### iOSでシュミレート
Cordovaではプラットフォームを追加したが、PhoneGapだと以下コマンドを実行するだけでシュミレーターが立ち上がる。
以下を実行したタイミングでプラットフォームが追加されている模様。

```bash
$ phonegap run ios
```

# <i class="fa fa-check-square-o"></i> プロジェクトの構造
基本的な構造はCordovaと一緒だけど、PhoneGapで作ったプロジェクトではwww以下にres、specディレクトリができている。
specディレクトリ内にはJavaScriptのテストフレームワークであるJasmineが入っている。

```
hooks
platforms ･･･ プラっとフォームごとの設定など
 -- ios
 -- platforms.json
plugins ･･･ プラグイン
 -- cordova-plugin-whitelist
 -- fetch.json
 -- ios.json
www ･･･ アプリの画面やページなど
 -- css
 -- img
 -- js
 -- res
 -- spec
 -- icon.png
 -- index.html
 -- spec.html
config.xml
```

# <i class="fa fa-cloud"></i> PhoneGap Buildでのビルド
[PhoneGap Build](https://build.phonegap.com/apps)でアプリをビルドできる。

プロジェクトをZIPファイル化してアップロード。
![スクリーンショット 2015-11-30 0.12.23.png](https://qiita-image-store.s3.amazonaws.com/0/48912/6bf574d3-a86b-d05b-c85f-9cf7b59263a7.png)

ビルドできたらQRコードからアプリを端末にインストール可能。
ただしiOS版は[Apple Developer](https://developer.apple.com/jp/)でデベロッパー登録をして証明書を出して設定する必要がある。
前にやったことがあるけど面倒だった覚えがある。
![cordova04.png](https://qiita-image-store.s3.amazonaws.com/0/48912/ba1dc697-0916-b804-7352-1f186044020b.png)

# まとめ
Apache CordovaとPhoneGapの違いを明日調べようと思います。
プロデルで簡単に画像を編集!

こんにちは。荒テックです。
この記事では「日本語プログラミング言語プロデル」で画像を編集できる命令を
紹介します。

#画像効果を使うには
```ネガポジ反転.rdr
メイン画面を表示する
待機する

メイン画面とは
　　ウィンドウを継承する
　　
　　はじめの手順
　　　　初期化する
　　　　ーー貼り付けた部品に対する操作をここに書きます
　　　　Xという画像(「********.JPG」)を作る
　　　　キャンバス1へ画像を描くして、画像図形1とする
　　　　　　その位置と大きさは、｛0,0,200,150｝
　　　　　　その画像をXに変える
        	//ここに画像加工スクリプトを書く
        	画像効果としてXをネガポジ反転して、Yとする
        	画像図形1の画像は、Y
　　　　 キャンバス1を更新する
　　終わり

　　初期化する手順
　　この内部領域大きさを｛363、312｝に変える
　　この内容を「メイン画面」に変える
　　このドラッグドロップを○に変える
　　キャンバス1というキャンバスを作る
　　　　その移動順を1に変える
　　　　その位置と大きさを｛13、70、338、230｝に変える
　　　　その位置固定方向を「右＋左＋下＋上」に変える
終わり
終わり
```

#画像を明るくする
```
画像効果として、入力画像を10だけ明るくして、結果画像とする
```

#コントラスト調整
```
画像効果として、入力画像を10だけコントラスト調整して、結果画像とする
```

#ガンマ補正
```
画像効果として、入力画像を1.5だけガンマ補正して、結果画像とする
```

#エンボス加工
```
画像効果として、入力画像をエンボス加工して、結果画像とする
```

#グレイスケール化
```
画像効果として、入力画像をグレイスケール化して、結果画像とする
```

#ネガポジ反転
```
画像効果として、入力画像をネガポジ反転して、結果画像とする
```

#鮮明化
```
画像効果として、入力画像を鮮明化して、結果画像とする
```

#セピア加工
```
画像効果として、入力画像をセピア化して、結果画像とする
```

これだけで、高性能な画像加工ツールを作成できます。
皆さんも是非プロデルで画像加工ツールを作ってみてください!
普段なにげなく書いている[unowned self]の意味を調べる

Swiftではクロージャー内でselfを使う時には[unowned self]を使わないとメモリリークが発生する事があります。

```swift
method({ [unowned self]
    self.hoge()
})
```

## メモリリークが発生する状況
下のようにclosureからself, selfからclosureを参照している場合はお互いに参照しあってしまいメモリリークが発生します。

```swift
class MyClass {
    var closure: (() -> ())? = nil
    func method() {
        closure = {
            print(self)
        }
    }
}

MyClass().method() // MyClassインスタンスは開放されない
```

## メモリリーク対策
[unowned self]を入れれば循環参照を起こさず、メモリリークは発生しなくなります。
今回はこの[unowned self]の[]とは何かを書いていきます。

```swift
class MyClass {
    var closure: (() -> ())? = nil
    func method() {
        closure = { [unowned self] in // 循環参照にならない
            print(self)
        }
    }
}

MyClass().method()
```

## []とは何か
[]はSwiftのキャプチャと呼ばれる機能です。
selfに使われる事が多いですが、実は普通の変数にも使う事ができます。

## キャプチャ機能について
[]で変数を囲むと、その後その変数に何を代入しても代入前の値を見るようになります。

```swift
var x = 0
var y = 0
let closure = { [x] in
    print(x, y) // → 0, 10
}
x = 10
y = 10
closure()
```

オブジェクトのプロパティーを変更した場合は変更が反映されます。

```swift
let x = MyClass()
let y = MyClass()
let closure = { [x] in
    print(x.value, y.value) // → 10, 10
}
x.value = 10
y.value = 10
closure()
```

配列のappendの場合は変更前の値を保持します。

```swift
var x = [1, 2]
var y = [1, 2]
let closure = { [x] in // → [1, 2], [1, 2, 3]
    print(x, y)
}
x.append(3)
y.append(3)
closure()
```

下のように代入のような形で使う事もできます。

```swift
var x = 0
var y = 0
let closure = { [z = x] in
    print(x, y, z) // → 10, 10, 0
}
x = 10
y = 10
closure()
```

## [unowned self]とは何か
[unowned self]とは、非所有参照でselfをキャプチャする事です。
クロージャー内では元のselfでなく、新しい非所有参照のselfを使うので循環参照が起こらなくなります。

```swift
let closure1 = { [unowned self] in
    print(self)
}
// ↑ と ↓ は同じ意味
let closure2 = { [unowned this = self] in
    print(this)
}
```

## 参考URL
[Expressions](https://developer.apple.com/library/prerelease/ios/documentation/Swift/Conceptual/Swift_Programming_Language/Expressions.html#//apple_ref/doc/uid/TP40014097-CH32-ID383)
[Android]Android端末の多言語対応のために言語環境を取得してみた

#自己紹介的ななにか
qnote Advent Calendar 2015 の 3日目を担当する横田です。
猫のいる会社qnoteで猫給仕室長として勤しみながら、あいた時間にプログラマをやっています。
…石を投げないでください！

#本題

最近Androidのアプリ開発を始めたので、そこで得た知識をアウトプットしてみます。
浅い知識ですみません。

以前書いた下記の記事が自分のためにそこそこ役立っています。

[[iOS]中国語対応のために端末の言語環境の値を取得したときにハマったこと](http://qiita.com/BlackCat/items/ea3e48a4b43b38c4da24)

ついでなので、Android版も調べてみたので、備忘録として残しておくことにします。

```java
public static String getLocaleId()
{
	String localeId = "ja";
		
	// ロケールの取得
	Locale locale = Locale.getDefault();
	String language = locale.getLanguage();
	String country = locale.getCountry();
		
	if (language.equals("ja")) {
		localeId = "日本語";
	} else if (language.equals("en")) {
		localeId = "英語";
	} else if ((language.equals("zh")) && (country.equals("CN"))) {
		localeId = "簡体字";
	} else if ((language.equals("zh")) && ((country.equals("TW")) || (country.equals("HK")))) {
		localeId = "繁体字";
	}
		
	return localeId;
}
```

Utilクラスでも作って、そこにこのメソッドを定義しておくと、たぶん便利に使えるかと思います。
すごく長い行を読む場合の注意点

Goで 1行 1行読み取って処理をしたいときは, `bufio.Scanner`を使うのが推奨されています. しかし `bufio.Scanner`にはひとつ欠点があり, 長すぎる行が読めないという問題があります. 最長で MaxScanTokenSize(64 * 1024)バイトしか読めず, これ以上長い行を読ませようとするとエラーが返ります. この値は constで定義されているため変更できません. また NewScanner的な関数の引数にサイズを与えて独自のバッファサイズを設定するということもできません. そのため長い行を読む場合は今のところ `bufio.Scanner`を使うことはできません.

#### 追記

開発版には `bufio.Scanner.Buffer()`メソッドが追加され, ユーザ定義のバッファが Scannerに設定できるようです. これを使えば上限がわかる場合は Scannerだけでも対応できます(任意の長さとなると後述のような方法しかないと思います. Scannerで errorが返ったときさらに大きなバッファを割り当てるという方法もありますが, 同程度に面倒になりそうです).

コメントで @heliac2000 さんに教えていだきました. ありがとうございます.

多くの場合問題にならないと思いますが, すごく長い行を含むファイルが入力として与えられる可能性がある場合は意識しておく必要があるでしょう.


## 失敗例

標準入力から読み取り, 各行に何バイト含まれているかを出力するプログラムを考えます. 初めに長い行を含むファイルを以下のコマンドで生成しておきます.


```
% perl -E 'say "x" x 10_000_000' > test.txt
```

次に `bufio.Scanner`を使ったコード例を示します.

```go
package main

import (
	"bufio"
	"fmt"
	"log"
	"os"
)

func main() {
	s := bufio.NewScanner(os.Stdin)

	i := 1
	for s.Scan() {
		fmt.Printf("%d line length is %d\n", len(s.Text()))
		i++
	}

	if err := s.Err(); err != nil {
		log.Fatal(err)
	}
}
```

このプログラムに先ほど生成したファイルを与えてみましょう.

```
% go run scanner.go < test.txt
2015/12/02 22:50:12 bufio.Scanner: token too long
exit status 1
```

`MaxScanTokenSize`を超えてしまう行を読み込んでしまったため, `token too long`というエラーを受け取ってしまいました. 

## bufio.Scannerを使わない方法

`bufio.Reader`の ReadLineメソッドを使います. ドキュメントには通常であれば代わりに `bufio.Scanner`を使えとありますが, 使えないのでこちらを使います.

```go
package main

import (
	"bufio"
	"bytes"
	"fmt"
	"io"
	"log"
	"os"
)

func main() {
	r := bufio.NewReader(os.Stdin)
	for i := 1; ; i++ {
		buf, isPrefix, err := r.ReadLine()
		if err != nil {
			if err != io.EOF {
				log.Fatal(err)
			}
			break
		}

		bb := bytes.NewBuffer(buf)

		if isPrefix {
			for {
				b, cont, err := r.ReadLine()
				if err != nil {
					if err != io.EOF {
						log.Fatal(err)
					}
					break
				}

				if _, err := bb.Write(b); err != nil {
					log.Fatal(err)
				}

				if !cont {
					break
				}
			}
		}

		fmt.Printf("Length of %d line is %d\n", i, bb.Len())
	}
}
```

`bufio.Reader.ReadLine`メソッドは 3つの戻り値があり, それぞれ読み取ったバッファ, 全部読み取れたかどうか, エラーになります. 注目するのは 2つめの戻り値でこれが `true`であれば, 行はさらに続くのでさらに読み取りを行い, 初めに得たバッファに追記していきます. これを 2つめの戻り値が falseになるまで続けます. これでどれだけ長い行でも読めるようになります. 実行結果は以下のようになり. 10,000,000文字分読めていることが確認できます.

```
% go run test.go < test.txt
Length of 1 line is 10000000
```

## おわりに

Goで長い行を読む場合の注意点について示しました.

明日は @Maki-Daisuke さんです.
Windows 10 で Cisco VPN Client を使えるようにする

Qiita でいいのか迷ったけど、ブログを開設するのも面倒なので・・・

2018/06/11 追記
コメントにもいただいてますが、 下記のバージョンで動作することを確認済みです。

+ 1507 / TH2 / November Update
+ 1607 / RS1 / Anniversary Update
+ 1703 / RS2 / Creators Update
+ 1709 / RS3 / Fall Creators Update
+ 1803 / RS4 / April 2018 Update

# 参考URL

+ [Cisco VPN Clientのインストール方法, Windows 8.1](http://yoheiaki.blogspot.jp/2015/04/cisco-vpn-client-windows-81.html)
+ [it_tech_memoのblog : Windows8.1+Cisco VPN Clientインストール時にエラー　エラー 27850 Unable to manage networking component. Operatin system corruptioin may be preventing installation.](http://blog.livedoor.jp/it_tech_memo/archives/12357168.html)
+ [IT That Should Just Work: [SOLVED] Cisco VPN Client on Windows 10 (Including build 1511) - This works!](http://itthatshouldjustwork.blogspot.jp/2015/07/cisco-64-bit-vpn-client-on-windows-10.html)

# 手順
Ver.5.0.07.0440 を対象にする。単純にインストールしようとしても

```
Error 27850  Unable to manage networking component. 
Operatin system corruptioin may be preventing installation. 
```

と出てインストールできない。以下の手順に従って DNE アップデートしてからならインストール可能。
 
1. ftp://files.citrix.com/winfix.exe から winfix.exe をダウンロードして実行
1. ftp://files.citrix.com/dneupdate64.msi から dneupdate64.msi をダウンロードして実行
1. vpnclient_setup.msi を右クリックして 互換性をWindows 7に設定しておく。
1. vpnclient_setup.msi を実行


ここまででインストールは可能になるが、コネクションを確立しようとしてもエラーになる。

```
Secure VPN Connection terminated locally by the Client.
Reason 442: Failed to enable Virtual Adapter.
```

これは以下の手順で回避可能。

1. レジストリエディタを起動
1. ```HKLM\SYSTEM\CurrentControlSet\Services\CVirtA``` の ```DisplayName``` の値を ```Cisco Systems VPN Adapter for 64-bit Windows``` に変更
1. 再起動

これで問題なく VPN 接続ができるようになるはず。
これでイブデートもばっちり！telnetでコミュ障脱出（SMTP編）

2日目なのを忘れててあと22分しかないからとばしていくよ！

この生き馬の目を抜く時代。生き延びるのに必要なのはやっぱコミュ力だよね！　コミュ力さえあれば、イブに女子と楽しいデートをすることだってできるさ（ただしイケメンに限る）。

そこで今日は、コミュ力養成のためにメールサーバとSMTPプロトコルで会話するレッスンをしてみよう！　最近の若いモンは知らないみたいだしね。なお、あんまり細かいことは気にしないよ？

まず、以下のような環境であることを確認しよう！

* telnet コマンドがある  
  なにィ！　見つからない？　`yum -y install telnet`するんだ！
* localhost に適切なMTA（sendmailとかsendmailとかsendmail）が入っている

では、さっそくコマンドラインから以下のように入力･･･。

````
$ telnet localhost smtp
````

これでメールサーバとSMTPでおしゃべりする状態になるよ。なお、以下、めんどくさいのでサーバのレスポンスは略記するぜ。

じゃあ、hoge@example.net の人が fuga@example.net の人にメールを送る前提で会話していこう。最初は、

````
EHLO example.net
````

で「こんにちは！」。

続けて、

````
MAIL FROM:<hoge@example.net>
RCPT TO:<fuga@example.net>
````

として差出人・宛先を打ち込む。そして、

````
DATA
(空行)
Hello, this is HAL-9000.
I can sing songs.
(空行)
.
````

と本文を受け渡し。.は本文終わりのマークだ。

最後に、紳士としてサーバに「さよなら」を言おう。

````
QUIT
````

これでメールが送られるはず！　指定した送付先のメールアドレスを確認してみよう。届いてなかったら･･･がんばれ！

送信がうまくいったら、RFC*822系を読んでDATA以降に入力する内容をいろいろ試してみると、SubjectやFromなどのフィールドも追加できるようになるよ！

じゃあ、イブデートまでコミュ障克服をめざしてがんばってね！
underscoreとlodashの比較(map)


underscoreもlodashも詳しくないので、勉強半分でソースコードを読む。

##利用するバージョン
[underscore.js(v1.8.3)](https://github.com/jashkenas/underscore/tree/1.8.3)

[lodash.js(v3.10.0)](https://github.com/lodash/lodash/tree/3.10.0-npm-packages)


##mapとは

今ある配列を元に新しい配列を作り直す関数。

配列の場合は

```javascript
'use strict';

var _ = require( "underscore" );

var arr = [ 1, 2, 3 ];

var hoge = _.map( arr, function( element ) {
    return element * 3;
});

console.log( hoge ); //[ 3, 6, 9 ]
```



連想配列の場合は

```javascript
arr = { "a": 1, "b": 2, "c": 3 };
var hoge = _.map( arr, function( element, key ) {

    return element * 3;
});

console.log( hoge ); //[ 3, 6, 9 ]
```

lodashも同様。


##[underscore.map](https://github.com/jashkenas/underscore/blob/1.8.3/underscore.js#L165)

```javascript
_.map = _.collect = function(obj, iteratee, context) {
  iteratee = cb(iteratee, context);
  var keys = !isArrayLike(obj) && _.keys(obj),
      length = (keys || obj).length,
      results = Array(length);
  for (var index = 0; index < length; index++) {
    var currentKey = keys ? keys[index] : index;
    results[index] = iteratee(obj[currentKey], currentKey, obj);
  }
  return results;
};
```

_.collectも_.mapと同様。

foreach同様isArrayLikeや_.keysを用いてkeysの判定。

objがarrayだった場合は

```javascript
false  //isArrayLike(obj) -> trueのため
3 // obj.length
[ , , ] //Array(3)
```
の形で変数が生成されて

```javascript
[ "a","b","c" ]  //isArrayLike(obj) -> falseのため_.keys(obj)
3 // keys.length
[ , , ] // Array(3)
```

というかたちで処理される

その後、普通のfor文でのループ
currentLeyは
配列の場合はkeys -> falseのため index,
連想配列の場合はkeys[index] //ex)a,b,c

となって、それをiterateeで処理したものを返り値resultsとしてreturnする



##[lodash.map](https://github.com/lodash/lodash/blob/3.10.0-npm-packages/lodash.map/index.js)

```javascript
function map(collection, iteratee, thisArg) {
  var func = isArray(collection) ? arrayMap : baseMap;
  iteratee = baseCallback(iteratee, thisArg, 3);
  return func(collection, iteratee);
}

```


lodashはまた明日に（ｒｙ
【Laravel】Eloquentのメソッド、プロパティ簡単まとめ


Laravelの **Eloquent** について初心者の私が勉強した時に簡単にまとめてみました。
間違い等があれば、指摘お願いします。

## Eloquentとは
DBとモデルオブジェクトを対応付ける機能。

## Eloquentモデルでよく使うプロパティ
プロパティ | 説明 | 規定値
--- | --- | ---
$connection | どのDB接続するのか。onメソッドで動的に変更可 | 
$table | どのtableに対して処理するのか | (モデル名の複数形) 
$primaryKey | 主キーの設定 | id
$incrementing | 主キーをオートインクリメントするかどうか | true
$timestamps | テーブルの作成、更新日時を自動更新 | true
$fillable | 渡した属性を複数代入させるかどうか(columnに値を入れたい場合必須) | null
$guarded | 複数代入させないcolumnの指定($fillableと対) | [*] 全てのcolumnが複数代入できない
$hidden | モデルを配列/JSON変換するときに隠蔽されるcolumnの指定 | null
$visible | $hiddenと対 | [*]

## よく使うメソッド
メソッド名 | 内容
--- | ---
find | 主キーを指定して検索
where | 検索条件を指定 orWhere や引数でAND, OR検索ができる
count | 件数を取得する
first | データを1件だけ取得する
toArray | データを配列に変換
toJson | データをJSONに変換
create, save | データの作成。createの場合は、モデルのfillableの設定が必須
insert | 複数のデータを一括作成
update, save | データの更新
delete, destroy | データの削除。destroyは主キーを複数指定して削除可能

### 例
```
App\User::find(1);
=> App\User {
     id: 1,
     name: "hoge hoge",
     email: "hoge@hoge.com",
     created_at: "2015-11-11 11:11:11",
     updated_at: "2015-11-11 11:11:11",
   }
```

### よく使う検索条件をメソッド化
メソッドの先頭にscopeをつけるとクエリスコープが定義できる。
呼び出しはscopeを外したメソッド名()

## 論理削除
### 設定
マイグレーションファイルに以下を追加

```php
$table->softDeletes();
```

### 使用
```php
use Illuminate\Database\Eloquent\SoftDeletes;
```
をモデルに追加して使用する。
通常の`delete`, `destroy`でdeleted_atに削除時間がセットされる。
モデルでの検索時に論理削除したデータは結果に含まれない

### メソッド
- withTrashed 論理削除したデータを検索結果に含める
- onlyTrashed 論理削除したデータのみ検索対象にする
- restore 論理削除したデータを復元する
- forceDelete 論理削除対象のモデルを物理削除する

## リレーション
関係 | 親 | 子 | 備考
--- | --- | --- | ---
1:1 | hasOne | belongsTo |
1:N | hasMany | belongsTo |
N:N | belongsToMany | belongsToMany | 中間テーブル必要

### 例
#### 1:N
メールアドレス等を持ったusersテーブル(親)とつぶやき情報を持ったtweetsテーブル（子）があるとすると

```php:Userモデル
class User extends Model 
{ 
	public function tweet()
	{ 
		return $this->hasMany(Tweet::class); 
	}
}
```
```php:Tweetモデル
class Tweet extends Model 
{ 
	public function user()
	{ 
		return $this->belongsTo(User::class); 
	}
}
```


## N+1問題対策
Eagerローディングは`with`メソッドを用いる。

### 例
上のusersとtweetsを例に、tweetに紐付いたユーザを取得し、表示したい場合等

```php
$tweets = App\Tweet::with('user')->get();
```
Kubernetes の manifest に設定できるパラメータ一覧

「[Open PaaS  Advent Calendar 2015](http://www.adventar.org/calendars/803)」２日目の記事です。

Kuberenetesでリソース(`Pod`や`ReplicationController`)デプロイする時に、JSON/YAML形式のマニフェストファイルが必要になるのですが、どんなパラメータが設定できるのか一覧を見たくなることがあります。Kubernetesは、Swaggerというフレームワークを使っているので、 `http://KUBE_HOST:8080/swaggerapi/api/v1` や `http://KUBE_HOST:8080/swagger-ui/` から確認することもできるのですが、`$ref`でいろんなResourceが階層構造になっていて、少し見づらいです。

という理由で、[kubernetes-manifest-scanner](https://github.com/nak3/kubernetes-manifest-scanner)を書きました。(言い訳: Advent Calendarに間に合わせようと、少しやっつけで書いています。manifestファイルを参照用だけのツールなので大目に見てください。)

使い方は、

##### 0. ビルドして

~~~
git clone https://github.com/nak3/kubernetes-manifest-scanner.git
cd kubernetes-manifest-scanner && ./build.sh
~~~

##### 1. リソースのリストを確認して

~~~
./bin/kubectl-manifest-scanner itemlist
v1.EventList
v1.Event
v1.PersistentVolumeClaim
v1.ReplicationControllerList
...
v1.Service
...
~~~

##### 2. パラメータ一覧を見て

~~~
./bin/kubectl-manifest-scanner sample -i v1.Service -d 20
{
	"apiVersion": "string",
	"kind": "string",
	"metadata": {
		"annotations": {
			"any": "e.g. label"
		},
		"creationTimestamp": "string",
		"deletionGracePeriodSeconds": "integer",
		"deletionTimestamp": "string",
                 ...(略)...
~~~

##### 3. 意味を調べたいパラメータの詳細を参照する

~~~
./bin/kubectl-manifest-scanner snippet -i deletionGracePeriodSeconds
{
	"v1.ObjectMeta": {
		"properties": {
			"deletionGracePeriodSeconds": {
				"description": "Number of seconds allowed for this object to gracefully terminate before it will be removed from the system. Only set when deletionTimestamp is also set. May only be shortened. Read-only.",
				"format": "int64",
				"type": "integer"
			}
		}
	}
}
~~~

以上です。

パラメーターは、必須ですべて書かないといけないということはないです。あくまでも、一覧の参照と意味の参照用に。また、デフォルトで[アップストリーム](https://raw.githubusercontent.com/kubernetes/kubernetes/master/api/swagger-spec/v1.json)のSwaggerを参照していますが、バージョンによって設定できるパラメータも違うので、`-f`オプションで自分が利用しているKubernetesの`http://KUBE_HOST:8080/swaggerapi/api/v1`を指定してください。

OpenShift v3でもこのツールは使えるのですが、Open Shift v3の場合、JSONファイルはほとんど書かなくて良いので、パラメーターをちょっと見たい時に使うくらいでしょう。
[Material Design] UI設計をおさらいしたい人のためのリンク集


![スクリーンショット_2015-12-02_23_09_08.png](https://qiita-image-store.s3.amazonaws.com/0/53303/2ce7c9b1-af11-beb0-1892-2fa856aff383.png "スクリーンショット_2015-12-02_23_09_08.png")


Googleのマテリアルデザインを主眼にしたリンク集です。

## Google公式
[Material Design](https://www.google.com/design/spec/material-design/introduction.html#)

## 入門+コンセプト復習編
[よくわかるマテリアルデザインの設計コンセプト](http://fladdict.net/blog/2015/05/material-design.html)
[今さら聞けない?! 5分でわかる！マテリアルデザイン入門](http://lab.sonicmoov.com/design/material-design/)
まずはこの2つでイメージを把握。図解が丁寧で素晴らしいです。

[はじめてのマテリアルデザイン入門](http://dev.classmethod.jp/smartphone/android/first_material_design/)
上から順に見ていくとマテリアルデザインの概要がつかめるという素晴らしい記事。

[Google の新しいデザインガイドライン「Material Design」(Developers.io)](http://dev.classmethod.jp/smartphone/android/google-material-design/)
公式ドキュメントの翻訳と、
マテリアルデザインのゴール、基本原則等を丁寧に書いてくれています。
マテリアルデザインをどうやって始めればいいのか？までの解説付き

## 具体的な基準数値を把握しよう編
[アップルとグーグルのガイドラインに学ぶスマホWebデザインの要点（スライド付）](http://baigie.me/sogitani/2015/07/apple-google-design-guideline/)
iOSヒューマンインターフェイスガイドラインと、マテリアルデザインガイドを比較してのまとめです。
これに全て書いてあった・・!!
最小フォントサイズ、行長、字間等の具体的数値をまとめてくれています。
テキスト情報も素敵ですが、スライドが素晴らしいです。熟読しましょう。

## 事例集編

[materialUp](http://www.materialup.com/)
言わずもがなの事例集。ハイクオリティ

[これから始める人のための、マテリアルデザイン参考サイトまとめ](http://designup.jp/material-design-consept-427/)
独自にサービスをまとめてくれています。

[iOSUp](http://www.ios.uplabs.io/)
マテリアルデザインではないですが、最近iOS&Macアプリ集も出たようなのでついでに

## 便利ツール編
[Material icons guide](http://google.github.io/material-design-icons/)
公式アイコン集 & ガイド

[Material Design Community Icons](https://materialdesignicons.com/)
コミュニティが提供しているアイコン集

[material palette](http://www.materialpalette.com/)
★便利!２色選ぶとサンプルとカラーパレットを生成してくれるという優れもの

## テンプレ / フレームワーク

[Google公式](http://www.google.com/design/spec/resources/layout-templates.html#)
・テンプレート: Layout templates
・フォント: Roboto & Noto fonts
すべてダウンロード可能です

[公式:Material Design Lite](http://www.getmdl.io/)
[解説:マテリアルデザインを手軽に！CSS/HTML/JSコンポーネント「Material Design Lite」の使い方まとめ](http://photoshopvip.net/archives/79389)
Material Design Lite はテンプレートのように手軽に使えます。

[Material Design for Bootstrap](http://fezvrasta.github.io/bootstrap-material-design/)
Bootstrapテーマも存在するようです

[公式:Polymer With Material Design](https://www.polymer-project.org/1.0/)
[解説:Polymerとは、初めてのPolymerを使ってみる](http://shared-blog.kddi-web.com/activity/250)
PolymerはGoogle提唱のJavaScriptのUIフレームワークです。

[material ui](http://www.material-ui.com/#/)
CSSフレームワーク。話題のReact対応だそうです

※[Material Design対応の使えるCSS・JSフレームワーク集](http://shared-blog.kddi-web.com/activity/277)より

#### Androidコンポーネント

[MaterialDesignLibrary](https://github.com/navasmdc/MaterialDesignLibrary)
[MaterialEditText](https://github.com/rengwuxian/MaterialEditText)

## おまけ
[Material Designの採用で「Domain」アプリのダウンロード数が44%も増加した例](http://getnews.jp/archives/1146482)
[レビュー：Android史上最高の" L"、初めてiOSの"触感"を超えた](http://appllio.com/20140706-5435-andoir-l-dev-preview-review)
Date Range PickerとMilkcocoa JavaScript SDKを組み合わせる！

#はじめに


<img width="821" alt="f56dca99-3e4b-833a-5d2f-27c098592324.png" src="https://qiita-image-store.s3.amazonaws.com/0/20848/d2e545d4-6dd9-a045-20f1-49f2838bf080.png">

jQuery UI向けのDate Range Picker！

http://tamble.github.io/jquery-ui-daterangepicker/

日付の範囲を指定するUIです。このUIで範囲指定をして、Milkcocoaからデータを取得できたら格好いいなと思いまして。作ってみました。普段バックエンドばかり触っているエンジニアからすると、こういうはじめから格好いいUIを見るとなんだかワクワクして、いろいろ作りたくなります。

#実装

　アプリは[Milkcocoaのサンプルチャット](http://milk-cocoa.github.io/chat)をそのまま使います。オープンにアクセスできるので、いろいろ便利です。
　Milkcocoaからデータを取得するのは[History API](http://qiita.com/syuhei/items/2dcc95fccb21e5f8ac91)がちょうど良いです。

daterangepickerを使うのに、jquery,jquery-ui,momentが必要です。この辺はbowerとか使うと楽そうです。

```
<head>
    <link href="jquery-ui.min.css" rel="stylesheet">
    <link href="jquery.comiseo.daterangepicker.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="jquery-ui.min.js"></script>
    <script src="moment.min.js"></script>
    <script src="jquery.comiseo.daterangepicker.min.js"></script>
    <script src="https://cdn.mlkcca.com/v2.0.0/milkcocoa.js"></script>
    <script>
        $(function() {
        	var milkcocoa = new MilkCocoa('flagi9edsvtg.mlkcca.com');
        	$("#e1").daterangepicker({
		        numberOfMonths: 3,
		        onChange: function() {
		        	var range = $("#e1").daterangepicker("getRange");
		        	var history = milkcocoa.dataStore('message').history();
					history.sort('desc').size(50)
					.span(range.start.getTime(), range.end.getTime());
					history.on('data', function(data) {
					    var html = data.map(function(d) {
					    	return '<div><span>'+d.id+'</span><span>'+new Date(d.timestamp).toLocaleString()+'</span><span>'+JSON.stringify(d.value) + '</span></div>';
					    }).join('');
					    $('#messages').append(html);
					});
					history.run();
				    $('#messages').empty();
		        }
        	});
        });
    </script>
</head>
<body>
    <input id="e1" name="e1">
    <div id="messages"></div>
</body>
```

さくっとHTMLを書きました。

<img width="1010" alt="スクリーンショット 2015-12-06 21.30.15.png" src="https://qiita-image-store.s3.amazonaws.com/0/20848/6935f334-b2ae-63b4-a48d-152dc68cd445.png">

<img width="1010" alt="スクリーンショット 2015-12-06 21.30.23.png" src="https://qiita-image-store.s3.amazonaws.com/0/20848/f56dca99-3e4b-833a-5d2f-27c098592324.png">

<img width="1256" alt="スクリーンショット 2015-12-06 21.36.57.png" src="https://qiita-image-store.s3.amazonaws.com/0/20848/f542d62c-ea6d-8306-2616-ded5e4dfb05e.png">

このように指定した範囲の日付で、データが取得できます。Milkcocoa Meetupがあった10/4あたりで指定すると、この通り。daterangepickerは格好いいのに、データの表示部分がノンスタイルでイケてないのですね。


#まとめ

このDateRangePickerで折れ線グラフとか出したら格好いいな〜と思いました。
Consulがたまに暴れている件について

## はじめに

表題の件、実は100%解消していないため不完全燃焼な感じの記事となっておりますのでご了承ください。
（もし完全解決したら記事をUpdateする予定）

## サーバ構成

ロール | バージョン | インスタンスタイプ | 台数
------|----------|-----------------|-----
Consul Server | 0.5.2 | t2.midium | 3
Consul Agent  | 0.5.2 | ごちゃまぜ。t2.microが多いかも | (秘密..結構大きいと思う)


## 現象について

日に１、２回ほどこんなログが出力される。
どこか（不確定）のノードが一時的にFailし、すぐにJoinし直す。
現象としては [以前](http://qiita.com/toritori0318/items/f724a14bea183975a862) に書いたのと似てはいるが、頻度が低い。たまに起こる程度。

    2015/11/30 06:09:25 [INFO] memberlist: Marking hogenode as failed, suspect timeout reached
    2015/11/30 06:09:25 [INFO] serf: EventMemberFailed: hogenode xxx.xxx.xxx.xxx
    2015/11/30 06:09:25 [INFO] consul: member 'hogenode' failed, marking health critical
    2015/11/30 06:09:27 [INFO] serf: EventMemberJoin: hogenode xxx.xxx.xxx.xxx
    2015/11/30 06:09:27 [INFO] consul: member 'hogenode' joined, marking health alive

今のところ、うちではクリティカルな使い方をしていないのでそれほど問題になっていないが、
nginxコンフィグやデータストアのエンドポイントをConsul Templateなどで適用している場合に困るかもしれない[^1]し、そもそもスッキリしない。

## 対応

いくつかissueなどを眺めてみて、出来る限りConsulの負荷をかけないように設定しなおしてみることにした。
基本的には [こちら](https://github.com/hashicorp/consul/issues/1212) の情報を参考にしてみる。
決め手となる感じではなさそうだが、やらないよりはやったほうが良さそうだし。

- Consul本体
  1. ConsulのGOMAXPROCS>=2 にする
  2. TTLを設定する
  3. ネットワーク性能の良いインスタンス(M4など)に移行する
  4. MTUの調整？
- Consul Template
  1. max-staleの値を設定する(0.11.0以前のバージョンを利用している場合は[特に注意](https://github.com/hashicorp/consul-template/issues/386))

実際に行ったのは Consul本体の 1.2. と、Consul Templateの max-stale 対応。

## 結果

それなりに改善し、頻度は減ったように見える…が、 ``0になったわけではない`` 。
ちなみに、効果があったかなーと思うのは GOMAXPROCSとConsul Templateの設定ではないかなと思っている。

## 考察

０にならないのは何故なのか考えてみる。[^2]

### わりとヘビーな使い方してる

このクラスタは結構な数を管理しているが、
追加／削除が数十台レベルで／日常的に／しかも頻繁に行われる環境である、ということ。
より負荷がかかっているのかもしれない。

### クラスタ内にt2.microがたくさんいる

クラスタ内にt2.microが半数近くいるのが原因説。
ネットワーク性能がかなり低いので、クラスタ全体的のパフォーマンスに影響を与えているのではないか。

### 特定のサーバがなんらかの原因でネットワーク過負荷になっていたのかも

以前[別エントリ](http://qiita.com/toritori0318/items/f724a14bea183975a862)にも書いているが、どれか一つのサーバ・ネットワークが劣化すると全体的に不安定になる事案が発生していた。
もしかしたらFailしている時間帯に、特定サーバのネットワークが重くなったりしているのかもしれない[^3] 

## あとがき

調査にまとまった時間が取れず、中途半端な結果に終わってしまいました。
手が空いたらもう少し詳細に追いたいなーと思っています。

## 全然関係ない話

[Consul Template](https://github.com/hashicorp/consul-template)、久々に見たらファンクションすごい増えててびっくりした。別記事で書きたい

<br>

[^1]: Consul Templateの statusオプション を any にすれば一応回避可能
[^2]: 調査として軽くパケットキャプチャやログ追ってみたものの、原因特定できず… 「どのサーバで発生するのかわからない」というのが厳しい
[^3]: ``特定の時間帯にネットワークが重くなっているサーバを探す``というの、Zabbixで発見出来るのかな？
ebiのルーティング

ebiの一番シンプルなルートはクロージャです。
routes.php を開き（または作成し）ルートを定義してください。

```
<?php
include('ebi.phar');

\ebi\Flow::app([
	'users'=>['action'=>function(){
		return ['msg'=>'Users!'];
	}]
]);

```
Webブラウザーで routes.php/users へアクセスすればレスポンスとしてJsonが表示されます。

```
{
	"result": {
		"msg": "Users!"
	}
}
```


ルートはクラスメソッドで指定することもできます。例えば：

```
'users'=>['action'=>'User::index']
```

このルートがフレームワークに伝えているのは、/usersへのアクセスでUserクラスのindexメソッドが呼び出されるという内容です。

※built-in web serverを起動しているものとします。



参考:
 https://github.com/tokushima/ebi
 http://readouble.com/laravel/4/2/0/ja/quick.html
UITextFieldでsecureTextEntryの切り替えをする際の注意点

パスワード入力を実装する際、UITextFieldのsecureTextEntryを使用するかと思います。
パスワードを一時的に表示する機能を付ける際はsecureTextEntryを切り替えるわけですが、そこで問題が起きたのでメモ。

非表示 -> 表示の切り替えをした際に、キャレットが非表示の場合に表示される黒丸の位置に表示されたままになってしまい、実際の文字とかなりずれてしまいました。

非表示状態
<img width="240" alt="hidden.png" src="https://qiita-image-store.s3.amazonaws.com/0/13042/37ff7ba4-ac57-0359-36ee-6551570a12a6.png">

表示状態
<img width="241" alt="display.png" src="https://qiita-image-store.s3.amazonaws.com/0/13042/1a449500-be41-b3d5-75d6-0abe6e153500.png">


単純に`pwTextField.secureTextEntry = !pwTextField.secureTextEntry`として表示／非表示を切り替えるとこうなります。

**解決策**
secureTextEntryの切り替え後、

`pwTextField.becomeFirstResponder()`

で明示的にfirstResponderにしてあげるとキャレットがちゃんと文字に合わせた位置に表示されます。

Swift2.1, iOS8.1+で動作確認済みです。
ログイン不可ユーザでplatexコマンドが使えない時の対応

#状況
apacheで動いてるphpからシェルスクリプト実行して，platexとdvipdfmxでpdfを生成するプログラムで，pdfが生成されずエラーになってた．

#問題
こんなメッセージが出て.texのコンパイルが通らずに終了していた．

```
This is pTeXk, Version 3.141592-p3.1.10 (euc) (Web2C 7.5.6)
 %&-line parsing enabled.
I can't find the format file `platex.fmt'!
```

しかしながらrootとかで直接platex叩いたり，シェルスクリプト実行したりすると問題なくpdfが生成できる．

#原因
エラーメッセージの通り，パスの通っているところに`platex.fmt`がない．

##なんで無いのか
texの設定ファイル（texmf.cnf）を見てみる
`/usr/share/texmf/web2c/texmf.cnf`

どうやらユーザのホームディレクトリ以下にパスが通っている．
rootのホームディレクトリを見ると，確かに置いているらしい．
なので，ログイン可のrootではコンパイル通るけど，apacheはログイン不可=ホームディレクトリないのでコンパイル通らない．

```
% TEXMFSYSCONFIG, where texconfig-sys stores configuration data.
% With teTeX-3.0 or later, this must be set.
% For sharing this tree with $TEXMFMAIN:
%   TEXMFSYSCONFIG = $TEXMFMAIN
% For using a separate tree:
%   TEXMFSYSCONFIG = $SELFAUTOPARENT/texmf-config
TEXMFSYSCONFIG = /etc/texmf

% User texmf trees are allowed as follows.
% This used to be HOMETEXMF.
TEXMFHOME = $HOME/texmf

% TEXMFVAR, where texconfig stores variable runtime data.
% With teTeX-3.0 or later, this must be set.
% For sharing this tree with $TEXMFMAIN:
%   TEXMFVAR = $TEXMFMAIN
% For using a separate tree:
%   TEXMFVAR = $HOME/.texmf-var  # teTeX 3.0 default
TEXMFVAR = $HOME/.texlive2007/texmf-var

% TEXMFCONFIG, where texconfig stores configuration data.
% With teTeX-3.0 or later, this must be set.
% For sharing this tree with $TEXMFMAIN:
%   TEXMFCONFIG = $TEXMFMAIN
% For using a separate tree:
%   TEXMFCONFIG = $HOME/.texmf-config  # teTeX 3.0 default
% For using a separate tree:
%   TEXMFCONFIG = $SELFAUTOPARENT/texmf-config
TEXMFCONFIG = $HOME/.texlive2007/texmf-config

% Now, list all the texmf trees. If you have multiple trees you can
% use shell brace notation, like this:
%   TEXMF = {$TEXMFHOME,!!$TEXMFLOCAL,!!$TEXMFMAIN}
% The braces are necessary.
%
% For texconfig to work properly, TEXMFCONFIG and TEXMFVAR should be named
% explicitly and before all other trees.
TEXMF = {$TEXMFCONFIG,$TEXMFVAR,$TEXMFHOME,$TEXMFSYSCONFIG,!!$TEXMFSYSVAR,!!$TEXMFLOCAL,!!$TEXMFMAIN,!!$TEXMFDIST}
```

#対処法
パスが通っているところに`platex.fmt`を置けばOK．

まず，どこにあるのか探す．

```
[root@localhost ~]# locate platex.fmt
/home/********/.texlive2007/texmf-var/web2c/ptex/platex.fmt
/root/.texlive2007/texmf-var/web2c/ptex/platex.fmt
```

あったので，パスが通っているところにコピー
`TEXMFSYSCONFIG = /etc/texmf`らしいので

```
[root@localhost web2c]$ cp ~/.texlive2007/texmf-var/web2c/ptex/platex.fmt /etc/texmf/web2c/
```

解決．

#参考
http://akita-nct.jp/yamamoto/comp/latex/settings/settings.html
http://www.latex-community.org/forum/viewtopic.php?f=12&t=2023
iPhone実機でRails開発環境にローカルアクセス

## はじめに
　Railsでwebアプリを作っている時、スマホのUIを修正する必要があった。
　スマホの画面を確認したいだけならブラウザの機能を使ったり、macを使っている場合はiOSシュミレーター使えばいいのだが、どうしてもiPhone実機のブラウザで動作確認をする必要があった。開発に使用しているOSはUbuntuだったが、Macでも同様にできたので記録しておく。

やり方は二つある。

## 1. IP直打ちでアクセス
サーバーを立てているPC(以下、サーバPC）とiPhoneで同じWiFiにアクセスして、サーバPCのIPアドレスをiPhoneのブラウザに入力する。
たとえば、自分のサーバPCのIPが192.168.1.4の場合、iPhoneのブラウザに192.168.1.4:3000などと打てばアクセスできる。
Rails4.2以降の場合は以下を参考に、-bのオプションをつける必要がある。
http://qiita.com/tmf16/items/bb789a45c0f456eac11f

サーバPCのIPアドレスは、ifconfigなどを使えば知ることができる。

## 2. プロキシを経由してアクセス
一つめの方法で大体の場合は事足りるのだが、以下の場合にアクセスすることができない。
・Webアプリでサブドメインを使用する場合
・DNSに登録してないが、ドメイン名でアクセスしたい場合

このような時は、アクセスしたい端末（この場合はiPhone)の/etc/hostsファイルにローカルIPとドメイン名を結びつける情報を書く必要がある.
しかし、iphoneは基本的にhostsは編集できない。

そこで、サーバーPCにプロキシサーバーを立てて、そこを経由して接続する。

具体的には、

・サーバPCの/etc/hostsファイルにその情報を書く
・サーバPCにプロキシサーバーを立てる
・iPhoneから、立てたプロキシサーバーを経由してWifiに接続する

という手順で行う。
こうすることで、iPhoneでドメイン名を入力してアクセスした際に、プロキシサーバーのhostsファイルを参照するのでサーバPCで起動しているRailsにアクセスすることができる。

## 実際にやってみる
それでは、二つめの方法を実際にやってみる。
### 準備

```rb
> rails new testApp
```

### /etc/hostsファイルを編集
/etc/hostsに以下を追加

```
127.0.0.1       test.dev
```

この時点で、

```rb
rails s
```
でサーバーを起動し、http://test.dev:3000 にアクセスしてRailsのスタートページが表示されることを確認する。

### squid3インストール
プロキシサーバーをたてる。プロキシサーバーにはSquidというアプリを使用する。
インストールにはHomebrewを利用する。Ubuntuはapt-getでインストールできる。

```
brew install squid
```

### Squid設定
ubuntuの場合は/etc/squid3/squid.conf, macの場合は/usr/local/etc/squid.confに以下の設定を追加する。

```squid
# ローカルIP(自分の場合は192.168.1.0/24だった)からアクセスできるようにする
acl lan src ローカルIPアドレス
http_access allow lan
```

### Squid起動
```
> sudo squid
```
起動していることを確認する

```
>sudo ps aux | grep squid
User      33798   0.0  0.0  2453268    792 s001  S+   10:41PM   0:00.00 grep --color=auto squid
User      33654   0.0  0.1  2471916  13976   ??  S    10:38PM   0:00.33 (squid-1)
User      33652   0.0  0.0  2469888    656   ??  Ss   10:38PM   0:00.00 squid
```


### iPhone側でプロキシの設定
個別Wifi設定の一番下、HTTPプロキシのタブを手動にして、サーバPCのIPとSquidのポート（デフォルトで3128)を入力
![IMG_0062.PNG](https://qiita-image-store.s3.amazonaws.com/0/62184/71bd623c-b343-27be-28ed-073bd0b3b773.png)


### アクセスしてみる
iPhoneのブラウザでhttp://test.dev:3000 を入力する
<img width="375" alt="IMG_0063.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/62184/0e66073d-0a97-0831-f1e8-110dcb67eefa.png">

できた

### 参考
http://yutaka-j.hatenablog.com/entry/2013/12/22/160657

http://www.server-world.info/query?os=Ubuntu_14.04&p=squid

http://iga-ninja.hatenablog.com/entry/2015/07/25/211935