OmniAICreator/Qiita-1.07M huggingface dataset:
メモ：Google App Scriptの開発をClasp & Typescript & VSCodeでやるための準備


- Google App Scriptで開発する機会があったので、claspを使ってみることにした。開発環境のベースを用意するまでの手順をメモしておく。
- nodeはインストールされている前提です。

## claspをインストール
- Google App Scriptのプロジェクトをローカルで開発するのに便利なツール。
    - これがあると`clasp pull`とか`clasp push`とかでカジュアルな開発ツールのようにGASコードが扱える。
    - typescriptのトランスパイル機能もあり、素のjavascriptを書きたくない勢（自分）としては必須ツール。

```:bash
$ npm i @google/clasp -g
```

## googleにログイン
- claspインストール後にclaspでGoogle App Scriptを動作させるアカウントにログインする。

```:bash
$ clasp login
```

- ブラウザが起動してgoogleアカウントのログイン画面になるので普通にログインする。
- login後、以下のページにGoogle App Scriptの機能をONにしておこう。しておかないとGASがサーバ上で使えない。
    - [Apps Script - 設定](https://script.google.com/home/usersettings)

## typscriptをインストール
- typescriptで開発したのでtyepscriptも入れておく。tslintも一緒に。

```:bash
$ npm i typescript -g
$ npm i tslint -g
```

## プロジェクトを用意
- プロジェクトフォルダを作っていく。typescriptで開発したいので、`@types/google-apps-script`も入れる。tslintは必ず入れよう！
- srcはrootDirではなく、./src配下に入れる設定で`clasp create`する。

```:bash
$ mkdir sample
$ cd sample
$ npm init -y
$ npm i @types/google-apps-script -S
$ tslint --init
$ mkdir src
$ clasp create helloworld --rootDir ./src
```

- `clasp crate`すると`appsscript.json`が作成される。rootDirが`./src`になっていることを確認。


```:appsscript.json
{
    "scriptId":"****************************",
    "rootDir":"./src"
}
```

- とりあえずこの時点でgitでfirst commitしておこう。

```:bash
$ git init
$ git add .
$ git commit -m "first commit"
```

## claspでコードをpushする。
- 早速コードをpushしてみよう。今回は、ローカルで１から作っているが、すでに既存のコードがサーバ上にある場合は`git clone`のように`clasp clone`で紐づけることもできる。
- `./src/Code.ts`を作る。とりあえず`hello,world`出すだけでいい。

```:src/Code.ts
function main() {
  console.log('Hello World');
}
```

- ログはLoggerモジュールで出すこともできるし、普通にアプリ書く場合はそっちの方が素性が良いのだが、今回はstackdriverにログを出したいので`console.log`を使う。
- 早速pushしてみよう。

```:bash
$ clasp push
```

- 簡単だ。これだけでpushは完了する。ts（typescript）で書いたコードがトランスパイルされて、サーバ上に`Code.js`として配置される。

## typescript用のgitignoreを配置
- ソースコードはgithubで管理するので、`.gitignore`とかも入れておく。gitignoreはtypescript公式のテンプレートをとりあえず置いておく。[TypeScript/.gitignore at master · Microsoft/TypeScript](https://github.com/Microsoft/TypeScript/blob/master/.gitignore)

## vscodeのextensionを入れる
- 開発エディタは[Visual Studio Code](https://code.visualstudio.com/)を使うので、typescript用のextensionも入れておく。
  - [TSLint - Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=eg2.tslint)

## typescript用のedtorconfigを配置
- editorconfigはtypescript用のものを使う。
  - [TypeScript/.editorconfig at master · Microsoft/TypeScript](https://github.com/Microsoft/TypeScript/blob/master/.editorconfig)

## 終わり
- あとはvscodeでガンガンコードを書いて、`clasp push`するを繰り返すだけ。
- typessriptを簡単に扱えるようになって、ほんと素敵。。。
Finderのラベルとタグ

### これは何？

Finderのラベル/タグについて調べた。

#### Finder label / Finder tag

太古の昔からFinderではファイルに色つきのラベルを付けてファイルの整理などに利用することが出来ました。
また、Mavericksからユーザーが独自にタグを設定できる用になりました。
ただし、labelの互換性を重視したため、若干意味不明になっています。
このあたりを調べてみました。


##### Finder Label
Finder Labelは太古の昔より存在し、今もなお互換性を保とうとしているのかしていないのか謎の存在です。

太古の昔より現在に至るまでFinder LabelはFinder内では数値により管理されています。
この対応表は以下のようになります。

| 数値   | 色 |
|:-------|:-----|
| 0      | なし |
| 1      | グレイ |
| 2      | グリーン |
| 3      | パープル |
| 4      | ブルー |
| 5      | イエロー |
| 6      | レッド |
| 7      | オレンジ |

この数値はファイルシステム上の拡張属性 com.apple.FinderInfo に保存されます。


ここまではいいのですが、現在の Finder では別の並び順が与えられています。
これは Finder の UserDefaults のキーFavoriteTagNamesに配列として記録されています。
この値はFinderの環境設定より変更可能です。
理由は不明ですが、この順番はラベルの数値とは変わっています。
日本語環境のデフォルトでは以下のようになります。

| FavoriteTagNames<br>のindex   | 　値 |
|:----|:-----|
| 0      | （空文字列） |
| 1      | レッド |
| 2      | オレンジ |
| 3      | イエロー |
| 4      | グリーン |
| 5      | ブルー |
| 6      | パープル |
| 7      | グレイ |


Finder内での数値、色、FavoriteTagNamesのindexは以下の通りになります。

| 数値   | 色 | FavoriteTagNames<br>のindex   |
|:-------|:-----|:----|
| 0      | なし | 0 |
| 1      | グレイ | 7 |
| 2      | グリーン | 4 |
| 3      | パープル | 6 |
| 4      | ブルー | 5 |
| 5      | イエロー | 3 |
| 6      | レッド | 1 |
| 7      | オレンジ | 2 |

#### Finder Tag

Finder tagはMac OS X Marericsより追加された要素で、一般的なタグ同様に任意の数だけ、任意の文字列のタグを設定出来るようになっています。

値として、文字列と色の番号（Labelに用いられる番号）を\n区切りで連結した文字列が用いられる。

ex) タグ「ほげ」色「レッド」の時の値

```swift
"ほげ\n6"
```
この値はファイルシステム上の拡張属性 com.apple.metadata:_kMDItemUserTags にplistの配列で保存されます。

#### Finder Label と Finder Tag の魔融合

AppleはFinderにtagを実装するに当たり以下の仕様を要求したと思われます。

0. Finder Labelは互換性を保つ
1. ユーザーにLabelとTagの違いを認識させない

この2つの相反すると思われる仕様を満たすため、Finderの内部実装は奇妙なものとなっています。

##### Finder上でLabelを付与する

Finder上でLabelを付与すると以下の2つが行われます。

0. com.apple.FinderInfo に数値を設定する
1. com.apple.metadata:_kMDItemUserTagsに以下の文字列を追加する。
   0. ラベル名とラベルの数値を\nで連結した文字列

##### Finder上でLabelを削除する

Finder上でLabelを削除すると以下の2つが行われます。

0. com.apple.FinderInfo を削除する
1. com.apple.metadata:_kMDItemUserTagsから対応する文字列を削除する。


##### Finderの環境設定でラベル名を変更する

Finderの環境設定でラベル名を変更すると以下のことが行われます。

1. com.apple.metadata:_kMDItemUserTagsから対応する文字列を新しい文字列に置換する。

##### Finder上でTagを付与する

Finder上でTagを付与すると以下のことが行われます。

1. com.apple.metadata:_kMDItemUserTagsに以下の文字列を追加する。
   0. タグと色の数値を\nで連結した文字列。色が設定されていない場合は数値は0。

##### Finder上でTagを削除する

Finder上でTagを削除すると以下のことが行われます。

1. com.apple.metadata:_kMDItemUserTagsから対応する文字列を削除する。

##### Finderの環境設定でタグ/タグの色を変更する

Finderの環境設定でタグ/タグの色を変更すると以下のことが行われます。

1. com.apple.metadata:_kMDItemUserTagsから対応する文字列を新しい文字列に置換する。

#### 魔融合の問題

Finder上でLabelを操作する上では問題は起きないが、拡張属性はFinderを介することなく操作できるため、齟齬が発生することがあります。

ただし、Finderはこの齟齬を黙って無視しますので、普通は問題ありません。
また、Finderが同期するようです。（タイミング不明）

#### NSURLによるTagへのアクセス

[Finderなどで使用されるタグ/ラベルにアクセスする](https://qiita.com/masakihori/items/3e245e3d30a3dd429f07)

Finder Tagは上記方法により正しく設定される。

Finder Labelが上記方法により設定された場合、com.apple.FinderInfo は正しく設定されるが、com.apple.metadata:_kMDItemUserTags は変更されない。
すでにLabelが設定されている場合、com.apple.metadata:\_kMDItemUserTags が変更されないため、Labelの変更ではなく追加となる。


### まとめ

互換性のためと思われるが、かなり危うい方法が用いられている。
ぎりぎりセーフ。
スクレイピングについて~概念から使い方まで~

こんにちは、rickyといいます。
こちらの記事ではスクレイピングについての概要と実際に使う方法について説明していきます。

まずはじめにスクレイピングの概要についてです。
スクレイピングとはgoogle検索曰く『ウェブサイトから情報を抽出するコンピュータソフトウェア技術のこと。 ウェブ・クローラーあるいはウェブ・スパイダーとも呼ばれる。』だそうです。
グーグルの検索結果の並びは手作業でなく、このスクレイピング技術を使い、並んでいます。
たくさんのデータを処理する際や自動でテストをしたりする際に便利な技術です。
使いこなすとスプレッドシートに保存したデータを取り出して、順番に検索させて結果を返したり出来ます。
私の知っている範囲ではRubyやJava,pythonで実装されています。

次は使い方です
開発環境　Ubuntu18.10、python3.7.0、jupyter
リストの情報を順番に調べるプログラミングを書いてみます。
使用する前は予め
pip install seleniumでモジュールをインストールします。

ソースコード
from selenium import webdriver
import time

word_list = ['h','o','g','e','ho','ge']

url = 'https://www.google.com/'

browser = webdriver.Firefox()
browser.get(url)

for i in range(0,len(word_list)):
    search_window = browser.find_element_by_name('q')
    search_btn = browser.find_elements_by_name('btnK')
    time.sleep(5)
    search_window.send_keys(word_list[i])
    search_btn[1].click()
    browser.back()

検索窓と検索ボタンの値を探し出し、search_windowとsearch_btnに格納します。
send_keysというメソッドでリストの中身を検索窓に入力します。
time関数でsleepを入れているのは値を取得するまでに少し時間がかかるためです。
clickメソッドでボタンを押し、検索をかけます。
backメソッドでgoogleのホームページに戻ります。

まとめ
スクレイピングはpythonで書くとかなり楽に記述ができそうです。
読みたい本がたくさんあって、図書館にあるか調べたいときなどに便利です。
注意点といてスクレイピングはサーバーに負担をかけてしまうことがあるので、禁止にしているサイトもあります。
気をつけてください。
【設計時の見落とし】抽出処理系の考慮ついて

# はじめに
これは[設計時の見落とし Advent Calendar 2018](https://qiita.com/advent-calendar/2018/overlook)の22日目の記事となります。

業務アプリケーションの設計をするときに、見落としがちなところに焦点をあてて紹介します。 
下流工程からの手戻りを少なくして 双方の負担を減らしましょう。

今回は抽出処理系の考慮についてに2点挙げてみます。

# 条件指定の考慮点
## 検索時のFrom-To指定時のパターン 両方必須、片方のみ等

* 片方が未入力の場合、どうするのか
* From が入力されたら To に同値をセットするのか
* From が未入力なら最小値、To が未入力なら最大値をセットするのか

※ちなみに日付の最大値を入力した場合に、OSの日付型上 9998/12/31 が最大となるため、9999/99/99 には出来ません。

## 複数チェックボックスがあった場合、何も未チェックなら 全てと扱うのか
未入力はSQLのWHERE句から外すとした場合、**ゴミデータが混在する場合があります。**
運用上ゴミデータはありえないとさせるか、SQLにてWHERE句でIN句などで指定する必要があります。

## 検索時のFrom-To指定時のパターン２ キーを分離時
例として郵便番号を挙げますが、値として１つに格納している場合、下4桁を入力した検索をした場合は注意が必要です。 

|Fm1|-|Fm2|～|To1|-|To2|
|:--|:--|:--|:--|:--|:--|:--|
| |-|1111|～| |-|4444|

仕様を決めておかないと、抽出範囲が異なる場合があります。 
1. 0001111 ～ 9994444 の範囲内の郵便番号
2. 下4桁が、1111～4444 の範囲内の郵便番号

## その他
* 検索結果は、件数制限しても困らないのではないか (そもそも10000件も抽出されて全部見るのか、見ないよね)
* ワイルドカード文字のみの検出可能とするのか
* Trim処理をかけるのかどうか
* 論理削除したのも表示可能(背景色を変えるなどする)とするのか
* ○件単位でページ単位で一覧表示させるのか

抽出条件で一覧表示後に抽出条件項目の値を変えると、その抽出条件項目の値を参照して起動などのパラメータとして渡している場合には一覧表示とデータが不整合となる。
対応として、一覧表示後に抽出条件項目を編集不可とするか、抽出条件を保持してパラメータ引渡し時にチェックするようにする。


# 最新データの取得
仕様書に「最新のみをチェックオンの場合、最新のデータを取得する」とだけ書かれたものがありました。

抽出条件に日付範囲があるので、この範囲内で最新データを取得するまではいいのですが、問題は他の抽出条件を組み入れた場合です。

下記の2パターンが考えられます。
1. 複数項目の条件を抽出してから、日付範囲内の最新日を抽出する
2. 日付範囲内の最新日を抽出してから、複数項目の条件を抽出する

**データ例**

|顧客No|日付|区分1|区分2|
|:--|:--|:--|:--|
|1|2018/12/03|3|A| 
|1|2018/12/04|3|B|
|1|2018/12/05|1|C|
|2|2018/12/03|3|D|
|2|2018/12/04|2|E|
|2|2018/12/05|3|F|
|3|2018/12/03|5|G|
|3|2018/12/05|2|H|
|3|2018/12/06|4|I|

|抽出項目|抽出条件|
|:--|:--|
|顧客番号|1 ～ 3|
|日付範囲|2018/12/03 ～ 2018/12/05|
|区分1|3～5|
|区分2|A～Z|

## 1. 複数項目の条件を抽出してから、日付範囲内の最新日を抽出する
 
|顧客No|日付|区分1|区分2|
|:--|:--|:--|:--|
|1|2018/12/04|3|B| 
|2|2018/12/05|3|F|
|3|2018/12/03|5|G|

## 2. 日付範囲内の最新日を抽出してから、複数項目の条件を抽出する

|顧客No|日付|区分1|区分2|
|:--|:--|:--|:--|
|1|該当なし|  |  |
|2|2018/12/05|3|F| 
|3|該当なし|  |  | 

## 雑感
このように「最新のみ」といっても取得するデータが違ってきてしまいます。
なかなか気が付きにくい部分なので、ある程度データを入れて検証して設計していくといいでしょう。
曲げ回転をaimConstraintノードで取得する

[Maya Advent Calendar 2018](https://qiita.com/advent-calendar/2018/maya) 12月23日の記事です。

明日24日分の投稿予約を済ませました！
時間もあるのでライトなリグのTipsを載せておきます。

# 曲げ回転を得る
三次元回転は分解ができます。
三次元回転をそのまま利用するといろいろ難しい問題が出てきます。
この辺を細かく解説する力量は私にはないので、
回転は曲げ/捻りに分解できるよ！ということだけにしておきます。

詳しくは、ryusas氏の[maya_rotationDriver](https://github.com/ryusas/maya_rotationDriver)が参考になります。
上記は高度なので一旦は回転から曲げ回転だけ抽出してみましょう。

# シーン構築

以下のようなシーンを構築しました。
<img width="158" alt="スクリーンショット 2018-12-23 17.58.36.png" src="https://qiita-image-store.s3.amazonaws.com/0/328826/39745776-23f1-727a-933b-e2a5ea4ab068.png">

利用するのは以下のノードのみです。

| ノード名      |       説明 | 
|:-----------------|:------------------|
| src_joint        |コントローラーとなるノード。自由な三次元回転。原点に作成。|
| src_jointEnd    |src_jointの子供。TranslateXに5が入っています。|
| dst_jointBend    |src_jointから曲げ回転だけ抽出したもの。同じく原点に作成。|
| src_jointBendEnd    |src_jointBendの子供。TranslateXに5が入っています。|

# aimConstraintノードを作る
抽出するにはaimConstraintノードを利用します。
aimConstraintは目標物を追いかけるような挙動にしてくれるノードです。
aimConstraintの回転には捻りが含まれていないので、aimConstraintを使えばサクッと実現できます。

ちなみにMayaのメニューにあるaimConstraintコマンドは利用しません。
ノードエディターからtabキーでクリエイトして作ってコネクションしていきましょう。

作ったaimConstraintノードは「**bendConstraint**」という名前に変更しました。

# コネクションの作成

コネクションの全体像は以下です。
<img width="619" alt="スクリーンショット 2018-12-23 22.05.53.png" src="https://qiita-image-store.s3.amazonaws.com/0/328826/859d8ddb-156f-7239-7901-3c714e7ef31d.png">

## SetAttr
bendConstraint.worldUpType.set(4)
bendConstraint.target[0].targetTranslate.set(1,0,0)

## コネクション
src_joint.matrix >> bendConstraint.target[0].targetParentMatrix
bendConstraint.constraintRotate >> dst_jointBend.rotate

# 結果
わかりにくいですが…。
src_jointBendが一緒に動いています。
![Test.gif](https://qiita-image-store.s3.amazonaws.com/0/328826/9d03792a-5528-5a18-24a9-8f1871864616.gif)

# 次のステップに向けて
曲げ回転を抽出できたので、捻り回転も取り出したいですよね。
捻りは「元の回転 - 曲げ回転 = 捻り回転」です。
次のAdventCalenderの時にでも…ってかなり先だー！

それでは！
Transit Gatewayやってみた (Photocreate Advent Calendar 24日目)

SREディレクター の @ntakaaki です。フォトクリエイトではAWS・社内両方のインフラを担当してるチームのリーダーをしています。
この記事は [Photocreate Advent Calendar 2018](https://qiita.com/advent-calendar/2018/photocreate) の 24日目 の記事です。


#はじめに

これまでVPC間のPeeringをごく限定的にはやっていたのですが、増えたときの管理が
面倒そうということで積極的には手を出してませんでした。
[re:Invent2018](http://reinvent.awseventsjapan.com/)で[Transit Gateway](https://aws.amazon.com/jp/transit-gateway/)の発表があり、それが急遽東京リージョンでも使えるようになったので、触ってみました。

# Transit Gatewayとは

従来VPC間の接続はVPC Peeringをピアツーピアで張ることで確立していました。
ただ、接続する対象のVPCが増えてくるとこのピア接続がフルメッシュになってしまい、管理が大変になるという問題がありました。

[re:Invent2018](http://reinvent.awseventsjapan.com/)で発表された[Transit Gateway](https://aws.amazon.com/jp/transit-gateway/)（以下TGW）はTransitの名の通り
VPCやVPN接続の中心に位置して、それぞれの接続の相互の接続を管理してくれます。

具体的には接続したいそれぞれのVPCのサブネットをTGWにアタッチし、各VPC内のルーティングテーブルを設定します。
するとアタッチされたVPC間の通信をTGW経由で行うことができます。
TGWには複数のVPCやVPNをアタッチできるので、ここのVPC・VPN間同士を接続する必要がなくなり、ネットワーク設計を簡素化することができます。

# 基本的な設定
TGWはVPCの一機能という扱いのようです。
AWSのサービス一覧からVPCを選択し、左メニューの下段にTGWの項目があります。

<img width="179" alt="スクリーンショット 2018-12-23 18.22.33.png" src="https://qiita-image-store.s3.amazonaws.com/0/35149/eb15b236-5b09-605b-97ba-b8263daccd83.png">


## TGWの作成
メニューのTransit Gatewaysをクリックします。
Create Transit Gatewayをクリックします。


名前は適宜設定し、その他の設定はすべてデフォルトのままにしておきます。
Create Transit Gatewayをクリックして作成します。
完了するまでに数分かかります。


<img width="938" alt="スクリーンショット 2018-12-23 20.44.14.png" src="https://qiita-image-store.s3.amazonaws.com/0/35149/46854d36-8057-ad53-36e5-25e6c13e8b90.png">


## Transit Gateway Attachmentsの作成
TGWと接続したいVPCやVPNの接続の設定をします。

<img width="1172" alt="スクリーンショット 2018-12-23 18.25.37.png" src="https://qiita-image-store.s3.amazonaws.com/0/35149/76ca356b-f373-ea88-47e2-b1064424be83.png">



## ルートテーブルの設定
疎通を取りたい各VPCで、Destinationに相手のVPCのアドレスを指定しTargetに先程設定したTGWを指定します。
事前にTransit Gateway AttachmentでVPCをアタッチしておくことで、TargetのプルダウンでTGWを選択できるようになります。


<img width="1273" alt="スクリーンショット 2018-12-23 20.31.21.png" src="https://qiita-image-store.s3.amazonaws.com/0/35149/12bc10ab-565c-c44a-44d8-65d6a07611eb.png">

t
## SecurityGroupの設定
最終的に疎通を取りたいEC2などのリソースのSecurityGroupにアクセス元のIPを許可する設定をします。

今の所TGWにはアクセスを制限する機能などは無いので、疎通は通ったものの
HTTPしか許可したくないなどの個別の制御はSecurityGroupやNACLで対応することになります。

以上でごく単純なケースの設定はで来ました。
以降は接続したいVPC毎に上記の作業を繰り返していくことになります。

#他のアカウントのVPCとも通信したい

他のAWSアカウントのVPCをTGWにアタッチして通信することもできます。
事前に[リソースアクセスマネージャ](https://docs.aws.amazon.com/ram/index.html#lang/ja_jp)でアカウント間の共有設定を済ませておく必要があります。

リソースアクセスマネージャの設定は長くなるので割愛しますが、下記の記事が参考になると思います。

[[新サービス]でた！AWS Resource Access Manager(RAM)でクロスアカウントのリソース共有が可能に #reinvent](https://dev.classmethod.jp/cloud/reinvent-2018-ram/)


## まとめ

TransitGatewayの登場で複数VPC、VPNの接続の管理を簡素化することが期待できそうです。
今後AWSアカウントをサービスや環境別に分割することを考えているので、そうなると
必然的にVPCも複数できることになるため、リソースアクセスマネージャと合わせて活用していきたいサービスと考えてます。

フォトクリエイトではAWSなど、世の中で進化しているサービスを取り込みながら、ともにプロダクト・エンジニアとして進化していきたい方からの [ご応募をお待ちしております](https://recruit.photocreate.co.jp/entry/?utm_source=qiita&utm_medium=advc2018&utm_campaign=9960b669c360caba3259)。
ArduinoでNXTのモーターを制御する

 
 Arduinoで回転数を指定して回転できるモーターを使いたかったので、ロータリーエンコーダを内蔵しているNXTのモーターについて調べました。ここでは調べた内容と、実際に動かせるコードを記します。
#使用している物
* SainSmart MEGA2560 互換ボード R3 (ArduinoMegaの互換機)
* NXTモーター
* NXT用コネクタケーブル
* TA7291P(モータードライバIC)

# ピン配置
![pin.jpg](https://qiita-image-store.s3.amazonaws.com/0/245110/98a1fa40-a03e-2ea8-38db-7525adee865d.jpeg)

NXT用の端子の黒い膜を剥くと上の写真のように白、黒、赤、緑、黄、青の線が見えます。NXTのモーターにつなげた時、それぞれの役割は次のようになります。

| 色 | 記号 | 説明 |
|:---|:---|:-------|
|白　|MA0|モーター出力1|
|黒　|MA1|モーター出力2|
|赤　|GND|ロータリーエンコーダー用ICのGND|
|緑　|POWERMA|ロータリーエンコーダー用ICの電源|
|黄　|TACHOA0|ロータリーエンコーダー1|
|青　|TACHOA1|ロータリーエンコーダー2|

#ロータリーエンコーダ―について
 黄、青の線からは、その時点でのロータリーエンコーダ―の状態に応じて、0,1の信号が出ています。...→00→01→11→10→00→01→...のように、回転するごとに順に信号が出るようになっています。これはモーターの中に発光ダイオードとフォトトランジスタがあり、その間に一定の間隔で穴の開いた円盤が挟まれていて、それがモーターと一緒に回りフォトトランジスタに光が入る、入らないが繰り返されることで信号になっているようです。`ロータリーエンコーダ― 仕組み`などで調べれば、分かりやすく詳しい解説と図が出てきます。
 このロータリーエンコーダは、どちらの線の信号が変わるかによって前転、後転を見分けることができるようですが、今回は回転方向は一定のものとしているのでどちらかが変わったら1、両方が変わったら2、回転した(その回転角の大きさは調べていないのでわかりません)としてプログラムを作りました。

#回路
　白と黒の線をモータードライバICであるTA7291Pの2,10ピンにそれぞれ繋ぎました。後は赤、緑の線をArduinoのGND,5Vにそれぞれ繋ぎ、黄、青を任意のデジタルピンに繋げば、動作します。TA7219Pについては、`Arduino TA7291P`などと調べれば詳しく書かれています。

#プログラム
`motorRotation`関数でNXTのモーターを動かします。この関数の中の`for`文で、ロータリーエンコーダ―を`getAngle`関数で読み取って値を加算していき、指定した値以上になった時にモーターを止めるようにしています。PWMのピン以外はどのピンを用いても大丈夫です。

```c:NXT_motor.ino
//モータードライバーICのピン
#define IN1_PIN 12
#define IN2_PIN 13
//PWMで速さを変更する
#define VREF_PIN 11
//ロータリーエンコーダ―
#define TACHOA0_PIN 14
#define TACHOA1_PIN 15

//任意の大きさ回転する
void motorRotation(int angle);
//ロータリーエンコーダ―を読み取る
int getAngle();
//一つ前のループでのロータリーエンコーダーの状態を入れておく
int past_state[2];

void setup() {
  pinMode(IN1_PIN, OUTPUT);
  pinMode(IN2_PIN, OUTPUT);
  pinMode(TACHOA0_PIN, INPUT);
  pinMode(TACHOA1_PIN, INPUT);
}

void loop() {
  motorRotation(1000);
  delay(1000);
}

void motorRotation(int angle) {
  int now_angle;
  //状態を今のものに更新しておく
  past_state[0] = digitalRead(TACHOA0_PIN);
  past_state[1] = digitalRead(TACHOA1_PIN);
  //モーター駆動開始
  digitalWrite(IN1_PIN, HIGH);
  digitalWrite(IN2_PIN, LOW);
  analogWrite(VREF_PIN, 125);
  //指定された回数まで回転する
  for(now_angle = 0; now_angle <= angle; now_angle += getAngle());
  //ブレーキ
  digitalWrite(IN1_PIN, HIGH);
  digitalWrite(IN2_PIN, HIGH);
  analogWrite(VREF_PIN, 0);
}

int getAngle() {
  //今のロータリーエンコーダ―の状態を入れる
  int now_state[2]; 
  //加算する値を入れる
  int return_value = 0;
  //値を読み取る
  now_state[0] = digitalRead(TACHOA0_PIN);
  now_state[1] = digitalRead(TACHOA1_PIN);
  //前回の情報と比較して返す値を決める
  for(int i = 0; i < 2; i++) {
    //値が違えば動いているので、加算する値を増やす
    if(now_state[i] != past_state[i]) {
      return_value++;
    }
    //情報を更新する
    past_state[i] = now_state[i];
  }
  return return_value;
}
```
正常に動いていれば一度タイヤを手で止めても回り続けるので、それで確認できると思います。
#最後に
 NXTの部品もそれぞれの線が何に当たるかが分かればArduinoでも使えことるとが確認できたので、NXTのセンサーなども使ってみたいなぁと思ってます。
#参考
- [NXT Motor Shield]
(http://forum.arduino.cc/index.php?topic=65022.0)

- [ロータリエンコーダ編（原理と構造）オムロン制御機器]
(https://www.fa.omron.co.jp/product/special/knowledge/re/principle_structure.html)
ランダムな文字列を判定したい

与えられた文字列がランダムかそうでないかを判定したいと試行錯誤した記録です（勉強会で発表した[発表スライド](https://speakerdeck.com/mitsuharu/kyotolt22-20181109) の書き起こしです）．

## 追記

- 2019/06/05 PyPIに登録してみた
- 2019/06/12 実験2を追加しました

# 目的

ランダムな文字列の生成は簡単（本当にランダムなのかなどの面倒な話はなし）だが，ある文字列が与えられたとき、それがランダムな文字列かどうかを判定したい．

## 今回扱うランダムな文字列の定義

- rand関数などで無作為に生成された文字の列
- 平仮名だったり漢字だったり英数字だったりと様々
- 文字列の長さもランダム（ただし現実的な長さ）

# ランダムな文字列の特徴と検証

- 一様分布から生成されるので文字は均一に出現する
- 発音など単語の言語の生成規則やルールには従わない
- 意味がない単語が生成される

## 出現頻度の検証

- カイ二乗検定を使って，頻度の検定をする
- 長くて10文字程度の文字列では十分な検定できない
- 文字頻度が1ずつの単語だってある（例: word など）

## 可読可能の検証

- 母音や子音に分けて，その連続性を調べる
- 日本語は基本的に「文字≒発音記号」でした
- 海外（欧米圏）では対応手法あり

## 意味ありの検証

- 辞書データを作って，テーブルルックアップしよう
- 文字の揺らぎや三単現や軽い誤字の文字変化はどうしよう
- 未知な言葉はどうしよう

# 状態遷移モデルを用いて考えてみた

- ある状態から次の状態への遷移をモデル化したもの
- 文字を状態とし，文字列を遷移と考える
![apple.png](https://qiita-image-store.s3.amazonaws.com/0/24345/75c12633-661c-6538-450e-76980b54c46b.png)
- 文字 $i$ から文字 $j$ の遷移確率を ${p_{i, \ j}}$ とすると文字列の遷移確率は以下のうように求められる

$P = \prod_{i, \ j}{p_{i, \ j}}$

## 遷移確率から何がわかるか

- 状態遷移確率は，学習データの文字遷移パターンに従って，学習（計算）される
- 学習データと入力文字列のパターンが近ければ，遷移確率は大きくなり，反対に遠ければ小さくなる
- つまり，学習パターンに正しい単語データを与えれば，ランダムかそうでないかが判定できるはず

# やってみた

遷移確率を求めるプログラムと，その評価を行いました．

## 実装

- Pythonで愚直に頻度を計算してるだけです
- [mitsuharu/TextTransProb: It computes a transition probability of a text.](https://github.com/mitsuharu/TextTransProb)

## 実験

中学英単語一覧で学習して，適当な入力を与えた時の結果です．英単語とその他の適当な文字列は分かれているように見えます．検証は訓練とテストを厳密に分けてやるべきですが，対象が言語であり訓練と大きく異なる新語は頻繁には生成されないという仮定，類似度判定を目的としてるので，ある程度の性能は出ていると思ってます．

|入力|確率 |
|:-:|:-:|
|apple| 0.09252656|
|blue| 0.06042812|
|difficualt| 0.00774749|
|nvjhyhjnajas| 0.00018930|
|zf3cd| 0.00055871|
|ひらがな | 0.00000661|

また，英単語に関しては，全ての英単語を集めたリポジトリ [dwyl/english-wordsn](https://github.com/dwyl/english-words) があったので，英単語に関してはこれで学習すれば問題なさそうでした．なお，日本単語の良さげなリストは見つかっていないです．

## 実験2（追加，2019/06/12）

上記の英単語データ [dwyl/english-wordsn](https://github.com/dwyl/english-words) を使って学習したモデルを使って，中学で習う英語単語（約500語）と同数のランダム生成した英字列の確率を計算しました．下図から，それぞれのピークが異なっていることがわかります．

![Figure_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/24345/25c2e43f-6460-c18d-9ea1-374d67db408c.png)


# まとめ

このランダムの判定は，ある他の分類問題のための特徴量の1つにできないかと計算したものです．実際，このランダム判定を組み込んで，分類問題をやってますが，良い結果で出たので，まあ悪い手法ではなかったなと思ってます．

## PyPIに登録しました（追記, 2019/06/05）

この遷移確率計算をpip installできるように，[texttrans · PyPI](https://pypi.org/project/texttrans/) に登録してみました．英単語を学習済みで公開してます．日本語は良さげなデータがあれば，おいおい追加します．

```shell
$ pip install texttrans
```

```python
from texttrans.texttrans import TextTrans
p = TextTrans().prob("pen")
print(p) # 0.11640052876679541
```
Vue Cli 3 plugin for Electronの導入

##前置き
ワンクリックでvueを実行したいので、Electronを導入してみました。
ここでは、Vue Cli 3 plugin for Electronを使います。
また、Mac上で構築しています。

##導入方法
ターミナルを開き、Vue CLI 3で作成したプロジェクトフォルダに入ります。
(プロジェクト作成方法については[[Vue CLI 3でHello-Worldする](https://qiita.com/nullpo24/items/23b99246ac9bf77c1a2e)]を参照してください)

「hello-world」プロジェクト内でelectron-builderを導入します。

```
$ vue add electron-builder
```

アプリをビルドします。

```
$ yarn electron:build
```

dist_electron/macにelectronの実行アプリケーションが作成されていますので、ワンクリックで起動できるようになります。

<img width="610" alt="スクリーンショット 2018-12-23 22.09.51.png" src="https://qiita-image-store.s3.amazonaws.com/0/258049/4097a32a-9052-037e-c83f-6a9bb61d39d8.png">


##参考
Vue Cli 3 plugin for Electron
https://github.com/nklayman/vue-cli-plugin-electron-builder
Vimを使ってみる

#はじめに
　初投稿．最近のマイブームであるVimの設定ファイルをメモ程度にアップしてみる．
　初心者が言うに，初心者はやっぱり[Vim Adventures](https://vim-adventures.com/)とかvimtutorとかのほうをやったほうがいいと思う．
　注意：以下には大したことは書いてないので，他の記事を参考にしたほうがいいです．結構他の記事を参考にしてます．
　[何も考えず~/.vimrcにこれを書くんだ！ 〜vim初心者によるvim初心者のためのvim入門〜](https://qiita.com/morikooooo/items/9fd41bcd8d1ce9170301)
　[初心者向け vimrcの設定方法](https://qiita.com/iwaseasahi/items/0b2da68269397906c14c)

#Vimのインストール
　WindowsではKaoriYaとか使うけど，正直使ったこと無いので勘弁して下さい．

##Linux環境
　Linuxあんまり詳しくないけどとりあえず書く．
###Debian系

```
$ sudo apt install vim
```

　多分これでVimからVimtutorまで全部入るはず．
###Red-Hat系

```
$ sudo yum install vim
```

　これで行けるはず．

##macOS
　今使ってるやつ．一番慣れてる
###Homebrewのダウンロード
　無敵の最終兵器，Homebrew．MacOSには必須だと思う．
　導入自体は簡単なので，[ホームページ](https://brew.sh/)を参照のこと（英語）．

```
$ brew install vim
```


#肝心の設定ファイル
　もちろん，

```
$ vim ~/.vimrc
```

で開く．

```vim:.vimrc
#文字コードを設定
set fenc=utf-8
#バックアップファイルを作らない
set nobackup
#スワップファイルを作らない
set noswapfile

set autoread
set hidden
set showcmd

#シンタックスハイライト
syntax on

#アラームを鳴らさない
set noerrorbells

set shellslash
set guioptions+=a

#行番号をつける
set number
#現在の位置を強調する
set cursorline
set cursorcolumn

set virtualedit=onemore
set visualbell

#組み合わせを表示
set showmatch

set laststatus=2
set wildmode=list:longest
nnoremap j gj
nnoremap k gk

#バックスペースを有効に
set backspace=indent,eol,start

#スマートインデント
set smartindent

#タブはスペース
set expandtab

#Python公案に準拠
set tabstop=4
set shiftwidth=4

#大文字小文字の区別を無視
set ignorecase

set smartcase
set incsearch
set wrapscan
set hlsearch

#Molokaiの準備ができたらコメントアウト
#set background=dark
#colorscheme molokai
#set t_Co=256
```

#あとがき
　シンタックスハイライトはゲテモノ？　じゃないけど，なんか奇をてらったようなヴィヴィッドなテーマが好き．
　iTerm2ではRefinedを使ってる．
　シェルについては次回あたり投稿します．

#追記
　シェルのところに$入れるの忘れてました．すいません．
SECCON 2018 オンライン予選 Writeup[History]

SECCON 2018 オンライン予選 Writeup[History]

このブログは、[大国魂（ITブログ） Advent Calendar 2018](https://adventar.org/calendars/3489) の23日目です。

# この記事の内容について
インフラ運用者ではあるもののセキュリティに興味があるので SECCON 2018 オンライン予選 に参加した筆者が、良質な Writeup がたくさんあるにもかかわらず自身の振り返りも兼ねて解けた問題の Writeup を書いた、というものになります。

予選終了後、便利に参照させていただいていた記事は[こちら](https://qiita.com/nicklegr/items/51cbc4ff59d245646988)になります。

今回は比較的簡単な Forensics の History について振り返ります。

# History

## 問題文
History Check changed filename.
ファイル名の変更履歴をチェックしろ、という問題のようです。

## J.zip ファイルの中身について

- J という 3.9[MB] 程度のファイルが1つ展開されます。
- 中身はテキストエディタでも読めなくはないですが苦しいため、何らかの適切なエディタで読みたいところです。
  - `M i c r o s o f t - W i n d o w s -*` など、Windows のファイル名と思われる文字列が見受けられます。

# 解法
## 解き方

J というファイルは NTFS のジャーナルファイルとなるため、
適切に読み取れるツールを利用することでより簡単にフラグ `SECCON{F0rensics_usnjrnl2018}` を得られます。

## たどり着くまでの経緯
- `windows ファイル名 履歴` などでググりましたが解法につながる情報が得られず。
- 過去に何か履歴的なデータがあるというのを見聞きしたことあるなぁという記憶があったものの思い出せず。
- 方向性を変えて Windows のファイルシステム NTFS 観点で何かないかと `ntfs ファイル名 履歴` を検索したところジャーナルファイルがヒット。これだと思い出す。
- [USNジャーナル解析の追求](https://www.jpcert.or.jp/present/2018/JSAC2018_03_yamazaki.pdf) に記載されている [usn_analytics](https://www.kazamiya.net/usn_analytics/) というツールを利用して J の内容を CSV ファイル(中身は TSV )に出力。
PDF 内でも解説されていますが、USN は [Update Sequence Number](https://en.wikipedia.org/wiki/USN_Journal) とのことでした。
  - usn_analytics ページ内に記載されたそのままですが、以下で実行ディレクトリの output フォルダに J の内容を TSV に変換して出力できます。

```
C:\>.\usn_analytics.exe -o output .\J
4093104 bytes (.\J)
Search USNRECORD.........Done
       0 corrupt records skipped
   43313 records found
Check records....................Done
Path construction...................Done
    4880 records after packing
Write records.........Done
Check executed trace...Done
Check opened trace...Done
Check suspicious trace...Done
CPU Time: 17.408000
Processed Time: 18(s)
```

- 出力された TSV の中をひととおり確認。内容的に `usn_analytics_records-20160108T004818.csv` の中身にフラグがありそうな予感。
- `usn_analytics_records-20160108T004818.csv` の Reason 列に RENAME の項目が見受けられたので、Reason 列を RENAME で絞り込み(実際は EXCEL で rename をすべて検索した結果を眺めてました)、その結果からフラグを確認しました。

![forensic_usnjrnl.png](https://qiita-image-store.s3.amazonaws.com/0/327348/bb843a03-eac1-459a-6717-6141f79ed2be.png)

- より絞り込みたい場合は FileID を 60666、ParentID を 48 に絞り込むことでフラグファイルの履歴のみを確認可能です。

```
Usn	Records	TimeStamp(+09:00)	TimeTaken	FileName	Reason	FileAttr	FileID	ParentID	Path
24920792	3	50:47.3	0	SEC.txt	CREATE|EXTEND|CLOSE	ARCHIVE	60666	48	
24922120	3	51:24.6	0	SEC.txt -> CON{.txt	RENAME	ARCHIVE	60666	48	
24928696	3	52:22.8	0	CON{.txt -> F0r.txt	RENAME	ARCHIVE	60666	48	
24936008	3	52:53.7	0	F0r.txt -> ensic.txt	RENAME	ARCHIVE	60666	48	
24936544	3	53:08.6	0	ensic.txt -> s.txt	RENAME	ARCHIVE	60666	48	
24943752	3	54:24.5	0	s.txt -> _usnjrnl.txt	RENAME	ARCHIVE	60666	48	
24944768	3	54:38.4	0	_usnjrnl.txt -> 2018}.txt	RENAME	ARCHIVE	60666	48	
```

# 問題について
## 題意的な何か
Forensics の区分ということでそのままですが、デジタルフォレンジックに関する問題となりました。
外部からの攻撃があったっとしても内部不正があったとしても、Windows で通常使用している NTFS であれば追跡可能ですよ、というお話になるのかなと。
ビブリオバトルするなら選ぶ予定のAlexaスキル

ごきげんよう

この記事は
**「するめごはんのVUI・スマートスピーカー Advent Calendar 2018」**
の22日目の記事です。


来年の某イベントで、自分のオススメのスキルを選んで、それを集まったみんなで試すという**ビブリオバトル** なイベントをやる流れなのですが、そこで紹介しようと思っているスキルをここに記載しておきます。


今年1年、いろんなイベントで、いろんなVUIのスキル・アプリを観てきました。
イベントで見たのもあれば、人から勧められたのもありますが、僕が知る中で、個人単位で、 **色んな意味でもっともがんばってる** と勝手に思ってるAlexaスキルのうちの1つは

**強欲なうさぎの迷路**

だと思ってます。

#Amazonのスキルストアの結果

以下は、Amazonのサイトで「強欲なうさぎの迷路」の検索結果です。

![gouyoku.png](https://qiita-image-store.s3.amazonaws.com/0/67398/993314a7-6619-c5cf-c480-857f1bf5e746.png)



これ、審査通るのかよ！ｗ
という内容です。

## 詳細説明を読んでみると凄すぎる

以下の文言で掲載されてるのが凄すぎる。

・Wi***dry彷彿とさせる
・画面がなくても難易度は高いですが遊べます
・方眼紙でマップ作製
・アイテムの名称はランダムで65536通り

#知った機会

VUI LT7で作者がこのスキルについて登壇なさってました。

■VUI LT7
https://iotlt.connpass.com/event/104481/

#何がすごいかは見ればわかる

Echo Showでのプレイ動画をあげました

https://www.youtube.com/watch?v=-j3ySj_fHsA


あのゲームを再現しているのがわかります。
これをEcho Dotなどの音声のみでやらせるという流れがすごい。

僕は画面があってもわかんないですからね。。。

##画像作成にこだわりまくっている

上記connpassのスライドにあるのですが、

・通勤電車内でドット絵を描いた
・迷路画像256パターン全部作った
・迷路生成ロジックがガチだし、0.5msで生成される

VUIのイベントで、「ビット演算」とかこのセッション以外聞いたことないです。




#APL対応したらどうなるのか

このスキルをAPL対応させるとどうなるのか、ものすごい興味があります。

たぶん、現時点での描画の方があえていいんでしょうけども。


#がんばってる感は半端ない

VUIでWi***dryをやるという発想から、ビット演算とかドット絵とか考え抜いて、審査通過して公開されてるわけです。

埋もれてしまうには、あまりにも残念なので、ご関心ある方はプレイしてみてください。



以上。
爆速でアイデアをパクる！1時間でハッカソン横断検索ツールできたよ

# TL;DR
世界中のハッカソンのプロジェクトを横断検索できるよ！
http://hackathons.hiroga.cc.s3-website-us-east-1.amazonaws.com/

# 種明かし
実はサーバー側の処理は全くありません。
Googleの `site:` 検索クエリを自動生成してくれるだけの簡単なサイトです。

## ソースコード抜粋
（リポジトリ: https://github.com/hiroga-cc/hackathons）

```
const URLS = [
  "https://www.hackster.io/projects",
  "https://hackdash.org/projects",
  "https://devpost.com/software",
  "spaceappschallenge.org/project",
  "http://www.hackathon.io/projects",
  "https://protopedia.net/prototype"
];

const search_projects = function() {
  const head = "https://www.google.com/search";

  const keywords = $("#keywords")
    .val()
    .split(" ")
    .reduce((word, words) => words + "+" + word);

  const sites = URLS.map(url => "site:" + url)
    .map(url => encodeURIComponent(url))
    .reduce((site, current_sites) => current_sites + "+OR+" + site);

  const url = head + "?q=" + keywords + "+" + sites;
  console.log(url);
  // こうなります。
  // https://www.google.com/search?q=health+food+site%3Ahttps%3A%2F%2Fprotopedia.net%2Fprototype+OR+site%3Ahttp%3A%2F%2Fwww.hackathon.io%2Fprojects+OR+site%3Aspaceappschallenge.org%2Fproject+OR+site%3Ahttps%3A%2F%2Fdevpost.com%2Fsoftware+OR+site%3Ahttps%3A%2F%2Fhackdash.org%2Fprojects+OR+site%3Ahttps%3A%2F%2Fwww.hackster.io%2Fprojects
  window.open(url);
};
```

# あとがき
他にもハッカソンのプロジェクトまとめサイトあったら教えてくださいね〜！
Windows Server2016(以降？)メモ

Windows Server 2016の環境構築後に設定する内容や、調査したことなどを自分用の備忘録として記載。
Windows10環境でも使えるかもしれないの。

# 1.TIPS

### デスクトップにマイコンピュータを表示
1.デスクトプで右クリックし、「個人設定」を選択
2.[テーマ]-[デスクトップアイコンの設定]を選択

またはコマンドプロンプトから以下を実行しても可。

```
"C:\Windows\system32\rundll32.exe" shell32.dll,Control_RunDLL desk.cpl,,0
```

### 自動ログイン
コマンドラインから以下を実行

```
netplwiz
```
「ユーザーがこのコンピュータを使うには、ユーザー名とパスワードの入力が必要」のチェックを外す

![image.png](https://qiita-image-store.s3.amazonaws.com/0/187121/366d828e-1688-ad39-10bf-1abd888033a4.png)


### IEでファイルをダウンロードできない。
以下のエラーが出る場合は

![image.png](https://qiita-image-store.s3.amazonaws.com/0/187121/1a74d5d9-7393-db11-8ac2-0ac80ea6d6cf.png)

インターネットオプションの設定で、ダウンロードを許可する必要がある。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/187121/9fbc445b-7989-1fb0-6ea8-87f99874b00c.png)

### IEで「下に表示されているWebサイトのコンテンツは、Internet Explorerセキュリティ強化の構成によってブロックされています。」が表示される。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/187121/a1c86a05-2cde-b5b5-7955-19b764bb0e1c.png)

「サーバマネージャ」を起動し、「ローカルサーバ」のプロパティにある「IEセキュリティ強化の構成」を無効にする。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/187121/0a865e48-3c8c-6f43-cfa6-7852ab6c45ba.png)

## Windows Update
proxyを使う環境の場合は、IEとWinHTTPのproxy設定を行う必要がある。

```:設定の確認
netsh winhttp show proxy
```

```:設定
netsh winhttp set proxy proxy-server="myProxyServer:8080" bypass-list=<バイパスリスト>
```

# 2.ネットワーク周りのTIPS
netshは色々便利そうなので、使い方をメモする。(検証はWindows10環境だが、Server2016でも同様だと思われる)

## 2-1.特定の相手先に繋がらないようにする。
netshでできないか調べていたが、わからなかった。
とりあえずhostsファイルに繋げたくない接続先の名前とプロキシサーバの名前を127.0.0.1を返すように設定して対応。
hostsファイルは編集できないので、別の場所で編集して上書きコピーする運用とした。

## 2-2.IPv6を無効化
ネットワークアダプタのプロパティで、「インターネットプロトコルバージョン6 (tcp/ipV6)」のチェックを外しても、「PING LOCALHOST」を行うと「::1」に対してPINGを行ってしまう。
npm versionのように簡単にgitのタグを使ってセマンティックにバージョンアップをするワンライナー

OSSや多人数でのプロジェクト開発をしているときに必要になってくるのは、プロジェクト自体のセマンティックなバージョン管理かと思います。
特にインストール型のプロジェクトでは、現在のユーザのバージョンと比較して、インストールさせるべきか、させる場合はどういうメッセージを出すかなどを判断するのに、メジャーバージョンやマイナーバージョン、パッチバージョンなどのバージョンを比較しているかと思います。

npmであれば、`npm version`を使うと、Node.jsをもちいたパッケージのバージョンアップを簡単にできる様になっているかと思います。
ただ、そういった機能が備わっていない言語の管理やパッケージ管理ツールを使っていないプロジェクトなどでは独自にセマンティックバージョンを管理する必要があり、それを毎回最新のタグをみて更新するのは面倒かと思うので、ワンライナーで簡単に管理できるようにしました。

# 導入方法

まず、下記のシェルスクリプトをどこかに配置します。
著者はzshを使っているので、`~/.zsh/version_up.sh`に設定しています。

```zsh
#!/bin/sh
version=`awk '{print $1}' < /dev/stdin`
command=$1
major=`echo $version | awk -F '.' '{print $1}'`
minor=`echo $version | awk -F '.' '{print $2}'`
bugfix=`echo $version | awk -F '.' '{print $3}'`
build=`echo $version | awk -F '.' '{print $4}'`

if [ -z "$version" ]; then
  echo "USAGE: echo 1.0.0 | version_up.sh [major|minor|bugfix|build]"
  exit 1
fi

if [ "$command" = '' ]; then
  if [ -n "$build" ]; then
    build=`expr $build + 1`
  elif [ -n "$bugfix" ]; then
    bugfix=`expr $bugfix + 1`
  fi
elif [ "$command" = 'major' ]; then
  major=`expr $major + 1`
  minor=0
  bugfix=0
  build=0
elif [ "$command" = 'minor' ]; then
  minor=`expr $minor + 1`
  bugfix=0
  build=0
elif [ "$command" = 'bugfix' ]; then
  bugfix=`expr $bugfix + 1`
  build=0
elif [ "$command" = 'build' ]; then
  build=`expr $build + 1`
fi

if [ "$command" = "major" -o "$command" = 'minor' -o "$command" = 'bugfix' ]; then
  if [ -n "$build" ]; then
    build=0
  fi
fi

if [ -n "$build" ]; then
  echo ${major}.${minor}.${bugfix}.${build}
else
  echo ${major}.${minor}.${bugfix}
fi
```
次に`~/.zshrc`内部に下記スクリプトを記載します。

```zsh
alias vup="git tag -l | tail -n 1 | sed 's/[^0-9\.]//g' | ~/.zsh/version_up.sh" # version up string
```

最後に下記のコマンドで実行するだけです。

```terminal
$ git tag -l
v1.6.1
$ vup major
2.0.0.0
$ vup minor
1.7.0.0
$ vup bugfix
1.6.2.0
```

あとはこの出力されたバージョンを使ってタグを生成してもいいし、何かしらのファイルに出力するのでもいいと思います。
Go モジュールと依存関係

# Go モジュールと依存関係

チュートリアルの続きをしようと思ったら、パッケージの依存関係のエラーに遭遇してしまい(原因不明)。Goのパッケージ管理について学習しました。



## 今までの背景を振り返ってみる

### Go get パッケージ名

指定パッケージのGitリモートリポジトリを$GOPATH/srcへダウンロード

依存関係のGitリモートリポジトリを$GOPATH/srcへダウンロード



普通に利用すると以下の状態になる。

* $GOPATHは一つ
* go getでは常に最新バージョンを取得する



以下のような課題を持つ

プロジェクトA -> 外部パッケージ(1.0)

プロジェクトB -> 外部パッケージ(1.0)

*外部パッケージは誰かが作った、オープンソースのイメージです。



プロジェクトBの外部パッケージを1.0 → 1.1にしたい

```bash
go get 外部パッケージ
```
プロジェクトA -> 外部パッケージ(1.1)

プロジェクトB -> 外部パッケージ(1.1)



プロジェクトBだけの更新ができない。

### dep

プロジェクト個別に依存関係のパッケージのバージョン管理ができない。

ここでdepを利用する。(vendoringもありましたが割愛します)



 * Gopkg.lockファイル：
    利用しているパッケージの最新バージョンの一覧情報的なもの。どんなパッケージに依存しているかわかりやすい
 * Gopkg.tomlファイル：
    利用しているパッケージのバージョンを固定する。最新を取得しないように制限

上記のファイルでバージョンを管理すれば、明示的にプロジェクトないしパッケージ毎にバージョンを管理できるようになった。



**まだ一番重要な課題が残っている！**

プロジェクトは一旦一つとして考える。

自作モパッケージA -> 外部パッケージA(1.0) -> 外部パッケージB(1.0).funcX()

自作モパッケージB -> 外部パッケージB(1.0)

この状態で自作パッケージBの方で、外部パッケージのバージョンを1.0 → 1.1に更新したい。



ここで、外部パッケージB(1.1)で外部パッケージA(1.0)から呼んでいたfuncX()が削除されてしまったら問題が発生しそうです。



## どう解決された？(vgo)

まだ正式リリースではないので、色々課題は残っていると思いますが

go1.1からvgoが公開されました。

go1.1ではmoduleという概念が増えています。

vgoのバージョン管理はセマンティックを採用しています。



### セマンティック バージョニング

詳しくはこちら

https://semver.org/lang/ja/



個人的に重要なポイントだなと思ったのは以下

> セマンティック バージョニングを適用するソフトウェアはパブリックAPIを宣言しなければなりません

moduleという概念でバージョンを定義する。

moduleの一番嬉しいポイントとしては、以下に書く、依存関係の問題を解消する手段ができたなのかなと思っています。

*他に大きなメリットを知っている方がいましたら、教えて頂けると嬉しいです。



細かいバージョンの切り方についてはまだ踏み込んでいないのですが、

少なくとも、各パッケージ毎に自分が呼んでいるパッケージと**そのバージョン**を持つようになります。



上記によって以下が解決される(自作パッケージBが呼んでいる、外部パッケージBのバージョンのみ変更可能)

自作モパッケージA -> 外部パッケージA(1.0) -> 外部パッケージB(1.0).funcX()

自作モパッケージB -> 外部パッケージB(1.1)



また、セマンティックバージョンをみんなが意識することで、外部パッケージをどのバージョンまで上げて良いのかがわかるようになります。



バージョン番号x.y.z

xを変更すると、後方互換性を保っていません。→動作保証しません

となるので、先ほどの例だと1.y系は更新のリスクが低いが、2.y系は心してテストするか修正を伴うということがわかるようになります。



## 感想的なもの

vgoの適用タイミングは各プロダクトの状況に合わせてになると思います。



Javaの経験が長いのですが、恥ずかしながら、勉強不足かつ業務未使用というのもあり、moduleについては触れてこなかったため、このタイミングで少しだけ比較をイメージしてみました。



Javaでも同じような問題を抱えていると思います。(OSS、J2EEなど巨大なので根が深い？)

mavenなどでバージョンの管理はできるけど、depと同じような状況なのかなと。

JDK9でmoduleの概念が導入されているが、Javaの場合は、依存性管理については切り離すという方向性のようです。vgoのようにモジュール毎に依存関係のバージョンを持たない。



Javaは11になっても、この問題を解決するには苦労するのかなと思ったりすると、ちょっと頭が・・

モジュール対応も半ば強制的に対応させられるような形で大きな変更が入っていますが、使い所がイマイチ見えておりません。



最後に、実装して確認するまでの時間が取れなかったので、想像で書いているところもあります。視野がまだ狭くてmoduleの概念について理解できていないところもあると思います。
postgresqlの設定

#はじめに

とりあえずブラストワンピース有馬記念勝利おめでとう:sunny:

それで今回はpostgresqlの最初の設定について忘備録として書いていく。

osはubuntu。


#postgresqlインストール

postgresqlをインストールするには

```
sudo apt-get install postgresql
```

でOK

そのあと

```
sudo passwd postgres
```

でパスワードを設定する。

#sqlサーバーに接続

sqlサーバーに接続する

```
su postgres
```

のあとパスワードが求められるから入力、そのあと

```
psql
```

と入力すれば

```
postgres=#
```

みたいな文字が出てくる。


だがここで自分の場合は


```
psql: could not connect to server: No such file or directory
        Is the server running locally and accepting
        connections on Unix domain socket "/var/run/postgresql/.s.PGSQL.5432"?
```

こんなエラーがでた。

そもそもs.PGSQL.5432なんてファイルないしどうしよう…と思って調べていたが動やらこのエラーはsqlのサーバーを起動していないために出るらしい。


なのでこのエラーがでたら


```
sudo /etc/init.d/postgresql start
```

と打てばOK


無事sqlが起動されエラーが出なくなるはず。


#createuserができない

とりあえず設定は終わったと思ってcreateuser -d -P nameとしてrailsのアプリで使うユーザを作成しようと思ったらこんなエラーがでた


```
createuser: could not connect to database postgres: FATAL:  role "root" does not exist
```

どうやらrootというroleがないことが問題らしい


ロールの作成の仕方は

```
su postgres
psql
```

と打って表示がpostgres=#となったら

```
CREATE ROLE rolename LOGIN CREATEDB CREATEROLE PASSWORD 'password';
```

とすればOK

CREATEROLEを書かないと

```
createuser: creation of new role failed: ERROR:  permission denied to create role
```

このように怒られる。


ちなみにロールの情報を変更したい場合は

```
ALTER ROLE name WITH CREATEROLE 
```

のように変更できる。


#railsでpostgresqlをつかう

railsでpostgresqlを使う場合

まず

```
createuser usernmae
createdb dbname
```

としてuserとdbを作成する

rails newするときに

```
rails new name -TB --database=postgresql
```

とすることでpostgresqlをつかうrailsアプリを作れる。

config/database.ymlのdefault:　のところに

```
username: username
password: pass
host: localhost
```

を追加で書き込む

developmentのところの

```
database: dbname
```

も書き換える。


これでrailsでpostgresqlを使うことができるようになった:sunny:



#参考文献



インストールからRails-PostgreSQL環境を整える
https://qiita.com/torini/items/9952d91c4a7087b23481


Rails で postgresql を使う(インストールからマイグレーションまで)
https://qiita.com/longtime1116/items/9045717ff8607bed07fe
GUI(tkinter)を使い，時刻を表示する　No.3

#ターミナルではなく，GUIで時刻を知りたい．
このページは[GUI(tkinter)を使い，時刻を表示する　No.2](https://qiita.com/ayousanz/items/ac09dbfbb3d0f1d8a835)の続きに当たります．
##実現したいこと
・時刻を更新できるようにする．
・一つだけの表示する．

##使用するもの
tkinterを使い，GUIを使えるようにする．

##方法
```python
from datetime import datetime
import tkinter
import time

w=800
h=600

root1=tkinter.Tk()
root1.title("timer")
root1.geometry("800x450")
canvas=tkinter.Canvas(root1,width=w,heigh=h)
canvas.pack()#ここを書かないとcanvasがうまく入らない．

while True:
    now_h=datetime.now().hour
    now_s=datetime.now().second
    now_m=datetime.now().minute
    now_time=str(now_h)+":"+str(now_m)+":"+str(now_s)
    canvas.create_text(w/2,200,text=now_time,font=("",50,"italic"),tag='Y') #タグを入れることで更新できるようにする．
    canvas.update()
    canvas.delete('Y')
    time.sleep(0.5)



```
##結果
<img width="797" alt="スクリーンショット 2018-12-23 21.27.45.png" src="https://qiita-image-store.s3.amazonaws.com/0/241933/214f8d99-a0aa-aa1a-c0d0-d8d8c78338a4.png">


##考察
背景に画像を入れるために，canvas.Photoimageを試したが，うまく行かなかった．

参考ページ
・[簡単なアナログ時計](https://qiita.com/ty21ky/items/c4e91fbb749ae2309f69)
・[python tkinter フォント(font)の設定方法](http://memopy.hatenadiary.jp/entry/2017/06/11/112619)
UnityでVRゲーム作ったログ

# はじめに
VRゲームを作ってみたのでその記録です。

# 環境
・Unity 5.6
・SteamVR Plugin 2.0
・HTC Vive

# 1.SteamVRプラグインの導入
##### Unity＋HTC Vive開発メモ
わかりやすい。2.0の情報はまだ少ないようですが。
https://framesynthesis.jp/tech/unity/htcvive/

# 2.設計
どんなゲームにするか考える。完成イメージを固めておくとモチベを保ちやすい……と思います。
![プレイ画面.jpg](https://qiita-image-store.s3.amazonaws.com/0/289350/28e4da4a-54bf-6bf1-6023-3317ab0d4e08.jpeg)



# 2.素材集め
使うものをかき集める。あるものは使っておく方が楽。
##### Unityアセットストア
今回は、地面(1ドル)、天球テクスチャ(1ドル)、エフェクトで使用。
https://assetstore.unity.com/

アセットストアのものはシーンに配置するだけで完成度が上がった気分になれます。
下は天球に夜空を張り付けて、地面を配置したとき。
<img width="246" alt="2.png" src="https://qiita-image-store.s3.amazonaws.com/0/289350/f4047364-a4d0-120d-6070-69a8a924471e.png">


#### 自作
時間とスキルがあるなら自作もアリ。自作すると愛着がわく。
今回はコインのテクスチャを自作。Unity側で円柱型オブジェクトに単純に張り付けたからか、側面が変になってますね。
<img width="218" alt="coin.png" src="https://qiita-image-store.s3.amazonaws.com/0/289350/be1a1e50-795c-1c1a-02e4-ee21f32dc4e4.png">

# 3.コーディング
スクリプトを作ってオブジェクトに付けていきます。
アクション系のゲームにすると物理特性を使えば制御が少なくて済むのでお勧めです。
##詰まったところメモ
### Viveコントローラの入力値受け取り
①Window > SteamVR Input
②Actionsの「+」ボタンでAction追加。名前とInputを適当に決める。
③SteamVR Inputウィンドウ下部の「Open binding UI」押下。ブラウザで設定画面が開かれる。
④それぞれのボタンは受け取る型が決まっているので、②でその型を設定しているアクションしか候補に出てこない。←詰まったところ。
⑤紐づけたあとは「Replace Default Binding」→ Unityに戻ってSteamVR Inputウインドウの 「Save and generate」で必要なファイルを作ってくれる。
⑥コード

```c#
	public SteamVR_Input_Sources hand;
	public SteamVR_Action_Boolean teleport;
	public SteamVR_Action_Vector2 trackpad ;
	void Update () {
		if (teleport.GetStateDown (hand)) {
			TrackPadManager (trackpad.GetAxis(hand));
		}
	}
```
# できたもの
コインがたくさん落ちてくる。
コインに手が触れるとエフェクトがキラキラする。
動画

<blockquote class="twitter-tweet" data-lang="ja"><p lang="es" dir="ltr">hc demo <a href="https://t.co/osvAAucYNw">pic.twitter.com/osvAAucYNw</a></p>&mdash; ぶいしー (@vc_dev_alx) <a href="https://twitter.com/vc_dev_alx/status/1076813273981480961?ref_src=twsrc%5Etfw">2018年12月23日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>




# ４.まとめ
### 課題
- 前にしか移動できなくて不便なので、移動システムを良くする。
- さびしいので効果音をつける。
- スコアを表示するUIをつくる。

### 感想
- もう少しSteamVR Plugin2.0の情報が巷に出そろってからやるほうがよさそう。
- 天球と地面を配置すれば好きなVRワールドを簡単に作成できる。
- 3日間で完成を目指しましたが、かろうじてプレイしているように見えるところまでとなりました。
Re.dashのインストール

メモ

# 前提条件
- CentOS7

# 手順
1. 依存ライブラリをインストールする

    ```
    # yum -y install pwgen wget
    ```

2. Gitリポジトリをクローンする

    ```
    $ git clone https://github.com/getredash/redash.git
    ```

3. redashディレクトリに移動してシェルスクリプトを実行する

    ```
    $ cd redash/setup
    $ ./setup.sh
    ```

# 参考
- [Setting up a Redash Instance](https://redash.io/help/open-source/setup)
Power BI のストリーミングデータセットにAPI使って直接データぶん投げてみて失敗した話

# 今日の記事は・・・
Microsoft Power BI Advent Calendar 2018 23日目のお話です。

# 予め言っておきます。
今回は失敗した話です(´；ω；`)
私の理解不足の可能性大・・・

# 成功しました！
[【成功しました】PowerBI のリアルタイムデータセットにM5Stackから直接データをぶん投げてみた](https://qiita.com/rnakamuramartiny/items/243fbc380be8c1fa3b5f)

# 事の発端
ストリーミングデータセット作った時のAPIを使えば、M5Stackのボタン操作でパラメータでちょっとした投票集計システムができるんじゃないかと思ったわけなんですよ。
ほら、クイズ番組みたいな・・・

# とりあえず試してみよう！
## まずは PowerShellで
![image.png](https://qiita-image-store.s3.amazonaws.com/0/269159/53690f18-9d25-accb-b9ae-fcfdea4c9fdf.png)
うん。特に問題なくできてる。

ダッシュボードも・・・
![image.png](https://qiita-image-store.s3.amazonaws.com/0/269159/8cf7b9b2-9856-af32-68e8-a2882b35274c.png)

ちゃんと反映されてるね！

## じゃあ安定のPostmanで・・・
Payloadは合ってるよね！じゃあ投げてみよう・・・
![image.png](https://qiita-image-store.s3.amazonaws.com/0/269159/d56e8a14-ce38-5b96-5019-a0dfcc05f4b6.png)


↓　投げた結果
![image.png](https://qiita-image-store.s3.amazonaws.com/0/269159/77ac05de-1667-b018-bdeb-ea576bc6b108.png)

・・・？！
400エラー？！

なして？？？！
いやいやいやでもさ！
![image.png](https://qiita-image-store.s3.amazonaws.com/0/269159/3cc8fb66-0b37-54d7-464f-afd5fbb0b794.png)

データは反映されてるんすよ！


# 色々調べてみたんですけど・・・
Tokenが足りないみたいなことも書いてあるからさ
AADですべてのデータセットにアクセス可能にしてトークン発行してやってみたりとかさ
したんですけどね、結果的に変わらず。

# 結論・・・
~~これだと、HTTP400エラーを無視しないといけないみたいな仕組みになりそうだったので~~
~~断念。~~
~~IoTからのデータは素直にIoT Hubから流しやがれ・・・ってことなんだろうかorz~~

・・・ポストする内容に不備があることがようやくわかってしまいました(´；ω；`)
![image.png](https://qiita-image-store.s3.amazonaws.com/0/269159/ec2a841c-0f2f-1121-d7a4-f9c501f5e93b.png)
ぎゃーーーー！！
恥ずかしい！！！

というわけで引き続き試していきます。。。。
VSCodeを自分好みに変える（逐次追加）

# macOSのVSCodeを自分好みに変える

新型のMacbook Airを購入して環境構築をやり直しているので、メモ。

## インストール

### VSCodeを入れる前にXcodeをインストールしておきましょう

いろんなインタプリタのインストールや設定をしてくれます。

### VSCodeのインストールサイトからインストーラをダウンロードする

- 下記URLにアクセス（2018/12/23）

```url
https://code.visualstudio.com
```

- ダウンロード
- インストール

## 日本語化する

1.拡張機能で、下記を検索
　Japanese Language Pack for Visual Studio Code
2.インストール

以前は設定ファイルを変更する必要があったが、インストーラーが自動でやってくれるようになった。

## 日本語用のソースコードハイライトツールをインストールする

日本語化するとソースコードのハイライトツールがリセットされるのか、インストールが必要になる。

1.拡張機能で、下記を検索
　Beautify
2.インストール 

## Adobe ExtendScript Toolkitと同じハイライト表示にするツールをインストールする

1.拡張機能で、下記を表示
　ExtendScript
2.インストール

Beautifyが優先されるのか、変化はしない。

## ファイルエクスプローラーのファイル先頭にアイコンを表示するぷらぐいnをインストールする

1.拡張機能で、下記を検索
　vscode-icons
2.インストール

## Adobeソフト上でJavascriptを実行するプラグインをインストールする

1.拡張機能で、下記を表示
　Adobe Script Runner
2.インストール

### 使い方

1.実行したいJavaScriptファイルを開く。
2.Command+Shift+Pを押下して、プロンプトにAdobe InDesignを入力。

### 使えなくなった？

macOS 10.14からCS5に繋がらなくなった様子。（もっと前のバージョンからかもしれない）。
macOS 10.14だとCS5のExtension Managerも、起動しない。
解決したら更新します。
Next.jsとWorkboxで静的ページ作成環境を作ってみる

はい、遅れてしまいましたorz

この記事は[Next.js Advent Calendar 2018](https://qiita.com/advent-calendar/2018/next-js)の 20 日目です。


## きっかけ

知り合いからサイト構築してよー的な事を言われ、作るときのベースとなる環境欲しいなと思ったのがきっかけです。

HTML/CSS/JavaScriptを普通に書いていってもよかったんですが、普段使ってて手慣れたReactで作っていきたいなと思い、Next.jsのexport modet使えば良いんでね？という感じで作りました。

また、せっかくならlighthouseにもこだわりたいなと思い、workboxも導入しています。

## 作ったもの

[こちら](https://github.com/f-a24/next-pwa-start)になります。

[作る際に参考にさせていただいたもの](https://qiita.com/mizchi/items/1ed9efd962110712b56b)とほぼ同じ（~~パクり~~）じゃんってツッコミは勘弁してくださいorz


## まとめ

Github Pagesでホスティングしてみたところ、環境によっては下記のような結果が出ました。
（Hello Worldレベルの内容なんですが。。。）

https://f-a24.github.io/next-pwa-start/
![cnh1hkKIQImv9p%%VuX7lg_thumb_3a1.jpg](https://qiita-image-store.s3.amazonaws.com/0/173087/d3d9ecae-3986-c4cc-0dc9-8ffc3f66a8a4.jpeg)

今後はこちらをベースにパフォーマンスにこだわりつつ作っていきたいなと思います。
Error: Cannot find module './formatMaximum'というエラーの解決

いつものように

```
yarn run start
```

でwebpack-devを起動させようとしたら、上記のエラーが…

インターネットで調べていたら、formatMaximumは、どうやら"ajv"というモジュールの中に本来組み込まれているものらしい。

Error: cannot find module ほにゃららというエラーに対しては、インストールし直すのが打開策だろうと思い、

```
yarn add ajv
```

と打ち込んで、インストールし直してみた。

そしたら無事解決した。
カルマンフィルタによるダムの貯留モデル

```{r}

#part1:ダムが1つの場合の貯留量予測


library(dplyr)

a=0.1

pthi=1-a

n=100

y=rnorm(n,mean=10,sd=1)

W=9;V=0.1

beta=rpois(n,7)

x0=20;D0=10

result=data.frame(beta=beta,y=y,x=0,Exp_x=0,Exp_y=0,g=0,P=0)

for(j in 1:n){

if(j==1){  
  
Exp_x=pthi*x0+beta[1]

Exp_y=a*(pthi*x0+beta[1])  
  
P=D0*pthi^2+W

g=(a*P)/(P*a^2+V)

x=Exp_x+g*(y[1]-Exp_y)

result$x[1]=x0

result$Exp_x[1]=Exp_x

result$Exp_y[1]=Exp_y

result$g[1]=g

result$P[1]=P

}else{
  
Exp_x=pthi*x+beta[j]

Exp_y=a*(pthi*x+beta[j])  
  
P=P*(1-g*a)*pthi^2+W

g=(a*P)/(P*a^2+V)

x=Exp_x+g*(y[j]-Exp_y)  
  
result$x[j]=x

result$Exp_x[j]=Exp_x

result$Exp_y[j]=Exp_y

result$g[j]=g

result$P[j]=P

}
  
}  

```

```{r}

#part2:ダムが2つの場合の貯留量予測

library(dplyr)

a1=0.2;b2=0.15;a2=0.12

pthi1=1-a1-b2

pthi2=1-a2

n=100

y1=rnorm(n,mean=10,sd=1)

y2=rnorm(n,mean=12,sd=1)


W1=4;W2=3;V1=0.1;V2=0.3

beta=rpois(n,7)

x01=20;D01=10;x02=30;D02=10

result1=data.frame(beta=beta,y=y1,x=0,Exp_x=0,Exp_y=0,g=0,P=0)

result2=data.frame(beta=beta,y=y2,x=0,Exp_x=0,Exp_y=0,g=0,P=0)

for(j in 1:n){

if(j==1){  

#pool_1    
  
Exp_x1=pthi1*x01+beta[1]

Exp_y1=a1*(pthi1*x01+beta[1])  
  
P1=D01*pthi1^2+W1

g1=(a1*P1)/(P1*a1^2+V1)

x1=Exp_x1+g1*(y1[1]-Exp_y1)

result1$x[1]=x01

result1$Exp_x[1]=Exp_x1

result1$Exp_y[1]=Exp_y1

result1$g[1]=g1

result1$P[1]=P1

#pool_2   
  
Exp_x2=pthi2*x02+b2*x01

Exp_y2=a2*(pthi2*x02+b2*x01)  
  
P2=D02*pthi2^2+W2

g2=(a2*P2)/(P2*a2^2+V2)

x2=Exp_x2+g2*(y2[1]-Exp_y2)

result2$x[1]=x02

result2$Exp_x[1]=Exp_x2

result2$Exp_y[1]=Exp_y2

result2$g[1]=g2

result2$P[1]=P2

}else{
  
#pool_1
   
Exp_x1=pthi1*x1+beta[j]

Exp_y1=a1*(pthi1*x1+beta[j])  
  
P1=P1*(1-g1*a1)*pthi1^2+W1

g1=(a1*P1)/(P1*a1^2+V1)

x1=Exp_x1+g1*(y1[j]-Exp_y1)  
  
result1$x[j]=x1

result1$Exp_x[j]=Exp_x1

result1$Exp_y[j]=Exp_y1

result1$g[j]=g1

result1$P[j]=P1

#pool_2
   
Exp_x2=pthi2*x2+b2*x2

Exp_y2=a2*(pthi2*x2+b2*x2)  
  
P2=P2*(1-g2*a2)*pthi2^2+W2

g2=(a2*P2)/(P2*a2^2+V2)

x2=Exp_x2+g2*(y2[j]-Exp_y2)  
  
result2$x[j]=x2

result2$Exp_x[j]=Exp_x2

result2$Exp_y[j]=Exp_y2

result2$g[j]=g2

result2$P[j]=P2

}
  
}  

```

```{r}

#kalman U-D decomposition filter

library(dplyr)

n=10

H=sample(c(1),n,replace=T)

x=rnorm(n,mean=4,sd=3);y=2*x+9

#initial conditions

x=rep(1,n);P=diag(1,n)

R=5

times=10000

for(j in 1:times){

f=P%*%(H)   

a=H%*%f+R  

K=f/c(a)

x=x+K*(y-H*x)

P_past=P
  
P=P-K%*%t(f)

print(sum(abs(K)))

#print(P-P_past)



}

plot(c(1:n),y,type="o",col=2,ylim=c(min(x,y),max(x,y)),xlab="samples",ylab="values",main=paste0(cor(x,y)))

par(new=T)

plot(c(1:n),c(H*x)+mean(y)-mean(H*x),type="o",col=3,ylim=c(min(x,y),max(x,y)),xlab="samples",ylab="values",main=paste0(cor(x,y)))

#=>K

P%*%H/c(H%*%P%*%H+R)

```
DevTools tips — day 10: カスタムフォーマッター

この記事は[Tomek Sułkowski](https://medium.com/@tomsu)さんによる
フロントエンドエンジニア向けアドベントカレンダーの翻訳記事です。
とても勉強になったので許可を得て翻訳させていただきました。元記事は[こちら](https://medium.com/@tomsu/devtools-tips-day-10-custom-formatters-58ee46e640f9)。
 
---

*休暇まであと24日です。私はこれからDevToolをより効果的に、そしてもっと楽しく使うためのコツを紹介する短い記事を書いていきたいと思います。[昨日](https://qiita.com/rena_m/items/4a6d52630200f91e01b0)は時間を計りました。今日は…*

# 28.カスタムフォーマッター
開発者ツールのコンソールによるobjectの標準フォーマットはほぼどんな場合でも便利に使えるようになっています。ですが、時には違う形で表示してほしい時もありますよね。私たちは実に幸運に恵まれています。というのも、このデフォルトフォーマットというのはあくまでデフォルト…標準であって、objectを表示する自分なりの方法を定義することが可能だからです。この昨日は*Custom Formatter*と呼ばれています。中身を書き始める前に、対応する設定を開発者ツールの*Settings*(開発者ツールの`⋮`ドロップダウンから開くか、`F1`を押してください)からオンにしましょう。

![14.png](https://qiita-image-store.s3.amazonaws.com/0/318825/1148851c-fa20-a84e-f21a-3e7065122417.png)

さて、フォーマッターはどのような感じかというと、3つの機能を持つobjectになっています。

`header` — コンソールのログの主要部分の表示を扱います
`hasBody` — objectを展開する▶矢印を表示する場合、trueを返します
`body` — 展開された部分に表示するものを定義します
基礎的なカスタムフォーマッターを見てみましょう。

![15.png](https://qiita-image-store.s3.amazonaws.com/0/318825/54645ea4-1d7c-9a90-0ebf-ec3d7720730e.png)

`header`機能が返すものは[JsonML](http://www.jsonml.org/)配列です。この配列は以下のもので構成されています。

- タグの名前
- attributesのobject
- 中身(テキストのvalueや他の要素など)

(これらのものになじみのある方がいたら、それはきっと[Reactでコードを書いたことがある](https://reactjs.org/docs/react-without-jsx.html)からでしょう:grinning:)

このサンプルフォーマッターはただobjectを各ネストの深さに対して7スペースのインデントをつけて表示するだけです。出力結果は以下のようになります。

![18.gif](https://qiita-image-store.s3.amazonaws.com/0/318825/1a3fb028-f2fd-8718-9fb9-7b8e17b28295.gif)

# 29. カスタムフォーマッタの実践的な適用
世の中には色々なカスタムフォーマッターがあります。例えば、[`Immutable.js`](http://facebook.github.io/immutable-js/)の構造を綺麗に表示したい場合は[immutable-devtools](https://github.com/andrewdavey/immutable-devtools)のレポジトリを見ると良いでしょう。ですが、勿論どんな場合でも自分で作ることもできます。

基本的には、普通ではないobjectや非常に多くのログを持っていて(こういう状況は避けた方がよいですが、時として便利なこともあります)、ある1つを他の物と区別したい場合にカスタムフォーマッターが使えます。

こうしたケースへの実践的なコツとしては、特別に扱う必要のないobjectをフィルターで外し、外すケースでは`header`で`return null`をすることです。こうすると外されたvalueに対しては標準フォーマッターが利用されます。

実用的でありながら、楽しむこともできますよ！ここにふざけた新しいコンソールメソッドの例があります。名前は`console.crown()`です。これはログに表示されるobjectにフォーマットをかけ、ピエロの絵文字をprefixとしてつけます…きっと気づきやすくするためでしょうね😁

![19.png](https://qiita-image-store.s3.amazonaws.com/0/318825/27182b53-b6f3-f9fe-c449-77668ccfe79f.png)
ソースはこちら: https://gist.github.com/sulco/e635a7511d5ff17d44fe9bb2ab8b3cc6

ご覧の通り、私は`console.crown()`メソッドをログに表示されたobjectに特別なプロパティを与えるために利用しています。こうすることで、これが特別に扱われたものだと認識できますし、フォーマッターでも特別扱いされます。とはいえ、多くの現実的な場合には、例えばobjectがある特定のクラスのインスタンスかどうかを確認するといった場合に利用されることでしょう。

`clown`ログの出力結果ですか？こちらです。
![20.png](https://qiita-image-store.s3.amazonaws.com/0/318825/35459b94-42f3-866b-a90a-5e8d94ed9028.png)

---

いつも通り、**なにか新しいことを学べたらぜひ**
→ もっと多くの人の目に止まるように**拍手👏ボタンをお願いします！**
→ 他の投稿も見逃さないように**[Twitter (@sulco)をフォロー](https://twitter.com/sulco)**してください！