OmniAICreator/Qiita-1.07M huggingface dataset:
Qiita記事でins/delタグを使った時の装飾

記事投稿後に内容を編集したときのために ```<ins>``` ```<del>``` タグがあります。
特にCSS等で装飾を指定していなければ、```<ins>```は下線、```<del>```は訂正線が修飾されます。
qiita記事の投稿後に追記や削除をし、これらのタグを使うとどうなるか検証してみました。

---

```html
<ins>
[追記 2014/07/26]
  色々と追加してみました。許してね。
  てへぺろ :stuck_out_tongue_winking_eye: 
</ins>

<ins datetime="2014/07/26T00:00+09:00">時間を記述した追記</ins>
文字を書いてみる
<ins cite="http://qiita.com">説明URLを記述した追記</ins>

文字列の途中に<ins>挿入</ins>文字列の途中に
```

<ins>
[追記 2014/07/26]
  色々と追加してみました。許してね。
  てへぺろ :stuck_out_tongue_winking_eye: 
</ins>

<ins datetime="2014/07/26T00:00+09:00">時間を記述した追記</ins>
文字を書いてみる
<ins cite="http://qiita.com">説明URLを記述した追記</ins>

文字列の途中に<ins>挿入</ins>文字列の途中に

---

```html
<del>
この情報は間違っている！！
   駆逐してやる！！ :rage: 
</del>

<del datetime="2014/07/26">時間を記述した削除</del>
mozi
<del cite="http://qiita.com">説明URLを記述した削除</del>

文字列の途中に<del>削除</del>文字列の途中に
```

<del>
この情報は間違っている！！
   駆逐してやる！！ :rage: 
</del>

<del datetime="2014/07/26">時間を記述した削除</del>
mozi
<del cite="http://qiita.com">説明URLを記述した削除</del>

文字列の途中に<del>削除</del>文字列の途中に
jQueryでチェックボックスを操作する

![スクリーンショット 2014-07-26 11.15.40.png](https://qiita-image-store.s3.amazonaws.com/0/8407/039074a8-c19d-2e74-d7af-30f90f662df3.png)


jQueryでチェックボックスを操作するには".attr"と"prop"を使う方法があります。

```js
$(要素).attr("checked", true);
$(要素).prop("checked", true);
```

".attr"を使う方法だと二回目以降に動作しない現象が発生します。".prop"を使う方法だと正常に動作するのでjQueryでチェックボックスを操作するときはこちらを使うようにした方がいいみたいです。

###サンプルコード
```
<apex:page >
  <apex:includeScript value="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" />
  <style>
    #chk div {
      margin: 5px 0;
    }
  </style>
  <div id="chk">
    <div>
      <input type="checkbox" id="inputCheck" onchange="return changeChecked(this);" />
      <label for="inputCheck">Check!!</label>
    </div>
    <div style="margin-top: 15px;" />
    <div>
      <input type="checkbox" id="outputAttrChecked" />
      <label for="outputAttrChecked">Attr</label>
    </div>
    <div>
      <input type="checkbox" id="outputPropChecked" />
      <label for="outputPropChecked">Prop</label>
    </div>
  </div>
  <script>
    var $j =jQuery.noConflict();
    function changeChecked(chk) {
      $j('#outputAttrChecked').attr("checked", chk.checked);
      $j('#outputPropChecked').prop("checked", chk.checked);
      return false;
    }
  </script>
</apex:page>
```
git で今週やったこと振り返る_φ(・・*) +バックログ



「今週なにやったけ？」と思うときに自分がコミットしたもののみ且つ、期間を絞ってlogを見たいときに便利。



```
% git log --author=username --since=2014-07-022 --until=2014-07-25 --oneline
```
↓

[+++追記]

```
% git week (＋TextExpanderのショートカットで今週期間指定)
```
で打ち込めばいいように設定したのと、取り込んでいないブランチの分のコミットも見れるように修正

そのために、下記設定

###.git/config 

```
[alias]
	week = log --graph --author=username --oneline --pretty=format:\"[%ad] %h: %s\" --all
	
```

###TextExpander

```Content
--since=%@-6D%Y-%m-%d --until=%@+0%Y-%m-%d
```

```Abbreviation
gitkonsyuu
```

→ `--since=2014-10-19 --until=2014-10-25`



￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
[+追記]

ちなみに、gitじゃないけど、
バックログとか使っている場合でバックログ振り返りたいとき

csvや検索機能が自分には使いづらかったので
地味だけど下記方法

バックログ`〜.jp/user/username`＞`最近の活動`の今週分を選択してコピー
▼
ExcelにHTML情報含んだまま貼り付け
▼
Excelメニューバー＞`データ`＞`フィルターオプションの設定`＞`重複するコードは無視する`

でしぼる

[++追記]
ガントチャートのExcelエクスポートがかなりキレイにでてくれるのを最近知ったのでメモ
〜.jp/user/username#usergantt
自分のだけのガンチャートをエクスポートして見たいときに便利☆
[Ruby]pdf-readerでPDFからテキスト抽出


RubyでPDFのテキスト抽出メモ。pdf-readerが便利でした。
https://github.com/yob/pdf-reader

### install

```
gem install pdf-reader
```


### テキスト抽出


```
reader = PDF::Reader.new("sample.pdf")

reader.pages.each do |page|
  puts page.text
end
```

### ページ数やメタデータも取れる

```
puts reader.pdf_version
puts reader.info
puts reader.metadata
puts reader.page_count
```

カンタン！
[vagrant 1.5] Vagrant 上の CentOS 6.5 から Heroku を使うには。

# 前置き

MacBook Pro(Mavericks) に Vagrant で CentOS 6.5 の環境を作ります。
そこに Rails 環境を作りました。
で、それらを Heroku に上げたい状況です。

# heroku-toolbeltのインストール

[Ubuntuだと簡単にできます](https://toolbelt.heroku.com/)が、CentOSだと一手間かかります。

証明書を無視する形で、[Standaloneのソース](https://toolbelt.heroku.com/standalone)を持ってきます。

```shell-session
wget -qO- https://toolbelt.heroku.com/install.sh | sh
```

パスを通します。

```shell-session
$ echo 'PATH="/usr/local/heroku/bin:$PATH"' >> ~/.zshrc
$ source ~/.zshrc
```

私の場合はこれでうまくいきました。

# 確認

```shell-session
$ heroku version
----

heroku-toolbelt/3.9.6 (x86_64-linux) ruby/2.1.1
```

ここまできたら、

```shell-session
$ heroku login
$ heroku create
````
などherokuコマンドが動きます。

ただ、うまくいかない場合もある様です。

# Rails環境の場合の対応

```vim
$ vim Gemfile
----

source 'https://rubygems.org'
gem "heroku-api", "0.3.18" #追記
```

```shell-session
$ bundle install
```

こうすると上手くいくこともある様です。

# 参考
https://toolbelt.heroku.com/
http://m-namiki.hatenablog.jp/entry/2014/03/27/220000
rake test:prepare

`$ bundle exec rake db:migrate`
`$ bundle exec rake test:prepare`

rake aborted!
Don't know how to build task 'test:prepare'
/Users/takako/.rvm/gems/ruby-2.0.0-p481@railstutorial_rails_4_0/bin/ruby_executable_hooks:15:in `eval'
/Users/takako/.rvm/gems/ruby-2.0.0-p481@railstutorial_rails_4_0/bin/ruby_executable_hooks:15:in `<main>'
(See full trace by running task with --trace)


'test:prepare'がないみたい

そこで、テスト用のDBを作る
`$ rake db:create db:migrate RAILS_ENV=test`

db/test.sqlite3 already exists
== 20140725021324 CreateUsers: migrating ======================================
-- create_table(:users)
   -> 0.0022s
== 20140725021324 CreateUsers: migrated (0.0024s) =============================

 すでにある？泣


`$ bundle exec rake db:migrate`
`$ bundle exec rake test:prepare`

rake aborted!
Don't know how to build task 'test:prepare'

`$ bundle exec rake db:create:all`

db/development.sqlite3 already exists
db/test.sqlite3 already exists

ううん。。

`$ bundle exec rspec spec/models/user_spec.rb`

No DRb server is running. Running in local process instead ...
....

Finished in 0.05868 seconds
4 examples, 0 failures

Randomized with seed 54796

Run options: --seed 29489

# Running:



Finished in 0.003481s, 0.0000 runs/s, 0.0000 assertions/s.

0 runs, 0 assertions, 0 failures, 0 errors, 0 skips

動いた！？
保留
[ssh, git] git や ssh で Bad owner or permissions とエラーが出たら。

# エラー
git を使ってこんなエラーが出ました。

```shell-session
$ git push heroku master
----

Bad owner or permissions on /home/hoge/.ssh/config
fatal: The remote end hung up unexpectedly
```

# 対応

とりあえず、ls -la とかして、パーミッションと所有者を確認してみます。
でも大抵の場合は以下で解決しそうです。

```shell-session
$ chmod 600 ~/.ssh/config
```
[Rails 4.x] Postgres を Rails に入れようと、 gem install pg をしようとしたら、 No pg_config とかエラーが出た場合

# エラー

PostgreSQLの Config ファイルがないよっていうエラーの様。
なので、configファイルの場所を指定して上げる方法もある。

```shell-session
$ gem install pg --with-pg-config=/usr/pgsql-9.3/bin/pg_config
```

でも、そもそもConfigファイルがない場合があるので、その場合の対応が以下になるようです。

# 対応

## CentOS
```shell-session
$ sudo yum -y install postgresql-devel
```

## Ubuntu
```shell-session
$ sudo aptitude install libpq-dev
```

## Mac OSX
```shell-session
$ brew install postgresql
```

## Configファイル

/usr/local/Cellar/postgresql/9.3.2/bin/pg_config あたりにpg_configが生まれる。


# 参考

http://qiita.com/youcune/items/5b783f7fde45d0fd4b35
Epochでリアルタイムなグラフを描画してみた

# はじめに

ちょっと前にその存在を知り、密かにGo実装化を進めている外貨預金の管理システムの
為替レートのグラフの描画に適用できないかと企んでいた。

# Epochとは

D3.jsをベースにしたSVGベースのグラフ描画ライブラリっぽい。
リアルタイム性を売りにしていると以前目にした記憶あり。

# サイトの説明を鵜呑みにするな

動かない。

jsdo.itで動くサンプルを置いた。

<script type="text/javascript" src="http://jsdo.it/blogparts/quKF/js?width=465&height=496&view=play"></script>

## 動かす鍵

pushするJSONは[{time:タイムスタンプ（秒）,y:値}]という形式で
与えるよ良い模様。

### TimeStampの指定

公式ページのソース（data.js）には

```
((new Date()).getTime()/1000)|0
```

と記述していたので、これも真似しておいた。

# Link

- [Epoch](https://epochjs.github.io/epoch/)
- [D3.jsをベースにしたリアルタイムで変化するグラフに強いEpochを動かした](http://jsdo.it/kjunichi/quKF)


# 関連投稿

- [Codepenが埋めこめると聞いたので例の統計力学の問題を貼り付けてみる - Qiita](https://qiita.com/kjunichi/items/e157b5d047de392bc75b)

# 関連記事

- [Canvasに描画するとWebMに変換してくれるjsライブラリ](//abrakatabura.hatenablog.com/entry/2012/09/03/071334)
- [陰関数の仮想3D空間へのプロットあるいは、ラズパイ版マインクラフト(mcpi)にたけのこの里を出す](//abrakatabura.hatenablog.com/entry/2018/04/21/080947)
遅まきながらAmazon CloudWatch Logsを試してみた



CloudWatch Logsとは：

* [Amazon Web Services ブログ: 【AWS発表】Amazon CloudWatchによるOSやログファイルの蓄積とモニタリング機能の提供](http://aws.typepad.com/aws_japan/2014/07/cloudwatch-log-service.html)



# 結論
まだ早い

想定できるログ利用シーンを満たしてないです。
想定できるログ利用シーン

1. ログ内容によるアラート(古くはswatchが使われていた分野)
1. エラー原因の追求
1. データをまとめて分析

現在CloudWatch Logsはこのうち1のみカバーできている状態で、他に関してはまだできません。特に検索ができないのが痛い。ただ、値段は競合に比べてはるかに安いですし、Retention Periodを選べるということは、今後は検索機能を入れる予定はあると見ても良いかと思います。今後に期待しておきたいと思います。
個人的には、企業での利用が必須っぽいですが、SumoLogicが現状圧勝かと。
みんなー、VB.Net でも Extensions でけたよー

* [[C#]ちょっとしたストレスを解消してくれるExtensions](http://qiita.com/shinoyu/items/7dec4bbd0282ae6755e6)

VB.Net でもやりてー！ということでググってみると、できるみたい。

* [拡張メソッド (Visual Basic)](http://msdn.microsoft.com/ja-jp/library/bb384936(v=vs.100).aspx)

書いてみた

```vbnet
Imports System.Runtime.CompilerServices

Public Module StringExntensions
    <Extension()>
    Public Function IsNullOrEmpty(ByVal this As String) As Boolean
        Return String.IsNullOrEmpty(this)
    End Function

    <Extension()>
    Public Function IsNullOrWhiteSpace(ByVal this As String) As Boolean
        Return String.IsNullOrWhiteSpace(this)
    End Function

    <Extension()>
    Public Function Format(ByVal this As String, ByVal ParamArray args() As Object) As String
        Return String.Format(this, args)
    End Function
End Module
```

```vbnet
Module Module1
    Sub Main()
        Console.WriteLine("Test1=" & "".IsNullOrEmpty())
        Console.WriteLine("Test2=" & "".IsNullOrWhiteSpace())
        Console.WriteLine("{0} & {1}".Format(2, 3))
        Console.ReadLine()
    End Sub
End Module
```

```
Test1=True
Test2=True
2 & 3
```

やればできるんだよ、あきらめるなよ、もっと熱くなれよ！
Furlでダウンロードのレジュームをしてみる

巨大ファイルのダウンロードに失敗したとき、また最初からは
大変なのでレジューム（継続ダウンロード）してみる。

```pl:resume.pl

use 5.10.1;
use strict;
use warnings;
use Furl;
use File::Basename;
use YAML;

my $url  = "http://ftp.riken.jp/Linux/centos/7/os/x86_64/Packages/kernel-debug-3.10.0-123.el7.x86_64.rpm";
my $file = basename $url;

request_download($url, $file);

sub request_download
{
  my ($url, $file) = @_;

  // content_length取得
  my $head_f = Furl->new( timeout => 30 );
  my $head_res = $head_f->head($url);
  unless ($head_res->is_success) {
    warn $head_res->status_line;
    return;
  }
  my $total_size = $head_res->content_length;

  // ダウンロード済サイズ取得
  my $size = 0;
  if (-f $file) {
    $size = (stat $file)[7];
    if  ($total_size == $size) {
      return;
    }
  }
  say "Range :bytes=$size-$total_size";

  // Range headerを付けてダウンロード
  open my $wfh, ">>:raw", $file or die $!;
  my %special_headers = ('content-length' => undef);
  my $get_f = Furl->new( timeout => 3600 );
  my $get_res = $get_f->request(
    method => 'GET',
    url    => $url,
    special_headers => \%special_headers,
          headers => [ 'Range' => "bytes=$size-$total_size" ],
    write_code => sub {
      my($status, $message, $headers, $chunk) = @_;
      print $wfh $chunk;
      my $size = tell $wfh;
      if(my $total = $special_headers{'content-length'}) {
        my $percent = $size*100/$total;
  #      printf "%d/%d %d\n", $size, $total, $percent if $percent % 10 == 0;
      }
    }
  );

  close $wfh;
  my $s = $get_res->status_line;
  print "$s\n";
  print "end!\n";
}

___END___
// Ctrl+Cで途中で止める
$ perl resume.pl
Range :bytes=0-31787876
^C
// 再度実行（継続する）
$ perl resume.pl
Range :bytes=11744096-31787876
206 Partial Content
end!
// 正常か確認
$ wget http://ftp.riken.jp/Linux/centos/7/os/x86_64/Packages/kernel-debug-3.10.0-123.el7.x86_64.rpm -O org.rpm
// MD5一緒なのでOK!
$ md5sum *.rpm
ed73c5f412285b562199fc021f7aab7c  kernel-debug-3.10.0-123.el7.x86_64.rpm
ed73c5f412285b562199fc021f7aab7c  org.rpm
```

# 参考
* [HTTPのRangeアクセスを実装して、分割ダウンロードに対応する - もなじろう日記](http://d.hatena.ne.jp/monajiro/20100617/p1)
* [404 Blog Not Found:perl - AnyEventで超速分散ダウンローダー](http://blog.livedoor.jp/dankogai/archives/51500176.html)
Google の Material Design のカラーパレットを CSS/Sass/Scss/Less/Stylus で簡単に使う


Google の Material Design 良いですよね。特に[カラーパレット](http://www.google.com/design/spec/style/color.html)がいいなと思いました。

これを使いたい！と思うんですが、16 進数のカラーコードをコピペするのも面倒だし、コピペ先では何の色だったかわからなくなってしまいます。

そこで [CSS, Sass, Scss, Less, Stylus で簡単に使えるように、ライブラリ（？）を作ってみました。](https://github.com/shuhei/material-colors)

## 使い方

[dist ディレクトリ](https://github.com/shuhei/material-colors/tree/master/dist)から直接ダウンロードしてもいいですし、Bower を利用しているなら `bower install material-colors` でインストールできます。

### Sass, Scss, Less, Stylus の変数

一番わかりやすい使い方は、Sass, Scss, Less, Stylus の変数。`colors.sass`, `colors.scss`, `colors.less` に `$md-red-500`, `$md-blue-a100` のような名前の変数が用意されているので、好きに使ってください。頭につくのは Less では $ じゃなくて @, Stylus では何もなしです。

### CSS 用クラス

CSS には変数がないので、`colors.css` に `color`, `background-color`, `border-color` に SVG の `fill`, `stroke` 用にそれぞれクラスを用意しています。プロトタイピングには使えるかも。

```html
<p class="color-blue-700 bg-green-100 border-yellow-300">Hello, World!</p>
<svg>
  <circle cx="100" cy="100" r="40" class="fill-purple-200 stroke-red-600" />
</svg>
```

## 裏側

ちょうど Grunt を勉強していたところだったので、ファイルの生成を Grunt を使って行うようにしています。Material Design のサイトから色を抜き出して JSON を作るタスクと JSON からテンプレートを使って各フォーマットを出力するタスクを作りました。

Grunt のテンプレート機能は強力ですし、同期的な API は Node っぽくないですが使いやすいですね。

## おわり

正直なところ CSS のは文字の色や背景色毎にクラスを設定しないといけないので微妙ではありますが、Sass, Scss, Less に関しては結構便利なんじゃないかと思います。

ぜひ使ってみてください！
Grunt の設定オブジェクトの秘密


いや、別に秘密でも何でもなく、ただ私が最近社内勉強会用に調べるまで知らなかっただけですが・・・。

`grunt.initConfig()` で渡す Object がありますよね。Gruntfile.js のほとんどを占めるあの長大なオブジェクト。あまり良くわかっていなくても、ドキュメントやブログの例を真似すれば、どうにか Grunt を使うことはできます。

しかし、これってよく見ると、？なところがたくさんあります。

- options とかあるけど、options に入れるのと入れないの（src, dest など）は何が違うの？
- トップレベルに pkg とかタスク名じゃなさそうなものを入れてる例を見るけど？
- `grunt connect:server:keepalive` とか見るけど `keepalive` はどこから来たの？

Grunt の基本概念から調べつつ、これらの疑問に答えていきます。

## 普通のタスクとマルチタスク

Grunt のタスクには二種類あります。普通のタスクとマルチタスクです。マルチタスクは普通のタスクと何が違うかというと、ターゲットを持つところです。

ターゲットとは、その名の通りタスクの対象です。例えば、ファイルをコピーする `copy` タスクがあり、js と css のファイルに対して実行したいとします。どちらかだけでも実行したいし、両方実行したい時もある。こういう場合、`js` と `css` をターゲットと呼びます。

大抵のプラグインが提供するタスクはマルチタスクです。普通のタスクは、自分で複数のタスクをまとめて一つのタスクにする際によく使われます。

設定を受け取るのは、マルチタスクだけです。

タスクはプラグインで定義されますが（もちろん自分で定義することもできます）、ターゲットは必ず自分で設定します。

```
grunt.initConfig({
  copy: {
    js: { src: 'app/js/**/*', dest: 'dist/js/' },
    css: { src: 'app/css/**/*', dest: 'dist/css/' }
  }
});
```

この場合、`copy` という名前は決まっていますが、`js`, `css` は自分で好きな名前にすることができますし、さらに数を増やすこともできます。なお、ターゲットを入れ子にすることはできません。

マルチタスクの場合、タスク名だけを書いて実行すると、そのタスクのすべてのターゲットに対して処理を実行します。

```
grunt copy
```

もちろんターゲットを指定することもできます。

```
grunt copy:js
```

## options とファイル設定

さて、タスクとターゲットの関係を整理すると、設定を書く対象は二種類であることがわかります。

1. マルチタスク直下
2. マルチタスクのターゲット

```
grunt.initConfig({
  copy: {
    /* 1. */
    js: { /* 2. */ },
    css: { /* 2. */ }
  }
});
```

これらに書く設定は主に二種類です。

1. options
2. src, dest, files などのファイルパス関係

options は、タスクごとに固有のオプションです。<del>マルチタスクでは</del>タスクレベルで指定することもできますし、ターゲットで指定すればタスクで指定した設定を上書きできます。

では、2. のファイルパス関係のオプションだけ何故特別なのかと言うと、Grunt はファイルを操作するものだからです。src, dest, files などなどいろいろありますが、どの書き方をしても Grunt の内部では files という、`{ src: ['src1', 'src2', ...], dest: 'dest' }` な形式のマッピングの配列に変換されます。

## テンプレート

[公式サイトのサンプル Gruntfile](http://gruntjs.com/sample-gruntfile) でも、トップレベルに pkg というタスクではないものがありますよね。これは、実はテンプレートに使うものなのです。

Grunt は設定オブジェクト内の文字列をテンプレートとして補間してくれます。この際、トップレベルにあるプロパティが利用できるのです。

```
grunt.initConfig({
  jsSrcDir: 'app/js',
  jsDestDir: 'dist/js',
  copy: {
    js: {
      src: '<%= jsSrcDir %>/**/*',
      dest '<%= jsDestDir %>/'
    }
  }
});
```


どうしてタスクとごちゃ混ぜになるような設計にしたのかはわかりません。しかし、Grunt はこうなっているのです・・・。

ちなみに、タスクの設定プロパティもテンプレート内で利用できます。

## grunt コマンドの謎

ここまででタスク、ターゲットについてわかってきたのではないかと思いますが、`grunt connect:server:keepalive` とかよく目にしますよね。connect はタスク、server はターゲットだけど、keepalive は一体どこから来たの？ターゲットを入れ子にさせることはできなかったんじゃないの？という疑問が湧いてきます。

実はこの keepalive は、keepalive フラグが true だという意味なのです。

```
grunt.initConfig({
  connect: {
    server: {
      options: {
        keepalive: true
      }
    }
  }
});
```

となっている時に `grunt connect:server` したのと同様の効果を得られます。

```
grunt task:target:flag1:flag2:flag3
```

というような感じで、マルチタスクでは 3 つ目以降はフラグを表しているのです。これによって設定したターゲットをちょっと変えて実行することができるので、ほとんど同じだけど微妙に違うターゲットを複数用意するのを避けることができます。

しかし、この書き方ってちょっと変ですよね・・・。コロンで同じように区切られているものが、場所によって全然意味が違う・・・。しかし、そうなっているものは仕方ありません。あきらめて、チャンスがあればバシバシ使いましょう。

普通のタスクでは、2 つ目以降がタスクの関数の引数になるので、以下のようになります。

```
grunt task:arg1:arg2:arg3
```

## おわり

これで Grunt に対するもやもやが少しは晴れたでしょうか？私は少しすっきりしました。どうしてこうなったか釈然としない部分はいくつかあるけど、これで楽しい Grunt ライフが送れる気がします。

おしまい。

<ins>2014.7.27 マルチタスクでないタスクが設定を受け取ると勘違いしていたので修正しました。実際は、設定を受け取るのはマルチタスクだけでした。</ins>
Arduino(?)に繋いだ可変抵抗を本当に回した時だけ値を受けとるには？

# Arduino(?)のAnalog入力のノイズをソフトウエアで軽減(?)してみる

先週、こんなん作りました。
例によって、MIDIコントローラーです。

![ツマミ12個！のMIDIコン](http://img.dfm.lrv.jp/arduinoNoise/con.png)

コレはATTiny44をつかっているのですが、ArduinoのISPを使って開発していますので、まぁ、Arduinoみたいなモノ、ということで、タイトルはArduino(?)とさせていただきました。

現在、コード整理中なので、整理が終わったら、MIDI IFの部分などを含めて公開したいと思いますが、今回は、analogRead()のノイズを軽減について試行錯誤している現状を先行で公開します。

## AnalogRead()で取った値をそのままMIDI送信するのはNG

MIDIコントローラーのツマミから取りたいのは、0〜127の値（MIDI CCの値）です。

`analogRead()`で取得して、そのままMIDI送信すれば良いように思いますが、ここで問題が見つかりました。

- 問題①：凄い勢いでMIDI送信しっぱなしになる。
- 問題②：ノイズで取れる値がフラフラする

MIDIコントローラは、ツマミを回した時だけ、データを送るように作るべきです。
というわけで、いろいろ改善してみました。

## 問題①への対策：前回データと変化検知する

まず、ツマミを回してなくてもデータを送ってしまうのはやめたいので、変化検知したときだけデータを送信するようにしました。
前回データを覚えておいて、analogRead()で取得した値と比較して、違っている時だけ送信するのです。

## 問題②への対策1：先にビットを落とす

analogRead()で取得するデータは10bitなので、必要なbit粒度に落とします。
今回は7bitに落としたいので、3bit左へシフトします。

## 問題②への対策2：間隔を空けて取るようにする

10msくらい間を置いて取るようにしました。

しかし、これでも、いくらかマシになりましたが、まだフラついています。

> 12,11,12,12,11,12,....

こんな感じでフラフラ取れてしまいます。
これではすごい頻度で変化検知してしまいます。

## 問題②への対策3：変化検知を強化する

そこで、変化検知を強化しました。
具体的には、

1. 「前回データ」は「前回`analogRead()`したデータ」ではなく、「前回変化検知したデータ」にする
2. 「前回データ」だけでなく、「前々回」「前々前回」と3つ覚えるようにする
3. 「前回データ」だけでなく、「前々回」「前々前回」とも異なる値じゃないと変化検知させないようにする
4. スパイク的なノイズに反応しにくくするため、行って戻っているような時、例えば、 3（今回）, 2（前回）, 1（前々回）, 2（前々前回）となっている時は、まだ変化検知させない。

という風にしてみました。

## コード（抜粋）

```c
byte valbk[] = {0, 0, 0};  // 「前回」「前々回」「前々前回」
int vol = 0;    // analogRead()では10bitで取れるので。
byte val = 0;   // 「今回」データ。10bitを7bitに変換する

void loop() {

  vol = analogRead(5);  // 5ピンをAnalog入力とする
  vol >>= 3;            // 10bit→7bit
  val = (byte)vol;      // 型変換しとく

  if(chkchange(channel,val)){

    // MIDI送信処理

    valbk[2] = valbk[1];  // 「前々回」を「前々前回」へ
    valbk[1] = valbk[0];  // 「前回」を「前々回」へ
    valbk[0] = val;       // 「今回」を「前回」へ

    delay(10);        // 変化検知したら、少し間をあける
  }
  delay(5);
}

boolean chkchange(byte channel,byte val){
  byte chk1 = valbk[0];
  byte chk2 = valbk[1];
  byte chk3 = valbk[2];
  if((val != chk1)&&(val != chk2)&&(val != chk3)&&(chk1 != chk3)){
    return true;
  }
  if((val != chk1)&&(chk1 == chk2)&&(chk1 == chk3)&&(chk1 == 0)){
    return true;
  }
  return false;
}
```

## まとめ

本当に回した時だけ値を受けとるために

- 最終的に使うビットに落としてから変化検知する（今回は10bit→7bit）
- 間隔を開けてanalogRead()
- 変化検知は過去数回のものと比較する

これでかなりマシになりましたので、この状態で調整を続けています。
でも、もっと良い方法があったら知りたいです。
誰か教えてください！
windows用のシンボリックリンクをSVNやgitにコミットできない故の代替手段

# 記事のサマリ
windowsで開発をやっている場合に、シンボリックリンクを利用したいことがあるかと思います。しかし、VCSにシンボリックリンクをコミットした場合、リンク自体をコミットすることができません。なので、シンボリックを作成するwindowsバッチをコミットしてなんとかしようという、代替案です。（あまり綺麗ではないかもしれません。。。）

# シンボリックリンクとは
linux系のユーザの方は、シンボリックリンクという言葉を聞いたことがあったり、実際にバリバリつかっているよって方が多いものと思います。
ファイルやディレクトリの実体とは別に、同じ名前や違う名前でリンクを貼ることができ、あたかもそこにあるかのようにアクセスすることが可能です。
windowsでは、昔からショートカットという機能があり、似たように使えたのですが、ショートカットは単純に参照先の情報が書かれたファイルでしかないため、透過的に利用することはできませんでした。ところが、windowsでもvista以降ではシンボリックを作成することができるようになりました。この機能を利用することで、ある場所から別の場所にあるファイルやディレクトリを透過的にアクセスすることが可能になります。
詳しくは、以下wikipediaの記事がわかりやすかったです。
[wikipedia：ソフトリンク](http://ja.wikipedia.org/wiki/%E3%82%BD%E3%83%95%E3%83%88%E3%83%AA%E3%83%B3%E3%82%AF)

# windowsにおけるシンボリックリンクの作り方は？
windowsでは、管理者権限で起動したコマンドプロンプト上からmklinkコマンドを実行することで、シンボリックリンクを作成することができます。
ファイル・ディレクトリでコマンドが若干異なるのですが、以下のようにシンボリックリンクを作成することができます。

```bat:ファイルのシンボリック作成コマンド
mklink [link_name] [target_dir]
```

```bat:ディレクトリのシンボリック作成コマンド
mklink /D [link_name] [target_dir]
```

ちなみに、target_dirは、相対パスでも絶対パスでも良いようです。さらに、大文字・小文字は区別されないようですね。（windows7で実験しています。）
もし、以下ののような、上位階層にjava・webappというディレクトリ。webapp配下にWEB-INFというディレクトリがあり、webappがカレントディレクトリであった場合の具体例を示します。
c\tmp┓
　　　┣java
　　　┃
　　　┗webapp（カレントディレクトリ）
　　　　┃
　　　　┗WEB-INF

この場合
「link」という名前のシンボリックリンクをc:\tmp直下に作成し、「java」フォルダに向けて貼る場合
絶対パスで指定する場合
mklink /D c:\tmp\link c:\tmp\java
※「mklink /D c:\tmp\link c:\Tmp\JaVa」でも同じ結果になります

相対パスで作成する場合
mklink /D ..\link java
注：javaフォルダの指定が、..\javaになっていない点は要注意！！「mklink /D ..\link ..\java」としてしまうと、エラーにはならず、c:\javaへのシンボリックになってしまいます。


# windowsのシンボリックリンクをsvnやgitにコミットできるか？？
windows用のシンボリックリンクを、svnやgitにコミットしようとしてみましたが、うまくいきませんでした。。。

# 代替策
シンボリックリンクをコミットできなかったので、自分は、シンボリックリンクを作成するwindows用の.batファイルを作成してコミットするようにしています。（もっとよい案があれば教えてください。。。）
ただ、シンボリックリンクを作成するには.batファイルを管理者権限として実行する必要があります。しかし、管理者権限で実行しようとすると、カレントディレクトリが「C:\Windows\system32」になってしまうので、最初に、.batファイル自体のあるフォルダに移動するようにしています。

```bat:make_link.bat
rem webappに置いてあるイメージ
cd /d %~dp0
mklink /D ..\link java
pause
```

もっといい方法があればよいのですが、とりあえずこれを叩いてもらうことでしのいでます。。。
Codeforces #257 div.2 A

# 概要
http://codeforces.com/contest/450/problem/A
をScalaで解いてみた。
競プロのリハビリ兼Scalaが競プロでどう使えるのかの検証その1です。

# 問題

n人の子供が並んでいる（1..nの番号付き）。
それぞれ、少なくともa[i]個のキャンディを受け取るまで帰らない。
Jzzhuさんは先頭の子からm個ずつキャンディを与える。
m個もらった子iは、もらった数の合計がa[i]を上回れば列から消え、まだなら列の最後に並ぶ。
最後に列に残った子は何番？

```math
1 \leq n \leq 100
```

# アルゴリズム

子供の列をListで表し、実装するだけ。
nが小さいので何しても大丈夫。
良心的なA問題。

## Scala的には

列の最後に追加、というList的に不吉な文言が。
念のため、末尾に追加演算子（:+）を使わずreverseしてみた。
両方コドフォサーバーで試したところ、実行速度に差はほぼなし。

100程度なら何やっても大丈夫そう。
詳しい検証は速度が厳しい問題が出てからにしよう…。

こういうケース、うまく書けば再帰使わないで行けるんかな…？
末尾に増える時点でmapじゃ書けなさそうだし、あんまりいい方法が浮かばない。

なお、テストをしやすいように、solve関数にまとめた。

# 解答

```scala
import scala.annotation.tailrec

object Main extends App {
  val sc = new java.util.Scanner(System.in)
  val n,m = sc.nextInt
  val input = List.fill(n)(sc.nextInt)

  def solve( m: Int, input: List[Int] ): Int = {

    @tailrec
    def dist(children: List[(Int, Int)] ): Int = {
      children match {

        case List(x) =>  // size == 1
          x._2 + 1

        case x :: xs =>
          val diff = x._1 - m
          if (diff <= 0)
            dist(xs)
          else
            dist( ( (diff, x._2) :: xs.reverse ).reverse )
      }
    }

    dist( input.zipWithIndex )
  }

  println( solve( m, input ) )
}
```

## 自分で書いたテストケース

```scala
import org.scalatest._

class Test extends FlatSpec with Matchers {

  it should "test 1" in {
    val input = List(1, 3, 1, 4, 2)
    Main.solve(2, input) should be (4)
  }

  it should "test 2" in {
    val input = List(1, 1, 2, 2, 3, 3)
    Main.solve(4, input) should be (6)
  }

  it should "test 3" in {
    val input = List(6, 1, 5, 4, 2, 3, 1)
    Main.solve(3, input) should be (4)
  }
}
```

## 結果
Time: 249 ms
Memory: 100 KB

## Scala見たことない人へのちょっとした解説

 * List[Int]
 IntのList。いわゆる単方向リスト。
特定の要素に行くには先頭から辿らないと行けないので、末尾に追加とかは厄介。
その代わり、先頭に追加、とか先頭を順に取り出し、とかは速い。

 * List[(Int,Int)]
 Intを2つ持つタプルのList。タプルを書くのは簡単。便利。

 * @tailrec
  末尾再帰をしてね、ってお願いするアノテーション。
末尾再帰な関数は、whileに展開されてスタックを食いつぶさなくなる、らしい。
心休まるアノテーション。

 * match - case
 C言語のそれと比べてはいけないレベルで強力。
数字、文字列のみならず、型やリストでもマッチでき、ガード条件も付けられる。

 * ;
 省略可能。1行に処理を並べたい時は必要。

 * return
省略可能。ブロックの最後に書いたのがreturn値になる。便利。
ブロックを使って変数を複雑な初期化とかすると綺麗&&便利。

```scala
  val t = {
    val u = a+b
    u*v
  }
```

 * reverse
要素の順番をひっくり返した配列を返す。
「reverse」→「先頭に要素追加」→「reverse」であら不思議、末尾に要素が追加できちゃう。
Listの末尾に追加するコストを気にしなければ、
List() :+ elem
で末尾に追加できる演算子が用意されている。
UITabBarのアイコン画像を変更する

##変更したアイコンの画像を作成する
30x30px（Ratina 60x60px)
※60px以上だと、60pxに自動的に縮小される

##例

[画像ファイル]
選択時：selected_image.png
通常時：normal_image_png

```objc

UIImage *selectedImage  = [[UIImage imageNamed:@"selected_image"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    UIImage *normalImage    = [[UIImage imageNamed:@"normal_image"]  imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
self.tabBarItem.selectedImage    = selectedImage;
self.tabBarItem.image            = normalImage;

```
Zealz GK802にUbuntu 14.04サーバ環境を構築する(OSインストール編)

#準備

##必要なハードウェア
 1.Zealz GK802
 2.MicroSDカード(今回用意したのは SanDisk Class10 32GB)
 3.2A以上で給電可能なMicroUSBケーブル&電源
　→SSHから設定する場合は不要だが、USB端子にキーボードやマウスを接続する場合は2A以上で給電していないと、電源不足で認識しない可能性がある。また延長コード経由でとっても同様。
 4.HDMI接続可能なモニタ or テレビ
 5.USB接続のキーボード or マウス
 6.MicroSD USB変換アダプタ
　→MicroSDカードをUSB経由で読み書きするために必要。また後述するVmwarePlayerからホストデバイスを接続する場合にUSB経由で接続しておく必要がある。(Vaioなど標準でSDカードスロットがあるPCでもVmwarePlayerからはマウント可能なデバイスとして表示されない模様)

##必要なソフトウェア
 1.[GK802 Ubuntu Beta Firmware](https://www.dropbox.com/s/h19ws4topoejnf7/geekbuying%20ubuntu11.10_bin.7z)
 2.[GK802 Beta1 Ubuntu 11.10 Full DD Image](http://www.armtvtech.com/armtvtechforum/viewtopic.php?f=137&t=1249)
 3.[DD for Windows](http://www.si-linux.co.jp/techinfo/index.php?DDforWindows#wcba113d)(WindowsPCで作業を行う場合)
 4.[Vmware Player](http://www.vmware.com/jp/products/player)(WindowsPCで作業を行う場合)
  →イメージの書き込みを行った後、無線LANの設定を加えるためEXT4のパーティションをマウントする必要がある。
 5.putty(SSH用)

#Ubuntu起動～SSH接続確認

##ファームウェアのアップデート
以下を参考にアップデート
[Zealz GK802 firmware update instruction](http://www.youtube.com/watch?v=96HOI--6hFc)

##Ubuntu11.10のOSイメージをMicroSDカードへ書き込む(DD for Windows使用)
画像挿入

##無線LAN設定を追加
 1.書き込んだMicroSDカードをUSB変換アダプタ経由でPCへ接続
 2.VMWarePlayerで適当なLinux(DebianとかUbuntuとか)環境を構築する
 3.VMWarePlayerの「取り外し可能なデバイス」でUSB変換アダプタを選択し、ゲストOSへ接続
 4.ゲストOSでMicroSDカードをマウント `mount /dev/sdb1 /mnt/sd`
 5.Interfacesファイルに無線LANの接続情報を追加(MicroSD内のファイルであることに注意)

```bash:/mnt/sd/etc/network/interfaces
auto wlan0
iface wlan0 inet dhcp
wpa-ssid excample-ssid
wpa-ap-scan 1
wpa-key-mgmt WPA-PSK
wpa-psk password
```
固定IPにする場合は[ここ](http://bty.sakura.ne.jp/wp/archives/1131)を参照。

##起動
 1.GK802のカバーを外して、外側のプラスティックと中の基盤を分離させる。
　→一部ケーブルがつながっているので、完全に外さないよう注意。
 2.基盤の裏側に起動OS用のMicroSDカードスロットがあるので、そちらへUbuntuを書き込んだMicroSDカードを挿入する。
　→基盤側面の外部からアクセスできるMicroSDカードスロットとは異なるので注意(すごい重要)。
 3.GK802をモニタへ接続し、電源ケーブルとキーボードかマウス(SSH前提の場合は不要)をつないで電源ON。
 4.しばらく待つとデスクトップ画面が表示される。
　→ブート中のコンソール出力は表示されない。
　1分以内には起動するが、いつまでも表示されない場合は失敗しているので、リセットボタン(USB端子の横の小さな穴)を1～2秒押して再試行。

##SSH接続
 1.PuttyでGK802のIPアドレスへ接続する。 `Port = 22 User = linaro Pass = linaro`
　→`sudo su`可能

バージョンを14.04にするのは別エントリにて。
Zabbixのメール通知設定

Zabbixのメール通知がとりあえず飛ぶようになる設定です。
つまづきやすい点も含めて記載したので、設定しててメールが飛ばないなどに見てください。

１. Administrations→Users
----
　・メディアにEmailを持ったユーザを作成 / Mail Notification User
　・権限に対象のホストグループやホストを追加する

![WS000001.JPG](https://qiita-image-store.s3.amazonaws.com/0/51152/e48e82e2-5439-1ed5-6df0-34b41626b61a.jpeg)

  
  
２. Administrations→Media types
----
　・Emailの設定を記入してEnableにする
　・SMTP serverは適宜指定
　・SMTP helloは環境に依存するが、通常はドメイン名 
　・自サーバがSMTPサーバになる場合は、IPv6との兼ね合いで127.0.0.1に設定すると良い

　　※SMTPサーバに認証がついている場合は、[こちら](http://www.zabbix.jp/node/1441)を参照


３. Configuration→Actions
----
　・基本はデフォルトで、Conditionsで対象のトリガーを設定
　・ActionタブでOperation typeをSend Messageに設定
　・Send to User groupsかSend to Usersを設定
　・Conditionsは特に設定なしでも動作します。

![WS000002.JPG](https://qiita-image-store.s3.amazonaws.com/0/51152/7cfce7e7-4147-dddc-0f6f-d3429fdafdda.jpeg)

さいごに
----
今回、メール通知について書きましたが、チャットとの連携は整理できたら[ブログ](http://komeiy.hatenablog.com/)にまとめようと思います。
エンジニアでも知っておいた方がいい、サイトリリース前のUIとか機能面以外のチェック項目


一般的にあてはまるか、わからないのですが、、、
自分が今までやってきた中で、結構重要だけど意外と見落としがちなのではという箇所です。

# SEO対策

## タイトル、h1がきちんと設定されているか
タイトルとh1はSEO対策の超重要ポイント。
リリース前というか最初に決めるところかもしれませんが、チェック項目としては漏れてしまいがちなのかな・・・と。

タイトルは全部表示されないのでchrome拡張とか使ってチェックすると便利です。
https://chrome.google.com/webstore/detail/show-title-tag/pkbffbhglicfngmppdlpmpblfgnkdgio


## URLのwwwあり、なし

今はどうなのかわからないのですが、URLの統一をした方がSEO的にいいという話がありましたので、wwwあり、なしを統一しておきます。
実際Google Analytics等で分析するときもURLが統一されている方が分析はしやすいし、特にデメリットもないのでやっておいた方がいいでしょう。

.htaccessファイルを編集します。
wwwありにそろえる場合

```.htaccess
RewriteCond %{HTTP_HOST} ^(example\.com)(:80)?
RewriteRule ^(.*) http://www.example.com/$1 [R=301,L]


```

## クローリングがされるかチェック

### robots.txtをチェック

下記のように設定されているとクロールされないため、インデックス数が増えません。

```robots.txt
User-agent: *
Disallow: /
```

### metaタグをチェック

下記の設定も意味合い的は上と同じです。

```
<meta name="robots" content="noindex">
```

# 各種計測用

## GoogleAnalyticsが設置されているかチェック

Webサイトの分析はこれがないと始まりません。
できれば各ボタンへのクリックイベント設定なども、最初にやってしまった方がいいですね。

## Google Webマスターツールに登録されているかチェック

https://www.google.com/webmasters/tools/home?hl=ja

こっちはサイトの分析というよりかは、SEO対策向け。
クロールエラーなどがあると警告してくれるので、robots.txtの設定確認等にも役立ちます。

## その他計測タグ

その他使っている計測タグがあれば、設置されているかチェック。

# もろもろ設定

## SSL設定

SSLの設定がされていようが、なかろうがサイトは動くのでうっかりすると、「証明書取得するの忘れてた！」ってなります。

## バックアップ

バックアップもサービスリリースと同時期に定期実行される仕組みを作りたいですね。

## サーバ監視設定

これもサービスリリース時にやっておきたい。


以上
（今後追加するかも）
Rubyで配列をベクトル的に足し算したい

Rubyの配列には、ベクトルのように要素同士を足し合わせるようなメソッドが用意されていない。
普通に足し算すると配列の連結になってしまうし…。
格好を気にしなければいくらでもやり方はあるけれど、できるだけいい感じに書きたい！

## Vectorクラスを使う
```
a1  = [1, 2, 3]
a2  = [4, 5, 6]

sum = (Vector.elements(a1) + Vector.elements(a2)).to_a
```

* 要素数が違うものは足し合わせられない
* 要素はNumericクラスのみ
 * (追記)コメント欄、Nabetani様より。Numericでなくても一応それらしく動くとのことです。

## 外部イテレータを使う
```
a1 = [1, 2, 3]
a2 = [4, 5, 6]

e1 = a1.to_enum
e2 = a2.to_enum

sum = []
loop do
  sum << e1.next + e2.next 
end
```

* Numericクラス以外（文字列とか）でも使える
* 要素数が違う場合は、小さい方の要素数の配列しか得られない

## Enumerable#each_with_objectを使う
```
a1 = [1, 2, 3]
a2 = [4, 5, 6]

sum = a2.each_with_object(a1).with_index(0){ |(elm, result), idx|
  result[idx]  = result[idx].to_i +  elm
}
```

* Numericクラス以外（文字列とか）でも使える
 * ただし、`result[idx].to_i`の部分はクラスによって要変更(`result[idx]`が`nil`のとき対策)
 * `result[idx] || 0`とかでもいいかも
* 要素数が違う場合は、大きい方の要素数の配列が得られる
* `result`と`a1`の参照先が同じになるので、`a1`の内容も変化してしまう。
 * `a1`の値を変更したくなければ、`sum = a1.clone`で`a1`の値をコピーしておき、`each_with_object`には`sum`を渡す
* ちょっと無理矢理感が出ている気がする

もっとエレガントな書き方は無いものか…。

(追記)
コメント欄にて、もっといい方法をご教授いただきました。
ぜひコメント欄もご覧ください。
フォーム改善、その前に。読んでおきたい参考記事リンク集


# はじめに

フォーム改善、いわゆるEFO（Entry Form Optimization）の仕事をやる前に読んでおきたい参考記事、サイトをいくつかピックアップしてみました。

ウェブサイトの改善に欠かせないEFO。
はじめてやる場合でも、これだけ読めば勘所がわかる、といえそうなものをジャンルごとに分けて紹介します。


# 1.総合
EFOって何なのか、どんなことすればCVRは上がるのか（または下がるのか）という所から始める時に読むべき記事。

##[【保存版】問合せを劇的に増やすエントリーフォーム最適化（EFO）15の方法](http://lpo.gaprise.com/blog/efo-1250/)

LPO研究所さんの記事。実際の改善事例をもとに、基本的な最適化法が紹介されています。

>フォーム内の無駄なリンクは外せ！
入力項目は極限まで削れ！
入力ボックスは分割するな！
半角・全角入力をユーザーに求めるな！
離脱しそうなユーザーはポップアップ表示で引き留めろ！
入力エラーはリアルタイムに表示しろ！
フォームで最後のひと押しをしろ！
住所は自動入力で！
表示する項目は必要最低限に！
現在位置がわかるナビゲーションをつけろ！
入力中の項目は色を変えろ！
入力完了時は「OK」「✔」などでわかりやすく！
必須の入力項目は「必須」とわかりやすく明記しろ！
入力ボックスには記入例を用意しろ！
リセットボタンを付けるな！

などなど。


##[入力フォームを改善して入力完了率を上げる！ エントリーフォーム最適化15カ条](http://web-tan.forum.impressrd.jp/e/2014/02/28/16995)

web担当者フォーラムさんの記事。こちらも、ごく基本的な方法を紹介しています。その数、LPO研究所と同じ15個。

>【第1条】1つ目の項目は、入力しやすい項目にすべし
【第2条】何のためのフォームかを伝えるべし
【第3条】ファーストビューに収めるべし
【第4条】入力例や入力形式を明記すべし
【第5条】入力に達成感を感じてもらうべし
【第6条】最低限どの項目に入力すれば良いかを伝えるべし
【第7条】入力エラーをリアルタイムで伝えるべし
【第8条】エラー画面をわかりやすくすべし
【第9条】離脱要因となる不要なリンクを減らすべし
【第10条】離脱ブロックを導入すべし
【第11条】クリアボタン、キャンセルボタンはなくすべし
【第12条】入力の手間を減らすべし
【第13条】他のCV（コンバージョン）手段があれば伝えるべし
【第14条】送信完了の勘違いをなくすべし
【第15条】送信ボタンは大きく、具体的な文言にすべし

LPO研究所との違いは、「〜すべし」と、した方がいいことを中心に紹介していることでしょうか。

１つめの記事の目次と合体させたら、これで主なEFO対策は網羅されるんじゃないでしょうか。

##[EFO・フォーム改善ブログ](http://blog.f-tra.jp/)

EFOツール「エフトラ」を販売しているエフコードさんのブログ。さすがEFO専業というだけあって、詳しい検証記事がいくつも掲載されています。

中でも、『[確認ページをなくせば、完了率は上がる？①～離脱の理由とは？～](http://blog.f-tra.jp/column/3200)』は、EFOに取り組む誰もが気になる点。うまくまとめてあります。

##[もうやりきったと思ってませんか？まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化](http://www.slideshare.net/tanakayoshikif-code/tfm20140129)

上記ブログの中の人のスライド。時間のない時にぱぱっと見るにはいいかも。

# 2. 分析系

いきなり上記の改善策を試すのもなしではないですが、先に「フォームのどこに問題があるのか？」という分析をした後に始めた方が効果が出ます。

計測を行えば、ユーザーがフォームのどのあたりでつまずいているのか、離脱しているのか、といったことが分かります。

EFOツールもいろいろありますが、無料のGoogle Analytics でも、十分に計測ができます。

##[基礎からわかるGoogleアナリティクスのトラッキングコード設定入門](http://catcher-in-the-tech.net/1268/)

トラッキングコードの仕組みがよくわからん、という場合はこちらから。クリック計測のコードを入れるのは、非常に簡単です。


##[Googleタグマネージャとアナリティクスでフォーム入力イベントトラッキング – 独自のイベントリスナー作成の基本](http://murak.net/post/analytics/736)

タグマネージャと組み合わせたイベントトラッキングの方法。
むむ……なかなかマニアックな方法みたい。



# 3. 制作系

##[フォームの使いやすさやデザイン性を向上させる33の方法](http://zxcvbnmnbvcxz.com/form-improvement/)

ぐっと制作系によった、Tips集です。分析を経て何をやるかが決まったら、実際にどう手を動かして作るのか、という部分が解説されています。サンプルも豊富にあります。



##[フォームデザインDB](http://athenads.com/)
デザインに困ったらここを見ましょう。
実際のサイトで使われているボタン、フロー表示、エラー表示デザインがまとめられています。


# 捕捉：フォームばかりに囚われずに。
ここではフォーム改善に役立つ記事を紹介しました。
が、フォーム改善の目的はCVRを改善すること。CVRは広告、LP、サイト内の導線など様々な要素の影響を経た上で出てきます。

フォームはあくまで最終地点。
EFOというミッションを託されたとしても、サイト全体を巨視的に見て考えたいですね。
Pythonで暗号化と復号化

PyCryptoを使って、AES形式の暗号化を行う

```bash
$ pip install pycrypto
```

```python:aes_cipher.py
import base64
from Crypto import Random
from Crypto.Cipher import AES

class AESCipher(object):
    def __init__(self, key, block_size=32):
        self.bs = block_size
        if len(key) >= len(str(block_size)):
            self.key = key[:block_size]
        else:
            self.key = self._pad(key)

    def encrypt(self, raw):
        raw = self._pad(raw)
        iv = Random.new().read(AES.block_size)
        cipher = AES.new(self.key, AES.MODE_CBC, iv)
        return base64.b64encode(iv + cipher.encrypt(raw))

    def decrypt(self, enc):
        enc = base64.b64decode(enc)
        iv = enc[:AES.block_size]
        cipher = AES.new(self.key, AES.MODE_CBC, iv)
        return self._unpad(cipher.decrypt(enc[AES.block_size:]))

    def _pad(self, s):
        return s + (self.bs - len(s) % self.bs) * chr(self.bs - len(s) % self.bs)

    def _unpad(self, s):
        return s[:-ord(s[len(s)-1:])]
```


後は、認証用の鍵を作成する。

```bash
$ python -c "import string, random; print(''.join([random.choice(string.ascii_letters + string.digits) for i in range(50)]))"

>>> PkDv17c6xxiqXPrvG2cUiq90VIrERfthHuViKapv6E1F7E0IgP
```

### usage
```python
cipher = AESCipher("PkDv17c6xxiqXPrvG2cUiq90VIrERfthHuViKapv6E1F7E0IgP")

# 暗号化
password = cipher.encrypt("hogefuga")
print(password) # -> H/LfZg82FOdHhnructCHzfYnVgCOvjgEUGXXDFpjiYLBHw4Zflk/m2N9zEVwz6eC

#復号化
print(cipher.decrypt(password)) # -> hogefuga
```

### 追記
ちょいちょいストックされていて需要がありそうなので、PyPIに登録しました。

```bash
$ pip install Simple-AES-Cipher
```

* https://pypi.python.org/pypi?name=Simple-AES-Cipher&:action=display


詳しくはGithubをご覧ください。

* https://github.com/teitei-tk/Simple-AES-Cipher

### 参考
[Advanced Encryption Standard](http://ja.wikipedia.org/wiki/Advanced_Encryption_Standard)
[PyCryptoで暗号化する](http://yoshi-python.blogspot.jp/2009/10/pycrypto.html)
シェルでコピペした文字列をファイルにしたい場合

ウェブサイトの複数行の文字列を
コピペしてそのまま新規ファイルなどに書き込みたい場合
以下のようなことをするとサクッとできます。

```bash
$ cat << 'EOF' > foo.txt
ここにテキストを入れる
改行も入る
EOF
```

上の場合`EOF`を書くか`Ctrl-d`を押すまで入力できます。
(`Ctrl-c`はキャンセル)

```bash
$ cat foo.txt
ここにテキストを入れる
改行も入る
```
サックっとbrowser-syncを設定


タスクランナーまわりのスターターキット的なものはいろいろあると思うけど、「**そこまで機能いらないから、html/js/css書いてちょっとした表示テストしたいなっ**」って時、browser-syncの設定方法をいつも忘れて調べるのに手間取るので、**css/html/jsを保存するたびに、ブラウザシンク＆リロードする設定**のメモ。

※node npm gulpはインストールされてる前提


##こんなディレクトリ構成を想定した場合

![directory](https://www.itoz.jp/share/qiita/browser_sync/directory.png)

ターミナル起動し、

```
$ cd (myprojのパス)
```

```
$ npm install browser-sync
```


##gulpfile.js作成

`myproj`以下に`gulpfile.js`を下記の内容で作成。
下記は[XtraFinder](http://www.trankynam.com/xtrafinder/)などの、「新規ファイルテンプレート」とかに登録しとくと楽。

``` gulpfile.js
var gulp = require('gulp');
var browserSync =require('browser-sync');

gulp.task('default', ['browser-sync']);


gulp.task('browser-sync', function() {
    browserSync({
        server: {
             baseDir: "./htdocs/"		//対象ディレクトリ
            ,index  : "index.html"		//インデックスファイル
        }
    });
});

//
//ブラウザリロード
//
gulp.task('bs-reload', function () {
    browserSync.reload();
});
 
//
//監視ファイル
//
gulp.task('default', ['browser-sync'], function () {
	gulp.watch("./htdocs/*.html",            ['bs-reload']);
	gulp.watch("./htdocs/commons/css/*.css", ['bs-reload']);
	gulp.watch("./htdocs/commons/js/*.js",   ['bs-reload']);
});
```

##実行
 
おもむろに

```
$ gulp
```

で `http://localhost:3000` が立ち上がって html/css/js を保存するたびに全ブラウザがリロードされて同期すればOK。

##その他TIPS

スマホでも開きたい場合、手っ取り早くローカルIPを調べるには、Alfred Workflow の[IP Address Workflow](http://dferg.us/ip-address-workflow/)とかだと、さっと調べられてコピれて便利。
（Workflowは有料版の機能）

![ip address workflow](https://www.itoz.jp/share/qiita/browser_sync//IP-Address-Workflow-685x235.jpg)

##最後に

違うよ！もっとこうした方がいいよ！
ってのがありましたら、ご指摘いただけると嬉しいです。
Qiitaの2段階認証をPSPで行う


広く使われるようになったGoogle Authenticator。アルゴリズムは公開されているので、色々な方が実装していますが、私も数年前にPSP版を作成していました。
最近Qiitaが2段階認証に対応したので、今回記事を書いてみることにしました。

なお、アルゴリズムの詳細は https://www.idontplaydarts.com/2011/07/google-totp-two-factor-authentication-for-php/ が詳しいです。

## 準備
- PSPの時刻を正確に合わせる(できれば自動設定が良い)
- https://www.dropbox.com/s/mj92ccgvwoit746/libpuer_dist.7z をダウンロードし、PSP/GAME/google2faをPSPメモステのPSP/GAMEにコピーする
  - google2fa/EBOOT.PBPは署名済みですので、未改造のPSPでも実行可能です。
- (「導入」時)PSPをUSBモードに入れておく

## 導入
基本的には http://blog.qiita.com/post/93858790619/two-factor-authentication を参考に。

- 設定->共通->2段階認証->アプリを使って設定する、をクリックします。
- 「QRコードが使えない場合はこのテキストコードを入力して下さい」をクリックし、表示された「Your two-factor secret」を、PSP/GAME/google2fa/keys.txtに記入します。

![ss 2014-08-14 21.06.31.png](https://qiita-image-store.s3.amazonaws.com/0/29692/37fc140d-1190-70a6-2790-278b3c0f913e.png "ss 2014-08-14 21.06.31.png")

keys.txt
![keys.png](https://qiita-image-store.s3.amazonaws.com/0/29692/7eb69c59-6fcd-fc3f-2826-d528f8be4048.png "keys.png")


## 使い方
PSPのメニューから「Google TwoFactor Authenticator on PSP」を選択し、実行します。
![IMAG3311_.jpg](https://qiita-image-store.s3.amazonaws.com/0/29692/ca8a86d1-6e9c-151c-7b57-2aed3b1dbe65.jpeg "IMAG3311_.jpg")

今回はkeys.txtの3行目に記入したので、3行目に表示されている「657176」を認証コードとして使用します。
![IMAG3312_.jpg](https://qiita-image-store.s3.amazonaws.com/0/29692/345401e8-dc46-771b-bf30-d473b638534d.jpeg "IMAG3312_.jpg")


## 最後に
今回、Qiitaに絞って説明しましたが、勿論GMailやDropboxでも使えるので、ぜひ使ってみてください。
ただし、keys.txtをクラウドに入れるのはセキュリティ上推奨いたしません^^;;;
(注：アカウント名は秘匿されるとはいえ、keys.txtにはsecretが平文で保存されることになります。しかし、root化されたAndroidであればsqlite経由でsecretを平文で抜くことができる点から、ローカルに保存する分には大きな影響はないと考えています。)
部下のコンテキストスイッチを防ぐための上長としての振るまい

# 部下のコンテキストスイッチを防ぐための上長としての振るまい

## 概要
部下のコンテキストスイッチを防ぐための上長としての振るまいについて

コンテキストスイッチの重要性については、自分自身のパフォーマンスを発揮する,と言う意味では
理解出来ているつもりなのですが、自分の部下・後輩に対してきちんと配慮できているだろうか、
という点が曖昧だったので整理しました。

## コンテキストスイッチ
システム開発は集中して頭を使います。
そのため、設計中やバグの原因について検討している最中などに話しかけられたりすると、
そこまでの思考をやり直す必要が出てしまいます。

設計を熟考中
＝＞上長からの割り込み指示
＝＞上長から受けた指示を実行
＝＞上長への報告
＝＞設計について考えていた内容を思い出す
＝＞ようやく元の設計に復帰

と思考のコンテキストスイッチが発生することによるロスがあります。

割り込みの時間が長いほど、復帰までの時間が多く必要になります。

## 上長からの割り込み
会社やチームの風土にもよるでしょうが、一般的には部下のほうが上長からの
割り込みを断りにくいはずです。

そのため、部下が本当は
「集中できないので割り込みを少し抑えてもらいたい」
と思っていたとしても意見出来ずに我慢している可能性があります。

## 上長として行うべきこと：コンテキストスイッチの弊害を共有する
まず、部下とコンテキストスイッチに関する考え方を共有します。

「システム開発において、集中することが重要であり後輩のためにも自分は集中を妨げたくないので
割り込まれたくない場合は、遠慮せずに
『今○○の作業に集中しているので、XX分後でもよろしいでしょうか？』
みたいに、断っていいよ。
その時はどのくらい時間がたてば対応可能になるか、大体でいいから教えてね。
本当に急いで対応してもらうときは、その旨を伝えるので今の作業のメモでも残しておいて、
対応をお願いするよ。
私に対して質問や依頼がある場合も同じような基準で対応してもらえると、おいさん嬉しいな。」

考え方自体を教えることで部下が自分に接する際も
この点を考慮してもらえることになるメリットがあります。

## 上長として行うべきこと：電話・メール・会議への対応
これは、対部下に限ったことではないのですが、
電話、メール、会議の割り込みを最小化することです。

特に、

* メールやコミュニケーションツールなどの選定
* ワークフローの決定
* 会議の参加者の選定

について意見を通したり、決定権を持たない相手はこれらを自分で
コントロールできないため、なおさら配慮が必要です。

1日100通以上のメールや、発言しない人も呼ばれる長時間の会議、
などは異常なものであり、生産性を下げていることを自覚すべきです。

## 上長として行うべきこと：雰囲気づくり
汚い言葉や、叱り声が常時響くような現場は集中量を阻害します。
高圧的に振る舞っていると、部下たちが改善すべき点に気付いても声をあげることができません。
心地よく集中できて、カジュアルに改善の提案ができる雰囲気づくりは重要です。
上長の目線では気づかなかった思いもよらない良い改善案が出てくることもあるものです。
その芽を摘んではなりません。

## 具体例
### 改善前
※ ***フィクションです***

部下 新垣＿＿：カタカタ方・・・・ここの設計はこのパターンを使って・・・
上司 佐村河内：「新垣君！あの譜面・・じゃなくて、あの資料の中から 'ゴーストライター' というワードが何件あるか抽出しておいて！」
部下 新垣＿＿：「え？あ、はい。（・・うわ・・・設計方法がまとまりそうだったのに・・）」
部下 新垣＿＿：（仕方ない、最低限のメモだけ残しておこう）カキカキ
上司 佐村河内：「早くしたまえ！ほんとに君は仕事が遅いな！私が若いころは・・・云々・・・」
部下 新垣＿＿：イラッ
： 
： しばらく経過
： 
部下 新垣＿＿：「ようやくサムラッチの割り込みへの対応が終わった。。。」
部下 新垣＿＿：「設計内容をすっかり忘れてしまったのでメモを見ながら思い出すか・・・」
上司 佐村河内：「新垣君！あの資料の中から 'ブラフ' というワードが何件あるか抽出しておいて！」
部下 新垣＿＿：「あの、今ちょっと自分の作業に集中してまして、もし優先度が高くないのであれば・・」
上司 佐村河内：話に割り込んで
上司 佐村河内：「・・・え？（高圧的に聞こえないふり）」
部下 新垣＿＿：「はーい、すぐやりまーす・・・（都合の良いときだけ聞こえないふりしやがって・・）」

### 改善後

： 事前にコンテキストスイッチの重要性について共有してある
：
上司 ゴンさん＿＿＿：「パラディナイトくん、頼みたいことがあるんだけど今大丈夫かい？」
部下 パラディナイト：「申し訳ありません、ゴンさん。今設計に集中しているので急ぎの内容でなければ」
部下 パラディナイト：「きりが良くなってからこちらからお知らせするので、それでもよろしいでしょうか？」
部下 パラディナイト：「だいたい、30分後くらいにはきりが良くなると思います」
上司 ゴンさん＿＿＿：「うん、いいよいいよ。待ってるね。」
：
： 30分経過
：
部下 パラディナイト：「ふー、ようやくきりが良くなった。」
部下 パラディナイト：「でも今はゴンさんがとても忙しそうなので、もう少し落ち着いてそうなときに報告しよう。」
部下 パラディナイト：「まずはBTSのチケットのステータスを最新化しよう。」
部下 パラディナイト：「これで、もし急にゴンさんの手が空いた場合は報告前に気づいてもらえるだろう」
：
部下 パラディナイト：「ゴンさん！先ほどの件ですが、対応完了致しました。」
部下 パラディナイト：・・・以降報告内容
上司 ゴンさん＿＿＿：「ボ」 ※意味は無い

## その他の工夫
### YES・NOまくら的な発想
ポモドーロ・テクニックという集中して作業するための手法があります。
ポモドーロ・テクニックは25分の集中と5分の休憩を繰り返すことで
集中力を保つテクニックですが、このテクニックでポモドーロ型のタイマーを利用する
もう一つの利点があるそうです。

ポモドーロ・テクニックの考案者は、ポモドーロタイマーがカチカチと動いているときは、
集中していて、タイマーが鳴ったら話しかけてもよい、ということを
周りに知らせる効果も活用しているそうです。

現実の職場でタイマーの音をカチカチ鳴らすのはなかなか許容されないかもしれませんが、
自分が集中している or 今なら話しかけても良いよ という二つの状態を知らせる
フラグ的な目印を作るといいかもしれませんね。
チーム内で共有できる「集中するための目印ルール」とでも言いましょうか。

例えば

* チャットアプリケーションを「取り込み中」ステータスにする
* 実装の帽子をかぶる（from eXtreme Programming）

など。

以下、似たような話ですが上長・部下に限らず集中に関する話をまとめて寄稿した記事です。
【システム開発と集中力】ゾーン！フロー！俺最強！カタカタカタッ…ッターン！ドヤァ ( ´ｰ`)
https://codeiq.jp/magazine/2014/06/11368/
Hubot | 自作Script | chusen.coffee - 抽選する

# Hubot | 自作Script | chusen.coffee - 抽選する

## 概要
chusen.coffee - 抽選する

## 用途
* いくつかの候補の中から何か1つに決めたいがランダムでよいとき

例えば、

＊ レビュアーをランダムに決めたり
＊ 掃除当番をランダムに決めたり
＊ 買ってくるおやつをランダムに決めたり

## 仕様
### filename
chusen.coffee

抽選、ですね。

### respond or hear
respond

### 起動メッセージ

* 正規表現

~~~coffee
/chusen+ (.*)+/i
~~~

* 具体例
    * chusen tanaka suzuki sato          # => tanaka/suzuki/sato の中から誰か一人を抽選で選ぶ
    * chusen きのこの山 たけのこの里     # => きのこの山とたけのこの里のどちらかを抽選で選ぶ

## ソースコード

~~~coffee
# Description
#   Choose User
#
# Dependencies:
#   None
#
# Configuration:
#   None
#
# Commands:
#   hubot chusen <name1> <name2> <name3> ... - Output chosen name at random.
#
# Author:
#   tbpgr
module.exports = (robot) ->

  robot.respond /chusen+ (.*)+/i, (msg) ->
    if msg.match.length == 0
      msg.send 'chusen に続けて抽選対象をスペース区切りで列挙してください'
      return null

    names = msg.match[1].split(' ')
    random_result = msg.random(names)
    msg.send "抽選結果！#{random_result}"
~~~

## 試行結果

~~~
$ ./bin/hubot

Hubot> hubot chusen Matz Guido Larry
Hubot> 抽選結果！Guido
Hubot> hubot chusen Matz Guido Larry
Hubot> 抽選結果！Matz
Hubot> hubot chusen Matz Guido Larry
Hubot> 抽選結果！Matz
Hubot> hubot chusen Matz Guido Larry
Hubot> 抽選結果！Guido
Hubot> hubot chusen Matz Guido Larry
Hubot> 抽選結果！Larry

Hubot> hubot chusen きのこの山 たけのこの里
Hubot> 抽選結果！たけのこの里
Hubot> hubot chusen きのこの山 たけのこの里
Hubot> 抽選結果！たけのこの里
Hubot> hubot chusen きのこの山 たけのこの里
Hubot> 抽選結果！たけのこの里
Hubot> hubot chusen きのこの山 たけのこの里
Hubot> 抽選結果！きのこの山
~~~

## 補足
今のところ、 npm で公開したりする予定はないので適当にGitHubに突っ込んでおきます。
https://github.com/tbpgr/hubot_scripts
gulp-stylusで"resolve url"の設定

grunt-stylusだと簡単に"resolve url"の設定が出来たのですが、gulp-stylusではなかなか出来なかったのでメモ。  

```coffeescript
gulp = require("gulp")
plugins = require("gulp-load-plugins")()
stylus = require("stylus")

gulp.task "stylus", ->
	gulp.src(["./**/*.styl?(us)", "!./**/_*.styl?(us)", "!./node_modules/**"])
		.pipe plugins.stylus(
			"resolve url": true
			define: {'url': stylus.resolver()}
		)
		.pipe gulp.dest("./")
```

結果見ると別に難しくもなんとも無いのですが 
define: {'url': stylus.resolver()} 
を設定しなきゃってことに気がつくのにかなり時間を費やしてしましました...
Route53で取得したドメインをEC2インスタンスと紐付ける方法


EC2の左メニューの「Elastic IPs」にアクセスし、
「Allocate New Address」をクリック。
![1.png](https://qiita-image-store.s3.amazonaws.com/0/7942/e56352b1-2abe-7895-0047-8263f2379448.png "1.png")

1,するとIPアドレスが作られる。
2,新しく作成したAddressを選択し、「Associate Address」をクリック。
![2.png](https://qiita-image-store.s3.amazonaws.com/0/7942/59f4cb2f-9ef0-11ad-fea0-0e7de9719b97.png "2.png")

Instanceのテキストフォームを選択すると、
現在立ち上がっているEC2インスタンスの一覧が出てくる。
紐付けたいインスタンスを選択。
![3.png](https://qiita-image-store.s3.amazonaws.com/0/7942/07d920dd-f8eb-8f4a-a25c-f81f8ddce5b9.png "3.png")

1,「Reassociation」をチェック。
2,「Associate」をクリック。
![4.png](https://qiita-image-store.s3.amazonaws.com/0/7942/c6680ffa-8942-9ee7-bd78-cd49336d67d1.png "4.png")

EC2インスタンス一覧に行くと、
Elastic IPとして先ほど取得したアドレスが紐付けられている。
![5.png](https://qiita-image-store.s3.amazonaws.com/0/7942/1e89d61a-d759-9835-00d7-b0919f0a6356.png "5.png")

Route53の「Hosted Zones」へ移動。
1,Route53で取得したドメインを選択する。
2,「Go to Record Sets」をクリック。
![6.png](https://qiita-image-store.s3.amazonaws.com/0/7942/d5288535-2485-b91d-deb3-01c92df94c68.png "6.png")

1,Typeは「A - IPv4 address」を選択。
2,ValueにElastic IPで作ったIPを入力。
3,「Create」をクリック。
![7.png](https://qiita-image-store.s3.amazonaws.com/0/7942/9ee996d2-8e2c-2570-37a6-a1538acf22a1.png "7.png")

これで紐付け完了。
VAIO Type pにubuntu14.04

VAIO type p VGN-90HS

UnixBench

* 174.6 : Atom Z540@1.86GHz
* [xpインストールの場合](http://qiita.com/tukiyo3/items/55b3da5e1fe5980ad76e)
* emgd-driver はあきらめた。
* [14.10 mini.iso](http://ubuntutym.u-toyama.ac.jp/ubuntu/dists/utopic/main/installer-i386/current/images/netboot/)

# Ubuntu 14.04 の特徴

* ふたを閉じるとサスペンドします。
  * 無効にするには[Ubuntu Serverでモニターを閉じてsuspendを防止 - Qiita](http://qiita.com/tukiyo3/items/9db97f9ffea8a26b364b)
  * [Ubuntu - pm-suspendからの復帰後に処理を入れる簡単な方法 - Qiita](http://qiita.com/tukiyo3/items/8ffbc6f04d87868d9ae3)
* サスペンドから復帰時、無線LANは有効なままです。
* `audio`グループに所属することで音が出ます。
  * 音量調節は`alsamixer`
* 14.10も試しにインストールしましたが、こちらは画面真っ暗になりました。

# インストール

## OSインストール

* BIOSは`F2`で入れる
* [14.04 mini.iso](http://cdimage.ubuntu.com/netboot/14.04/)をusbメモリにddしておいて、インストールに使う。
* インストーラで無線LANが使えます。
* USBからインストール時、GRUBは`/dev/sdb`にインストール

## 無線LAN

```bash:ESSID一覧をスキャン
sudo ifconfig wlan0 up
sudo iwlist wlan0 scan | grep ESSID
```

## 無線LAN設定ファイル

```bash:/home/owner/wpa_supplicant.conf
ctrl_interface=/var/run/wpa_supplicant
ap_scan=1
network={
   ssid="YOUR_SSID"
   key_mgmt=WPA-PSK
   proto=WPA WPA2
   pairwise=CCMP TKIP
   group=CCMP TKIP WEP104 WEP40
   psk="YOUR_PASSWORD"
}
```

* `ssid値`と`psk値`を修正。

# パッケージ追加


## GMA500用emgd-driver(挑戦中)

kernel再構築されるので時間かかります。

```bash:emgd-driver
sudo apt-get install software-properties-common
sudo add-apt-repository ppa:thopiekar/emgd
sudo apt-get update
sudo apt-get install emgd-driver
sudo reboot
```

## その他パッケージ

```bash:
sudo apt-get install -y \
  openssh-server autossh rdesktop xtightvncviewer \
  awesome slim fonts-takao-gothic xinit suckless-tools \
  lxterminal \
  fcitx-mozc \
  alsa-utils mplayer vlc \
  vim w3m nkf screen \
  zsh git tig \
  chromium-browser-l10n firefox firefox-locale-ja  \
  mutt postfix mailutils \
  blueman \
  pm-utils acpitool
```

## スタートアップ

```bash:/etc/rc.local
wpa_supplicant -Dwext -iwlan0 -c/home/owner/wpa_supplicant.conf &
dhclient wlan0 &
echo 50 > /sys/class/backlight/psb-bl/brightness
exit 0
```

## X設定

```bash:
cp /etc/X11/xinit/xinitrc ~/.xinitrc
echo "exec awesome" >> ~/.xinitrc
```

```diff:/etc/slim.conf
default_user        owner
auto_login          yes
```

[ubuntu serverにawesomeとslimを入れた - Qiita](http://qiita.com/tukiyo3/items/2658008cc92e568a7890)

```bash:
mkdir -p ~/.config/awesome/
cp -p /etc/xdg/awesome/rc.lua ~/.config/awesome/rc.lua
```

```diff:rc.lua
+   awful.key({ modkey,           }, "d", function () awful.util.spawn("dmenu_run") end),
```

## サスペンド方法

```bash:
sudo /usr/sbin/pm-suspend
```

# その他

* update-alternatives --all
Route53でドメインを取得する方法


Route53のサイドメニュー「Domains」をクリック。
![1.png](https://qiita-image-store.s3.amazonaws.com/0/7942/c04cfcb2-9bc3-3f52-b9b3-73174a4f9834.png "1.png")

「Register Domain」をクリック。
![2.png](https://qiita-image-store.s3.amazonaws.com/0/7942/943196ab-e214-f7b5-a246-4aef66c856aa.png "2.png")

１，欲しいドメイン名で検索。
２，下に使えるドメイン名が出てくるので欲しいドメイン名の「Add to cart」をクリック。
３，右のカートに金額が表示される。お名前.comとかと比べるとちょっとお高め。
![3.png](https://qiita-image-store.s3.amazonaws.com/0/7942/b3752b0e-5d95-20d0-d12a-822f66779e73.png "3.png")

ページの下の「Continue」ボタンをクリック。
![4.png](https://qiita-image-store.s3.amazonaws.com/0/7942/9730a925-2d51-8e89-f1a1-2e18063dbdfc.png "4.png")

登録者情報を入力し「Continue」をクリック。
![5.png](https://qiita-image-store.s3.amazonaws.com/0/7942/6a5c44e0-8550-a9ec-1445-c0bedfb218c1.png "5.png")

入力した情報が間違ってないか確認する。
![6.png](https://qiita-image-store.s3.amazonaws.com/0/7942/4a300912-a327-a8c4-cd42-b52990152b50.png "6.png")

ページ下部の「I have read and agree ...」をチェックし、「Complete Purchase」をクリック。
![7.png](https://qiita-image-store.s3.amazonaws.com/0/7942/15125626-a7f5-28d9-d07b-e0904be3ff1c.png "7.png")

これでドメイン購入完了。

「Hosted Zones」に行くと、取得したドメインが登録されている。
![8.png](https://qiita-image-store.s3.amazonaws.com/0/7942/0202da72-fd84-b680-a138-afacfe31eb56.png "8.png")