OmniAICreator/Qiita-1.07M huggingface dataset:
Swift で Rails の decorator みたいなのを作ってみる

[Classi Advent Calendar 2016](http://qiita.com/advent-calendar/2016/classi) 16 日目です！
iOS のアーキテクチャを悩んでいる時に、 Rails の decorator について教えてもらったので、それを Swift で実践してみます。

## Rails の decorator って?

有名どころはここら辺。

* [amatsuda/active\_decorator](https://github.com/amatsuda/active_decorator)
* [drapergem/draper](https://github.com/drapergem/draper)

View で表示するために Model のデータを加工したいとき、 Model にメソッドを生やす手段が一番早い。
でも、 View で使うだけのメソッドを Model に記述するのは責務的にどうなの？

という時に使うやつで、使い方は以下のように書きます。


```ruby 
# decorate してない場合は full_name にアクセスできない
@user = User.first
p @user.full_name
# => method_missing

# decorate したあとは full_name にアクセスできる
@user = User.first.decorate
p @user.full_name
# => "宮本 フレデリカ"
````

## Model に extension 生やす (今までのやり方)

```swift
class User {
    let lastName: String
    let firstName: String
    
    init(firstName: String, lastName: String) {
        self.firstName = firstName
        self.lastName = lastName
    }
}

extension User {
    var fullName: String {
        return lastName + " " + firstName
    }
}

let user = User(firstName: "卯月", lastName: "島村")
print(user.fullName)
// => 島村 卯月
```

Model に fullName のプロパティを生やした。
fullName は画面に表示するためだけに使うので、 Model にあるのおかしいのでは？

## Decoration してみる

```swift
// 普通に User クラスを作る
class User {
    let lastName: String
    let firstName: String
    
    init(firstName: String, lastName: String) {
        self.firstName = firstName
        self.lastName = lastName
    }
}

// draper の User.first.decorate のようにアクセス出来るようにする
extension User {
    var decorate: UserDecorator {
        return UserDecorator(user: self)
    }
}

// Decoration クラスを作成し、 fullName プロパティを生やす
class UserDecorator {
    private let user: User
    
    init(user: User) {
        self.user = user
    }
    
    var fullName: String {
        return user.lastName + " " + user.firstName
    }
}
```



使い方:

```swift
let user = User(firstName: "凛", lastName: "渋谷")
let decoratedUser = UserDecorator(user: user)
print(decoratedUser.fullName)
// => 渋谷 凛

let decoratedUser2 = User(firstName: "未央", lastName: "本田").decorate
print(decoratedUser2.fullName)
// => 本田 未央
```

これで ruby と同じようなことができるようになりました :tada:

## 感想

Model は綺麗になり、 View で使うやつだけ Decorator に定義すれば良くなりました :relaxed: 
実際に使うかは検討中で、fullName くらいだったら Model が持っててもいいかなと思うけど、大きくデコる必要が出てきた時に使おうかなと思います。

また、Ruby は動的言語なのでコントローラ側で decorate しても、 View 側が decorate されてるかそうでないかを意識する必要があります。
Swift は静的言語なので明示的に `UserDecorator` 型で受ける必要があり、 fullName でアクセスできる型なのかが明示的で良いと思いました。

と言っても Rails の場合は動的型付けで同じ `User` と認識すれば良いのですが、Swift の場合全くの別クラスとなってしまうので Swift 的な流儀としてどうなのでしょうか。
それをするくらいなら extension 生やせば？とも思うので、状況によって使い分けしていきたいです。

### おまけ: Decorator パターン

draper は [Decorator パターン](https://ja.wikipedia.org/wiki/Decorator_%E3%83%91%E3%82%BF%E3%83%BC%E3%83%B3) だという意見を見ましたが、新しいメソッドを生やすというのは Decorator パターンではないのでは？
Decorator パターンは継承をせずに再帰的に実行できるのが良いところで、新しいメソッドを生やすのは違うと思いました。

## 最後に

Classi 株式会社ではエンジニアを募集しています。
教育に興味ある人、ともに成長したい人来てくれ！！！頼む！！！

[日本の教育を変える！先生・生徒向けアプリを作るiOSエンジニア募集！ - Wantedly](https://www.wantedly.com/projects/43193)
IMEを使う（Android編）

# はじめに
IME APIシリーズ最終回です。
本日はAndroid編です。
ちなみにこれまでの記事は以下の通り。

- [IMEを使う（序章）](http://qiita.com/496_/items/774306112a81c152e167)
- [IMEを使う（Windows: IMM編）](http://qiita.com/496_/items/571be060c9586d8bbc52)
- [IMEを使う（Windows: TSF編）](http://qiita.com/496_/items/95acf68eaf31fd57f44e)
- [IMEを使う（Windows.UI.Text.Core編）](http://qiita.com/496_/items/a62563b22048755c236b)
- [IMEを使う（macOS編）](http://qiita.com/496_/items/4ad166f4104d0bb24e80)
- [IMEを使う（GTK+編）](http://qiita.com/496_/items/452f907c84bd9922050a)
- [IMEを使う（iOS編）](http://qiita.com/496_/items/d01b6dbd2ab98da1c18a)

# AndroidのIME API
AndroidのIME APIはぱっと見ではあまり大きな癖もなく、シンプルなものになっています。
ただ、どうやら深い闇の歴史を持っているようで、所々に謎の実装があり、それを表から直接扱えないようになっています（`/** @hide */`！）。
このため、どこまで自分で実装し、どこからをOSに任せるかという点については十分な調査が必要そうです。
それとTextEditクラスを自作する場合には、他のOSとは一味違った実装が必要です。

## `BaseInputConnection`
まず、AndroidのIME APIの中心は[`BaseInputConnection`](https://developer.android.com/reference/android/view/inputmethod/BaseInputConnection.html)です。
これは[`InputConnection`](https://developer.android.com/reference/android/view/inputmethod/InputConnection.html)を継承したクラスです。
本来ならインタフェースである`InputConnection`を継承したクラスを実装したいところですが、どうにも`BaseInputConnection`の実装を踏襲しないと破綻しそうな気がしており、`BaseInputConnection`を継承するのが良さそうに見えます。

## `Editable`
`BaseInputConnection`を継承すると問題になるのが、文字列クラスです。
`InputConnection`の実装なら独自の文字列クラスを直接扱えるのですが、残念なことに`BaseInputConnection`の内部では`Editable`を通して文字列を操作します。
そのため、`Editable`のインタフェースで独自の文字列クラスにアクセスできるようにする必要があります。
`Editable`は`CharSequence`, `GetChars`, `Spannable` (`Spanned`), `Appendable`を継承しており、それぞれ

- `CharSequence`, `GetChars`
    - 文字列へのアクセス
- `Spannable` (`Spanned`)
    - 文字列の選択範囲の管理
- `Appendable`
    - 文字列を末尾に追加するための関数
- `Editable`
    - 文字列を挿入・置換・削除するための関数
    - 入力文字列のフィルタの管理・適用

といったことが実装される必要があります。

## 最終的な実装方針

1. `BaseInputConnection`を継承したクラスを実装する
    - `Editable`を継承した文字列クラスを実装する
    - その文字列クラスのインスタンスを`public Editable getEditable()`で返す
        - IME APIで重要なテキストの取得や編集周りはほぼこれを返せば実装完了です
        - つまり、事実上`Editable`の実装です
    - ディスプレイ上の文字列レイアウト情報を返す
2. Viewを実装する
    - `public InputConnection onCreateInputConnection(EditorInfo outAttrs)`
        - `outAttrs`を適切に設定する
        - 実装したクラスのインスタンスを返す
    - `public boolean onCheckIsTextEditor()`でtrueを返す

# おわりに
8日間に渡るIME APIのお話はこれで終わりです。
Windows/macOS/GTK+についてはTATEditorの実装を通しての記憶を頼りに書きました。
一方、iOS/Android/UWPのIME APIは少し前にアプリ版のTATEditorをリリースするために最低限の挙動を確認する際に実装したコードに基づいて書きました。
様々なOSのIME APIを見てきましたが、IMEと適切にやり取りをしてくれるクロスプラットフォームなライブラリの設計は難しそうということがなんとなく感じ取ってもらえれば幸いです。
というのもIME APIがView、描画系、文字列クラスとそれなりの強度で結びついてしまっているためです。
（たぶんそんなライブラリが必要になる場面はほぼないと思いますが）

さて、明日から数日はTATEditorで使用しているライブラリの各OSでのビルド方法やざっくりとした使い方を紹介していきたいと思います。
auto-async-byte-compile & init-loaderでuse-package

はまったので。

[auto-async-byte-compile](https://github.com/tam17aki/auto-async-byte-compile/blob/master/auto-async-byte-compile.el)は便利なのですが、init-loaderで分割したinitfile(10-xxx.el)上で、use-packageを併用しているとうまくcompileされません。(正確には実行時にエラー）

[use-packageのREADME.md](https://github.com/jwiegley/use-package/blob/master/README.md)には
>use-package.el is no longer needed at runtime
This means you should put the following at the top of your Emacs, to further reduce load time:
(eval-when-compile
  (require 'use-package))

となっているので、仕様どおりの動作。とはいえ、分割したファイル全てに記載するのもいやなので、
悩んでいたのですが、auto-async-byte-compileのソースにoptionの記載があり、
解決しました。
>;; `auto-async-byte-compile-init-file'
>;; *Load this file when batch-byte-compile is running.
>;;default = "~/.emacs.d/initfuncs.el"

なので自分は、init.elに(eval-when-compile〜 を書いて

```el:init.el
(eval-when-compile
  (require 'use-package)
(require 'diminish)              
(require 'bind-key))             
```
```el:16-bc.el
(setq auto-async-byte-compile-init-file "~/.emacs.d/init.el")
```
としました。
init.elでなくてもいいような気もしますが、どっちにしろ先頭で読む必要があるので。
新規サービスを作った時のAndroidアプリの設計の変遷

この記事は [Supership株式会社 Advent Calendar 2016](http://qiita.com/advent-calendar/2016/supership)の16日目の記事になります。

Supershipの新規サービス開発室でSunnychat([iOS](https://itunes.apple.com/jp/app/sunnychat-chaohappinachatto/id1134862745?mt=8)|[Android](https://play.google.com/store/apps/details?id=space.amigo&hl=ja))というサービスのAndroid版を担当してます @rei-m です。[15日目](http://qiita.com/tanjo/items/3fd248b3302364e13958)は @tanjo さんによるSlackを監視するBotの話でした。

今回はSunnyChatのアプリの設計について開発開始から現在に至るまでの変遷について書いてみます。このアプリはこういう思想で作ったんだというくらいの雰囲気で見てもらえれば幸いです。

## 前提
- 新しいサービスの柱を作るという意志を持ったプロジェクトである(簡単には撤退しない)
- Androidエンジニアは2名体制。どちらもAndroid歴は浅め。
- 開発期間は僕が携わり始めたのが2015年の11月で、そこから1年くらいの間の話。

## フェーズ1: サービスの立ち上げ期
- とにかく急いでプロトタイプを動く形にする必要があり、中の作りはさておき実機で動かせることが優先。
- 結果としてマッチョなActivityとFragmentがいる、いわゆるSmartUIパターンな状態になる。
- 基本的にはアンチパターンではあるものの、新規サービス開発の初期フェーズでは要件やUIがふわふわしていて、素早いサイクルでプロトタイプを形にすることが優先されるため、設計についてはあまり頑張らない。

## フェーズ2: 初期リリース後
- メンテしやすいようにとにかくActivityとFragmentを薄くする方針で、Model層を作ってActivityとFragmentから複雑なロジックを分離。
- アプリの方向性ややりたいことが見えてきたので少しずつマッチョなコントローラを薄くしようとする。

## フェーズ3: 二次開発
- サービスの戦略にしたがって必要な機能を追加したり、既存の機能をブラッシュアップしていく時期。
- Presenter層を作って、ActivityとFragmentはViewの管理のみを責務とするようにした。PresenterはActivity/Fragmentからユーザーのイベントを受け取りModel層を操作する責務を負う。
- Model層については、アプリ内でそこそこ多い種類の情報をRealmに保存している事情からDDD的なアプローチでアプリのコンテキスト境界内でのドメインの複雑さの解消を試みている。

## フェーズ4: 軽めのピボット中（現在）
- 大きなピボットではないもののサービスの戦略が初期フェーズから変わる。結果、アプリの見た目は似ているが、データのリレーションは変化し、合わせて端末のRealmで管理していたキャッシュ戦略も変更。
- 引き続き継続してメンテしやすい作りになることを目的に、アプリの設計はPresenterとModel層の間にUsecase層を挟んで、Modelの操作はUsecase層で行うようにした。
- Model層については前のフェーズでDDD的なアプローチを取ったが、このフェーズでRealmに保存するデータの種類が少なくなり、アプリのコンテキスト境界内でDDDを採用するメリットが減ったので、やめて、代わりにUsecase層を挟んでそこが具体的なロジックを持つようにした。一部残ったデータについてはModelを永続化するところをそのままRepositoryとして使いまわしている。

## 現在のレイヤー毎の責務はこんな感じになった
- Activity/Fragment
    - Viewの管理
- Presenter
    - ユーザーのイベントや非同期で発生するイベントを管理、イベントに対応したUsecaseを呼び出す
- Usecase
    - Modelの操作、APIの呼び出しなどの具体的なロジックを書く。ローカルのドメイン層の情報とAPIでサーバーから取ってきた情報をいい感じにマージしてView用のModelに変換してPresentation層へ返す
- Domain
    - アプリのコンテキスト境界内で管理するドメインの定義
- Infrastracture
    - 通信部分やスキーマ(Realm)の定義など

## おわり
- 試行錯誤でしたが、こんな感じでフェーズ毎に作りを見直していくとこでレイヤーを区切り、責務を限定することで、メンテしやすい作りを目指しました。振り返ってみると場当たり的な対応だったような気がしなくもないですが、レイヤー毎の責務を明確にすることでどこに何を書くべきかというのがわかりやすくなったのかなと感じています。
- 反面、レイヤー毎の境界はインターフェースを通しているので、どうしても作るファイル数が多くなったのはやはり煩わしいですね。よりベターな作りを考え続けて、サービスの提供に寄与できるような設計を目指していきたいです。
- 今回の例は前提として、新しいサービスの柱を作るというプロジェクトで、そこそこの規模の仕様になる、といった感じの条件が揃っていたが故のアプローチです。万能な最強の設計みたいなものは存在しなく、アプリの仕様の複雑さやビジネス的な事情を考慮して、その時に応じた最適な仕様を考えていくとよいのではないでしょうか。

- あしたの担当は @knt45 さんです！よろしくおねがいしますー
オライリー風D言語くんを描く

#銅版画っぽい感じを目指す
目指すにあたり、動物に比べてD言語くんは平らな部分が多いため、ハッタリで描きこんでいってもあまりいい感じにならない。なので、3Dモデルにカケアミふうテクスチャを貼りつけ出力、それをレタッチする方法を思いついたのでやってみましょう。
####1)　去年の [例のgif](http://qiita.com/gobori/items/821e6d8219033c4f68a8) で使った3Dモデルの色を抜く。
![amikakeDman3_512.jpg](https://qiita-image-store.s3.amazonaws.com/0/100657/49399222-21e3-2e42-67c7-d4322647ade4.jpeg)


####2)　細かい格子のテクスチャを用意して貼ってみる
![amikakeDman2_512.jpg](https://qiita-image-store.s3.amazonaws.com/0/100657/3b9cbbd5-8cfe-8dc9-ed7c-10f67eb3167e.jpeg)


####3)　1枚目の陰影を頼りに2枚目の画像に手で描き込む
![oraiD_512.jpg](https://qiita-image-store.s3.amazonaws.com/0/100657/fadb8817-1aa4-f4f9-be33-9e7463492086.jpeg)


#できた?
![kansei.jpg](https://qiita-image-store.s3.amazonaws.com/0/100657/67f7c483-d2cf-5771-e6f2-87ff5a9bf504.jpeg)
ちょっと枠に絵をハミ出させるのがポイント。

#感想
広い範囲の均質なカケアミはハッタリでは描けないので、こういう手をつかってラクするのもアリですね。
CakePHP3でControllerのテストを書く

# CakePHP3でControllerのテストを書く

## そもそもなぜControllerのテストを書くか

私、正直テストコード書くの好きじゃないです。書かなくて済むなら書きたくない人(だって画面見てちゃんと確認すればいいじゃんの人)

勿論書くべきところは書きます。時と場合によるってやつですね。

で、割と大きめ~~(割とじゃねーなｗ)~~のプロジェクト(まだ開発中)で発生していることとして

- アクセス出来ちゃダメな画面(存在しないIDの詳細画面など)にURLで直で叩いたらアクセス出来てしまった
- 削除機能がgetでアクセス出来てしまった

なんてことがありまして、正直すべてのメソッドについて目視での網羅はどう考えても無理だと判断してControllerのテストを~~しょーがなく~~書くことにしました。

Controllerのテストは普通の大きくないプロジェクトじゃここまではやらないていいだろが私の意見です。

## Controllerテストの書き方

```php
<?php
namespace App\Test\TestCase\Controller;

use Cake\TestSuite\IntegrationTestCase;
class TopicsControllerTest extends IntegrationTestCase
{
    public $fixtures = [
        'app.topics'
    ];
    
    /**
     * Test view method
     */
    public function testView()
    {
        // IDなしはエラー
        $this->get('/topics/view');
        $this->assertResponseError();
        
        // 存在するデータはOK
        $this->get('/topics/view/1');
        $this->assertResponseOk();
        
        // 存在しないデータはOK
        $this->get('/topics/view/2');
        $this->assertResponseError();
    }
    
    /**
     * Test delete method
     */
    public function testDelete()
    {
        // getでのアクセスはエラー
        $this->get('/topics/delete/1');
        $this->assertResponseError();
        
        // IDなしはエラー
        $this->post('/topics/delete');
        $this->assertResponseError();
        // 存在するデータはOK(削除後リダイレクトするのでOkではなくSuccess)
        $this->post('/topics/delete/1');
        $this->assertResponseSuccess();
        
        // 存在しないデータはOK
        $this->post('/topics/delete/2');
        $this->assertResponseError();
        
        // postは第二引数に配列でpostデータを記載できます。
    }
}

```

まぁシンプルに書けます。

ログイン時など、セッションを使いたいときは

```php
<?php
namespace App\Test\TestCase\Controller;

use Cake\TestSuite\IntegrationTestCase;

class TopicsControllerTest extends IntegrationTestCase
{

    /**
     * setUp method
     */
    public function setUp()
    {
        parent::setUp();

        // id 1でログインしているものとする
        $result['id'] = 1;

        // セッションに突っ込む
        $this->session(['Auth' => [
            'Admin' => [
                $result
            ]
        ]]);
    }    
    // 以下略
}
```

みたいな感じでやってあげればOKです。

## requestをいじりたいとき

実際にURLを叩いているわけではないので、実際のリクエストからはパラメータが不足しています。

例えば実際にURLを叩いた際にはある`$this->request->webroot`というパラメータはControllerテストの際にはrequestには含まれません。

そういったパラメータが必要な場合は

```php
<?php
namespace App\Test\TestCase\Controller;

use Cake\TestSuite\IntegrationTestCase;

class TopicsControllerTest extends IntegrationTestCase
{

    /**
     * _buildRequest
     */
    protected function _buildRequest($url, $method, $data)
    {
        $request = parent::_buildRequest($url, $method, $data);
        $request->webroot = '/hoge/';
        return $request;
    }
    // 以下略
}
```

コア読んでそれっぽいのがあった。多分やっていいと思うんだけど・・・。

まぁテスト実行時にrequestをいじるのは可能ってことで。

## おまけ

テストコード書く際に、規模が大きくなってくるとFixtureで書いていると、MigrationとFixtureの二重管理とかなってつらたんなのでFixtureを使わずにMigrationを走らせたりしてます。

Seedsはテスト用のSeedsを別に準備するような感じですね。

その辺のmigration/Seedsセットが走るシェルを準備して`exec`でぶっ叩いてます。(やや手抜きw)

## まとめ

このくらいのテストなら、まぁ書けた。

でも、登録画面でpostした際の挙動とか書き始めると割とキリがない。

まだテストコードをどの辺まで書くべきなのかが個人的には見えてないなぁ・・・。(少なくとも盲目的に全部書くはやりたくない)
DROP SERIESでも実はSERIESが残っている

そんな気がする事象に出会いました。

influxdbで特定のdatabaseへ接続します。
(InfluxDBバージョン: 1.1.1)

`> INSERT treasures,captain_id=pirate_king value=2`
`> SELECT * FROM treasures`

```
name: treasures
time			captain_id	value
----			----------	-----
1481799497738729315	pirate_king	2
```

そして

`> INSERT treasures,captain_id=pirate_king value="2"`

```
ERR: {"error":"field type conflict: input field \"value\" on measurement \"treasures\" is type string, already exists as type float"}
```

型が違うということでエラーになります。ここまでは当然

`> SHOW SERIES`

```
key
---
treasures,captain_id=pirate_king
```

`> DROP SERIES FROM treasures`
`> SHOW SERIES`

で出力結果はなしです。

ただ、

`> INSERT treasures,captain_id=pirate_king value="2"`

```
ERR: {"error":"field type conflict: input field \"value\" on measurement \"treasures\" is type string, already exists as type float"}
```

why?

`> SHOW SERIES`

```
key
---
treasures,captain_id=pirate_king
```

しかし、`SELECT * FROM treasures`
何も出力されません。

該当のデータベースを削除して、作成し直すと
`> INSERT treasures,captain_id=pirate_king value="2"`
はもちろん成功します。

ただ今度は
`> INSERT treasures,captain_id=pirate_king value=2`

```
ERR: {"error":"field type conflict: input field \"value\" on measurement \"treasures\" is type float, already exists as type string"}
```

となります。

## RETENTION POLICY 
`CREATE RETENTION POLICY test1 ON ga_batch DURATION 1s REPLICATION 1`

```
ERR: retention policy duration must be at least 1h0m0s
```

ということですので、

`> CREATE RETENTION POLICY test1 ON ga_batch DURATION 1h REPLICATION 1`

でしばらく待ちます。

...
つづく
iOS開発で普段使っているツール

この記事はスマートテック・ベンチャーズのAdventCalender16日目の記事です。
大川がお送りします。

普段私がiOS開発で使っているツール、アプリについて簡単に紹介します。

##　ランチャー
### Alfred
![logo.png](https://qiita-image-store.s3.amazonaws.com/0/100329/16548faf-1e4b-f688-c93e-7c96282134fd.png)

https://www.alfredapp.com/

Command + Spaceに割り当てて使ってます。
アプリを切り替える時、Command + Tabではなく、Alfredから切り替えてます。

Xcodeの場合、「Command + Space →　Xキー入力　→ Enter」でXcodeに切り替わるので
Command + Tabよりもスムーズに切り替えることができます。

## キーボード、カーソル周り
### トラックパッド
最速にします。尺取り虫のようにカーソルを動かしている人を見るとイライラします。
![トラックパッド.jpg](https://qiita-image-store.s3.amazonaws.com/0/100329/e15532f1-3fde-8f88-f564-179916d7c5de.jpeg)

### Karabiner
![karabiner-icon@2x.png](https://qiita-image-store.s3.amazonaws.com/0/100329/e0e13b7e-60a0-0a5a-a783-44a78e99f431.png)

https://pqrs.org/osx/karabiner/index.html.ja

キーリピートを 150の10 くらいにします。
![Karabiner Preferences.jpg](https://qiita-image-store.s3.amazonaws.com/0/100329/b23132e5-f61a-5697-d9b5-4822ce91c4fc.jpeg)

vimのカーソル移動がめっちゃラクになります。

## コンソール
### iTerm2
![iTerm2 - macOS Terminal Replacement.jpg](https://qiita-image-store.s3.amazonaws.com/0/100329/60990d81-d70b-cd5f-7071-e02e87643ab7.jpeg)

https://www.iterm2.com/

半透明にしてフォントをRitcyやMonacoにするとそれっぽさが出ます。
![iter-1.jpg](https://qiita-image-store.s3.amazonaws.com/0/100329/7dff495d-6d0a-665f-602e-cfe2d731012a.jpeg)

iTerm2の一番の利点は、 **　範囲指定すると自動でクリップボードにコピーされている**　ことです。
騙されたと思って git branch してからブランチ名をダブルクリックした後、
Command + Vを押してご覧なさい。

## コミュニケーション
### Fluid
![fluid_logo_icon.png](https://qiita-image-store.s3.amazonaws.com/0/100329/f869370b-4f76-d87c-ef36-0957710caf3c.png)

http://fluidapp.com/
を紹介するつもりでしたが、チャットワークのMacクライアントがすでに出てたので割愛します。

## エディタ
### SublimeText２
![sublime-text-2.png](https://qiita-image-store.s3.amazonaws.com/0/100329/0d4ddb32-dfe9-55c0-bffb-a819c4d9a3d3.png)

https://sublimetext.com/2
XMLの編集などにも使います。

## 画像
### Skitch
![ダウンロード.jpeg](https://qiita-image-store.s3.amazonaws.com/0/100329/7d31da7f-a7c9-9d32-d136-d6a7f071c65e.jpeg)

キャプチャツールです。最新版じゃなくて1.10.12を使ってます。
http://www.oldversion.jp/mac/skitch/

![スクリーンショット 2016-12-15 19.11.41.jpg](https://qiita-image-store.s3.amazonaws.com/0/100329/589c77c7-8723-cbd7-20ce-e35575f8d2df.jpeg)


後述するプレビューとのコンボで威力を発揮します。

### プレビュー
魔法の棒を使って背景を簡単に透過できます。モック用の素材なんかは簡単に自作できちゃいます。

下記のような豆腐のpng画像の背景を透過させたいとします。
![牛脂のイラスト | かわいいフリー素材集 いらすとや-1.jpg](https://qiita-image-store.s3.amazonaws.com/0/100329/2f289422-a9e6-0fbe-7fbb-baab6d3acb37.jpeg)

プレビューで開き、ツールボックス、魔法の棒の順に選択し
豆腐の周りをひとナデします。
![スクリーンショット 2016-12-15 19.19.55.jpg](https://qiita-image-store.s3.amazonaws.com/0/100329/70441617-ab10-517b-41ea-f2f3752f0a7d.jpeg)

周囲が赤くなったらdeleteボタンを押すと、綺麗に背景が透過されます！！
![tofu.jpg](https://qiita-image-store.s3.amazonaws.com/0/100329/fe86d8bd-2f11-8a11-2560-dffd9670178a.jpeg)

#　まとめ
参考になれば幸いです！！

他にも かなキーをエンターにして　英数キーを文字入力切り替えのトグルにするとか
あるんですがマニアックなので省略します。

Google日本語入力も必須でしたけど割愛します。

プリンタのインク切れてるのでVipRiserも便利なんですが
iOS開発とはあんまり関係ないので省略します。

明日は@EnoMtさんが担当されます！お楽しみに＾＾
BaseAudioContextがきた

もう一年も前になりますが[Web Audio APIの仕様（2015-12-08）](https://www.w3.org/TR/2015/WD-webaudio-20151208/)にBaseAudioContextの項目が追加されました。経緯などはこのあたりが参考になります。

- https://github.com/WebAudio/web-audio-api/issues/308
- https://github.com/WebAudio/web-audio-api/issues/1022
- https://github.com/WebAudio/web-audio-api/issues/1060

従来の継承関係ではリアルタイムレンダリングのAudioContextとオフラインレンダリングのOfflineAudioContextの差異を表現できない。そのため共通部分をBaseAudioContextとして定義し直して、継承関係を整理する。いわゆる破壊的変更だけど影響は少ないだろう。という感じ。

この記事では変更によってどのような影響があるのかを説明します。

## 変更点
- OfflineAudioContextはAudioContextのサブクラスではなくなった
- 共通のスーパークラスとして新しくBaseAudioContextが定義された

### 更新前の継承ツリー

![audio-context](https://qiita-image-store.s3.amazonaws.com/0/2568/6d15e7b9-b9f5-df9f-37d4-f835ab289150.png)

### 更新後の継承ツリー
![base-audio-context](https://qiita-image-store.s3.amazonaws.com/0/2568/cd860763-9aca-1154-aa1c-47c8d7de7a67.png)

## 実装状況
Chrome55はすでにBaseAudioContextを使った実装になっています。Firefox50やSafari10はまだ未対応。Edgeは未確認。（どなたか教えてください:pray:）

## 影響
普通に使っている分にはおそらく影響はありません。ただし、モンキーパッチやポリフィルを使っている場合には対応が必要な場合があります。問題になるケースを書きます。

### 1. OfflineAudioContextがAudioContextのサブクラスでなくなる
次のようなコードはBaseAudioContextの対応状況によって`true`になったり`false`になったりします。こういうコードの必要性をあまり感じないし見たこともないけど、TypeScriptとかだと困ることがあるのかも知れません。

```js
const context = new OfflineAudioContext(2, 44100 * 10, 44100);

assert(context instanceof AudioContext);
```

#### 対処方法
どちらかであれば`true`を返す関数を用意する。

```js
var AudioContext = window.AudioContext || window.webkitAudioContext;
var OfflineAudioContext = window.OfflineAudioContext || window.webkitOfflineAudioContext;

function isAudioContext(context) {
  return (!!AudioContext && context instanceof AudioContext) || (!!OfflineAudioContext && context instanceof OfflineAudioContext);
}
```

#### npmモジュール
https://github.com/mohayonao/is-audio-context

### 2. AudioContext.prototype.hasOwnProertyが壊れる
モンキーパッチなんかで使われるコードが原因でエラーを引き起こす可能性があります。例えば、次のようなコードで`createGain()`がBaseAudioContextで定義されていると条件式が`false`となりオーディオコンテキストが壊れます。もしくは、AudioContextの拡張がOfflineAudioContextに反映されないというのが考えられます。

```js
if (!AudioContext.prototype.hasOwnProperty('createGain'))
  AudioContext.prototype.createGain = AudioContext.prototype.createGainNode;
```

#### 対処方法
古いモンキーパッチを使っている場合は、今はまず必要ないので使うのをやめれば良いと思います。それ以外でAudioContextの拡張を行なっている場合は、`AudioContext.prototype`を使わずに`BaseAudioContext.prototype`を使うようにします。ただし、Chrome55の実装では`window.BaseAudioContext`が定義されていないので、次の方法で取得する必要があります。

```js
var AudioContext = window.AudioContext || window.webkitAudioContext;
var OfflineAudioContext = window.OfflineAudioContext || window.webkitOfflineAudioContext;

var BaseAudioContext = window.BaseAudioContext || (
  typeof OfflineAudioContext === "function" ? Object.getPrototypeOf(OfflineAudioContext) : AudioContext
);
```

#### npmモジュール
https://github.com/mohayonao/base-audio-context

## おわり
というわけで、新しく定義されたBaseAudioContextとその変更の影響についてまとめました。

それでは良いウェブオーディオライフを！:santa::santa::santa:

## 参考
[Web Audio API (日本語訳) 2.1 BaseAudioContext インターフェース](http://g200kg.github.io/web-audio-api-ja/#BaseAudioContext)

おかしな部分や不明な点があれば気軽にコメントしてください。
Visual Studio CodeでPolymer

##はじめに

これは[Visual Studio Code AdventCalendar](http://qiita.com/advent-calendar/2016/vscode)の16日目です。

VSCode触り始めて半年ちょっとほどです。
Angular2/TypeScriptでさくさく書けていたVSCodeを、Polymerでも使いたく調べてみました。
（ただAngular2/TypeScriptは密接にVSCodeと対応していると[この間](https://cordova.connpass.com/event/45511/)聞いてきたので、同じさくさく感は得られなさそうです…）

本記事の対象バージョン

* Visual Studio Code version1.8
* Polymer version1.7

#Extensions
下記を一通り入れてみて、感触をみてみました。

##[Polymer Snippets](https://marketplace.visualstudio.com/items?itemName=chimon2000.polymer-snippets)
主にTemplate周りのSnippet。
ElementCatalogとの親和性が高いです。

##[Polymer Syntax](https://marketplace.visualstudio.com/items?itemName=jonwolfe.language-polymer)
Polymerなところをハイライト表示してくれます。
ユーザー設定に

```json
"files.associations": {
    "*.html": "polymer"
}
```

を記載すると良い感じにハイライトが適用されますが、
言語コード：HTMLではなくなるので、言語コード：HTMLに依存する機能（URLジャンプなどなど）が使えなくなる弊害が少なくないかもしれません。

##[polymer-ide](https://marketplace.visualstudio.com/items?itemName=polymer.polymer-ide)
カスタムエレメントへのジャンプ、属性の先読みなど。
Windowsでは使えないみたい。（ジャンプ先の参照先がおかしくなってる？）

##User Snippets
※Polymerというより、HTMLファイルにscriptタグを定義して
JavaScriptをごりごり書いていく場合に有用な手法かもしれません。

Polymerの記法としてHTML内にscript,styleタグを記載しそれぞれを定義していきます。
VSCodeでは１ファイル内の言語コードは１つと決まっているため、デフォルトでのPolymerのカスタムエレメントは
言語コード：HTMLとして認識されます。
~~そのため、scriptタグ内に記載したJavaScriptのインテリセンスが効かない事象が発生しています。~~
~~（対応する気配：[JS intellisense doesnt work in HTML script tag · Issue #4369 · Microsoft/vscode](https://github.com/Microsoft/vscode/issues/4369)）~~
昨日（12/15）リリースされたversion1.8でHTML内JavaScriptのインテリセンスが対応されました🎉🎉👏👏
[Visual Studio Code November 2016 -JavaScript language support in HTML](https://code.visualstudio.com/updates#_javascript-language-support-in-html)

※styleタグ内はversion1.7よりインテリセンスが効くようになりました。
[Visual Studio Code October 2016 1.7　-CSS completions in HTML](https://code.visualstudio.com/updates/v1_7#_css-completions-in-html)

---

HTMLのUserSnippetsにJavaScriptやPolymerのSnippetを設定しておくことで、インテリセンスライクな動きをしてくれます。
定義内に$nと記載したところには、Tabで順番に移動できます。
UserSnippetsの詳しい解説：[Snippets in Visual Studio Code](https://code.visualstudio.com/Docs/customization/userdefinedsnippets)

example:

```js
"Print to function": {
    "prefix": "function",
    "body": [
        "$1: function() {",
        "},"
    ],
    "description": "Create Polymer New Function"
},
```

```js
"Print to property": {
    "prefix": "property",
    "body": [
        "$1: {",
        "	type:$2,",
        "	notify: true,",
        "	value: $3",
        "},"
    ],
    "description": "Create Polymer New Property"
}
```

##おわりに
チーム内ではインテリセンス、GUIからAdobe Bracketsを選択するユーザーが多いです。
ですが、コマンド入力に慣れれば軽量感のあるVSCodeも悪くないと思っています！

本当はPolymerなExtensionの作成までやってみたかったのですが、
Polymer2.xに移行する予定があるようなので移行後にやってみます。
第４回 Web API を利用するには？ ～EAIツール編：DataSpider, ASTERIA～

#はじめに
[前回](https://qiita.com/drafts/a6cc98d4a3fb2c051136)は「第３回 Web API を利用するには？ ～ノンコーディング編：Microsoft Flow, Azure Logic Apps～」を書かせていただきました。

今回もノンコーディングで処理フローが作成できるものですが、エンタープライズ向けの製品になります。
一般的には EAI (Enterprise Aapplication Integration) ツールと呼ばれるものです。

EAI ツールとは - 情報マネジメント用語辞典
http://www.itmedia.co.jp/im/articles/0308/09/news003.html

- 株式会社アプレッソ DataSpider Servista ( https://www.appresso.com/servista/ )
- インフォテリア株式会社 ASTERIA WARP ( https://www.infoteria.com/jp/asteria )

どちらも数百万円～という製品で、一般的には SIer さんが案件で使用したり、企業の情報システム部門などが、内製化の為に使用したりするケースが多いようです。

製品コンセプトはそれぞれ以下の通りです。

##DataSpider Servista##
![DataSpiderServista.PNG](https://qiita-image-store.s3.amazonaws.com/0/152946/394301c7-ac51-2eaf-0baa-539a9d8b20bc.png)

##ASTERIA WARP##
![ASTERIA.PNG](https://qiita-image-store.s3.amazonaws.com/0/152946/3f0d3ab6-690a-8708-7e90-fae4fa7d9b06.png)

共通しているのは、それぞれ繋ぎたいサービスや製品用のアダプタを備えていて、ドラッグ＆ドロップでプロパティを設定し、繋いでいくことでフローを作成します。従って、開発者に限らず、少しでも IT に明るい方であれば、処理フローが作成でき、ルーティンワークを自動化できます。もちろん Web API 以外の各種 DB や FTP、ファイル、フォルダ、HTTP、サードパーティー製の各製品向けのアダプタも用意されているので、様々なデータを連携して、独自にデータを管理することもできます。

[DataSpider Servista 接続先一覧]
https://www.appresso.com/servista/product/index.html
[ASTERIA WARP アダプター一覧]
https://www.infoteria.com/jp/warp/feature/option_all/

また、両方とも Java で開発されている製品で、SDK が公開されているので、自分でアダプターを開発して、独自の接続先を作成することも可能です。

#IFTTT や Microsoft Flow (Logic Apps) との違い
IFTTT や Microsoft Flow (Logic Apps) と比較すると、ノンコーディングで処理フローが作成できるところは同様なのですが、基本的に自分でサーバーを用意して、製品をインストールする必要があります。サーバーを用意して、インストールするので、より詳細にログを残したり、ローカルにファイルを保持する等、大規模システム向けの System Integration には向いていると言えます。

| サービス | サーバー | 複雑な処理 | ログを残す |
|:-:|:-:|:-:|:-:|
| IFTTT  | 不要 | × | ×(※１) |
| MS Flow (Logic Apps)  | 不要(※２) | △ | ×(※１) |
| DataSpider / ASTERIA WARP  | 必要 | 〇 | 〇 |

※１：サービス側で自動でログが残されているので、正常終了/異常終了といったアクセスログは確認可能
※２：実際には Azure 内でサーバーが建てられているが、意識する必要はないし、スペック以外は操作不可

簡単にまとめると上記のような感じになるので、用途に応じて、選んでいただければと思います。
なお、冒頭にも書いたように、やはり数百万円の価格になりますので、両製品とも体験版（評価版）が用意されています。

[DataSpider Servista - 体験版・評価版のご案内]
https://www.appresso.com/trial/
[ASTERIA WARP - ASTERIA 無料体験版のお申込み]
https://www.infoteria.com/jp/contact/asteria/trial/

ご興味ある方は上記から申し込んでみてください！
#まとめ
今回はこのくらいの紹介で終了です。第２回から今回の第４回まで「ノンコーディング」をキーワードに書かせていただきました。Web API を使用するのにコーディングをしなくてももはや十分だということは、お分かりいただけたかと思います。

さて、最終回となる次回は「Web API を使用するに当たって、どんなときにコーディングが必要となるのか？」をテーマにします。

ノンコーディングをテーマにずっと書いてきましたが、ならば逆にどういったときにコーディングが必要になるのか。これを語らずして、締めくくることはできません。

というわけで、次回 12月22日（木）をお楽しみに！！
意外と敷居が高いらしい - スクリプトトリガ - OnFirstWindowOpenとOnLastWindowClose

はい、今日は、[AdventCalendar 2016 FileMaker Tips](https://qiita.com/advent-calendar/2016/filemaker-tips/) 12/16の記事です。

今回は、スクリプトトリガの[OnFirstWindowOpen](https://www.filemaker.com/help/14/fmp/ja/html/script_trigg.36.22.html#433551)と[OnLastWindowClose](https://www.filemaker.com/help/14/fmp/ja/html/script_trigg.36.23.html#433597)です。


まずは、動作確認です。
https://youtu.be/hsZKW89vk4c

ファイルを開いた時と、ファイルを閉じた時に、履歴ファイルにレコードを書き込んでいます。
この設定場所は、
ファイル＞ファイルオプション＞スクリプトトリガ
になります。
フィールドの設定とは違いますので、お気をつけくださいね。

まずは、OnFirstWindowOpenの設定です。
![スクリーンショット 2016-12-14 16.02.07.png](https://qiita-image-store.s3.amazonaws.com/0/60538/66c60b2a-caa8-ea51-e8c4-d92b35cd85f7.png)
履歴ファイルに「ファイルオープン」したのは、いつで、誰が行ったかを記録しています。

OnLastWindowCloseは、履歴ファイルに「ファイルクローズ」したのは、いつで、誰が行ったかを記録しています。
![スクリーンショット 2016-12-14 16.02.25.png](https://qiita-image-store.s3.amazonaws.com/0/60538/b27b3c81-9fad-2144-307c-fc504ea6967d.png)

そのほか、ファイルがオープン・クローズした時として、アカウントチェックや必要な機器がオンになっているか、など、実際にファイルの中身を触る前や終わった時の後片付けとして組み込めます。

ファイル全体の前後処理として活用してみてくださいね！
Isolation Levelの階層

ACIDの中でIsolationは特に蔑ろにされがち、と昨日の記事に書いたが具体的にどのように蔑ろにされるかについて詳しく説明する。

## ANSI規格

米国国家規格協会、いわゆるANSIではトランザクションの分離レベルが4つ定められている。

- READ UNCOMMITTED: 未コミットの値を読む事がある(Dirty Read Anomaly)
- READ COMMITTED: コミット済みの値しか読まないが、1つのトランザクションの中で複数回同じ値を読みにいった時に外のトランザクションによって更新された最新の値を読んでしまって一致しない事がある（Non-Repeatable Read Anomaly)。また、読んだ値に後から書き込む際に他のトランザクションによって更新された値であっても更にその上から上書きしてしまい過去の更新が消失する(Lost Update Anomaly)。また、2つの値を読む際に1つめを読んだ直後に別のトランザクションによって両方の値が書き換えられても、そのまま2つめの値を読んでしまう(Inconsistent Read AnomalyもしくはRead Skew Anomalyとも言う)
- REPEATABLE READ: トランザクション内で一度読んだ値を再度読む際も同じ値であることが保証されるが、範囲検索を2回行った時に、1度目のスキャンの後に新たに挿入された値を2度目のスキャンで発見することがある（Phantom Read Anomay)
- SERIALIZABLE: 上記のAnomalyがすべて起きない

ここまではそこら辺でググっても日本語の情報が豊富に見つかるので大して意外性はない。
図に包含関係をまとめて、個々の丸の中に発生しうるAnomalyを記述するとこうなる。

![anomaly.png](https://qiita-image-store.s3.amazonaws.com/0/1716/9cee40b5-85ab-2024-ef1d-66e90e5af04d.png)

歴史上の話を調べてみると、ANSIのこの分離レベルは制定当初**2 Phase Lock**が基本だった時代背景があり、それでは遅すぎるから**2PL**を緩和する方向で策定したようである。
そういう観点で見るとこの4レベルからは意図されたLockのプロトコルが透けて見える。

- READ UNCOMMITTED: Write時のWrite-LockだけS2PLを守って獲得・解放する。Readに際して一切ロックを取らない、Write-Lockが取られている値も平気でReadする(Write同士しか並行制御しない)
- READ COMMITTED: Write時のWrite-LockだけS2PLを守って獲得・解放する。Read-LockはRead操作1つごとに獲得するが即解放を行ってよい。
- REPEATABLE READ: Read/Write両方でS2PLを守って獲得・解放する。
- SERIALIZABLE: Read/Write両方と更に範囲検索に対してはGap Lockを取る。

当然、ロックプロトコルの設計は実装者の手に委ねられているが、仕様をよく読むと意図された実装が透けて見えるのはありがちな話である。

## Snapshot Isolation

上に書いた分離レベルの他にアカデミックな分野から出てきた分離レベルが**Snapshot Isolation**である。
実装としてはMulti Version Concurrency Control(MVCC)にタイムスタンプでの制約を加えて云々というのが一般的のようだが詳細は様々ある。
このIsolation Levelでは**Write Skew Anomaly**と**Read Only Anomaly**が発生する一方で、**Phantom Read Anomaly**は発生しない。

つまり、階層関係を整理した図に書くならこのようになる

![anomaly2.png](https://qiita-image-store.s3.amazonaws.com/0/1716/724d2ef0-e555-4617-29bd-abfed6da469f.png)

どちらもREAD COMMITTEDより強いが、相互に起きるAnomalyが違うので、完全な包含関係になってはいない。このあたりの話はHal Berensonらの[A Critique of ANSI SQL Isolation Levels](https://www.microsoft.com/en-us/research/publication/a-critique-of-ansi-sql-isolation-levels/)の中にまとまっている。

少しおもしろいのが、このANSI規格での**SERIALIZABLE**とは、このアドベントカレンダーの冒頭あたりで説明した**Serializable**と別物であり「REPEATABLE READの上で更にPhantom Readが起きないならSERIALIZABLE」と定義されているため、ANSI規格では**Snapshot Isolation**はPhantomが起きないゆえに**SERIALIZABLEである**。OracleDBのいう**SERIALIZABLE**はANSI規格の**SERIALIZABLE**で実質は**Snapshot Isolation**である。
一方でMySQLでは**REPEATABLE READ**であってもファントムリードは発生しない実装になっているらしいのでその基準では**SERIALIZABLE**と呼びうる。
つまり、実装・規格・アカデミックのそれぞれで言葉が一緒でも分類が違うので、これらの用語を使う際にはよく注意しないといけない。

調べてみると[Web開発者が知っておくべき八つの分離レベル](https://www.infoq.com/jp/articles/eight-isolation-levels)等でより多くの分離レベルについて議論されているがここの解像度を深追いしてもややしょうがないような気がしている。

個々のAnomalyに関しては今日の記事では深い言及をしなかったが、そこは明日書く。
オセロを作ろう(素人編、途中段階)

この記事は<a href="http://qiita.com/advent-calendar/2016/slp_kbit">SLP KBIT Advent Calendar 2016</a>の16日目の記事です。

<h1>はじめに</h1>
今までの方々はなんかいろいろ技術的なことや作ってみたなど言っていますが正直


![後輩ちゃん.png](https://qiita-image-store.s3.amazonaws.com/0/151998/c95ab5bd-7d09-de91-3c1c-9e39f995fdc9.png)



なので、今活動でやっているオセロ作りについてはじめの段階だけですが書いてみようかと思います(素人なりに)

<h2>初期盤面を表示する</h2>
コマンドプロンプト上に作っていくわけですがオセロといえば、
![オセロ2.jpg](https://qiita-image-store.s3.amazonaws.com/0/151998/9d8e8872-a292-dd9d-474f-60187f49515a.jpeg)
こんな感じをまず想像しますよね

で、

```c

void brd_output(int brd[8][8]) {
    
    int i, j;
    
    for(i = 0; i < 8; i++){
        for(j = 0; j < 8; j++){
            switch(brd[i][j]){
                case 0 : printf("・"); break;
                case 1 : printf("〇"); break;
                case -1 : printf("●"); break;
            }
        }
        printf("\n");
    }
}

int main(void) {
    int arr[8][8] = { {0,0,0,0,0,0,0,0},
                      {0,0,0,0,0,0,0,0},
                      {0,0,0,0,0,0,0,0},
                      {0,0,0,-1,1,0,0,0},
                      {0,0,0,1,-1,0,0,0},
                      {0,0,0,0,0,0,0,0},
                      {0,0,0,0,0,0,0,0},
                      {0,0,0,0,0,0,0,0}};
    
    brd_output(arr);
    
    return 0;

}
```
はいこんな感じです

これを出力してみよう！

![オセロ3.png](https://qiita-image-store.s3.amazonaws.com/0/151998/827026cd-acda-f818-8bfe-d38063bdaa7d.png)

よし！
まあこれじゃあ見づらいのでマスを追加して
![オセロ1.png](https://qiita-image-store.s3.amazonaws.com/0/151998/f90d88cc-8f8a-66ce-b6ed-b06c19a306ab.png)
おっ、結構いい感じ
だけど二次元配列のとこ長いなぁ

で、先輩に教えてもらいました

```c
void init(void)
{
    int i, j;
    
    for(i = 0; i < SIZE; i++){
        for(j = 0; j < SIZE; j++){
            cell[i][j] = ・;
        }
    }
    
    cell[3][3] = cell[4][4] = ○;
    cell[3][4] = cell[4][3] = ●;
}
```
おー、これは簡単(^^♪
初期盤面は完成かな

<h2>コマの出力</h2>
先に言っとくと今回はこれができたら終わります
~~あとはまだ教えてもらってないし~~、~~そろそろ長さもいいだろうし~~
ではここではとりあえず枠内か枠外か(つまり打てるか打てないか)を出そうと思います

```c

void input(void)
{
    int x, y;
    
    while(1)
    {
        printf("X > "); scanf("%d", &x); x--;
        printf("Y > "); scanf("%d", &y); y--;
        
        if (x >= 0 && x < 8 && y >= 0 && y < 8)
        {
            cell[y][x] = ●; break;
        }
        printf("そこには置けません(ΦωΦ)\n");
    }
}
```
出力判定を置き、1~8のときは黒のコマを、それ以外は打ち直しさせるプログラムです(なお盤面内ならどこでもいいため白のコマのところにもry)

![オセロ4.png](https://qiita-image-store.s3.amazonaws.com/0/151998/aa51ab9f-fa0f-8952-528c-ca4b30de60a0.png)

実行結果がこちら
ひっくり返る処理はまだ入れていませんのでただ黒のコマが出るだけですが、できました。
が、まだまだ先は長そうです…

<h2>最後に</h2>
まだまだできないことが多いですが、教えてもらって最後まで作り上げたいと思います。

ではでは

![以上！！.jpg](https://qiita-image-store.s3.amazonaws.com/0/151998/d697598f-fa05-dcaf-7af3-9b21c2f646da.jpeg)
Dockerコンテナに環境変数を渡す

# やりたいこと
コンテナにAWSのアクセスキーIDと秘密アクセスキーを渡したい

# 直接runするとき
`docker run -e AWS_ACCESS_KEY_ID=xxxx -e AWS_SECRET_ACCESS_KEY=yyyy [tag]`

# composeファイルに書くとき

```yaml
environment:
    - AWS_ACCESS_KEY_ID: xxxx
    - AWS_SECRET_ACCESS_KEY: yyyy
```

とかする

# ファイルに埋めたくないとき

```yaml
environment:
    - AWS_ACCESS_KEY_ID
    - AWS_SECRET_ACCESS_KEY
```

ってやっておくとホストの環境変数が参照されるようなのでこちらがベターでしょう。
UE4のPlanar Reflection（平面反射）について

この記事は[裏UE4 Advecnt Calender 2016](http://qiita.com/advent-calendar/2016/ue4_inside)の16日目の記事になります。

UE4.12で実装されたPlanar Reflectionを自作プロジェクトで使ってみて、
その時分かったことや使い方についてまとめました。
今更な内容かもしれませんが、おさらいだと思って見ていただけると幸いです。
##使ってみました
Screen Space Reflectionでもまあまあきれいなんですが、
いまいち満足いかないのでPlanar Reflectionを試してみました。
![PR.jpg](https://qiita-image-store.s3.amazonaws.com/0/149393/79fcf45d-66eb-7e68-6e1d-25ad671b0cd7.jpeg)
きれいですね。
ビジュアルは文句ないです。
(水面はノーマルマップで歪ませてます。)

このプロジェクトは映像にしてYouTubeに上げています。
https://youtu.be/iJfnwQAZmBs
いつの間にかEPICさんにチラッと紹介していただいてました。
<blockquote class="twitter-tweet" data-lang="ja"><p lang="en" dir="ltr">We love sharing your amazing <a href="https://twitter.com/hashtag/UE4?src=hash">#UE4</a> projects! Here are the latest. Show us what you&#39;re working on using <a href="https://twitter.com/hashtag/EpicFriday?src=hash">#EpicFriday</a>! <a href="https://t.co/QA2wuGEhyh">pic.twitter.com/QA2wuGEhyh</a></p>&mdash; Unreal Engine (@UnrealEngine) <a href="https://twitter.com/UnrealEngine/status/802180067962933248">2016年11月25日</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

##実装
まず設定でPlanar reflectionを有効にする必要があります。
![RC.jpg](https://qiita-image-store.s3.amazonaws.com/0/149393/4b8ed51f-50de-3669-dbbc-775c52b7fdcd.jpeg)
プロジェクト設定>Rendering>Lighting>Support Global Clip Plane for Planar Reflectionsにチェックします。
※バージョンによって微妙に違うみたいです。
再起動してねって言われるのでします。

使い方はReflection Captureと似たような感じ。
モードタブから配置>ビジュアルエフェクト>Planar Reflection（平面反射）をレベルに配置します。
![cap_3.jpg](https://qiita-image-store.s3.amazonaws.com/0/149393/1ca05abe-be86-ca5b-14dc-9c5047af672f.jpeg)

でっかい鏡のような板が出てきます。
平面反射させたいオブジェクトの面（今回の場合は水面）になるべくピッタリ配置します。
スケーリングや回転もできるので、オブジェクトに合わせて大きさと角度を調節します。
Gキーでゲームモードにするか、Planar Reflectionの詳細タブでShow Preview Planeのチェックを外すと、でっかい鏡が消えて対象のオブジェクトに反射が反映されているのがわかると思います。

##パラメータ

以下は自分で検証した結果こういうことかな？って結論に至った内容です。
間違ってるよってのがあったら教えてください。

### Normal Distortion Strength
ノーマルの強度を調節できます。波一つない水面にしてみたり。

### Prefilter Roughness
低解像度のテクスチャをごまかすのに使うらしいです。
値を上げると反射がぼやけた感じになります。
### Distance from Plane Fade Start,End と Angle from Plane Fade Start,End
この4つのパラメータ、要は距離や角度を指定して平面反射の影響範囲を変えられるみたいです。
表示モードを反射にすると影響範囲が分かりやすいです。
![cap_5.jpg](https://qiita-image-store.s3.amazonaws.com/0/149393/092c99de-ae6b-17d9-ac9e-38be64708148.jpeg)
実際に反射するのはRoughnessが低く設定されているマテリアルだけなので、画像の影響範囲大の場合でも岩や地面まで反射するわけではないようです。

### Prefilter Roughness Distance
Prefilter Roughnessが適応される距離。
値0は全ての距離で。値を大きくすると反射面から離れた箇所から適応されます。
### Screen Percentage
反射結果の解像度を調節します。値を下げれば多少負荷を抑えられます。
### Extra FOV
ノーマルマップで反射面を歪めるとエッジ部分にリークが発生する場合があります。
それを誤魔化すために反射側のFOVをいじれるみたいです。

### Render Scene Two Sided
説明が難しいんですが・・・
チェックを入れると、反射するオブジェクトが自身の裏面を反射するようになります。
こちらもノーマルマップの歪みによってリークが発生した場合に使うようです。

##問題点
もちろん高負荷で、映りこみの情報量が多いと倍以上の負荷がかかることも。
映像向けかもしれませんね。


以上です。
こういうのを書くのは初めてなので、分かりにくい点や間違った点などあると思うので
何かありましたら教えてください。

明日は[シモダさん](http://qiita.com/junyash)による「裏的なナニカ」です。
Vim 8.0 Advent Calendar 16 日目 新しい Ex コマンド

この記事は [Vim 8.0 Advent Calendar](http://qiita.com/advent-calendar/2016/vim8) の 16 日目の記事です。

Vim 8.0 で利用できる新しい Ex コマンドのうち、まだ紹介していないものを紹介します。

## `:filter[!] {pat} {command}`

`{command}` の出力のうち、`{pat}` で指定した正規表現にマッチする行だけを表示します。`[!]` を指定すると、逆にマッチしない行だけを表示します。
`{pat}` は `/foo/` のように `/` などの記号で囲われた形式です。ただし、パターンが記号などを含まない場合は `/` は省略できます。

以下に使用例を挙げます。

```vim
" マークを記録してあるファイルのうち、.txt で終わるものを表示します。
filter /\.txt$/ oldfiles
" 読み込まれた Vim script のうち、パスに vimrc を含むものを表示します。
filter vimrc scriptnames
" 開かれているバッファのうち、.vim を含むものを表示します。
filter /\.vim/ buffers
" キーマッピングのどこかに <C-r> を含むものを表示します。
execute "filter /\<C-r>/ map"
" 現在のバッファから、foo を含む行を表示します。
filter foo %print
" ↑の例は :global でも実現できます。
global/foo/print
```

最後に注意点として、この Ex コマンドは全ての出力をフィルタするわけではありません。例えば、`:echo` の結果はフィルタされません。

## `:keeppatterns {command}`

検索履歴に手を加えずに `{command}` を実行します。
`:substitute` (`:s///`) や `:global` などの一部の Ex コマンドは、通常は Vim script 中で使った場合でもパターンが検索履歴に追加されてしまいます。これはプラグインの中などで使う場合に問題になります。
そこでこの `:keeppatterns` Ex コマンドを使って `:keeppatterns global/.../` などのようにすることで、検索履歴が変更されてしまうのを防ぐことができます。

これは `{command}` の実行中はずっと手を加えないということではなく、直接指定した Ex コマンドが検索を使うものだった場合だけ有効です。つまり以下の場合は、検索履歴は変更されてしまいます。

```vim
" :execute を挟む
keeppatterns execute "s/\<CR>//ge"

" 関数経由
function! s:work() abort
  s/\e//ge
endfunction

keeppatterns call s:work()
```

## `:noswapfile {command}`

`{command}` を実行します。このとき、新しいバッファが開かれた場合はスワップファイルを作成しません。
これはプラグインが仮想バッファを作成する際に便利です。

この Ex コマンドも `:keeppatterns` Ex コマンドと同様、バッファを開くコマンドを `{command}` に直接指定した場合のみ有効です。
ただし、`:vertical` Ex コマンドや `:leftabove` Ex コマンドなどの、ウィンドウを開く先を指定する修飾子コマンドは含まれていても問題ありません。

## `:clearjumps`

現在のウィンドウのジャンプリストを空にします。

カーソルを大きく移動させるコマンドを実行したり、バッファを移動したりした場合、そのカーソルの移動はジャンプリストに記録され、あとから辿って移動することができます。
これは多くの場合便利ですが、例えばプラグインが仮想バッファを開いた際などに、戻れてしまうと不便な場合もあります。そういった場合にこの Ex コマンドが使えます。

## `:helpclose`

現在のタブページにヘルプウィンドウがあれば、1 つだけ閉じます。
これは現在のウィンドウがヘルプウィンドウではない場合にも動作するので、離れた場所にあるヘルプウィンドウを閉じるのに便利です。
1 つもヘルプウィンドウがない場合は特にエラーにもならず、何も起きません。
AfterEffectsを使えればiOSのアニメーションが作れる「Squall」が神ツールすぎた件

自分で出したカジュアルなニュースアプリの企画が通り、開発できることになったとこから全ては始まった。
条件は開発期間１ヶ月、プロデューサー/ディレクター１名（自分）、エンジニア１名、デザイナーなし。

**＿人人人人人人人人人＿
＞　デザイナーなし　＜
￣Y^Y^Y^Y^Y^Y^Y^Y￣**

そんな無謀な状況でもやらねばなるまい、それがクリエイターだ！！！！

#爆速開発のための試行錯誤
デザイナーがいないこと以外にも、１ヶ月（実質3週間程度しかない）中でアプリをリリースできる状態まで持っていくのは容易な話ではない。
ディレクターたるもの、巻き取れる作業は巻きとるべきだ。

そんな考えから**エンジニア以外がアプリのアニメーションを作れないか**、ということでツールを探してみたところ見つけたのがこの**「[Squall](squall.no)」**というもの。

*まだ今年リリースされたばかりでTipsはFBコミュニティしかない状態*なので検証に１週間程度時間がかかったものの、この神ツールのおかげで納期を守れたと言っても過言ではない。

#Squallって何？
<img width="1236" alt="スクリーンショット 2016-11-29 17.18.56.png" src="https://qiita-image-store.s3.amazonaws.com/0/51623/850005ca-376a-df58-d281-47fd1a163c1b.png">

とりあえずロゴだけでもいけてる、素晴らしい。
ここでちょっと説明。

Squallは**AfterEffectsで作成したベクターアニメーションデータを独自ファイル（最新版はjson）に書き出す、もしくはコードで書き出しアプリ内で再現できるツール**。
つまり、動画制作に明るければ非エンジニアでもiOSアプリのアニメーションを作ることができる。

もうすこし具体的に言うと、AfterEffects内の拡張機能として動作し、アニメーションに関するデータを.sqaファイルとして生成。
アプリ側でSDKを実装することにより、.sqaファイル（独自ファイル）を動作させることができる。
コード書き出しの方もやってみたが、独自ファイルの方がどうも都合が良いっぽい。

<img width="1170" alt="スクリーンショット 2016-12-05 19.02.49.png" src="https://qiita-image-store.s3.amazonaws.com/0/51623/d0d63fac-bdc7-5250-c093-49da5007f4a6.png">

アニメーションのプレビューは専用アプリで行うことが出来、そこで再生できるものは全て問題なくアプリへ実装可能。(**ループする場合を除く。**)
エフェクトが使えないなどの制限はあるものの、アプリ開発のアニメーションにおいては救世主な気がする。
**※Ver1.3時点ではAndroid、日本語版AfterEffectsには非対応。**

ちなみにこのツールはMarcusEckert一人で作っている。
一人なのに下手なサービスよりCSも充実している。
つまりアマテラスオオミカミ的存在、嗚呼素晴らしい。

#実際どのくらいできるん？
![d_1.gif](https://qiita-image-store.s3.amazonaws.com/0/51623/884db1a7-5862-2cb4-da38-7b5c4c8e1146.gif)
[記事:https://haru2.jp]

まずはこれを見てくれ、最高だろ？
これはリリースしたアプリで使ったもので左側がAEで作成した状態のもの、右側がアプリ実装後。
全く同じ動きを再現できている。

固定コンテンツのアニメーションだけでなく、**動画内のシェイプレイヤーをキーとして画像やテキストをはめ込むことができる**ことがわかってもらえると思う。
いや、これすごくない？

#ちなみに見本に出したアプリは…？
<img width="928" alt="スクリーンショット 2016-12-05 19.12.58.png" src="https://qiita-image-store.s3.amazonaws.com/0/51623/ac504afe-00c8-bc74-0752-81a94240c51d.png">

こちらの「[Drips](http://drips.d-9.tokyo)」、ニュースの要点を抽出して、アニメーション付きで流れていくアプリ。
女性向けニュースだけど**Squallをふんだんに使用して制作したアプリ**なので、導入する前にDLしてチェケ！
最後にこれから導入する人のために、使ってみてわかった注意点をまとめておくので合わせてチェケ！

#注意点
- AfterEffectsの**プリセットプラグインの使用は不可**。（Perticle等）
- 置き換えオブジェクトに対して動きをつけるのはNG。
  - 対策として、調整レイヤーを用意して動きをつける。
- 置き換えオブジェクトの比率=置き換え後のオブジェクトの比率。
  - 例えば100%*80%のオブジェクトを置き換えると、縦に潰れる。
- カスタムフォントをを使用する場合。
  - 固定の場合、シェイプレイヤーに。
  - 可変の場合、アプリ側にカスタムフォントを実装する。
- シェイプを含む日本語テキストが入っている場合、バグが起こる。**（Ver1.3時点）**
- 画像、テキストは挿入できるが、動画には非対応。
  - ビュー全体を動画にし、トランジションにビューインを使用することは可能。
- アニメーションをループさせる場合はトランジションをつける場合、最初と最後にダミーでもタイムスタンプをつけることが必要。

**※Ver1.3→Ver2.0で.sqaファイルの中身など全てが大幅変更されているので注意。**

###### Created by [株式会社デジタルクエスト](https://www.digiq.co.jp) 山下 房之介
Fess 10.2から10.3へアップグレード

「[Fessで外部のElasticsearchクラスタを使用する](http://qiita.com/cookienote/items/2ab5ee9da75aec93caa5)」のような環境でデータ移行を行います。

#### Fess 10.2
パッケージをアップグレードしておきます。
1. 「管理>システム情報>バックアップ」からバックアップファイルをダウンロード
2. Elasticsearchのパッケージをアップグレード
3. Fessのパッケージをアップグレード

Fess10.2でインデックスされたデータを
Fess10.3にデータ移行します。

#### Fess 10.3
- リストア
管理>システム情報>バックアップ
バルクファイルでバックアップしたファイルをアップロードする。

- アップグレード
1.　URL「FessのURL/admin/upgrade」にアクセス
2.　データ移行の対象バージョンで10.2を選択
3.　開始ボタンをクリック
Dockerのイメージを任意の処理までロールバックする

わかりやすいコマンドがなかったのでメモ

# やりたいこと
Dockerfileからbuildしたイメージについて、任意の中間レイヤまで戻したい

# 例
こういうDockerfileをbuildしたとして、途中まで戻したい

```dockerfile:Dockerfile
FROM alpine:latest

RUN echo 'ここまで'
RUN echo 'なにか'
RUN echo 'てきとうな'
RUN echo 'しょり' #ここまで戻したい
RUN echo 'ふような'
RUN echo 'しょり'
```

`docker build -t test . && docker history test` するとこう

```
IMAGE               CREATED             CREATED BY                                      SIZE                COMMENT
3f5cdea9489f        3 seconds ago       /bin/sh -c echo 'しょり'                           0 B
eedfad20e5b5        4 seconds ago       /bin/sh -c echo 'ふような'                          0 B
c6f5a78d6c0a        6 seconds ago       /bin/sh -c echo 'しょり' #ここまで戻したい                   0 B
b0a1ad3df9a4        7 seconds ago       /bin/sh -c echo 'てきとうな'                         0 B
398af1df101f        9 seconds ago       /bin/sh -c echo 'なにか'                           0 B
ccbb3b8d5aeb        10 seconds ago      /bin/sh -c echo 'ここまで'                          0 B
baa5d63471ea        8 weeks ago         /bin/sh -c #(nop) ADD file:7afbc23fda8b0b3872   4.803 MB
```

# 戻し方
戻したいレイヤにタグを付ける
`docker tag 任意のレイヤ test`

# 結果
`docker tag c6f5a78d6c0a test`

```
IMAGE               CREATED              CREATED BY                                      SIZE                COMMENT
c6f5a78d6c0a        About a minute ago   /bin/sh -c echo 'しょり' #ここまで戻したい                   0 B
b0a1ad3df9a4        About a minute ago   /bin/sh -c echo 'てきとうな'                         0 B
398af1df101f        About a minute ago   /bin/sh -c echo 'なにか'                           0 B
ccbb3b8d5aeb        About a minute ago   /bin/sh -c echo 'ここまで'                          0 B
baa5d63471ea        8 weeks ago          /bin/sh -c #(nop) ADD file:7afbc23fda8b0b3872   4.803 MB
```

やったぜ。
Homebrewを使って新しいMacでサクッと環境構築したい

 
[Hamee Advent Calendar 2016](http://qiita.com/advent-calendar/2016/hamee) の16日目の記事です。

クリスマスに新しいMacが来て喜んでいるであろう未来の自分に捧げます。

### Hameeの良いところ（ダイマ

記事を書くきっかけというわけではないのですが…

Hameeのシステム開発部門はPCが劣化 or 使い始めてから3年経過したら無条件に新品のPCを調達する事が可能です。中々素晴らしい仕組みだと思うのですが、普段の業務が忙しいのか、新しいPCを申請する意外と少ないです…。

どうも環境構築に時間が掛かってしまう。というのが普段の業務を回していく中で結構辛いと…。

ではHomebrewを使って環境構築の時短をしようじゃないか。というのが今回の記事です。

手順
1. Homebrew（とCask）をインストール
2. .bashrc書き換え
3. Brew-fileの設定

#### Homebrew（とCask）をインストール

以下を実行してサクッと導入。
[Homebrewのサイト](http://brew.sh/index_ja.html)から引用

```sh:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
```

##### Caskを入れる

この手順は不要になったという噂を聞いたのですが、情報求む。

```sh:
brew install caskroom/cask/brew-cask
```

#### .bashrc書き換え

```sh:.bashrc
export HOMEBREW_CASK_OPTS="--appdir=/Applications"
```

`~/Applications`にインストールしてしまい、インストールしたアプリがLaunchpadに出てこなかったので設定しておく。不要な人はパス。

#### Brew-fileの設定

[Brew-file](https://github.com/rcmdnk/homebrew-file) はHomebrewで導入したアプリを管理する設定ファイルを生成してgit管理が出来ます。

コレをインストールする。

```.sh
$ brew install rcmdnk/file/brew-file
```

管理するgitリポジトリを設定。

```.sh
$ brew file set_repo -r <リポジトリ>
```

初期化の実行。

```.sh
$ brew file init
```

ここまで行けば後はHomebrewで好きなアプリを入れていくだけだが、その時のコマンドは

```.sh
$ brew file brew install <パッケージ・アプリ>
# caskで入れる場合はコチラ
$ brew file brew cask install <パッケージ・アプリ>
```

でインストールすることで自動でbrew fileに書き込まれ、状態が更新される。
このコマンドで入れない場合はbrew fileに書き込まれないので注意する。

現時点でHomeblew経由でインストールしたアプリのリストをbrew fileに書き込みたい場合は

```.sh
$ brew file update
# caskの場合はコチラ
$ brew file cask_upgrade
```

でbrew fileに書き込みが行われる。

brew fileに書かれた情報でインストールを実行するには

```.sh
$ brew file install
```

でインストール出来る。

これで快適環境構築ライフが実現出来るはず…。
未来の自分にメリー・クリスマス。
Swiftについての覚書４

#CoreDataの操作について
読み込み、追加、更新、削除のサンプルです。
import CoreData を忘れないようにしてください。
##読み込み

        let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
        let fetchRequest = NSFetchRequest(entityName: "CoreDataTest")
        var coreData:[CoreDataTest] = []
        // 読み込み
        do {
            coreData = try appDelegate.managedObjectContext.executeFetchRequest(fetchRequest) as! [CoreDataTest]
        } catch let error as NSError {
            print(error)
        }

##追加
        let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
        
        let coreData = NSEntityDescription.insertNewObjectForEntityForName("CoreDataTest", inManagedObjectContext: appDelegate.managedObjectContext) as! CoreDataTest
        coreData.id = 1
        coreData.name = "コアデータ"

        // コミット
        appDelegate.saveContext()

##更新
        let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
        let fetchRequest = NSFetchRequest(entityName: "CoreDataTest")
        
        do {
            let coreData = try appDelegate.managedObjectContext.executeFetchRequest(fetchRequest) as! [CoreDataTest]
            for data in coreData {
                data.id = 2
                data.name = "新コアデータ"
            }
        } catch let error as NSError {
            print(error)
        }
        
        // コミット
        appDelegate.saveContext()

##削除
        let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
        let fetchRequest = NSFetchRequest(entityName: "CoreDataTest")
        
        do {
            let coreData = try appDelegate.managedObjectContext.executeFetchRequest(fetchRequest) as! [CoreDataTest]
            for data in coreData {
                appDelegate.managedObjectContext.deleteObject(data)
            }
        } catch let error as NSError {
            print(error)
        }
        
        // コミット
        appDelegate.saveContext()