OmniAICreator/Qiita-1.07M huggingface dataset:
kobitoでもプレーンテキスト用のシンタックスハイライトが欲しい


Qiitaでは```textと書くとプレーンテキストとして、シンタックスハイライトがされます。
つまり、コードブロックとして表示されるだけで、何も書体が変わりません。

この機能はコマンドの実行結果などの等幅にはしたいけど、書式設定をつけたくはないような場面で役に立ちます。
この機能をkobitoにもつけて欲しいです。

textにすると見やすくなる例: psコマンドの実行結果

```text
syslog    1311  0.0  0.1 260632  3988 ?        Ssl  Dec10   0:00 /usr/sbin/rsyslogd -n
message+  1314  0.0  0.0  42892  3728 ?        Ss   Dec10   0:00 /usr/bin/dbus-daemon --system --address=systemd: --nofork --nopidfile --syste
root      1317  0.0  0.1 272944  5888 ?        Ssl  Dec10   0:01 /usr/lib/accountsservice/accounts-daemon
root      1327  0.0  0.0   4400  1292 ?        Ss   Dec10   0:00 /usr/sbin/acpid
root      1334  0.0  0.1 636800  6972 ?        Ssl  Dec10   0:00 /usr/bin/lxcfs /var/lib/lxcfs/
root      1345  0.0  0.0  28620  3116 ?        Ss   Dec10   0:00 /lib/systemd/systemd-logind
root      1348  0.0  0.2 257584 11180 ?        Ssl  Dec10   0:00 /usr/lib/snapd/snapd
daemon    1358  0.0  0.0  26044  2128 ?        Ss   Dec10   0:00 /usr/sbin/atd -f
root      1362  0.0  0.3  45436 13828 ?        Ss   Dec10   0:02 /usr/bin/python /usr/share/google/google_daemon/manage_addresses.py
root      1439  0.0  0.0  26068  2600 ?        Ss   Dec10   0:00 /usr/sbin/cron -f
root      1564  0.0  0.0  13376   168 ?        Ss   Dec10   0:00 /sbin/mdadm --monitor --pid-file /run/mdadm/monitor.pid --daemonise --scan --
root      1571  0.0  0.1 277180  6060 ?        Ssl  Dec10   0:00 /usr/lib/policykit-1/polkitd --no-debug
root      1588  0.0  0.1  65520  6312 ?        Ss   Dec10   0:00 /usr/sbin/sshd -D
root      1644  0.0  0.0  12844  1772 ttyS0    Ss+  Dec10   0:00 /sbin/agetty --keep-baud 115200 38400 9600 ttyS0 vt220
root      1646  0.0  0.0  14660  1808 tty1     Ss+  Dec10   0:00 /sbin/agetty --noclear tty1 linux

```
Gitで絵文字コミットをするために行った3つの準備ステップ

# はじめに

[Atomのコントリビュートガイド](https://github.com/atom/atom/blob/master/CONTRIBUTING.md#git-commit-messages)で正式に絵文字の利用が推奨されたことをきっかけに、絵文字をコミットメッセージの文頭につけることでコミットログを綺麗にしようという文化が広まってきています。
[こちら](http://memo.goodpatch.co/2016/07/beautiful-commits-with-emojis/)のページで絵文字を使ったコミットのメリットなどが書いてあり、自分も活用してみようと思いました。

今回は、実際に自分がGitで絵文字コミットをするために準備したことについて3ステップに分けて説明をします。

# 1. コミットメッセージのルール作成

はじめに、コミットメッセージのルール作成です。
まずはどういったときにどのような絵文字を使うかルールを決める必要があります。
自分は以下のリンクを参考にしました。

- [Contributing to Atom](https://github.com/atom/atom/blob/master/CONTRIBUTING.md#git-commit-messages)
- [Gitのコミットメッセージを絵文字から始める](http://qiita.com/pocotan001/items/775cc77087be5562cc56)
- [Emojiで楽しく綺麗なコミットを手に入れる](https://gist.github.com/nownabe/85d8595fd142adc426fbfaf2bab015e0)

なお、どういった絵文字があるのか調べるには、以下のリンクから調べることができます。

- [EMOJI CHEAT SHEET](http://www.webpagefx.com/tools/emoji-cheat-sheet/)
- [emoji.muan.co](http://emoji.muan.co/)

また、絵文字に加えて、Gitのコミットのメッセージの書き方について以下の記事の「いいね」がとても多かったので参考にしてみました。

- [Gitのコミットメッセージの書き方](http://qiita.com/itosho/items/9565c6ad2ffc24c09364)

自分は以下のようなルールにしました。

**絵文字とその意味**

|Emoji| コミットタイプ|
|---|---|
|✨ `:sparkles:` |新規機能追加|
|📝 `:memo:` |ドキュメント追加|
|🔉 `:sound:`|ログ追加|
|✅ `:white_check_mark:`|テストの追加|
|👍 `:+1:`|機能修正|
|🚀  `:rocket:` |パフォーマンス改善|
|👮  `:cop:`|セキュリティ関連の改善|
|✏️ `:pencil2:`|タイポなどの修正|
|🎨 `:art:`|リファクタリング|
|🚧 `:construction:`|コメントアウトなど|
|🔥 `:fire: `|ファイル削除|
|🔇  `:mute:`|ログ削除|
|🐛 `:bug:` |バグ修正|
|🔖  `:bookmark:` |バージョンアップ|
|🎉 `:tada:`|イニシャルコミット|

**コミットメッセージの種別**

|コミットメッセージ | 意味|
|---|---|
|Add| 新規(ファイル)機能追加|
|Update| 機能修正、既存機能追加（バグではない)|
|Clean|リファクタリング|
|Remove|削除など|
|Fix|バグ修正|
|Upgrade|バージョンアップ|


# 2. チートシートの作成

次にチートシートの作成です。
これは、各絵文字のコードとその意味をすぐに参照できるようにするためです。
自分は[このような](https://github.com/nishina555/emoji-matome/blob/master/.gitmessage_with_emoji.txt)チートシートを作りました。
印刷してデスクに貼ったり、git commitのテンプレート(後述)に使用したりします。

# 3. git commitのテンプレートの作成

次にgit commitのテンプレートの作成です。
これは、`git commit`をした際に先ほど作成したチートシートをテンプレートとしてターミナル上に表示させるようにするためです。

ホームディレクトリに`.gitmessage.txt`という名前でチートシートが保存されていた場合、以下のコマンドでテンプレートとして登録できます。
注意点として、**チートシートの各行のはじめは`#`でコメントアウトしておいてください。**

```
git config --global commit.template ~/.gitmessage.txt
```

これにより、以下のような感じで`git commit`した際にチートシートがテンプレートとして表示されます。
これでわざわざチートシートを印刷しなくても済むようになります。
![スクリーンショット 2016-12-11 17.11.47.png](https://qiita-image-store.s3.amazonaws.com/0/140792/e7a7418a-d2f9-9bdc-37bd-95e0ac7412c7.png)


なお、Atomを使って`git commit`をする場合は[git plus](https://atom.io/packages/git-plus)(Windowsなら`Ctrl-Shift-H`
、Macなら`Cmd-Shift-H`でgitコマンドが利用できるようになるプラグイン)と[autocomplete-emojis](https://atom.io/packages/autocomplete-emojis)(`:`の後に単語を打つと絵文字を予測変換してくれるプラグイン)を使うと便利です。

# 終わりに

以上でGitで絵文字コミットをするための準備の説明を終わります。
運用をしていく過程で上記の1から3のステップを何度も繰り返していき、自分たちに最適なルールを作成していってください。

今回自分が作成したルールやチートシートなどはこちらの[リポジトリ](https://github.com/nishina555/emoji-matome)にまとめてあります。なお、このリポジトリはForkをしたものでオリジナルは[こちら](https://github.com/uraway/emoji-matome)になります。
おもちゃプロダクションシステム

#元ネタ
おもちゃのプロダクションシステムについては、後藤滋樹先生の「記号処理プログラミング」のLispでの題材が元ネタです。化学反応を調べるプロダクションシステムです。

#化学の復習
炭素と水素、酸素は次のプロセスをたどって二酸化炭素と水になります。高校時代に化学でやったはずなのですが、忘却の彼方です。（およそ40年前）

これには２つの経路があります。
（１）　C + 2H2 + 2O2  => CO2 + 2H2 + O2 => CO2 + 2H2O
（２）　C + 2H2 + 2O2 => CH4 + 2O2 => CO2 + 2H2O

#金物表現
Prologでは大文字のC,Hなどは変数と解釈されていまいます。’C'とすればいいのですが、煩わしいので小文字ということにします。また、2H2Oというのも先頭が数になるためアトムとしては使えません。この場合は H2O + H2O ということにします。

#動作
とりあえず動かしてみます。

```
| ?-reaction([c,h2,o2,o2,h2,],Y).
[ch4,o2,o2]
[co2,h2o,h2o]
Y = [co2,h2o,h2o]
yes
|
```
（２）の経路をたどっています。

#仕組み
プロダクションシステムは次の３つから構成されます。
（１）ルール（あるいは長期記憶）
（２）短期記憶
（３）制御部

（１）のルールは化学反応の個々のルールです。

（２）はその時点での操作対象となっているデータを保持している部分です。今回はリストで表現しています。

（３）短期記憶に対してどのようにルールを適用するかを判断し、ルールに応じた動作を行う部分です。今回はここを手抜きをして単純にPrologのルールの並んでいる順番に適応することにしています。

#コード
トイプログラムです。とても単純なものです。

```

reaction(X,Y) :-
    rule(X,Y).

%ルール
rule(X,Y) :-  
	check(c,1,X),
    check(h2,2,X),  
    remove(c,1,X,X1),
    remove(h2,2,X1,X2),
    append([ch4],X2,Z),
    write(Z),nl,
    rule(Z,Y).

rule(X,Y) :-
	check(c,1,X),
    check(o2,1,X),
    remove(c,1,X,X1),
    remove(o2,1,X1,X2),
    append([co2],X2,Z),
    write(Z),nl,
    rule(Z,Y).


rule(X,Y) :-
	check(h2,2,X),
    check(o2,1,X),
    remove(h2,2,X,X1),
    remove(o2,1,X1,X2),
    append([h2o,h2o],X2,Z),
    write(Z),nl,
    rule(Z,Y).


rule(X,Y) :- 
	check(ch4,1,X),
    check(o2,2,X),   
    remove(ch4,1,X,X1),
    remove(o2,2,X1,X2),
    append([co2,h2o,h2o],X2,Z),
    write(Z),nl,
    rule(Z,Y).

rule(X,X).

%元素が一定の個数以上あるかどうか
check(A,B,X) :-
	count(A,C,X),
    C >= B.

%元素の数を数える
count(A,0,[]).
count(A,C,[A|L]) :-
	count(A,C1,L),
    C is C1 + 1.
count(A,C,[L|Ls]) :-
	count(A,C,Ls).

%元素を指定した個数分、削除する。	
remove(A,0,L,L).
remove(A,B,[A|L],Y) :-
	B1 is B - 1,
    remove(A,B1,L,Y).
remove(A,B,[L|Ls],[L|Y]) :-
	remove(A,B,Ls,Y).

 
  
```


#問題点
実行例では（２）の経路で求められていました。これは単純にルールの順番に呼び出しているからです。（１）の経路で求めるにはルールの順番を変更する必要があります。

#本格的には
本格的には制御部をちゃんと作らないといけません。どのようにルールを適用していくのかという工夫をしないと実用になるものにはなりません。第二次AIブームの頃にOPS5というエキスパートシステム構築用のツールがあったように記憶しています。

#受験勉強のお供に
量子力学を学ぶとどうして、炭素には手がいっぱいあるのか、など納得がいくようになります。しかし、高校時代は暗記しかないようです。Prologに化学反応のことを教えるという立場になれば、化学受験勉強もいくらか楽しいものになるかもしれません。

#参考文献
「記号処理プログラミング」　後藤滋樹　著　岩波書店
Apacheの起動とか色々

# 起動
sudo apachectl start

# 停止
sudo apachectl stop

# 起動確認
http://127.0.0.1/ 
にアクセス。
It works!と表示されたら起動されている。

# ApacheとTomcatを連携
httpd.confを修正 /private/etc/apache2/httpd.conf
※Macの場合

## 修正前
\#LoadModule proxy_module libexec/apache2/mod_proxy.so
\#LoadModule proxy_ajp_module libexec/apache2/mod_proxy_ajp.so

## 修正後
LoadModule proxy_module libexec/apache2/mod_proxy.so
LoadModule proxy_ajp_module libexec/apache2/mod_proxy_ajp.so
コメントを外すだけ。

一番下に
Include /private/etc/apache2/other/*.conf
とあるので、/private/etc/apache2/other/配下にhttpd-ajp.confを作成

`touch /private/etc/apache2/other/httpd-ajp.conf`

これを記載
`ProxyPass / ajp://localhost:8009/`

これで、Apacheに来たリクエストがTomcatへ連携される。
Apacheを再起動した後に、Tomcatを再起動。

## Apacheと連携する前の状態のURL
http://localhost:8080/Sample
## Apacheと連携した後のURL
http://127.0.0.1/Sample


## その他
httpd.confをvimで編集しようとすると、ReadOnlyだからダメみたいなエラーが出て、編集できなかった。
下記のコマンドを実行して強制的に編集を実行。
:w !sudo tee %
:q!


自分用にメモ。
MovableTypeのカテゴリ一覧画面をカスタマイズするときに注意すること

この記事は Movable Type Advent Calendar 2016 – Adventar の 11日目の記事です。

MovableType経験は浅いのですが、今年はちょいちょいMovableTypeを触る機会がありまして。
その際に経験した、カテゴリ一覧をカスタマイズしたらデータが飛んだお話を書きます。

## 前提条件
MTAppjQueryを使って管理画面カスタマイズを入れています。
また、実際の経験としてはPowerCMSでのお話なのですが、MovableTypeでも同じだと思っています。

## やること
カテゴリ一覧で、条件にマッチしたカテゴリの表示を非表示にします。
今回私がやったのは、記事が0件となっているカテゴリを非表示にするものです。

## やったこと
jQueryでカテゴリをループして、件数表示が0件だったらhideするという簡単なものです。
例えば、3階層目は非表示とする場合はこんな感じ。
ついでに、表示／非表示を切り替えるボタンも入れておきます。

``` user.js
$('.lv-3').hide();
$('#area-action').append('<input type="button" id="btn-toggleCategoryList" value="カテゴリ表示切替" class="button" />');
$('#btn-toggleCategoryList').on('click', function () {
    if (isHide) {
        $('.lv-3').hide();
        isHide = true;
    } else {
        $('.lv-3').show();
        isHide = false;
    }
});
```


## 起こったこと
カテゴリの並べ替えなどを行って保存をかけたら、**非表示にしていたカテゴリが消えました**。

## 解説
movabletype/tmpl/cms/list_category.tmpl
function bulkUpdateCategoriesを見るとわかるのですが、jQuery('.sortable-item:visible')で取得したDOMからupdateのデータを作成してajaxで一気に更新処理をかけているようです。
つまり、hideしてしまうと、削除の扱いと同義なのですね。

そこまで調べてからカスタマイズしろって話だし、inputもないからそんな予感もしてなかったわけではないのですが...。

## 解決策
tmplを書き換えるのはバージョンアップができなくなってよろしくありませんので、user.jsで対応するのが望ましいと考えました。
で、bulkUpdateCategoriesが走る前に、hideしたカテゴリをshowしてあげれば良いわけです。
ただ、このイベントのフックのようなものがなさそうだったので、イベントを補足して先に実行してあげるようにしました。

```user.js
var func;
$.each($('.save').data('events'), function(i, e) {
    func = e[0].handler;
});
$('.save').unbind().on('click', function () {
    $('.lv-3').show();
    func();
});
```

## カスタマイズはよく調べて自己責任で
そもそもデータを消しちゃった点は、仕組みをちゃんと調べないでやってしまったことが問題で、反省点です。
ですが、そもそもこのカスタマイズ自体はデータ更新に絡むところを触っているので、トリッキーな部類だと思います。
あくまで自己責任ということで。

もしかしたらもっと良い方法があるかもしれませんので、ご存知の方は教えてください。
Windows10で特定ユーザのみキーを入れ替える(Ctrl-Caps)


* (参考)[レジストリを修正してCAPSLOCKの割り当て変更](http://yanor.net/wiki/?Windows%2FTIPS%2F%E3%83%AC%E3%82%B8%E3%82%B9%E3%83%88%E3%83%AA%E3%82%92%E4%BF%AE%E6%AD%A3%E3%81%97%E3%81%A6CAPSLOCK%E3%81%AE%E5%89%B2%E3%82%8A%E5%BD%93%E3%81%A6%E5%A4%89%E6%9B%B4)
* (参考)[ユーザ毎のWindowsのキーボードのキーの入れ替え](http://blog.livedoor.jp/k_urushima/archives/1098321.html)

HKEY_CURRENT_USER\Keyboard Layout にバイナリ値 "Scancode Map" を追加する．

|adrs|data|
|----|----|
| 00h - 07h | 00h |
| 08h - 0bh | num + 1 | 
| 0ch - 0dh | 変更後 scan code 1 | 
| 0eh - 0fh | 変更前 scan code 1 | 
|  :  |  | 
|  | 変更前 scan code num | 
|  | 変更後 scan code num | 
|  | 00 00 00 00  | 

```registry
[HKEY_CURRENT_USER\Keyboard Layout]
"Scancode Map"=hex:00,00,00,00,00,00,00,00,04,00,00,00,1d,00,3a,00,3a,00,1d,00,\
  29,00,79,00,00,00,00,00
```
|key|scancode |
|-|-|
|left ctrl | 1Dh|
|capslock | 3Ah|
|半角/全角| 29h|
|変換| 79h|
Python ＆ Selemiun ＆ Chrome で、ダウンロード先を指定してファイルをダウンロード(Windows編)

#ソースコード
```py:test.py
#seleniumからwebdriverをインポート
from selenium import webdriver 

#ダウンロード先のフォルダ指定
#使用例：
#download_directory='ｃ:\\Users\\<あなたのホームディレクトリ>\\Downloads'
#注意点：バックスラッシュ(\)は、”\\"とエスケープ文字付きで記載する必要あり
download_directory='<ダウンロードファイルを保存したい場所>'

###############################################################
### ダイアログを表示せずにファイルをダウンロードできます。
### ファイルはdownload_directoryで設定したパスに保存されます。
#
#使用例:
#   driver =init_selenium()
#   target_url='www.WannaGetFileFromHere.com'
#   driver.get(target_url)
###############################################################
def init_selenium():
    ###Chromeへオプションを設定
    chop = webdriver.ChromeOptions() #
    prefs = {"download.default_directory" : download_directory}
    chop.add_experimental_option("prefs",prefs)
    chop.add_argument('--ignore-certificate-errors') #SSLエラー対策
    driver = webdriver.Chrome(chrome_options = chop)
    return driver
```
#注意点
ダウンロード先のフォルダ指定する際は、バックスラッシュ(\)は、エスケープ文字とみなされる為、"\\\"と記述する必要あり。
Mac SierraにComposerをインストール

# Mac SierraにComposerをインストール

Wordpressのテスト用に[codeception](http://codeception.com/)を導入しようとしたが、新しいMacにComposerを入れていなかったのでメモメモ

## Composerとは？

[Composer](https://getcomposer.org/)

>Composer is a tool for dependency management in PHP. It allows you to declare the libraries your project depends on and it will manage (install/update) them for you.

>ComposerはPHPの依存関係管理ツールである。Composerはプロジェクトが依存するライブラリを明らかにし、インストールやアップデートの管理を可能にする。(意訳)

## 環境
- macOS Sierra 10.12.1

## Macへのインストール

Homebrewでパッケージインストールです。

```bash
$ brew install homebrew/php/composer
Updating Homebrew...
==> Tapping homebrew/php
Cloning into '/usr/local/Homebrew/Library/Taps/homebrew/homebrew-php'...
remote: Counting objects: 660, done.
remote: Compressing objects: 100% (430/430), done.
remote: Total 660 (delta 429), reused 299 (delta 228), pack-reused 0
Receiving objects: 100% (660/660), 278.81 KiB | 378.00 KiB/s, done.
Resolving deltas: 100% (429/429), done.
Tapped 636 formulae (676 files, 1.2M)
==> Installing composer from homebrew/php
==> Installing dependencies for homebrew/php/composer: libpng, freetype, icu4c, jpeg, unixodbc, php70
==> Installing homebrew/php/composer dependency: libpng
....
```

```bash
$ composer -V
Composer version 1.2.4 2016-12-06 22:00:51
```

依存関係にあったphp70もインストールしてくれていますし、パスも通してくれます。

```bash
✩✩✩✩ PHP CLI ✩✩✩✩

If you wish to swap the PHP you use on the command line, you should add the following to ~/.bashrc,
~/.zshrc, ~/.profile or your shell's equivalent configuration file:

      export PATH="$(brew --prefix homebrew/php/php70)/bin:$PATH"
```
こんな注意もしてくれるので、どうせなのでPHP-CLIもphp7を使えるようにします。


.bashrcや.zshrcに下記内容を記載します。

```
# Enable PHP70
export PATH="$(brew --prefix homebrew/php/php70)/bin:$PATH"
```

```bash
$ php -v
PHP 7.0.14 (cli) (built: Dec  9 2016 07:34:25) ( NTS )
Copyright (c) 1997-2016 The PHP Group
Zend Engine v3.0.0, Copyright (c) 1998-2016 Zend Technologies
```

以上で完了です。
stylelintの設定ファイルの作り方

昨日は「stylelintとは何か」ということと、既存のCSSリンターと比べたときの特徴、CLIからstylelintを実行する方法について述べました。今日は、stylelintの数多くあるルールを組み合わせて設定ファイルを作る方法について述べます。

## stylelintの設定ファイル

stylelintの設定のオブジェクトは [cosmiconfig](https://github.com/davidtheclark/cosmiconfig) というパッケージを使って読み込まれます。stylelintの場合、以下のファイル名、形式で設定ファイルを作成できます。僕は、JSON形式で `.stylelintrc` という名前で作ることが多いです。

- `package.json` 内の `stylelint` プロパティに記述する
- `.stylelintrc` ファイル（JSON or YAML）
- JSオブジェクトとして `module.exports` された `stylelint.config.js` ファイル

`.stylelintrc` 例: 

```json
{
  "rules": {
    "color-hex-length": "short",
    "color-no-invalid-hex": true,
    "custom-property-no-outside-root": true,
    "indentation": 2,
    "length-zero-no-unit": true,
    "media-feature-name-no-vendor-prefix": true,
    "number-leading-zero": "never",
    "selector-root-no-composition": true,
    "string-quotes": "single"
  }
}
```


次に設定オブジェクトのプロパティを見てみましょう。stylelintのルール名とそのオプションを、上記のように `rules` の中に指定します。


## stylelintの設定ファイル集

npmで、`stylelint-config` のキーワードを付けて登録されているパッケージは、stylelintの設定集です。その中でも、以下のパッケージが有名です。

- [stylelint-config-standard](https://github.com/stylelint/stylelint-config-standard): 最も一般的なCSSのコーディング規約集
- [stylelint-config-suitcss](https://github.com/suitcss/stylelint-config-suitcss): [SUIT CSSのコーディング規約](https://github.com/suitcss/suit/blob/master/doc/STYLE.md)
- [stylelint-config-primer](https://github.com/primer/stylelint-config-primer): GitHubのCSSのコーディング規約

stylelintのルールは今約170個あり、それらを1つずつ調べて自分で1から設定ファイルを作るのは骨が折れます。
そこで、 `stylelint-config-*` パッケージを継承することで、公開されている設定ファイル集をベースに自分のプロジェクトでの調整を加えることができます。


```json
{
  "extends": "stylelint-config-primer",
  "rules": {
    "indentation": 2,
    "string-quotes": "double"
  }
}
```

上記の例では、`stylelint-config-primer`を `extends` し、インデントサイズと文字列のクォーテーションを変更しています。

## stylelintのプラグイン

stylelintのルールは、全てPostCSSのプラグインとして実装されています。そこで開発者は、独自のstylelintのルールを作って、それをstylelintのプラグインとして公開することができます。

例として、SassのSCSS記法のための、[stylelint-scss](https://github.com/kristerkari/stylelint-scss) というプラグインがあります。

```json
{
  "plugins": [
    "stylelint-scss"
  ],
  "rules": {
    "scss/dollar-variable-pattern": "^foo",
    "scss/selector-no-redundant-nesting-selector": true
  }
}
```

`plugins` プロパティで使いたいプラグインを指定することで、`rules` の中でその設定をすることができます。

ちなみに、facebookはstylelintの独自のルールを作って、CSSコードのクオリティを担保しているそうです。

https://code.facebook.com/posts/879890885467584/improving-css-quality-at-facebook-and-beyond/


---

今日はstylelintの設定ファイルの作り方について説明しました。設定ファイル集やプラグインを使うことで、さらにカスタマイズしやすくなっています。
アプリを動かしてみよう

アプリを動かしてみよう...のその前に、Device Portal の使い方を覚えましょう。
なんか、なかなかアプリの話までたどり着かなくて、話を引き延ばしているように見えますが、大丈夫です。今回でアプリのアップロードができるようになります。

# Device Potal を開く

スタート画面から「Windows 10 IoT Core Dashboard」を起動します。インストールしたばかりだと、このアイコンは出ていないので「すべてのアプリ」からスタート画面へピン止めしておきます。

![Windows 10 IoT Core Dashboard](https://qiita-image-store.s3.amazonaws.com/0/32488/3dbb9d81-f18f-e368-a31b-8cfac1a165b5.jpeg)

「自分のデバイス」を開いて、接続済みの Raspberry Pi を見つけます。初期値は「miwinpc」になっているはずです。

![](https://qiita-image-store.s3.amazonaws.com/0/32488/54b5f149-d043-7886-9a25-aadff33717f8.jpeg)

右クリックして「Device Potal」を選択すると、初回のみ認証のログインダイアログが表示されます。ここで、先に入力したパスワードを入れれば ok です。
古めの Windows IoT Core だと Administrator/p@ssw0rd になっています。

![](https://qiita-image-store.s3.amazonaws.com/0/32488/0eab18d9-1ea5-cb86-9b1e-fffd8f3122cf.jpeg)

ちなみに、会社などで同時に Windows IoT Core を立ち上げるとここの「minwinpc」が乱立することになるので注意してください。以前、ハンズオンをしたときにえらいことになってしまいましたｗ。
このホスト名は、デバイスポータルで変更ができます。

![](https://qiita-image-store.s3.amazonaws.com/0/32488/b7f6f78a-6f89-3433-db88-246acd23613a.jpeg)

# フォルダを開く

「自分のデバイス」を開くときのメニューで「ネットワーク共有を開く」を選択すると、Windows IoT Core の Cドライブをエクスプローラーで開くことができます。

![](https://qiita-image-store.s3.amazonaws.com/0/32488/a40f8310-47da-5bac-c06e-590c50ebb209.jpeg)

以前はファイルのコピーが結構大変だった（USBメモリを刺せばいいんですけどね）ので、これは便利です。

# Powershell を開く

同じように、Powershell を開くこともできます。

![](https://qiita-image-store.s3.amazonaws.com/0/32488/f723d81c-cca0-978f-027c-8db1cf7f0c48.jpeg)

これも以前はログイン認証をコマンドで打たないといけなかったので、楽になりました。
注意してみると解ると思いますが、Administrator の Documents フォルダが「c:\Data\Users\Administrator\Documents」になっています。もとのルートにも Users フォルダがあるのでファイルをコピーするときは注意してください。

# サンプルをダウンロードする

Windows IoT Core のサンプルは

[ms-iot/samples: Windows 10 IoT Core Samples](https://github.com/ms-iot/samples "ms-iot/samples: Windows 10 IoT Core Samples")

にあります。git clone などしてダウンロードしてください。

この中で、ms-iot/samples/HelloBlinky/CS を使って動作を確認します。

# ターゲットを ARM に変える

Blinky プロジェクトのプロパティを開いて、ターゲットデバイスを「リモートコンピューター」にして、認証モードを「ユニバーサル」に変更します。

![](https://qiita-image-store.s3.amazonaws.com/0/32488/1d7fc3c1-1198-2aa6-9741-ab5c19dda894.jpeg)

プラットフォームは Raspberry Pi なので「ARM」になります。

# デバッグ実行する

ここで Visual Studio 2015 からデバッグ実行をします。初回は、あれこれとアセンブリを入れるために時間がかかりますが、暫くすると、画面のブリンクの表示が出てきます。

![](https://qiita-image-store.s3.amazonaws.com/0/32488/209e7f32-814b-3d1c-fc4b-0a2c4f950e58.jpeg)

以前のバージョンだとデバッグ実行用のフォルダ（RDBG）がなくて、コピーするしかなかったのですが、現在のバージョン（10.0.14393）ならば、Visual Studio からのデバッグ実行ができます。
Visual Studio 2017 RC のほうはまだ試していません。


一度インストールしてしまえば、デバイスポータルから起動できるので、インストールはこの方法が楽ですね。

![](https://qiita-image-store.s3.amazonaws.com/0/32488/60f63f03-d7a1-9122-618c-229dc66e420e.jpeg)

パッケージ（*.appx）をアップロードする方法もあるのですが、これはまた別途。


これだと画面がチカチカしているだけなので、「Lチカ」にはなっていません（Windows IoT Coreの Hello world としては十分なんですが）。という訳で、次回はいよいよ LED を付けてみましょう。
コンパイルに時間がかかるSwiftのコードへWarningを発生させる

こちらの記事で知ったTipsなのですが、簡単に設定できたためしぇあーさせていただきます。

- [Guarding Against Long Compiles](http://khanlou.com/2016/12/guarding-against-long-compiles/?utm_campaign=iOS%2BDev%2BWeekly&utm_medium=email&utm_source=iOS_Dev_Weekly_Issue_280)

ここでやっている内容は、**Xcode8.1**,  **Swift3.0.1**環境で試しました。

# やり方

以下の設定をするだけです。

プロジェクトファイルの ```Target -> Build Settings -> Other Swift Flags``` に```-Xfrontend```と ```-warn-long-function-bodies=100```を設定します。

<img width="881" alt="スクリーンショット 2016-12-11 15.23.52.png" src="https://qiita-image-store.s3.amazonaws.com/0/29477/9bcb51d2-4060-986f-7605-820bb08ea053.png">

すると100ms以上の時間がかかるメソッドはコンパイル時にWarning表示されるようになります(```-warn-long-function-bodies```の値はmsで任意の値を設定します)。

# やってみた

Swift2.2環境下で時間のかかる記述方法をまとめてくれている、以下の記事を参考に試してみました。

- [Regarding Swift build time optimizations](https://medium.com/@RobertGummesson/regarding-swift-build-time-optimizations-fc92cdd91e31#.xok952v9q)

以下のような重たくなる可能性があるメソッドを持つViewControllerを用意しました。

```swift
class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        nilCoalescingOperator()
        ternaryOperator(val: true)
        castingCGFloatToCGFloat()        
    }

    /// ??でコンパイルに時間がかかるパターン
    func nilCoalescingOperator() {
        let val: CGFloat? = 10
        _ = CGSize(width: 10 + (val ?? 0) + (val ?? 0) + 22, height: 10)
    }
    
    /// 3項演算子で時間がかかるパターン
    func ternaryOperator(val: Bool) {
        _ = val ? (1...5).map{ "\($0)" } : (0...2).map{ "\($0)" }
    }

    /// 型変換で時間がかかるパターン
    func castingCGFloatToCGFloat() {
        _ = CGFloat(M_PI) * (CGFloat((1 + 1 + CGFloat(1 + 1) / 60) * 5) - 15) * 1 / 180
    }
}
```

すると、Warningが表示されるようになりました。閾値以上の時間がかかるメソッドに対して、どのくらい時間がかかったかも表示されていました。(```castingCGFloatToCGFloat()```は閾値を超えることがなかったため、Warningは発生しませんでした)

<img width="1512" alt="スクリーンショット 2016-12-11 16.09.47.png" src="https://qiita-image-store.s3.amazonaws.com/0/29477/6dfefe97-76f0-178c-444a-67ca874425b0.png">

SwiftLintで特定の実装パターンを弾くようにしたほうがいいのかなぁと考えていたところだったので、このTipsはとても助かりました。こちらのほうがより直接的でいいかとおもいます。
(ただし、記事にも書いてある通りこの機能はいつ削除されるかわからないようです。)
UE4 触ってみました (VR的な意味で)

おことわり

- UE4 初心者
- 申し訳程度の VR 要素
- 成果物はどうにか完成させたレベル

----

## Summary

オンラインハッカソンで UE4 で VR コンテンツを作ってみました
→ 衝突処理むずかしい！

----

## Agenda

- UE4 の作法
- できたもの
- はまりポイント

----

# UE4 の作法

----

1. 最初に **Level** がある
2. **Blueprint** にモノと処理を定義する
3. **Level** に **BluePrint** を配置する

----

## Level

<img src="https://qiita-image-store.s3.amazonaws.com/0/3790/2f546c18-429a-0c6f-9656-cef121ddbbe7.png" width=550 />

----

### Level

- ステージ、マップ
- なんでも置ける空間
- 処理も書ける

----

## BluePrint

※ ビジュアルプログラミングのことと、オブジェクトの一種のことと名称かぶっててややこしい。

----

## BluePrint（オブジェクト）

<img src="https://qiita-image-store.s3.amazonaws.com/0/3790/fd30f8d3-dee9-fb8d-fa63-71668ea1355d.png" width=550 />

----

### BluePrint（オブジェクト）

- クラスっぽいもの
- **Actor** を継承すると **Level** に置いたり **Actor** に入れ子にしたりできる
- なんでも置ける空間
- 処理も書ける


----

## BluePrint（処理）

<img src="https://qiita-image-store.s3.amazonaws.com/0/3790/2a9b0df7-37a7-03fa-da10-507812378eae.png" width=550 />

----

### BluePrint（処理）

- ビジュアルプログラミング
- 手続き型のフローチャートっぽいもの
- Pepper のそれより処理フローが明確でわかりやすい
- これでやれることを覚えてそのうち C++ に移行するのがよさそう


----

# いいところ

- デフォの見た目が綺麗
- C++ も独自ライブラリで相当使いやすくなってるらしい
  - GC搭載 (スマートポインタでない) とか
- Unityと難しさは大して変わらなさそう
  - マーケットもあるよ（見てないけど）

----

# VR 対応

- 最初から VR テンプレートがサンプルに含まれている
- 開いて既存のものを適当によければ VR ゲームが作れる
- ワープも標準搭載
  - 今回のゲームでは不要なので処理ごと消した

----

# できたもの

----

# コンセプト

2013春きゃすけっとで作ったシューティングを VR にしたら<del>おぜうかわいい</del>面白いんじゃね？

※画像は当時作ったもの
<img src="https://qiita-image-store.s3.amazonaws.com/0/3790/b8151147-c970-0381-bf4b-1c97517d8687.png" width=230 />

----

# VR シューティング

- 飛んでくる敵を自機のショットで倒すゲーム
- モーションコントローラーで VR 上の自機を掴んで操作

----

### 製作期間
- セットアップと事前勉強 → 4hくらい
- 製作 → 2日 うち実質作業時間 8hくらい

----

<img src="https://qiita-image-store.s3.amazonaws.com/0/3790/1630c420-6ee3-f69c-89ac-0bb77a295cce.png" height=400  align="right"/>

2m * 2m * 2m の直方体の<br>ゲームフィールド
伝えにくい。Viveで実際にやってみてください。

[ダウンロード](https://github.com/progre/vrshooting/releases)

----

## できたこと
- ゲーム開始～終了、リスタートのサイクル
- お互いに弾を撃って撃墜しあう

----

## できなかったこと
- スプライトでキャラクターを表現
- 複数のステージ
- 音
- バグ修正（特に衝突周り）

----

# はまりポイント

----

## 当たり判定とか物理演算とか

- **Physics** と **Collision** の二系統の設定がある
- **Collision** は **Block** (ぶつかり合う) と **Overwrap** (すり抜ける) の二種類がある
- **Physics** を On にするとキャラが動かなくなったり、逆に Off にすると **Collision** が反応しなくなったりした

----

## 学習曲線
<img src="https://qiita-image-store.s3.amazonaws.com/0/3790/adc49d4b-791f-f683-3b74-bfff4896e63b.png"   height=300 />

---

- BluePrint (処理) は優秀
- 2日目にコリジョンに手を出して成長が止まる
- コードが増えると C++ で書きたくなるのは不可避

----

# まとめ

- 全容を把握するには土日では足りない
- 何もしなくても綺麗になる
- Unity と比べて特別難しくはなさそう
2系→3系への乗り換えで起きた事象について

すみません。1日おくれましたが。。。


私が携わっているリニューアル案件で、つまずいた点／発生した問題点をつらつらと共有したいと思います。

今後、2系→3系への乗り換えを行う案件担当者が同じ箇所でつまづくことが少しでも減らすことができればと思っています。


以下リニューアル案件の詳細を簡単に、、、
年間受注件数：数万件以上
EC-CUBE Version：2.4→3.0.10
開発方針：本体プログラムへの修正※1
機能数：300以上
※1：当初プラグイン開発を検討しておりましたが、機能数・DBテーブルの移行等を考慮し、本体プログラムを修正していく方針に変更しました。





◯DB構造の微妙な変化
　大きくはDB構造が同じなので、当初あまり気にしておりませんでしたが、
　実際に開発・運用してみると微妙な違い逆にはまったり、テストフェーズにて不具合のような形で発覚しました。
　ですので、変更点をはじめの段階で抑えておくべきかと思います。
　数点上げると、
　・dtb_orderの考え
　　2系では、カート投入から購入完了までの間、dtb_order_tempで管理し、購入完了でdtb_orderにコピーという形でしたが、
　　3系では、全てをdtb_orderのみとして、statusによって購入完了前後の状態を管理する形になっております。
◯速度面
　今回Doctrine（ORM）の使用、Entityでデータを処理している等もあり、2系と比較すると速度面が開発当初気になりました。
　速度を気にするようなサイト作成の際ははじめの段階で、検証しておくことをおすすめします。
　※ただし、2016/12/11現在、キャッシュ機構などが改善されかなり速度は早くなってきております。
◯モバイル対応がなくなった。
　ここは、開発初期に顧客ときちんとネゴっておくことをおすすめいたします。
　本案件では、モバイルアクセス時、
◯管理画面のレスポンシブ対応について
　3系では、管理画面、フロント画面ともにレスポンシブ対応されており、
　顧客提案時も受けがよく受注のハードルはさがるのですが、
　ある程度の顧客になってくると、管理画面のレスポンシブ対応が逆に問題となる場合があります。
　具体的には、業務的に必要な項目を追加していくと、項目数が多くなり受注登録画面がとても縦長になってしまいます。
　反面、小規模の店舗主さんにとってはスマホから気軽に受注情報が見れるなど、顧客によって意見がわかれるところではあります。
◯決済プラグインのフックのやりかたについて
　全プラグインに関していえるかどうかはわかりませんが、
　本案件で使用した決済プラグインは、購入完了時の処理をまるごとフックし、本体の処理も含めてプラグイン側で実施している状態でした。
　そのため、購入完了時に別の機能を追加したい場合、決済プラグイン自体に手を入れる必要があり、
　結局決済プラグインをほぼ使用せず、決済会社へ接続するために提供されているAPIの部分だけを使用し、
　その他は、自前で実装する形になりました。
◯受注登録の商品追加/会員検索利用時、データ量が多いととまってしまう。
　この問題は、検索結果まるごと1ページに表示されるため発生しておりました。
　本案件では検索条件を増やして、絞り込んでから検索していただく運用で回避いたしました。
　※3.0.13で、本体にページング機能が追加されるようです。
　　https://github.com/EC-CUBE/ec-cube/issues/1917
◯メールアドレスが、「hogehoge.@docomo.ne.jp」「hoge..@docomo.co.jp」などのドットの使用パターンに対応していない。
　3系では、SwiftMailerを使用しておりその影響により日本独自使用のメールアドレスが送信できない仕様となっております。
　（リニューアル案件ではあるあるかと思います。）
　以下に対応策を作成いただいている方がおられましたので、それを参考にいたしました。
　https://slack-redir.net/link?url=https%3A%2F%2Fgithub.com%2Fnanasess%2Fec-cube%2Fcommit%2F5ef9bbc81d17469e2d3822defe1ef1744771cf1b


以上、他にもありますがつらつらと書かせていただきました。

問題点を書きましたが、
EC-CUBE3で開発したことによるメリットを少し書いておくと、
フレームワークが採用されていることにより、開発効率はやはりあがったように思います。
実際、実装のメイン担当者はエンジニア3年目の方でしたが、
FWの仕組みにうまくのれたときは、
スクラッチ開発での想定よりも早いスピードで開発してくれておりました。
Rider EAPでPlantUMLを使ってみる

Rider EAPでPlantUMLを使ってみたので経緯、使い方などを綴る。


# 経緯
クラス図を書くためのツールを探していたら、IntelliJ IDEAでPlantUMLが使えるプラグイン「PlantUML integration」なるものがあることを知った。
Riderでも使えるのではと思い、試してみた。


# PlantUMLとは
UMLをテキストで書けるツール。
テキストなのでマージとか出来るらしい。


# インストール
## PlantUML integration
インストールは簡単。
1. RiderのPreferences->PluginsでBrowse repositoriesを選択
2. PlantUML integrationをインストールする

## Graphviz
Graphvizも必要らしい。homebrewで簡単。
brew install graphviz


# 使い方
## 設定
プラグインの設定でGraphvizのパスを指定する必要がある。
Preferences->Other Settings->PlantUMLの「Graphviz dot executable:」に以下を指定。
`/usr/local/bin/dot`

## 作成
いざ使おうとしたときに問題発生。
IntelliJ IDEAではコンテキストメニュー->NewからPlantUML用のファイルを作成できるらしいが、Riderでは表示されなかった。

そこで、コンテキストメニュー->New->Fileから"Hoge.puml"と名前をつけてファイルを新規作成した。
中身は適当に下のような感じにした。

```
@startuml{hoge.png}
title サンプル
class Hoge
@enduml
```

<img width="85" alt="Hoge_puml_-_EmptyProject_-____Projects_RiderProjects_EmptyProject_EmptyProject_sln__-_Rider_1_0_EAP.png" src="https://qiita-image-store.s3.amazonaws.com/0/133794/afc23609-edc0-a1f5-c7cf-c3e968225892.png">
何もないクラス図だが表示された。
pycurlで「(35, 'SSL connect error')」が出るときの対処法(のうちの1つ)

ホストマシンがCentOS6.Xのpython2系においてpycurlを含むスクリプトを実行したところ、
pycurl.error: (35, 'SSL connect error')
と出力されてしまっていた。。。
あー、SSLのアクセスがエラーなのね、と。。

尚、ステージング環境では同様のスクリプトは動いているという謎・・・
「差分マジ不明」、とか「そもそも前は使えてたんかな？」と疑問に思いつつ、色々と調べた。


以下の様に、インタラクティブモードで検証を行う

```py:
import pycurl
c = pycurl.Curl()
c.setopt(pycurl.URL, 'https://XXXX')
c.setopt(pycurl.VERBOSE, True)
c.perform()
```
ダメな環境のダメっぽいログ(これが原因かなと判断した)
----以下は抜粋----

```bash
* NSS error -5938
* Closing connection #0
* SSL connect error
```

OKっぽいログ(↓が出てたからOKと判断した)

-----以下は抜粋-----

```bash
< HTTP/1.1 200 OK
```

ここで、
んーー、pycurl自体が悪いのかなー、などと思案するも、
どうも大丈夫そう。(確認方法失念)

そもそものcurlのバージョンとかなのかな、と思案する。

```bash
yum info libcurl
```
それも同じ。。。

なにが悪いのか全然分からん、と思って
ここでようやく↓のログ

```bash
* NSS error -5938
```
について調べる。
※色々調べて3時間くらい無駄にしてる

NSSってなんや。。

無知なわたしはNSSを調べると、
https://ja.wikipedia.org/wiki/Network_Security_Services
SSLライブラリであるということが分かる。

ん？こいつがなんか悪い？
ということで更に調べると
http://www.at-link.ad.jp/topics/news/news-20151105.html
にたどり着く。

ひとまず脆弱性があるらしいということなので、バージョンを調べる。

```bash
rpm -q nss nss-util nspr

nss-3.16.2.3-3.el6_6.x86_64
nss-util-3.16.2.3-2.el6_6.x86_64
nspr-4.10.6-1.el6_5.x86_64

```
脆弱性があるやつなのね・・・

と思ってスクリプトが正常実行できる環境で同様に確認してみる。

```bash
rpm -q nss nss-util nspr

nss-3.21.0-8.el6.x86_64
nss-util-3.21.0-2.el6.x86_64
nspr-4.11.0-1.el6.x86_64
```

バージョン全然違うやんけ。
curlもpycurlも実行環境(ホストマシン)のNSS見るということなんですね、きっと、なるほど。。。

ちなみに、

```bash:本番
cat /etc/redhat-release
CentOS release 6.6 (Final)
```
```bash:ステージング
cat /etc/redhat-release
CentOS release 6.8 (Final)
```
CentOSのバージョンも違うやんけ。

たぶん、CentOS6.6は脆弱性持ってるNSSが最初っからバンドルされている、
6.8は脆弱性対応済みのNSSをバンドルしている、
という差分があるんだろうな、という推測。

ひとまず↓を実行する

```bash
yum update nss nss-util nspr
```
その後、実行不可となっていたスクリプトを再度実行するとエラーが無く実行可能となった。(事象解決)
ここまで調査開始から8時間くらい費やしてる気がする。。

curl実行出来ない方はお試しあれ。。
(脆弱性対応してあれば問題無いんですけどね)
UnityでRPGのアイテム画面を作ってみる

初心者向けのUI講座みたいなのを作ろうとしたのですが、
作っているうちにどんどん複雑になってしまい、
全部説明するにはこの余白は狭すぎる的な感じになっちまいやがったので、
ポイントだけ解説してあとはもうソース見てね★　という丸投げ手法で行きたいと思います。

まず作ったものはこちら。
![ItemScene.png](https://qiita-image-store.s3.amazonaws.com/0/63020/3fd4c7ed-baa5-1e13-8268-b3fe06ddbda5.png)

はい、素晴らしいフラットデザインですねー（棒）

■操作方法
上下キーでカーソル移動
Zで決定
Xで戻る
アイテム選択モードで、Cを押すと捨てるモードに入ります。

消費アイテムは使う・捨てることが可能
装備アイテムは捨てることだけ可能
大事なものはどちらも不可
となっています。少し変えるだけで大事なものを使用可能にしたり出来ます。

〇WebGLでBuildしたもの
http://crosstie-bell.com/UISampleItemScene/index
※起動するまでちょっとかかります。
　（なぜかテンプレートのプログレスバーが出ない……）

ソースはUnityPackageにしてありますので、インポートしてください。
〇UnityPackage
https://dl.dropboxusercontent.com/u/47714155/UISample.unitypackage

※12/12追記
リストをスクロールさせた状態でアイテムを使うか捨てるかして、
リストの数が減った場合にエラーが出ていたので修正しました。


ここから解説しますが、ファッションプログラマーなので色々目を瞑ってください。

■解説

UIは、オブジェクト指向と状態遷移が出来てれば、たぶん怖くない！
のでオブジェクト指向的なクラス分けをざくざくやっていきます。

ItemSceneManagerというクラスが親玉で、
こいつが入力を受け取り、下の奴らに命令していきます。
子分には、
・ModeNameViewr
・CategorySelector
・ItemList
・ItemSceneDialog
がいます。ほぼヒエラルキーの構成通りになっています。

![ヒエラルキー.png](https://qiita-image-store.s3.amazonaws.com/0/63020/deb101ca-7aa6-d781-fdc0-7675587a045c.png)

次に状態遷移ですが、Modeというクラスを作りました。
Mode.Run()　でそのモードのUpdateをします。
Mode.Enter() はそのモードに入ったときに呼ばれます。
Mode.Exit()　はそのモードから出るときに呼ばれます。
これらはAction型のデリゲートなので、newするときに登録します。

ItemSceneManagerで各モードを作ります。
Modes.Add(new Mode(ModeEnum.CategorySelect, CategorySelectRun, CategorySelectEnter, CategorySelectExit));
Modes.Add(new Mode(ModeEnum.ItemSelect, ItemSelectRun, ItemSelectEnter, ItemSelectExit));
Modes.Add(new Mode(ModeEnum.UseItem, UseItemRun, UseItemEnter, UseItemExit));
Modes.Add(new Mode(ModeEnum.DropItem, DropItemRun, DropItemEnter, DropItemExit));

あとはItemSceneManagerのUpdate()で、

void Update(){
　NowMode.Run()
}

みたいにして、モードを変えるときは、

ChangeMode(ModeEnum.ItemSelect);

とすれば、勝手に今のモードのExit()が呼ばれ、次のモードのEnterが呼ばれたあと、
Run()が呼ばれるようになるわけです。

モードごとにクラスを作りたくなかったので、
メソッドだけ設定しておけばええやんって考えで作ってます。
良いのか悪いのかあんまりわかってません。
でも今考えたらモードごとにクラス作るのってオブジェクト指向じゃないような気がするしこれでいいんかな。

以上です・・・。

他のことはソースを見て、適当にニヨニヨしてくださいませ。
無駄にItemModelまで作っています。

・DataBaseにマスターデータっぽいのを置いています。
・UserDataが所持品情報などです
・アイテムリストはスクロールするようになってます。
・カーソルIndexはintで持たないようにして、インスタンスを使ってリストからIndexを取得しています。
（ちょっと重いと思うけどIndexOutしないため）


質問とかご意見あると嬉しいです。

サークルexeCUTEの「らせつ封魔伝」宜しくお願いします。（ガチマ）
http://execute.crosstie-bell.com/rasetsu/system.html

それでは！
確認対象の存在が事前に判明しない項目のifの実行方法

必ず存在する項目であれば、ifで項目が空であるか否か、といった何かしら内容の比較が可能であるが、
その項目自体が「無い場合もある」という場合は、判別するものがないのでエラーが出力される。

例1：

```py3:test.py
dictionary = {'test1': 'hoge',
              'test2': 'fuga',
              'test3': 'hogefuga'}

if dictionary['test4']:
    print('yes')
else:
    print('no')

Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
KeyError: 'test4'

```
このようにKeyErrorが返ってくる。
(test4なんつー項目は無いよと返ってくる)

ただ、
「たまたま今回はtest4が無いけど、いつもはあるんだよ」、
っていう項目だった場合どうしましょう?

となった時は、下記の様に"try"と"execept"で実施する。
tryで試して、エラー(except)が発生する場合はどうするか、という様なことを定義するイメージ。

```py3:try_test.py
dictionary = {'test1': 'hoge',
              'test2': 'fuga',
              'test3': 'hogefuga'}
try:
    if dictionary['test4']:
        print('yes')
    else:
        print('no')
except:
    print('none')
```
こうなった場合、最初の例で示したデータの場合は、
'none'が返ってきます。

ちなみに次の場合は、
'no'
が返ってきます。

例2：

```py3:try_test2.py
dictionary = {'test1': 'hoge',
              'test2': 'fuga',
              'test3': 'hogefuga',
              'test4': ''}

try:
    if dictionary['test4']:
        print('yes')
    else:
        print('no')
except:
    print('none')
```
centos7にjava8を入れる

# 概要
個人的にメモしておく。
centos7にjava8を入れる。
今回はyumで入れてみる。

# 手順
```
$ yum search openjdk
```
java-1.8.0で始まるやつをいれていく

```
$ yum install java-1.8.0-openjdk.x86_64
$ yum install java-1.8.0-openjdk-devel.x86_64
$ java -version
openjdk version "1.8.0_111"
OpenJDK Runtime Environment (build 1.8.0_111-b15)
OpenJDK 64-Bit Server VM (build 25.111-b15, mixed mode)
```
第8回PeerCast忘年会ハッカソンでchainer-goghをTensorFlowで書いた話

第8回PeerCast忘年会ハッカソンでしたことのまとめ兼その発表資料です。

---

# chainer-goghとは
https://github.com/mattya/chainer-gogh
機械学習によって二つの絵を合成するもの。

---
もと画像に猫画像
<img width="400" alt="cat.png" src="https://qiita-image-store.s3.amazonaws.com/0/37051/42796dec-1e23-a39b-5ded-6eafa7582ba6.png">

---
画風画像にゴッホの星月夜
<img width="400" alt="style_0.png" src="https://qiita-image-store.s3.amazonaws.com/0/37051/56817bde-1d3c-fd49-b13a-b2d0355a9148.png">

---

# 合成すると・・・

<img width="400" alt="im0.png" src="https://qiita-image-store.s3.amazonaws.com/0/37051/abd1dcb0-42ae-548d-1033-076f27b694eb.png">

---

# 今更、何したの？

---

# TensorFlowで再実装した
（TensorFlowは、去年、グーグルが公開した機械学習とかに強いライブラリ）
chainer-goghのソースをよく読んでそれを置き換えるだけ。
一応、部分的に同程度の性能を出すことができた。

---

# とりあえず、期間中に食べていた賞味期限切れの焼きプリン
<img width="400" alt="CzT6Md7UcAEQDtp.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/37051/36ca0d3e-3e1d-4919-836b-7af82896c915.jpeg">

---

# 特徴量にNINを使って変換
<img width="400" alt="CzUBJR-UAAIQG3N.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/37051/a6006115-bb3f-b117-9abf-300429e8b797.jpeg">

---

# ドヤ！

---
# chainer-goghでは・・・
<img width="400" alt="CzT-Tk2UcAA47Zn.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/37051/b074aab8-2feb-f421-39b4-83b9897a96d3.jpeg">

---

# 完全に一致！

---

# 仕組み
多くの機械学習では、損失関数という関数を作って、損失が少なくなるようにパラメータを変更することで、目的のパラメータを手に入れる。今回は、絵をRGBの値で表現したものをパラメータとして学習する。

---
# 損失関数は・・・
元画像と画風画像、それぞれからどれだけ特徴量が離れているかを表す関数を作り、その和を損失関数とした。
学習の設定は、最初は自分で適当にしていたけど、最終的に、諦めてchainer-goghの値を使った。

---

# 苦労したところ
* 最初、NINではなくVGGで作り始めたけど、学習時間がかかって困った。（ハッカソン以前の出来事）
* NINなどはcaffeのモデルを転用するが、それが正しく使えているか、確認が困難だった。
* 画像がRGBで扱うのか別の形式で扱うのか分かりづらかった。

---

# 試行錯誤中の画像
なんか色が違う。
<img width="400" alt="try_and_error.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/37051/99145aae-1ebe-a716-f2c4-ccc31fc8d8b1.jpeg">

---
# タイプミスで画風画像を使っていなかったときの画像
このときは猫が現れて喜んでいた。
<img width="400" alt="type_miss.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/37051/123681f0-f7c3-ca73-0b6f-eabd36f301c6.jpeg">

---
# その他: VGGでも動きました。（25分くらい）
<img width="400" alt="VGG_ver.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/37051/4b3cc50f-dd76-7614-4159-7dd0909ca1a4.jpeg">

---
# 今後は・・・
* 次回きゃすけっとのネタにする
* 今回できたものの高速化を試みる
* NIN、VGG以外のモデルも気になる
* 関連した他アルゴリズムを試したい

こんなことができたらいいな

---
# おしまい
<img width="400" alt="end.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/37051/740b6e2e-e3c7-2be2-776f-7259d0d031f7.jpeg">

---
# おまけ
第8回PeerCast忘年会ハッカソンの風景（主催のシュールさんの配信画面）
![sample_shule.jpg](https://qiita-image-store.s3.amazonaws.com/0/37051/1ff17297-555e-5a3e-7204-96952ff63a78.jpeg)

---
# 変換
![05000.png](https://qiita-image-store.s3.amazonaws.com/0/37051/df524954-2a3a-3871-09a3-dab0c3578c0e.png)
Amazon Dash Buttonでうんこなう

数年前に作った「うんこなう」というIoTデバイス??の代わりに、Amazon Dash Buttonを使ってみました。
当時作ったものはこんな感じ↓

[![うんこなう](http://img.youtube.com/vi/OR3hW_sQNRQ/0.jpg)](http://www.youtube.com/watch?v=OR3hW_sQNRQ)

# dashボタンのセットアップ

こちらの投稿を参考にさせてもらいました。
[Amazon Dash ButtonをただのIoTボタンとして使う](http://qiita.com/jsoizo/items/3b8bba4160f41aef20f4)

上記投稿の「ボタンセットアップ」までを行います。

# Twitter APIのセットアップ

### Twitterで新規アプリケーションを登録する

「うんこなう」する(つぶやく)アカウントでTwitterにログインした状態で、以下のURLにアクセスします。
https://apps.twitter.com/

「Create New App」から新しいアプリケーションを作成します。

### APIキーを取得

ダッシュボードのアプリケーションの一覧から今回作成したアプリケーションをクリック
「Keys and Access Tokens」から「Create my access token」というボタンをクリック
表示された以下の値をメモ

* consumer key
* consumer secret
* access token
* access token secret

# プロジェクトのセットアップとnode.jsモジュールをインストール

プロジェクトの作成

```
$ mkdir dash-unko-now
$ cd dash-unko-now
$ npm init --yes
```


必要なモジュールをnpmからインストールします。

#### Amazon Dash Button

今回は、dash-buttonを使用します。
ドキュメントを参考にDash ButtonのMACアドレスを取得しておきます。

```
$ npm install --save dash-button
```

#### Twitter
twitter apiを叩くのに使います。

```
$ npm install --save twitter
```

#### 日付
日付、時刻をいい感じに表示させるのに使います。

```
$ npm install --save date-utils
```

# 実装

といっても、dash-buttonというモジュールがDash Buttonを簡単に扱えるようにしてくれているので、コードはこれだけ。
ボタン押下イベントを受け、TwitterモジュールからTwitter APIにツイートをポストします。

```json:config.json
{
    "twitter_credentials": {
        "consumer_key": "1234567890abcdefghABCDEFG",
        "consumer_secret": "1234567890abcdefghijkABCDEFGHIJKxxxxxxxxxXXXXXXXXX",
        "access_token_key": "123456789099999999-1234567890abcdefghijkABCDEFGHIJ",
        "access_token_secret": "1234567890abcdefghijkABCDEFGHIJKxxxxxxxxxXXXX"
    },
    "mac_address": "Dash ButtonのMACアドレス"
}
```

```js:index.js
'use strict';

require("date-utils");
const DashButton = require("dash-button");
const Twitter = require("twitter");
const config  = require("./config.json");

// twitter client
var client = new Twitter({
    consumer_key: config.twitter_credentials.consumer_key,
    consumer_secret: config.twitter_credentials.consumer_secret,
    access_token_key: config.twitter_credentials.access_token_key,
    access_token_secret: config.twitter_credentials.access_token_secret
});

// button constructor
let button = new DashButton(config.mac_address);


console.log("Stand by...");

// button push listener
button.addListener(() => {
    var dt = new Date();
    var outputDate = dt.toFormat("YYYY/MM/DD HH24:MI:SS");
    var tweet = "うんこなう。\n" + "[" + outputDate + "にうんこをしました。" + "]";
    client.post('statuses/update', {status:tweet}, function(error, tweet, response) {
        if(error) throw error;
        console.log(response);
    });
});
```


# うんこしてみる

用を足した際にDash Buttonを押下します。

![imb_E3944652-D506-4AB5-BA14-5CF20698A234.gif](https://qiita-image-store.s3.amazonaws.com/0/79414/b6ce8371-a6e3-2802-35b4-109f04a8027b.gif)


作る前からわかっていたことだけど、ボタン押下をイベントにTwitterに定型文をポストするだけです...
3年前に同様のことを実現しようとしたら、AruduinoやらRaspberryPiやらを使わなければでしたが、
500円のデバイスで同様のことが実現できてしまうのは驚きです。
Laravelで画像サイズのバリデーション

この記事はオールアバウトアドベントカレンダー11日目の記事になります。
準備不足につき小ネタで失礼します。

Laravelには強力な[Validation](https://laravel.com/docs/5.3/validation)機能がありますが、いつの間にか画像サイズのValidationも出来るようになっていて、便利だなと思ったのでやってみました。
ドキュメントを見る限り、5.2から追加されたようです。

# 準備

画像をアップロードする簡単なフォームを作ります。Laravel5.3で試しています。

```routes/web.php
Route::get('post/create', 'PostController@create');
Route::post('post', 'PostController@store');
```

```app/Http/Controllers/PostController.php
<?php
namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Controllers\Controller;

class PostController extends Controller
{
    public function create()
    {
        return view('post.create');
    }

    public function store(Request $request)
    {
        // バリデーションと画像保存とかの処理を書く
    }
}
```

```resources/views/post/create.blade.php
@if (count($errors) > 0)
    <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif

<form method="POST" action="/post" enctype="multipart/form-data">
    <input type="file" name="img_upload">
    {{ csrf_field() }}
    <input type="submit">
</form>
```

# Validationルールの記述

画像サイズのValidationには[dimensions](https://laravel.com/docs/5.3/validation#rule-dimensions)というルールを使用します。
使用できるパラメータはmin_width, max_width, min_height, max_height, width, height, ratioです。画像サイズの最大値、最小値、ジャストサイズ、比率を指定できます。比率の場合は横/縦で指定します。

```app/Http/Controllers/PostController.php
    public function store(Request $request)
    {
        $this->validate($request, [
             'img_upload' => 'dimensions:width=320,height=240'
        ]);
    }
```

条件を満たさない画像をアップロードしようとすると、以下のようにエラーが出ました！

<img width="477" alt="dddc602b76fab3c3280cf7dd03482bee.png" src="https://qiita-image-store.s3.amazonaws.com/0/57615/ea2bfdb5-f1b3-30f8-1529-a6c5156500a8.png">
Goの開発環境に思いを馳せる

パソコンを新しくしたんだ...!!!
ということでGoの開発環境について色々と思いを馳せています。
現在、激しく迷走中...ʕ•́ᴥ•̀ʔ

悩みが解決したら、この記事をちゃんとします...!!!

1. anyenv + goenv
1. docker-compose
1. gvm


## 1. anyenv + goenv
今までの環境はコレでした。
特に不都合もなく、`~/go/`を`$GOPATH`としていました。

## 2. docker-compose

こんな感じのを書く。

```docker-compose.yml
version: '2'

services:
  app:
    image: 'golang:1.7-onbuild'
    volumes:
      - 'data:/go'
      - '$PWD:/go/src/app'
    command: 'go run main.go'

volumes:
  data:
    driver: 'local'
```

こうすると依存するパッケージを`go get`してくれる。

```
$ docker-compose run app go-wrapper download
```

そのあと、こうすることで`command`を実行。

```
$ docker-compose up -d 
```

小さく`go test`したりするのはなんだか面倒くさいと思ってしまったのですが、本来こういう使い方ではない...?

## 3. [gvm](https://github.com/moovweb/gvm)

本当はローカルにGoを入れずになんとかならないかと思っていたのですが、エディタにgolintの設定とかしたい。なので、ローカルにも必要かな...と。

> [Intellij IDEA でのGo言語開発環境セットアップ](http://qiita.com/MakoTano/items/8e25a4aacc8ec7f95b48)

gvmはパッケージ別に`$GOPATH`の切り替えもできるし、悪くなさそう。  

- Goのバージョンリストを確認する。

```
$ gvm listall
```

- インストールされているGoのバージョンリストを確認する。

```
$ gvm list
```

- インストールする。

```
$ gvm install {version}
```

- バージョンを切り替える。

```
$ gvm use {version}
```

- 好きな場所に`$GOPATH`を設定する。

```
$ cd {path}
$ gvm pkgset create --local
$ gvm pkgset use --local
```

複数のプロジェクトを並行して開発していることが多いのですが、`$GOPATH`はdefaultが`~/.gvm/pkgsets/{go-version}/global`のため、切り替えるたびに戻ってしまう。  
致し方ないのかな...

### gvmのすべて

```
Usage: gvm [command]

Description:
  GVM is the Go Version Manager

Commands:
  version    - print the gvm version number
  get        - gets the latest code (for debugging)
  use        - select a go version to use (--default to set permanently)
  diff       - view changes to Go root
  help       - display this usage text
  implode    - completely remove gvm
  install    - install go versions
  uninstall  - uninstall go versions
  cross      - install go cross compilers
  linkthis   - link this directory into GOPATH
  list       - list installed go versions
  listall    - list available versions
  alias      - manage go version aliases
  pkgset     - manage go packages sets
  pkgenv     - edit the environment for a package set
```
GREメモ

# 前提
- さくらVPS(CentOS 6.8)×２
- グローバルIPが１個付与、ローカルは仮想(tun)

# 設定
```
# ip tunnel add tun0 mode gre remote [宛先グローバル] local [送信元グローバル] dev eth0
# ifconfig tun0 [送信元ローカル] netmask 255.255.255.252 pointopoint [宛先ローカル]
# ifconfig tun0 mtu 1500 up
```

# パケットキャプチャ

![ScreenClip.png](https://qiita-image-store.s3.amazonaws.com/0/50690/00ce4fe0-f2a0-3666-1991-7847dc96bfc5.png)

メモ
- GREヘッダが付与される
    - 内容は要確認
[PHP]親クラスのプロパティを取得する

親クラスのプロパティの値を参照したいことがある。
特に、デフォルトの設定値をクラスごとに設定する場合など。

```php
<?php

class A
{
    public $config = ['prop1' => 'A', 'prop2' => 'A', 'prop3' => 'A', 'prop4' => 'A'];
}

class B extends A
{
    public $config = ['prop1' => 'B', 'prop2' => 'B', 'prop3' => 'B'];
}

class C extends B
{
    public $config = ['prop1' => 'C', 'prop2' => 'C'];
}

class D extends C
{
    public $config = ['prop1' => 'D'];
}

$d = new D();
var_dump($d->config);

```

実行結果

```
array(1) {
  ["prop1"]=>
  string(1) "D"
}
```

親クラスに `['prop2' => 'C']` が設定されてようがされてなかろうが、
`class D` に書かれた`$config`しか参照できない。

それでは困るので、解決策。

```php
<?php

class A
{
    public $config = ['prop1' => 'A', 'prop2' => 'A', 'prop3' => 'A', 'prop4' => 'A'];
}

class B extends A
{
    public $config = ['prop1' => 'B', 'prop2' => 'B', 'prop3' => 'B'];
}

class C extends B
{
    public $config = ['prop1' => 'C', 'prop2' => 'C'];
}

class D extends C
{
    public $config = ['prop1' => 'D'];
}

$d = new D();

// 現在のクラス名を取得
$class = get_class($d);

while (true) {
    $parent = get_parent_class($class);
    echo $parent."\n"; // 親クラスの名前
    if (!$parent) {
        break;
    }
    $parents[] = $parent;
    $class = $parent;
}
foreach ($parents as $parent) {
    $vars = get_class_vars($parent);
    var_dump($vars); // 結果を出力
}

```
結果がこちら。

```php
array(1) {
  ["config"]=>
  array(2) {
    ["prop1"]=>
    string(1) "C"
    ["prop2"]=>
    string(1) "C"
  }
}
array(1) {
  ["config"]=>
  array(3) {
    ["prop1"]=>
    string(1) "B"
    ["prop2"]=>
    string(1) "B"
    ["prop3"]=>
    string(1) "B"
  }
}
array(1) {
  ["config"]=>
  array(4) {
    ["prop1"]=>
    string(1) "A"
    ["prop2"]=>
    string(1) "A"
    ["prop3"]=>
    string(1) "A"
    ["prop4"]=>
    string(1) "A"
  }
}
```

これで取得できる！
ただし、merge された状態での取得はできない。

ということで、何も考えずに勝手に`config` がマージされるtrait を作ってみた。

```php
<?php

trait configMerger
{
    public function __construct()
    {
        $class = get_class($this);
        $classes[] = $class;
        while (true) {
            $parent = get_parent_class($class);
            if (!$parent) {
                break;
            }
            $classes[] = $parent;
            $class = $parent;
        }
        foreach ($classes as $class) {
            $vars = get_class_vars($class);
            $this->config += $vars['config'];
        }
    }
}

class A
{
    use configMerger;
    public $config = ['prop1' => 'A', 'prop2' => 'A', 'prop3' => 'A', 'prop4' => 'A'];
}

class B extends A
{
    public $config = ['prop1' => 'B', 'prop2' => 'B', 'prop3' => 'B'];
}

class C extends B
{
    public $config = ['prop1' => 'C', 'prop2' => 'C'];
}

class D extends C
{
    public $config = ['prop1' => 'D'];
}

$d = new D();
var_dump($d->config);


```

結果は、

```
array(4) {
  ["prop1"]=>
  string(1) "D"
  ["prop2"]=>
  string(1) "C"
  ["prop3"]=>
  string(1) "B"
  ["prop4"]=>
  string(1) "A"
}
```
となり、ちゃんとマージされた`config`が取得できた。

ちなみに、この例では、 `classA` の中で `use configMerger;` を書いているが、
`class A`がライブラリのコードで触ることができない場合、
`class D`に`use configMerger;`を書いても同じ挙動を期待できる。

あまり使う機会はないかと思うが、古いライブラリとかを使う時に知っておくと便利かもしれないtipsでした。
Amazon CloudSearch で 商品検索を実現する - No.4 ファセット

# ファセット とは
> ファセットとは、検索結果の絞り込みとフィルタ処理を行うために使用するカテゴリを表すインデックスフィールドです。Amazon CloudSearch に検索リクエストを送信すると、ファセット情報をリクエストして、特定のフィールドで同じ値を共有するドキュメントの数を調べることができます。この情報を検索結果と共に表示して、ユーザーはそれを利用して対話的に検索結果を絞り込むことができます。（これは多くの場合、ファセットナビゲーションまたはファセット検索と呼ばれます）。

[Amazon CloudSearch でファセット情報を取得して使用](https://docs.aws.amazon.com/ja_jp/cloudsearch/latest/developerguide/faceting.html)

![faset.png](https://qiita-image-store.s3.amazonaws.com/0/145742/cdbf6110-38ad-9f02-17c3-09daa18b2227.png)

この場合は、「マリオ」が関係するゲームを ジャンルやプラットフォームで絞り込むことができます。

# ファセットを指定できるフィールド
特定の型のフィールドをファセットの対象にすることができます。xx-array のフィールドは arrayは データベース設計でいうところの非正規化状態の繰り返し値を保持できます。

|型|説明|
|:--|:--|
|int|64 ビット符号付き整数値|
|int-array|intの配列|
|date|日付と時刻。書式は``yyyy-mm-ddTHH:mm:ss.SSSZ`` に従ってUTC（協定世界時間）で指定されます。小数点以下の秒数も指定できます。[例]``1967-01-31T23:20:50.650Z``
|date-array|dateの配列|
|double|倍精度 64 ビット浮動小数点値|
|double-array|doubleの配列|
|latlon|緯度と経度の値のペア (lat, lon) |
|literal|大文字と小文字が区別し、正確な一致を可能にする文字列|
|literal-array|literalの配列|

[Amazon CloudSearch ドメインのインデックスフィールドの設定](https://docs.aws.amazon.com/ja_jp/cloudsearch/latest/developerguide/configuring-index-fields.html)

CloudSearchの管理コンソールから **Indexing Options** でインデックスの設定を行うときに、ファセットを指定できるフィールには **Facet**列にチェックボックスが現れます。

![faset-on-index.png](https://qiita-image-store.s3.amazonaws.com/0/145742/2f86e08d-2b71-51a6-95a4-00c767fef410.png)

# ファセットの利用用途

ファセットとは にある通りで、フリーワードでざっくりと検索した後に絞り込むことになります。使いやすい用途としてはこれらがあると思います。

* 商品のカテゴリ
* 価格 を範囲指定して価格帯
* 発売年
* 販売メーカー
などなど
re:dashの権限管理とその活用事例

re:dashにはver0.9.0から、ユーザーグループごとの権限管理が追加されています。
どのように権限が管理できるのか、
実運用でどう使えばいいのかを紹介します。

## <i class="fa fa-group" style="font-size:1em;"></i> re:dash の権限管理モデル

参考: [Permissions Model — Re:dash documentation](http://docs.redash.io/en/latest/usage/permissions.html)

re:dashはグループ単位の権限モデルを採用しています。
ユーザーの所属するグループにデータソースを **"Full Access"** か **"View Only"** のどちらかで紐付けることで、データソースにアクセスできます。
選んだオプションで、対象データソースに関連するクエリとダッシュボードに対する権限が決まります。

<img width="422" alt="re:dash権限選択" src="https://qiita-image-store.s3.amazonaws.com/0/19366/9a091659-59a6-3895-e743-73d3cd8c762b.png">

オプションによる権限の違いは以下の通り。

| | 既存クエリ結果の閲覧 | 新規クエリの発行 | ダッシュボードのウィジェット閲覧 |
| --- | :---: | :---: | :---: |
| Full Access | ◯ | ◯ | ◯ |
| View Only | ◯ | × | ◯ |
| 紐付けなし | × | × | × |

Full Access と View Only の違いは **新規クエリが発行できるかどうか** 。

データソースに対する書き込み権限の制御はre:dash側ではできないので
データソース側で権限管理しましょう。


### View Only はいつ使うのか
View Only は「新規クエリは発行できないがクエリの結果は見られる」という権限です。
例えば以下のような場面で必要になります。

- ダッシュボード閲覧のみができればいい
- センシティブな情報が格納されているデータソースに対する集計結果のみ見たい


### ダッシュボードに閲覧の制限はかけられるか
**できません。**
対象ダッシュボード内の一つでも自分がアクセスできるデータソース関連のウィジェットがあれば一覧に表示され、閲覧も可能です。
(閲覧権限がない他ウィジェットの内容は見られない)


## <i class="fa fa-info-circle" style="font-size:1em;"></i> 事例： 営業メンバーがSQLを使うチームの re:dash 権限管理
### 何をしたかったか
自分の所属しているチームでは、 **re:dash をメンバー全員が閲覧できるようにしています** 。
営業など開発以外のメンバーも例外ではありません。

チーム内の情報共有の効率化と、分析できる人を増やすことが目的です。

誰もがデータに直接アクセスできることで、
SQLが書けるメンバーは自分でRDBにクエリを投げ、たとえ書けなくても
**「こんなデータ出せる？」** → **「出してみました（re:dash のクエリURLで共有）」**
というコミュニケーションを取れるようになります。

### どうやって実現したか
もちろんデータの中には、全員に見せられないセンシティブな情報もあります。
セキュリティは担保した上でメンバーに自由にデータを扱ってもらうために、
メンバーの権限は以下のような構成にしています。

![re:dashデータソース構成](https://qiita-image-store.s3.amazonaws.com/0/19366/5b8c845d-f360-f6b6-7364-d4e9c74d4b61.png)
（かなり簡略化した図です。）


- センシティブなデータをマスク済のデータソースには **Full Access** で関連付け
- マスク前のデータソースは **View Only** で関連付け

こうすることで、どのデータソースであってもダッシュボードやクエリでメンバーに情報共有でき、
**メンバーが自由にクエリを投げられるのはマスクされた安全なデータソースのみ** になります。

## <i class="fa fa-bar-chart" style="font-size:1em;"></i> おわりに
re:dash は開発が活発に行われているため、権限周りの仕様も今後変わるかもしれませんが、
この記事が何かの参考になれば幸いです。
上手く使ってチーム内のデータ活用を促進していきましょう！