OmniAICreator/Qiita-1.07M huggingface dataset:
JavaScript 複数のクラスを取得する

#JavaScriptで複数のクラスを取得する

さて、今回のこの記事ですがどういう時に使うのか。

こんなHTMLがあったとします。

``` index.html

<!DOCTYPE html>
<html lang="ja"></html>
<head>
  <meta charset="utf-8" />
  <title>タイトル</title>
  <link href="./css/style.css" media="all" rel="stylesheet" type="text/css" />
</head>
<body>
  <ul>
    <li class="box box-1">Box1</li>
    <li class="box box-2">Box2</li>
    <li class="box box-3">Box3</li>
    <li class="box box-4">Box4</li>
    <li class="box box-5">Box5</li>
  </ul>
　<div>
    <p class="box-1-detail">Hello from Box1</p>
    <p class="box-2-detail">Hello from Box2</p>
    <p class="box-3-detail">Hello from Box3</p>
    <p class="box-4-detail">Hello from Box4</p>
    <p class="box-5-detail">Hello from Box5</p>
  </div>
  <script charset="utf-8" src="./js/jquery.min.js"></script>
  <script charset="utf-8" src="./js/main.js"></script>
</body>

```

例えばJS初心者AさんはBox1をクリックしたらp要素のBox1のものを表示する。みたいなことがしたいとします。

cssでレイアウトするのに、liの基本スタイルは同じなのに

``` style.css

box-1,box-2,box-3,box-4,box-5{
  color: white;
}

```

みたいなのはアホらしいので

``` style.css

box{
  color: white;
}

```

で、できるように全部にboxと言うクラスをつけました。

そして、問題のAさんのjsはこんな感じ

``` main.js

$(function(){
  $(".box-1").on("click",function(){
    $(".box-1-detail").show();
  });
  $(".box-2").on("click",function(){
    $(".box-2-detail").show();
  });
  $(".box-3").on("click",function(){
    $(".box-3-detail").show();
  });
  $(".box-4").on("click",function(){
    $(".box-4-detail").show();
  });
  $(".box-5").on("click",function(){
    $(".box-5-detail").show();
  });
});

```

js初心者丸出しなコードですね。筆者自身こんなダサいコード書いた覚えがあります。

これをスマートにしていきたいと思います。

今回注目するべきはliに振られている`.box-1`とpに振られている`box-1-detail`です。

これを使ってうまいことjsを圧縮したいと思います。

コードはこちら

``` main.js

$(function(){
  $(".box").on("click",function(){
    var class = $(this).attr("class");
    var class_Array = class.split(" ");
    $("."+class_Array[1]+"-detail").show();
  });
});

```

これで全てOKです。

コードの説明をしていきます。

`$(".box").on("click",function(){`
これはもうおなじみのclick操作が来たらコールバック関数を呼びます。

`var class = $(this).attr("class");`
これですがまず`class`という変数を作り、thisを使ってクリックされた要素を特定し、attrを使ってクラス名を取得します。
この時点でclassには`box box-1`などが入っています。

`var class_Array = class.split(" ");`
classには空白の入ったクラス名が文字列で入っているので空白で区切り、配列に入れます。
この時点でclass_Arrayには
`
class_Array[0] -> box
class_Array[1] -> box-1
`

が入っている状況です。

そして

`$("."+class_Array[1]+"-detail").show();`
文字列の連結を使い、`. + box-1 + -detail`で`.box-1-detail`となり、最初と同じ挙動をするということです。

コードが間違っている場合はコメント、もしくは[konojunya](http://twitter.com/konojunya/)へ投げてください！
AWS-SDK-Goでec2metadataを使う


俺です。
EC2でGoバイナリポイー大作戦するとき、ec2metadataを使うとhttp://169.254.169.254/latest/meta-data へアクセスせずに楽ができます。

regionを取得する例)

```
func getRegionFromInstanceMetaData() (region string) {
	metadata := ec2metadata.New(session.New())
	region, err := metadata.Region()
	if err != nil {
		panic(err)
	}
	return region
}
```

楽ちん

- reference

http://docs.aws.amazon.com/sdk-for-go/api/aws/ec2metadata.html
jQuery使ってみない？

#jQuery使ってみない？ ~ Why don't you use jQuery ? ~

さて、主題の通り今回の記事は、初心者の方へ向けての記事ですので
jQuery普段から使ってる方は見る必要０です。笑

今回の流れ

- jQueryの導入
- jQueryの簡単な使い方の説明

となっています。

##jQueryの導入

まずは公式サイト
[jQuery ホームページ](https://jquery.com/)

この公式サイトに飛び**Download jQuery(オレンジ色)**をクリック
![jquery home page](https://qiita-image-store.s3.amazonaws.com/0/90347/7a7f849f-ba47-fdc7-a0f0-048264a5d554.png)

ページが変わったら**Download the compressed, production jQuery 1.12.0**をクリック
![jquery home page](https://qiita-image-store.s3.amazonaws.com/0/90347/662883d6-5a52-8589-54dd-fb9ab4dd953f.png)

すると *jQuery-1.12.0.min.js* がダウンロードされると思います。

ではHTMLにjQueryを読み込みましょう。

``` index.html
<!DOCTYPE html>
<html lang="ja"></html>
<head>
  <meta charset="utf-8" />
  <title>タイトル</title>
</head>
<body>
  <h1 id="hoge">Hello World</h1>
</body>

```

とまぁこんなHTMLを書いたとして読み込む場所ですがcssとは違い`</body>`の直前がいいとされています。
なので

``` index.html
<!DOCTYPE html>
<html lang="ja"></html>
<head>
  <meta charset="utf-8" />
  <title>タイトル</title>
</head>
<body>
  <h1 id="hoge">Hello World</h1>
  <!-- ここに読み込む -->
  <script charset="utf-8" src="./js/jquery-1.12.0.min.js"></script>
</body>

```

気をつける点は**パス**です。

このコードの場合、index.htmlから見て`./js/jquery-1.12.0.min.js`なので

index.htmlと同一ディレクトリにjsフォルダがあり、その中にjqueryがあるという状況です。

では、jQueryを書いていきましょう。

##jQueryの使い方

ここまでで、jQueryの導入はみなさん終わっていると思います。

なのでコードを書いていきましょう。

今回 `main.js`なるファイルを作りそこにjavascriptを書いていきます。

``` main.js
$(function(){
//これがjqueryを使い始めるよという合図です

  $("#hoge").css("color","red");

});
```

これがjqueryで書いた場合の文字を赤にする方法です。

もしこれをjqueryを使わずに書くと

``` main.js

var hoge = document.getElementById("hoge");
hoge.style.color = "red";

```

となるかと思います。

jQueryのコードを詳しく見てみましょう。

``` main.js

$(function(){

  // $(セレクタ).メソッド
  $("#hoge").css("color","red");

});

```

と言うふうになっていて、セレクタにはタグの名前、class、idが入ります。

注意として、cssでもそうですが
`
id -> #
class -> .
`

に従ってください。

次にメソッドですが、これはもうたくさんあるのでその度にググってみてください！

***さぁこれで君もjQuery使いだ！！！！！***


PS.
ご質問等は[こちら](http://twitter.com/konojunya/)で受け付けてます！
reactで趣味Webサイトを作ってる話


作っているもの: http://billboard-tv.tk/
github: https://github.com/abeyuya/billboard-tv


serverlessとかreactに興味があったので、土日とかに勉強がてら、billboard-tvというWebサイトをちまちま作っています。

今まで趣味プログラミングのコードを公開してなかったけど、公開した方がいろいろ良いよなぁ、と思い公開してみた。

その解説の記事です。
(だらだらと感想文みたいになってしまいました...)

一人でやるよりも誰かの目に晒した方がやる気が出るかもしれないしね!:beer:

serverless編: http://qiita.com/abeyuya/items/28d2da771582ff1139a8


# ケチる

趣味サイトだし、サーバーレスで構築するし、できるだけ無料でやることを目指してたけど、現状だと月に$1弱くらいかかっています。

# ざっくり構成

インフラ系は全てAWSに乗っけています。AWS好き。

フロントは完全に静的配信をしていて、reactで書いてgulpとかでビルドしてS3にホストしています。
気になる人はリポジトリ覗いてみて下さい。
このS3で月に$0.04くらい。


ドメインはdot.tkというところで無料で取れた!:smile: 
けどRoute53で管理してるので、これが月に$0.5くらい。
ここ調べたけど無料にする方法が思いつかなかった。

EC2だとMyDnsってサービスで無料ドメイン運用してたけど、今回みたいな構成だと無料にする方法がわからず。

# serverless

今回のWebサイトだと動的に更新する箇所がランキング情報しか無いのですが、そこはserverlessでやるようにしている。


serverlessってのはこれ https://github.com/serverless/serverless

こいつはlambdaとAPIGatewayの課金だけど、今回みたいに細々使うだけなら無料枠に収まる。

amazon様ありがとうございます :pensive: 

serverlessで定期的にランキング情報を取得して、jsonをS3に吐く。

serverlessについての記事はまた別途書く予定。


# 初めてのReact.js

rebuild.fmとかwebの記事とかでreactの名前だけやたら目にしたけど、やっと皆が何を言っているのかが少しわかった感じ。

個人的な感想としては、今回みたいに軽く使う程度なら、そんなに難しいものでは無いように感じた。

学習コストがそんなに高いものではないし、興味がある人はちょろっと何か作って見ると、reactが何なのか腹落ちすると思う。

どっちかと言うとモダンフロントエンドの環境構築に苦労した。

# 初めてのモダンフロントエンド

ぼくは仕事ではあまりjsは書かない。
だけど、gulpでビルドしたりとかのモダンフロントエンド界隈はちょっとオシャレでイケててモテるイメージがあったのでぜひモテたいと思っていたし、今回一通り触ってちょっと垢抜けたと思う。

ただ、一通りビルド-デプロイとかやってみたけど、すげえ面倒くさい世界だなと思った。

Rails脳なので、結局Railsみたいなことがやりたいと思うようになって

* 開発時用ビルド
* デプロイ用ビルド
* assetのハッシュ付与

とかの設定をしたけど、最初からこの辺の設定をコミコミした状態の薄いフレームワークというか開発環境みたいなの無いかなぁ、と何度か思った。

ググってたらボイラープレートみたいな単語を目にしたので、それがそういうものだと思うけど、オレオレボイラープレートみたいなのの種類がありすぎて調査を早々に諦めてしまった。

自分で一通り設定書いたおかげで多少理解が深まったような気がするし、初めてのモダンフロントエンドはまあこれでも良いか。

あとはES6のトランスパイル(今回初めて知った単語)とかよくわからず苦労した。

未だによくわからんのが、ES5とES6の文法をごっちゃにしたときにエラー出たりするとこ。

途中まで(たぶん)ES5で書いてて、使おうとしたライブラリがES6でしか動かないことがわかって、ソースを一通りES6っぽく直したら動くようになったりした。

この辺ですごくハマった。

この辺りそもそもちゃんと理解できていないので、また調べてみようと思う。

今時のフロントエンドは未来仕様で書いて古い仕様で動くように変換しているというのを知らなかったけど、面白いなぁと思った。


# Reactどこに向いているのか

事前情報で、Reactは大規模開発に向いていて、今回みたいな小規模には向かないという記事は何度か目にした。

今回は趣味プログラミングだし、Reactを触ってみたいというのがあったのでもちろんReactを採用した。

やってみた結果、やはり今回みたいなプロジェクトには向いていないと感じた。

さくっと何か作るには学習コストがかかるし、ググってもまだ情報は少ない。

jQueryで作ったらすぐできそうだなーと何度も思った。

jQueryなら何かやろうとすれば大抵なんでもできるし、ライブラリもすごく数があると感じるし、jQueryってすげえなと思った。



書き始めたら思いの外長文になってしまった...
また今度serverlessの記事を書こうと思います
Logstashを使ってTwitterのストリームをElasticsearchServiceにぶっ込む


# 事前準備

- AWSでElastickSearch Serviceのクラスタを作る。
- Twitterのconsumer_key, consumer_secret, oauth_token, oauth_token_secretを事前に発行しておく。

# install

```sh
$ yum install java
$ wget https://download.elastic.co/logstash/logstash/packages/centos/logstash-1.5.3-1.noarch.rpm
$ rpm -ivh logstash-1.5.3-1.noarch.rpm
$ /opt/logstash/bin/logstash --version
```

```sh:logstach.conf
input {
  twitter {
    consumer_key => "???"
    consumer_secret => "???"
    oauth_token => "???"
    oauth_token_secret => "???"
    keywords => ["ごちうさ", "ぴょんぴょん"]
    full_tweet => true
  }
}
output {
  elasticsearch {
    host => "???"
    port => "80"
    protocol => "http"
    index => "twitter"
  }
  stdout { }
}
```

- input.twitter.key_wordsに適当に引っ掛けたいテキストを複数指定することができる。
- output.elasticsearch.hostにAWSで作ったElasticSearchのホスト名を入力

# 動作確認

```
/opt/logstash/bin/logstash -f logstash.conf
```

ElasticSearchにデータが入ってくるのを確認できればOK

# Logstashをdaemon化

/etc/init.d/logstashのスクリプトを実行すれば良い。

```
LS_CONF_DIR=/etc/logstash/conf.d
```
上記にconfigを置いてあげればよいようだ。

```
mv logstash.conf /etc/logstash/conf.d/
/etc/init.d/logstash start
```

以上。
ElasticSearch Searviceはkibanaもくっついているので、あとはお好みで可視化すればよい。
今回はなんか面白そうだから、簡単にやってみただけですが、ElasticSearchに関してもっと、使いこなせるようになりたいですなぁ。色んなソリューションが考えれそう。
MkDocsを使ってドキュメントのサイトの自動でこしらえる



# MkDocsについて

http://www.mkdocs.org/

- BSDライセンス
- Python製pipでinstallする
- MarkdownでかかれたドキュメントをHTMLに自動で生成する
- 他の似通ったツールと比べて非常にシンプルで覚えることも少ない


こんな感じのドキュメントを簡単に作ることができる。
![Sampleプロジェクト_-_Vimperator.png](https://qiita-image-store.s3.amazonaws.com/0/19855/08956c82-e279-3adf-1831-9e8891ffceb4.png "Sampleプロジェクト_-_Vimperator.png")


# この辺が気に入った

- シンプルで
- フォーマットがMarkdown
- HTMLのデザインがシンプル
- 何のドキュメントであっても使い方次第でしっくりくる

要は、シンプルなものを望んでいる方はいいかもしれません。
API BluePrintとかが流行っているようですが、API以外のこともドキュメント化したかったり、ある程度プロジェクトでドキュメント書いてしまっていて今更ツール用に書き換えるのが面倒なときにもいいかもしれません。

# 基本的な使い方

```
pip install mkdocs

# ドキュメントの雛形作成
mkdocs new sample && cd sample

# ローカル環境でプレビューできるようにする
mkdocs serve

# htmlを出力する
mkdocs build
```

mkdocs.ymlファイルにて基本的なドキュメントの出力の設定を行う。
以下は一例。

```yml:mkdocs.yml
site_name: Sampleプロジェクト
site_url: http://sample.com
site_description: このプロジェクトはmkdocsを使って遊ぶためのプロジェクトである
site_author: '@keitarou'
site_favicon: favicon.ico
repo_url: https://github.com/example/repository/
repo_name: Repository Name
copyright: copyright 2016
google_analytics: null
theme: readthedocs
site_dir: mkdocs_build
dev_addr: '127.0.0.1:8000'
pages:
  - Home: index.md
  - About: about.md
  - Categories: categories.md
  - Q&A: qa.md
```

後は出力されたファイルをs3なり、GitHubPagesなりでホストすれば、簡単にドキュメントの配布ができますね。
今回は試していませんが、ちなみにGitHub Pagesにデプロイするためのコマンドも用意されているようです。
Macのサービスを利用したテキスト展開

# テキストの選択範囲をPythonで評価して書き換えるサービス

下記ブログを拝読し、感銘を受けPython版を作らせていただきました。（下記記事はRuby版）

Pythonistaの皆様の目につきやすければと思いメモがてら書いておきます。

参考サイト

- [Mac を使っているなら必ず使うべき2つの機能 "Automator" と "サービス"](http://r-kurain.hatenablog.com/entry/20130219/1361270262)

- [Automator のデバッグ](http://r-kurain.hatenablog.com/entry/20130224/1361710783)

## Automatorを起動し、新規サービスを作成する
下記画面のように作成すればOK。

<img width="1112" alt="service.png" src="https://qiita-image-store.s3.amazonaws.com/0/102012/2df525d6-6f2c-79ff-ece4-e1965a360ec2.png">


コピペしやすいよう一応コードも貼っておきます。

```
python -S 2>&1 || echo;
```

## 環境設定のキーボードからショートカットを設定する
下記画面のように設定。

<img width="782" alt="shortcut.png" src="https://qiita-image-store.s3.amazonaws.com/0/102012/22691387-ea84-44a7-87f6-fe66afdc1087.png">

## 使う
Automatorに渡せるテキストであればどんなところでも使用できるのがポイント。

また右クリックメニューからでもショートカットでも使用可能です。

### 下記はCotEditorで使用したところ。計算機の代わりににもなりますね。(右クリックメニューから実行)

![cal_cot_edit02.gif](https://qiita-image-store.s3.amazonaws.com/0/102012/7cfafb68-1abb-9afd-2e2a-e6aa643686b5.gif)

### MacDownで使用したところ。人力ではやりたくない連番作成などにも便利。（ショートカットで実行）

![loop02.gif](https://qiita-image-store.s3.amazonaws.com/0/102012/f2324e7b-eee6-7309-6cd2-837dc739d47f.gif)

## まとめ

Rubyistは元記事の、Pythonistaは本記事のサービスを使ってみてはいかがでしょうか。
SnackBarの文字色を自由に設定する方法


DesignSupportLibraryのSnackBarを使っていて、表示するテキストカラーを設定したい場面に遭遇しました。
で、以下のようにしました。もっといい方法がアレばぜひ教えていただきたいです。
サンプルとしてボタンをタップすると色が変わったSnackBarが出てくるだけのMainActivityを用意しました。


![ezgif.com-video-to-gif.gif](https://qiita-image-store.s3.amazonaws.com/0/64813/3de0811c-f537-dc49-807e-9a2fbf764a06.gif "ezgif.com-video-to-gif.gif")

以下コードです。

```java:ChangeSnackBarTextColorSample
public class MainActivity extends AppCompatActivity {

    @Bind(R.id.root)
    LinearLayout root;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
    }

    private void showSnackBar(String msg, int color) {
        Snackbar snackbar = Snackbar.make(root, msg, Snackbar.LENGTH_SHORT);
        TextView textView = (TextView) snackbar.getView().findViewById(android.support.design.R.id.snackbar_text);
        textView.setTextColor(color);
        snackbar.show();
    }

    @OnClick(R.id.red)
    public void showRedTextSnackBar() {
        showSnackBar("赤です", Color.RED);
    }

    @OnClick(R.id.blue)
    public void showBlueTextSnackBar() {
        showSnackBar("青です", Color.BLUE);
    }

    @OnClick(R.id.white)
    public void showWhiteTextSnackBar() {
        showSnackBar("白です", Color.WHITE);
    }
}
```

まとめると、SnackBarの中で使用されている、TextViewを取得してボタンタップでその色を変えてあげてるだけです。
使いドコロはわかりませんが、TextViewがそのまま取得できているので、もちろん、アニメーションさせたりもできます。
（青色も赤色も見にくかった…）

お粗末でした。
金属加工技術（ロストワックス鋳造について）

#目的

金属加工のDIY。アクセサリー作成のための技術の勉強、調査。
その中でも、DIY系のサイトを見ると人気なロストワックス手法についてまとめる
多分、プログラマのための記事ではない。

#ロストワックス鋳造とは

ロウ（ワックス）を利用した鋳造方法の一種。
ロウで原型を作り、周りを鋳砂で覆い固め、ロウを溶かして除去することによってできた空洞に金属を流し込むと鋳物ができる。

#そもそも鋳造（Casting）とは

材料（主に鉄・アルミ合金・銅・真鍮などの金属）を融点よりも高い温度で熱して液体にしたあと、型に流し込み、冷やして目的の形状に固める加工方法である。

- 鋳造に使用する型のことを鋳型（いがた）
- 鋳造でできた製品のことを鋳物（いもの）

英語で casting といえば、鋳造と鋳物の双方を指すらしい。

なので、ロストワックス手法とは、**鋳型を作るためにろうを使う手法**のことを指という

#ロストワックス手法の工程
- 最初に蝋で原型を作った後、型の素材となるシリカ、水ガラス、石膏等を重ねる。
    - 原型は3Dプリンタ等で作成も可能。作りたい型をろうで作る。
    - 周囲を石膏で固める

- 型の内部の蝋を熱で融かして取り除く。

- できた空洞に溶融金属を流し込む。

- 型を取り除き、形を整える。


# 参考情報
https://ja.wikipedia.org/wiki/%E3%83%AD%E3%82%B9%E3%83%88%E3%83%AF%E3%83%83%E3%82%AF%E3%82%B9
https://ja.wikipedia.org/wiki/%E9%8B%B3%E9%80%A0
http://d-engineer.com/kikaikakou/seimitutyuuzou.html
http://i-maker.jp/fire-cast-4534.html
http://www.g-iron.com/?mode=f3
Git v2.3 で追加された GIT_TERMINAL_PROMPT について

Git v2.3 から追加された環境変数 `GIT_TERMINAL_PROMPT` を使うと、ユーザー入力をスキップすることができます。

# GIT_TERMINAL_PROMPT を設定しない場合
GIT_TERMINAL_PROMPT が設定されていない場合、プライベートリポジトリを clone しようとしたり、https で設定された remote に対して push しようとしたりした際に、ユーザー名・パスワードの入力を求められて処理が止まってしまいます。

これが意図しない挙動である場合、エラーを吐いて終了して欲しいわけです。

```
$ git clone https://github.com/pine613/Config.git
Cloning into 'Config'...
Username for 'https://github.com':
```

# GIT_TERMINAL_PROMPT=0 を設定した場合
GIT_TERMINAL_PROMPT が設定されている場合、入力を求められた際はエラーとなりそこで処理が終了します。

```
$ git version
git version 2.7.0

$ GIT_TERMINAL_PROMPT=0 git clone https://github.com/pine613/Config.git
Cloning into 'Config'...
fatal: could not read Username for 'https://github.com': terminal prompts disabled
```

# まとめ
自動化してある処理など、途中で処理が止まるぐらいならさっさと死んで欲しい処理には、この環境変数を利用すると良いと思います。バージョン 2.3 以降しか使えない点に注意。
NodObjC インストール覚書


## node-gypのインストール

```
$ node install -g node-gyp
```

## node-ffiのインストール

npmからだとうまくインストールできなかったので、自分でコンパイル。

```
$ git clone git://github.com/node-ffi/node-ffi.git
$ cd node-ffi
$ node-gyp rebuild
$ npm install . -g
```

## nodobjcのインストール

```
$ npm install nodobjc --save
```
OSのカルチャ設定を自スレッドに対して上書きする

アプリケーションの動作をOSのUIカルチャ(西暦・和暦など)に依存させたくない。

カレンダーの設定の変更から、カレンダーの種類を「和暦」にすると、タスクバーの日付が和暦表示になってとても便利。
![2016-01-12.png](https://qiita-image-store.s3.amazonaws.com/0/67318/4ec8f479-b402-b699-84ba-0741228d2afb.png)

調べたところ、現在のスレッドのカルチャを上書き適用することができるらしい。
→ Thread.CurrentThread.CurrentCulture = New CultureInfo("en-US")
（スコープは現在のスレッドなのでOSの設定を書き換えることはない。）

慌ててすべてのToStringやフォーマットに対してカルチャ設定をする必要はない。

```hello.vb
Imports System.Globalization
Imports System.Threading
    Sub Main()
        Dim d As New Date(2016, 1, 23, 4, 56, 0)

        Console.WriteLine(CultureInfo.CurrentCulture.ToString)
        Console.WriteLine(d.ToString("yyyy-MMdd-hhmm"))'OS設定に依存
        Console.WriteLine(d.ToString("ggyy.MM.dd"))'OS設定に依存

        Thread.CurrentThread.CurrentCulture = New CultureInfo("en-US")
        Console.WriteLine(CultureInfo.CurrentCulture.ToString)
        Console.WriteLine(d.ToString("yyyy-MMdd-hhmm"))’2016-0123-0456
        Console.WriteLine(d.ToString("ggyy.MM.dd"))'A.D.16.01.23

        Thread.CurrentThread.CurrentCulture = New CultureInfo("ja-JP")
        Console.WriteLine(CultureInfo.CurrentCulture.ToString)
        Console.WriteLine(d.ToString("yyyy-MMdd-hhmm"))'28-0123-0456
        Console.WriteLine(d.ToString("ggyy.MM.dd"))'平成28.01.23

        Console.ReadLine()

    End Sub
```

![2016-01-12 (1).png](https://qiita-image-store.s3.amazonaws.com/0/67318/bca274cd-3a85-1769-ad62-ca02d043e04b.png)

設定かくにん！よかった。
ESP8266 (ESP-WROOM-02) で消費電力を抑えるには (スリープモードまとめ)

## 概要
ESP8266 (以下、WROOM02) の消費電力を抑える

## はじめに
WROOM02 では、何種類かの低消費電力モードがあるので、そのまとめ。
Deep-Sleep が最も低消費電力だが、(タイマーで復旧するので)サーバモードでは使えない。
Modem-Sleep / Light-Sleep は無線通信などの割り込みによって復旧する。

#### データシート
<a href="http://akizukidenshi.com/download/ds/espressifsystems/0C-ESP8266__WROOM_WiFi_Module_Datasheet__EN_v0.3.pdf" target="_blank">秋月 WROOM02 データシート</a>
#### 消費電力

|Parameters|Typical|Unit|
|:---|---:|:---:|
|Modem-Sleep|15,000|uA|
|Light-Sleep|900|uA|
|Deep-Sleep|10|uA|


## Modem-Sleep / Light-Sleep
 - WROOM02 をサーバとして使う場合は、これらのタイプ。

### 定義
~/Library/Arduino15/packages/esp8266/hardware/esp8266/2.0.0/tools/sdk/include/user_interface.h

```cpp
enum sleep_type {
        NONE_SLEEP_T    = 0,
        LIGHT_SLEEP_T,
        MODEM_SLEEP_T
};
```
```cpp
bool wifi_set_sleep_type(enum sleep_type type);
```

### 使い方
 - **setup 関数内**で wifi_set_sleep_type( type ) を実行する。<br>→ 後は適当なタイミングで、自動的にスリープと目覚めを繰り返す。
 - 見た目、スリープ状態かどうか、わからない。

#### 例
 - Modem-Sleep するように設定する場合。

```cpp
extern "C" {
#include <user_interface.h>
}

void setup() {
  // ... Wi-Fi設定等

  wifi_set_sleep_type(MODEM_SLEEP_T);
}

void loop() {
}
```

### 回路図
回路に変更は不要

### 参考
以下、一連のまとめ記事が、めちゃくちゃ詳しい。

 - <a href="http://ekjigtool.blogspot.jp/2015/08/esp-wroom-02113sleep.html" target="_blank">ESP-WROOM-02のメモ(11)：3つのSleepの使い分け</a>
 - <a href="http://ekjigtool.blogspot.jp/2015/08/esp-wroom-02_31.html" target="_blank">ESP-WROOM-02プログラミング：スリープのテスト</a>
 - <a href="http://ekjigtool.blogspot.jp/2015/09/esp-wroom-02.html" target="_blank">ESP-WROOM-02：スリープの調査結果</a><br>↑ グラフで見ると、すごくよくわかる。


## Deep-Sleep
 - 消費電力がものすごく低い。
 - WROOM02 をセンサーとして使うなら、このタイプ。
 - 復旧時、再起動されて、setup( ) から実行になる。

### 定義
~/Library/Arduino15/packages/esp8266/hardware/esp8266/2.0.0/cores/esp8266/Esp.h 

```cpp
// compatibility definitions
#define WakeMode RFMode
#define WAKE_RF_DEFAULT  RF_DEFAULT
#define WAKE_RFCAL       RF_CAL
#define WAKE_NO_RFCAL    RF_NO_CAL
#define WAKE_RF_DISABLED RF_DISABLED
```
```cpp
void deepSleep(uint32_t time_us, RFMode mode = RF_DEFAULT);
```

### 使い方
 - IO16 ピン を RST(リセット) に繋いでおく必要がある。<br>→ 指定時間経過後にリセットが実行され、再起動がかかる。
 - スリープ時間は マイクロ秒 で指定する。
 - **setup 関数内の最後**で ESP.deepSleep( ) を実行すればよい。<br>→ loop は一度も実行されないで、スリープに突入することができる。<br>→ setup だけで処理が完結する (setupだけを繰り返す) スケッチが最適。

#### 例
 - 10 秒間スリープして、再起動したい場合

```cpp
void setup() {
  // ... Wi-Fi設定等

  // setup の末尾に記述する
  ESP.deepSleep(10 * 1000 * 1000);
}

void loop() {
}
```

### 回路図
**IO16 を RST に繋げる。**
#### 例
<a href="http://qiita.com/exabugs/items/9ca4093813db71278b39" target="_blank">「ESP8266 (ESP-WROOM-02) でセンサーを扱う」</a>の回路図では

![cirkit.png](https://qiita-image-store.s3.amazonaws.com/0/69410/baef6507-ddf8-b488-2d7b-de9693522e27.png)


### 参考
以下、一連のまとめ記事が、めちゃくちゃ詳しい。

 - <a href="http://ekjigtool.blogspot.jp/2015/08/esp-wroom-02_27.html" target="_blank">ESP-WROOM-02プログラミング：スリープしながら定期的にツイート</a>

## まとめ
WROOM02 での低消費電力モードをまとめました。
それぞれに、メリット・デメリットがるので、用途に合わせて選択する必要があります。

 - Deep-Sleep が最も低消費電力だが、(タイマーで復旧するので)サーバモードでは使えない。
 - Modem-Sleep / Light-Sleep は無線通信などの割り込みによって復旧する。

Modem-Sleep と Light-Sleep の明らかな違いは、分かりませんでした。<br>(→ それなら Light-Sleep を選択すればよいじゃない？)
消費電力を時系列に詳しく測ることができる計測器が欲しい。
Androidのインテントを使った複数宛先のメール送信

# Androidのインテントを使った複数宛先のメール送信

## 方法
mailto:メアド1,メアド2,...とカンマつなぎで行う

## コード

```java
List<String> emails = new ArrayList<>();
StringBuilder mailTo = new StringBuilder();
mailTo.append("mailto:");
for (String email : emails) {
    if(android.util.Patterns.EMAIL_ADDRESS.matcher(email).matches()) {
        //正しいメアドの時だけ追加する
        mailTo.append(email);
        mailTo.append(",");
    }
}
//メール送信起動
// インテントのインスタンス生成
Intent intent = new Intent();
intent.setAction(Intent.ACTION_SENDTO);
//宛先の設定
intent.setData(Uri.parse(mailTo.toString()));
//件名の設定
intent.putExtra(Intent.EXTRA_SUBJECT, "件名");
//本文の設定
intent.putExtra(Intent.EXTRA_TEXT, "本文");
// メール起動
startActivity(intent);

```
[WebRTC] new RTCPeerConnection()を何回も呼ぶとメモリリークする

以下のコードは少なくともChrome 47とFirefox 43でメモリリークを起こすようだ。

```javascript
var RTCPeerConnection = window.RTCPeerConnection
    || window.mozRTCPeerConnection
    || window.webkitRTCPeerConnection;
while (true) {
    var pc = new RTCPeerConnection({});
    pc.close();
}
```
[JSFiddleによる実行例](https://jsfiddle.net/26n5bc87/)（注意: リンク先に飛ぶとブラウザがクラッシュする）

自分の最新のIPアドレスを取得するために[webrtc-ips](https://github.com/diafygi/webrtc-ips)をポーリングしようとしたのだが、メモリ使用量がどんどん増えていくので気付いた。

# 対処法

* そもそも`new RTCPeerConnection()`を大量に呼ぶコードを書かない
* 大量に呼ぶ必要がある場合は、適当なときに`location.reload()`する
slack / powershell > test.txtを更新したらslackへポストメッセージする実装 > 関数使用

```txt:動作確認
Windows 8.1 pro (64bit)
```

デスクトップ上のtest.txtファイルが更新されたらslackへ通知するpowershell実装。

```checkUpdateFile.ps1

function notifySlack ($updatedfile) {
  $enc = [System.Text.Encoding]::GetEncoding('ISO-8859-1')
  $utf8Bytes = [System.Text.Encoding]::UTF8.GetBytes($updatedfile)

  $notificationPayload = @{ 
    channel = "#general";
    username = "7of9";
    text = $enc.GetString($utf8Bytes) + " was updated";
  }

  Invoke-RestMethod -Uri "https://hooks.slack.com/services/xxxxxx/xxxxxxx" -Method Post -Body (ConvertTo-Json $notificationPayload)
}

$dsktp = [Environment]::GetFolderPath('Desktop')
echo $dsktp

$pretime = (Get-ChildItem $dsktp\test.txt).LastWriteTime

while ( 1 ) {
  if (Test-Path $dsktp\test.txt) {
    echo "file found"
    $curtime = (Get-ChildItem $dsktp\test.txt).LastWriteTime
    if ($curtime -gt $pretime) {
       echo "file updated"
       notifySlack ( "test.txt" )
       $pretime = (Get-ChildItem $dsktp\test.txt).LastWriteTime
    }
  } else {
    echo "not found"
  }
  sleep 5
}
```

slackのURLはダミー (Incoming WebHookを有効にして得られたURLを使う)

今回のpowershell学習

- 関数の使用


### 結果

![qiita.png](https://qiita-image-store.s3.amazonaws.com/0/32870/8e02a5b3-7b19-b503-ac7f-2fa3871eca34.png)
slackで折りたためるメッセージをhubotから送信

# 目的
hubot等のbotでslackのメッセージを送信するときに下のような折りたためる形で送りたい。

![attachment_text.png](https://qiita-image-store.s3.amazonaws.com/0/23392/b06867a8-6448-56f9-5f7d-1f1297b5d5db.png)

# 罠
slack attachmentを使うとできるが、slack attachmentはメッセージ(text)が8000byte(8000文字ではない)で打ち切られるという罠が存在するので、長いメッセージを送るときは8000byteごとに区切って(できれば改行など区切りのいいところで切って)送信する必要がある。

# 回避コード
```coffeescript
toUtf8String = (str) ->
  return unescape(encodeURIComponent(str))

toJSString = (str) ->
  return decodeURIComponent(escape(str))

sendAttachmentMessage = (robot, msg, pretext, text, delay) ->
  setTimeout ->
    robot.emit 'slack.attachment',
    message: msg.message
    content:
      # see https://api.slack.com/docs/attachments
      pretext: pretext
      text: text
      fallback: "Attachment fallback"
  , delay


# robot : hubotのインスタンス
# msg : msgインスタンス
# message : 送信するメッセージ(string)
# reply : 返信かどうか(bool)
module.exports.longMessage = (robot, msg, message, reply) ->
  delay = 0
  if reply
    reply_to = "@#{msg.message.user.name}"
  else
    reply_to = ""

  # slackのattachmentsは8000byteで打ち切られるため、その対策
  message_utf8 = toUtf8String(message)
  while message_utf8.length > 0
    if message_utf8.length >= 8000
      idx = message_utf8.lastIndexOf('\n', 8000)
      if idx < 0
        idx = 8000
      else
        idx = idx + 1
    else
      idx = message_utf8.length
    tmp = message_utf8.substr(0, idx)
    message_utf8 = message_utf8.substr(idx)
    # メッセージ毎に1秒遅延を入れる(順番入れ替わり対策)
    sendAttachmentMessage(robot, msg, reply_to, toJSString(tmp), delay)
    reply_to = ""
    delay += 1000
```

メッセージの送信が非同期に行われるため、区切って送った時に順番が入れ替わるおそれがある。このため、遅延を入れて送信している。ダサい。
powershell > ファイルに更新があったか確認する実装 > if文[比較] / while文 / ファイル最終更新年月日

```txt:動作確認
Windows 8.1 pro (64bit)
```

あるファイル(例: test.txt)が更新されたかどうかの確認

参考 http://www.atmarkit.co.jp/ait/articles/0808/29/news131.html

```checkUpdateFile.ps1
$dsktp = [Environment]::GetFolderPath('Desktop')
echo $dsktp

$pretime = (Get-ChildItem $dsktp\test.txt).LastWriteTime

while ( 1 ) {
  if (Test-Path $dsktp\test.txt) {
    echo "file found"
    $curtime = (Get-ChildItem $dsktp\test.txt).LastWriteTime
    if ($curtime -gt $pretime) {
       echo "file updated"
       $pretime = (Get-ChildItem $dsktp\test.txt).LastWriteTime
    }
  } else {
    echo "not found"
  }
  sleep 5
}
```

```txt:結果
file found
file found
file found
file updated
file found
file found
file found
```

デスクトップのtest.txtを変更して保存した時に「file updated」になる。
PHP製軽量ORM Idiormの使い方例


軽量でちょっとしたスクラッチプログラムにて
簡易なDBからデータ抽出するには楽なライブラリ。

####ドキュメントこちら
Welcome to Idiorm’s documentation!
http://idiorm.readthedocs.org/
  
  
  
###例
```php
$result = ORM::for_table('entries')
	// 複数セレクト
    ->select_many(
    'id',
    'name',
    'kana',
    'group_name',
    'group_kana',
    'tel',
    'email',
    // フィールド名エイリアス(エイリアス名,フィールド名)
    array('tel_mobile'=>'moblile'),
	);
	
	
	
//join
$result = ORM::for_table('entries')
	->left_outer_join('entry_members', 'entries.id=entry_members.entry_id')

	//検索条件
	->where('name', 'Fred Bloggs')
	
	// 否定
	->where_not_equal(array(
        'entry_members.name' => '',
    ));
    
//SQL直クエリ
$query = 'SELECT * FROM entries WHERE event_name = :event_name';
$entries = ORM::for_table('entries')
	->raw_query($query, array('event_name' => $event_name))
	->find_array();

```
powershell > Desktopにファイルがあるかどうかの確認 > 変数の使用例 / Desktopなどのパスの取り方 / if文 / Test-Path文

```txt:動作確認
Windows 8.1 pro (64bit)
```

デスクトップにファイル(findFile.ps1)があるかどうかの確認

```findFile.ps1
$dsktp = [Environment]::GetFolderPath('Desktop')
echo $dsktp

if (Test-Path $dsktp\findFile.ps1) {
    echo "found"
} else {
    echo "not found"
}
```

```txt:実行結果
PS > powershell /c .\\findFile.ps1
found
```

以下を覚えた

- 変数の使い方
- Desktopなどのパスの取り方
- if文
- Test-Path文
Atom で Haxe を使ってみる


最近 Haxe という言語と HaxeFlixel というライブラリを触り始めました  
HaxeFlixel には SublimeText でのプロジェクトテンプレートが存在しますが、  
残念ながら Atom にはテンプレートはありません。

しかし、調べてみると別に対応テンプレートが無くても開発はできるようです。
ということで Atom 用の開発環境構築を行ってみました。

# 導入（Haxe関連）

http://haxeflixel.2dgames.jp/index.php?GettingStarted

まずはこちらを見ながら（というか、詳しい日本語情報は今のところここくらいしかわからなかったのです…圧倒的感謝）

* Haxeのインストール
* Limeのインストール
* OpenFLのインストール
* HaxeFlixelのインストール

を行います。
HaxeFlixel インストール時に

```
[0] Sublime Text
[1] Flash Develop
[2] Intellij Idea
[3] None

Choose your default IDE.
```

こういうのが出てきますが、こちらは 3 を選んでください。
別にどれ選んでても Atom 上で動かないということは無いと思いますが、不要なファイルが鎮座することになります。


インストールしたツールの確認は忘れずに。
終わったらテンプレートを使ってプロジェクト作成を行います。

```
flixel tpl -n "Hello World"
```

こんな感じ。
そこまでやったら、次は Atom 側の環境を整えます。

# 導入（Atom）関連

まず以下のパッケージをインストールします。

* linter
* language-haxe
* autocomplete-plus
    * (環境によってはエラー吐く？ その場合は Disable にするか アンインストールしちゃいましょう 無くても補完自体は効きます)

上記パッケージは atom-haxe パッケージを使うために必要になります。
終わったら atom-haxe (haxe)パッケージをインストール

パッケージインストール後、
テンプレートから生成したプロジェクトを Atom に放り込みます。
Tree View に

```
assets
source
Project.xml
```

みたいに出てきたら次へ進みます。

# lime に Project 情報を認識させる

Project.xml を開きます。
Project.xml を開いたままの状態で`Ctrl+Shift+P`でコマンドパレットを開いて
`Lime: Set lime File` を選択

lime パッケージのログに  
`lime info updated for [ファイルパス]` のように出てきたら成功


# ビルドターゲット設定

コマンドパレットを開いて  
`Lime: Set Target` を選択してターゲットを選択 お好みで。

# ビルド

コマンドパレットを開いて
`Haxe: Build` を選択

Haxe のログウィンドウが展開された後ビルドが走るのでしばらく待ちます。
成功したら（ターゲットによるかもですが）アプリが起動するはずです。

# 他

後はゴリゴリコード書いていけばOKです。
補完も利くはずですし Haxe の Server が動いていればファイルセーブ時にエラーチェックもしてくれます。

プロジェクト単位で設定保管とかしたかったら `project-manager` パッケージなんかを使うといいのかも？  
筆者も入れてますが、まだちゃんと設定に関して確認してません（ーωー）

# いくつか謎挙動も

導入時に発生したよくわからん挙動メモ

* 定義ジャンプした時に何故かファイル名が全部小文字の状態で開かれる
    * EventDispatcher.hx -> eventdispatcher.hx みたいな感じ
    * その状態のファイルを編集して保存すると元ファイルにきちんと変更はかかる
    * 小文字ファイルの方はlintしてくれないのかエラーが出てこない
    （大文字がちゃんとある状態のファイルの方を見に行くとエラー表示される）
* 定義ジャンプ／エラーチェックがうまく効かなくなることがある
    * `Haxe: Stop Server` `Haxe: Reset Server` してみるとか、ファイル開き直したり時間置いてみるとかするといいかも

# まとめ

結構いい感じに動くようには見えるものの何かと Atom 自体が死んだり補完が急に効かなくなったりするのでなんとも微妙なところ  
といってもちゃんとセーブ時のエラーチェックが効いたり補完がSublimeTextに比べるとかなり見やすいのでリッチさを求める人とか  
そもそも Atom しか使ってないよ！って人ならアリかなという印象でした  
しかしそれでも１個目の謎挙動はちょっと困るのでなんとかならないものか…
underscoreコードリーディング（object）



underscoreに詳しくないので、勉強半分でソースコードを読む。



##利用するバージョン
[underscore.js(v1.8.3)](https://github.com/jashkenas/underscore/tree/1.8.3)


##objectとは


###[underscorejs.orgのobject](http://underscorejs.org/#object)

こんな説明。
>####_.object(list, [values]) 
>Converts arrays into objects.
>Pass either a single list of [key, value] pairs, or a list of keys, and a list of values.
>If duplicate keys exist, the last value wins.



```javascript

(例1)
_.object(['moe', 'larry', 'curly'], [30, 40, 50]);
=> {moe: 30, larry: 40, curly: 50}

(例2)
_.object([['moe', 30], ['larry', 40], ['curly', 50]]);
=> {moe: 30, larry: 40, curly: 50}

```
------------- 

配列をオブジェクトに変換します。
[key,value]の形の1つのリスト(例2の形)、もしくはkeysのリストとvaluesのリスト（例1の形）のどちらかの配列で渡します。
もしkeysの中で重複したものがあった場合は、最後のvalueが勝ちます。

###[underscore.object](https://github.com/jashkenas/underscore/blob/1.8.3/underscore.js#L598)
コード的にはこのあたり。

```javascript
  // Converts lists into objects. Pass either a single array of `[key, value]`
  // pairs, or two parallel arrays of the same length -- one of keys, and one of
  // the corresponding values.
  _.object = function(list, values) {
    var result = {};
    for (var i = 0, length = getLength(list); i < length; i++) {
      if (values) {
        result[list[i]] = values[i];
      } else {
        result[list[i][0]] = list[i][1];
      }
    }
    return result;
  };
```

結果用のobjectのresultを定義
listの配列の長さだけfor文を回す。
valuesが合った場合には、listのi番目をkeyに、valuesのi番目を格納する。
valuesがない場合(listの値が[key,value]の形のとき)は、listのi番目の1つ目の値をkeyに2つめの値を格納する。

その後、resultを返す。
node-redにDBを与える。

#概要
node-redに、DBが欲しかった。
lovefield.jsをjsdo.itでホスティングした。
実験、ハッカソンに使えます。
#写真
![love.jpg](https://qiita-image-store.s3.amazonaws.com/0/18104/c9fd1444-8271-727d-f948-570e8d31223d.jpeg)
#サンプルコード
```
var bs = lf.schema.create('test0', 2);
var red;
bs.createTable('red').addColumn('name', lf.Type.STRING).addColumn('createTime', lf.Type.DATE_TIME).
    addIndex('idxCreateTime', ['createTime'], false, lf.Order.DESC);
bs.connect().then(function(db) {
    window.db = db;
    red = db.getSchema().table('red');
});
function disp() {    
    db.select().from(red).exec().then(function(rows) {
        rows.forEach(function(row) {
            alert(row['name']);
        });
    });
}
function put(data) {
    var row = red.createRow({
        'name': data,
        'createTime': new Date()
    });
    db.insert().into(red).values([row]).exec();
}
var websocket = new WebSocket("ws:// node-red /test0");
websocket.onopen = function() {
    alert("CONNECTED"); 
};
websocket.onmessage = function(e) {
    put("" + e.data);
};
websocket.onerror = function(e) {
    alert("ERROR: " + e.data);
};
```
Powershell / slack > JSONでのメッセージポスト

slackをWindowsから使う方法としてPowershellを試した。

参考 http://qiita.com/mikage014/items/2d8fff56eb84a6a751ea

上記の場合、Incoming Webhooks を設定して、そのURLへ投稿するようだ。

```ps1
$enc = [System.Text.Encoding]::GetEncoding('ISO-8859-1')
$utf8Bytes = [System.Text.Encoding]::UTF8.GetBytes($args)

$notificationPayload = @{ 
    channel = "#general";
    username = "7of9";
    text = $enc.GetString($utf8Bytes);
}

Invoke-RestMethod -Uri "https://hooks.slack.com/services/xxxxxxxxxx/xxxxxxxxxxxxx" -Method Post -Body (ConvertTo-Json $notificationPayload)
```

```txt:実行と結果
PS> powershell /c .\\notify_to_slack.ps1 "test 160111 2116"
ok
```

これでslackの#generalチャネルにポストできた。
vagrantにRuby on ralisをインストール

vagrantで構築したローカル環境にRuby on railsのインストールまでの方法を
自分用メモとしてを記載します。

■開発環境　MacOS

vagrantでローカル環境構築の方法は割愛させて頂きます。
以前の投稿した記事に記載しておりますのでご参考にして頂ければと思います。
[http://qiita.com/3104k/items/32555532315d0f998096](http://qiita.com/3104k/items/32555532315d0f998096)

仮想環境にはCentOS 6.5をインストール済とします

##**yumのアップデート**

```
$ sudo yum update -y
```


##**rbenvをインストール(gitでクローン)**
rbencはRubyのバージョンをプロジェクト毎に指定ができる便利なパッケージです

```
git clone https://github.com/sstephenson/rbenv.git ~/.rbenv
```

**環境変数の設定**

```
echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bash_profile
echo 'eval "$(rbenv init -)"' >> ~/.bash_profile
exec $SHELL -l
```
exec $SHELL -lで再起動したら反映されます。
これでrbenvコマンドが使用できるかと思います。

**インストールの確認**

```
rbenv --version
rbenv 1.0.0-14-gc388331
```

##**ruby-buildをインストール**
```
git clone https://github.com/sstephenson/ruby-build.git ~/.rbenv/plugins/ruby-build
```

##**Rubyのインストール**
バージョンのリストは以下のコマンドで確認できます

```
rbenv install -l
```

**今回は2.2.3をインストール**

```
rbenv install 2.2.3
```

しばらくすると以下のようなエラーが出ます。

```
BUILD FAILED (CentOS release 6.7 (Final) using ruby-build 20151230-6-g21fd7c8)

Inspect or clean up the working tree at /tmp/ruby-build.20160111093936.3823
Results logged to /tmp/ruby-build.20160111093936.3823.log

Last 10 log lines:
The Ruby openssl extension was not compiled.
The Ruby readline extension was not compiled.
The Ruby zlib extension was not compiled.
ERROR: Ruby install aborted due to missing extensions
Try running `yum install -y openssl-devel readline-devel zlib-devel` to fetch missing dependencies.

Configure options used:
  --prefix=/home/vagrant/.rbenv/versions/2.2.3
  LDFLAGS=-L/home/vagrant/.rbenv/versions/2.2.3/lib
  CPPFLAGS=-I/home/vagrant/.rbenv/versions/2.2.3/include
```

とりあえず言われたままにインストール

```
$sudo yum install -y openssl-devel readline-devel zlib-devel
```

**再度Rubyのインストール**

```
rbenv install 2.2.3
```

**インストールの反映**

```
rbenv rehash
```

**確認**

```
ruby -v
ruby 2.2.3p173 (2015-08-18 revision 51636) [x86_64-linux]
```

**デフォルトのRubyのバージョンを設定**

```
rbenv global 2.2.3
```

##**Ruby on railsのインストール**

```
$ gem install rails --no-ri --no-rdoc
```

インストールに時間かかります。

**確認**

```
$ rails -v
$ Rails 4.2.5
```

とりあえずインストールは完了です。

環境構築はこんな感じで終わりとなります。

参考
http://qiita.com/yamagh/items/61e540765fa4d2152dc4
http://unicus.jp/skmk/archives/771
http://nwpct1.hatenablog.com/entry/2013/10/31/211349
UE4 でアクターにスタティックメッシュとマテリアルを適用する

# 環境
UE 4.10.0
Visual Studio 2015

# 概要
Unreal Engine 4 を触ってみて動作を確認する
C++ プログラム上でスタティックメッシュを初期化し、そこにマテリアルを適用
する手順のまとめ
参考：UE4 でアクターにプログラムからコンポーネントを追加する方法
http://qiita.com/maprog/items/eba3e9837979769487ac

# 本文
## マテリアルを準備
まずは、必要となるマテリアルをコンテンツブラウザ上で作成する。
今回は、コンテンツブラウザ直下に Material1 という名前でマテリアルを作成する
コンテンツブラウザ上で [右クリック] > [マテリアル] で作成できる

## アクターのコードを書く
以下の 3 つのインスタンスをアクターに追加し、アセットのパスを指定して初期化
して終了。以下にサンプルを用意した。

+ UStaticMeshComponent
+ UStaticMesh
+ UMaterial

[ヘッダ]
class TEST20160104_API AActorMaterial : public AActor
{
    GENERATED_BODY()
	
public:	
    AActorMaterial(const FObjectInitializer& ObjectInitializer);

    virtual void BeginPlay() override;
	
    virtual void Tick( float DeltaSeconds ) override;
    
    UStaticMeshComponent* mStaticMeshComponent;
    UStaticMesh* mStaticMesh;
    UMaterial*	mMaterial;
};

[コード]
AActorMaterial::AActorMaterial(const FObjectInitializer& ObjectInitializer)
: Super(ObjectInitializer)
, mStaticMeshComponent(nullptr)
, mStaticMesh(nullptr)
, mMaterial(nullptr)
{
    PrimaryActorTick.bCanEverTick = true;

    static ConstructorHelpers::FObjectFinder<UMaterial> materialAsset(TEXT("/Game/Material1.Material1"));
    if (materialAsset.Succeeded())
    {
        mMaterial = materialAsset.Object;
    }

    static ConstructorHelpers::FObjectFinder<UStaticMesh> staticMeshAsset(TEXT("/Game/StarterContent/Shapes/Shape_Sphere.Shape_Sphere"));
    if (staticMeshAsset.Succeeded())
    {
        mStaticMesh = staticMeshAsset.Object;
        mStaticMesh->Materials[0] = mMaterial;

    mStaticMeshComponent = ObjectInitializer.CreateDefaultSubobject<UStaticMeshComponent>(this, TEXT("StaticMeshName"));

        if (mStaticMeshComponent)
        {
            RootComponent = mStaticMeshComponent;
            mStaticMeshComponent->SetStaticMesh(mStaticMesh);
        }
    }
}

void AActorMaterial::BeginPlay()
{
    Super::BeginPlay();
}

void AActorMaterial::Tick( float DeltaTime )
{
    Super::Tick( DeltaTime );
}

# まとめ
スタティックメッシュを初期化し、そこにマテリアルを設定する。
アクターにコンポーネントの初期化方法を知っていれば、すぐに対応できる
swiftでDropbox APIを呼び出す


[Dropbox for Swift Developers](https://www.dropbox.com/developers/documentation/swift)
を参考にして、Swift版Dropbox APIを使ってみました。

XCode7.2, iOS9.2環境で動作確認しました。

# Install

[install](https://www.dropbox.com/developers/documentation/swift#install)

cocoapodsでSwiftyDropboxをインストールします。この時、Alamofireもインストールされます。

```
$ cat Podfile

platform :ios, '8.0'
use_frameworks!

pod 'SwiftyDropbox'
```

# Tutorial

[Tutorial](https://www.dropbox.com/developers/documentation/swift#tutorial)

ステップごとに実装方法の説明があります。

Tutorailどおりに進めていきましたが、現在のユーザ情報取得時(client.users.getCurrentAccount().response)にエラーが発生しました。

```
unable to access "users/get_current_account"
```

すでに、SwiftyDropboxのissueになっており解決しているようでした。

[unable to access "users/get_current_account"](https://github.com/dropbox/SwiftyDropbox/issues/42)

このパッチは当たっているのを確認しました。が、同じエラーが発生しました。

# 解決
原因は、SwiftyDropboxのバージョンを指定しないと、SwiftyDropbox/Alamofireのバージョンが2.x/3.x系がインストールされ、Alamofire3.xでのデータ取得が失敗しているようです。SwiftyDropboxのバージョンを (1.0.2)にするとAlamofire(2.0.2)がインストールされます。この環境では正常にデータ(アカウント情報)を取得することができました。

```
$ cat Podfile

platform :ios, '8.0'
use_frameworks!

pod 'SwiftyDropbox', '~> 1.0.1'
```

公式ドキュメントではなく、こちらの記事を参考にしておけば良かったというオチでした。今だけの問題だと思いますが、同じ現象で悩んでいる人の参考になれば幸いです。

[SwiftyDropboxでDropboxの簡単なファイル操作をする](http://qiita.com/keonheon/items/b08a63552d2cd46cb477#%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E4%B8%80%E8%A6%A7%E3%82%92%E5%8F%96%E5%BE%97%E3%81%99%E3%82%8B)
RailsでCSVのインポート・エクスポートメモ

## ゴール
- MacOSとWindows両方で文字化けしないCSVファイルをエクスポート・インポートする
- CSVファイルはカンマ区切りで、ヘッダ行は日本語表記

## 制限
- MacOSとWindowsでCSVを編集するのはExcelアプリケーションで行うこと
- 他のエディターで編集するのはできないわけではないですが、日本語のヘッダ部は文字化けで読めないことがある
- 環境
  - Rails 4.2.5
  - MacOS 10.11.2 + Excel 2016日本語版
  - Window 7（英語版＋日本語言語Pack） + Excel 2016日本語版

## 実装ポイント
- 実装ポイントと言っても、当たり前で`CSV.generate`と`CSV.parse`のパラメータに`Encoding`を設定すること
- エクスポート
  - `{ headers: ['氏名', '年齢'], write_headers: true, encoding: Encoding::SHIFT_JIS }`
- インポート
  - `{ headers: :first_row, encoding: Encoding::SHIFT_JIS }`

## ハマったこと
- MacOSの言語設定を英語にすると、Excel自体が日本語であっても、日本語ヘッダが文字化けになる
  - 対策：MacOSの言語を英語に設定する
- Modern.IEの仮想マシンを使ってWindows7+Excel2016で確認したんですが、Windows自体を日本語化できても日本語ヘッダが文字化け
  - 対策：Excel 2016のオプション設定で「言語」カテゴリで日本語を既定に設定する（日本語を一番上に移動すればOK）

## 参考記事
- [Rails4で実装するCSVのインポート / エクスポート](https://www.imd-net.com/column/3534/)
- [Ruby(Rails)からExcelで文字化けしないCSVファイル作成](http://tech-mr-myself.hatenablog.com/entry/2013/11/14/195346)
Rails で config って名前のコントローラメソッドは使っちゃダメ

ユーザーの設定ページに`config`で使うかと思って `StaticPages#config`とか定義しちゃうと

```
undefined method `allow_forgery_protection' for nil:NilClass
```

ってエラーになります。やめましょう。

Railsさんはもうちょっとわかりやすいエラーメッセージにして欲しい。
CS-Cart: AddonのJavaScriptをリロードで反映するようにする

CS-Cartでは、[全ページでJavaScriptを読み込みたい](http://qiita.com/suin/items/0d3e970c4d607bb1ad8a)でも紹介したとおり、AddonにJavaScriptを持たせることができ、`scripts.post.tpl`で読み込むことで全てのページにAddonのJavaScriptをロードすることができる。

しかし、デフォルトの設定ではJavaScriptのコードを更新しても、「一般設定」→「ストレージ」→「キャッシュのクリア」をしないとJavaScriptは最新にならない。これは、CS-CartがJavaScriptをコンパイルして1つのJSにminifyする仕組みを取っているため。

JavaScriptの更新をリロードだけで反映するには、config.local.phpやlocal_conf.phpで`tweaks.dev_js`を`true`に設定しておく必要がある。

```php
$config['tweaks']['dev_js'] = true;
```

これを設定しておけば、JSファイルを更新しただけで反映されるようになる。
CLIのWebsocketクライアントを作ってみた

Websocketを使ったサーバを作ったときに、動作確認をJavaScriptで書くのが面倒なのでターミナル上でやりたいと思いました。

[wscat](https://github.com/websockets/wscat)や[wssh](https://github.com/progrium/wssh)というツールが既にありますが、`npm`や`python`をインストールしないとダメなのと、自分で作ってみたかったのでGoで実装しました。

[https://github.com/morikuni/weso](https://github.com/morikuni/weso)

## つくったもの

`weso`というコマンドを作りました。
`telnet`的に文字列を送受信できます。

[https://github.com/morikuni/weso/releases](https://github.com/morikuni/weso/releases)からバイナリをダウンロードして実行できます(動作未確認)。

## 使い方

`weso`にURLを渡すことで接続されます。

```
$ weso ws://echo.websocket.org
> hello world
<< hello world
> how are you?
<< how are you?
```

ここでは、`ws://echo.websocket.org`という送ったメッセージをそのまま返してくるサーバに接続しています。
`>`と表示されている行が送信した文字列で、`<<`と表示されている行がサーバから受信した文字列です。

`weso`の特徴はテンプレートを使って文字列を送信できることです。
例えばJSON形式でデータを送りたいときに毎回`{"name":"Gopher"}`のように書くのは大変ですが、テンプレートを使うことで関数呼び出しのようにJSONを作成できます。

```
$ cat template.txt
{{define "Name"}}{"name": "{{._1}}"}{{end}}
{{define "JSON"}}{"{{._1}}": "{{._2}}"}{{end}}

$ weso -template template.txt ws://echo.websocket.org
> .Name Gopher
<< {"name": "Gopher"}
> .JSON message Hello
<< {"message": "Hello"}
```

テンプレートファイルはGoの[templateライブラリ](https://golang.org/pkg/text/template/)の形式です。
`{{define "XXX"}}`から`{{end}}`までが１つのテンプレートです。
テンプレートへの引数は`._1`,`._2`...`._N`で取得することができます。

Websocketサーバの簡単な動作確認には便利だと思うのでよかったら使ってみてください。
いまさらgiboの使い方

## 概要
giboは.gitignoreの自動生成をしてくれます。
https://github.com/simonwhitaker/gibo

## install
```bash
git clone https://github.com/simonwhitaker/gibo.git
```

batファイルをパスの通っているディレクトリに放り込む

```bash
cp path/to/gibo/gibo.bat ~/bin/
```

動くかを確認する（使える一覧が出てくる

```bash
gibo.bat -l
```

## how to

例えばこんな感じ(リダイレクトしないとそのまま出力されるだけ）
大文字、小文字は間違ってもいいっぽい（ぇ intellijはJetBrains

```bash
gibo.bat java Windows Vim JetBrains > .gitignore
```

## 感想
最初にプロジェクト作る際にこれがない、あれがいらない、とか面倒なのでこういうのは便利ですね。
あとは自分のローカルの .gitignore にて自分だけのものは書いていけばいいし。

## その他
何故かshの方を使おうとしてもやろうとしてもうまく行かなかった……
(パーミッションがないですよ。しかしwhichするとnot foundという。パスがおかしくなったような感じがするけど……。windows難しい）
時間あったらまた挑戦しよう
Ubuntu 14.04 + Canon iP100(プリンタ)で印刷時、何も印刷されずに白紙で出てくる時の対処法

## 最初に試したが駄目だったこと

- USB接続でドライバーを自動インストール
- GUIでSettings->Printersでプリンタ設定を作成  
(ドライバー: Generic->text-onlyを指定。  
この時はドライバー: Canon->iP100が見当たらなかったため)

## 作業ログ(USB)

- ドライバーを公式HPでdownloadしてインストール  
[PIXUS iP100 IJ Printer Driver Ver. 3.70 for Linux](http://cweb.canon.jp/drv-upd/ij-sfp/bjlinux370-ip100.html)

~~~~
$ tar zxvf cnijfilter-ip100series-3.70-1-deb
$ cd cnijfilter-ip100series-3.70-1-deb/
$ sudo ./install.sh
~~~~

- インストール後、ログをよく見るとエラーが発生している  
(インストール自体は中断されず、一見完了した風なので注意)

~~~
Package libtiff4 is not available, but is referred to by another package.
This may mean that the package is missing, has been obsoleted, or
is only available from another source

E: Package 'libtiff4' has no installation candidate
~~~

- libtiff4をwgetでインストール  
(TIFF形式のファイルを扱うためのライブラリ  
apt-getでインストール不可だったのは   
Ubuntuがlibtiff5を使用しているためかな)

~~~
wget http://old-releases.ubuntu.com/ubuntu/pool/universe/t/tiff3/libtiff4_3.9.7-2ubuntu1_amd64.deb
sudo dpkg -i libtiff4_3.9.7-2ubuntu1_amd64.deb
~~~

- 再度ドライバーをインストール、プリンタをUSB接続し、質問に答えていくと
印刷可能になった

~~~
#=========================================================#
#  Register Printer
#=========================================================#
Next, register the printer to the computer.
Connect the printer, and then turn on the power.
To use the printer on the network, connect the printer to the network.
When the printer is ready, press the Enter key.
~~~

- CUPS管理ページhttp://localhost:631/ へアクセス、問題無さそうなことを確認


## 作業ログ(Bluetooth)

- GUIでSettings->Bluetooth Managerを開く
鍵のアイコンをクリック、プリンタのペアリングキーを入力  
(下記はキー設定済の画像ため、アイコンがグレーになっています)
![Bluetooth Manager](https://qiita-image-store.s3.amazonaws.com/0/106789/9ed4f5bd-a877-569a-3415-789bf8c3dee1.png)  

もし鍵のアイコンをクリックしても反応が無い場合は以下を実行

~~~
$ hcitool scan
$ sudo hciconfig hci0 auth
$ sudo hcitool cc (your device address)
~~~

- apt-getでドライバーをインストール

~~~
sudo add-apt-repository ppa:michael-gruz/canon
sudo apt-get update
sudo apt-get install cnijfilter-ip100series
~~~

- GUIのSettings->Printersでbluetoothのプリンタ設定を作成後、印刷可能になった  
(ドライバー: Canon->iP100を指定)

### 調査

- USBデバイスを表示

~~~
$ lsusb
~~~

- LogLevelをdebugにしてログを確認

~~~
# 
$ sudo vi /etc/cups/cupsd.conf

<LogLevel warn
---
>#LogLevel warn
>LogLevel debug

$ dmesg
$ less /var/log/syslog
~~~

- プリンタ情報を表示

~~~
$ lpstat -t
~~~

- CUPS(Common Unix Printing System)の確認・起動

~~~
$ sudo service cups status(確認)
$ sudo service cups start(起動)
~~~

### 参考

- [キャノンプリンタMG6230の接続（Ubuntu14.04 amd64）](https://forums.ubuntulinux.jp/viewtopic.php?id=16346)
- [I can't install libtiff on my 64-bit Ubuntu](http://askubuntu.com/questions/312556/i-cant-install-libtiff-on-my-64-bit-ubuntu)
- [DOWNLOAD / INSTALL CANON PRINTER DRIVER FOR UBUNTU](http://www.ubuntubuzz.com/2011/06/download-install-canon-printer-driver.html)
- [Ubuntu (Gnome)からBluetoothでMP470に印刷するまで](http://ameblo.jp/kenyas/entry-10185245890.html)
- [Pairing impossible with printer HP Photosmart D5160](https://bugs.launchpad.net/ubuntu/+source/bluez-gnome/+bug/296358)
ElectronでQiitaへOAuth接続してみた

Qiitaにつなげてみた。レンダラから使う場合

``` javascript
var remote = require('remote');
var request = require('request');
var BrowserWindow = remote.require('browser-window');

var qiitaUrl = "https://qiita.com/api/v2/oauth/authorize?client_id=[自分のクライアントID]&scope=write_qiita";
var authWindow = new BrowserWindow({width: 800, height: 600});
authWindow.webContents.on('did-get-redirect-request', (event, oldUrl, newUrl) => {
  var matched;
  if(matched = newUrl.match(/\?code=([^&]*)/)) {
    var params = {
      'client_id': "xxxx",
      'client_secret': "xxxx",
      'code': matched[1],
    };
    
    var options = {
      url: 'https://qiita.com/api/v2/access_tokens',
      json: params
    };
    
    request.post(options, (error, response, body) => {
      /* body.token に入ってる */
    });
    setTimeout(() => {
      authWindow.close();
    }, 0);
  }
});

authWindow.on('closed', () => {
  /* ユーザーにウインドウをクローズされた */
});
authWindow.loadURL(qiitaUrl)
```
Xcodeにショートカットキーを追加する手順


以前、Xcodeのバージョンを上げた際に、なぜか"Update Constraints"のショートカットキーが使えなくなってしまった。
上記のショートカットキーをXcodeで使えるようにするためのメモ。


# ショートカットキー追加

Macの「システム環境設定」→「キーボード」→「ショートカット」で「アプリケーション」を選択して、＋ボタンを押す。
  
<img width="780" alt="before.png" src="https://qiita-image-store.s3.amazonaws.com/0/17330/89ec4d1d-ed52-5d56-f302-5803b23f45d5.png">


「アプリケーション」にXcodeを選択して、正確な「メニュータイトル」と任意の「キーボードショートカット」を入力。

<img width="780" alt="add.png" src="https://qiita-image-store.s3.amazonaws.com/0/17330/81a8a28b-4504-01b4-c813-716b3c654be7.png">

# Xcodeで確認
Storyboardを開き、Auto Layout Issueのあるコンポーネントを選択した状態で、Xcodeメニューの「Editor」→「Resolve Auto Layout Issues」を確認。「Update Constraints」のところにキーボードショートカットの表示があればOK。

<img width="660" alt="check_.png" src="https://qiita-image-store.s3.amazonaws.com/0/17330/30e24eb9-882c-1a19-2f44-d21a2359c47b.png">

#参考
[Xcodeに独自のショートカットキーを登録する簡単な方法](http://qiita.com/phptaro/items/5eef2eb1a5f561bcf2bb)
超絶便利なDataGrip!!!

超絶便利なDataGrip!!!

PhpStormやWebStorm等の有料ですが
高品質なIDEを提供しているjetbrainsから
DB専用のIDEが登場しました。

[<font size="5" color="BLUE">![DataGrip]
(http://www.google.com/s2/favicons?domain=https://www.jetbrains.com/datagrip/)DataGrip</font>](https://www.jetbrains.com/datagrip/)

以前から登録者限定で周知されていた
「0XDBE」の正式リリース版みたいですね。

「0XDBE」はPhpStorm、WebStorm等で
利用できたDB機能だけを抜き出したものに
なります。

今回のリリースに合わせてPhpStorm同様
有料になっています。

このツールはwindowsでいうA5:SQLのような
SQL開発ツールなのですが、何が便利かというと
windows,macだけでなく、linuxにも
対応しているという事です。

linuxにはA5:SQLのような使いやすいSQL開発ツールが
ない状態でした。

またPhpStorm等でDB機能を使おうとすると、
IDEで管理する項目が増え、複雑化して
使いづらくなる傾向にありました。

代理店のサムライズムさんのアナウンスはこれからの模様です。

[<font size="5" color="BLUE">![サムライズム]
(http://www.google.com/s2/favicons?domain=http://samuraism.com/)サムライズム</font>](http://samuraism.com/products/jetbrains/)