OmniAICreator/Qiita-1.07M huggingface dataset:
ARKit基礎まとめ - 平面検出して3Dオブジェクトを置く

## ARKit基礎
2018年もあと1時間で終了です。
今年は、ARのデモアプリをいくつか作ったりしましたが、AppStoreに出す程のアプリがまだ開発できていない事が心残りです。

来年こそ、ARKitを使いこなしていきたいと思っているのですが、UIKitほどまだ仲良くなれていない感じがするので、今更ながらARKitの基本的な使い方や作法をまとめて復習していきます。

## 平面検出して3Dオブジェクトを置く
デモで一番良くみる平面検出して、3Dオブジェクトを置くやつ。

最低限のコードで平面検出 + 3Dオブジェクト配置を実装するには以下の様な流れになります。

- ARSCNViewの設定(水平面を検出する設定)
- 3Dオブジェクト取り込み用のメソッドの準備(今回はdaeファイル)
- ARSCNViewDelegateのメソッドで3Dオブジェクトを配置

### ARSCNViewの設定

```swift:ViewController.swift
class ViewController: UIViewController {

    @IBOutlet var sceneView: ARSCNView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // Set the view's delegate
        sceneView.delegate = self

        // fps情報などを表示
        sceneView.showsStatistics = true

        // デバッグ用に特徴点を表示
        sceneView.debugOptions = ARSCNDebugOptions.showFeaturePoints

        //Viewに初期化したsceneをセット
        sceneView.scene = SCNScene()
    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)

        // Sessionの設定
        let configuration = ARWorldTrackingConfiguration()

        // .horizontalで水平面 (.verticalだと垂直面を検知)
        configuration.planeDetection = .horizontal

        //空間から光の情報を取得し画面上のライトの情報に適応
        configuration.isLightEstimationEnabled = true

        // sessionをスタート
        sceneView.session.run(configuration)
    }

    override func viewWillDisappear(_ animated: Bool) {
        super.viewWillDisappear(animated)

        // sessionをストップ
        sceneView.session.pause()
    }

```
### 3Dオブジェクト取り込み用のメソッド
dae形式のファイルを取り込み
こちらの3Dモデルを利用させていただきました。
[Beer bottle](https://www.turbosquid.com/3d-models/free-beer-bottle-3d-model/901639)

```swift:ViewController.swift
    func load3dObject() -> SCNNode {
        let url = Bundle.main.url(forResource: "3d.scnassets/bottle", withExtension: "dae")!
        let sceneSource = SCNSceneSource(url: url, options: nil)!
        let virtualObjectNode
            = sceneSource.entryWithIdentifier("bottle", withClass: SCNNode.self)!
        return virtualObjectNode
    }
```
### ARSCNViewDelegateのメソッドで配置
平面を新たに検知した際に、呼ばれるrenderer(_:didAdd:for:)で、検知したNodeに3DオブジェクトのNodeを追加

```swift:ViewController.swift
    func renderer(_ renderer: SCNSceneRenderer, didAdd node: SCNNode, for anchor: ARAnchor) {
        node.addChildNode(load3dObject())
    }
```
### 結果
シャドーやライトを調整しないとあまりリアリティが出ないですね。
あと、特徴量の少ない真っ白な床とかは、うまく検出できません。
アプリ化する際には、インストラクションをうまく作らないとユーザにストレスを与えてしまいそうです。

<img width="375" alt="IMG_0486.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/321030/dd5417e9-e3f8-6650-9370-49d0ddac3c67.png">
1ヶ月以前のファイルを削除するシェル【実装/テスト】

# 蓄積していくバックアップファイル
毎日実行するシェル。そして毎日蓄積されるバックアップファイル...:disappointed_relieved:
塵も積もれば山となる、ということで
ファイルを1か月分だけ残して削除するシェルを作成しました

# 作成したシェル
```shell:deleteForOneMonth.sh
#!/bin/sh
find hoge_path/ -mtime +31 -name "*.xlsx" -delete
```

find [検索をするディレクトリのパス] -mtime +[日数] -name [削除したいファイル名] -delete

## -mtime　
データが最後に修正された日時を日指定する

|+n|-n|
|:--:|:--:|
|n日以上|n日以下|

## -delete
 `| xargs rm　`　よりもシンプルに書けます

# 補足①：権限をつけるのを忘れずに:bulb:

```console
$ chmod 755 deleteForOneMonth.sh
```

# 補足②：動作確認の時に:bulb:

シェルを作成した後には動作確認もしたいです
動作確認用にファイルを作成し、作成日時を過去の日付に書き換えて
シェルのテストを行いました

```console
$ touch -t yyyymmddHHMM <ファイル名>
```
PRMLの3章の式(3.89)の右辺第二項目の導出方法について

PRMLの3章の式(3.89)の右辺第二項目の導出が本文中では書いてないが、割と導出するのにわりと頭を使うので、備忘録も兼ねて記しておく。

## 導出方法
式(3.89)はエビデンス関数の対数(3.86)の$\alpha$に関する停留点の式であり、式(3.89)の右辺第二項目は(3.86)の右辺第三項目からくる。
つまり、以下を示せばいい。

```math
\frac{\partial }{\partial \alpha}E(\boldsymbol{\mathrm{m}}_{N})=\frac{1}{2}\boldsymbol{\mathrm{m}}_{N}^{\mathrm{T}}\boldsymbol{\mathrm{m}}_{N}　\tag{*}
```

ここで、$E(\boldsymbol{\mathrm{m}}_{N})$は式(3.79)より、

```math
E(\boldsymbol{\mathrm{m}}_{N})=\frac{\beta}{2}\|\boldsymbol{\mathrm{t}} - \boldsymbol{\mathrm{\Phi}}\boldsymbol{\mathrm{m}}_{N}\| ^{2}+\frac{\alpha}{2}\boldsymbol{\mathrm{m}}_{N}^{\mathrm{T}}\boldsymbol{\mathrm{m}}_{N}
```

である。
ここで重要なことは、

```math
\frac{\partial }{\partial \alpha} \bigg(\frac{\alpha}{2}\boldsymbol{\mathrm{m}}_{N}^{\mathrm{T}}\boldsymbol{\mathrm{m}}_{N}\bigg)\ne \frac{1}{2}\boldsymbol{\mathrm{m}}_{N}^{\mathrm{T}}\boldsymbol{\mathrm{m}}_{N}
```

であるということである。つまり、$\boldsymbol{\mathrm{m}}\_{N}$は$\alpha$に依存するということである。実際に、$\boldsymbol{\mathrm{m}}\_{N}$は式(3.84)で定義されていて、式(3.84)の右辺の$\boldsymbol{\mathrm{A}}$は式(3.81)より$\alpha$に依存するから、$\boldsymbol{\mathrm{m}}\_{N}$は$\alpha$に依存する。
よって、$E(\boldsymbol{\mathrm{m}}\_{N})$は$\alpha$に陽にも依存しているし、$\boldsymbol{\mathrm{m}}\_{N}$を通しても依存している。この二つの依存の仕方を考慮すると、$E(\boldsymbol{\mathrm{m}}_{N})$の$\alpha$微分は

```math
\frac{\partial }{\partial \alpha}E(\boldsymbol{\mathrm{m}}_{N})=\frac{1}{2}\boldsymbol{\mathrm{m}}_{N}^{\mathrm{T}}\boldsymbol{\mathrm{m}}_{N} + \bigg(\frac{\partial E(\boldsymbol{\mathrm{m}}_{N})}{\partial \boldsymbol{\mathrm{m}}_{N}}\bigg)^{\mathrm{T}}\frac{\partial \boldsymbol{\mathrm{m}}_{N}}{\partial \alpha}\tag{**}
```

と書ける。式(\*\*)の右辺第一項目は$E(\boldsymbol{\mathrm{m}}\_{N})$の$\alpha$に陽に依存する部分からの寄与で、右辺第二項目は$E(\boldsymbol{\mathrm{m}}\_{N})$の$\alpha$に$\boldsymbol{\mathrm{m}}\_{N}$を通して依存する部分からの寄与である。
式(\*)が成立するには、式(\*\*)の右辺第二項目はゼロであるべきで、実際にゼロである。
その理由は、式(3.77)の右辺の$p(\boldsymbol{\mathrm{t}}|\boldsymbol{\mathrm{w}}, \beta)p(\boldsymbol{\mathrm{w}}| \alpha)$は$\boldsymbol{\mathrm{w}}$の事後確率に比例し、式(3.51)の直下の文章より、その事後確率を最大にする重みベクトルは$\boldsymbol{\mathrm{w}}_{\mathrm{MAP}} = \boldsymbol{\mathrm{m}}\_{N}$であることがわかっているので、この事実と式(3.77)と式(3.78)より、

```math
\frac{\partial E(\boldsymbol{\mathrm{m}}_{N})}{\partial \boldsymbol{\mathrm{m}}_{N}} = \frac{\partial E(\boldsymbol{\mathrm{w}})}{\partial \boldsymbol{\mathrm{w}}} \bigg| _{\boldsymbol{\mathrm{w}} = \boldsymbol{\mathrm{m}}_{N}}  = \boldsymbol{0}
```
となるので、式(\*)が成立するということである。
ちなみに、(3.94)の右辺第二項目も同様の議論で示すことができます。

## 別の導出方法
式(\*\*)の導出までは上と一緒の議論で、そこから別の方法で示すこともできます。
それは式(3.80)を用いて

```math
\frac{\partial E(\boldsymbol{\mathrm{m}}_{N})}{\partial \boldsymbol{\mathrm{m}}_{N}} = \frac{\partial E(\boldsymbol{\mathrm{w}})}{\partial \boldsymbol{\mathrm{w}}} \bigg| _{\boldsymbol{\mathrm{w}} = \boldsymbol{\mathrm{m}}_{N}}  = (\boldsymbol{\mathrm{w}}- \boldsymbol{\mathrm{m}}_{N})^{\mathrm{T}}\boldsymbol{\mathrm{A}}\bigg| _{\boldsymbol{\mathrm{w}} = \boldsymbol{\mathrm{m}}_{N}}= \boldsymbol{0}
```

より、式(\*)が成立するというものです。
こっちの方が導出は簡単ですが、無駄な計算をしない最初の導出の方がかっこいいですねww
もちろん式(3.94)の右辺第二項目も同様に示すことができます。

## 最後に
PRMLは全体的に行間(計算過程)をしっかり埋めてくれているのに、なぜここだけさらっと流しているのだろうか。。。
KotlinとFirebaseでログイン中のユーザのUIDを取得する

アプリを起動している時にuidをもとに画面の表示を制御したい場合とかに使えそう

```kotlin
import com.google.firebase.auth.FirebaseAuth
// ...
private lateinit var auth: FirebaseAuth
// ...

auth = FirebaseAuth.getInstance()
val user = auth.currentUser

if (user != null){
    val uid = user.uid
}
```

currentUserでいまログインしているユーザを捉えて
uidを取得する
（null安全なのでif文が必要みたい）

他にも
・displayName
・email
・photoURL
・emailVerified
とかのプロフィール情報が取得できる。
WebRTCで取得したビデオを画像にする


こんな雰囲気で定期的に映像を画像化してimg要素に入れ込むのをやってみます。

<img src="https://i.gyazo.com/86da1d7ffafbd082c986e7ba03aeee98.gif" width="400">

画像化できると色々と応用が出来るのでとりあえず作ったサンプルを元に画像化してみます。

* [SkyWayのサンプルをVue.jsで書いていくチュートリアル vol1](https://qiita.com/n0bisuke/items/6e1f56678b2eb6318594)
* [SkyWayのサンプルをVue.jsで書いていくチュートリアル vol2](https://qiita.com/n0bisuke/items/509e9c0e2517fe559536)

元となるコードは[こちら](https://gist.github.com/n0bisuke/88be07a6a16ee72b9bdf4fdcd12a522f)です。まずは手元で動かしてみましょう。

## 相手から送られてきた映像を画像化

画像化はVideo要素 -> Canvas要素 -> img要素といった形で進めます。

完成がこんな感じです

<img src="https://i.gyazo.com/4f927ecde22b9a3678157f054c0ba503.gif" width="400">

分かりにくいですが、

* 上段左: video要素(相手側の映像)
* 上段真ん中: canvas要素
* 上段右: img要素
* 下段: video要素(自分の映像)

となっています。

```index.html
        <video id="their-video" width="200" autoplay playsinline></video>
        <canvas id="canvas"></canvas><!--canvas要素-->
        <img id="img" width="400px" height="300px" /><!--img要素-->
        <video id="my-video" muted="true" width="500" autoplay playsinline></video>
```

また、[サンプルコード](https://gist.github.com/n0bisuke/88be07a6a16ee72b9bdf4fdcd12a522f)に追記する形になりますが、methodsの中にcreateImage関数を用意します。

canvasにVideo要素の中身を流し込み、最後にimgタグに流し込みます。

```app.js
        createImage: function(){
            const canvas = document.getElementById('canvas');
			const ctx = canvas.getContext('2d'); //canvasの描画モードを2Dに指定
            const img = document.getElementById('img');
            
            //videoの縦幅横幅を取得
            const videoElm = document.getElementById('their-video'); //相手側の映像要素
			const w = videoElm.offsetWidth;
            const h = videoElm.offsetHeight;
            canvas.setAttribute("width", w);
            canvas.setAttribute("height", h);
            
            ctx.drawImage(videoElm, 0, 0, w, h);
            img.src = canvas.toDataURL('image/png');
        }
```

あとはcreateImage()の発火をconnect内部などに追記すればOKです。

```
 connect: function(call){
            call.on('stream', stream => {
                const el = document.getElementById('their-video');
                el.srcObject = stream;
                el.play();
                setInterval(() => this.createImage(), 1000); //追記 createImage関数を1秒ごとに呼び出す
            });
        },
```

## 自分の映像のみの場合

相手側がなく、自分の手元の映像を扱いたい場合はtheir-videoをmy-videoにすればOK

```app.js
const videoElm = document.getElementById('their-video');       
```

↓に変更

```app.js
const videoElm = document.getElementById('my-video');
```

この場合は相手と接続しなくて良いのでSkyWayなど利用しなくても出来ます。
Ruby 使いがビビった Rust の -1_i32.abs()

Ruby の

```rb
-1.abs
```

は，`Integer` リテラル `-1` の `abs` メソッド（絶対値を取る）を呼び出している。結果は `1`。

Rust の

```rust
-1_i32.abs()
```

は `1` ではなく `-1` になる，と。
（`_i32` は符号付き 32 bit 整数であることを表している）

マジかよ。

これは，Rust の場合，単項前置演算子よりメソッド呼び出しのほうが優先順位が高いからだそう。（『プログラミング Rust』p. 49）

ほえ〜

Ruby の `-1.abs` の `-` は単項演算子ですらない。リテラルの一部。

（追記 2019-01-01）というか，Ruby でこの `-` がもし単項演算子だったら，Ruby でもメソッド呼び出しのほうが優先順位が高いから Rust と同じ結果になったよね。
ScalaとJavascriptを使って関数型プログラミングを簡単に説明してみる。

今年2018年最後は、関数型プログラミングについてのアウトプットです。拙いアウトプットですが、ご指摘等お待ちしております。

##関数型プログラミングとは
関数型プログラミングとは、解決しようとする問題をその問題に対して、その問題の性質を関数の組み合わせで記述するプログラミング手法。

これでは、全然自分は理解できなかったので、javascriptとScalaで実際に比べてみました。

ちなみに今回は、種別(category)と価格(price)のリストの合計金額を計算するプログラムを書きます。


##javascriptで関数型っぽく書かずにやってみると・・

```javascript
function Menu(category,price){
  this.category = category
  this.price = price
};

var fish = new Menu("fish",200);
var pizza = new Menu("pizza",400);
var sushi = new Menu("sushi",100);

arr = [sushi,pizza,fish]
function totalFoodsPrice(arr){
  totalPrice = 0;
  for(var i = 0; i < arr.length; i++ ){
      if(arr[i].category){
        totalPrice += arr[i].price;
      }
  }
  console.log(totalPrice);
}
totalFoodsPrice(arr)


```

上記のtotalFoodsPriceメソッドに注目してください。
このメソッドは、商品リストの受け取る事を仮定して、その商品の価格の合計を出力するメソッドです。
ここで関数型っぽい書き方ではない点挙げられるのは

・　変数totalPriceという現在の価格を関数内で一旦「状態」を初期化して、その状態をfor文とif文を使い状態を変化させつつ、値を出力している点。

・変数iも、ループが行われるごとに、i++という命令文によって、変数iという「状態」を変化させながら、配列を繰り返し処理している点。

関数型では、問題を解決しようとする問題に対して変数や値、オブジェクト等を「状態」を変化させずに、関数の組み合わせのみで解決していきます。では、関数型プログラミングが推奨されているScalaではどうなるでしょうか

##Scalaで関数型プログラミング

```scala
case class Item(category: String, price: Int)

object myapp {

  def totalFoodsPrice(itemList: List[Item]): Int = itemList match {
    case Nil => 0
    case Item(_ , price) :: otherItems => price + totalFoodsPrice(otherItems)
    case _ :: otherItems => totalFoodsPrice(otherItems)
  }

  def main(arg: Array[String]) :Unit = {
    val items = List[Item](
      Item("fish",200),
      Item("pizza",400),
      Item("sushi",100)
    )
    println(totalFoodsPrice(items))
  }
}
```

これも上記のtotalFoodsPriceメソッドに注目してください。
このメソッドは、商品リストを受け取り、その食品リストの合計を計算しています。
上記の処理と結果は変わりません。

また、「状態」main関数内で定義してはいますが、処理中に、一切その変数や値の「状態」を変化させていません。
この違いが命令型プログラミングと関数型プログラミングの違いのようです。

「状態」をプログラムの中で扱い、変化させていくことは、プログラムの動作をわかりづらくさせたり、テストやデバックを困難にする原因となります。（やたらと変数も多くなるイメージある・・）
これを避けて、プログラムの状態を変化させない関数を作成して、これを組み合わせて問題解決を行う手法が、関数型プログラミングのようです。

なお、関数型言語と呼ばれるものは、基本的に、関数型プログラミングが推奨されている言語の事で、関数型プログラミングがしやすいよう言語設計がされています。
しかし、関数型言語と呼ばれない言語でも、関数型っぽく書く事はできますので、認識の違いにご注意ください。
（自分もここで認識の違いがありました・・・）

他にも関数型プログラミング言語のメリットやデメリットはわかりやすく下記のリンクに記載されていますので、ご確認ください。

https://techacademy.jp/magazine/16381

では、良いお年を・・
【Looking Glass】ノートPCでLooking Glassが認識されない

#はじめに

Looking Glass面白いですね！面白いんです！

ただ実物を見ないとその魅力が伝わらないのでC95でデモの展示を行いました。
まずは協力してくださったEasyGameStationさんに感謝です。

![181230_C95LGデモ.jpg](https://qiita-image-store.s3.amazonaws.com/0/227733/82edff0b-26c5-0e9d-83a3-992001b22666.jpeg)

実物を見て「スゴイ！」や「大したことない」等色々感じたと思いますが、ちょっとでも気になった方は以下のサイトをチェックしてみてください。

Looking Glassの公式サイト
https://lookingglassfactory.com/
日本語販売サイト
https://lookingglassfactory.com/product/the-looking-glass-jp/

#Looking Glassつながった？

Looking Glassを入手しても、PCがLooking Glassを認識できないと何も始まりません。

おそらくほとんどのデスクトップPC＋ビデオカードの組み合わせなら問題なく認識され、すぐにLooking Glassが使えるようになると思います。
認識すれば後はUnity＋HoloPlay SDKでLooking Glass用のアプリを作るだけです！もうここから先は読まず Unity Editorを開いてください！Let's enjoy Looking Glass！

#つながらない…

デスクトップPCで展示用のデモを作り、いざノートPCでデモを実行しようとするとLooking Glassが認識されない…だと！？

結果から言えば12/28の段階で手元にあるノートPC・変換アダプターの組み合わせでは全滅で、デモ前日にダメ元で買った変換アダプター<b>「AD-ALCHVDVDP」だけがLooking Glassを認識してくれました。</b>ありがとうサンワサプライ！

もしかしたら同じ問題に遭遇する人がいるかもしれないので、調べた結果を残しておこうと思います。

【補足】
前提として基本的に全て出力端子から3k解像度以上のモニタに接続は出来ています。
また、あくまでもLooking Glassを認識するかの検証なので、Looking Glassの推奨動作スペック「Core i5＋GTX1060以上」を満たしていないノートPCも含まれています。

| PC | GPU | 出力 | 変換アダプター|Looking<br>Glass|
|:---:|:---:|:---:|:---:|:---:|
|デスクトップPC|GTX<br> 1060|HDMI||<b>OK</b>|
|||DVI||<b>OK</b>|
|Surface Book2|GTX<br> 1060|USB<br>Type C|HFM-00006|NG|
|||USB<br>Type C|AD-ALCHVDVDP|<b>OK</b>|
|Surface Pro4|Intel Iris<br> Graphics<br>540|DP|AMC-DPHD20|NG|
|MSI GS60<br>(2QE-234JP)|GTX<br> 970M|HDMI||NG|
|||DP|AMC-DPHD20|NG|
|MSI GS40(6QE)|GTX<br> 970M|HDMI||NG|
|||USB<br>Type C|AD-ALCHVDVDP|<b>OK</b>|

|変換アダプター|スペック|
|---|---|
|HFM-00006|Microsoft純正USB Type C-HDMI変換アダプター<br>HDMI2.0/4K対応|
|AD-ALCHVDVDP|サンワサプライのUSB Type C-HDMI/VGA/<br>DVI/DisplayPort変換アダプター<br>HDMIは最大4K/30Hz、DisplayPortは4K/60Hz対応|
|AMC-DPHD20|アイネックスのDP-HDMIアクティブケーブル<br>4k/60Hz対応|

気になるのはMSIノートが2台とも本体HDMIではLooking Glassを認識しなかったことです。真っ先に上手くいくと思う接続なんですけどねぇ…

※あくまで個人の環境での検証のため個体差等もあるかもしれません。実際Surface Book2 13'（GTX1050）は「HFM-00006」で認識出来たという報告を頂いてます。

# 次は

実際にデモで使ったアプリをUnityでどう作ったか書こうと思います。

今すぐ作り始めたい方は以下のサイトを参考にするといでしょう。

UnityではじめるLooking Glass
http://tks-yoshinaga.hatenablog.com/entry/looking-glass

Looking glass + leap motionアプリ開発メモ
https://www.slideshare.net/YuichiIshii/looking-glass-leap-motion-126929745
Ubuntu18.04 LTSにSublime Text3をインストールして日本語化／日本語入力対応を行う

# はじめに
UbuntuにSublime Text3をインストールして日本語化、日本語対応までやったので、自分用のメモとしてまとめておきます。

#### 本記事でやること
・Ubuntu18.04 LTSにSublime Text3をインストールする
・インストールしたSunlime Text3をJapanizeで日本語化する
・SublimeMozcInputで日本語入力に対応する

# Sublime Text3のインストール手順
下記サイトを参考にさせていただきました。
参考：
・https://www.sublimetext.com/docs/3/linux_repositories.html
・https://www.karelie.net/how-to-install-sublime-text-3-on-ubuntu/

まずは、署名鍵（GPG key）をwgetでダウンロードします。

```
wget -qO - https://download.sublimetext.com/sublimehq-pub.gpg | sudo apt-key add -
```

次に、Ubuntu本体にSublimeのリポジトリを追加します。
今回は、安定版（Stable）を追加することにします。

```
echo "deb https://download.sublimetext.com/ apt/stable/" | sudo tee /etc/apt/sources.list.d/sublime-text.list
```

ここで一度、更新をしておきます。

```
sudo apt-get update
（sudo apt-get upgrade）
```

後は、追加したSublime Text3をインストールすればOKです。

```
sudo apt-get install sublime-text
```

# Sublime Text3の日本語化
日本語化の手順は以下の通りです。
１．Package Controlのインストール
２．Japanizeのインストール
３．Defaultディレクトリの追加

## Package Controlのインストール
まずは、[Package Control](https://packagecontrol.io/)に行き、右上の「Installation」をクリックします。

すると、「Simple」と「Manual」の2通りのインストール方法が表示されているはずです。
今回は、「Simple」のインストール方法のみ記載します。

### Simpleでのインストール
「Simple」の「Sublime Text3」タブを選択し、表示されているコマンドをコピーします。
その後、Sublime text3を起動し、「View」タブの「Console」を選択します。
すると画面下に入力欄が表示されるので、そこに先ほどコピーしたコマンドをペーストし、ENTERで実行します。
実行が終わったら、「Preferences」タブを確認してください。
「Package Control」がある場合、Package Controlはインストールできたことになります。

## Japanizeのインストール
日本語化には、Japanizeのパッケージを使用します。
まずは、「Preference」タブの「Package Control」を選択します。
すると入力欄が表示されるので、そこに「Install Package」と入力し、下記に出てきた「Install Package」を選択します。
続いて「Japanize」と入力し、同様に出てきた「Japanize」を選択することで、インストールを開始します。


インストール後、Sublime Text3の上部のタブは日本語化されていますが、タブの中の選択肢は日本語化されていません。
そこで、次の手順で日本語化を適用します。

#### １．指定箇所にDefaultディレクトリを作成
下記の場所に移動します。（今回はUbuntu環境です。）

```
cd ./.config/sublime-text-3/
```

すると、「Japanize」のディレクトリがあり、「Default」ディレクトリは存在しないはずです。
そこでまずは、この場所にDefaultディレクトリを作成します。

```
mkdir Default
```

#### ２．.jpファイルをDefaultディレクトリにコピー
次に、Japanizeディレクトリに中にある.jpファイルを、全てDefaultディレクトリにコピーします。

#### ３．.jpの拡張子を削除する
最後に、コピーした.jpファイルの拡張子（.jp）を削除してRenameします。

これらの手順を踏んだ後、Sublime Text3を再起動すると、タブの中まで日本語化されているはずです。

# 日本語入力対応
最後に、日本語入力に対応させたいと思います。
以下のサイトを参考にさせていただきました。
参考：https://qiita.com/shyamahira/items/c427508c05d2d2e13628

まずは、Mozcをインストールしておきます。

```
sudo apt-get install ibus-mozc
sudo apt-get install emacs-mozc
```

次に、Package ControlでSublimeMozcInputをインストールします。
SublimeMozcInputがない場合は、Package ControlのAdd repositoryにて、下記のURLを入力します。

```
https://github.com/yasuyuky/SublimeMozcInput
```

Ctrl+\で日本語が入力できれば、日本語化は成功です。

以上で、Sublime Text3のインストール、Japanizeでの日本語化、SublimeMozcInputでの日本語入力対応は終了です。
これでひとまず使える状態にはなるかと思います。
GitHubのブランチ名変更方法

 1. ロカールブランチ名変更

```bash
# カレントブランチに入っている場合
$ git branch -m new-branch-name
# OR
# カレントブランチに入っていない場合
$ git branch -m old-branch-name new-branch-name
```

2. リモートリポジトリブランチ名変更

```bash
$ git push origin :old-branch-name new-branch-name
```
cloud9でphpMyAdminを使う

cloud9でMySQLのGUIクライアントである**phpMyAdmin**を使う
方法を探してると、phpMyAdminをインストールして設定している記事をよく見たんですが
最初からCloud9にはphpMyAdminがインストールされているので、コマンド一発で起動できたので
備忘録もかねて


## phpMyAdminを起動
```
phpmyadmin-ctl install
```

cloud9のterminalで
上記コマンドを実行すると以下のようなログが表示され、phpMyAdminが起動し、以下ログが表示される

```
Starting installation
Starting MySQL
 * Starting MySQL database server mysqld                                                                                [ OK ] 
Configuring database
Starting apache
 * Restarting web server apache2                                                                                        [ OK ] 

PHPMyAdmin Installation complete. You can log in at: https://*******.c9users.io/phpmyadmin with the following username (and blank password):

       Username: for_example_user
```

上記ログの```https://*******.c9users.io/phpmyadmin```（*******はユーザ毎に異なる）にアクセス
するとphpMyAdminのログイン画面に遷移する。


<img width="1120" alt="スクリーンショット 2018-12-31 21.14.09.png" src="https://qiita-image-store.s3.amazonaws.com/0/43289/da22bfb9-0fcc-e916-9c56-869b95eb2ec5.png">


ログインユーザ名は上記ログにある**Username**の値を入力
パスワードは空のまま
Ubuntuを入れたdynabookのタッチパッドを使いた い

## 動機
普段はマウスを繋いで利用しているため、気にしていなかったが帰省時にマウスを忘れてしまい不便だったから調べた。

## 環境
PC：dynabook R731/36BS  
OS：Ubuntu16.04 LTS

## 実施作業
下の記事に従って、作業したらあっさり解決  
[東芝のノートPCにxubuntuを入れたらタッチパッドが反応しなくなったのを解決](https://qiita.com/kota9/items/05efa992da2eae427a45)

1. 起動時にF2キーを押してBIOS画面を表示する
2. F9キーを押して設定をデフォルトに戻す
3. F10キーを押して設定を保存して再起動する

残念なことに、過去の自分がBIOSの設定をどう変更したのか覚えていないため、原因はわかっていない...
親コンポーネントの値の書き換え

#前提
##サンプルコード
以下のコードでは
子コンポーネント内で直接ルートインスタンスの値に変更を加えるようにしています。

```javascript:javascript
// 子コンポーネント
Vue.component('child-component', {
  template: '<div>{{val}}<button @click="addValue">add</button></div>',
  props: ['val'],
  methods: {
    addValue: function(){
      this.val += 10;　//propsで受け取った値に変更を加える
    }
  }
});

// ルートインスタンス
new Vue({
  el: '#app',
  data: {
    value: 100
  }
})
```

```html:html
<div id="app">
  <child-component v-bind:val="value"></child-component>
</div>
```
##解説
このコードは実行こそできますが下記のようなwarmが出てしまいます。

```text:warm
[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "val"
```
「親コンポーネント(ここではnew Vueしたインスタンスのことです)の値を子コンポーネントが書き換えるのはあかんやで」
コンポーネントは様々な場所で使われます。
その先々でルートインスタンスの値に変更が加えられてしまうとバグのもとになるため避けなければなりません。
その解決法としてこの記事では
**$emitとカスタムコンポーネントを用いた方法**
を紹介します。

#$emitとカスタムコンポーネントを用いた方法
上記のwarmが出てしまうコードを$emitとカスタムコンポーネントを用いた方法で
書き換えてみました。
具体的にどの部分が変わっているでしょうか？
##サンプルコード

```javascript:javascript
// 子コンポーネント
Vue.component('child-component', {
  template: '<div>{{val}}<button @click="addValue">add</button></div>',
  props: ['val'],
  methods: {
    addValue: function(){
      this.$emit('event');　//親コンポーネントに値を変更したいタイミングを通知
    }
  }
});
// ルートインスタンス
new Vue({
  el: '#app',
  data: {
    value: 100
  },
  methods: {
    catchEvent: function(){ //通知を受け取って実際に処理を行うメソッド
      this.value += 10;
    }
  }
})
```

```html:html
<div id="app">
  <child-component v-bind:val="value"
                   @event="catchEvent">　//イベント名’event’で通知を受け取る
　</child-component>
</div>
```
##解説
子コンポーネント内では**this.$emit('event');**によって
値を書き換えてほしいイベントを通知するのみになりました。
実際の処理は呼び出し元である親コンポーネントのcatchEventメソッドに移っています。


こうすることで変更を加えるのがその値を保持するコンポーネント自身になったため
Warmを回避することができます。
また自身の認知しない部分での値の書き換えを防ぐこともできるのでバグ等を防ぐこともできます。

##まとめ
単純な数値以外にもモーダルのオンオフとかいろいろな部分で使うことになるかと思います。
ご指摘などお待ちしております。
CloudFront の署名付きURLで時限式ダウンロードURLを生成する

# 概要
CloudFront の署名付きURLで時限付きのダウンロードURLの発行を行うことを目的としてダウンロードURLを Node.jsで発行する手法について説明する。

# 準備
必要な準備として AWS 側に以下の準備を行う。

* S3バケット

CloudFront経由してアクセスを行う、S3バケットを準備する。

* CloudFront ディストリビューション

ディストリビューションは作成済みの場合は設定に合わせて変更を行い、新規の場合はWebで作成を行い設定を行う。

![1.PNG](https://qiita-image-store.s3.amazonaws.com/0/61893/7b774b4d-5ac2-f686-3061-913df8aa41ab.png)

設定箇所として以下の内容を修正する。
Restrict Bucket Access は S3 から直接リクエストを送らないように対応するため、Yesにする。
また、Query String で `response-content-disposition` をWhiteListに登録する。このパラメータが `attachment `の場合はダウンロードすべきファイルとしてクライアント側が認識し、ダウンロードを行う。

|パラメータ|値|
|:-------:|:-----|
|Restrict Bucket Access|Yes|
|Cache Based on Selected Request Headers|Whitelist|
|Whitelist Headers|origin |
|Query String Forwarding and Caching|Forward all, cache based on whitelist |
|Query String Whitelist|response-content-disposition|
|Restrict Viewer Access <br> (Use Signed URLs or Signed Cookies)|Yes|
|Trusted Signers|self|


* CloudFront のキーペア

署名付きURLの発行には CloudFront 用のキーペアを発行する必要がある。
発行にはAWSのマネージドコンソールにルートアカウントでログインして発行する必要がある。
発行後下記のモーダルが上がってくるため、秘密鍵のダウンロードを行う。
(公開鍵は使用しない。このモーダルで秘密鍵をダウンロードしないと以後、ダウンロードを行えなくなる。)
![6.PNG](https://qiita-image-store.s3.amazonaws.com/0/61893/c172ae28-c638-54f6-9e04-daef01cd2b42.png)



# Node.js側実装
Node.js 側に実装を行う。
必要なモジュールとして `aws-sdk, moment` があるためnpmなどでインストールを行う。

`response-content-disposition=attachment` を外すことでクライアント側に画像や動画を表示することが可能となる。

`moment().add()` は値を変えることで該当するURLが有効な時間を設定することができるが、過去の時間を指定することはできない。

```javascript
var aws = require('aws-sdk');
var moment = require('moment');
var fs = require('fs');

const key_pair_id = 'XXXXXXXXXXXXXXXXXXX';
const private_key = fs.readFileSync('./pk-XXXXXXXXXXXXXXXXXXX.pem', 'utf-8');

const cloudfront = new aws.CloudFront.Signer(key_pair_id, private_key);

const fileName = 'test.png';
const url = 'https://xxxxxxxxxxxxxx.cloudfront.net/'+fileName+'?response-content-disposition=attachment';

// 5min 後に設定
const time = moment().add('+5', 'minute');
const expire = time.unix();

console.log('Expire time: ' + time.format());

let cloudfront_url;

cloudfront.getSignedUrl({url: url, expires: expire}, (err, url) =>{
    if(err){
        return;
    }
    cloudfront_url = url;
});

console.log(cloudfront_url);
```

上のコードを実際に実行するとURLとExpire time が出力される

```shell
clom@MyComputer:~$ node cloudfront.js
Expire time: 2018-12-31T21:44:45+09:00
https://xxxxxxxxxxxxxx.cloudfront.net/test.png?response-content-disposition=attachment&Expires=1546260285&Key-Pair-Id=XXXXXXXXXXXXXXXXXXX&Signature=xxxxxx__
clom@MyComputer:~$ 
```

出力されたリンクを実行することでファイルのダウンロードが行われる。
なお時間経過後に実行した場合は `Access Denied` の旨が出力される。

これにより、CloudFront の署名付きURLで時限式のダウンロードURLの発行を行えた。
期間外のファイルのダウンロードを行えなくすることで様々なサービスに利用できると考えている。
エンジニア最強のWi-fi ネットワーク環境の構築

# ちゃんとお金をかけよう

- 通信費を抑える方向に働くのはやめよう、贅沢に使いたいならトレードオフは覚悟する
- 知恵には限界があるから、あらゆる手を尽くして
- ひとつの方法に頼らない、自宅Wi-fi も SIM カードも Wi-max も Wi2 も全部契約したって良い、それぞれに長所と短所があるから、全部契約していいとこどりをしても良い
- ネットワーク環境は人権である、それだけお金をかける価値のあるものだと理解すれば、ケチって節約しようとする気持ちは減るはず

# オレオレネットワーク環境

#  自宅に光

- 人生を生きるために必ず必要な環境
- いつでも贅沢に光を使える安心感を持っておきたい
- Wimaxを自宅用に使う方法もあるが、回線の遅さにわずらわされたくない

# SIMカード

- iPhone二台持ちなのでそれぞれに音声対応SIMを入れて使う、片方で片方をデザリングとかやってられない
- OCNの30GGBプランを利用すれば1日1GBは使えるのでそれで様子見、2019年から新プランに切り替え
- 1ヶ月ごとに利用プランを調整することが出来て、1ヶ月分の容量持ち越しもできるので、コントロールしやすい
- Wimax端末と違ってキャリア回線なので、だいたい常に快適なのと、Wimax接続の大きなオーバーヘッドが減るのが嬉しい

# Wimax端末

- 勢いで契約してみた、5年ぶりぐらいのWiMAx
- どれだけ使ってもYoutube品質は保たれるらしい、1Mbps程度を保証？ 昔とは違ってコースが色々変わってる、Wimax1時代よりも底上げはされているという店員さんの説明だった
- 端末一個増える、充電が必要、制限で回線が遅くなる、iPhoneなどの端末側でもWi-fi切り替えが必要になるなど、足回りの悪さが露呈してきて契約解除しようかと思っている
-  SIMカードの上位プランを贅沢に使ったほうが手間もないし、快適だし

# Wi2 プラン 二個契約

- マクドナルドでmobile point が使えるのが嬉しい
- Wi2 Wi2 club  とかは、MacBookとiPhoneなど、複数端末で同時に繋げない辛い仕様だったので二アカウントを契約
- それまでは「なんでつながらんのや‥」「突然繋がらなくなる」「使えないやつ‥」という印象があったが、MacBookを使うとiPhoneが使えなくなり、逆もまたしかりだということに気付き始めた
- 何この縛り‥！！！！！！！！！！！！

# スタバWi-fi Tullys Wi-fi Pront wi-fi など、カフェWi-fi

- うまくつながらないことがあるが、たまに利用する
- カフェがあるところにはだいたいWi2があるので、そちらを利用することが多い

# コンビニWi-fi Osaka Free Wi-fi など、Free-Wi-fi

- どうしても必要なときには
- つながるまで4分も5分もかかるとか、どっとエネルギーを奪われるし本当にやりたくはない
- 使えるWi-fiを探す、使える店舗を探すとかだけで膨大なコストが日常に爆誕してしまう


---

https://github.com/YumaInaura/YumaInaura/

https://github.com/YumaInaura/YumaInaura/issues/107








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
自己紹介

#自己紹介
初めまして。
私は2018年度入社で組み込みソフトエンジニアとして働いている者です。
地方の大学院で機械工学を学んでいましたが、正直学生時代は全く勉強しておらず、留年ぎりぎりで卒業しました。そのため、機械工学の専門知識は本当に最低限しかありません。もちろん学生時代に組み込み技術知識など持ち合わせておりません。
現在の会社に入社してから組み込みソフトの開発に携わるようになりました。
仕事を覚えていくうちに組み込み技術やコンピュータ技術などに興味を持つようになり、もっと知識を身に着けてエンジニアとして活躍していきたいと思っています。

#Qiitaでの投稿内容について
現在学習している内容について投稿していこうと思っています。
具体的には以下の内容です。

- C/C++
- コンピュータの仕組み
- 組み込みOS
- 書く技術
- CAD CAM

まだまだ技術者として、かなり私は未熟者です。
そのため、最初のほうは投稿内容がわかりにくかったり、時には間違ったことを投稿してしまうかもしれません。そのような投稿をみつけたら指摘をしていただけると嬉しいです。

投稿は、2週間に１回のペースで行っていきたいと思います。
TwitterのモーメントでQiitaアウトプットまとめを作成！ あ、これってTwitter公式のTogetter的な？

# Twitter

https://twitter.com/4_mio_11/status/943727762744864769

![image](https://user-images.githubusercontent.com/13635059/50559903-91659d80-0d3e-11e9-813f-ce2b206c2f36.png)

# Moment

![image](https://user-images.githubusercontent.com/13635059/50559908-b4904d00-0d3e-11e9-8594-b0718e56baf1.png)

# Create
![image](https://user-images.githubusercontent.com/13635059/50559914-beb24b80-0d3e-11e9-829c-412f2813ae25.png)

# Describe

![image](https://user-images.githubusercontent.com/13635059/50559929-e0133780-0d3e-11e9-8885-7a5cddc93112.png)

# いいね、自分のツイート、ツイート検索、リンク直接入力の四種類から選べるっぽい

![image](https://user-images.githubusercontent.com/13635059/50559944-fd480600-0d3e-11e9-924f-1da9cf561b7d.png)

# 選んでみる

さくっとしてる。

![image](https://user-images.githubusercontent.com/13635059/50559953-1bae0180-0d3f-11e9-97e5-7ad02697494f.png)

# Publish

![image](https://user-images.githubusercontent.com/13635059/50559968-46985580-0d3f-11e9-90d7-8265629bdec6.png)

# カバー必須らしい

![image](https://user-images.githubusercontent.com/13635059/50559972-52841780-0d3f-11e9-99d3-d3eb24b65008.png)

なにこれ‥

# Finderのフォルダから選ばなきゃいけないとか‥Mac環境

![image](https://user-images.githubusercontent.com/13635059/50559985-75aec700-0d3f-11e9-8dda-31e7412c484e.png)

# いらすとやさん

縦長クロップ？

![image](https://user-images.githubusercontent.com/13635059/50560002-8a8b5a80-0d3f-11e9-9f82-11f1bd9f93bd.png)

# プロフィールにリストされるらしい

![image](https://user-images.githubusercontent.com/13635059/50560011-9aa33a00-0d3f-11e9-8c13-8b1e8ade51b3.png)

# MomentをTweetでシェアするという扱いらしい

![image](https://user-images.githubusercontent.com/13635059/50560019-a858bf80-0d3f-11e9-9533-594a7ebe306d.png)

# 出来上がり

https://twitter.com/i/moments/edit/1079708261379502080

# 自分のプロフィールにMomentが増えた

![image](https://user-images.githubusercontent.com/13635059/50560034-c8887e80-0d3f-11e9-9f21-acd03d62d92c.png)

# あ、、これTogetterのかわりに使える奴‥もしかして？

- かわりというか、公式だけど。
- Twitterが公式キュレーションを用意してるという話はこれだったのだろうか。ぜんぜん頭でつながっていなかった。


---

https://github.com/YumaInaura/YumaInaura/








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
Google Formの回答の検証で正規表現を使う

郵便番号の正規表現の例

<img width="795" alt="スクリーンショット 2018-12-31 20.46.52.png" src="https://qiita-image-store.s3.amazonaws.com/0/261020/1d7ac189-0394-5ac2-6bac-78f8a342feb6.png">

/スラッシュでわざわざ正規表現を囲う必要はないようだ。

^(カレット)は、行の先頭が一致する意味。
$(ドル)は、行の末尾が一致するという意味。
すなわち、^と$を組み合わせれば完全一致の条件が作れる。

\dは数字、[0-9]と同じ意味。
{n}は直前の文字がn回。
すなわち、\d{3}で、数字が３回連続。

?は、直前の文字が省略可能であることを意味する。


Google Formの正規表現を使って、
入力した瞬間にUUIDが生成されるようにしようと、

```
^=getUuid\(\)$
```
という正規表現を打ち込むようにしてみたけれど、
スプレッドシートには、'=getUuid()と記入されて、うまく動作せず。
トリガー使って生成した方が良いか…
リュックサック・エンジニアリング

# エンジニアの必須装備「リュックサック」の中身を決めるときはモンスターハンターを思い出す

- 継続的なリファクタリングが必要、毎日アイテムを入れ替える
- 究極のリュック装備は存在しない、毎日要件定義の要件が変わるようなもの
- モンスターハンターの装備を入れ替えするみたいな感じ、どんなクエストも同じものはないし、ボスに応じて武器も変えていく必要がある

# リュックサック・エンジニアリング

- リュックの中身を入れ替えするたびに思う、これはエンジニアリングにも似ていると
- 常に呼吸するようにコードベースに加えたり、捨てたりという継続的なアレが必要なのだと
- 常に変わらない要件もないし、常にすべてが変化し続けていて、その変化を敏感にキャッチして、リュックサックの中身を組み替えていく

# 具体例

- 体の調子の良さに応じて、リュックサックの軽さや重さを調整する
- iPhone二代目にもSIMカードを入れて、月30GBプランを契約するなら、WiMax端末は必要ないかもしれない
- 髪は必ず家で、朝セットすることにしたから、小型ヘアジャムはもう持ち歩く必要はない
- etc etc etc ...

# My backpack

- Today lighten my backpack 
- Many items get off from backpack
- I've thought before Somewhere ultimate backpack and items exist

![image](https://user-images.githubusercontent.com/13635059/50559670-a04b5080-0d3c-11e9-96fe-b514baf327a8.png)

# But i noticed everyday i need refactor my backpack items

- because everyday require item kinds changed
- its like a game Monster Hunter preparing before go to field and battle to monsters
- So i think now Real world backpack and items in it is Monster Hunter items and prepare fore battle to Monster BOSS!! 


![image](https://user-images.githubusercontent.com/13635059/50559697-f15b4480-0d3c-11e9-84d3-c844eb455852.png)

---

https://github.com/YumaInaura/YumaInaura/








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
Like Monster Hunter weapons choose  Backpack items Yes I'm Digital Survivor

# My backpack

- Today lighten my backpack 
- Many items get off from backpack
- I've thought before Somewhere ultimate backpack and items exist

![image](https://user-images.githubusercontent.com/13635059/50559670-a04b5080-0d3c-11e9-96fe-b514baf327a8.png)

# But i noticed everyday i need refactor my backpack items

- because everyday require item kinds changed
- its like a game Monster Hunter preparing before go to field and battle to monsters
- So i think now Real world backpack and items in it is Monster Hunter items and prepare fore battle to Monster BOSS!! 


![image](https://user-images.githubusercontent.com/13635059/50559697-f15b4480-0d3c-11e9-84d3-c844eb455852.png)








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
S3のバケットポリシーを書こうとしてもアクセス拒否される件について


[AWS-Lambda実践ガイド](https://amzn.to/2QYizYO)を読んでいてAWS LambdaへS3へのアクセス権を付与するためバケットポリシーを変更しようとしたらハマったので、その記録です。

# 手順
AWS LambdaからS3を扱う上でS3のバケットポリシーを設定することで、Lambdaに対してアクセス権を付与することができます。

しかし、その設定をする上で、[Policy Generator](https://awspolicygen.s3.amazonaws.com/policygen.html)から作成したバケットポリシーがアクセス拒否でエラー発生する事態が発生した。

手順としては以下を行なった。

1. S3コンソールでバケットを選択する。
1. アクセス権限タブを選択する。
1. バケットポリシーを選択する。
1. 画面下部のポリシージェネレータのリンクを押して適切な値を設定し、バケットポリシーJSONを取得する。
1. S3コンソールに戻り、バケットポリシーJSONを貼り付けて保存ボタンを押す。

![qiita1.png](https://qiita-image-store.s3.amazonaws.com/0/67320/c7e0b8f3-a5f2-b2be-cb4a-d4b3a819073f.png)

保存できると思ったが、エラーが発生し、「アクセス拒否」と表示される。

# 解決方法

S3コンソール > アクセス権限タブ > パブリックアクセス設定
にある新規のパブリックバケットポリシーをブロックする（推奨）
とあるので、チェックを外します。

![qiita2.png](https://qiita-image-store.s3.amazonaws.com/0/67320/928a69ca-a205-e4e4-5667-06a0d0f176c4.png)

バケットポリシー画面に戻り、もう一度ポリシージェネレータで作成したポリシーをコピペして保存ボタンを押すと無事に登録されました。

![qiita3.png](https://qiita-image-store.s3.amazonaws.com/0/67320/d7dd3954-4ea2-01e0-3f89-61167dd70d1c.png)

最後にパブリックアクセス設定の「新規のパブリックバケットポリシーをブロックする」チェックを元に戻すことを忘れないでください。
システムは2人で作るのが一番なのではないか

##はじめに

人間はなんでも一人でできるわけではないのでチームや組織が必要です。
しかし、システム開発に関しては2人で作るというのが一番なのではないかと思います。

##前提
スタートアップの言うところのMVPを作成するようなシステム開発を前提しております。
※そもそも半年要件定義をして半年かけて作って、半年かけてテストをするといった事自体に、私は疑問を持っています。

##理由
・無駄なコミュニケーションコストがかからない
・バグや実装の仕方がわからなかった場合はペアプログラミングできる
・設計やテーブル作成に何人も必要ない(設計を7~8人でやるとか意味不明)

##システム開発のステップ
#####1.要件定義（お客様ヒアリング）
#####2.ユースケース図＆画面一覧の作成（場合によっては業務フロー）
#####3.機能一覧の作成
#####4.ファンクション一覧の作成
#####5.データモデルの作成
#####6.開発環境準備＆本番環境準備
#####7.DB作成（自動でできるようなフレームワークを選ぶべき）
#####8.ファンクションの実装
#####9.単体テストの実施
#####10.画面の実装
#####11.繋ぎ込み
#####12.結合テスト
#####13.総合テスト（お客様確認）
#####14.デプロイ
#####15.追加開発の検討＆実施

##詳細スケジュール
【Day1】
　2人でお客さんへのヒアリングに行く。

【Day2】
　一人がお客様ヒアリング内容をまとめながら疑問点を洗い出し、もう一人がユースケース図＆画面一覧を作成。

【Day3】
　一人がユースケース図＆画面一覧とQA表を持ってお客様のところへ行く。
　もう一人が、開発環境の準備（使うフレームワークの選定やインフラ構築）を実施。

【Day4】
　一人がDay3まででfixさせた要件定義を元に機能一覧を作成。
　もう一人は開発環境の準備で苦しむ。

【Day5】
　2人で機能一覧を元にファンクション一覧を作成。
　この時に2人の設計に対する認識を合わせる。

【Day6】
　一人がデータモデルを考えながら、もう一人はファンクション一覧の詳細設計を行う。

【Day7】
　一人がDBを作成、もう一人（開発環境を作っていない方）が開発環境の準備をする。
　（あんまり時間かからないはず）

【Day8】
　分担してとにかくファンクションを作る

【Day9】
　一人が主要機能の単体テストしつつ、もう一人は画面を作成。
　※この際の画面は荒くていい(絶対変わるため)

【Day10】
　2人でつなぎ込みを実施。

【Day11】
　2人で結合テストを実施。

【Day12】
　2人で総合テストを実施。

【Day13】
　1人が総合テスト(お客様への説明)を実施。
　もうひとりは、細かい画面の体裁の修正もしくは機能追加の検討。

【Day14】
　一人が本番稼働。
　もう一人は追加開発の資料作成。

追加開発という名の要件定義のスタート。
【Day1】に戻る。

※Dayは必ずしも24時間を表さない。ある一定期間である。

##重要ポイント
☆画面から作らない
☆とにかく早く開発環境を作る
☆完璧な画面を初めから目指さない（絶対変わるため）
☆追加開発がある前提、こちらから提案する前提で開発を行う。

##まとめるとこんな感じ。
![Screenshot 2018-12-31 at 7.45.51 PM.png](https://qiita-image-store.s3.amazonaws.com/0/242700/430f5dfd-3ca6-a18c-ac32-0d586a051da0.png)

##あとがき
この2人に加えて、
金引っ張ってこれて意思決定できてドキュメントかけるCEO的な人と、
LPとかビラとかぱっとデザインできるデザイナーがいれば4人でスタートアップできるなと思った。
たとえばSlackやLINEで1行ずつEnterするユーザーは何故？BackSpaceが嫌われる理由。 #UI #UX #ユーザー行動 #デザイン

# たとえば君がいるだけで

は、編集コストは低くならない。

# Mac Alfred て Snippet 機能の編集をしたい、登録済みのやつ

![image](https://user-images.githubusercontent.com/13635059/50558680-ab4db300-0d33-11e9-9ed0-373f2236acac.png)

# どこ‥

![image](https://user-images.githubusercontent.com/13635059/50558873-d258b480-0d34-11e9-9723-1735e2bb82f7.png)

# どこ‥
![image](https://user-images.githubusercontent.com/13635059/50558685-b56fb180-0d33-11e9-9482-9efebe92b477.png)

# どこ‥

![image](https://user-images.githubusercontent.com/13635059/50558876-d5ec3b80-0d34-11e9-9220-185f235db010.png)

# どこ‥！！！！！！！！！！！！

と思いながら、ひとつの編集をするたびに激しく苦労する。


# 編集コストは新規ポストコストよりはるかに高い

- サービスやアプリケーションにもよるが、どんなサービスでもこの問題を抱えている
- このAlfredぐらいになると、ようやくUI感度の低いユーザーでも気づくかも知れないが、ふつうは無意識
- SlackやLINEで爆速でテキストを打つにしても、いちど入力済みのテキストには3倍5倍のコストがかかる
- すべての入力という入力がこの問題を抱えており、backspaceするよりもEnterする方がはるかに簡単である

# LINEやSlackなどで「1行ずつバラバラに書くユーザー」が誕生する

- これはユーザーのアウトプットのスピード感が高すぎて、もしくは面倒くさがりで、Backspace的「後戻り編集」をしたくないため
- この場合「内容の訂正」は編集機能ではなくて、ポストにポストを重ねることでおこなわれる、それがそのユーザーの書き味、持ち味ともなる
- 「Aです！」「ごめんBです！」「やっぱCですSorry」みたいな。爆速ユーザーほどこの傾向が高い。

あああようやくAlfredのSnippet編集を終えられた。編集コストが高すぎて半日は放置せざるをえなかった。

---

https://github.com/YumaInaura/YumaInaura/








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
Laravelで起きたエラー「InvalidArgumentException: Unexpected data found.」の回避

#はじめに
今回はLaravelで「InvalidArgumentException: Unexpected data found.」というDBから日付データを取得した後、設定をしようとしたらエラーを出してしまったので、原因究明と解決方法を探してみたメモです。

#InvalidArgumentException: Unexpected data found.
DBからデータを取得して、formatを変えてcreated_atにデータを設定しようとした時に起きたエラー。

```php:sample.php
$user = User::select('created_at')->first();
$user->created_at = date( 'Y/m/d H:i:s', strtotime( $user->created_at ) ); // error
```

##原因
created_atの日付のフォーマットが一致しないことが原因。
'Y-m-d H:i:s'で設定する必要があり、'Y/m/d H:i:s'では代入することは出来ない。

##解決方法
* 'Y-m-d H:i:s'で統一する。

```php:sample.php
$user = User::select('created_at')->first();
$user->created_at = date( 'Y-m-d H:i:s', strtotime( $user->created_at ) );
```

* データを取得したいだけですとか、取得した$userにフォーマットを変えてどうしても入れたい場合などの抜け道。

```php:sample.php
$user = DB::table('users')->select('created_at')->first();
$user->created_at = date( 'Y/m/d H:i:s', strtotime( $user->created_at ) );
```
とすることも。DB::table()を使うというところがポイント。

#おわりに
今回はこのエラーで頭を抱えました。
エラーの検索してもあまり状況が読めず、情報もあまりなかったので、色んな記事を漁って自分なりの解決方法を見つけたので、ここに載せました。
2つ目の解決方法は、あまり例のない変わったやり方であると思いますので、おかしな点がありましたら、ご教授願います。
TCPって何だっけ？美味しいの？ 思い出し学習まとめ @Qiita

# Inspired

[ネトゲや配信で使い分けられてるTCPとUDP、RUDPの概念から勉強し直してみた - Qiita](https://qiita.com/4_mio_11/items/cd3efe0345eee75c3ae2)

# TCP と UDPってなんだっけ？美味しいの？

- どっちが細いほうだっけ？ 片方が素早くて、片方が太いパイプだったような？
- Linux server で iptables を設定する時に、この違いを設定してたような？
- もうほとんど忘れかけている、ぐらいのざっくりした理解レベル


# TCP と UDP は通信モデルの取り決め。

>IP(Internet Protocol)の一段階上に当たるトランスポート層のプロトコル(通信を行う時の取り決め)として標準的に使われている通信モデルです

# TCP は 1対1

>1対1でコネクションを繋ぐプロトコルで通信相手の状況を確認をしてから接続を確立したり、データの転送が終わると切断するという手順を踏みます

# 相手の受信を待ち受けるんだった、そうそう！

>受信側がデータを受け取れる状態かどうかを確認してから通信を開始。これを「通信を確立する」という。

# どうやって覚えよう？

>TCPとはTransmission Control Protocolの略称です。

![image](https://user-images.githubusercontent.com/13635059/50558459-ee0e8b80-0d31-11e9-9e0e-7d2141ae0aa0.png)

# なにか伝達してそうな感じがするGoogleImageSearching!

![image](https://user-images.githubusercontent.com/13635059/50558483-22824780-0d32-11e9-93e7-d3dd19aca890.png)

---

https://github.com/YumaInaura/YumaInaura/








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
侍エンジニア塾の卒業生がウェブカツ！！に入部しました（２ヶ月目）

（前回）https://qiita.com/tugu1993106/items/15398c662312638d7c61

**ウェブカツ！！**で学習を初めて２ヶ月になります。

**ウェブカツ！！**へのリンクはこちら→https://webukatu.com/home

今回は前回よりも、もう少し詳しく**ウェブカツ！！**での学習について書いていきます。

前回と同様に**侍エンジニア塾**との比較になります。よろしくお願いします。

#WEBサービス部までの学習

前回の記事にも記載した通り、**ウェブカツ！！**での学習は１から順番に動画を見ていく形になります。

その流れでHTML・CSS、Javascript、PHPなどの言語やネットワーク・サーバーについての基礎を学びます。

そしてWEBサービス部という部活で実際にWEBサービスを作ります。

ここで作るWEBサービスはメ◯カリのようなフリーマケットサービスです。

それを参考にすればポートフォリオがとりあえず作れるだけのボリュームとクオリティがあります。

僕が**侍エンジニア塾**で学習した言語はRubyですが大体内容的にはこの辺りまでです。

現在ここを参考にしてポートフォリオを製作中ですが、ここまで**侍エンジニア塾**の時よりもクオリティの高いものが作れそうだと感じました。

#WEBサービス部以降の学習

実は**ウェブカツ**での学習はWEBサービス部までで半分程度です。

学習途中なのでまだ詳しく書くことはできませんが、WEBサービス部までの内容を更に深く学習しています。

WordPressやフレームワークの学習もあります。言語の学習が終わったら起業や営業についても学習があるようです。

一通り学習が完了したら卒業試験もあるようです。

卒業試験は実際の実務のような課題が与えられると聞きました。

#ウェブカツ！！学習で困ったこと

**ウェブカツ！！**で学習中に困ったこともあります。

**侍エンジニア塾**とは違い気楽に聞ける相手がいないので、一度躓いてしまうと何時間も進まないこともありました。

勿論、自分で調べる力を身につける為には必要なことですが、**侍エンジニア塾**のマンツーマンレッスンの強みを実感しました。あまり回答速度は早くないので回答が来るまでに解決することが多かったですが。

**ウェブカツ！！**の教材で全く紹介されて無いような機能に対しては基本的に質問出来ませんが、実装したい機能はほとんど教材内で紹介されており、各動画で質問をすれば大抵解決するので、そもそも大幅に躓くこと自体少ないです。
質問の回答も現役エンジニアの方が対応してくれるので凄く参考になります。しかも回答速度がとても早い。

#最後に

**侍エンジニア塾**での学習がWEBサービス部までと大体同じと記載しましたが、**侍エンジニア塾**での学習に関しては個人差がかなり大きいかと思います。学習速度が早いほど深くまで教えてもらえます。遅い人でも最初に設定した目標を達成するまでは必ず教えてもらえるはずです。（ただ、最大半年間という学習期間が設定されているので、期間内に間に合いそうになければレベルを下げることになるとは思います。)

一方、**ウェブカツ！！**では学習速度に関係無く、全員必ず同じレベルまで学習することが出来ます。ただ、**侍エンジニア塾**に比べて乗り越えるべき壁も多くて挫折する人も多いと思います。

現時点で**ウェブカツ！！**は人に勧められると思っていますが、「出来るだけ楽をしたい」・「すぐに人に聞いてしまう」というような人にはおすすめ出来ないです。多少苦しい思いをしてでも実力を身に付けたいという人には本当におすすめです！

僕もちゃんと卒業できるか不安がまだありますが、これからも学習を頑張っていきます。

プログラミングスクール選びで悩んでいる人に少しでも参考になると嬉しいです。

おわり
大晦日に一人だったから相棒作った

大晦日ですね。家族が外出してしまっていて、~~時間ができたので~~寂しいので相棒を作ってみました。夜子供が帰ってきたらこれで遊ぶつもり。

# どんなものか
<img width="500" alt="スクリーンショット 2018-12-31 18.23.48.png" src="https://qiita-image-store.s3.amazonaws.com/0/122922/03f927a6-9889-3c2c-fede-0f9673c50bf2.png">

Botと音声で会話できるシステムです。ちょっと前だといわゆる人工無脳というボットですね。それを音声を介して行えるようにしました。

最初はGoogle Home miniで実現できるかなと思ったのですが、どうもできなそうだったので調べてみるとブラウザで実現できそうだったのでやってみました。

# 使用技術
## [Talk API](https://a3rt.recruit-tech.co.jp/product/talkAPI/)
Botの機能は作るもの辛いので、A3RTのWeb APIを使わせてもらってます。下記のように呼び出せば簡単に使える。下記は公式ドキュメントからの引用です。

```shell
curl -X POST https://api.a3rt.recruit-tech.co.jp/talk/v1/smalltalk \
-F "apikey=AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA" \
-F "query=おはよう"
```
レスポンス

```json
{
	status: 0,
	message: "ok",
	results: [{
		perplexity: 2.3688167429546714,
		reply: "おはようございます"
	}],
}

```

# [Speech Recognition API](https://developer.mozilla.org/ja/docs/Web/API/SpeechRecognition)
ブラウザの機能でマイクを通じて入力された音声をテキストに変換してくれるAPI。2018/12/31現在で実装されているのはChromeとOperaのようですね。
下記のように使います。

```javascript
const rec = new webkitSpeechRecognition();
rec.continuous = true;
rec.interimResults = false;
rec.lang = 'ja-JP';
rec.onresult = (e) => {
  for (let i = e.resultIndex; i < e.results.length; ++i) {
    if (e.results[i].isFinal) {
      const str = e.results[i][0].transcript;
      console.log(str);
    }
  }
}
// ユーザからのイベントハンドラでstart
rec.start();
```

# [Amazon Polly](https://aws.amazon.com/jp/polly/)
Amazonの音声読み上げサービス。ブラウザにも[Web Speech API](https://developer.mozilla.org/ja/docs/Web/API/Web_Speech_API)というものがありますが、あまり自然に聞こえなかったのでAmazonのものを使うことにしました。

# ソースコード
時間切れになってしまったので、あとはソースコードを載せておきます。無駄にSocket.ioを使っているのは、もう少しなにかするかなと思ってのことです。とりあえず、下記に公開しておきます。
https://github.com/jirokun/chat_bot_for_children_2018
とりあえずGitを試す人用Gitコマンド#1

## 参考

[git document](https://git-scm.com)

## Repositoryのクローン

既存のGitリポジトリのコピーを取得したい場合に使うコマンドが、`git clone` です。

```bash-session
git clone [URL]
```

## Gitの設定

`git config` コマンドで Git の設定をすることができます。

### 設定ファイルの確認

```bash-session
# 設定確認
git config --global -l
git config --system -l
git config --local -l
```

### 設定ファイルの設定

```bash-session
# リポジトリ単位で設定する手順を記載
cd <.gitファイルがあるディレクトリ>
# 設定の確認
git config --local -l
# 設定
git config --local user.name "<user.name>"
git config --local user.email "<email>"
# 変更後の設定確認
git config --local -l
```

## 基本操作

ファイルをGit管理下に置いたり、逆にGit管理下から除外したり　　
名前を変更したりといった基本的な操作を記載します。

### ファイルの追加

1. まずはローカルで普通にファイルを追加する。

2. git addコマンドでgit管理配下にする。

```bash-session
git add [追加したいファイル]
```

### ファイルの削除

- git の管理下に置かれている場合はgitコマンドで削除する。
- ファイルは残してgit管理下から外す場合

```bash-session
git rm --cached [削除したいファイル]
```

- ファイルも削除する場合

```bash-session
git rm [削除したいファイル]
```

### ファイル名の変更,ファイルの移動

※ファイル名の変更をする場合はmoveとかWindows側でファイル名変更しない

```bash-session
git mv <ファイル名_old> <ファイル名_new>
```

## 更新を反映する

ファイルを作成し、Git管理下に登録したあと、変更をローカルに保存したり
リモートのRepositoryに保存した情報を反映させる手順を記載します。

### 差分の確認

変更したけれどもまだステージ('git add')していない内容を見るには、引数なしで `git diff` を実行します。　　
この結果を確認することで、変更した内容のうちまだステージされていないものを知ることができます。

```bash-session
git diff
```

### ステータスの確認

どのファイルがどの状態にあるのかを知るために主に使うツールが `git status` コマンドです。

```bash-session
git status
```

### ローカルリポジトリに変更を反映(commit)

ファイルを変更したり、新規ファイルを追加した内容を`git commit`でコミットすることができます。

```bash-session
git commit -a
## 変更されたファイル(新規を除く)をインデックスに追加し,コミットする
git commit -m "add new file"
## コミットメッセージを同時に指定
git commit -am "add comment"
```

### ログの確認

何度かコミットを繰り返した後、どのような変更を行ったのか振り返ったり、
あるいはコミット履歴つきの既存のリポジトリをクローンした場合、過去にどのような作業を行ったのか確認する時に使いうのが `git log` コマンドです。

```bash-session
git log
```

### リモートのリポジトリの情報を取得(fetch)

データをリモートリポジトリから取得するには`git fetch`を実行します。
このコマンドは、リモートプロジェクトのすべてのデータの中から自分が持っていない情報を取得します。　　
コマンド実行後は、リモートにあるすべてのブランチを参照できるようになり、いつでもそれをマージしたり中身を調べたりすることが可能となります。

```bash-session
git fetch
```

### リモートリポジトリの情報をmerge

リモートリポジトリの情報を取得し、差分があった場合、mergeコマンドを実行して内容をローカルに反映することができます。(本当は逆の使い方の説明が先ですが、それは今度ブランチと合わせて記載予定。。。)

```bash-session
git merge origin/master
```

### 変更をリモートリポジトリにPUSH

更新を終え、共有できる状態になったら、自分の変更をリモートのリポジトリに共有します。　　
以下のコマンドを実行することで、変更内容をリモートに共有(PUSH)します。

```bash-session
git push origin master
```

## おまけ

git ls-filesとかgit statusとか実行すると以下のようになったので解消方法のメモ

```
$ git ls-files
：
"002_git\350\207\252\345\210\206\347\224\250\343\202\263\343\203\236\343\203\263\343\203\211.md"
"003_Jupyter\343\201\256Docker\343\202\244\343\203\241\343\203\274\343\202\270\343\202\222\344\275\277\343\201\243\343\201\246\343\201\277\343\202\213.md"
：
```

日本語とか特殊文字のような"unusual" charactersは上のログのように二重引用符(")付きでエンコードされて表示されるようです。  
git config コマンドでcore.quotepathをfalseに設定することで"unusual"として扱われないようにすると日本語が表示できるようになります。

【参考】[git-configのドキュメント](https://git-scm.com/docs/git-config)

```
# 全体に適用する場合
git config --global core.quotepath false
# ローカル(Repository単位)に適用する場合
git config --local core.quotepath false
```
画像中の特定部分のフーリエ変換後画像の取得

# はじめに
いろんな画像での部分部分でのフーリエ変換を対話的に取得して、眺めることで２次元フーリエ変換後のスペクトル図の特徴をつかむ。つまりフーリエ変換で遊びたいというのが今回の目的。



#環境
Python 3.6.6
numpy 1.15.0
cv2 3.4.1

#実装
```python
import numpy as np
import cv2
import copy

def nothing(x):
    pass

def mouse(event,x,y,flags,param):
    """
    マウスが動いたときの動作
    """
    
    
    global img2,px,py,tx1,tx2,ty1,ty2
    
    img2=copy.deepcopy(img)
    #マウスが動いたイベントの場合
    if event == cv2.EVENT_MOUSEMOVE:
        
        #トリミングする左上(tx1,ty1)と右下(tx2,ty2)を指定
        tx1=x-int(px/2)
        tx2=x+int(px/2)
        ty1=y-int(py/2)
        ty2=y+int(py/2)
        
        
        print(x,tx1,tx2)
        print(y,ty1,ty2)
        
        #画像端部での動作
        if tx1<0:
            tx1=0
            tx2=px
        if tx2>img2.shape[1]:
            tx1=img2.shape[1]-px
            tx2=img2.shape[1]
            
        if ty1<0:
            ty1=0
            ty2=py
        if ty2>img2.shape[0]:
            ty1=img2.shape[0]-py
            ty2=img2.shape[0]
        
        #トリミングする場所を四角で囲う
        cv2.rectangle(img2,(tx1,ty1),(tx2,ty2),(255,0,0),1)
        
        
def fourie(img):
    """
    画像中の特定位置の画像をフーリエ変換
    """
    global img2,px,py,tx1,tx2,ty1,ty2
    
    #ウィンドウを作成
    cv2.namedWindow("img",cv2.WINDOW_NORMAL)
    cv2.namedWindow("img2",cv2.WINDOW_NORMAL)
    cv2.namedWindow("f",cv2.WINDOW_NORMAL)
    #トリミングする画像領域の大きさを指定するバーを作成
    cv2.createTrackbar('x','img',10,300,nothing)
    cv2.createTrackbar('y','img',10,300,nothing)
    
    #マウスモーション
    cv2.setMouseCallback('img',mouse)
    
    
    img2=copy.deepcopy(img)
    
    #初期値
    tx1,tx2,ty1,ty2=0,5,0,5
    while(1):
        
        #バーから値を取得
        px = cv2.getTrackbarPos('x','img')
        py = cv2.getTrackbarPos('y','img')
        
        
        #マウス位置の周辺をトリミング
        img3=img[ty1:ty2,tx1:tx2]
        
        #フーリエ変換
        f = np.fft.fft2(img3)
        fshift = np.fft.fftshift(f)
        ms = 20*np.log(np.abs(fshift))
        ms=ms/(np.max(ms))*2**8
        
        
        cv2.imshow("img",img2)
        cv2.imshow("img2",img3)
        cv2.imshow("f",ms.astype(np.uint8))
        
        
        k=cv2.waitKey(1) & 0xFF
        if k ==27:
            break
        
        
        
        
        
    cv2.destroyAllWindows()


#フォルダーとファイル名
foldername=r"フォルダーの名前"
filename=r"ファイルの名前.jpg"

#画像読み込み
img=cv2.imread(foldername+"\\"+filename,0)


tes=fourie(img)
```

#結果
こんなかんじ。いろいろな画像で遊ぶと楽しい。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/240540/75bf5690-4057-7d7a-0a6b-8e76d5dbc1a1.png)




#参考文献
フーリエ変換
https://qiita.com/kon2/items/8290ac3e1b11e2308c14
https://algorithm.joho.info/programming/python/numpy-fast-fourier-transform/

四角作成
http://rasp.hateblo.jp/entry/2016/01/24/135417
マウス位置
http://labs.eecs.tottori-u.ac.jp/sd/Member/oyamada/OpenCV/html/py_tutorials/py_gui/py_mouse_handling/py_mouse_handling.html#mouse-handling
CopyとDeepCopy
https://qiita.com/Kaz_K/items/a3d619b9e670e689b6db
Windows使いがMacを買って思ったこと

##購入したMac
Macbook Air(2018)
CPU:Intel(R) Core(TM) i5-8210Y CPU @ 1.60GHz
メモリ:8GB
SSD:256GB

##なぜWindowsではなく、Macを買ったのか
Macやiosのアプリを作りたかったから。
また、bashが標準シェルなところも点数が高いと思う。
pyenvやrbenv、nodebrewなどを利用できて良い。
（Dockerを使って環境構築した方がモダンだし、ディレクトリ汚染も無いけど、私はローカルに環境構築したい派）

##なぜ今までWindowsを使っていたか
ゲーマーだし、VB.netやC#が好きだった。
また、安価に高スペックなマシンを用意できる点が良い。

##それぞれの好きなところ、嫌いなところ
###好きなところ
**Windows**
・ハイエンドマシンが安価
・ゲームやソフトが豊富
・自作できる
・メモリ増築などの改造が用意

**Mac**
・標準シェルが「bash」
・homebrewがめちゃめちゃ便利
・iosアプリが開発できる
・動作が軽快
・トラックパッドがめちゃめちゃ使いやすい
・iPhoneとの連携が便利

###嫌いなところ
**Windows**
・動作が重い
・セキュリティが脆い
・iosアプリが開発できない（厳密にはできるが、結局Xcodeがいる）

**Mac**
・高価
・アプリが少ない
・USB type-C以外はアダプタが必要

##WindowsとMacのどちらを買えばいいのか
個人的な意見として、今はMacです。
.NET Frameworkがクロスプラットフォーム化して、WindowsソフトをMacで開発できるようになりました。
さらに、今後UnityやUE4がゲーム開発現場の主なツールになるでしょうから、クロスプラットフォームなゲームが大量に出てくるでしょう。
MacやiosアプリがWindowsでも開発できるようになれば、どちらを使ってもそんなに差異は無いだろうが、そういった兆しは今のところありません。
（クロスプラットフォーム化やオープンソース化の波が来ていますが、swiftのオープンソース化から見て分かるように、どうやらiosやMacのアプリを他のOSで作らせる気は無いようです）

また、Windowsに比べて要求スペックを低く設定できるため、タブを何十個も開いて、高負荷作業をバリバリこなしたい人以外はMacbook Airで十分だと思います。