OmniAICreator/Qiita-1.07M huggingface dataset:
今さら IE8 + Win7 の環境を Mac OS X 上に構築する手順

IE8 を使っている時点でセキュリティ的に大問題ですが、世間にはまだ多くのユーザーが残っています。残念ながらWEBサービス提供者としては見過ごすことができません。画面を修正すると、IE8 での検証もしなければならないのです。

今回はそんな悲しい運命を背負われた人が Mac 上で IE8 を動かせるようにする方法を共有します。

※なお、IE9-11 の環境も構築できます。詳細は後述。


どうやって実現する？
----
幸いにも Microsoft が IE8 インストール済みの Windows7 の VM イメージを無償公開しているため、これを利用します。

もともとは modern.IE というプロジェクトで検証用の VM を配布していたようですが、今は単に [developer.microsoft.com](https://developer.microsoft.com/en-us/microsoft-edge/) の1コンテンツになっています。

![microsoft_edge.png](https://qiita-image-store.s3.amazonaws.com/0/8267/3365d3d2-2c45-6adc-c45b-8a026c68303d.png)


検証環境
----
* MacBookPro (2015)
* OS X El Capitan 10.11.5
* Vagrant 1.8.4
* Oracle VirtualBox 5.0.16

(Vagrant と VirtualBox のインストール方法は [MacにVagrantとVirtualBoxを入れてみる - Qiita](http://qiita.com/you-me/items/3126e7f91ccdf4d8a873) あたりを参考に。インストーラーをダウンロードするだけですが。)


導入手順
----
### イメージのダウンロード

https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/ から以下の条件でダウンロード。4.2GB もあるので結構時間がかかります。

* Virtual Machine: *IE8 on Win7*
    * ※IE9-IE11 を選択すれば、同様に IE9-11 の環境も構築できます
* Select platform: *Vagrant*

![Download virtual machines.png](https://qiita-image-store.s3.amazonaws.com/0/8267/eb3f3072-a0ce-f9f1-b433-a71d01d8f7c8.png)

ダウンロードが完了したら解凍します。　

なお、このイメージは zip64 なる形式で圧縮されているようで、Mac 標準の Finder でダブルクリックして解凍すると、`.cpgz` という拡張子のファイルが出てきて、それを解凍すると `.zip` という拡張子のファイルが出てきて…という無限ループに陥ります。今回は [無限zip〜cpgzをTerminal（7-Zip）で解凍（Mac, OSX） – Kumi-Log](http://jp.kumi-log.com/tech/zip-cpgz-and-p7zip/) を参考にして、7-Zip を使いました。

```bash
brew install p7zip
7z x IE8.Win7.Vagrant.zip
# 'IE8 - Win7.box' という VagrantBox ファイルが展開される
```

### Vagrantfile の作成

続いて Vagrantfile を作ります。

```bash
# box ファイルをフォルダに入れる
mkdir ie8box
mv IE8\ -\ Win7.box ie8box
cd ie8box

# Vagrantfile を作成
vagrant init

vim Vagrantfile
```

Vagrantfile　の中身は以下。

```rb:Vagrantfile
Vagrant.configure(2) do |config|
  config.vm.box = "IE8 - Win7.box"
end
```

### Windows VM の起動

最後に Vagrant を起動します。

```bash
vagrant up

# => ...
# =>     default: Warning: Authentication failure. Retrying...
# =>     default: Warning: Authentication failure. Retrying...
```

ここは Vagrantfile のオプションが足りていないようで、ssh ログインしようとしていつまでも失敗しています。が、VirtualBox を確認すれば、問題なく Windows VM が立ち上がっているでしょう。

<img width="768" alt="Virtualbox.png" src="https://qiita-image-store.s3.amazonaws.com/0/8267/ffd0b498-c4cb-0fb3-9a11-fb758480d56c.png">

作成された VM をダブルクリックして、画面を開きます。

![IE8 on Mac.png](https://qiita-image-store.s3.amazonaws.com/0/8267/d039fef0-8ebf-792a-8667-467e91c21765.png)

以上で完了です。IE8 のクレイジーな挙動を堪能しましょう。


参考
----
* [VagrantコマンドとVagrantfileの設定メモ - Qiita](http://qiita.com/pugiemonn/items/bcd95a35c3ec7624cd61)
* [Windows7でIE8の検証用仮想環境を構築してみよう - harublog](http://hrt0kmt.hatenablog.com/entry/2013/11/15/180753)
端の丸いBorder

#仕様

![スクリーンショット 2016-07-21 14.37.09.png](https://qiita-image-store.s3.amazonaws.com/0/18348/ffac5c70-9d3a-5371-9c9d-564dcd6a0ed2.png)

端が丸くなってるBorderをCSSで実装

# ソース

例は左の場合。
`:before` と `:after` で該当要素のborderと同じ値の丸を作って、`position`で位置調整すればOK。
Sassで書くのでどこの値がどうなるってのはソース参考に。

```sass:round-cap-border.scss
$width__border: 6px;
$color__border: red;
h1 {
  font-size: 18px;
  border-left-style: solid;
  border-left-width: $width__border;
  border-left-color: $color__border;
  position: relative;
  padding-left: 10px;
  &:before,
  &:after {
    content: ' ';
    background-color: $color__border;
    width: $width__border;
    height: $width__border;
    border-radius: ($width__border/2);
    display: block;
    position: absolute;
    left: -($width__border);
  }
  &:before {
    top: -($width__border/2);
  }
  &:after {
    bottom: -($width__border/2);
  }
}
```

デモはこちら
https://jsfiddle.net/gatespace/4p8z2jgf/
Flux と Component 〜 Vue.jsとVuexとVuex-connect

 
言語化するのを放棄した

## Flux

- グローバルステート及びそれに伴う周辺アクセサなどなど
- 開けた局所的な操作
- 所詮はグローバル

開けている必要のある局所的な操作と、開けている必要のない局所的な操作、圧倒的に後者のほうが多数だよね問題がある。死ぬ。

## Component

- 強いscope、明確なIN OUT(のはず)
- 閉じたモノリシックな操作
- 所詮はバケツリレー

大体の場合、親のコンポーネントはバケツで死ぬ。

## ストレス度合い

グローバルな問題は、臭いレベルの苦痛にとどまるが、破綻時の影響が計り知れない。

短期的な観測ではバケツリレーの方がストレス値は高い。

なのでまぁfluxに逃したくなる気持もわかるが、全部が全部flluxに流すだけなら「綺麗なjQuery」書いてる方がましになる。

閉じた部分、開けた部分をしっかり意識して運用する。

## 最近のユースケース

Vue.js/Vuex で Flux運用をとっている。

親直ルートのコンポーネントは全てVuex-connectコンポーネント

Vuex-connect コンポーネントはprop使えずバケツが出来ないので,依存箇所がgetterで明確に制御出来る。
この辺はFluxフローの影響範囲特定にかなり役立つ。

Vuex-connect はむやみに乱用しない。

require("vuex-connect")をコンパイルルートでのみにしぼり、Component側のファイルでの利用を禁止。
かつ Veux-connectコンポーネントの親子関係生成を禁止して、Veux-connect コンポーネント以下ではバケツを強制。

構造としてはコアに fluxに載ったVuex-connectコンポーネントが幾つか配置され、
周辺にスコープの固い、通常Componetが多数配置される、みたいな流れになる。
[Emacs] tramp-modeが便利


普段Emacsを使っている人でもssh先でファイルを編集するときや、sudoでファイルを編集するときはvi/vimを使うという人は結構いるのではないだろうか。
Emacs22.1から標準で入っているtramp-modeを使えばそんな場合でも使い慣れたEmacs上でファイルを編集できる。

参考: https://www.emacswiki.org/emacs/TrampMode

# セットアップ

不要。
(古いEmacsでは`(require 'tramp)`が必要らしい)

# 使い方

## リモート端末のファイルを編集

`C-x C-f /scp:username@remotehostname:filename`
先頭の`scp`は接続に使用するメソッドで省略するとデフォルト(通常は`scp`)になる。
`C-x C-f /username@remotehostname:filename`

`ssh`メソッドを使うとレスポンスが良くなるらしい。
`C-x C-f /ssh:username@remotehostname:filename`

ただし自分の環境では`ssh`メソッドでファイルオープンに失敗することがある(未解決)ので普段は`scp`を使用している。

単純にファイルの編集が可能であるだけではなく **magitも使用可能** であることが驚異的。

## sudoでファイルを開く

`C-x C-f /sudo::filename`

上記コマンドでrootのパスを聞かれてしまう場合は

`C-x C-f /sudo:username@localhost:filename`

`sudo`メソッドの時にデフォルトで使用されるユーザー名は`root`になっているが`M-x customize-group tramp`で変更できる

# FAQ

## 接続が切れるとフリーズする

`M-x tramp-cleanup-all-buffers` を実行する
Androidアプリ内のフォルダ構成(persistentDataPath)を確認する方法


**■teratailで質問して教えてもらいました。**
https://teratail.com/questions/41786

## ■adbを使用できるようにする

　・下記サイトを参考にシステム環境設定をいじって**adb.exe**の存在するパスを設定
　　http://techacademy.jp/magazine/2989

## ■コマンドプロンプトを開いてリストを表示
　・コマンドプロンプトを開く
　・**adb shell**を実行
　・**run-as アプリのパッケージ名**
　　※アプリのパッケージ名は**Player Settings**--->**Other Settings**--->**Bundle Identifier**を参考の事
　・**ls**とか**cd**を使用する。
　　下記をコマンド入力して見れました。
　　**cd files**--->**ls**
sudo: /etc/vsftpd: コマンドが見つかりません

##問題

sudo yum install vsftpd　で、きちんとインストールされている、にもかかわらず、
上のようなエラーが出た。

##解決方法

以下のコマンドで起動できた。

```shell-session
$ sudo systemctl status vsftpd.service
```

```shell-session
$ sudo systemctl status vsftpd.service

● vsftpd.service - Vsftpd ftp daemon
   Loaded: loaded (/usr/lib/systemd/system/vsftpd.service; disabled; vendor preset: disabled)
   Active: active (running) since 木 2016-07-21 01:00:49 EDT; 10s ago
  Process: 4207 ExecStart=/usr/sbin/vsftpd /etc/vsftpd/vsftpd.conf (code=exited, status=0/SUCCESS)
 Main PID: 4208 (vsftpd)
   CGroup: /system.slice/vsftpd.service
           └─4208 /usr/sbin/vsftpd /etc/vsftpd/vsftpd.conf
```

##参考記事

http://kajuhome.com/cgi-bin/patio/patio.cgi?mode=view&no=2019
phpenvとrbenvをMac共存させる


色々なレガシーな環境だと、複数バージョンのRubyだけではなく、複数バージョンのPHPを扱える環境が必要になることがあります。

そういう時は、phpenvとrbenvをインストールしましょう。
ですが、phpenvは内部が殆どrbenvになっており、環境変数`RBENV_ROOT`を参照しているなどしているので、気をつけなければいけない点があります。

# まずはインストール

rbenvとphpenvはhomebrewからインストールするのが簡単です。

## rbenvをインストール

とても素直にインストールできます。

```install_rbenv.sh
$ brew install rbenv
$ brew install ruby-build
```

### rbenvのセットアップ

**ここは後で書き換えることになるので飛ばして構いません。**
rbenvだけ使いたいのであれば、`.bashrc`や`.zshrc`などに下記を追加しましょう。

```.bashrc
export RBENV_ROOT=/usr/local/bar/rbenv
export PATH=$RBENV_ROOT/bin:$PATH
eval "$(rbenv init -)"
```

## phpenvをインストール

`php`関連のものをインストールするために、最初に`brew tap`します。

```
brew tap homebrew/php
brew install phpenv
```

これは単にhomebrewの管理対象として`git clone`しただけなので、インストーラーを使います。

## php-buildをインストール

homebrew でもphp-buildをインストールできるのですが、この2つは連携できないようです。
そこで、php-buildに従い、`git clone`でダウンロードしましょう。

```install_php-build.sh
$ git clone git://github.com/CHH/php-build.git $HOME/.phpenv/plugins/php-build
```

# .bashrc を変更

bashなら`.bashrc`を、zshならば`.zshrc`に下記の行を追加します。

```.bashrc
# export RBENV_ROOT=/usr/local/var/rbenv <= 邪魔になるのでいらない。
export PHPENV_ROOT=$HOME/.phpenv
export PATH="$PATH:$PHPENV_ROOT/bin"
eval "$(rbenv init -)"
eval "$(phpenv init -)"
```

## （任意）.rbenv へのシンボリックリンクを作成する。

環境変数`RBENV_ROOT`を未定義の場合、`.bashrc`内でrbenv本体は`~/.rbenv`として扱われます。
もし、homebrewでインストールしたrbenvを使う場合は、`.rbenv`をシンボリックリンクとして定義します。

```create_symlink_for_rbenv.sh
$ ln -s ~/.rbenv /usr/local/var/rbenv
```

# 最後に動作確認を

## rbenvの確認

`rbenv` コマンドが実行できて、rubyがインストールがインストールできることを確認しましょう。

```
$ rbenv install -l
Available versions:
  1.8.5-p113
  1.8.5-p114
  ...
  ree-1.8.7-2012.01
  ree-1.8.7-2012.02
  topaz-dev
$ rbenv install 2.3.1
$ rbenv versions
  system
* 2.3.1 (set by /Users/tatsuya.sato/.rbenv/version)

$ rbenv global 2.3.1
$ ruby -v
ruby 2.3.1p112 (2016-04-26 revision 54768) [x86_64-darwin15]  
```

## phpenvの確認

PHP自体のインストールは[他にも色々インストールが必要](http://qiita.com/omega999/items/c5b1c177331f8d342efd)なので、ここではrbenvとの間に影響が出てないことだけを確認しておきましょう。

```
$ phpenv install -l
Available versions:
  5.2.17
  5.3.10
  ...
  7.1.0alpha3
  master
```

もし上手く言ってない場合は、Available versionsに`rbenv install -l` の結果が出てしまったりします。もしそうなっていたら、`.bashrc`の内容や環境変数`RBENV_ROOT`がどこかで定義されていないか確認をしましょう。

それではよりよいPHPライフを。

# 参考

 * [PHPバージョン管理のphpenvをMacにインストールで複数ver使う PHP5.6/PHP7 - Qiita](http://qiita.com/aoioooii/items/2263c79284c612c7d6ed) 
 * [phpenv+php-build環境によるphpバージョン管理~Mac（Yosemite）編~ - Qiita](http://qiita.com/omega999/items/c5b1c177331f8d342efd)
GithubにSSH接続できない場合の対処


## はじめに
今日（2016/07/21）githubからいつものようにレポジトリをpullしたらエラーが発生して接続できない事象が発生。
１週間前まで接続できていたレポジトリで、ローカルもGithubの設定も変更した覚えがなかったが、結論としてはgithubの仕様に沿った設定ができていなかったことが原因だった。
エラーメッセージから判断しにくい問題だったので、同じ問題に遭遇した方の一助になればと思う。

## 事象
以下のメッセージが出力されGithubのレポジトリにアクセスできない。。。

```
% git pull origin master
Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
```

## 解消方法
### 前提条件
Githubアカウント名: shungok
レポジトリ名: Hoge/fuga

### 手順
■git configの設定確認

```
% git remote -v
origin	 shungok@github.com:Hoge/fuga (fetch)
origin	 shungok@github.com:Hoge/fuga (push)
```
@github.comの左側がGithubアカウント名になっている。
この設定が問題あり。
必ず「git」ユーザを指定する必要がある。

■git configの修正

```
% git remote set-url origin git@github.com:Hoge/fuga

% git remote -v
origin	 git@github.com:Hoge/fuga (fetch)
origin	 git@github.com:Hoge/fuga (push)
```

■pullの確認

```
% git pull origin master
From github.com:Hoge/fuga
 * branch            master     -> FETCH_HEAD
Already up-to-date.
```

接続できた。

## おわりに
以下のsshが通るものと思い込んでいたが（以前は通っていたような。。。）
gitユーザでなければssh接続できないことが分かった。

```
% ssh -T shungok@github.com
Permission denied (publickey).

% ssh -T git@github.com
Hi shungok! You've successfully authenticated, but GitHub does not provide shell access.
```

Githubのトラブルシューティングのページにはっきりとgitユーザしか許容しないと書いてあったが、これまではなぜ接続できていたのか、、、この１週間で仕様が変わったのだろう。

```
All connections must be made as the "git" user. If you try to connect with your GitHub username, it will fail:
```

## 参考URL
* https://help.github.com/articles/error-permission-denied-publickey/#always-use-the-git-user
Vagrantのインストール（macOS編）

#インストールするもの

Vagrantをインストール、動作させるのに必要なものをインストールします。 
具体的には以下をインストールします。 

- Homebrew
- VirtualBox
- Vagrant

Homebrewを先にインストールしてください。VirtualBox、VagrantはHomebrewからインストールします。


#Homebrewのインストール

http://brew.sh/
に書かれているコマンドを実行します。
次のコマンドです。

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

##Homebrewの動作チェック

Homebrewが正常に動作するか確認します。次のコマンドを実行し、`Your system is ready to brew.`が表示されるまで指示に従って問題を解消してください。

`brew doctor`


##VirtualBoxのインストール

VirtualBoxをインストールします。 
次のコマンドを実行します。

`brew cask install virtualbox`

インストール中にパスワード入力を求められたら入力して下さい。


##Vagrantのインストール

Vagrantをインストールします。 
次のコマンドを実行します。

`brew cask install vagrant`


#アップデート方法

brew caskでインストールしたものをアップデートするには次のコマンドを実行します。

`brew cask upgrade`


# トラブルシューティング

## Vagrant 1.8.7

### vagrant box add でエラーが発生する

box未取得で `vagrant up` 時に取得する場合もエラーが発生します。 
この問題はmacOS版のみ発生します。 
原因としてはVagrantに含まれているcurl関連に問題があるようです。

対策としてはVagrant 1.8.6に戻すか、Vagrantに含まれているcurlを削除します。

- [1.8.7 fails to download or update boxes](https://github.com/mitchellh/vagrant/issues/7969)
- [Vagrant 1.8.7でvagrant upできないときの応急対応](http://qiita.com/kotatsu360/items/554da271d6935622254b)
- [Wockerでvagrant box addするときにエラーが出て、はまったこと](http://qiita.com/momotomom/items/dec9a76506fa6f23cd38)
VMWare ESXi のデータストアディスクを大容量のものに交換し、データストアを拡張した時のメモ

# 注意点
拡張の際に、一度拡張対象のデータストア上で稼働している仮想マシンを全て停止する必要がある。

# 手順

##1. 新旧ディスクをサーバ(物理筐体)に接続する
ATAでもUSBでも、空いてるポートに接続できればOK

##2. ディスクブートでUbuntu起動
UbuntuでもVineでも、好きなLinuxのLive CD/DVDからディスクブートで起動する

##3. ディスク内容をコピーする
・新旧デバイスの確認
　今回は旧デバイスが「/dev/sda」、新デバイスが「/dev/sdb」でした

```bash
# ls -l /dev/sd*
brw-rw---- 1 root disk 8, 0  7月 11 16:12 /dev/sda
brw-rw---- 1 root disk 8, 1  7月 11 16:12 /dev/sda1
brw-rw---- 1 root disk 8, 2  7月 11 16:12 /dev/sda2
brw-rw---- 1 root disk 8, 5  7月 11 16:12 /dev/sdb
```

・ddコマンドでディスク内容をコピー
　※ifとofは間違えると取り返しがつかないので注意
　※ブロックサイズは適宜指定(512とかが確実かも)

```bash
# dd if=/dev/sda of=/dev/sdb bs=8192 conv=noerror,sync
```

##4. ディスク交換
旧ディスクを外して、新ディスクのみにして起動する。

##5. ESXiのSSHをオンにする

1. F2 #ESXiコンソールから、F2で設定モードに入る
2. [Troubleshooting Options] Enter
3. [Enable ESXi Shell] Enter
4. [Enable SSH] Enter
5. Esc
5. Esc

##6. データストアを拡張する
・ESXi Shell または SSHでESXiへ接続する
　ESXi Shell > ESXiコンソールのトップ画面で「Alt+F1」
　SSH > TeraTermなどでESXiのIPへSSH接続
　　　　※認証はチャレンジレスポンスにする必要有

・パーティションの拡張

　データストアに紐付いているディスクを確認する

```bash
# vmkfstools -P "/vmfs/volumes/<データストア名:datastore1 など>"
VMFS-<VMFSバージョン> file system spanning 1 partitions.
File system label (if any): <データストア名>
Mode: public
Capacity <パーティション容量> (~ file blocks * ~), <空き容量> (~ blocks) avail
UUID: <新データストアハッシュ>
Partitions spanned (on "lvm"):
<ディスク名>
```

　ディスクのパーティション内容を確認する
　　出力結果の左から順に パーティション番号, 開始セクタ, 終了セクタ です。

```bash
# partedUtil get "/vmfs/devices/disks/<ディスク名>"
182401 255 63 2930277168
1 2048 2930277134 0 0
```

　拡張可能な領域(新しい終了セクタ)の確認 (ESXi5以上のみ)

```bash
# partedUtil getUsableSectors "/vmfs/devices/disks/<ディスク名>"
34 2930277134
```

　パーティションの拡張

```bash
# partedUtil resize "/vmfs/devices/disks/<ディスク名>" <パーティション番号> <開始セクタ> <新しい終了セクタ>
# echo $?
0
```

・ファイルシステムの拡大

1. vSphere Clientでログインする
2. [構成]タブを開く
3. [データストア]を表示する
4. 拡張したいデータストア識別名を右クリックし、削除する
5. [すべてを再スキャン]を実行する
6. 拡張したいデータストア識別名を右クリックし、プロパティを選択する
7. ボリュームのプロパティで[拡大]ボタンをクリックする
8. 拡大する

##7. データストア紐づけを修正する

・新データストアのハッシュ値を確認する

```bash
# ls -l
～～～省略～～～
drwxr-xr-t    1 root     root          4340 Jul 11 02:05 57********
lrwxr-xr-x    1 root     root            35 Jul 12 08:46 <データストア名> -> 57********
```

・旧データストアのハッシュ値を確認する
　実行結果から /vmfs/volumes/<旧データストアのハッシュ>/ を確認

```bash
# find /vmfs/volumes/<新データストアのハッシュ>/ -name "*.vmx" -type f -print | xargs grep derivedName
/vmfs/volumes/57********/testvm/testvm.vmx:sched.swap.derivedName = "/vmfs/volumes/52********/testvm/testvm-8e*****.vswp"
```

・旧データストアへのパス設定を新データストアへ置換する
　間のgrep -l はなんとなくです

```bash
find . -name "*.vmx" -type f -print | xargs grep -l <旧データストアのハッシュ> | xargs
sed -i "s/<旧データストアのハッシュ>/<新データストアのハッシュ>/g"
```

##8. 仮想マシンを起動してみる
無事起動できたら、ESXi の SSHアクセスを無効化する。

なお、仮想マシン起動時に仮想マシンをコピーしたかを聞かれたら、「I move it.／移動しました」を選択する。
【CSS】スマホで Media Queries が効かないときの対処法

# Media Queries とは
Media Queries はCSS3から追加された機能で、レスポンシブデザインを行うのに利用されます。

# レスポンシブデザインとは
レスポンシブデザインとは、PCやスマホ、タブレットなどの画面サイズが異なる複数のデバイスに対して、それぞれの画面サイズに適したデザインを、それぞれ全く別のCSSファイルで書くのではなく一つのCSSファイルでまとめて行うものです。

# Media Queries の使い方
Media Queries の使い方はとっても簡単です。

```css
@media screen and (max-width: 500px) {

}
```

このブロック内にスマホのみに対応させたいCSSを書くだけでスマホの画面のスタイルを適用することができます。

⚠️ 厳密にはスマホではなく横幅500px以下の画面に対して適用されます。PCでも、ブラウザのウィンドウ幅を500px以下にすればこのブロック内のスタイルが適用されますし、逆に500px以上の画面サイズのスマホがあったならこのスタイルは適用されません。

ところが、使い方を間違えるとレイアウトがおかしくなったり適用されなくなったり、PCではブラウザのウィンドウ幅を狭くすると適用されるのになぜかスマホでは適用されない…なんてことが起こります。今回はそれらの問題について細かく切り分けていきたいと思います。

# スタイルが適用されない・レイアウトがおかしくなる
Media Queries は記述する順番が重要です。どのデバイスを中心にスタイルを組むかによって順番が異なります。

PCのデザインをまず組んで、その後にスマホでデザインが崩れている部分を Media Queries で修正する場合を「PCファースト」、反対にスマホのデザインを組んでから、PCのデザインに合うように Media Queries を適用する場合を「モバイルファースト」と言います。

## PCファーストの場合
PCファーストの場合は、PCのスタイル → スマホのスタイル の順番で Media Queries を記述します。
今回はPCの画面サイズを1200px以下、スマホの画面サイズを500px以下と定義することにします。

```css
@media screen and (max-width: 1200px) {
  /* PC用のスタイル */
}
@media screen and (max-width: 500px) {
  /* スマホ用のスタイル */
}
```

こうすることで先に1200px以下のデバイス(PC)のスタイルが適用され、そのあとにもし500px以下のデバイス(スマホ)であればそちらが上書きで適用されます。

なお、この場合、1200px以上のデバイスの場合はスタイルが適用されないので、スマホのスタイルに対してのみ Media Queries を適用するほうが便利です。

```css
/* 全体に適用されるスタイル */

@media screen and (max-width: 500px) {
  /* スマホ用のスタイル */
}
```

## モバイルファーストの場合
モバイルファーストはPCファーストの逆の順番で記述します。

```css
@media screen and (max-width: 500px) {
  /* スマホ用のスタイル */
}
@media screen and (max-width: 1200px) {
  /* PC用のスタイル */
}
```

こうすることで、先にスマホ用のスタイルが適用されたあとにPCの場合はPC用のスタイルが上書きで適用されます。

ちなみに、今回の例ではPCとスマホのみを例にあげていますが、たとえばタブレット端末にはまた別のスタイルを適用したいという場合はスマホとPCの Media Queries の間に、タブレットに対応した画面サイズの Media Queries を定義してあげればOKです。

# PCでは適用されるのに、なぜかスマホでは適用されない
今回ぼくがはまったのはこれです。PCのブラウザ上でウィンドウの幅を狭めるとうまく適用されるのに、なぜかスマホで見るとスマホ用のスタイルが適用されません。

実は、スマホはPCサイトを見やすくするために独自の画面サイズが定義されていて、スマホでサイトが表示されたときに、たとえば980px用の画面サイズのスタイルで表示されるようになっています。

これを、本来のスマホの画面サイズ(iPhone5なら320px)で Media Queries が適用されるようにするためにはViewportというものが必要になります。

## Viewportの記述法
Viewportの記述法はシンプルです。Media Queries を適用しているCSSを読み込んでいるHTMLのヘッド部分に以下の一行を追加してあげればOKです。

```html
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
```

具体的にはこんな感じ。

```html
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" type="text/css" href="読み込みたいCSSのパス">
  </head>
  <body>
    <p>Responsive Design</p>
  </body>
</html>
```

これで、スマホでアクセスしたときにも Media Queries が適用されるようになります。
Docker on Bash on Ubuntu on Windows10 は動かない（Insider Preview Build14372）

# はじめに
**本記事は2016年7月20日時点でのInsider Preview Build14372環境での記事となります。**

---

[Build 2016](https://news.microsoft.com/build2016/#sm.0004vd032bcoel9106e2k6vn5sq2m)にてWindows上でbash(Ubuntu)が動くという発表があり、ずっと気になっていたのですが正式リリースを目前にして、遅ればせながら先日やっとInsider Previewに申込みを行い
**Bash on Ubuntu on Windows**（Windows subsystem for Linux (beta)）を試してみました。

### Insider Preview
Insider Previewを申込み、**Fast**に設定しても、なかなかInsider Previewが降りてこない（ダウンロードされない）というところを除けばインストールなどは比較的簡単にできました。
（待ちきれない場合は[Insider Preview Build14372のISO](https://www.microsoft.com/en-us/software-download/windowsinsiderpreviewadvanced)を利用する手もあります）
他の方の記事や事例など多数ありますので、Insider Previewやインストール手順等は本記事では割愛します。

### Ansible は動いた
ifconfigやpingはまだできませんでしたが、
Build14372では、Ansible（v2.1.0）なども普通にapt-getコマンドでインストールでき、軽く触った限りは、特に問題なく正常動作しているように見えます。

### Docker は、、、
ここまでできたので、**Docker**も動くのではと淡い期待を抱き試してみましたが
結論から言うとインストールはできたのですが、タイトルの通り動きませんでした。

![no_run_docker_on_bash_ubuntu_windows10.png](https://qiita-image-store.s3.amazonaws.com/0/117986/2407838d-7ec7-6d21-2da2-617a4c784c6d.png)

Bash on Ubuntuのカーネルバージョン（3.4.0+）が[Dockerの要件(3.10以上)](https://docs.docker.com/engine/installation/linux/ubuntulinux/)を満たしていないこともあるのですが、残念ながら以下のとおりマイクロソフトとしては、現状1stリリースでの調査・対応予定はないようなので、`Docker for Windows`などを利用してほしいということみたいです。

https://wpdev.uservoice.com/forums/266908-command-prompt-console-bash-on-ubuntu-on-windo/suggestions/13250370-docker

### 最後に
Docker on Bash on Ubuntu on Windowsの必要性については、
Docker for Windows(VMでは動かせていないので未検証) や Vagrantの利用で十分など、色々と議論はあると思いますが、/mnt/c/でのWindowsホストのリソースへのアクセスや、他にもメリットはありそうなので今後のリリースに期待です。
キックオフで伝えるべきこと②

キックオフは、プロジェクトを成功させるために必須のイベントです。

# 体制

体制図は必須です。
体制図では、チーム分けと、コミュニケーションフローを明示します。

具体的には、

- チームはいくつあるか？
- どんなチームがあるか？
- 各メンバーはどこのチームなのか？

という疑問を解消するために明示します。

※ キックオフの時には、PMから、メンバー紹介をすることになると思います。
　　このときに一人一人立って、意気込みを述べてもらうと、一体感が出ます。


# 役割分担

体制図に役割分担も明記したい衝動に駆られますが、そうするとごちゃごちゃしてしまうので、別で役割分担表を書くといいです。

例

| ポジション | 主な役割 |
|:--|:--|
|PGリーダー|設計、実装の方針を示す。プログラムのレビューをする。|
|PG|コーディングをする。|
|テストリーダー|テスト計画書の作成とテスト実施をリードをする。|
|テスター|テスト仕様書を作成する。テストを消化する。|


# スケジュール

スケジュールは、マイルストーン(主なイベントと締切)とフェーズ(工程)を明記します。

説明するときには、
「ｘｘフェーズと○○フェーズは、並行して進めます。重複するのは、ｘｘフェーズの個別機能の部分なので、ｘｘ月中に共通機能は終了させて、その後、○○フェーズをはじめます。」
というように、フェーズ内での締め切りを明確にすることで、メンバーもそのつもりで行動してくれます。

また、
「xx月から、ｘｘチームと○○チームの作業が並行します。ｘｘを使うときは、事前連絡をしながら作業しましょう」
など、放置しておいて、お互い連絡待ちにならない様、重要なポイントでコミュニケーションを取り合うように促します。
※ これは、体制が大きくなるほど漏れやすいので意外と重要です。

# さいごに

いかがでしたでしょうか？

私がこれまでしてきた失敗経験をもとに最低限抑えるべきポイントを整理しました。

具体例を充実したいと思いますので、リクエストなどありましたら、コメントお願いします！
MySQLのスキーマ変更をオンラインでやるための選択肢比較

MySQLを使っていて、スキーマを変更したい場合はAlterTableを流す必要があります。
すでに稼動しているサービスのスキーマを変更する際に、可能な限り稼働中システムに影響を与えずにスキーマの変更を行いたいです。

理想はオンライン状態を保った状態でAlterTableが全て完了することで、これが実現できれば少なくともスキーマ変更に伴うメンテナンスのためのダウンタイムが発生しません。

これを実現するためには幾つか方法が存在し、制約もあるみたいなので調べてまとめてみました。

# その前にAlterTableのこれまでの挙動を調べる
オンラインでのスキーマ変更を調べる前に、まずはAlterTableのこれまでの挙動(MySQL5.1まで)について簡単にまとめてみます。これによってオンラインスキーマ変更のために何が問題になっているか？が理解できると思います。

MySQL5.1までのAlterTableは、変更したいスキーマ定義に沿った空のテーブルを作り、そこに古いテーブルのデータをコピーすることでスキーマの変更を行います。
**この際にデータの不整合を防ぐため、まずは古いテーブルへのデータの書き込みをブロックするlock状態に入ります**（ちなみに、古いテーブルからデータが読み込まれたとしても、新しいテーブルへのデータコピー時に不整合は起きないため、読み込みはブロックされません）。

つまり、AlterTable実行中は書き込みがlockされるわけです。
古いテーブルに大量のデータが入っている場合には、新しいテーブルへのデータコピーに時間が掛かるわけなので、書き込みlockによるメンテナンスのためのダウンタイムがどんどん伸びていくわけです。

これがMySQL5.1までのスキーマ変更の挙動でした。

参考にさせていただいた記事は[こちら](http://nippondanji.blogspot.jp/2009/05/alter-table.html)。

# MySQL5.6からサポートされているオンラインDDL
DDLはデータ定義言語というもので、データベース自体を操作するためのSQL命令文のセットです。
AlterもDDLに含まれます。

多くのAlterTableの操作時に、上記のテーブルのコピーが発生しないようにする変更と、テーブルが変更されている時でも書き込みがロックされないようにした変更の2つを合わせてオンラインDDLと呼ばれています(ちなみに念のためですが、ロックが発生しないだけで、性能上の影響は当然出ます)。

あくまで **多くの**AlterTable時であり、全てにおいてコピーが発生せず、書き込みがロックされないというわけではありません。
ざっくり書き込みロックされるされないで分類してみます。

## 書き込みロックされない
インデックスの作成,追加,削除
カラムのデフォルト値を設定する
カラムの自動インクリメント値を変更する
外部キー制約を追加,削除する
カラムを名前変更,追加※,削除,並べ替え
主キーを追加する
※オートインクリメントカラムの追加を除く

## 書き込みロックされる
全文検索インデックスを追加する
カラムを追加する(オートインクリメントカラムの追加)
カラムのデータ型を変更する
主キーを削除する
文字セットを変換する

参考にさせていただいたのは[こちら](http://dev.mysql.com/doc/refman/5.6/en/innodb-create-index-overview.html)。

つまり、MySQL5.6からは変更の内容によりますが、AlterTable実施時にロックが発生しないケースもあるということです。


# pt-online-schema-change
Percona-Toolkitという有名なツールキットに同梱されているpt-online-schema-changeというツールがあり、こちらを使うことでも読み書きロックなしでオンラインスキーマ変更が可能です。

pt-online-schema-change(長いので以後PT)はMySQLのAlterTableの挙動を内部的に再現してスキーマの変更を行いますが、工夫することでロックなしでの動作を可能にしています。

MySQL5.1では古いテーブルの書き込みをロックしてデータの不整合を防いでいました。
これに対して、PTはトリガーの仕組みを使うことで、書き込みロックを行わずにデータの整合性を保ちます。
古いテーブルから新しいテーブルへのデータコピー中に古いテーブルに対して更新が走った場合、トリガーが古いテーブルのデータ更新に伴って新しいテーブルのデータも更新するわけです。

トリガーはInsert, Update, Deleteの3種類全てが貼られます。
そのため **1つのテーブルに対して同じ種類のトリガーは貼れないため、トリガーがすでに貼られているようなテーブルにはPTは使えません**。
なお、トリガーはMySQL5.0.2からサポートされるので、PTはMySQL5.0.2以上で動作するそうです。

参考にさせていただいたのは[こちら](https://www.percona.com/doc/percona-toolkit/2.1/pt-online-schema-change.html)。

[20160721追記]
また、PTでは`--dry-run`オプションが使用できます。
**これを使うと実際の変更DBに入れる前に前もって変更が正しく入るかどうかのチェックができるのでとても便利です。**

# 比較とまとめ
MySQLのオンラインDDLでもPTでもそれぞれ制約はありますがオンラインでスキーマ変更が可能であることがわかりました。オンラインDLLは、オンラインで実行可能なスキーマ変更の種類に制約があり、PTでは既存トリガーの有無が制約になることがわかりました。
また、オンラインDDLはMySQL5.6から、PTはトリガーをサポートしているMySQL5.0.2から動作することがわかりました。

次に性能比較ですが、[こちらの記事](https://www.infiniteloop.co.jp/blog/2015/11/mysql-5-6-alter-table-percona-toolkit-pt-online-schema-change/)によると、スキーマ変更にかかる時間は対して変わらないものの、スキーマ変更中の影響という観点からはPTの方オンラインDDLよりも小さいそうです。
さらに、PTでは設定できるオプションが多く、既存システムへの影響を考えながらきめ細やかな実行戦略が組めそうです。
サイバーエージェントさんの[こちらの記事](http://ameblo.jp/principia-ca/entry-12129289966.html)にあるPTを慎重に使うためのオプションや過去の失敗事例もすごく参考になりました。

以上です。
iTerm2を使う理由および設定方法と機能紹介

# iTerm2を使う理由
- ターミナルを常時、起動できるようにしておきたい
- キー割当を細かく設定したい
- ターミナルで隠れているウィンドウを確認したい

と多々ありますが結局のところ、既存のターミナルより多機能であり導入の手間もかからないからというのが理由な気がします。

# インストール
　以下のサイトから（zipファイルを）ダウンロードして、解凍
> http://iterm2.com/

解凍ファイル（iTerm.app)をアプリケーション(/Applications)に移動

----

# 使っている機能

### ホットキー
ホットキークリックでターミナルに切替（or 起動）
※ターミナルへの切替えは頻繁に行う方なので、とても重宝している機能

### キー割当
a~z,⌘キーもキー割当可能
※(JISキーボードで)軽く確認したところ、以下キーは割当不可。他は利用できる様子
「capslock」「英数」「かな」「fn」「取り出し(⏏)」「電源ボタン」

### ウィンドウの半透明化 
「⌘ + u」でターミナルを半透明化切り替え
※ターミナルで隠れたウィンドウを確認したいときとかに使用。

### ロギング 
メニューバーから「Shell > Log > Start, Stop」でターミナルの入出力をロギング
※エビデンスとりたい時とかに使用

# その他の便利そうな機能
※私は利用してないですが、複数人使っている人を見たことがあったので紹介

### 画面分割
縦分割：⌘ + d, 横分割：⌘ + shift + d
※分割後パネル操作のバインドキーは以下から確認できる
> Window > Select Split Pane > 「各項目」
Window > Resize Split Pane > 「各項目」

### 自動プロファイル切り替え
ユーザー切替、リモート接続等実施時にプロファイル切り替えを自動でしてくれる
※ただし、shell integrationのインストールと設定が必要

---

# 設定
上記で紹介した機能の設定方法紹介
※設定画面の表示の仕方は以下
「⌘ + ,」 またはメニューバーから「iTerm2 > Preferences...」
他アプリと同手順ですが、一応

### ホットキー
>1.設定画面から「Profiles > Keys」を選択
2.左下付近にある「Show/hide iTerm2 with a system-wide hotkey」をチェック
3.「Hotkey」の項目にて、利用したいホットキーをクリック

※私の場合は「⌘ + 1」を設定

### キー割当
※個別設定と共通設定があります
##### 個別設定
>1.設定画面から「Profiles > Keys」を選択
2.左下付近にある「＋」をクリック（※「−」は除去）
3.「Keyboard Shortcut:」に割当するキーをクリック
4.「Action」から利用したい動作を選択

##### 共通設定
> 1.設定画面から「Keys」を選択
2.個別設定の「2」〜「４」と同手順で設定

#### Actionに関する補足
ターミナルのバインドキーとActionの設定方法を紹介
※私が割当を行っている機能のみ

| 機能     | ターミナル<br>バインドキー |Actionの設定方法 |
|:---------|:------------|:------------------------------------|
|単語移動（左）|Esc + b      |「Send Escape Sequence」を選択して「b」を入力|
|単語移動（右）|Esc + f      |「Send Escape Sequence」を選択して「f」を入力|
|単語削除(左)|ctrl + w     |「Send Hex Codes」を選択して「0x17」と入力|
|undo      |ctrl + _     |「Send Hex Codes」を選択して「0x1f」と入力|
※1.他のバインドキーに関して以下を参考
 bash:ターミナルにて「man bash」→「Readline Command Names」を確認
 zsh :ターミナルにて「bindkey」
※2.「Send Hex Codes」の入力値に関しては下記サイトを参考
https://ja.wikipedia.org/wiki/ASCII

### ウィンドウの透明化
>1.設定画面から「Profiles > Window」を選択
2.「Trancsparency」のスライダーをよしなに動かす

### 自動プロファイルの切替
>1.設定画面から「Profiles」を選択し、左の一覧から切替対象のProfileを選択
2.「Advanced」 を選択し、下の方にある 「Automatic Profile Switching」にて「＋」をクリック
3.切替条件を適当に入力

----

#その他機能
この記事作成時点に知って、今後使うかもしれないと思った機能紹介

### 貼り付け履歴一覧表示(Open Paste History)「⌘ + shift + h」
ターミナルに貼り付けした一覧を表示し、そこから上下キーで選択することで再貼付けができる

### クイックオープン(Open Quickly)「⌘ + shift + o」
「プロファイル切替」「ウィンドウ/タブ/パネル切替」「新規タブ」実行の選択ウィンドウを開く
※フィルタリングも可

### プレイバック(Start Instant Replay)「⌘ + alt + b」
ターミナルでの操作内容を再確認できる
Advanced Custom Fields の 'タクソノミー' を投稿画面でソートしたい

## 目的

カスタムタクソノミーを ACFの `タクソノミー` フィールドで表示したいが、表示順をIDの昇順に変更したい

## 解決策

下記の通りフィルターを用意する。テーマの `functions.php` でも、独自にプラグインを用意しても良い。

```php
function chatii_taxonomy_sort( $args, $field ) {
    $args['orderby'] = 'id';
    $args['order'] = 'ASC';

    return $args;
}

add_filter('acf/fields/taxonomy/wp_list_categories/name={{custom_field_name}}', 'chatii_taxonomy_sort', 10, 3);
```

({{custom_field_name}} は 用意したカスタムフィールドの `フィールド名`)

`$args` は、[wp_list_categories()](https://developer.wordpress.org/reference/functions/wp_list_categories/) の取る引数と同じなので、上書きしてやればソート順を変えられる

記事ではないので `ID` ではなく、`id`になる。下記ドキュメント参照。

## つまづきポイント

`タクソノミー` フィールドが `チェックボックス` または `ラジオボタン` の場合は、`acf/fields/taxonomy/wp_list_categories` を使うが、`セレクトボックス` または `複数選択` の場合は `acf/fields/taxonomy/query` を使う

## ドキュメント

* https://www.advancedcustomfields.com/resources/taxonomy/
* https://www.advancedcustomfields.com/resources/acffieldstaxonomyquery/
* https://www.advancedcustomfields.com/resources/acffieldstaxonomywp_list_categories/
バックアップの重要性


重要なデータは何らかの原因で予期せずに消失してしまったことはよくあります。データ損失を避けるために、重要なファイルやフォルダを定期的にバックアップしておいたほうがいいです。そして、専門の[バックアップソフト](https://jp.easeus.com/backup-software/free.html)を利用すると、より便利になります。

![data-backup-facts-and-statistics.png](https://qiita-image-store.s3.amazonaws.com/0/124905/ffb27638-697a-3d53-b00a-17d87c33b490.png)

<a href="https://jp.easeus.com" title="バックアップソフト">EaseUS</a>より</p>
Ansible 環境構築 For Mac


# Ansible2.0 環境構築
## Index
####1.インストール方法 ver.Mac
####2.インストール方法 ver.クライアント側
####  出力結果一覧

## 1.インストール方法
####1.既存のansibleを削除
```ruby
brew uninstall ansible --force
```
####2.pyenv-virtualenvインストール
・pyenv
　複数バージョンのPythonをインストールして切り替えられる
・pyenv-virtualenv
　同じバージョンのPythonで複数環境を切り替えできるpyenvのプラグイン
```ruby
brew install pyenv-virtualenv
pyenv versions
```
####3.Pythonインストール + Ansible2の環境作成
```ruby
xcode-select --install # Command Line Toolsインストロール
pyenv install 2.7.10   # pyenvにPython2.7.10環境を作成
pyenv versions         # ※1の出力になる
pyenv virtualenv 2.7.10 ansible2 # virtualenvで2.7.10を元にansible2を作成
pyenv versions         # ※2の出力になる
```
####4.グローバルPythonをansible2に切り替える
```ruby
pyenv global ansible2
pyenv versions  # ※3の出力になる
python --version => 2.7.10
```
####5.pipコマンドのためにパスを通す (zsh)
```ruby
echo eval "$(pyenv init -)" >> ~/.zshrc
source ~/.zshrc
```

####6.ansible2.xインストール
```python
pip install ansible
ansible --version => 2.x系
=> エラーが起きた場合の対処法 => エラー対処法1
```


※1,※2, ※3

```ruby
> ※1
system (set by /Users/hoge/.pyenv/version)
  2.7.10
  
>※2
* system (set by /Users/oge/.pyenv/version)
  2.7.10
  2.7.10/envs/ansible2
  ansible2
  
>※3
  system
  2.7.10
* ansible2 (set by /Users/hoge/.pyenv/version)
> ※4
>>エラー分

gmp がないと言われているので確認
# brew install gmp
=> すでにインストールされていると怒られる

```

#### エラー対処法
#####※1
エラー内容
>   src/_fastmath.c:36:11: fatal error: 'gmp.h' file not found
    # include <gmp.h>
              ^
    1 error generated.
    error: command 'clang' failed with exit status 1

gmpがないというエラーが出力される

```lasso
brew install gmp => alreadyだと怒られるので再インストール
brew uninstall gmp
brew install gmp   # 完了
```
Vision API quick start

[quickstart](https://cloud.google.com/vision/docs/quickstart)をやってみる。

前提として、Google Cloud Platformへの登録が必要。

### 手順
- projectの設定
    - GCPでprojectを作る
    - 課金モードに切り替える（＄300ドル分のポイントと、60日のフリートライアルがついてくる）
    - 作ったprojectにVision APIの設定をする
- Cloud Storageのbucketを作る
    - [Cloud Storageブラウザー]（https://console.cloud.google.com/storage/browser?_ga=1.35903840.1159771980.1469064625&project=vision-1379）にいく
    - Create bucketをしてbucketを作る（APIの設定をした時にprojectをつくったせいか、もうできていた。）
    - bucketの設定をする
    - Createをおす
- Cloud Vision APIにリクエストを投げる
    - [画像をダウンロードする](https://cloud.google.com/vision/docs/images/demo-image.jpg)
    - [Cloud Platform Console Storage Browser](https://console.cloud.google.com/storage/browser/?_ga=1.203701712.1159771980.1469064625)を開き、画像をbucketにアップロードする
    - 画像にPublic linkをつけるように、Share publiclyの項目でチェックボックスにチェックを入れる
    - quick startのページにあるフォームのgcsImageUriにアップロードした画像のuriをいれる
        - gcsImageUriは、　gs://BUCKET_NAME/FILEPATH になる
        - urlを入力するとerror 3が返ってくる
        
 

'''

{
 "responses": [
  {
   "labelAnnotations": [
    {
     "mid": "/m/068hy",
     "description": "pet",
     "score": 0.98414
    },
    {
     "mid": "/m/0bt9lr",
     "description": "dog",
     "score": 0.97904623
    },
    {
     "mid": "/m/04rky",
     "description": "mammal",
     "score": 0.96168429
    },
    {
     "mid": "/m/0jbk",
     "description": "animal",
     "score": 0.95276582
    },
    {
     "mid": "/m/09686",
     "description": "vertebrate",
     "score": 0.89599335
    }
   ]
  }
 ]
}
'''
Android Support Libraryのバージョン指定が面倒なのでproperty化する


Androidの開発では様々なライブラリを使用するが、とくにAndroid Support Libraryは数が多いためバージョンアップの時に書き換えるのが面倒である。

### gradle.propertiesにプロパティを追加

```

android_support_lib_version = 24.1.0

```

### build.gradleを修正

```
dependencies {

    compile "com.android.support:appcompat-v7:${android_support_lib_version}"
    compile "com.android.support:cardview-v7:${android_support_lib_version}"
    compile "com.android.support:recyclerview-v7:${android_support_lib_version}"

    compile 'com.jakewharton:butterknife:7.0.0'
}
```

もしgradle.propertiesに書くのはちょっと、、、、という方はローカル変数としてbuild.gradleに定義する

```
def android_support_lib_version = "24.1.0"

dependencies {

}
```

参考：
https://github.com/google/iosched
http://gradle.monochromeroad.com/docs/userguide/writing_build_scripts.html
rails default_scopeの使い所


[Railsのdefault_scopeは悪だ！(default_scope is evil) ということらしい](http://qiita.com/yusabana/items/f0b3a80111d6bd4ec8b0)
http://api.rubyonrails.org/classes/ActiveRecord/Scoping/Default/ClassMethods.html

rails default_scopeは悪と言われることがあって、自分もはまったことあるのでほぼ使わないようにしてた.
railsドキュメントのサンプルはあまりよくない例だと思う.
でも、元のテーブルに属性を指定するのではなく、以下のように参照専用/既存のデータを表すために使えばわかりやすいし、強力だと思う.

```ruby
class PublishedArticle < Article
  default_scope -> { where(status: :published) }
  has_many :comments
end
```

```ruby
class Last7Days < Article
  default_scope ->{
    where( created_at: 7.days.ago..Time.zone.now )
  }

  def days_remain_till_get_older
    return 0 if created_at < 7.days.ago
    ((created_at - 7.days.ago) / (60*60*24)).ceil
  end
end
```

ふつうのscope使ってできるケースもあるが、このようにクラスに切り出せたほうが有効な場面も多い.
STIにも似てるけど、typeカラムのようなものは不要なので自由度高く条件を設定できる.
CQRSの考えとも親和性が高いと思う.

modelがreadonlyであることを保証したい場合は以下が参考

http://stackoverflow.com/questions/5641410/is-there-an-easy-way-to-make-a-rails-activerecord-model-read-only
http://d.hatena.ne.jp/akishin999/20130718/1374100143
TreasureDataのデータリカバリを考える

不幸な事故により、td-agentでデータを二重に転送してしまった。自分が雑な対応したせいなんですが。

やってしまったものは仕方ないのでリカバリを考える。
treasuredataは指定の条件でレコードを削除ということはできず、１時間ごとのデータ削除である、[table:partial_delete](https://docs.treasuredata.com/articles/td-cli#td-tablepartialdelete)とかいうのがあるっぽいのでこれを使う。

### article_impressions テーブルフルバックアップ
```
td table:export prod_database article_impressions \
   --s3-bucket dump-bucket \
   --prefix article_impressions/20160721 \
   --aws-key-id $AWS_ACCESS_KEY \
   --aws-secret-key $AWS_SECRET_ACCESS_KEY \
   --file-format json.gz
```

### 指定期間レコードを重複除去して抽出
```
SELECT 
  DISTINCT pi.time,
  pi.application_id,
  pi.uuid,
  pi.media_id,
  pi.placement_id,
  pi.article_id,
  pi.url,
  pi.recommend_article_id,
  pi.priority,
  pi.manual_priority,
  pi.referer,
  pi.ua,
  pi.device,
  pi.lang,
  pi.remote_ip_address,
  pi.similarity,
  pi.manual_similarity,
  pi.default,
  pi.table_name,
  pi.__tag
FROM
  article_impressions pi
WHERE
  td_time_range(pi.time,
    '2016-07-16 00:00:00',
    '2016-07-20 17:00:00',
    'JST')
ORDER BY
  pi.time
```

### JST16日00時〜20日17時のデータを削除
```
td table:partial_delete uzo_production article_impressions \
  --from '2016-07-16 00:00:00 JST' \
  --to '2016-07-20 17:00:00 JST'
```

### 抽出データを再インポート
```
td import:auto \
  --format csv \
  --column-header \
  --time-column time \
  --auto-create uzo_production.article_impressions \
  /Users/tsuruta/77048484.csv
```


もうやらないように気をつけようと思いつつもばっちりメモ
MacBookをRDPクライアントとして利用するときの日本語入力切り替え

Windows使いの私がシンクライアント端末としてMacBookを選んだ際にRDP接続時のキーボードの違いに苦しんだので忘備録。

# シンクライアント端末としてMacBookを選んだ理由

* 高解像度
* 比較的軽い
* バッテリーの持ちが良い
* Mac上での開発も可能

キーボードの問題さえクリアできれば結構メリットが多いです。

# やりたいこと

* 通常時は外部モニタをつなげて外付けWindows向けJISキーボードを接続し、デスクトップマシンとして作業する
* 緊急時はMacBook上のキーボードで作業
* 上記2つのキーボードのキーバインドを出来るだけ揃える
* RDPでWindowsマシンに入って作業するときにワンキーで日本語入力のON/OFFを行う

![keyboard.gif](https://qiita-image-store.s3.amazonaws.com/0/38018/b28be8c2-d25c-0bc7-3b4d-bb24a67e528d.gif)


# 対象OS
  OS X 10.11.6

# [Step1] 外部接続したJISキーボードを利用可能にする
JISキーボードの無変換キーと変換キーを利用可能にします。
Mac上での日本語入力の切り替えがMacと同等になります。

下記のキーバインドとします。
* JIS[無変換]キー → Mac[英数]キー
* JIS[変換]キー → Mac[かな]キー

## Seilのインストール
https://pqrs.org/osx/karabiner/seil.html.ja

## Seilの設定
Seilを起動して、以下の項目にチェックを入れて下さい。
For Japanese
* Enable NFER Key on PC Keybord 
* Enable XFER Key on PC keybord

# [Step2]RDPでWindowsマシンに渡すキーイベントを変更する
RemoteDesktop使用時のみ、Mac[かな]キー を JISキーボードにおける[半角/全角漢字]キーに割り当てます。

この作業を行うことでRDP使用時のみ、
Mac[かな]キーで日本語入力のON/OFFが行えるようになります。
また、上記Seilとの合わせ技で
JIS[変換]キーはMac[かな]キーとして認識されているため、JIS[変換]キーでも日本語入力のON/OFFができるようになります。

## Karabinerのインストール
https://pqrs.org/osx/karabiner/index.html.ja

## Karabinerの設定
Karabinerを起動
![kaabiner_02.gif](https://qiita-image-store.s3.amazonaws.com/0/38018/c2312f7e-40dd-ea2a-3e70-38095025ad27.gif)


Misc & Uninstall -> Customer Setting
Open private.xmlをクリック

対象のXMLファイルを開いて、下記をそのままコピペして下さい。

``` private.xml
<?xml version="1.0"?>
<root>
    <appdef>
        <appname>MicrosoftRDC</appname>
        <equal>com.microsoft.rdc.mac</equal>
    </appdef>
    <symbol_map type="KeyCode" name="RDC_VK_BACKQUOTE" value="0x32"/>
    <item>
        <name>Microsoft Remote Desktop App v8.0.14以降 英数/かな</name>
        <identifier>private.Microsoft_rdc_Custom</identifier>
	<!-- Microsoft Remote Desktopのみを対象にする -->
        <only>MicrosoftRDC</only>
	<!-- [カタカナ]キーをBACKQUOTEキーに置き換え -->
        <autogen>__KeyToKey__ KeyCode::JIS_KANA, KeyCode::RDC_VK_BACKQUOTE</autogen>
    </item>
</root>
``` 
Change Key -> Reload XMLにて、設定したXMLファイルを読み込みます。

一番上の
[Microsoft Remote Desktop App v8.0.14以降 英数/かな]
にチェックを入れます。

# [Step3]Macキーボード上の[Caps]キーと[Control]キーを入れ替える
http://macfan.jp/guide/2014/02/12/caps_lockcontrol.html

これは好みに応じてですが、JISキーボードと併用する際に混乱しないようにするための設定です。
OpenGraphでURLをリッチに表示する

# kaelaela(Yuichi Maekawa)
Qiitaのプロフィール参照

@kaelaela
Cyberagent

LTなので簡潔に

---
# Open Graphとは
- [The Open Graph protocol](http://ogp.me)
- HTMLに決まったフォーマットで`meta`タグを追加する
- FacebookとかGoogle+とかでURLを貼るとリッチに表示される
- 基本は`og:title|iamge|type|url`の四つ
<img width="397" alt="スクリーンショット 2016-07-21 19.46.15.png" src="https://qiita-image-store.s3.amazonaws.com/0/26883/8517fcc1-8f9d-4778-e3e1-f4097958e482.png">


---

# OpenGraphに対応しているwebは多くない
- タグがないときもある（古いwebは大抵ない）
- あっても不完全
- `url`タグはほぼ入っていない&表示しているページのものでないことがほとんどなので危険
- Twitterは独自だがほぼ同じ

---

# Custom Viewで作ってみた
Custom viewの作り方は[公式](https://developer.android.com/training/custom-views/index.html)で

- [kaelaela/OpenGraphView](https://github.com/kaelaela/OpenGraphView)

---

# Androiderは依存関係にシビア

- method数65k上限の闇(黒魔法: multidex)
- わかるけど車輪の再発明はとにかく面倒
- ~~ライブラリに依存しているライブラリはクソ~~
- ライブラリのパーツを作るのがこれからのライブラリ作りかもしれない
- Androiderは`build.gradle`を毎日磨いている

---

# HTMLのパース
- ~~jsoupでウェイ~~ 依存関係に入れずに自作
- 涙ぐましい文字列処理: [OGParser](https://github.com/kaelaela/OpenGraphView/blob/master/library/src/main/java/me/kaelaela/opengraphview/OGParser.java)
- `meta`タグのみなのでスピードはそんなに悪くない

---

# 通信処理
- ~~Retorofitでウェイ~~ 依存関係に入れずに自作
- 現在はAsyncTask...
- 師(wasabeefさん)曰く、

> executorでthread数も原始的に管理してほしい

御意(次回やります)

---

# 画像のCache
- 今日実装した
- LRUでbitmapを管理
- RecyclerViewで実験して大丈夫そう
- zissouha公式: [Caching Bitmaps](https://developer.android.com/training/displaying-bitmaps/cache-bitmap.html)

---

# これからのライブラリ開発
- 小さなパーツを用意していくのがよい？
 - HTMLパーサー
 - もっと小さな通信ライブラリ
 - キャッシュ

などなど

---

# 会場の方と話したいこと

- キャッシュならDiskかMemory?（何基準？）
- HTMLのイケてるパース処理方法
- リクエストのキュー管理に関する知見
- CustomViewに関するtipsなんでも

---

# まとめ
- OpenGraph表示に対応したら華やぐ
- Androidは依存関係にシビア
- OpenGraphView使ってみてください

---

# thx ;-)
tmuxをCentOSへ手動ビルド

# Intro

共用CentOSサーバでは`yum install -y tmux`という便利コマンドが使えません。
しかし、長時間の計算を回すにはtmuxが無いといろいろ不都合が生じます。tmuxがあれば、ssh接続を中断しても計算が継続されるので計算系にとっては必須です。

そこで今回は, ソースコードからtmuxを直にビルドしていきます。
`~/local/bin`というフォルダを自分のアカウントに作ります。
`~`は念のため書くとホームディレクトリで、/home/sshojiro/みたいな前です。`cd & pwd`と打つと出てくるフルパスの指す場所です。

admin権限がないユーザーでビルドすることを前提に書いていきます。すなわち、sudoは出てきません。

# Output

この記事の最後には下記のフォルダができています。
`/home/sshojiro`としてあるのは適宜ホームディレクトリとして置き換えてください。

| location | description |
|:--------:|:-----------:|
| `/home/sshojiro/local/bin`    | libevent, ncurses, tmuxの<br/>インストール先 |
| `/home/sshojiro/src`    | libevent, ncurses, tmuxのソースを<br/>落として展開する場所 |

# Required

tmuxはlibevent, ncursesに依存しているので、3つとも最新のコードを使います。
インストールは
1. [libevent](http://libevent.org/)
2. [ncurses](https://ftp.gnu.org/pub/gnu/ncurses/)
3. [tmux](https://tmux.github.io/)
の順番でやります。

# Procedure

順次下記のコードを実行して行くと、最後にtmuxのインストールが完了して起動可能になります。

## 作業ディレクトリを作る
```shell-session
cd # at /home/sshojiro
mkdir src # mkdir /home/sshojiro/src
cd src # at /home/sshojiro/src
```

## libevent, ncursesのソースコードを落として解凍
```shell-session
# libevent, ncursesのソースコードを/home/sshojiro/srcへ落としておく
tar xvf libevent-2.0.22-stable.tar.gz
tar xvf ncurses-6.0.tar.gz
cd libevent-2.0.22-stable # at /home/sshojiro/src/libevent-2.0.22-stable
mkdir /home/sshojiro/local
mkdir /home/sshojiro/local/bin # インストール先フォルダを作成
```

## libeventのインストール
```shell-session
# インストール先を/home/sshojiro/local/binに指定してconfigureする
./configure  --prefix=/home/sshojiro/local/bin # at /home/sshojiro/src/libevent-2.0.22-stable
make
make install # libeventをビルド
```

## ncursesのインストール
```shell-session
cd ../ # at /home/sshojiro/src
cd ncurses-6.0
./configure  --prefix=/home/sshojiro/local/bin # 同様にして/home/sshojiro/local/binをインストール先に指定してconfigure
make
make install
cd ../ # at /home/sshojiro/src/
```

## tmux のインストール
```shell-session
git clone https://github.com/tmux/tmux.git
cd tmux/
sh autogen.sh # configure.ac から configureファイルを作成, configureできるようになる
PKG_CONFIG_PATH=/home/sshojiro/local/bin/lib/pkgconfig/ ./configure  --prefix=/home/sshojiro/local/bin
make
make install
cd
tmux # start tmux!!
```

# Contact

不明点等あればご連絡ください。

# Reference

[tmuxをローカルインストールする時のメモ - Qiita](http://qiita.com/makisyu/items/d6b32d88cdd97b01a00f)
SwiftのCGRectMakeとCGPointMakeを新しい書き方に修正するスクリプト

`swiftlint autocorrect`で自動修正してくれなかったので、rubyで自作しました。

以下の変換を行います。

- CGRectMake → CGRect
- CGPointMake → CGPoint

```ruby
#! /usr/bin/ruby
#
# # usage
#
#   chmod +x replace.rb
#   ./replace.rb ./hoge.swift > out.swift
#
file_path = File.absolute_path(ARGV[0].to_s)
unless File.exists? file_path
  abort "ファイルが存在しません. file_path = #{file_path}"
end

f = File.open(file_path, "r")
out = []
f.each_line do |line|
  line = line.gsub(/CGRectMake\((.+?), (.+?), (.+?), (.+?)\)/ , 'CGRect(x: \1, y: \2, width: \3, height: \4)')
  line = line.gsub(/CGPointMake\((.+?), (.+?)\)/, 'CGPoint(x: \1, y: \2)')
  out << line
end
print out.join()
```

# 追記
コメントで指摘を頂きましたが、以下のようなコードに対して実行すると壊れるので注意してください。

```swift
CGRectMake(someFunctionToGetX(hoge, fuga), anotherFunction(hoge, fuga), 100, 100)
```
簡単な正規表現が原因で Stack Overflow がダウン

# 経緯
1. 昨晩 [Stack Overflow](http://stackoverflow.com/) が[ダウン](http://stackstatus.net/post/147710624694/outage-postmortem-july-20-2016)してたらしい ([/r/programming](https://www.reddit.com/r/programming/comments/4tt6ce/stack_exchange_was_down_because_of_an_innocent/))
2. 問題は正規表現 ```^[\s\u200c]+|[\s\u200c]+$```
    1. これは行頭と行末の空白（ Unicode 空白を含む）を除去する処理
    2. ```\s+$``` でも同じ障害に至る
3. 原因となったのは DOS 攻撃ではなく[普通の投稿](http://stackoverflow.com/questions/38484433/in-corona-sdk-how-to-join-tiles-into-one-word-using-matrix-game-breakout)
    1. [もう削除されてるけど](http://stackoverflow.com/posts/38484433/revisions) 連続した空白を 2 万個含んでいた
4. backtraking 型の正規表現エンジンで、連続した空白の後に空白でない文字があった場合
    1. 最初の空白を見つけたら、その後の文字列を 1 個ずつチェックしていき
    2. 空白でない文字を見つけたら最初に戻って次の空白から同じように 1 個ずつチェックしていくため
    3. 空白が 2 万個続いていたら 20,000+19,999+19,998+… = 199,990,000 回チェックすることになる
5. Stack Overflow ではトップページでヘルスチェックをしているが
    1. 原因の投稿がトップページに載った時、上の動作で応答に時間がかかって
    2. 全サーバーに障害があると判定されてしまい、ロードバランサーから外されてしまったためサイトがダウン

# 所感
10年位前、同僚が簡単な正規表現を使ってるところをレビューしてて
1. 僕「ここ trim 使った方が良い」
2. 彼「でも正規表現でも良いじゃん」
3. 僕「いやいや、処理コストが全然違うじゃん」
4. 彼「可読性が重要で処理コストはトレードオフして良い（ほどハードが進化してる）、っていつも言ってるじゃん」
5. 僕「trim の方が可読性も良いと思うんだけど」
6. 彼「それは主観の問題で周辺で正規表現がいくつも使われてるから、ここも正規表現で」
7. （僕の直感は trim にするべきと言ってるが...説明するの大変そう...）
という会話があり、彼もベテランだったのでその時は深く追求しなかったが、その長年の引っかかりに反論できそうな事例。
git stash 履歴からの復元

作業中に別のブランチを見る必要があって、今の変更内容を退避してブランチ移動することがたまにありました。

```
$ git stash
$ git checkout
```

という感じですが、色々テンパると`git stash pop`でstashを取り出したまま、別のブランチみるために`git checkout`してしまい、「作業内容が消えてしまった。。」みたいなことが何回かありました。

とりあえず、そういう時は途中でもコミットしておいて、あとで`git rebase -i`でコミットまとめるのが安全なのかもしれませんが、ついやってしまいます。

そんな時に、いつか行ったstashの状態を復元できればまだマシなので、その手順をメモって起きます。

```
$ git fsck | awk '/dangling commit/ {print $3}'
$ git show --summary 候補のsha1
$ git cherry-pick -n -m1 取り込みたい履歴のsha1
```
ドローンをnode.jsで飛ばしてみた

#環境
ドローンの種類
http://www.parrot.com/products/minidrones/airborne-night-drone/swat/

Parrot社　AIRBORNE NIGHT DRONE「swat」
swatって呼んでいきましょう

まず、ドローン購入までに開発に関して調査しました
そこでやはりといったところか、Parrot社のドローンがオープンソースでSDKも公開しているとのこと
その中でも値段や大きさなどなど考慮して「swat」にしてみました
後述するが、同じMiniDroneシリーズの「Rolling-spider」と同じSDKでも動くらしい
基本スペック
・3軸ジャイロ
・3軸加速度計
・対地速度計測用の垂直カメラ
・超音波センサー
・圧力センサー
・静止画は640x480ピクセル

#まずは提供されているアプリで飛ばそう
まずはドローン自体のフォームウェアのアップデートが必要らしい。

http://www.parrot.com/jp/support/parrot-airborne-night-drone/
このURL先にも（英語で）書いてあるが、簡単に訳しながら
1.バッテリーをドローンに入れて目が緑になるまで待つ（onボタンを押す（？））
onボタンの場所は次の項の参考URL先にスクリーンショットがあります
2.USBケーブルでドローンとPCを繋げる（ここでUSBメモリみたいにドローン内のフォルダとかが見れる）
3.ソフトウェアアップデートから「ダウンロードする」ボタンをクリックしてファイルをダウンロードする
4.ダウンロードしたファイルをドローン内のメモリの一番上にドラックアンドドロップ、フォルダには入れない
5.USBメモリと同じようにしっかりとドローンを安全に取り出しをし、USBから外す
6.目が緑色になったらオッケー、1分程かな

後はお手持ちのスマフォやタブレットに無料アプリ「FreeFlight 3」を入れてGO!!
（ちょっとした注意点）
・Bluetooth4.0対応機種のスマフォで行う
・スマフォでBluetoothをonにしてからアプリを立ち上げる
・電源ボタンわかりずらいので気をつけて

アップデートや飛ばした例のサイト
http://piyajk.com/status/2915
https://mag.kakaku.com/hobby/?id=3489
http://tobalog.com/2015/12/airborne-night/

#node.jsから制御
公式のスマフォアプリからではなく、PCから制御したい！
http://liginc.co.jp/187633
参考サイト通りで成功したのでそこから簡単に
1.node.jsインストール
2.node.jsのモジュール、nobleとrolling-spiderインストール
サンプル通りならばkeypressもインストール
3.サンプルを2件コピー
4.Droneを探すプログラムで、UUID取得
5.Droneを飛ばすプログラムで、飛ばす

参考サイト先では、詳細なコマンドや見やすいスクリーンショット、活用例やおすすめエディタまで載っています

#発展とその事例
このrolling-spiderモジュールを利用してScratchでコントロールした例
こちらも裏ではnode.jsを利用しているようです
http://blog.champierre.com/1061
ASP.NET MVC 共有する部分ビューにもローカルリソースを使いたい

# ASP.NET MVC 共有する部分ビューにもローカルリソースを使いたい

ASP.NET MVC プロジェクトの多言語化の下ごしらえのために、「しばやん」さんの記事を参考にさせていただきました。

[しばやん雑記 ASP.NET MVC 3 の Razor でも多言語対応を試してみる](http://blog.shibayan.jp/entry/20110121/1295543963)

ただ、プロジェクトには複数のビューで共有する部分ビュー `~/Views/Shared/_Navigation.cshtml` などがあり、それらに与えたローカルリソース `~/Views/Shared/App_LocalResources/_Navigation.cshtml.resx` を読み込むことができませんでした。

部分ビューは、その名のとおり、親ビューの一部分になるので、`GetVirtualPath` は親ビューのパスを返すことが要因のようです。そりゃそうだ。

少し手を加えました、変更点は 2つです。

- Resource メソッドに virtualPath を指定できるようにした。
- ResourceRaw メソッドを追加。 `ActionLink` などのヘルパに渡す文字列もリソースにしたかったのが理由です。


```csharp
    public static class LocalizationHelper
    {
        // 1. virtualPath を指定できるように
        public static MvcHtmlString Resource(this HtmlHelper helper, string expression, string virtualPath = null, params object[] args)
        {
            return MvcHtmlString.Create(ResourceRaw(helper, expression, virtualPath, args));
        }

        // 2. string も返せるように
        public static string ResourceRaw(this HtmlHelper helper, string expression, string virtualPath = null, params object[] args)
        {
            if (virtualPath == null)
            {
                virtualPath = GetVirtualPath(helper);
            }

            return GetResourceString(helper.ViewContext.HttpContext, expression, virtualPath, args);
        }

        public static string Resource(this Controller controller, string expression, params object[] args)
        {
            return GetResourceString(controller.HttpContext, expression, "~/", args);
        }

        private static string GetResourceString(HttpContextBase httpContext, string expression, string virtualPath, object[] args)
        {
            var context = new ExpressionBuilderContext(virtualPath);
            var builder = new ResourceExpressionBuilder();
            var fields = (ResourceExpressionFields)builder.ParseExpression(expression, typeof(string), context);

            if (!string.IsNullOrEmpty(fields.ClassKey))
            {
                return string.Format((string)httpContext.GetGlobalResourceObject(fields.ClassKey, fields.ResourceKey, CultureInfo.CurrentUICulture), args);
            }

            return string.Format((string)httpContext.GetLocalResourceObject(virtualPath, fields.ResourceKey, CultureInfo.CurrentUICulture), args);
        }

        private static string GetVirtualPath(HtmlHelper helper)
        {
            // WebFormView 決め打ちではなくて基底クラスにキャストするように変更
            var view = helper.ViewContext.View as BuildManagerCompiledView;

            if (view != null)
            {
                return view.ViewPath;
            }

            return null;
        }
    }
```

呼び出し側はこんな感じでしょうか。

```csharp
// ~/Views/Shared/App_LocalResources/_Navigation.cshtml.resx に定義したキー MyTitle を読み出す
@Html.Resource("MyTitle", "~/Views/Shared/_Navigation.cshtml")
```

呼び出し側からみると `virtualPath`が目立ちすぎて少し不細工ですね。
やりようがあるのかもしれませんが、本日はここまで。

最後になりましたが、しばやんさんのソース、リンクのおかげで助かりました、ありがとうございます。
オンラインで正規表現をテスト

https://regex101.com/ で pcre, javascrypt, python の正規表現をテストできる

![Screen Shot 2016-07-21 at 10.03.10.png](https://qiita-image-store.s3.amazonaws.com/0/131106/ee5c025f-a81d-5430-76a2-e129030cbe0a.png)

1. 正規表現を入力すると右上でその意味を詳細に説明してくれる
2. テスト文字列を入力すると
    1. 上でマッチしたかどうか
    2. 右中で括弧で抽出された部分文字列を教えてくれる
3. pcre と python バージョンは regex debugger 機能があり、どのようなステップでマッチしたか教えてくれる
  ![Screen Shot 2016-07-21 at 10.38.38.png](https://qiita-image-store.s3.amazonaws.com/0/131106/eee507bc-c9cb-80ed-be56-67fe651e66c3.png)
4. javascript バージョンは Unicode 指定を正しく認識してくれた
    1. pcre は ```\u``` 指定を受け付けてくれない (Error)
        1. ただ ```\u200c``` を全角空白を置換したらマッチした
    2. python は \u200c 指定を受け付けてくれるが、マッチしない 
        1. こちらも ```\u200c``` を全角空白を置換したらマッチした
Creative Cloud /  CS6 アプリケーションのインストール方法（Creative Cloud）

内容 （What's Covered）
Adobe Creative Cloud を契約している場合は、CS6 も引き続き利用することができます。製品の最新バージョンがインストールされていても、同一のコンピューターにCS6 などの旧バージョンもインストールすることが可能です。

この文書では、CS6 アプリケーションのインストール方法を説明しています。


https://helpx.adobe.com/jp/creative-cloud/kb/install-cc-older-version-jp.html
BetterTouchToolを使って、FinderのCurrentをターミナルで開く


XtraFinderが使えなくなって久しく。
Finderで探しものしていて、そのフォルダ（ディレクトリ）をターミナル（Terminal.app）で開く時のショートカットが重宝していたんですが、El Capitanになってからファイラーが全滅したのでどうしたものかと。

そこでシステムのショートカット割当て機能を使って、
**「フォルダに新規ターミナルタブ」**という、わかりづらい名称の機能にキーボードショートカットを割り当てて使っていたんですが、

選択されているフォルダを対象にターミナルに開くことしかできないのでちょっと不便でした。

![Kobito.IRbqB1.png](https://qiita-image-store.s3.amazonaws.com/0/10268/c1171bee-41b6-8532-b615-592e936dfd5a.png "Kobito.IRbqB1.png")


いまいるフォルダをターミナルで開きたいと思ったら、一度上の階層にあがって、対象フォルダを選択のうえ、ショートカットを押して起動。

XtraFinder使っていた時にくらべて、地味にこれが手間でした。


BetterTouchToolでできないか、アクションの一覧を眺めていたら
**「Open Current Finder Selection With Specific App」**
というのがあるのを知った次第。


![Kobito.SU369i.png](https://qiita-image-store.s3.amazonaws.com/0/10268/a492f8ca-9baa-cc29-7bba-5feaab2d06ef.png "Kobito.SU369i.png")


これが実に便利で、Finderのみのアクションとして **「1 Finger Tap Top Right」**でトラックパッドの右上に割り当てて、ストレス無く起動することで重宝します。
※キーボードショートカットに割り当てても無論便利ですね

カレントのフォルダで何もファイルを選択してない状態でタップ。
※ファイルを選択しているとうまくいきません。
もしくは開きたいフォルダを選択でタップで、そのフォルダのパスがカレントになって起動します。