OmniAICreator/Qiita-1.07M huggingface dataset:
非デザイナーがWebサイトをおしゃれに作るためにやったこと

# はじめに

普段はバックエンドエンジニアでデザインの勉強を一切やったことがない僕がそこそこのwebサイトであれば作れるようになってきたので、webサイトをおしゃれに作るためにやったことをまとめてみました。

# 手順

デザインについて無知でhtml, cssをほとんど書いたことない人（基本的な文法は知っている。）がいきなりおしゃれなサイトが作れるようにはなりません。以下のステップを踏んでいくといいと思います。

1. おしゃれなサイトを探して研究する。
2. bootstrapを使ってサイトを作ってみる。
3. 実際に作ってみる。


# おしゃれなサイトを探して研究する

個人的にこれをやることがおしゃれなwebサイトを作るための一番の近道だと思います。まずは既存のものを真似して作っていくことが大切だと思うので、なぜそのサイトがおしゃれなのか調べ尽くします。
この作業を繰り返しすることでどんなサイトがおしゃれなのかわかってきます。

## 具体例

今回はこちらの[PAS-POL](http://pas-pol.jp/)さんのサイトを参考にしたいと思います。

## 気づいたポイント

とりあえずおしゃれだと思う要因を考えていきます。

### 1.トップページいっぱいになるように画像を使う。

![スクリーンショット 2016-01-28 8.58.14.png](https://qiita-image-store.s3.amazonaws.com/0/94508/872b39c4-971a-468f-b92f-dd6707f6c2e1.png)

手っ取り早くおしゃれにするには画像を程よく使っていくことが大切だと気付きました。このサイトでは画像をトップページいっぱいに表示させていることがおしゃれポイントだと思います。

### 2. 画像の上に文字を表示させる時は白を使う。

白（限りなく白に近い色）をうまく使っているサイトは個人的におしゃれです。画像の上には白で文字を書いていきましょう。それが一番無難で失敗しないと思います。

### 3. aタグには必ずエフェクトをつける。

![スクリーンショット 2016-01-28 9.19.47.png](https://qiita-image-store.s3.amazonaws.com/0/94508/8d6edabf-f294-5cb9-462e-66d7ab5b8739.png)

マウスを重ねた時に何かしらのエフェクトがつくようにします。デフォルトのエフェクトではダサいので、実際に作る時には自分でカスタマイズしていく必要があります。aタグのエフェクトは非常に重要です。

### 4. 見出しにletter-spacingをつける。

![スクリーンショット 2016-01-28 9.17.43.png](https://qiita-image-store.s3.amazonaws.com/0/94508/59a19ebf-8ee9-cdd5-cc11-e67a2484d406.png)

「旅に出よう。」の部分に着目してください。本文と比べて文字と文字の間にスペースがあるように見えます。これをletter-spacingで再現します。僕はletter-spacing: 2px;とすることが多いです。


### 5. 原色は使わない。

赤、青、黄色などの原色は使わないようにます。始めは黒もほとんど使わないほうがいいと思います。使いたい時は明暗をずらして使うといいでしょう。僕は以下のサイトで使う色を選んでいます。
http://colourco.de/


### 6. 背景が白系統の時、本文に黒は使わない。

背景が白系統の時は、黒に限りなく近い色〜灰色の間で使うようにしましょう。本文に黒（#000）を使っているサイトはほとんど見たことがありません。今読んでいるこの記事の文字色もよく見ると黒と灰色の間の色を使っていることがわかります。


### 7. フッター付近は色をだんだん濃くする。

![スクリーンショット 2016-01-28 9.32.22.png](https://qiita-image-store.s3.amazonaws.com/0/94508/6a508d4c-9ac3-e73b-14d0-5de9fae7d67f.png)

写真で見てわかるように、フッター付近は、フッターにかけてだんだん色が濃くなるように色合いを決めていきます。

### 8. コンテンツごとに背景色を変える。

ここではコンテンツの背景色には白に限りなく近い色と白を選択して繰り返しています。

### 9. 英字の文字の太さを変える。

font-weight:200;などに設定すると文字が細くなりおしゃれに見えると思います。

### 10. たくさんの色を使いすぎない。

画像、ボタンなどの色を除いて、たくさんの色を使いすぎるとまとまりがなくなってくるので5色以内で作りましょう。
本格的なデザイナーさんのサイトだとたくさん色を使いながらもおしゃれに見えるサイトがいくつもあり「デザイナーさんすごい」といつも思いますが、僕たちは非デザイナーなので色をたくさん使いすぎないようにします。

## まとめ
１つサイトを見るだけでも様々なポイントに気づくことができました。
あるサイトについて上のように気づいたポイントをあげていくと新しいことを発見できるのでオススメです。
自分で「どうしておしゃれなのか」考えることがとても重要です。
実際に作る際には気づいたポイントを意識してサイトを作っていきます。

# bootstrapを使ってサイトを作ってみる。

サイトを研究しておしゃれポイントを見つけて、いざ作ろうとなってもなかなか難しいです。なのでまずはbootstrapを使ってサイトを作ってみることをオススメします。ここでは要素の置き方や色合いなどを中心に考えて作ります。またbootstrapの派生でbootswatchというのもあるのでそちらもbootstrapっぽくなくオススメです。

# 実際に作ってみる。

今まで学んできたことを生かして実際に作ってみましょう。bootstrapはレスポンシブにするためのgridのみ使うようにします。
きっと以前より上手におしゃれなサイトが作れるようになっていると思います。
link_toでfont-awesomeを使う方法

## `link_to`でfont-awesomeを使う方法


例えばこの場合

```erb:修正前.html.erb
<%= link_to new_customer_path(@loginUser), class:"btn btn-primary" %>
```

```erb:修正後.html.erb
<%= link_to new_customer_path(@loginUser), class:"btn btn-primary" do %>
  <i class="fa fa-user-plus"> アカウント登録</i>
<% end %>
```
FuelPHPで「Primary key on model XXX cannot be changed.」が発生

FuelPHPでModelの設定において、複合主キーを設定したテーブルに削除の後に新規追加を行ったらエラーが発生した。

```
Primary key on model MODEL_NAME cannot be changed.
```

むぅ。。。どうやらプライマリーキーの設定に何か問題があると思い、Modelのプライマリーキーの設定を消したら動くようになった。

既に修正済だとは思うんだが、以下の関連かなーと思う。
参考：http://onjiro.blogspot.jp/2013/04/fuelphp15masterbelongs-to.html

とりあえず消して今度はそのテーブルに足してcountを実行したら、以下のエラー・・・・

Unknown column 't0.' in 'field list' with query: "SELECT COUNT(DISTINCT `t0`.``) AS count_result FROM `TABLE＿NAME` AS `t0` WHERE `t0`.`COLUMN＿NAME` = 'X'"

むぅぅ・・・プライマリキーでDISTINCTしようとしているのかな。。。
しょうがないから複合主キーのテーブルに暫定的に主キーをあらたに設けた。
易しいCircle Ci for Android

# 易しいCircleCI
## CircleCiとは
`CI = Continuous Integration = 継続的インテグレーション`

継続的インテグレーション、、、
わかりにくい。。。
### 現在の一般的解釈は、「ビルド、テストなどをGithubをトリガーとして継続的に実行する」ということ。

## とにかく導入したい
難しい話はともかく導入したいので、手順
### 1. CicleCiでサインアップ(登録していない場合は登録)
### 2. GithubにCircleCiからのアクセスパーミッションを許可
### 3. プロジェクトをクリックする。
### 4. 自身の作成アプリのルート直下(setting.gradleとかと同じ階層)にcircle.ymlを作成する。(サンプルコードは下。自分の環境に合わせて適宜変更する。もちろんAndroid Studio)
### 5. コードを実装する。
### 6. Githubにプッシュする。
以上！！

## 実際のコード
```
machine:
	java:
		version: openjdk7 # デフォルトはopenjdk7
	environment:
		ANDROID_HOME: ~/Applications/android-sdk-macosx # なくてもよい。                                                                                                     

dependencies:
	override:
		- echo y | android update sdk --no-ui --filter "android-23, build-tools-23.0.1" # デフォルトで導入されているパッケージは入れる必要なし。下記参照
test:
	override:
		- ./gradlew test
deployment:
	develop:
		branch: 3.0.0/develop
		commands:
			- ./gradlew assembleDebug
```


## CircleCIにプリインストールされているパッケージ群
| パッケージ名|
|:-------------|
|platform-tools|
|build-tools-22.0.1|
|build-tools-21.1.2|
|build-tools-20.0.0|
|android-22|
|addon-google_apis-google-22|
|sys-img-armeabi-v7a-android-22|
|sys-img-armeabi-v7a-addon-google_apis-google-22|
|android-21|
|addon-google_apis-google-21|
|sys-img-armeabi-v7a-android-21|
|sys-img-armeabi-v7a-addon-google_apis-google-21|
|android-20|
|sys-img-armeabi-v7a-android-wear-20|
|android-19|
|sys-img-armeabi-v7a-android-19|
|android-18|
|sys-img-armeabi-v7a-android-18|
|android-17|
|sys-img-armeabi-v7a-android-17|
|android-16|
|sys-img-armeabi-v7a-android-16|
|android-15|
|sys-img-armeabi-v7a-android-15|
|android-10|
|extra-android-support|
|extra-google-google_play_services|
|extra-google-m2repository|
|extra-android-m2repository|
Access2010の起動時にマクロを実行させる方法



vbaでAutoExecを作ること、マクロでAutoExecを呼び出すようにすること、が要点。

#1.下記関数を用意する

```
Function AutoExec() As Integer
	Debug.Print "auto exec"
End Function
```



#2.マクロを作成する

作成→マクロ
新しいアクションの追加で「プロシージャの実行」を選択する
プロシージャ名に「AutoExec()」を入力
マクロを「AutoExec」という名前で保存
![スクリーンショット 2016-01-28 9.36.13.png](https://qiita-image-store.s3.amazonaws.com/0/26886/2c876be7-1edb-4c73-6d7b-62845bc6c046.png "スクリーンショット 2016-01-28 9.36.13.png")


#マクロ実行をすっ飛ばして、ファイルを開きたい

__シフトを押しながら__ファイルを開く

なお、ファイルが開ききるまでシフトを押さないとダメっぽいです。
raspberry pi上のwifiで省電力機能を切る

wifiドングルにはI-O DATAのWN-G150UMWを使用しています。

まず現在のパワーマネジメントの状態を確認します。

```
$ cat /sys/module/8192cu/parameters/rtw_power_mgnt
1
```

/etc/modprobe.d/8192cu.conf というファイルを作成して以下の内容を入れます。

```
# Disable power saving
options 8192cu rtw_power_mgnt=0
```

リブートして再度パワーマネジメントの状態を確認します。

```
$ cat /sys/module/8192cu/parameters/rtw_power_mgnt
0
```

参考：[adafruitの記事](http://forums.adafruit.com/viewtopic.php?f=50&t=44171&p=220622#p220593)、[Raspberry Piで無線LANの反応が悪い時の対処法](http://denshikousaku.net/fix-sluggish-response-of-raspberry-pi-wifi-adaptor)
【自分用】IntelliJ IDEAショートカット

#文字列をプロジェクト内から検索する
Ctrl+Shift+F

#クラス名やファイル名、メソッド名などの検索
Shift 2連打

#コードのフォーマット
Ctrl+Alt+L

#文字列の置換
Ctrl+R

#コメントアウト/アンコメント
##一行コメント
Ctrl+/

##フロックコメント
Ctrl+Shift+/
c++ > #include <functional> / std::function


```cpp
#include <functional>
...
```

functional は何のためにincludeしているのか。

https://msdn.microsoft.com/ja-jp/library/169de7b0.aspx

std::functionを使っているので、それが理由なのかもしれない。

http://kaworu.jpn.org/cpp/std::function
> テンプレートクラスstd::function は、関数ラッパーです。std::functionは、関数、ラムダ式、バインド式(std::bind)、関数オブジェクトを格納、コピー、呼び出しができます。
技術英語 > When the conditions A are all established, / meet conditions / satisfy 

連続して条件が成立するかどうかを検知する仕組みを実装している中で気になったのは「条件が成立した」という言い回し。

以下では、establishedという記載がある。

http://ejje.weblio.jp/sentence/content/%E6%88%90%E7%AB%8B%E3%81%99%E3%82%8B

> When the conditions A are all <font color=red>established</font>, 

<hr>
meetという動詞もあるようだ。is metやare metという使い方になるのだろう。

http://eow.alc.co.jp/search?q=meet+conditions
> 条件を満たす、諸条件に合う

meet requirement(s)という使い方があったのを思い出した。

<hr>

他の動詞はあるかを聞いておいた。

http://english.stackexchange.com/questions/302535/when-the-conditions-are-all-established

be > obtained / satisified / fullfilled

などを別途挙げていただいた。

過去に使っていたはずの satisfied が出てこなかったのは精進が足りないようだ。

他に establish(ed)はこういう意味ですというコメントがついた。

> "established" conveys the idea of an evolution of the conditions, from an unestablished state to a state where conditions are met. – Graffito
slackで動かしているrubotyを紹介する


[ruboty](https://github.com/r7kamura/ruboty)は、[Heroku Deploy Button](https://devcenter.heroku.com/articles/heroku-button)がありますので、簡単にデプロイ出来ます。ハマった点としては、`dyno`を一旦動かした後に、`0`に戻す動作が必要だったことです。

以下、`ruboty`で動かしているプラグインです。便利です。


```bash:Gemfile
source "https://rubygems.org"

gem "rake"
gem "ruboty-alias"
gem "ruboty-cron"
gem "ruboty-google_image"
gem "ruboty-redis"
gem "ruboty-slack"
gem "ruboty-talk"
gem "ruboty-syoboi_calendar"
gem "ruboty-qiita_scouter"
```

```bash:
$ gem i bundler 
$ bundle
```

- [ruboty-talk](https://github.com/r7kamura/ruboty-talk)

```bash:
$ heroku config:add DOCOMO_API_KEY="xxx"
$ heroku config:add DOCOMO_CHARACTER_ID="1"
```

```bash:
> @rrbot テスト
> テストですか?
```

- [ruboty-syoboi_calendar](https://github.com/r7kamura/ruboty-syoboi_calendar) 

```bash:
> @rrbot list anime
```

- [ruboty-qiita_scouter](https://github.com/tbpgr/ruboty-qiita_scouter)

```bash:
> @rrbot qiita scouter tbpgr
ユーザー名: tbpgr 戦闘力: 218544 攻撃力: 27840 知力: 183860 すばやさ: 6844
```
SSLを使う場合にはスクリプトを読み込まない


以下のように記述すると、`http`でアクセスされた場合は、スクリプトを読み込みますが、`https`でアクセスされた場合はスクリプトを読み込みません。SSL対応していないスクリプトを指定すればよいでしょう。

```html
    <script type="text/javascript">
	if (window.location.protocol != "https:"){
		document.write('<div id="particles-js"><\/div> <script src="/bower_components\/particles.js\/particles.min.js"><\/script> <script src="/bower_components\/particles.js\/particles.config.js"><\/script>')
	} else {
		document.write('<div id="particles-js-no"><\/div>')
	}
    </script>
```
ブラウザの匿名性を上げる方法



## Proxy Server

別に追跡されてもいい場合は、単に`proxy server`を1つ経由させるだけで良いです。ブラウザごとにオプションがあります。`Firefox`の場合は、`詳細 > ネットワーク > 接続設定`から。後述しますが他のやり方もあります。

```bash:
$ chromium --proxy-server=server:9050
```

`tor`を経由させる場合は以下。

```bash:
$ sudo pacman -S tor
$ sudo cp /etc/tor/torrc-dist /etc/tor/torrc
$ tor 
$ chromium --proxy-server=localhost:9050
```

## User Agent

`user agent`を指定するには、以下の様な感じです。

```bash:
$ export agent='Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/527  (KHTML, like Gecko, Safari/419.3) Arora/0.6 (Change: )'

## Chromium
$ chromium --user-agent=$agent

## Firefox
$ cp ~/.mozilla/fierfox/xxx.default/prefs.js ~/.mozilla/fierfox/xxx.default/prefs.js.backup

$ cp ~/.mozilla/fierfox/xxx.default/prefs.js.backup ~/.mozilla/fierfox/xxx.default/prefs.js

$ echo "user_pref(general.useragent.override,$agent);" >> ~/.mozilla/firefox/f1srmwne.default/prefs.js
$ firefox
```

useragent.xml : https://github.com/opudalo/useragent-list/blob/master/src/useragents.xml

## Setting

`Cookie`, `Javascript`を無効にする他、その他の設定を無効にしていきます。Firefoxの場合は、`about:config`から。

Chromiumの場合は、`about:plugin`で全て無効に。

また、あまり有効ではありませんが、`サイトにトラッキングしないよう要求する`設定をONにしておきます。
GitHubのコメントシステムをブログに使う


[Talaria](https://github.com/m2w/talaria)というものがあります。これは、GitHubのコミットログを参照し、そこへのコメントを表示します。

![](https://raw.githubusercontent.com/mba-hack/images/master/github-comment-talaria.png)


使い方は、以下のとおりです。`jekyll`ルートを前提に解説します。

注意点は多いですが、GitHubユーザーとしてはとても使いやすいコメントシステムなので、おすすめです。

```bash:
$ pwd
~/jekyll

$ bower install m2w/talaria
$ bower install async

$ vim bower_components/talaria/dist/talaria.js
    var CONFIG = {},
        DEFAULTS = {
            COMMENTABLE_CONTENT_PATH_PREFIX: '_posts/',
            CONTENT_SUFFIX: '.md',
            CACHE_TIMEOUT: 60 * 60 * 1000, // cache github data for 1 hour
            PAGINATION_SCHEME: /\/xe4muteighiizi9U\d+\//,
            LOCAL_STORAGE_SUPPORTED: false,
            PERMALINK_IDENTIFIER: 'a.permalink',
            PERMALINK_STYLE: /[\.\w\-_:\/]+\/(\d+)\/(\d+)\/(\d+)\/([\w\-\.]+)$/
        }; 
```

ここで、`_posts/`の部分がリポジトリの`branch:master`にあるポストディレクトリを指定します。

```html:
<head>
    <link rel="stylesheet" href="/bower_components/talaria/dist/talaria.css" type="text/css">
    <script type="text/javascript" src="/bower_components/bluebird/js/browser/bluebird.js"></script>
    <script type="text/javascript" src="/bower_components/talaria/dist/talaria.js"></script>
</head>
```

次に、コメントを表示したい場所に、以下のコードを入れます。`article`内が良いでしょう。リポジトリ名とユーザー名を指定。

```html
  <script type="text/javascript">
	talaria.init({REPOSITORY_NAME: 'syui.github.io', GITHUB_USERNAME: 'syui'});
  </script>
```

最後に、記事の`a href`に`class="permalink"`を指定します。

```html
<a href="{{ page.url }}" class="permalink"># {{ page.title }}</a>
```

## 注意点

ただし、使用するサイトジェネレーターによっては、ブランチを指定できないので、厄介な問題を引き起こします。例えば、`hugo`でサイトを構築している場合は、ビルド後の`./public`を`master`に置くことがあります。

この場合、ポストディレクトリは`jekyll`用ではなく一般用にビルドされているため、そのままではこのコメントシステムを使えません。したがって、幾つかの工夫が必要になります。

```toml:config.toml
contentdir = "themes/{hugo-theme}/static/content"
```

このように記事を置いて、以下の様な指定をする必要があります。

```bash:
$ vim bower_components/talaria/dist/talaria.js
COMMENTABLE_CONTENT_PATH_PREFIX: 'content/post/'
```

また、コミットを分けて`push`する必要も出てきます(わかり易さのため)。

```bash:
$ hugo
$ cd public
$ git add content
$ git commit -m "update:post"

$ git add -A
$ git commit -m "update:web"
$ git push
```

例えば、`wercker`などを使って`push`している場合はさらに厄介なことになりますね。

`branch:gh-pages`を使う場合は、`branch:master`にソースコードを置けるため、この問題は小さくなります。
カッコいいAAを作る方法



AAを作るコマンドはいくつかあります。有名なのは、`banner`などですが、`toilet`もいいです。

```bash:
$ brew install toilet

$ toilet syui
                            
                        "   
  mmm   m   m  m   m  mmm   
 #   "  "m m"  #   #    #   
  """m   #m#   #   #    #   
 "mmm"   "#    "mm"#  mm#mm 
         m"                 
        ""                  
```

こういったAAはWebにのせると、ブラウザによってレイアウトが崩れることが良くあります。

その対策ですが、`font-family`を指定するのが良いです。

```css:
#body {
    font-family: Andale Mono, monospace;
    line-height: 1em;
}
```
VFL でビューを真ん中に寄せる Autolayout 制約を作る

そもそもサイズの小さなビューをセンターに寄せるのは Visual Format Language(VFL) では単純ではない。


## VFL と ``+ constraintWithItem:attribute:relatedBy:toItem:attribute:multiplier:constant:`` を組み合わせる

簡単に説明すると、

1. VFL で問題のビューのサイズだけを定義する
2. ``constraintWithItem:attribute:relatedBy:toItem:attribute:multiplier:constant:`` でスーパービューに対して真ん中に寄せる制約を作る

VFL だけではできない

## ``AlignAllCenterX`` ``AlignAllCenterY`` を使用する

幅に対して真ん中にしたいなら、 ``"V:[subjectView]"`` として ``AlignAllCenterX`` を指定する。高さなら ``"H:[subjectView]"`` にして ``AlignAllCenterY`` を指定。

ただしこちらは未確認。

## スペーサーのビューを挿入する

上記は真ん中に寄せたいビューが一つの場合にしか通用しない。真ん中に小さいビューを２つ以上配置したい場合は、スペーサーのビューを配置する。

``"H:|[spacerLeft]-[subjectView(100)]-[subjectView2(50)]-[spacerRight(==spacerLeft)]|"``

コードが汚くなりがちだが、適用可能な範囲が広いと思う。

## まとめ

一長一短
【Unity】エディタが終了する直前に処理を行う

Unityのエディタが閉じる直前に何らかの処理を行いたい場合の処理の書き方。
ただし、このスクリプトがシーン中のゲームオブジェクトにアタッチされてないと動かない。

アタッチせずに解決できるソリューションお持ちの方教えて下さい。

```csharp
Using UnityEngine;
using System.Collections;

[ExecuteInEditMode]
public class APlugin : MonoBehaviour {

	private bool started = false;

	void OnDestroy(){
		
		if (started) {
			if (!Application.isPlaying) {
				// エディタ終了時の処理
			} else {
				// 普通のプレイ終了時の処理
			}
		}
	}

	void Update(){
		started = Application.isPlaying;
	}
}

```

OnEditorQuit とかあっても良さそうなのに。
Fixing Internet Sharing DHCP


要約：
OSXのインターネット共有がうまく動かない、特にクライアントがIPアドレスの取得に失敗する場合は、
/Library/Preferences/SystemConfiguration/com.apple.nat.plist を開き、 \<SharingNetworkNumberEnd\> および \<SharingNetworkMask\> の項目を確認します。

---

After updating to El Capitan, OSX Internet Sharing stopped to work. Especially, it fails to give IP address to clients.
The Console says "DHCP DISCOVER" rather than "DHCP REQUEST".

After careful investigation, I saw

```
InternetSharing[PID]: missing dhcp parameters: start address 10.*.*.*, end address or mask
```

After googling, I met a Chinese blog: http://xnow.me/linuxes/custom-os-x-internetsharing-settings.html

It says "Open /Library/Preferences/SystemConfiguration/com.apple.nat.plist and check \<SharingNetworkNumberEnd\> and \<SharingNetworkMask\>."
And I recognized my plist did lack the entries. Now I was able to fix the DHCP server (and dump packet via WireShark...)

Tested on: MacBook Air OSX 10.11, sharing EasyTether via Wi-Fi.
自分で書いたファイルをいくら見なおしてもBibTeXの文字化けが解決しないとき

# 問題

卒論のBibTeXのコンパイルが出来なくて数時間はまった．

```tex:main.tex
...
なお，HPACKの仕様はRFC7541\cite{rfc7541}で定義されている．
...
\bibliographystyle{sieicej}
\bibliography{ref}
...
```

```tex:ref.bib
...
@misc{rfc7541,
 author               = {R. Peon},
 howpublished         = {RFC 7541},
 month                = 5,
 number               = 7540,
 organization         = {Internet Engineering Task Force},
 publisher            = {IETF},
 series               = {Request for Comments},
 title                = {{HPACK: Header Compression for HTTP/2}},
 url                  = {\\https://tools.ietf.org/html/rfc7541},
 year                 = 2015,
}
...
```

こんな感じで書くじゃないですか！自分で書いたファイル全部UTF-8ってことを何回も念入りに確認してるのに吐かれる`bbl`ファイルが文字化けするんですよ．

# 原因

スタイルファイルが原因だった．学会から配られている`sieicej.bst`．なんかGitHubにも上がってるんで適当にリンクしておきますｗ

- [iori-yja/GradReport - GradReport/ieicej1.6a/MAC/sieicej.bst](https://github.com/iori-yja/GradReport/blob/master/ieicej1.6a/MAC/sieicej.bst)

原因はスタイルファイルに含まれる**日本語コメント**．まさかと思ったんですがこれがShift_JISだったんです．`nkf -w` でUTF-8に変換したら速攻で解決した．

```tex
%%% 更新情報
%%% 2009/12/24 v1.1
%%% ・bookとinbook，incollection，inproceedingsのaddressとpublisherの順番を変更
%%% ・bookでauthorとeditorを両方出現させるように変更
%%% ・bookのtitleを変換せずにそのまま出現させるように変更
%%%   今までは先頭の単語とコロンの後の単語のみ頭文字大文字としそれ以外は小文字としていた
%%% ・book，inbook，proceedingsのeditor表記でed.の前に,を入れるように変更
```

時間返して… というかみんないい加減UTF-8使おうぜ…
ドメインがスパムリストに登録されてしまいTwitterと連携できなくなった時の対処法


## はじめに
独自ドメイン上で動かしているウェブアプリケーションが突然動作しなくなった。
その原因は www.spamhaus.org のスパムリストに登録されてしまっているというところにあったので
申請をしてスパムリストから登録解除してもらったという話。
なぜスパムリストに追加されていたのかという部分には触れません。

## 症状
独自ドメイン上で動かしているウェブアプリケーションが動かない。
調べてみるとTwitterAPIのアクセストークンを取得する箇所で詰まっている模様。
https://apps.twitter.com/app/ を確認すると次のような警告が出る。
```
url contains malware URL. 
The client application failed validation: callback_url contains malware URL.
```

## 行った処置
とりあえず Twitter に報告。
https://support.twitter.com/articles/258650
> 不正利用されていないことが確実であるにもかかわらず、管理しているサイトのリンクがブロックされてしまう場合はこちら https://support.twitter.com/forms/spam からTwitterサポートチームにお問い合わせください。

上記のリンクから問い合わせる。

この記事 http://ankare2dx.org/my-site-not-spam/ だと問い合わせから数日後に返事が返ってきたとのことなので、
自分もそれに従い申請後1週間待ってみた……が音沙汰無し。

そこで別の原因を探る。
DNSの設定で失敗しているのかもしれないと思ったので、何となくhttp://dozens.jp/ を利用してみようとしたところ、
自分のドメインが spamhaus https://www.spamhaus.org/ というサービスからスパムとして登録されていることに気づく。
なのでspamhausにスパムリストからの登録解除を申請した。
https://www.spamhaus.org/query/domain/example.com みたいな感じで自分のドメインを入力すればスパム登録されているか確認できる。

申請してすぐにリストから削除された。またその1時間後にはhttps://apps.twitter.com/app/ に表示されていた警告も消えた。

## まとめ
spamhausというサービスと、それを様々なサービスが利用しているという事情を知らなかったせいで苦労した。
今後同様の症状が出た際は spamhaus などのサービスに登録されてしまっていないかチェックすることにする。

しかしなぜスパムリストに登録されていたのかというもっとも重要な問題がいまだわかっていない。
それについてはまだ調べる必要がある。

## 参考文献
- 自分のドメインがSpamhausのブロックリストに登録された場合の解除手順 http://did2memo.net/2012/10/18/spamhaus-how-to-remove-my-own-domain/
- 自分のサイトがツイッターにスパム認定されてしまった時の対策 http://ankare2dx.org/my-site-not-spam/
Debian 7 WheezyにCUDA 7.5をインストールする。

# 概要
NVIDIA社のCUDAはDebianを公式にサポートしていない。
が、Ubuntu用で代替する方法を紹介する。
今回使用したマシンのOSはDebian 7 Wheezy（[もうすぐサポート切れるの？LTS？](https://wiki.debian.org/LTS)）

```
> cat /etc/issue
Debian GNU/Linux 7 \n \l
> uname -a
Linux debian 3.2.0-4-amd64 #1 SMP Debian 3.2.73-2+deb7u2 x86_64 GNU/Linux
```

# インストール
公式のダウンロードページ
https://developer.nvidia.com/cuda-downloads
Linux -> x86_64 -> Ubuntu -> 14.04 -> runfile(local)の順に選択すればダウンロードリンクが現れる。
直リンクから取得する場合は、

```
> wget http://developer.download.nvidia.com/compute/cuda/7.5/Prod/local_installers/cuda_7.5.18_linux.run
```

あとはシェルで実行すれば対話的環境でインストールが始まる。

```
> sh cuda_7.5.18_linux.run
```

ライセンスを承認、サンプルのインストールの有無、インストールの場所などを聞かれるのでyesとdefaultでだいたいOK。
インストールが完了したらパスとか通す。

```
> export PATH=/usr/local/cuda/bin:$PATH
> export LD_LIBRARY_PATH=/usr/local/cuda/lib64:$LD_LIBRARY_PATH
```

# 参考サイト

* [Debian 7 WheezyにCUDA 5.5をインストールする方法](https://blog.ymyzk.com/2013/10/debian-wheezy-cuda-5-5/)
* [CUDA 6.0をDebian 7 wheezyにインストール](http://nu-pan.hatenablog.com/entry/20140509/1399643154)
Parseがサービス終了する今、選ぶべきはオープンソースBaaS！探し求めていたのはLoopBackだった…！

# BaaSとは？
アプリに必要なユーザ登録、データストア、PUSH通知などのAPIを提供してくれるサービス。
サーバ開発を学ぶことでアプリ開発を止めたくない人とかは良い

# ちょっとした問題
- BaaS使ってたら2ヶ月で仮想サーバ1年分よりもコストがかかった（使い方の問題もあり）
- データのバックアップもとりたいので、自分の管理するサーバにデータを置きたかった

既存のBaaSじゃ無理っぽい…？？

# （追記）Parseがサービス終了という激震
[Parse.com 終了に伴う mbaas サービスの移行方法](http://qiita.com/ogaoga/items/d300e64dbe923ecbdf1c)
これから、BaaSのベンダーロックによる移行問題があらわになっていくと思う。
あまりにも大激震なのでそういう人の助けになれれば…
※ParseもオープンソースでParse Serverを出したが、誰がメンテしていくの問題がありそうなので今回は除外

# そして見つけたこの記事
[オンプレミスの時に。オープンソースなmBaaS×9選](http://blog.mb.cloud.nifty.com/?p=2764)

# 選んだときの観点
- 更新感があること
- 必要な機能が揃っているか
- 機能がなくてもカスタマイズして作れるか

# Githubの最終更新とStarをみた(2015年末時点)
##6ヶ月以内に更新があったもの
- Deployd
- LoopBack
- BaasBox
- Hoodie
- Apache usergrid
- Dream Factory

##Star500以上
- Deployd（3000↑）
- LoopBack（5000↑）
- BaasBox（600↑）

※数はなんとなくだが、Star多いとPRとかissueとか多くなると思うので
※死ぬときは彼らと一緒に心中する連帯感

##結果なんとなくよさげなもの
- Deployd
- LoopBack
- BaasBox

## この中でPUSH通知あるもの
- LoopBack
- BaasBox

# [LoopBack](http://loopback.io/)を触った感想
- カスタマイズ性に優れている
- モデルとかも自分で自由に作れるし、APIも自動で作ってくれる
- 移行前のBaasと同じようなAPIを作成できるのである程度楽なのでは？
- Node.jsとかLoopBackの概念に慣れるまで難しい

Node.jsを触ったことのない自分としては少しハードル高め
ただ、ガッツリjsを書いたりはしなくて済むので、学習コストに関しては大丈夫（なはず…）

# [BaasBox](http://www.baasbox.com/)を触った感想
- セットアップ簡単
- APIが提供されているので、できることがわかりやすい
- カスタマイズ可能だが、かゆいところに手が届かない

途中までは喜々としてコードを書いていたけど、
メアドの確認がなかったり、メアドからパスワードリセットできなかったり、**まだ1.0がリリースされてない**など、ちょっと不安なところあり
コミュニティでも「開発が活発じゃないけど大丈夫？」みたいなこと書かれてたので、現状は選択しない（将来的には改善するかもね）

散々disっておきながらも記事は書いているので参考まで。
[BaasBoxの環境構築でつまづいたこと](http://qiita.com/Mr_Y/items/d9f9cbe35204b4a38793)
[BaasBoxをUnityで触ってみた（ユーザ管理）](http://qiita.com/Mr_Y/items/864ffb419754a28cb48c)

# そしてLoopBack沼に
ようこそ！

# おわりに
環境構築についてはこちらをどうぞ
・[LoopBackをサクッと触ってみた（環境構築からAPIまで）＋おまけでUnity](http://qiita.com/Mr_Y/items/fca1f711c78644f9436a)
・[さくらVPS(Cent OS6.7)上にLoopBackアプリをデプロイする](http://qiita.com/Mr_Y/items/91e9d71d771c75d532bc)
16進文字列と文字列の変換

## Python

### 文字列 => 16進文字列

[binascii](http://docs.python.jp/3/library/binascii.html)モジュールでバイト列を16進文字列に変換することができる。
ユニコード文字列の場合はエンコードしてから変換する。

```py3:Python2/Python3
import binascii
binascii.hexlify(b'Hello') # => b'48656c6c6f'
binascii.b2a_hex(b'Hello') # => b'48656c6c6f'
binascii.hexlify(u'こんにちは'.encode('utf-8')) # => b'e38193e38293e381abe381a1e381af'
binascii.b2a_hex(u'こんにちは'.encode('utf-8')) # => b'e38193e38293e381abe381a1e381af'
```

[codecs](http://docs.python.jp/3/library/codecs.html)モジュールを使うこともできる。

```py3:Python2/Python3
import codecs
codecs.encode(b'Hello', 'hex_codec') # => b'48656c6c6f'
codecs.encode(u'こんにちは'.encode('utf-8'), 'hex_codec') # => b'e38193e38293e381abe381a1e381af'
```

Python2では`str.encode`で変換することもできる。

```py:Python2のみ
'Hello'.encode('hex') # => '48656c6c6f'
```

### 16進文字列 => 文字列

[binascii](http://docs.python.jp/3/library/binascii.html)モジュールで16進文字列をバイト列に変換することができる。
ユニコードにする場合は結果をデコードする。

```py3:Python2/Python3
import binascii
binascii.unhexlify(b'48656c6c6f') # => b'Hello'
binascii.a2b_hex(b'48656c6c6f')   # => b'Hello'
binascii.unhexlify(b'e38193e38293e381abe381a1e381af').decode('utf-8') # => 'こんにちは'
binascii.a2b_hex(b'e38193e38293e381abe381a1e381af').decode('utf-8') # => 'こんにちは'
```

[codecs](http://docs.python.jp/3/library/codecs.html)モジュールを使うこともできる。

```py3:Python2/Python3
import codecs
codecs.decode(b'48656c6c6f', 'hex_codec') # => b'Hello'
codecs.decode(b'e38193e38293e381abe381a1e381af', 'hex_codec').decode('utf-8') # => 'こんにちは'
```

Python2では`str.decode`で変換することもできる。

```py:Python2のみ
'48656c6c6f'.decode('hex') # => 'Hello'
```


## Ruby

### 文字列 => 16進文字列

[String#unpack ](http://ruby-doc.org/core-2.2.4/String.html#method-i-unpack)を使って文字列を16進文字列に変換することができる。

```rb
'Hello'.unpack('H*') # => ["48656c6c6f"]
'こんにちは'.unpack('H*') # => ["e38193e38293e381abe381a1e381af"]
```

### 16進文字列 => 文字列

[Array#pack](http://ruby-doc.org/core-2.2.4/Array.html#method-i-pack)を使って16進文字列を文字列に変換することができる。
必要に応じて[String#force_encoding](http://ruby-doc.org/core-2.2.4/String.html#method-i-force_encoding)で文字コード情報を変更する。

```rb
['48656c6c6f'].pack('H*') # => "Hello"
['e38193e38293e381abe381a1e381af'].pack('H*').force_encoding('utf-8') # => "こんにちは"
```

## Bash

### 文字列 => 16進文字列

`xxd`で文字列を16進文字列に変換できる。

```bash
echo -n Hello | xxd -p # => 48656c6c6f
echo -n こんにちは | xxd -p # => e38193e38293e381abe381a1e381af
```

### 16進文字列 => 文字列

`xxd`で16進文字列を文字列に変換できる。

```bash
echo -n 48656c6c6f | xxd -r -p # => Hello
echo -n e38193e38293e381abe381a1e381af | xxd -r -p # => こんにちは
```

## MySQL

[MySQL :: MySQL 5.6 リファレンスマニュアル :: 9.1.4 16 進数リテラル](https://dev.mysql.com/doc/refman/5.6/ja/hexadecimal-literals.html)

### 文字列 => 16進文字列

```mysql
SELECT HEX('Hello');
-- 48656C6C6F

SELECT HEX("こんにちは")
-- E38193E38293E381ABE381A1E381AF
```

### 16進文字列 => 文字列

```mysql
SELECT x'48656C6C6F';
-- Hello

SELECT x'E38193E38293E381ABE381A1E381AF'
-- こんにちは
```
長いコードのデバッグをするときは、REPLからincludeで評価するようにしましょう

```jlcon
julia> include("/path/to/your_long_file.jl") # ソースコードの中身がすべて評価される
juila> ...
```

以下、よくない例：

```bash
$ julia /path/to/your_long_file.jl
```

理由は、エラーが起きた場合に、再度

- Juliaの起動（1~2秒かかる）
- パッケージの読み込み（場合によっては30秒以上かかる）

をしないといけないからです。`your_long_file.jl` の内容が例えば、

```jl
using Gadfly
using Cxx
...
```

のような内容を含んでいたとすると、ロード時間がとんでもないことになってしまいます。Juliaのスタートアップにかかる時間と、パッケージのロードにかかる時間は、できるだけ節約しましょう。

## 参考

- [[Julia] REPLの中でプログラムソースを取り込むには](http://qiita.com/tenfu2tea/items/f0e147238fbb1de5d037)
//#　←これ



最近あるjavascriptのライブラリを使ってたらソースに  

```
//# sourceMappingURL=http://example.com/path/to/your/sourcemap.map
```

こんなのがあった。しかもサーバー側でsourcemap.mapがないよってエラー出してる。

なんだろうこれは、、、
コメントアウトじゃないのか。。。



これは、ソースマップというもの。

コンパイルされたjsやcssをデバック用に元にもどせるものらしい。
Vagrant コマンドラインインターフェース CONNECT

#CONNECT

##command: vagrant connect ${NAME}
connectコマンドはshareコマンドと同時に使うことにより共有環境（[Vagrant Share](https://www.vagrantup.com/docs/share/)）へのアクセスを可能とする。

####オプション

<dl>
<dt>--disable-static-ip</dt>
<dd>アクセス可能な静的IPをVMで作成不可とする。このオプションがある場合、接続するにはSOCKS proxyアドレスが必要。
</dd>
<dt>--static-ip ${IP}</dt>
<dd>VMで使用する静的${IP}を指定する。デフォルトでVagrantは「172.16.0.0/16」スペースで利用可能なIPアドレスを使用する。</dd>
<dt>--ssh</dt>
<dd>「vagrant share --ssh」で共有された環境へSSH接続する。</dd>
</dl>
Rails4でbefore_renderの実装

※ RubyやRailsの素人なので，用語や表現など間違っているところがあったら，指摘してもらえば幸いです！

## はじめに
コントローラで，あるアクションを処理してから，ビューがレンダーされる前の間に，何かの処理を挟み込む場合ができて，色々考えたり調べたりして方法をまとめてみた．

## 内容
### アプローチ1

`ActionController::Instrumentation#render`をオバーライドする．

```ruby
class UsersController < ApplicationController
  def render(*args, &block)
    foo if action_name == "index"
    bar if action_name == "show"

    super
  end
end
```

でも，Reusabilityがまったくないコードになってしまった…


### アプローチ２
`before_action`，`after_action`のように，`before_render`というフックメソッドとして実装する．
コントローラのコンサーンとして書いて，複数のコントローラで使えるようにする．

```ruby:app/controllers/concerns/before_render.rb
module BeforeRender
  extend ActiveSupport::Concern

  included do
    define_callbacks :render
    alias_method_chain :render, :before_render
  end

  def render_with_before_render(*options, &block)
    run_callbacks(:render) do
      render_without_before_render(*options, &block)
    end
  end

  module ClassMethods
    def before_render(*names, &block)
      _insert_callbacks(names, block) do |name, options|
        set_callback(:render, :before, name, options)
      end
    end
  end
end
```

コントローラでは，こんな風に使える．

```ruby:app/controllers/users_controller.rb
class UsersController < ApplicationController
  include BeforeRender
	
  before_render :foo, only: [:show]
  before_render unless: [:destroy] do |controller|
    bar
  end
	
  def foo
  end
  
  def bar
  end
end
```

## まとめ
ちゃんとできているのか確信はないけど，一通りテストをやってみた結果，思い通りには動いてる．
コードは，http://github.com/cryeo/before_render にまとめておいた．

## 参考
- http://www.perfectline.co/blog/2009/10/ruby-on-rails-before-render-filter/
- http://api.rubyonrails.org/classes/AbstractController/Callbacks/ClassMethods.html
- http://api.rubyonrails.org/classes/ActiveSupport/Callbacks/ClassMethods.html
- http://api.rubyonrails.org/classes/ActiveSupport/Callbacks.html
- http://api.rubyonrails.org/classes/ActionController/Instrumentation.html
Dockerを触ってみた

## 概要
macbookにCentOS7 in Vagrant環境を構築してそのCentOSの中でdockerを試してみた。普段GHEで業務しているのでDockerHubとかの関連性は理解しやすかったです。

## やったこと
### dockerHubの登録
* https://hub.docker.com/
* パブリックリポジトリ作成

### いろいろDockerコマンド叩く
#### いろいろ
* リポジトリの検索
  - `docker search 検索名`
  - webのdockerhubから検索してくれる
* リポジトリのDL
  - `docker pull -a username/リポジトリ`
  - aはすべてのバージョンをダウンロード
* ローカルにあるリポジトリ一覧
  - `docker images`
  - ダウンロードしたり作成したリポジトリの一覧
*  スナップショットの複製
  - `docker commit コンテナ名 username/リポジトリ名:tag`
* dockerHubへのログイン
  - `docker login`
* dockerHubへのpush 
  - `docker push username/リポジトリ名`
* コンテナ情報の表示。停止中も含む。  
  - `docker ps -a`

#### コンテナー
* コンテナイメージ作成
  - `docker build -t username/リポジトリ名:tag Dockerfileの場所`
* コンテナの起動
  - `docker run -it --name コンテナの名前 username/リポジトリ:tag シェル`
  - コンテナ起動時にスナップショットを作成するみたい。このスナップショットがルートファイル・システムだと理解
* コンテナ接続
  - `docker attach コンテナ名`
* コンテナ停止
  - `docker stop コンテナ名`
* コンテナの再起動
  - `docker start コンテナ名`
* コンテナ破棄
  - `docker rm コンテナ名`

#### コマンド実行
* コンテナに接続しないでコマンドを実行
  - `docker exec コンテナ名 実行したいコマンド`

#### プライベートリポジトリ作成
  * 複製でプライベートリポジトリ用を作成
    - `docker commit コンテナ名 IP:Port/username/リポジトリ名:tag`

#### Dockerfile
  * コンテナイメージの作成手順を記載したファイル
  * これと合わせて実際にコンテナで使用するファイルを準備して、Dockerfileと同じディレクトリに入れる必要がある。

#### わかったこと
* コンテナイメージはコンテナのルートファイル・システムになる
* DockerHubはコンテナイメージを管理。各ユーザのリポジトリにはコンテナイメージの複数のバージョンがある。各バージョンにはタグ名で管理されている。
* 上で作成したコンテナではシェルしか動いていなかった。OSなしどころかシェルのみ。このあたりはDockerが各プロセスの名前空間をうまく使用して管理しているはず。
* 参照
  - [PID名前空間](http://qiita.com/saikoro-steak/items/382152b09d90507612f0)
  - [マウントと名前空間めもめも](http://qiita.com/saikoro-steak/items/b36129bdf79645c91fe7)
* 図↓みたいなかんじ
![image](https://qiita-image-store.s3.amazonaws.com/0/91729/15a9a1d8-3d53-d292-fdba-fcc62e9d6a72.png)
日本語はとても難しい

今となっては懐かしい Source Forge にて、<a href="https://osdn.jp/magazine/08/05/13/0713213">点字翻訳をする Lisp のプログラム</a> をオープンソースで公開していました。
形態素解析ライブラリを使用すると（Common Lisp でアレコレ遊ぶ）自分の愉しみが減るので、フルスクラッチで書きました。誰に教わるともなく必要に迫られて自然に N-gram とかをやってたんですが、難しかったのは日本語ではなく英語の短縮形でした。

日本語学習や日本語の点字では、適切に分かち書きをすることが最優先課題です。
日本語をきちんと <b>文節に分割できる MeCab 用のポストプロセッサ</b> があると最高なんですけどね...
mrubyでORM


## 背景

どうやらmrubyがはやっているらしく、素朴にRailsないのかな？と思っていたが、mrubyのcoreは

* requireがない
* データベースにアクセスできない
* 正規表現が使えない

というものだった。組み込み向けなので当たり前と言えば当たり前なのだけど。
ところが先日、アメミヤさんの [ISUCON2015で仕込んでいたネタ(h2o + mruby)の供養をする記事](http://rail.hatenablog.jp/entry/2015/10/01/172931) というのを読んで、これを改造すれば少しだけORMっぽいことができるのでは、と思ってやってみた。

## 注意点

実用性はない。

## 成果物

https://github.com/firewood/h2o

## やったこと

* mruby-activerecordというgemを用意
* app以下にアプリケーションを作成
* アメミヤさんのISUCON用h2oをOSXでビルドできるように修正

## mruby-activerecord

Rubyのものに名前を合わせた。

* ActiveRecord::Base
 * attributesなどを提供
* ActiveRecord::Relation
 * 最低限のallとwhereを提供
* ActiveRecord::Schema
 * スキーマ定義からモデルを作成

例えば User.where('name = ?', 'hoge') を実行すると ActiveRecord::Relation が返ってきて、中身を評価するときにSQLを実行する、というような感じ。

## app以下

app/models とか app/controllers など、何となくそれっぽい名前にした。
データベースはYAMLではなくrbで、establish_connectionを提供するようにしている。
mruby-r3のルーティングは app/config/routes.rb の中に置いた。
app/app.rbで全てをrequireしていて、h2oからはapp/app.rbを読み込む。

## ビルドの修正

OSXでHomebrew環境のとき、ライブラリのパスを指定してやる必要があり、mrbgem.rakeやCMakeLists.txtを修正した。以下のような感じでmysql_configやpcre-configを呼び出す。
CMakeはautoconfよりもわかりやすいなあと思った。

```diff
+    FIND_PROGRAM(MYSQL_CONFIG mysql_config)
+    EXEC_PROGRAM(${MYSQL_CONFIG} ARGS --libs OUTPUT_VARIABLE MYSQL_LIBRARY_DIRS)
+    STRING(REGEX REPLACE "-L([^ ]*)( .*)?" "\\1" MYSQL_LIBRARY_DIRS "${MYSQL_LIBRARY_DIRS}")
+    LINK_DIRECTORIES(${MYSQL_LIBRARY_DIRS})
```

あとmruby-r3がr3のmasterに追従していなかったのでpullreq投げた。

※ mruby-r3のOSX対策はマージされていない。
https://github.com/firewood/mruby-r3/commit/e2c69a01f16b9ffa29c81b8f118439afd17b7e6b
を参照のこと。

## データベースの準備

サンプルではmysql上にsampleデータベースのusersというテーブルがあるのが前提。以下で作れる。
このRailsで作ったschema.dbをmrubyでそのまま利用している。

```bash
$ git clone https://github.com/firewood/rails_tutorial2.git
$ cd rails_tutorial2
$ git checkout mysql
$ vi config/database.yml  (※ 任意のエディタで)
$ bundle install
$ ./bin/rake db:migrate
$ ./bin/rake db:seed
```

## ビルド

CMakeなど、h2oがビルドできる状態が前提。

```bash
$ git clone https://github.com/firewood/h2o.git
$ cd h2o
$ cmake -DWITH_MRUBY=ON .
$ make h2o
```

## 起動 (h2o)

このサンプルではポート8000でlistenする。(ベンチマークかけると死んだりする...)

```bash
$ export MYSQL_USERNAME=<mysql username>
$ export MYSQL_PASSWORD=<mysql password>
$ ./h2o -c app/app.conf
```

## 起動 (mirb)

```bash
$ ./mruby/host/bin/mirb
mirb - Embeddable Interactive Ruby Shell

> require 'app/models/user.rb'
 => true
> require 'app/config/database.rb'
 => true
> require 'app/db/schema.rb'
 => true
> User.all
 => #<ActiveRecord::Relation [#<User {"name"=>"Hoge", ...

```

## ベンチマーク

Core i7 3.4GHzの仮想環境下のLinux。
RailsはUnicornでワーカープロセス4、mrubyはh2oでワーカースレッド4、wrkで4スレッドで同時100アクセスを指定。
DBアクセスありは User.all を発行。なしは静的なJSONを返すだけ。

Rails DBアクセスあり 800 reqs/sec
Rails DBアクセスなし 1400 reqs/sec
mruby DBアクセスあり 2000 reqs/sec
mruby DBアクセスなし 80000 reqs/sec

mrubyはサーバのワーカースレッドと一緒に初期化されるので、応答性が良い。
ちなみにmruby-r3をやめて、callメソッド内で単純な文字列を返すだけにすると120K reqs/secくらい出るが、何個かオブジェクトを生成するだけですぐに半分以下の速度に落ちる。
なので本来の目的(アプリケーションの前段など補助的な使い方)が良さそう。

## 感想

ちょっとだけRailsのソースを読んだりした。
車輪の再発明楽しい。
RaspberryPi2でウェブサイト構築（Step1 : webmin & virtualmin導入）

RaspberryPi2を利用してウェブサイトを構築していきます
OS(*raspbian jessie*)がインストールされている状態から始めていきます
<br>
まずはwebminとvirtualminの導入から・・・
<br>
>#1. webmin インストール

###1-1. 必要なファイルのインストール

```
sudo apt-get install perl libnet-ssleay-perl openssl libauthen-pam-perl libpam-runtime libio-pty-perl apt-show-versions
```
###1-2. webminパッケージのダウンロード
2016/1/24時点の最新バージョン(1.780)

```
wget http://prdownloads.sourceforge.net/webadmin/webmin_1.780_all.deb
```

###1-3. webminインストール実行

```
sudo dpkg --install webmin_1.780_all.deb
```

###1-4. webmin専用rootパスワードの設定
以下コマンドではパスワードを「password」に設定しています

```
sudo /usr/share/webmin/changepass.pl /etc/webmin root password
```

###1-5. webminの稼働確認
WEBブラウザでポート10000番でアクセスし、
1-4で設定したパスワードでログインできるか確認します

![webmin_login.jpg](https://qiita-image-store.s3.amazonaws.com/0/110891/f89cc2f4-d243-a9ed-af9a-8d81e37ba886.jpeg)

<br>
>#2. virtualmin インストール

###2-1. virtualminパッケージのダウンロード
2016/1/24時点の最新バージョン(4.19)

```
wget http://download.webmin.com/download/virtualmin/webmin-virtual-server_4.19.gpl_all.deb
```

###2-2. virtualminインストール実行

```
sudo dpkg --install webmin-virtual-server_4.19.gpl_all.deb
```

###2-3. virtualminテンプレートのダウンロード
2016/1/24時点の最新バージョン(9.2)

```
wget http://download.webmin.com/download/virtualmin/webmin-virtual-server-theme_9.2_all.deb
```

###2-4. virtualminテンプレートインストール実行

```
sudo dpkg --install webmin-virtual-server-theme_9.2_all.deb
```

<br>
>#3. virtualmin 初期設定

###3-1. webminから必要なモジュールをインストール
- Apache Webserver
- BIND DNS
- Postfix Mail Server

左側のメニュー「Un-used Modules」から選択
![webmin_module.jpg](https://qiita-image-store.s3.amazonaws.com/0/110891/778012e6-a133-2906-9405-a716bcace666.jpeg)

###3-2. Apacheの設定変更
Apacheの設定画面から
*Configure Apache Modules*　の　*actions*　にチェックを入れて save

![webmin_apache.jpg](https://qiita-image-store.s3.amazonaws.com/0/110891/1b919de8-1a0f-4181-0c2c-05d60c9467dc.jpeg)


###3-3. Postfixの設定変更
Postfixの設定画面から */etc/postfix/main.cf* に以下のパラメータを追加

```
virtual_alias_maps = hash:/etc/postfix/virtual
```

###3-4. virtualminテンプレートの設定変更
virtualminの設定画面から Default Settings テンプレートを編集

![virtualmin_template.jpg](https://qiita-image-store.s3.amazonaws.com/0/110891/5ee641fe-3d89-5131-e821-180c58624a52.jpeg)

*Edit template section* の *Apache website* で
*Automatically add appropriate SuExec directive?*　を *No* に変更


![virtualmin_apache.jpg](https://qiita-image-store.s3.amazonaws.com/0/110891/a5ae36ca-a087-1f38-fe95-bfa7ec47de86.jpeg)


###3-5. 不要なプラグインの無効化
今回の要件では不要なプラグインは無効化しておきます
（要件によっては使用することもありますので必要に応じて）

virtualminの設定画面にある *Features and Plugins* から設定変更します

- BIND DNS domain
- Webalizer reporting

![virtualmin_plugin.jpg](https://qiita-image-store.s3.amazonaws.com/0/110891/898a8366-4e8a-f3f8-08cb-a5c38d43a501.jpeg)



これで導入完了です。
次はVirtual Serverの作成をします。
[Silverlight] TextをWrapする方法

MaxWidthかWidthが設定されていないとどこでWrapしていいかわからないようです。
そのため、自分の親要素のActualWidthをMaxWidthにバインドすることで解決できそう。

```xml:MainView.xaml
<UserControl x:Class="SilverlightApplication3.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100"></ColumnDefinition>
            <ColumnDefinition Width="auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <StackPanel Grid.Column="0">
            <Button Content="Resize" Click="Button_Click"></Button>
        </StackPanel>
        <StackPanel x:Name="Parent" Grid.Column="1" Width="300">
            <TextBlock
                x:Name="tb"
                TextWrapping="Wrap"
                MaxWidth="{Binding ElementName=*Parent*, Path=ActualWidth}"
                Text="テスト22222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222"></TextBlock>
        </StackPanel>
    </Grid>
</UserControl>
[js] よく出るsetTimeoutのテンプレート

#setTimeoutの典型的な使い方
javaScriptのsetTimeout関数の使い方をタイマーを例としてメモ。

```html:timer.html
<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>TimerTest</title>
</head>
<body style="text-align:center">
	<p id="timer">0.00</p>
	<button id="start">START</button>
	<button id="stop">STOP</button>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
	<script src="timer.js"></script>
</body>
</html>
```
<img width="146" alt="スクリーンショット 2016-01-28 00.03.34.png" src="https://qiita-image-store.s3.amazonaws.com/0/110584/39361be0-de5d-8b71-d4ac-c3bc3e4fd901.png">

```js:timer.js
$(function() {
	var timer;	//setTimeout closure
	var stTime = 0;	//start time
	var runFlag = false;	//check timer run

	$('#start').click(function() {
		if(runFlag) return;	//prevent repitition
		runFlag = true;
		stTime = $.now();
		updateTimer();
	});

	$('#stop').click(function() {
		if(!runFlag) return;
		runFlag = false;
		clearTimeout(timer);
	})

	function updateTimer() {
		timer = setTimeout(function() {
			var t = $.now() - stTime;
			$('#timer').text((t / 1000).toFixed(2));
			updateTimer();
		})
	}
});
```
<img width="153" alt="スクリーンショット 2016-01-28 00.03.54.png" src="https://qiita-image-store.s3.amazonaws.com/0/110584/df6a95e2-9d18-f1ba-3d1d-92483a3f0e03.png">
おわり。

#注意
きちんと制御しないとSTARTをクリックする度タイマーが発動し、荒ぶる。
playframework + Angular2 + gulp を始めるための準備

# 5 miniutes quickstart を参考に
https://angular.io/
https://angular.io/docs/ts/latest/quickstart.html

# こんな感じに
https://github.com/FScoward/ticketter

gulpでpublic/javascripts配下にコピーしてるけど、あまりイケてないので変えたほうが良い。
ansible でファイルの中身matchで実行したいなら when + lookupがオススメ！

コントロール側にあるファイル（設定ファイル等）の中身を正規表現で match したときのみ実行したい場合のベストプラクティスを考えてみました。

```yaml:ファイルの中身が正規表現でmatchした場合のみ実行
- debug: msg="foo"  # 実行したいコマンド
  when: lookup("file", ファイルのパス) | match("正規表現")
```

ファイルが無くてもエラーにならないようにしたいなら、[これ](http://qiita.com/waterada/items/8b938eea4fa90eaf2ec2) と組み合わせて:

```yaml:ファイルが無くてもエラーにならない
- debug: msg="{{item}}"  # 実行したいコマンド
  when: item != None and lookup("file", item ) | match("正規表現")
  with_first_found:
    - ファイルのパス
```

とすればOKです。


[lookup()](http://docs.ansible.com/ansible/playbooks_lookups.html) はいろいろできて便利です。 `lookup('pipe', 'シェル')` でシェルの結果をもとに何かすることもできますし、CSV や ini ファイルから特定情報を取り出す機能も持っています。要望があればまた、記事にしますね。


こっちのほうが良い！ という方法がありましたら、是非、コメントください！！
アクセス解析で被リンク元のSecret GistのURLがわかるのか調べてみた

# はじめに
Secret Gistというのは，GitHubの非公開Gistです．非公開といっても，URLさえ知っていれば誰でも閲覧できるようになっています．
Secret Gistに参考になりそうなサイトやブログのリンクを貼って，知り合い数人にSecret GistのURLを教えるということをしていました． 
ふと，ブログを書いているような方々は，被リンク元のURLを確認していることが多そうですし，Secret GistのURLはリンク先の方々からは知られているのではないかと思い，検証することにしました．

# Secret Gist
以下のスクリーンショットのように，私のQiitaのマイページへのリンクをSecret Gistに載せました．
![スクリーンショット 2016-01-27 23.10.12.png](https://qiita-image-store.s3.amazonaws.com/0/94551/67f2a642-1d8c-f1be-c49b-f3093ac9822b.png)
# Google Analytics
Google Analyticsは無料の解析ツールで，リアルタイム解析も行うことができます．
Qiitaで解析を行うために，Google Analyticsを利用します．本記事では手順は割愛致しますが，以下の記事が参考になると思います．
[QiitaでGoogleアナリティクスを利用する手順](http://qiita.com/Qiita/items/c7f704e3786df3aa7a11)

# 試してみる
先ほど作成したSecret Gist内のURLをクリックしてQiitaのマイページを開きます．
Qiitaのマイページを開いたまま，Google Analyticsから確認をします．
`リアルタイム` → `サマリー` と選択します．
結果は以下のようになりました．
![スクリーンショット 2016-01-27 22.53.56.png](https://qiita-image-store.s3.amazonaws.com/0/94551/07aee3f1-ca2f-786f-a287-b5fa59a64161.png)

# わかったこと
~~`アクティブなページ`には，GitHubのユーザー名が表示されています．~~ ←リンク先のQiitaの方です．
`ソース` には `gist.github.com` と表示されており，Gistにおいてリンクが貼られていることがわかります．
Google Analyticsを使用した場合，
~~Secret GistのURLまではわからないようですが，少なくとも「誰が」「(Secret) GistにURLを貼った」~~
「Gistにリンクが貼られていて、そこから飛んできた人がいる」
というところまでは知ることが可能であることがわかりました．
（コメントをいただき，指摘していただいた誤っていた箇所を修正しました．(2016/1/29)）
LTE by Rasberry pi #1

#Rasberrypi rasbian jessie install

**SDFormatter**を使用してSDカードの初期化する。
「オプション設定」のデフォルトは
クイックフォーマットなのでイレースフォーマットにすればOK
理論サイズ調整は変更必要なし

**Win32DiskImager**でimageをSDに書き込む。
2015-11-21-raspbian-jessie.imgを公式サイトからダウンロードして、win32diskimageにおいて「write」

これでラズちゃん動くはず

#Rasberrypi rasbian jessie セットアップ

rasberry Pi configurationのsystemにおいて
・「Filesystem:Expand Filesystem」押下
・ホストネーム変更
・「To CLI」にチェック
・「Auto login」のチェックを外す

SDカードをいっぱいまで使えるようになったな
>df -m

で確認したらすでに22％も使ってるねんて。

これでいきなりGUIに行かなくなった。
デフォのアカウント情報は
>ユーザ名: pi
>パスワード: raspberry

GUIに行きたくなったら
>startx

interfaceタブでは
「SSH」と「`Serial`（なんこれ）」をONに

performanceは無視

Localisationタブでは
全部設定！日本っぽいやつに

#日本語
いっぱいインストールするぞと息巻いていましたが文字化け発生です。
検索すれば対処法がたくさんでてきました。こういうことやったんか。

普通に日本語フォントインストールしました。
GUIの方は上手いこと行きました。
しかし、コンソールでは文字化け～
>$ sudo apt-get install ttf-kochi-gothic xfonts-intl-japanese xfonts-intl-japanese-big xfonts-kaname

日本語入力のためのメソッドをインストール
**uim**のほかに`ibus`や`scim`もあるみたいやね・・
>sudo apt-get install uim uim-anthy


**jfbterm**をインストールしました。
実行すると全画面blackscleenで日本語表示できる画面に遷移しました～
aptitudeを使う意味はわかりません！
>sudo aptitude -y install jfbterm
>jfbterm
 

#ソフトウェアインストール
気を取り直してインストール
とりあえず
>sudo apt-get update
>sudo apt-get upgrade
>sudo apt-get rpi-upgrade

`rpi-upgradeって？
Raspberry Piのファームウェア更新してくれる。（わけわかめ）`

ltepiのセットアップツールとサンプルプログラムGET
>mkdir ltepi
>cd ltepi
>wget http://lte4iot.com/downloads/ltepi/ltepi-setup-1.0.0.tar.gz
>wget http://lte4iot.com/downloads/ltepi/sample-20150618.tar.gz

疲れました。


##シャットダウン
linuxと同じですね～
>sudo shutdown -h now
もしくは
>sudo halt

haltやとフリーズしたんやけど（もういやっ）
とおもってたら正常動作らしい末行に「System halted」で止まるらしい。めっちゃ迷惑。
コマンドを打ったらしばらくACTのLEDがチカチカする。
その後点灯しなくなるので、そうしたらおもむろにUSBケーブルを抜けばいいみたい
MediaWikiを移動させる

[MediaWiki](https://www.mediawiki.org/wiki/MediaWiki)は[Wikipedia](https://ja.wikipedia.org/wiki/%E3%83%A1%E3%82%A4%E3%83%B3%E3%83%9A%E3%83%BC%E3%82%B8)でも使われているWikiクローン。PukiWikiとは違い、データベースを使うので、簡単に移動することは難しい。
今回は、MediaWikiをサーバまたぐ大移動を行うための方法を紹介する。
*注意：この方法が正しい方法だ、というわけでもありません。自分が考えた独自の方法です。*
# MediaWiki 本体のコピー
MediaWikiは記事を表示したり、編集を保存したりするプログラム本体(拡張機能含む)と記事や画像を保存しておくデータベースに別れる。MediaWikiを新しいサーバに移動するには、ただファイルを移動されればよい。

1. 旧サーバからファイルを全てローカルにダウンロード
2. 新サーバにファイルを全てアップロード

これだけだ。とても簡単だ。この状態でアクセスしてもデータベースが無いのでエラーが表示される。(PukiWikiの場合、これで動作する(ハズ)。)
# データベースの移動
データベースは何で移動するか。SSHからコマンドを叩いてもいいのだが、今回はphpMyAdminを使用する。
phpMyAdminでデータベースにログインする。エクスポートを選び、*データベース "databasename" からテーブルをエクスポート*が表示されれば成功。設定をし、エクスポートする。

1. エクスポート方法を「詳細」に変更 → 項目が増えるが後回し
2. 出力、フォーマット、フォーマット特有のオプションはいじらない
3. 生成オプションで「DROP TABLE / VI … コマンドを追加する」にチェックを入れる
4. エンコーディングの変換もいじらない

このまま一番下にある実行を押すとデータベースのデータがダウンロードされるが非常に(サイズが)大きいので、分割する。
後回しにした「テーブル」で全てのテーブルを選択せず、

1. 3つ4つ、選択し、実行を押してダウンロード。
2. また別のテーブルを選択し、実行を押してダウンロード。
3. 全てのテーブルをダウンロードし終わるまで繰り返す。

今度は移動先のデータベースで操作する。インポートを選び、*データベース "newdatabasename" へのインポート*と表示されていれば成功。

1. *参照...*にファイルを指定し、他の設定はいじらずに実行を押す。
2. 全てがインポートできるまで繰り返す。

これで、エクスポート・インポートが完了する。
<img height="150" alt="db.png" src="https://qiita-image-store.s3.amazonaws.com/0/111002/dd2c2bfa-d045-6bd8-3fcf-a159446498e5.png">
テーブル構造がこのようになっていれば大丈夫だ。今回はプレフィックスに*wiki_*を利用している。(クリックで拡大します)
# 設定を変更
*LocalSettings.php*を編集する。サーバの環境が同じの場合はこの部分のみ変更するとよい。

```php:LocalSettings.php
$wgServer = "newserver";
$wgDBserver = "localhost";
$wgDBname = "newdbname";
$wgDBuser = "newdbuser";
$wgDBpassword = "newdbpwd";
```

メール送信等利用している場合は変更すること。
# 最終確認
新しいWikiにアクセスして動作を確認する。最近の更新、記事、画像、ページの保存等、基本的な動作を確認する。また、*特別:バージョン情報*で拡張機能が認識されているか、スクリプトパス、記事パスが正常かどうかも確かめる。
# あとがき
大雑把ながらMediaWikiの移動方法を執筆した。これからの投稿もMediaWikiを中心にHTMLなども投稿していきたい。
Timelionのローカルインストール

#前提条件
Kibanaのバージョンは4.3.1です。elasticsearchは2.1.0になります。
#あらすじ
KibanaにTimelionを入れたいなと思ったのですが、仕事で使用しているサーバはインターネットに繋がらなかったりします・・・。ならばローカルインストールをしようと思ったのですが、[github](https://github.com/elastic/timelion)には
>You can not install from the archives that github provides. They are not built versions, they won't work, use the command above.

なんて書かれています。無念。

#なんかできた
若干諦めかけたのですが、[ここ](https://discuss.elastic.co/t/installing-timelion-with-no-internet-access/36157)にやり方がありました。  
####まず最新版のアーカイブを[こちら](https://download.elasticsearch.org/kibana/timelion/timelion-latest.tar.gz)より取得
####次に取得したアーカイブをサーバに移動し、Kibanaのpluginコマンドでローカルインストールします。
```
bin/kibana plugin -i timelion -u file://【アーカイブのパス】
```
####インストール後、Kibanaを再起動すると使えるようになりました！![timelion.png](https://qiita-image-store.s3.amazonaws.com/0/32922/9373c6c8-9f44-00c1-2a23-742564149c5f.png)
vagrant 1.8.x でvagrant-vbox-snapshot ではなく vagrant 1.8.x で標準搭載されたsnapshotコマンドを利用するには

## 実現したいこと

  vagrant 1.7.x から vagrant 1.8.x にアップデートした際にデフォルトで導入されているsnapshot機能を利用したいが、下記のエラーメッセージが出力されて利用できない場合の対処をする。

## 実現方法および解決方法

vagrant-vbox-snapshotプラグインを削除する

### vagrant 1.8.x 標準のsnapshot機能の利用に失敗した例

```
$ vagrant snapshot save centos6.x_init
Usage: vagrant snapshot <command> [<args>]

Available subcommands:
     back
     delete
     go
     list
     take

For help on any individual command run `vagrant snapshot <command> -h`

$
```

## 原因

pluginで導入したvagrant-vbox-snapshotがvagrant 1.8.xのデフォルトのsnapshot機能よりも優先されているため、コマンドラインオプションが適切でないことが理由にエラーメッセージが表示され、vagrant 1.8.x のデフォルトのsnapshot機能が利用できない。


## インストールしているvagrantプラグインを確認する

* この場合、vagrant-vbox-snapshotがインストールされているか確認する

```
$ vagrant plugin list
vagrant-share (1.1.5, system)
vagrant-vbox-snapshot (0.0.10)
$
```

## vagrant-vbox-snapshotをアンインストールする

```
$ vagrant plugin uninstall vagrant-vbox-snapshot
Uninstalling the 'vagrant-vbox-snapshot' plugin...
$
```

## vagrant 1.8.x のデフォルトの機能を利用してsnapshotを取得する

```
$ vagrant snapshot save centos6.x_init
==> default: Snapshotting the machine as 'centos6.x_init'...
==> default: Snapshot saved! You can restore the snapshot at any time by
==> default: using `vagrant snapshot restore`. You can delete it using
==> default: `vagrant snapshot delete`.
$
```
## snapshotが適切に取得できことを確認する（実行コマンド）

```
$ vagrant snapshot list
centos6.x_init
$
```

## 補足

### vagrant plugin 関連の操作コマンド

```
$ vagrant plugin
Usage: vagrant plugin <command> [<args>]

Available subcommands:
     install
     license
     list
     uninstall
     update

For help on any individual command run `vagrant plugin COMMAND -h`

$
```

## 情報源

* https://www.hashicorp.com/blog/vagrant-1-8.html