OmniAICreator/Qiita-1.07M huggingface dataset:
swift実践入門のAPIの部分をリファクタしたい

僕は普段はRubyやC#を書いているのですが、swiftでAPIを叩く機会がありまして、swift実践入門を読みました。

[swift実践入門](https://www.amazon.co.jp/Swift%E5%AE%9F%E8%B7%B5%E5%85%A5%E9%96%80-%E7%9B%B4%E6%84%9F%E7%9A%84%E3%81%AA%E6%96%87%E6%B3%95%E3%81%A8%E5%AE%89%E5%85%A8%E6%80%A7%E3%82%92%E5%85%BC%E3%81%AD%E5%82%99%E3%81%88%E3%81%9F%E8%A8%80%E8%AA%9E-WEB-PRESS-plus/dp/4774187305/ref=cm_cr_arp_d_product_top?ie=UTF8)

APIの章は14章です。

# もうすこしDRYに書きたい
swift実践入門では、githubAPIを叩いて、　リポジトリの検索を行うといったものです。

以下、swift実践入門より引用して一部抜粋。

```JSONDecodable.swift
protocol JSONDecodable {
    init(json: Any) throws
}
```

```User.swift
struct User: JSONDecodable {
    let id: Int
    let login: String
    
    init(json: Any) throws {
        guard let dictionary = json as? [String : Any] else {
            throw JSONDecodeError.invalidFormat(json: json)
        }
        
        guard let id = dictionary["id"] as? Int else{
            throw JSONDecodeError.missingValue(key: "id", actualValue: dictionary["id"])
        }
        
        guard let login = dictionary["login"] as? String else {
            throw JSONDecodeError.missingValue(key: "login", actualValue: dictionary["login"])
        }        
        self.id = id
        self.login = login
    }
}
```

JSONから各構造体にマッピングするときに、jsonをdictionaryに変換（＋例外処理）、キーからバリューを取得(＋例外処理)がやや冗長な気がします。これを各モデルに対して書くのは辛そうです。

# 少しDRYにしてみる
swift初心者ながら、DRYにリファクタしてみます。こうした方がいいとか、この書き方は危険だとかありましたらコメントで教えていただけると助かります。

## JSONDecoderという別の構造体を作ってしまう
この人に加工と例外処理をお願いしてしまいます。

```JSONDecoder.swift
struct JSONDecoder {
    var dictionary: [String : Any]
    
    init(json: Any) throws {
        guard let dictionary = json as? [String : Any] else {
            throw JSONDecodeError.invalidFormat(json: json)
        }
        self.dictionary = dictionary
    }
    
    func read<T>(key: String) throws -> T {
        guard let value = dictionary[key] as? T else {
            throw JSONDecodeError.missingValue(key: key, actualValue: dictionary[key])
        }
        return value
    }
}
```

## モデルを短く書いてしまう

```User.swift
struct User: JSONDecodable {
    let id: Int
    let login: String
    
    init(json: Any) throws {
        let decoder = try JSONDecoder(json: json)
        id    = try decoder.read(key: "id")
        login = try decoder.read(key: "login")
    }

}
```

# 感想
かっちりした文法で慣れるまでに時間はかかりそうですが、慣れたら大変書きやすく保守しやすい言語だと思いました。
あと、API叩くにはこういうライブラリがおすすめとか、あったら教えてください。
APIドキュメント作成を時短する

# 概要

APIドキュメントの作成は開発とは切っても切れない関係です。しかしながらHTTPメソッドやヘッダーなど書かなくちゃいけないことが多くドキュメント作成作業を想像すると重い腰が上がりません。
実案件においてもドキュメント作成を[API Blueprint](https://apiblueprint.org/) で行なったことがありますが、結構な時間を取られてしまいました。
個人的にAPIドキュメントツールとして使ったことがあるのは [API Blueprint](https://apiblueprint.org/) と [Swagger](https://swagger.io/)ですが、どちらも真面目にゼロベースで書き始めると結構大変な作業だとわかります。

そこでなんとか楽できないかなあと探していたら便利な[APIMATIC](https://apimatic.io/transformer)というサービスを発見したのでその紹介をしようと思います。

# [APIMATIC](https://apimatic.io/transformer)

<img width="1233" alt="スクリーンショット 2017-10-16 23.37.09.png" src="https://qiita-image-store.s3.amazonaws.com/0/188446/8206e9a2-ed6b-c9c0-75fa-7df2e91d34d8.png">

APIMATICはどんなサービスかというと、すでにあるフォーマットのドキュメントを任意のフォーマットに変換してくれるサービスです。

たとえば、Postman Collectionで書かれたものをSwagger形式(YAML)に変換したり、API Blueprint形式(apib)に変換したりすることができます。

## APIMATICが対応しているフォーマットの対応表

|ドキュメント|input|output|
|:---:|:---:|:---:|
|API Blueprint|○|○|
|Swagger 1.0 - 1.2|○|Swagger 1.2|
|Swagger 2.0 JSON|○|○|
|Swagger 2.0 YAML|○|○|
|WADL - W3C 2009|○|○|
|WSDL 1.1 - W3C|○|○|
|Google Discovery|○|\-|
|RAML 0.8 - 1.0|○|○|
|I/O Docs - Mashery|○|\-|
|HAR 1.2|○|\-|
|Postman Collection 1.0 - 2.0|○|○|
|APIMATIC Format|○|○|
|Mashape|○|\-|
|Open API Spec 3.0.0 (JSON)|○|○|
|Open API Spec 3.0.0 (YAML)|○|○|

## APIMATICの使い方

APIMATICの使い方はとても簡単です。[こちら](https://apimatic.io/transformer)のページにアクセスして少しスクロールすると下のような画面になります。

![スクリーンショット 2017-10-17 0.20.15.png](https://qiita-image-store.s3.amazonaws.com/0/188446/0cf8ca12-a716-c8d3-f261-d1b0c83ce9bd.png)

`File Description Upload` に変換する前のドキュメントをアップロードして `Target Description Format`で任意のフォーマットを選択して下さい。

最後に`Convert Now`をクリックすればいい感じに変換してくれます。

## 所感

試しにDynamoDBからGetでデータの一覧を取得するAPIを作成し、POSTMANでのテストからエクスポートしてAPIMATICでSwagger(YAML)に変換し、Swaggerhubのエディターでドキュメントを確認する、という流れをやってみたのですが結構いい感じなのではないかと思っています。

![screencapture-app-swaggerhub-apis-gcyata-test-1-0-0-1508168650839.png](https://qiita-image-store.s3.amazonaws.com/0/188446/4b20bbc8-0e10-ea4b-dd24-211c24be8cf9.png)

右側に貼り付けているのはAPIMATICで変換したYAMLです。

![スクリーンショット 2017-10-17 0.48.33.png](https://qiita-image-store.s3.amazonaws.com/0/188446/d760faa7-d3a8-50ad-4399-2b7d2947d730.png)


`Try it out`でテストするとResponse bodyにDynamoDBから取得してきたデータが返ってきています。

# あとがき

APIドキュメントは開発を円滑に行う上では大切なものですがあまり気の進む作業ではありません。もっと楽にドキュメント作成できる方法があればぜひ教えて下さい。
iPhone Xの角丸スクリーンの判定

iPhone Xのスクリーンは長方形ではない。角丸になって上がへっこんでいる。
これに対応をするために長方形か、それともiPhone Xのような画面であるかの判定をしたい（たまにはそんなこともあろう）。

判定にはwindowのsafeAreaInsetsをつかって、これが0であれば長方形、0でなければiPhone Xのような形のはずだ。

``` swift
func isiPhoneXScreen() -> Bool {
    guard #available(iOS 11.0, *) else {
        return false
    }

    return UIApplication.shared.windows[0].safeAreaInsets != UIEdgeInsets.zero
}
```

（iPhone Xの次はどんな形になるのかよくわからんので、来たら対応にするしかないな。。。）

![this3.png](https://qiita-image-store.s3.amazonaws.com/0/138773/21e47322-6c68-db9a-a60f-19d8344da7fe.png)
SRE本まとめ（21章 過負荷への対応）

自分の理解を深めるためにまとめてみました。[20章](https://qiita.com/bassbone/items/1648d904a40b7ff4aef9)の続きです。

## 21章 過負荷への対応

### 顧客単位での制限
グローバルでの過負荷が生じてしまった場合、振る舞いに問題のある顧客にはエラーレスポンスだけを返し、その他の顧客には影響が及ばないようにすることが重要。しかし、エラーレスポンスを返すだけであっても、積み重なるとCPU負荷がかかるため、クライアント側でのスロットリングで対処する。クライアント側でのスロットリングを実装する際に使った手法を適応型スロットリングと呼ぶ。

（[22章](https://qiita.com/bassbone/items/dacd2265e37d197d04b7)に続く）
VirtualBoxのLinuxゲストにguest-addtionsをインストールして、共有フォルダをマウントする

# 共有フォルダのマウント

- VirtualBoxのGuest Additionsをインストールが必要
    - ホスト側でCDドライブにGuest Additionsのインストールディスクを挿入せず、コマンドによるインストールを行う

## VirtualBoxのGuest Additionsをインストール

### ゲスト : Ubuntu 16.04

- `apt`でパッケージをインストールする

```shell-session
$ apt install virtualbox-guest-dkms
```

### ゲスト : CentOS 7.3

- 必要なパッケージを`yum`でインストール

```shell-session
$ yum groupinstall "Development Tools"
$ yum install dkms kernel-devel
```

- 利用しているVirtualBoxのバージョンに合わせて`VBOX_VERSION`を設定する

```shell-session
$ VBOX_VERSION='5.1.8'
$ cd /tmp
$ wget http://download.virtualbox.org/virtualbox/$VBOX_VERSION/VBoxGuestAdditions_$VBOX_VERSION.iso
$ mount -o loop,ro VBoxGuestAdditions_$VBOX_VERSION.iso /mnt
$ sh /mnt/VBoxLinuxAdditions.run --nox11
$ umount /mnt
$ rm VBoxGuestAdditions_$VBOX_VERSION.iso
$ unset VBOX_VERSION
```

## ホストの共有フォルダをマウントする

- ホスト側で共有フォルダを追加する。
    - 共有フォルダは`/media/sf_<共有フォルダ名>`で表示される

```shell-session:/mnt/testにマウントする例
$ mkdir /mnt/test
$ mount -t vboxsf <共有フォルダ名> /mnt/test
```

## 参考

- [lude/Guest download and install notes](https://gist.github.com/ilude/2585255)
- [larsar/shared_folder_centos_virtualbox.txt](https://gist.github.com/larsar/1687725)
為什麼這樣工作 快準好 心得

1. 動機
   先把任務化成trello 的ticket , ticket 打細項, 想清楚再動手, 使用像播放電影的方式把係項完成
2. 團隊
   <1>每一位成員的發言時間都差不多（整個討論下來總計，不是每次大家發言時間一樣）
   <2> 察言觀色，知道對方感受
   建立安心感最好的方式,領隊做起
3. 專注
   建立心智圖: 假設 -> 實驗 -> 修改假設 -> 實驗 repeat 
4. 目標
   SMART原則（S=Specific、M=Measurable、A=Attainable、R=Relevant、T=Time-based
5. 管理他人
   自動自發與承諾文化
6. 決策
   與不確定共處,思考 知道與不知道什麼
7. 創新
   三人行必有我師, 與驚慌當朋友, 創新後放下
8. 吸收資訊
   用自己的方式說一遍
LambdaでEC2をスケジュール起動/停止するServerless Frameworkのテンプレート


これは [AWS Lambda Advent Calendar 2017](https://qiita.com/advent-calendar/2017/aws-lambda) の16日目の記事になりました。

![Serverless Framework](https://s3-us-west-2.amazonaws.com/assets.site.serverless.com/images/home_framework_v1_1.png)

# はじめに
* コンテナ付いてる昨今は、久しくLambdaやServerless Framework触って無かったのですが、EC2を8時に起動して、20時半に停止する要件が浮上したので、サクッとslsで作りました。
* ソースは[Github](https://github.com/ukitiyan/operation-ec2-instance)で公開してます。
* 至極簡単な内容なので、速攻実現出来ると思ってます。

# 環境のセットアップ
* [前回の記事](https://qiita.com/ukitiyan/items/945d84282726d3fe2c2f)を参考にしてください。
https://qiita.com/ukitiyan/items/945d84282726d3fe2c2f


# Serverless FrameworkでDeploy

## ソースの取得

* 以下のGithubからソースを取得します。

```
$ git clone https://github.com/ukitiyan/operation-ec2-instance.git
```

## STS(Eclipse)にインポート

* STSを起動して、Project Explorer -> 右クリック -> Maven -> Existing Maven Projectsで先程Githubから取得した「operation-ec2-instance」フォルダを選択します。

## serverless.yml の修正 + Build

* serverless.ymlのL37 周辺の設定を適宜修正します。
   * rate: [AWS Lambda - Scheduled EventのCron書式
](https://qiita.com/pyr_revs/items/abd29d9472f4cba9032c)を参考に `UTC` で記載
   * instanceId: 対象インスタンスのinstanceIdを記載
   * scheduleは、縦に増やせるので複数インスタンスに対応できます。（それを踏まえて環境変数でinstanceIdを指定してません）

```yaml:serverless.yml
- schedule:
    rate: cron(30 11 * * ? *)
    input:
      goal: stop
      instanceId: i-XXXXXXXXXXXXXXXXX
- schedule:
    rate: cron(0 23 * * ? *)
    input:
      goal: start
      instanceId: i-XXXXXXXXXXXXXXXXX
```

* プロジェクトを右クリック -> Run As -> Maven Install でビルドします。
* target配下にoperation-ec2-instance.1.0.0.jarが出来上がります。

## Deploy

* 例のごとく、以下のコマンド一発です。

```
$ cd operation-ec2-instance
$ serverless deploy -v
Serverless: Packaging service...
Serverless: Uploading CloudFormation file to S3...
Serverless: Uploading artifacts...
・
・
Serverless: Stack update finished...
Service Information
service: operation-ec2-instance
stage: prod
region: ap-northeast-1
api keys:
  None
endpoints:
  None
functions:
  aws-java-maven-prod-hello: arn:XXXXXXXX
```

* 以下のJsonでコンソールから `test` するか、設定時間になるまで待って、問題ないか気にしておきましょう。

```
{
  "goal": "stop",
  "instanceId": "i-XXXXXXXXXXXXXXXXX"
}
```


# まとめ
* まぁ、やっつけですが。速攻実現出来ました。
* STSで完結するのが、アプリ屋にとっては本当うれしいです。
implements

自分用めも

```java:Interface_sample.java
interface Animal {
    public void eat();
    public void run();
}

public class Interface_sample implements Animal {

    public void eat() {
        System.out.println("taberu");
    }
    public void run() {
        System.out.println("hashiru");
    }

    public static void main(String[] args) {
        Interface_sample ifsample = new Interface_sample();
        ifsample.eat();
        ifsample.run();
    }
}
```
継承

自分用メモ

```java:Human.java
public class Human {
    String name;
    int age;
    String country;

    void walk() {
        System.out.println("歩く");
    }

    void sleep() {
        System.out.println("寝る");
    }
}
```

```java:SoccerPlayer.java
public class SoccerPlayer extends Human {

    void run() {
        System.out.println("走る");
    }

    void kick() {
        System.out.println("蹴る");
    }

    public static void main(String[] args) {
        SoccerPlayer soccer = new SoccerPlayer();

        soccer.walk();
        soccer.sleep();
        soccer.run();
        soccer.kick();
    }
}
```
Thymeleaf 3 で JavaScript をエスケープせずに出力する

Thymeleaf 3 から JavaScript (というよりインライン処理)の中でエスケープせずに文字列を出力できるようになっています。
`[[...]]`の代わりに`[(...)]`を使えば良いです。

## 例
### HTML
```html
<script th:inline="javascript">/*<![CDATA[*/
  var foo = /*[(${foo})]*/ {"bar":"drei","baz":"]]\u003e&quot;\n'<\u002fscript\u003e"};
/*]]>*/</script>
```
### Controller (Spring)
```java
@GetMapping("/")
public Object index(Model model) throws IOException {
  final MyForm myForm = new MyForm("", "'\"&amp;</script>]]>", Optional.of(LocalDateTime.now()));
  model.addAttribute("foo", this.objectMapper.writeValueAsString(myForm));
  return "index";
}
```
### => 出力[^1]
[^1]: この例では ObjectMapper をカスタマイズして `/` と `>` をエスケープしています。`</script>`タグと`]]>`を回避するためです。
```html
<script>/*<![CDATA[*/
  var contextPath = "\/";
  var foo = {"baz":"","cux":"'\"&amp;<\u002Fscript\u003E]]\u003E","datetime":"2017-10-16T23:26"};
/*]]>*/</script>
```
なお、 Thymeleaf にオブジェクトをそのまま渡してシリアライズさせた場合、 LocalDate 等(JSR-310 関係)はよろしく変換してくれますが、 Optional は未対応のようです。

## おまけ: build.gradle の依存関係設定
Spring Boot 1.5 系の場合、 spring-boot-starter-thymeleaf の参照先は Thymeleaf 2 なので別途依存関係を指定してやる必要があります。

```groovy
def thymeleafVersion = '3.0.7.RELEASE'
// https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf-spring4
compile group: 'org.thymeleaf', name: 'thymeleaf-spring4', version: thymeleafVersion
// https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf
compile group: 'org.thymeleaf', name: 'thymeleaf', version: thymeleafVersion
```
あとは AutoConfiguration が効いてよろしくやってくれます。
Goの構造体を配列に入れてみたメモ

Goの構造体を配列に入れた時の備忘録です。

```go
package main

import "fmt"

// テスト用構造体
type example struct {
	Name string
}

// example構造体を格納する配列の型
type examples []*example

// doExample exampleのNameフィールドに引数のstringを指定して返す
func doExample(n string) (r *example) {
	r = new(example)
	r.Name = n
	return r
}

func main() {
	// example構造体配列を宣言
	var exs examples

	// 配列に構造体を格納
	exs = append(exs, doExample("A"))
	exs = append(exs, doExample("B"))

	// 格納した構造体のNameフィールドを出力
	for _, i := range exs {
		fmt.Println(i.Name)
	}
}
```
ハンバーガーメニューデザインの提案

PCやスマホを触っていると間違いなく目にするハンバーガーメニュー
ハンバーガーメニューはどんどん進化していき，アイコン自体がくるくる回って✗に変わったり，あの3本線が様々な動きをするようになった．
しかし，メニュー自体は至ってシンプルであり，横や上からスライドしてくるものばかり...

何か違う動きのハンバーガーメニューのデザインを考えてみようという記事．

# DEMO
![demo.gif](https://qiita-image-store.s3.amazonaws.com/0/207520/d9aabb46-5125-13c5-db62-555ccb1b6043.gif)

[codepen](https://codepen.io/qwerty8t/pen/OxoBOa)
[github](https://github.com/Ut0n69/hamburgerMenuDemo)

今回はハンバーガーをクリックすると円が広がるメニューを作成．

# 中身の説明

円の大きさは固定で直径600pxとし，上と左に300pxずらしている．

```css:css
.hbg-menu {
  position: fixed;
  top: 12px;
  left: 12px;
  width: 60px;
  height: 50px;
  z-index: 1;
}

.hbg-menu-open {
  top: -300px;
  left: -300px;
  width: 600px;
  height: 600px;
  border-radius: 300px;
}
```

# 最後に
ハンバーガーメニューはもっともっと進化してほしい！

以上
主成分分析の効能とステップ

[Python機械学習プログラミング](http://amzn.to/2gmUN7Q)の5.1 主成分分析による教師なし次元削減 に、主成分分析について記載されており、ステップがわかりやすかったため、メモしておきます。

# 主成分分析の効能

主成分分析は教師なし線形変換法の1つで、最も用いられるタスクは次元削減。
データセットを変換し、元の次元よりも低い次元の新しい特徴量空間を作成する。
その際に、元の高次元データにおいて分散が最大となる方向を見つけ出すことで、次元を削減しつつも、情報量を残しやすくなる。
次元削減することで、計算効率を改善することができる。

# 主成分分析のステップ
下記の6つがある。

1. d次元のデータセット(1×d)を標準化する
    * 標準化しないと、100cmか1mか、単位の違いなどによって重要度がブレてしまう。
2. 標準化したデータセットの**共分散行列**を作成する。
3. 共分散行列を**固有ベクトル**、**固有値**に分解する。
4. 最も大きいk個の固有値に対応するk個の固有ベクトルを選択する。このkが新しい特徴部分空間の次元数を表す。
    * 2で作成した共分散行列は、固有値が大きい順に並ぶわけではないので、固有値でソートしベクトルを選ぶ必要がある。
5. 上位k個の固有ベクトルから射影行列W(d×k)を作成する
6. 射影行列Wを使ってデータセットXを変換し、新しいk次元の特徴部分空間を作成する。（1×dのベクトルに、d×kの行列をかけると、1×kのベクトルになる。）

# 参考書籍
* [Python機械学習プログラミング](http://amzn.to/2gmUN7Q)

* 上のステップで、共分散行列や固有ベクトル、固有値、行列とベクトルの掛け算などがとっつきにくい場合は、下記がおすすめです。下記を読んでからPython機械学習を読んだら、すんなり読み進められるようになりました。
    * [プログラミングのための線形代数](http://amzn.to/2ypu1jC)
    * [プログラミングのための確率統計](http://amzn.to/2kRNo1D)
React.jsで<br/>を改行と認識させる方法(エスケープ解除方法)

## 概要

React.jsでホームページを作っている時にHTMLのエスケープでハマってしまったのでメモします。


## 実装
具体的に、以下のようなテーブルを作る例で示します。

![スクリーンショット 2017-10-16 22.45.15.png](https://qiita-image-store.s3.amazonaws.com/0/153954/e15aded9-e096-39e6-3f37-e19a5e911f28.png "スクリーンショット 2017-10-16 22.45.15.png")

この時、初心者の皆さんはmapを使って以下のように記述すると思います。

```.jsx
import React from 'react';

const App = () => {
  const messages = [
   { title: '名称', mes: 'AAA株式会社' },
    { title: 'URL', mes: 'http://aaa.com' },
    { title: '資本金', mes: 'AAA万円' },
    { title: 'メンバー', mes: 'AAA <br/> BBB <br/> CCC <br/> DDD </br> EEE' },
  ];
  const messageLists = messages.map((e, index) => (
    <tr key={index + 1}>
      <td>{e.title}</td>
      <td> {e.mes } </td>
    </tr>
  ));
  return (
    <table>
      <th>title</th>
      <th>メッセージ</th>
      { messageLists }
    </table>
  );
};


export default App;
```

しかし、JSXの中で生のHTMLを書くと、以下のように`<br/>`が文字列として認識されてしまいます。

![スクリーンショット 2017-10-16 22.48.45.png](https://qiita-image-store.s3.amazonaws.com/0/153954/7025c34d-9cc2-ba02-4cf4-714b95320bf8.png "スクリーンショット 2017-10-16 22.48.45.png")

そこで、しっかりと`<br/>`を改行と認識させるためにはdangerouslySetInnerHTMLを用いて以下のように記述します。


```.jsx
import React from 'react';

const App = () => {
  const messages = [
    { title: '名称', mes: 'AAA株式会社' },
    { title: 'URL', mes: 'http://aaa.com' },
    { title: '資本金', mes: 'AAA万円' },
    { title: 'メンバー', mes: 'AAA <br/> BBB <br/> CCC <br/> DDD </br> EEE' },
  ];
  const messageLists = messages.map((e, index) => (
    <tr key={index}>
      <td>{e.title}</td>
      <td dangerouslySetInnerHTML={{__html: e.mes}} />
    </tr>
  ));
  return (
    <table>
      <th>タイトル</th>
      <th>メッセージ</th>
      { messageLists }
    </table>
  );
};


export default App;
```

すると、以下のようにうまく表示されます。

![スクリーンショット 2017-10-16 22.45.15.png](https://qiita-image-store.s3.amazonaws.com/0/153954/e15aded9-e096-39e6-3f37-e19a5e911f28.png "スクリーンショット 2017-10-16 22.45.15.png")

大成功ですね。

## 最後に

dangerouslySetInnerHTMLにはXSSの脆弱性があるのでむやみやたらに使用するのは避けましょう。
ちょっとずつ読むドメイン駆動設計 第ニ部 モデル駆動設計の構成要素 第六章 ドメインオブジェクトのライフサイクル8(リポジトリ その2) 

[リポジトリ その１](https://qiita.com/YasuhiroKimesawa/items/54a2adbc79bfc062e3f4)のつづき

# リポジトリ その２

> ドメイン駆動設計の目標は、技術ではなく、ドメインについてのモデルに焦点を合わせることによって、よりよいソフトウェアを作ることである。(第二部第六章より)

なので、クライアント（特に"アプリケーション層")が直接データベースのクエリにアクセスすると、モデルではなくて、技術を扱っていることになり、ともすると、集約やオブジェクトのカプセル化を迂回しモデルが単なるデータの入れ物になってしまいます。

> クライアントが必要とするのは、すでに存在するドメインオブジェクトへの参照を手に入れる、実用的な手段(第二部第六章より)

永続化されたオブジェクトはライフサイクルの**中期**です。
なので、データベース技術を使ってオブジェクトを”生成”するということではなく、なんでもいいから、"既にあるオブジェクト"の参照を手に入れることが大事です。

むしろ、オブジェクトが**"既にある"**ものとしてシームレスにオブジェクトの参照を手に入れるように実装したいものです。

> メモリ上にあると錯覚させるようにすること(第二部第六章より)

リポジトリパターンはこのために使用します。

## クエリで何をどう取得するか

基本SQLでどんな値を取得するクエリを書いても自由です。

ただ、ドメイン駆動設計では、特に値オブジェクトは集約のルートから辿って取得するべきです。
それは永続化されたオブジェクトでも同様で、

> 永続化された値オブジェクトを見つけるには、それをカプセル化する集約のルートとして機能するエンティティから関連を辿るのが普通である。(第二部第六章より)

上記から、クライアントが直接クエリを使用すると、このようなドメイン駆動設計の利点を活かしたオブジェクトの活用法から離れ、なんでもグローバルに取得するようになってしまいます。

リポジトリパターンを使用するもう一つの理由が集約の単位でオブジェクトを再構成するためです。
(例外として、"列挙"の取得など、まれではあるが、値オブジェクトをクエリで取得することがあります)

## リポジトリパターン

リポジトリでは、これまで読んできたように、クエリなどの技術的な解決策をカプセル化します。

簡単なモデルは以下のような感じです。

![リポジトリ.png](https://qiita-image-store.s3.amazonaws.com/0/150455/86d99892-5aff-9771-5953-d6105d174465.png)

明日も引き続きリポジトリを読んでいきます。
報連相の要点まとめ

# 報告
上司や先輩からの指示や命令に対して、部下が経過や結果等の進捗情報を伝えること。
1. 相手の都合を確認する
2. 指示した上司に直接報告する
3. 重要な報告はすぐに行なう
4. 結論を先に伝える
5. 「事実」と「意見・憶測」は分けて報告する
6. 口頭か文書での報告かを選ぶ
7. こまめに報告する
8. ミスやトラブルはすぐに報告する
9. 報告する際にメモを持参する

## 「結論から伝える」ポイント
- 一文を短く
- 主語述語を明確に
- 事実と自分の考えを分ける
- 具体的に話す
- 結論→理由→詳細の順

## 「報告のタイミング」は、例えば以下のようなケース
- 指示された仕事が終わった時
- トラブルが発生した時
- 進捗報告、中間報告
- 内容の変更    
- 予定より進捗が遅れている時

特に、「進捗を相手に聞かれる = 報告が遅いと言うこと」であることに注意したい。

# 連絡
必要な情報を、必要とする相手に正しく伝えること。
1.曖昧な言葉は使わない
2.自分の意見や憶測は入らない。
2.内容に関係なく迅速に連絡する
3.連絡すべき順番を意識する
4.関係者全員に伝える

# 相談
判断に迷う時や意見を聞いてもらいたい時に、参考意見やアドバイスをもらうこと。
1.疑問が生まれたら相談や質問
2.最初に相談するのは直属の上司
3.アイデアやプラン変更は準備を整えてから臨む

# 報連相を行うにあたって
## 言葉遣いでのポイント
例えば、「営業企画の件でご報告したいのですが、いまお時間よろしいでしょうか？」のように始める。
また、「お陰様で」「残念ながら」などのクッション言葉をいれるとなお良い。

## メールでの報連相のポイント
1. 送信した　= 報告や連絡にはならない
2. メールを使わない方がよいケースもある
3. 「受け取った」という返信は迅速に

## 報連相の落とし穴
ここで注意したいことが、「とにかくどんな方法でもよいから、相手に伝えれば終了」という事には、ならないということ。
そして、聞き手、読み手のことを考え、思いやりの気持ちを忘れずに伝えなければいけないということ。

大切なのは、相手に正しく理解してもらうよう、わかりやすく手短に伝えること。
それだけに、普段から迅速かつ正確に意見や情報を「伝える技術」を磨くことが求められることになる。

## 報連相の恩恵

- 積極的に報連相をすることで、信頼を得られ成長スピードも上げることができる。
- 指示や命令を確実に受け取れることで適切な行動が取れる
- 自分の考えや判断が正しいとわかる
- 有益なアドバイスにより大きなミスを防げる
- コミュニケーションを密にすることでチームの結束が高まる

## 番外編 仕事の聞き方
- 必ずメモを取る
- 大事なポイントを確認する
- 期日を確認
- 内容を確認（復唱）する
- 自分の考えを持って動く
- 同じことは二回聞かない
GraphQLのfragmentを使ってコードを書くようにクエリを書こう

最近、GraphQLで作られたAPIを使ってiOSを開発しています。その中での感動を共有したかったので記事にしました！

## GraphQLとは

GraphQLって何？って方は以下の記事がわかりやすいと思います！

[GitHub APIから学ぶ次世代のAPI実装方式GraphQL
](https://qiita.com/icoxfog417/items/92214aed64f47dfeade5)

僕もGraphQLとはなんぞや？とわかりやすく説明するほどには理解していないのですが、GraphQLを使ってみる中で気づいた、GraphQLのTipsを紹介します。

## 例

例えば以下のような`title`と`description`と`url`というプロパティを持つArticleというObjectがあるとします。

そして

```
feed(id: Int): [Article]
```

というQueryが定義されているとします。

やりたいことは、0,1,2のidのfeedを取ってくるクエリを作ることです。

受け取りたいJSONは以下のような感じ。id0,1,2の3つの記事フィードのJSONが欲しい。

```json
{
  "data": {
    "feed1": [
      {
　　　　　　　　　　　　　　　　"title": "僕が筋トレブロガーではなく『筋肉エンジニア』を名乗ると決めた理由",
        "description": "もっと自分自身が筋肉マッチョになっていかなければならないというのも、わりかし限界があります。自分はフィットネスで食っていく気がないからです。",
        "url": "https://silver-gym.net/blogger_or_engineer"
      },
      {
　　　　　　　　　　　　　　　　"title": "僕が筋トレブロガーではなく『筋肉エンジニア』を名乗ると決めた理由",
        "description": "もっと自分自身が筋肉マッチョになっていかなければならないというのも、わりかし限界があります。自分はフィットネスで食っていく気がないからです。",
        "url": "https://silver-gym.net/blogger_or_engineer"
      },
    ...
    ],
    "feed2": [
      {
　　　　　　　　　　　　　　　　"title": "僕が筋トレブロガーではなく『筋肉エンジニア』を名乗ると決めた理由",
        "description": "もっと自分自身が筋肉マッチョになっていかなければならないというのも、わりかし限界があります。自分はフィットネスで食っていく気がないからです。",
        "url": "https://silver-gym.net/blogger_or_engineer"
      },
      {
　　　　　　　　　　　　　　　　"title": "僕が筋トレブロガーではなく『筋肉エンジニア』を名乗ると決めた理由",
        "description": "もっと自分自身が筋肉マッチョになっていかなければならないというのも、わりかし限界があります。自分はフィットネスで食っていく気がないからです。",
        "url": "https://silver-gym.net/blogger_or_engineer"
      },
    ...
    ],
    "feed3": [
      {
　　　　　　　　　　　　　　　　"title": "僕が筋トレブロガーではなく『筋肉エンジニア』を名乗ると決めた理由",
        "description": "もっと自分自身が筋肉マッチョになっていかなければならないというのも、わりかし限界があります。自分はフィットネスで食っていく気がないからです。",
        "url": "https://silver-gym.net/blogger_or_engineer"
      },
      {
　　　　　　　　　　　　　　　　"title": "僕が筋トレブロガーではなく『筋肉エンジニア』を名乗ると決めた理由",
        "description": "もっと自分自身が筋肉マッチョになっていかなければならないというのも、わりかし限界があります。自分はフィットネスで食っていく気がないからです。",
        "url": "https://silver-gym.net/blogger_or_engineer"
      },
    ...
    ]
  }
}
```

**このときにFragmentを知ってる知らないかでクエリのDRYさと見やすさが大きく変わってきます。**

## Fragmentを使わないで書くと

```
query Feed {
  feed1: feed {
    title
    description
    url
  }
  feed2: feed {
    title
    description
    url
  }
  feed3: feed {
    title
    description
    url
  }
}
```

と書かなければいけません

```
    title
    description
    url
```

が３回出てくるんですよね。DRYじゃないし、見にくい。。。

## Fragmentを使って書くと！

しかし、fragmentを使うとめっちゃ綺麗になります。クエリじゃなくてコードを書いている気分になります。

```
query Feed {
  feed1: feed {
    ...article
  }
  feed2: feed {
    ...article
  }
  feed3: feed {
    ...article
  }
}

fragment article on Article {
    title
    description
    url
}
```

fragmentによってArticleをまとめることができて、クエリがとてもスッキリして見やすくなりました。

## まとめ

GraphQLのfragment最高です。

## 関連

http://graphql.org/learn/queries/#fragments

https://qiita.com/Jxck_/items/545e67c556e815620692#fragment
画像などを一覧で見れるようにディレクトリを解体する

# 画像や音楽などを一覧で見たい。見るだけのディレクトリが欲しい
## こんな人向け
すでに綺麗に分類されている画像集を持っていると仮定する。例えばわんこの写真集をzipで持ってたとする。
解凍してみたらこのようなディレクトリ構成だった。

```
わんこ　─　柴犬　　　　　　　─　1.jpg
　　　　　　　　　　　　　　　─　2.jpg
　　　　─　ヨークシャテリア　─　1.jpg
　　　　─　ダルメシアン　　　─　1.jpg
　　　　　　　　　　　　　　　─　2.jpg
　　　　　　　　　　　　　　　─　3.jpg
　　　　─　以下わんこが続く...
```
好きなわんこがいて目的の血統の画像が見たければフォルダ名を参照すればいいが、__何でもいいからわんこの画像が見たい状態__だったとしたら、この綺麗に整理されたディレクトリ構成はフォルダ移動を繰り返すだけの非常にうっとうしいものとなる。
上記の構成を画像が一覧で見れる形、

```
わんこ　─　柴犬_1.jpg
　　　　─　柴犬_2.jpg
　　　　─　ヨークシャテリア_1.jpg
　　　　─　ダルメシアン_1.jpg
　　　　─　ダルメシアン_2.jpg
　　　　─　ダルメシアン_3.jpg
　　　　─　...
```
みたいになるようにすることが目的。
## 想定環境
画像一覧で見るのが目標なのでGUIのOSであること。WindowsかMac OS系を想定する。
今回はWindowsでcygwinが入ってるとする。unix系のコマンドのほうがわかりやすいので。
## 準備
テストのためにサンプルを用意。

```bash
$ mkdir mv_file_test
$ cd $_
$ mkdir -p hoge_dir/fuga_dir/piyo_dir
$ cd $_
$ touch a.png
$ touch b.png
$ touch c.png
$ cd ~/mv_file_test
$ mkdir -p foo_dir/bar_dir/
$ cd $_
$ touch a.png
$ touch b.png
$ cd ~/mv_file_test
$ mkdir -p foo_dir/baz_dir/
$ cd $_
$ touch a.png
$ touch b.png
$ touch c.png
$ cd ~/mv_file_test
```
中身を確認する。

```bash
$ find .
.
./foo_dir
./foo_dir/bar_dir
./foo_dir/bar_dir/a.png
./foo_dir/bar_dir/b.png
./foo_dir/baz_dir
./foo_dir/baz_dir/a.png
./foo_dir/baz_dir/b.png
./foo_dir/baz_dir/c.png
./hoge_dir
./hoge_dir/fuga_dir
./hoge_dir/fuga_dir/piyo_dir
./hoge_dir/fuga_dir/piyo_dir/a.png
./hoge_dir/fuga_dir/piyo_dir/b.png
./hoge_dir/fuga_dir/piyo_dir/c.png
```
準備完了。
## 実装する
方法はいろいろあるが、文字列処理が簡単にかけるスクリプト言語を使う。今回はRubyを使うことにする。

```ruby:mod_file_name_and_copy.rb
TARGET_DIR="/home/HOME_NAME/mv_file_test/" #HOME_NAMEは適当なのに置き換えてね

IO.popen('find ' + TARGET_DIR) do |io|
  while line = io.gets
    line.chomp!
    next if File.ftype(line) != 'file'
    cp_line = line.sub(TARGET_DIR, '')
    cp_file_name = cp_line.gsub('/', '-')
    system('cp "' + line + '" "' + cp_file_name + '"') #ダブルクオートで囲む理由はファイル名にカッコがあるとcpでこけることがあったため
  end
end
```
これをコピー先のディレクトリを作ってそこで実行してみる。

```bash
$ ruby mod_file_name_and_copy.rb

$ ll
合計 1
-rw-r--r-- 1 hogeco なし   0 10月 16 22:03 foo_dir-bar_dir-a.png
-rw-r--r-- 1 hogeco なし   0 10月 16 22:03 foo_dir-bar_dir-b.png
-rw-r--r-- 1 hogeco なし   0 10月 16 22:03 foo_dir-baz_dir-a.png
-rw-r--r-- 1 hogeco なし   0 10月 16 22:03 foo_dir-baz_dir-b.png
-rw-r--r-- 1 hogeco なし   0 10月 16 22:03 foo_dir-baz_dir-c.png
-rw-r--r-- 1 hogeco なし   0 10月 16 22:03 hoge_dir-fuga_dir-piyo_dir-a.png
-rw-r--r-- 1 hogeco なし   0 10月 16 22:03 hoge_dir-fuga_dir-piyo_dir-b.png
-rw-r--r-- 1 hogeco なし   0 10月 16 22:03 hoge_dir-fuga_dir-piyo_dir-c.png
-rw-r--r-- 1 hogeco なし 344 10月 16 22:03 mod_file_name_and_copy.rb
```
よさそうだ。これでわんこを煩わしい操作なしで眺めることができて幸せになれる。
## 動機
ゲームのリソースなどをまとめて確認したいときに対象があまりにも細分化されたディレクトリ構成だったので、深い階層を追ってまで見たくなかったため。ジャンルごとに分けるのは大事だがあまりにも細かすぎると逆に管理が大変になるという教訓。
f-strings の使用例

# この記事は？

Python 3.6 で追加された [f-strings](https://www.python.org/dev/peps/pep-0498/) ([フォーマット済み文字列リテラル](https://docs.python.jp/3/reference/lexical_analysis.html#formatted-string-literals)) の使用例です。[式展開](https://docs.ruby-lang.org/ja/latest/doc/spec=2fliteral.html#exp) の機能が存在する Ruby や JavaScript などの言語から移住してきた身なので重宝しています。ただ、[書式指定文字列](https://docs.python.jp/3/library/string.html#formatstrings) の文法をしばしば忘れてしまうので備忘録として残します。

# f-strings の使用例

## 位置揃えとパディング

```python
number = 123

# ゼロパディングする。

f'{number:0>10}'  # 右寄せ
#=> '0000000123'

f'{number:0^10}'  # 中央寄せ
#=> '0001230000'

f'{number:0<10}'  # 左寄せ
#=> '1230000000'

# パディングのための文字列を指定しない場合は、半角スペースで埋められる。

f'{number:>10}'
#=> '       123'

f'{number:^10}'
#=> '   123    '

f'{number:<10}'
#=> '123       '

# パディングの長さやパディングに使う文字も変数で指定できる。

padding_length = 5

f'{number:0>{padding_length}}'
#=> '00123'

padding_char = '*'

f'{number:{padding_char}>{padding_length}}'
#=> '**123'
```

## 桁区切り

```python
number = 1234567890

f'{number:,}'
#=> 1,234,567,890
```

## 小数点以下の桁数

```python
ratio = 0.123

f'{ratio:.2}'
#=> 0.12

f'{ratio:.5}'
#=> 0.123

f'{ratio:.5f}'  # 末尾に固定小数点数フォーマット f を付けるとゼロパディングする。
#=> 0.12300
```

# パーセント表示

```python
ratio = 0.123

f'{ratio:%}'  # 固定小数点数のデフォルトの精度は 6 である。
#=> 12.300000%

f'{ratio:.3%}'
#=> 12.300%
```

# str(), repr(), ascii()

```python
class Man:
  def __init__(self, name):
    self.name = name

  def __str__(self):
    return self.name


man = Man('ジャギ')

f'こいつの名は{man}！'
#=> 'こいつの名はジャギ！'

f'こいつの名は{man!s}！'  # str(man) と同じ。
#=> 'こいつの名はジャギ！'

f'こいつの名は{man!r}！'  # repr(man) と同じ。
#=> 'こいつの名は<__main__.Man object at 0x10874c2b0>！'

f'こいつの名は{man.name!r}！'  # repr(man.name) と同じ。文字列がシングルクォーテーションで括られる。
#=> "こいつの名は'ジャギ'！"

f'こいつの名は{man.name!a}！'  # ascii(man.name) と同じ。
#=> "こいつの名は'\\u30b8\\u30e3\\u30ae'！"

print(f'こいつの名は{man.name!a}！')
# こいつの名は'\u30b8\u30e3\u30ae'！
```

# 参考

* Python ドキュメント
    * Python 言語リファレンス » 2. 字句解析
        * [2.4.3. フォーマット済み文字列リテラル](https://docs.python.jp/3/reference/lexical_analysis.html#formatted-string-literals)
    * Python 標準ライブラリ » 6. テキスト処理サービス » 6.1. string — 一般的な文字列操作
        * [6.1.3. 書式指定文字列の文法](https://docs.python.jp/3/library/string.html#format-string-syntax)
            * [6.1.3.1. 書式指定ミニ言語仕様](https://docs.python.jp/3/library/string.html#format-specification-mini-language)
neo4jで仕入先と得意先を可視化してみる。

具体的なデータを使った例が欲しかったので、個人的に作ってみた。
データは得意先を公開しているインターネット上の会社を取得し、neo4jで可視化してみた。

## データ投入コード
データ挿入用のコードはこちらからダウンロードしてください。
https://github.com/Synashida/neo4j_sample/blob/master/CustomerAndSupplyer.txt

## リレーションを作成するコード

```
MATCH (s:Company),(c:Company)
WHERE s.name IN c.supplyer
CREATE (s)-[r:得意先]->(c)
RETURN r;
```

c.supplyerは仕入先を配列で格納していて、その中にs.nameが含まれるかどうかの条件をWHEREで記述しています。
値 IN 配列の形式で記述することになります。

*得意先と仕入先の関係拡大図*

<img width="1276" alt="graph2.png" src="https://qiita-image-store.s3.amazonaws.com/0/57579/90a702ee-436c-0528-5756-3a5c8fdb50e3.png">

*全体像*

![graph.png](https://qiita-image-store.s3.amazonaws.com/0/57579/9bec0a6d-4b45-e97e-74a2-224d94a0bcf5.png)
Mac に electron をインストールするとき Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/electron/.electron' が出る

# electron のインストールがうまくいかない
Mac （もしかすると他でも）で、
以下の環境で electron のインストールにはまったのでメモ

- 追記　npm install xx -g するときの問題でした。

$ node -v
v7.8.0
$ npm -v
n5.5.1

インストールしようとした electron 1.7.9

```
$ sudo npm install electron -g
/usr/local/bin/electron -> /usr/local/lib/node_modules/electron/cli.js

> electron@1.7.9 postinstall /usr/local/lib/node_modules/electron
> node install.js

/usr/local/lib/node_modules/electron/install.js:48
  throw err
  ^

Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/electron/.electron'
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! electron@1.7.9 postinstall: `node install.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the electron@1.7.9 postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
```

# やったこと

```
$ sudo npm install -g electron --unsafe-perm=true --allow-root
```

参考
https://github.com/npm/npm/issues/17268
youtubeAPIを使って特定のチャンネルの動画タイトルを取得

##環境構築
###pythonのインストール
最新入れておけば大丈夫やんね

###統合開発環境のインストール
pycharm入れておけばいいやんね
とりあえずcommunity版にしよう

###google-api-python-clientを入れる
コマンドプロンプトでpythonインストールディレクトリ/Scriptsに移動
下記コマンド実行
pip install --upgrade google-api-python-client

##やってみる

pycharmでプロジェクトを作って下記のpythonファイルを作成
実行後コンソールに某youtuberの動画のタイトルが表示されれば成功

test.py

```py
#!/usr/bin/python

import apiclient.discovery
import apiclient.errors
from googleapiclient.discovery import build
from oauth2client.tools import argparser

# Set DEVELOPER_KEY to the API key value from the APIs & auth > Registered apps
# tab of
#   https://cloud.google.com/console
# Please ensure that you have enabled the YouTube Data API for your project.
DEVELOPER_KEY = "AIzaSyDEgYLv8efN6VWgpC4KbDZfDr7WL0k-1oQ" 
YOUTUBE_API_SERVICE_NAME = "youtube" 
YOUTUBE_API_VERSION = "v3" 

def youtube_search(options):
  youtube = build(YOUTUBE_API_SERVICE_NAME, YOUTUBE_API_VERSION,
    developerKey=DEVELOPER_KEY)

  # Call the search.list method to retrieve results matching the specified
  # query term.
  search_response = youtube.search().list(
    q=options.q,
    part="id,snippet",
    maxResults=options.max_results
  ).execute()

  videos = []
  channels = []
  playlists = []

  # Add each result to the appropriate list, and then display the lists of
  # matching videos, channels, and playlists.
  for search_result in search_response.get("items", []):
    if search_result["id"]["kind"] == "youtube#video":
      videos.append("%s (%s)" % (search_result["snippet"]["title"],
                                 search_result["id"]["videoId"]))
    elif search_result["id"]["kind"] == "youtube#channel":
      channels.append("%s (%s)" % (search_result["snippet"]["title"],
                                   search_result["id"]["channelId"]))
    elif search_result["id"]["kind"] == "youtube#playlist":
      playlists.append("%s (%s)" % (search_result["snippet"]["title"],
                                    search_result["id"]["playlistId"]))

  print("Videos:\n", "\n".join(videos), "\n")
  print("Channels:\n", "\n".join(channels), "\n")
  print("Playlists:\n", "\n".join(playlists), "\n")

if __name__ == "__main__":
  argparser.add_argument("--q", help="Search term", default="ヒカル")
  argparser.add_argument("--max-results", help="Max results", default=25)
  args = argparser.parse_args()

  assert isinstance(args, object)
  youtube_search(args)

```

###追伸
ほぼ自分用メモですな
AsyncTaskに安全にcallbackを持たせたい

Android開発に関する初投稿です。
Android初心者なので、アドバイス・指摘大歓迎です。

# 背景

重い処理をUIスレッド外で行いたいときに使うAsyncTaskはコールバックで処理を受け取る形式になっていません。
しかし、迂闊にコールバックを受け取れるようにするとメモリリークの危険があります。

## AsyncTaskで安全にcallbackを実行する方法

ActivityをweakReferenceで保持し、callBackをActivityに持たせてonPostExecute()内で実行します。
Activityが弱参照になっているので、Activityがdestroyされた時にActivityが適切にGCされます。

```kotlin
class AsyncTaskSample<T>(activity: T) : AsyncTask<String, Unit, String>() where T : AppCompatActivity, T : AsyncTaskSample.Listener {
    val weakActivity = WeakReference(activity)
    interface Listener {
        fun onCompleteAsyncTask(result: Uri?): Unit
    }

    override fun doInBackground(vararg params: String?): String? {
        return params[0]
    }

    override fun onPostExecute(result: String?) {
        super.onPostExecute(result)
        weakActivity?.onCompleteAsyncTask(result)
    }
}

```


## ダメな例: callBackをコンストラクタに渡す

doInBackgroundの最中にActivityがdestroyされてもGCが働かず、メモリー上にActivityが残り続けます。その為、最悪の場合メモリーリークを起こします。

```kotlin
class AsyncTaskSample(callback: (String?) -> Unit) : AsyncTask<String, Unit, String>() {
    override fun doInBackground(vararg params: String?): String? {
    }

    override fun onPostExecute(result: String?) {
        super.onPostExecute(result)
        callback(result)
    }
}
```


## ダメな例: callBackをWeakReferenceで保持する

callBackに渡したラムダが予期せぬタイミングでGCされ、発火しなくなることがあります。

```kotlin
class AsyncTaskSample(callback: (String?) -> Unit) : AsyncTask<String, Unit, String>() {
    val weakCallback = WeakReference(callback)
    override fun doInBackground(vararg params: String?): String? {
        return params[0]
    }

    override fun onPostExecute(result: String?) {
        super.onPostExecute(result)
        weakCallback.get()?.invoke(result)
    }
}

```
【iOSアプリ開発】その１　マルチデバイス対応について【Swift3.0】

##はじめに
これから約１年間、iOSアプリ開発の学習として学んだことをまとめて投稿していきます。
最終目標は作成したアプリのリリースを目指して続けていきたいと思います。
iOS,Swift3.0については今までほとんど触っていなかったため、
当たり前のような内容もあると思いますが、お手柔らかによろしくお願いします...。


今回は超基礎的な内容ですが、デザインを進めていく上で一番はじめにつまづいた、
複数画面サイズの対応方法についてまとめたいと思います。

##AutoLayout
今ではiOSの画面サイズは多岐にわたり、
11月にはiPhoneXが発売されるためまたサイズが増えることになります。
私が現在所持している端末がiPhone5s(4inch)とiPhone6sPlus(5.5inch)なので、
まずはマルチデバイス対応を行いたいなと思いました。

調べていくとどうやらAutoLayoutというものがあり、UI要素の位置制約を指定することで対応できるようです。

現在取っ掛かりとして時計アプリを製作しているので、実際に組み込んでみたいと思います。

![スクリーンショット 2017-10-09 17.53.05.png](https://qiita-image-store.s3.amazonaws.com/0/206492/111fbb21-af86-44a9-6b1b-a82802539ce5.png)

まずは日付を画面の左上に配置できるよう制約を追加します。
座標の始点は左上なので、縦横20ptずつの位置を指定します。
![スクリーンショット 2017-10-09 17.57.01.png](https://qiita-image-store.s3.amazonaws.com/0/206492/ab958e5c-2f9a-17d9-fd04-b47d38a6c37e.png)

次に、時刻を下から20pt、水平方向はセンターで指定したいと思います。

![スクリーンショット 2017-10-09 18.15.34.png](https://qiita-image-store.s3.amazonaws.com/0/206492/a9f3c6d5-0f14-41cc-f086-b0deaa96095c.png)

今回は左右の余白を同じ値に変更し、センタリングを行いましたが、
他にもコンテナ内の要素を整列することでセンタリングを行えるようです。
整列は他の要素にも関係すると思いますので、自身で検証したいと思います。

今回は以上です。
ここまでご覧いただき、ありがとうございました。
[javascript]textarea内の文字をタグで囲む

# textarea内の文字をタグで囲む
## 仕様
- 任意のtextareaに対して文字を選択して適当なタグで囲む

## ソース

### HTML

```html:test_3.html
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="test_3.js"></script>
<title>test_3:textareaの文字をタグで囲む</title>
</head>
<body>
<textarea type="text" id="hoge" rows=10>
aaabbb
cccddd
eeefff
</textarea><br>
<input type="button" value="h1" class="tag">
<input type="button" value="h2" class="tag">
<input type="button" value="h3" class="tag">
</body>
</html>

```
### javascript

```javascript:test_3.js
$(function(){
  $('.tag').on('click',function(e){
    var v= $('#hoge').val();
    var selin = $('#hoge').prop('selectionStart');
    var selout = $('#hoge').prop('selectionEnd');
    var befStr="<"+$(this).val()+">";
    var aftStr="</"+$(this).val()+">";
    var v1=v.substr(0,selin);
    var v2=v.substr(selin,selout-selin);
    var v3=v.substr(selout);
    $('#hoge')
      .val(v1+befStr+v2+aftStr+v3)
      .prop({
        "selectionStart":selin+befStr.length,
        "selectionEnd":selin+befStr.length+v2.length
        })
      .trigger("focus");
  });
});
```
電話 API の Twillio を紹介してみる。

# 概要
先日参加した勉強会の中で、Twillio というサービスが紹介されて、これは良いものだと思ったので紹介してみたいと思います。
# Twillio について
Twillio とは 大雑把に言うと 電話の API です。

[日本の公式サイト](https://twilio.kddi-web.com/)

ざっくり何が良いかというと、通話をトリガーに **WebAPI** が簡単に実行できる！ というところが熱いです。
また、WebAPIのトリガーとなる電話番号も Twillio 上でリアルタイムに即時取得ができるところも凄いと思いました。
（※ただし、電話番号の利用には 数百円 / month の料金が発生します。)

Twillio の現状は 便利なAPI 群が適用されているだけで、その組み合わせの利用を作り込む必要があり
利用までの敷居が若干高いものとなっていたようなのですが・・・
勉強会で紹介された Twillio の新機能 **「Twillio Studio」** では、この組み合わせが GUI 上で作成できる機能が提供され、ドラッグ＆ドロップ と簡単な設定の記述だけで ものすごく簡単に作成ができるようになっていました。

「Twillio Studio」 の 操作イメージです。
![twilio-studio-1.gif](https://qiita-image-store.s3.amazonaws.com/0/132495/68f90d8d-6683-a621-62a5-fd864b2b2b4f.gif)
# Twillio の利用イメージ
Twillio Studio を使えば、次のようなものが簡単に作成できそうです。
## 音声ガイダンス機能
1. 電話を受けて音声ガイダンスを実行
2. 電話の番号ボタン選択で、選択に応じた音声ガイダンスの実行もしくは、電話転送

Twillio の GUI だけで作成可能です。
## 電話版 Amazon Dash 機能
1. 電話を受けて音声ガイダンスを実行
2. 電話の番号ボタン選択で、選択に応じた WebAPI 実行

WebAPI 実行までは GUI だけで作成可能です。
AWS Lambda に近いような機能が提供されていて、そこに WebAPI のコードを記述する必要があります。
## 電話で Slack 投稿 機能
1. 電話を受けて音声ガイダンスを実行
2. 音声で投稿チャンネルを選択
3. 発言内容を Input として、WebAPI 内容を投稿

通話内容を Input として処理できるためこんなこともできる。
## その他
自然言語理解機能も、今後リリースを予定しているそうで
ボタン操作ではなく、会話の内容を判断して適切な処理を呼び出すことが可能になるようです。
この機能を使うことで、よくサポートの音声案内などにあるような煩わしいボタン選択がなくなるかもしれません。

これが
>「音声案内を聞く」 -> 「音声案内を理解して、ユーザが担当部署を選択」 -> 「担当部署が応答」

こうなる？

>「問い合わせ内容を話す」 -> (自然言語を理解し、適切な部署に転送) -> 「適切な部署が応答」

## まだプレビュー版
Twillio Studio はまだ、プレビュー版で現在開発進行中のため、利用の申し込みをかなり制限しているそうなので
日本で実際に利用できるのはもう少し先になりそうです。
Twillio の中でも、かなり推し機能だと思うので、今後開催される Twillio の勉強会を探してみると先行で触れるチャンスがあるかもしれません。
Amazon Product Advertising APIをVCR化する

# お願い
[Troubleshooting Applications \- Product Advertising API](http://docs.aws.amazon.com/ja_jp/AWSECommerceService/latest/DG/TroubleshootingApplications.html)を読むと10秒に1リクエスト、1日に8,640リクエストと書いてありますが、3リクエストくらい送ると `You are submitting requests too quickly. Please retry your requests at a slower rate.` となり、2-3時間待たないと復活せず困っています。開発段階で売り上げが0の状態での中、ガシガシAPIを叩いているせいかなと思っています。この辺、知っている人がいればコメントください :bow:

# 背景
個人でAmazon Product Advertising APIを利用している。APIリクエスト上限数が厳しく、動作確認が手間なのでmock化したい。[webmockとvcrを利用してHTTPのmockを作成する \| Act as Professional](https://hiroki.jp/2013/02/14/6669/) を参考に進めた。

# やったこと
```app/model/book.rb
class Book < ApplicationRecord
  def self.find_or_create_by_isbn(isbn13)
    book = self.find_or_initialize_by(isbn: isbn13)
    if book.new_record?
      librarian = Librarian.new
      # https://github.com/r7kamura/rapa/ を使って
      # Amazon Product Advertising APIをコールしてresponse値をセットする処理
      librarian.register!(book)
    end
    book
  end
end
```

```spec/models/book_spec.rb
RSpec.describe Book, type: :model do
  describe "Add a new book" do
    context "with valid ISBN-13 code", :vcr do
      let(:book){ Book.find_or_create_by_isbn("9784822248970") }
      it "returns new record without any errors" do
        expect(book.isbn).to eq("9784822248970")
        expect(book.title).to eq("リーン・スタートアップ")
        expect(book.author).to eq("エリック・リース")
      end
    end
  end
end
```

# ハマったことと
2回目以降、 `An HTTP request has been made that VCR does not know how to handle` となり困った。調べて見ると、Amazon Product Advertising APIは `Signature` と `Timestamp` は可変値なので、無視してあげないと同一リクエストとしてみてくれない様。

## 対応
`match_requests_on` を追記してあげれば良さそうだが、 `vcr: { match_requests_on: [:method, uri_without_params] } do` みたいな書き方をしているコードが多く、冗長になるが嫌だった。spec_helper で `default_cassette_options` として設定してしまうことにした。

``` spec_helper.rb
uri_without_params = VCR.request_matchers.uri_without_param(:Signature, :Timestamp)
VCR.configure do |config|
  config.cassette_library_dir = "spec/cassettes"
  config.configure_rspec_metadata!
  config.debug_logger = File.open("log/vcr.log", "w")
  config.default_cassette_options = { match_requests_on: [:method, uri_without_params] }
  config.hook_into :webmock
end
```

# 課題
今後、VCR化したいAPIが増えた時にどうするかは別途考える必要がある。
DockerでCentOS7とnginxのインストール


# CentOS7のイメージ取得

まずはcentos:7のイメージを取得するために
下記コマンド実行
```ps1
docker pull centos:7
```
イメージ取得できているか確認
```ps1
> docker images
REPOSITORY          TAG                 IMAGE ID            CREATED             SIZE
centos              7                   196e0ce0c9fb        4 weeks ago         197MB
```

## イメージの起動 (コンテナの作成とアタッチ)

取得してきたcentos:7のイメージを起動する

```ps1
docker run -i -t centos:7 /bin/bash
```

`-t`でttyを割り当てて、`-i`で標準入力を開きっぱなしにする
ということのよう。

イメージを元に自動的にコンテナが作成される
合わせて作成されたコンテナにアタッチされて次のように表示が切り替わる

```bash
[root@ce008b8a8dce /]#
```

もうここから先はcentosの世界。

# nginxのインストールと確認

## nginxインストール

nginx公式サイト
https://nginx.org/en/linux_packages.html#stable
の情報をもとにnginxをインストールする

`/etc/yum.repos.d/nginx.repo`を下記内容で作成
```vim
[nginx]
name=nginx repo
baseurl=http://nginx.org/packages/centos/7/$basearch/
gpgcheck=0
enabled=1
```

追加後yumでインストールする
```bash
[root@ce008b8a8dce /]# yum -y install nginx
```

nginxの起動
```bash
[root@ce008b8a8dce /]# systemctl start nginx
Failed to get D-Bus connection: Operation not permitted
```
権限が無いと怒られた。
Dockerでアタッチする際に管理者権限が必要になる様子

一旦デタッチして(`exit`で抜ける)

## 権限追加してコンテナを起動

停止したコンテナのIDを確認

```ps1
docker ps -a
```
```ps1
CONTAINER ID        IMAGE               COMMAND             CREATED             STATUS                      PORTS               NAMES
ce008b8a8dce        centos:7            "/bin/bash"         About an hour ago   Exited (1) 11 seconds ago                       goofy_carson
```

権限追加して`docker run`をしたいので
今作業していたコンテナから新しくイメージを作成して
改めて`docker run`をする形にする。

### コンテナイメージの作成

`docker commit`コマンドでコンテナイメージを作成
(yk_nginxはイメージ名なので適当に設定)
```ps1
docker commit ce008b8a8dce yk_nginx
```
イメージが作成できているか確認
```ps1
> docker images
REPOSITORY          TAG                 IMAGE ID            CREATED             SIZE
yk_nginx            latest              d4f816fd1a00        18 seconds ago      274MB
centos              7                   196e0ce0c9fb        4 weeks ago         197MB
```

### nginxの起動

作成した新しいイメージを今度は権限追加して
ついでにポートも設定(8080ポートをコンテナの80番ポートに紐づける)して起動する。
コンテナにアクセスしやすいようにnameも設定しておく(nginx)

この際起動を`/bin/bash`ではなく`/sbin/init`で行うので
`-it`オプションは付けずに`-d`でバックグラウンドで起動して
起動後に`docker exec`コマンドでbashを実行する

```ps1
docker run --name nginx --privileged -p 8080:80 -d  yk_nginx /sbin/init
docker exec -it nginx bash
```

再度nginxの起動
```bash
[root@9761ef13d58d /]# systemctl start nginx
```
特にエラー無く起動できたので
確認をする

ブラウザを立ち上げて
http://localhost:8080
にアクセス。

無事nginxのwelcome画面が表示された。

ちなみに`-d`で起動しているので
上記のexecで実行したプロセス(bash)を終了しても
dockerのコンテナ事態は停止しないため
コンテナを停止する場合には
`docker stop`コマンドで停止する必要がある。

### 古いコンテナの削除

イメージ作ったので古いコンテナは削除しておく。

```ps1
docker rm ce008b8a8dce
```


参考
[CentOS7 に nginx導入](https://qiita.com/MuuKojima/items/afc0ad8309ba9c5ed5ee)
[CentOS 7のDockerコンテナ内でsystemdを使ってサービスを起動する](https://qiita.com/yunano/items/9637ee21a71eba197345)
[Dockerの作業済みコンテナからイメージを作って移植を楽にする](https://qiita.com/tubone/items/a3bad04abf4c700cae3d)
[Dockerでつくる開発環境【nginxコンテナ編】](http://blog.flup.jp/2016/02/12/devenv_nginx_with_docker/)
[swift] 端末のバージョンを比較

# 端末のバージョンを比較
アプリに重大なバグが見つかった時など，アプリ起動時にアップデート通知をしたいですよね．何が起こるか分からないので，appStoreにアップロードする前に，実装しておきたいところです．端末のバージョンと最新のバージョンの比較メソッドは，今後いつも使うと思うのでメモとして残しておきます．

# ビルドのバージョンを取得
以下のコードで，buildのバージョンを取得できます．
`let version = Bundle.main.object(forInfoDictionaryKey: "CFBundleShortVersionString") as? String`



# 最新のバージョンと比較
最新のbuildバージョンをサーバーから取ってきたとします．splitして比較してあげたら楽ですね．

```swift:version.swift
enum currentVersionStatus {
    case lastest
    case old
    case error
}

func compareVersion(lastest: String, current: String) -> currentVersionStatus {
    let lastest_split = lastest.components(separatedBy: ".")
    let current_split = current.components(separatedBy: ".")
    for (l, c) in zip(lastest_split, current_split) {
        if let lastInt = Int(l), let currentInt = Int(c) {
            if currentInt < lastInt { return .old }
            else if currentInt > lastInt { return .lastest }
        } else { return .error }
    }
    return .lastest
}

let lastestVersion = "2.0.5"
let currentVersion = Bundle.main.object(forInfoDictionaryKey: "CFBundleShortVersionString") as! String
compareVersion(lastest: lastestVersion, current: currentVersion)

// example
compareVersion(lastest: "1.0.5", current: "1.0.2") // => old
compareVersion(lastest: "2.0.5", current: "1.0.10") // => old
compareVersion(lastest: "2.1.3", current: "2.1.3") // => lastest
compareVersion(lastest: "3.1.7", current: " ") // => error

```
RailsでC3.jsを使う

RailsでC3.jsというグラフ描画機能を使う。こんな感じ。

<img width="481" alt="ss 2017-10-16 20.12.48.png" src="https://qiita-image-store.s3.amazonaws.com/0/80357/5b0bdee4-9328-34d3-5d31-8bc2972778c8.png">


`Gemfile`に以下を追加

```rb
gem 'c3-rails'
gem 'd3-rails', '~> 3.5.17'
```
※ はじめ、d3のバージョンを指定せずにインストールしたら動かなかった。以下によるとD3のバージョンを3系するとうまくいくとのこと。
https://stackoverflow.com/questions/38344643/c3js-cannot-read-property-category10-of-undefined

`applicaton.js`に以下を追加

```
//= require d3
//= require c3
```

`application.css`に以下を追加

```
 *= require c3
```

描画したいviewに以下を追加

```html
<div class="well">
  <span>グラフ</span>
  <div id="chart"></div>
</div>

<script type="text/javascript">
var chart = c3.generate({
    bindto: '#chart',
    data: {
      columns: [
        ['data1', 30, 200, 100, 400, 150, 250],
        ['data2', 50, 20, 10, 40, 15, 25]
      ]
    }
});
</script>
```

以上。
LombokをSpringで利用するには

SpringにLombokを利用するにあたり調べたことをメモする

# ライブラリとして追加する
pom.xmlへ以下のように指定する

```xml
<dependencies>
  <dependency>
    <groupId>org.projectlombok</groupId>
    <artifactId>lombok</artifactId>
    <version>1.18.8</version>
    <scope>provided</scope>
  </dependency>
</dependencies>
```

## 参考
[公式](https://projectlombok.org/mavenrepo/)

# 利用上の注意事項
@Dataを使うのではなく、必要な分だけ使うこと
（追記：
「@Getter, @Setter, @ToString, @EqualsAndHashCode, @RequiredArgsConstructor」をまとめて付与することになるため。そこを理解した上で利用するのであれば何の問題もありません。
）

@toStringを相互関係のあるクラスで利用する際には無限ループするので、exclude属性をつけて回避すること

## 参考
[Lombok 使い方メモ](https://qiita.com/opengl-8080/items/671ffd4bf84fe5e32557)
[Spring BootでLombokを使ってみたら楽だった](http://bufferings.hatenablog.com/entry/2016/12/09/074416)

# 開発環境の構築（Mac）

## 前提
* Mac：macOS Sierra 10.12.5
* Eclipse：Eclipse Java EE IDE for Web Developers.  
Oxygen Release (4.7.0)
* Lombok：1.16.18

* MacではLombokのインストーラがうまく動作しなかった

## 手順
1. Lombokを公式からダウンロード  
https://projectlombok.org/download
2. ダウンロードしてきたファイル（lombok.jar）をEclipseのインストール場所に設置  
場所：/Applications/Eclipse_4.7.0.app/Contents//MacOS
3. Eclipseの設定ファイルにパスを記述  
設定ファイル：/Applications/Eclipse_4.7.0.app/Contents/Eclipse/eclipse.ini  
記述内容：下記を最下部へ追加

```
-javaagent:lombok.jar
-Xbootclasspath/a:lombok.jar
```

## 参考
[eclipse mars/neon on mac で lombok インストーラが動かない時の対処法](https://qiita.com/satty3104/items/42fc67a7e9fca0f807a9)

# 疑問
## pom.xmlでのscopeの指定について
scopeにprovidedを指定している。
理由としては、Lombokはコンパイル時にソースを解析して定型コードを生成し
それをコンパイラに渡すことで機能を実現しており、生成後は必要がなくなるため。
詳しくは以下がとても参考になりました。

## 参考
[誰も教えてくれなかったLombokのこと](http://www.coppermine.jp/docs/notepad/2014/01/lombok.html)


# 追記（2019/9/6）
プロジェクトをMavenビルドしようとしたところ下記のエラーが表示されました。
`java.lang.ClassNotFoundException: com.sun.tools.javac.code.TypeTags`
調べたところBugのようで既に対策済みでしたので、1.16.22指定すればエラーは解消されました。
JDK10で発生するとありましたが、1.8でも同様に発生しました。
[Github:lombok](https://github.com/rzwitserloot/lombok/issues/1651)
pom.xmlのバージョンを`1.16.18`から`1.18.8`へ変更しました。
pytorchでマルチGPU

pytorchでGPU2つ以上使う方法
日本語で書いてる記事が少なかったから投稿

```multiGPU.py
import torch.nn as nn

#modelの定義した後に
model = nn.DataParallel(model).cuda()
```
modelにAlexnetなりResnetなりを読み込ませた後nn.DataParallelでラップしてあげるだけでマルチGPU使用可能
時間のかかるMakefileで重複処理を防止する

Makefile 便利ですよね
僕はcronと併せて使っています

こんな感じです

```crontab:crontab
*/5 * * * * make sync
5 * * * * make clean
```


```Makefile:Makefile

sync:
    rsync -auz /opt/data remotesite:/opt/remote-data/

clean:
    find /opt/data -mtime +3 -type f -exec rm {} \;
```

でもひとつ困ったことがあって
rsync に予想以上の時間がかかったりすると
処理が終わらないうちに次のサイクルでcron処理がスタートしたりして
いつのまにかプロセスが以上に大量発生してしまう事なんです。
そうすると負荷が異常に大きくなってログインできなくなったりフリーズしてしまったりします。

なので make sync が実行された時に重複して実行されるのを防止したいわけです。

試行錯誤の末　今は次のような方法に落ち着いています

```Makefile:Makefile

sync:
    kill -0 `tail -1 sync.pid` || $(MAKE) sync_do

sync_do:
    ps -p $$$$ -o ppid > sync.pid
    rsync -auz /opt/data remotesite:/opt/remote-data/


clean:
    find /opt/data -mtime +3 -type f -exec rm {} \;
```

make sync_do を実行するときのPID が sync.pid に保存されるので　そのプロセスが生きているかどうかで重複の判定を行っています

似たような状況は色々あって重複実行を防ぎたいケースってちょくちょくあります
厳密なやり方もあるのでしょうが、簡単な方法が欲しい場合もありますよね？
Makefile 以外にも bash スクリプトでもできます