OmniAICreator/Qiita-1.07M huggingface dataset:
jquery resizeImg（表示領域固定）

指定画像のアスペクト比を保ちながら設定した縦横サイズに収まるよう、画像ブラウザ表示サイズをリサイズします（短辺の計算はブラウザ依存）。
サムネイル一覧表示などに。
（正直、CSSのmax-width/max-height使った方が早くて楽だと思います…）

jquery1.9.1/1.11.1で動作を確認。

```ruby:jquery.resizeImg
(function($) {
  $.fn.resizeImg = function(options){
    return this.each(function() {

      var defaults = {
        resizeWidth: 200, // 画像の最大横幅
        resizeHeight: 200 // 画像の最大縦幅
      };
      var settings = $.extend(defaults, options);
      var elm = $(this);

      // 縦横比計算
      var gcmthumb = gcd(settings.resizeWidth, settings.resizeHeight);
      var gcmresizeWidth = settings.resizeWidth/gcmthumb;
      var gcmresizeHeight = settings.resizeHeight/gcmthumb;

      // 要素読み込み後に実行
      elm.bind('load', function() {resize(); });

      // IE8 キャッシュでonloadが発生しないbug fix
      var flag = false;
      setTimeout(function() {
        if(0 < elm.width() && !flag) {
          resize();
        }
      }, 100);

      // リサイズ
      function resize() {
        flag = true;
        var w = elm.width()*gcmresizeHeight;
        var h = elm.height()*gcmresizeWidth;
        if (w >= h) {
          elm.removeAttr('height').attr({width:settings.resizeWidth}).css({height:'auto', width:settings.resizeWidth});
        } else {
          elm.removeAttr('width').attr({height:settings.resizeHeight}).css({height:settings.resizeHeight, width:'auto'});
        }
      }

      //最大公約数計算
      function gcd(x, y) {
        if (y === 0) return x;
        else return gcd(y, x % y);
      }

    });
  };
})(jQuery);

jQuery(function($) {
  $('.resize').resizeImg({
    resizeWidth: 120,
    resizeHeight: 120
  });
});
```

```ruby:html
※img要素にwidth/height指定しない。

<img src="img01.jpg" alt="サムネイル" class="js-resize">
<img src="img02.jpg" alt="サムネイル" class="js-resize">
<img src="img03.jpg" alt="サムネイル" class="js-resize">

<ul>
  <li><img src="img01.jpg" alt="サムネイル" class="js-resize"></li>
  <li><img src="img02.jpg" alt="サムネイル" class="js-resize"></li>
  <li><img src="img03.jpg" alt="サムネイル" class="js-resize"></li>
</ul>
```

昔書いたコードなので、モダンブラウザ向けに使うには無駄がコードが多いかもしれません。
SQL小ネタ: 高速なデータの存在チェック

DB側にデータの存在をチェックしに行って、データの有無でプログラム側の処理を切り分ける場合、既存のクエリ次第では高速化できる場合があります。

```
	-- DB側
	SELECT COUNT(*) FROM SomeTable WHERE Column1 = 1
	
	-- プログラム側
	IF COUNT結果 > 0 THEN
		結果がある場合の処理
	ELSE
		結果がない場合の処理
	END
```

↑ このように、COUNT()で該当レコードの件数を取得し、1件以上とれるかどうかで処理を分けているような場合です。データの存在だけチェックすればいいのにCOUNT(*)と、全レコード数をカウントするのはもったいないですよね。

そこで、↓のようにTOP句をつけて、最大でも1件しか返さないようにクエリを書き換えます。

```
	-- DB側(※SQLServer)
	SELECT TOP (1) * FROM SomeTable WHERE Column1 = 1
	
	-- プログラム側
	IF Recordとれた? THEN
		結果がある場合の処理
	ELSE
		結果がない場合の処理
	END
```

たったこれだけでも、クエリによっては100ミリ秒~下手すると1秒単位で速度に差が出る場合があります。
小ネタですが、効果的なケースもあるはず・・！
WordPress テーマカスタマイザーで動画を追加して出力（ver 4.7以降の場合）

以前に[「WordPress テーマカスタマイザーに動画セクションを追加して出力（ver 4.6以下の場合）」](http://qiita.com/gatespace/items/5f90ee90b8433e8103d0)という記事を書きましたが、WordPress 4.7 でカスタムヘッダーにビデオがサポートされました。
これにより以前より簡単に動画ヘッダーを実装できるようになりましたので軽く紹介。

参照：https://make.wordpress.org/core/2016/11/26/video-headers-in-4-7/

# カスタムヘッダーで動画を使うようにする
`'video' => true,` を追加
参照：https://developer.wordpress.org/themes/functionality/custom-headers/

```php:themename_custom_header_setup
<?php
function themename_custom_header_setup() {
    $args = array(
        'default-image'      => get_template_directory_uri() . 'img/default-image.jpg',
        'default-text-color' => '000',
        'width'              => 1000,
        'height'             => 250,
        'flex-width'         => true,
        'flex-height'        => true,
        'video'              => true,
    )
    add_theme_support( 'custom-header', $args );
}
add_action( 'after_setup_theme', 'themename_custom_header_setup' );
```

これだけでカスタマイザーに「ヘッダーメディア」として追加される
![スクリーンショット 2016-12-08 12.56.09.png](https://qiita-image-store.s3.amazonaws.com/0/18348/54885ced-fa7f-9a63-fa99-9a5decc0d1c1.png)

なお、対応しているのは
- .mp4
- YouTube の動画

# 出力側
表示した位置に

```php:the_custom_header_markup.php
<?php the_custom_header_markup(); ?>
```

でオケ

![スクリーンショット 2016-12-08 14.40.09.png](https://qiita-image-store.s3.amazonaws.com/0/18348/01d31ea1-06ac-d2d4-4e7f-726a3ed482ed.png)

# 画像と動画の両方を設定した場合

動画の読み込みが完了するまでは「ヘッダー画像」が表示されます。読み込み完了後、 `wp-custom-header.js` が画像と動画を置き換えます。

# `wp-custom-header.js` がレンダリングする停止・再生ボタンのソース

cssで調整したい場合はクラスを参考に

Pause Button

```html
<button type="button" id="wp-custom-header-video-button" class="wp-custom-header-video-button wp-custom-header-video-play">Pause</button>
```
Play Button

```html
<button type="button" id="wp-custom-header-video-button" class="wp-custom-header-video-button wp-custom-header-video-pause">Play</button>
```

# カスタムヘッダーの見た目
`the_custom_header_markup()` は `wp-custom-header` という cssクラスを持つ `<div>` タグで囲まれているので、こんな感じの css を追加しておく。

```css:wp-custom-header.css
.wp-custom-header iframe,
.wp-custom-header img,
.wp-custom-header video {
	display: block;
	height: auto;
	max-width: 100%;
}
```

現場からは以上です。
ASP.NET MVCでWebAPIテンプレートを使わずJSONを返す


##背景

普通のMVCでさらっとJSONを返したいときのメモ。
C#というかASP.NETでJSON返すのはいちいちクラスとか定義しないといけなくてしんどい。

##素のJSONを返す

文字列でJSONをそのまま返す例。""で囲まないと動かない。''ではだめ。

```csharp
public ActionResult json01()
{
    //素のテキスト（'ではだめみたい）
    string json = "{\"status\":\"OK\"}";

    //return
    return Content(json,"application/json");
}
```

結果は下記の通り。


```json
{"status":"OK"}
```

##ちょっとしたJSONを返す

私がよくつかうJSONフォーマットを返す例。
objectとそのList<>を使う。

```csharp
public ActionResult json02()
{
    //list data
    List<object> objList = new List<object>();
    objList.Add(new { id=1,name="hoge"});
    objList.Add(new { id = 2, name = "foo" });

    //response
    object obj = new { status = "OK",data = objList};

    //return
    return Json(obj, JsonRequestBehavior.AllowGet);

}
```

結果は下記の通り。

```json
{"status":"OK","data":[{"id":1,"name":"hoge"},{"id":2,"name":"foo"}]}
```

##APIを呼び出す側のHTML

呼び出す側のHTML（というかView）の例。
標準で指定される_Layout.chtmlは、bodyの下の方で下記のようにjQueryが読み込まれており、その後に出現する@RenderSection()を利用して記述します。

```html
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
```

実際にchtml側では下記のように記述します。

```html

<h2>テストページ</h2>

<button id="btn">JSONを取得</button>

@section scripts{
    <script>
        $(function () {

            $("#btn").click(function () {
                $.getJSON("/Home/json01", null, function (json) {
                    alert(json.status);
                });
            });
        });
    </script>
}
```
hibernate validatorで自作バリデーションクラスを作る

# hibernate validatorで自作バリデーションクラスを作る

## 作った経緯
ある開発でパラメータのチェックにhibernate validatorを使ってました。
あるパラメータのチェックに用意されているパターンだとカバーできなかったのでせっかくなので自作のバリデーションクラスを作る必要があったのが経緯です。
具体的には、大文字小文字英数字を必ず１文字ずつ含んだ文字列かチェックするバリデーションになります。

後で気づきましたが、この件は@Patternを使えば解決でした。
でも、せっかく作ったし今後また自作バリデーションを作る時があるかもしれないのでメモしておきます。

## 環境
- Java 1.8.0_77
- hibernate validator 5.2.4.FINAL

## 作り方
### バリデーションクラスを作る
```java:PasswordValidate
public class PasswordValidate implements ConstraintValidator<Password, String>  {
	
	@Override
	public void initialize(Password arg0) {
	}

	@Override
	public boolean isValid(String arg0, ConstraintValidatorContext arg1) {
		String pattern = "^(?=.*?[a-z])(?=.*?[A-Z])(?=.*?\\d)[a-zA-Z\\d]{8,16}$";
		return arg0 != null && !arg0.isEmpty() ? (arg0.matches(pattern)) : true;
	}

}
```
必須チェックは別でやるので、チェック対象の文字列が入るarg0が１文字以上の場合のみチェックを行います。

### 自作アノテーションを作る
```java:Password
@Target({ElementType.FIELD})
@Retention(RetentionPolicy.RUNTIME)
@Documented
@Constraint(validatedBy = PasswordValidate.class)
public @interface Password {
	String message() default "error message";
	
	Class<?>[] groups() default {};
	
	Class<? extends Payload>[] payload() default{};
}
```
message()、groups()、payload()は必ず定義する必要がありますが、今回message()でデフォルトのエラーメッセージ定義のみ行っています。

### 作ったクラスを使う
```java:Parameter
public class Parameter {

	@Password
	private String password;
	
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
}
```
あとはバリデーションをかけたいプロパティにアノテーションを付与してあげればOKです。
チェック処理は下記のような感じで

```java
public class Main
	public static void main(String[] args) {
		Parameter parameter = new Parameter();
		parameter.setPassword("");

		ValidatorFactory factory = Validation.buildDefaultValidatorFactory();
		Validator validator = factory.getValidator();
		Set<ConstraintViolation<RequestPojo>> constraintViolation = validator.validate(parameter);
		if(constraintViolation.size() > 0){
			Iterator<ConstraintViolation<RequestPojo>> iterator = constraintViolation.iterator();
			while(iterator.hasNext()){
				System.out.println(iterator.next().getMessage());
				break;
			}
		}
	}
}
```
配列を使わずに大量のループ処理をする - Linked list

大量のループを配列をつかってやりたくない場合の実装のアイディアにLinked listというのがあります。
ActionScriptで誰かがつかっていて思い出せなかったのを思い出した記念エントリーです。
JSに置き換えてメモしてみます。

ASでは[BetweenAS3](http://www.libspark.org/wiki/BetweenAS3/en)なんかで[毎フレームTweenオブジェクトを処理する](http://www.libspark.org/browser/as3/BetweenAS3/tags/alpha-r3022/src/fp10/org/libspark/betweenas3/tickers/EnterFrameTicker.as#L148)のに使われていました。
(※ここでは、さらに[ループ展開](http://ja.wikipedia.org/wiki/%E3%83%AB%E3%83%BC%E3%83%97%E5%B1%95%E9%96%8B)というテクニックが使われているので、1ループ内で同じ処理を8回行うようになっています)

```js
function Particle(x,y) {
  this.x = x;
  this.y = y;

  this.next = this.prev = null;
}

// Setup Linked list
var numParticles = 100000;
var first,
var p = first = new Particle(0,0);
for(var i = 0; i < numParticles; i++) {
  var prev = p;
  p = new Particles(0, 0);
  p.prev = prev;
  prev.next = p;
  prev = p;
}
```

使うときはこんなかんじで最初から次へ次へたどってなくなるまでwhileでループします
終了条件も単純だし配列へのアクセスがありません。

```js
function drawParticle(p) {/* draw to canvas */}

var current = first;

while(current) {
  drawParticle(current);
  current = current.next;
}

```

パーティクルなど、要素が消失する場合は前後のオブジェクトの繋ぎ直しをする必要がありますが、この時も `Array#indexOf`や `Array#splice`などを使う必要がないです。

```js
function drawParticle(p) {/* draw to canvas */}
function isOutside(p) {
  return p.x > 500 || p.x < 0 || p.y > 500 || p.y < 0;
}

var current = first;

while(current) {
  drawParticle(current);

  if(isOutside(p)) {
    // 寿命なりエリア外なりで不要になったら、前後のリンクを繋ぎ直す
    var prev = current.prev;
    var next = current.next;

    if(!prev) { // 先頭の場合
      first = next;
      next.prev = null;
    }
    else {
      prev.next = next;
      next.prev = prev;
    }
    
    current = next;
  }
  else {
    current = current.next;
  }
}

```

欠点は順序が重要な場合に特定の位置に何かしたり、何番目かは判断できないことです。
そういう場合は素直に配列を使うか、ループはLinked listで順番の管理は配列というふうに併用する形になります。
要素の高さを揃えるときにUnderscore#reduceが便利

複数のDom要素の高さを揃えたいとき、一旦すべての要素走査してMath.maxして最大の高さを取っておく必要があり地味に面倒なのでやり方を模索したメモ。

### ありがちな実装例
```js
var maxHeight = 0;
$('.target-item').each(function(element) {
  maxHeight = Math.max(maxHeight, $(this).height());
});
$('.target-item').height(maxHeight);
```

### すっきり版？
ひとまずUnderscore.js の `_.reduce`をつかうと、比較的スッキリ書けて何やってるか分かりやすい気がします。

```js
// シンプルな例
var max = _.reduce([1,12,23,3,43,9,3], function(memo, val) { return Math.max(memo, val) });
// => 43

var min = _.reduce([1,12,23,3,43,9,3], function(memo, val) { return Math.min(memo, val) });
// => 1
```

上記の例だと`Math.max.apply(Math, [1,12,23,3,43,9,3]);`とかしておけよってかんじなんですが、実際にはjQueryで要素など配列で渡して、特定の評価をしたうえで最終的な結果を得ることができます。

```
var min = _.reduce($('.target-item'), function(memo, element) { return Math.min(memo, $(element).height()) }, 0);
```
2017年のハッカソン開催情報まとめ！

ハッカソンの情報を見えている範囲でまとめています。
2017年も多数開催ありますね！

申し込み条件や締め切り日に注意！
随時追記しています。

[2017年のハッカソン開催情報まとめ！ - 1月/2月分](http://qiita.com/satoshi0212/items/8acc261636198186aa6e)
[2017年のハッカソン開催情報まとめ！ - 3月/4月分](http://qiita.com/satoshi0212/items/96baae6c4fafe5e548a8)
[2017年のハッカソン開催情報まとめ！ - 5月/6月分](http://qiita.com/satoshi0212/items/93f4002c9a7ad55cc3d2)
[2017年のハッカソン開催情報まとめ！ - 7月/8月分](http://qiita.com/satoshi0212/items/bc44d7aa9222eb0daacc)
[2017年のハッカソン開催情報まとめ！ - 9月/10月分](https://qiita.com/satoshi0212/items/38c5fe548f0b81c511a6)
[2017年のハッカソン開催情報まとめ！ - 11月分](https://qiita.com/satoshi0212/items/5f73b44179f247940e4e)


# 12月

### [大阪港開港150年記念イベント「フェリーハッカソン」](https://code4osaka.connpass.com/event/67997/)
- 12月1日-3日

### [RESASハッカソン2017 in 沖縄 ～Web・IoTで創る沖縄のミライ](https://opendata.resas-portal.go.jp/contest2nd/hackathon/index.html)
- 12月2日-3日

### [RESASハッカソン2017 in 京都 ～Web・IoTで創る京都のミライ～](https://opendata.resas-portal.go.jp/contest2nd/hackathon/index.html)
- 12月9日-10日

### [Yahoo! JAPAN Hack Day 10th Anniv.](https://hackday.jp/)
- 12月9日-10日

### [【Kitchen×Tech】キッチンハッカソン2017](https://oi-study.connpass.com/event/70762/)
- 12月9日-10日

### [JINS MEME IDEATHON](https://jins-meme.com/ja/gaming/ideathon/)
- 12月9日-10日

### [Mercari AR Hackathon #0](https://vrtokyo.connpass.com/event/71473/)
- 12月17日


# 2018年1月

### [“Webとクルマのハッカソン 2018”次世代自動車におけるWebとクルマの連携アプリ／ビジネスを創発しよう！](https://rp.kddi-research.jp/hackathon)
- 1月27日-28日

# 2月

### [HACK-CHU!（ハックチュー）](http://www.ctv.co.jp/hackathon2018/)
- 2月17日 予選【アイデアソン】 
- 2月24-25日 本選【ハッカソン】 


# 備考
日時・場所はまとめ時点から変更される可能性があります。
jquery swapImageGallery（width固定、height可変、非プラグイン）

スワップイメージ（画像切替）の画像ギャラリーです（width固定、height可変）。
サムネイルリストの画像リンクをクリックするとリンクパスを取得し、メインの画像を差し替えます。
元画像ファイルの縦横比を保ちつつ、ページロード時のメイン画像widthを基準に画像・表示領域をリサイズします（フェード効果付き）。
メイン画像にlightbox設置を想定していますが、必要無ければメイン画像のaタグは無くても動作に影響はありません。
同一ページ内の複数箇所へ設置可能ですが、プラグイン化はしていません。

jquery1.9.1/1.11.1で動作を確認。

```ruby:jquery.swapImageGallery
jQuery(function($) {
  var wrapper = ".js-swapImage";  // ギャラリーラッパー要素
  var target = ".targetImg";      // メイン画像ラッパー要素
  var listElement = ".thumbnail"; // サムネイルリスト要素
  var resizeSpeed = "normal";     // リサイズの速さ：slow/normal/fast/数値（ミリ秒）
  var fadeSpeed = "fast";         // フェードの速さ：slow/normal/fast/数値（ミリ秒）
  var newImg = new Image();

  // 複数設置対応のため固有id番号を割り当て
  $(wrapper).each(function() {
    var num = $(wrapper).index(this);
    $(target+' img',this).wrap($("<span></span>").attr('id', 'targetImg' + num));
    $(listElement+' a',this).each(function() {
      $(this).attr('rel', 'targetImg' + num);
    });
  });

  // サムネイル クリック時処理
  $(listElement +' a').click(function(){
    var targetElement = '#' + $(this).attr('rel');
    var changeSrc = $(this).attr('href');
    var imgWidth = $(targetElement +' img').attr('width');
    changeImg(targetElement,changeSrc,imgWidth);
    return false;
  });

  // 画像変更処理
  function changeImg(targetElement,changeSrc,imgWidth){
    newImg.target = $(targetElement).children('img');
    newImg.imgWidth = imgWidth;

    newImg.onload = function(){
      var gcm = gcd(newImg.width, newImg.height);
      newImg.imgHeight = Math.round((newImg.imgWidth/(newImg.width/gcm))*(newImg.height/gcm));

      $(newImg.target).stop();
      $($(newImg.target).closest('span')).stop();
      $('a',target).attr('href',changeSrc);

      $(newImg.target).fadeOut(
        fadeSpeed,
        function(){
          $(this).attr({
            src : newImg.src,
            height : newImg.imgHeight
          }).fadeIn(fadeSpeed);
        }
      );
      $($(newImg.target).closest('span')).animate(
        {height: newImg.imgHeight},
        {duration: resizeSpeed, easing: 'linear'}
      );
    };
    newImg.src = changeSrc;
  }

  // 最大公約数計算
  function gcd(x, y){
    if (y === 0) return x;
    else return gcd(y, x % y);
  }
});
```

```ruby:html
※メイン画像のheight属性は指定しない
<div class="js-swapImage swapimage">
  <div class="targetImg"><a href="img01.jpg" rel="lightbox"><img src="img01.jpg" width="400" alt="メイン画像"></a></div>
  <ul class="thumbnail">
    <li><a href="img01.jpg"><img src="img01.jpg" width="120" alt="サムネイル"></a></li>
    <li><a href="img02.jpg"><img src="img02.jpg" width="120" alt="サムネイル"></a></li>
    <li><a href="img03.jpg"><img src="img03.jpg" width="120" alt="サムネイル"></a></li>
  </ul>
</div>
```

```ruby:css
/* サンプル用css 
   ※無くても動作に影響はありませんので任意のスタイルをあててください。
*/
.swapimage {
  overflow: hidden;
}

.swapimage ul,.swapimage li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.targetImg {
  float: left;
  width: 400px;
  margin: 0 0 20px;
  padding: 2px;
  border: 1px solid #999;
}

.thumbnail{
  overflow: hidden;
  zoom: 1;
  padding: 0 20px 20px;
}
```

昔に書いてから、ちゃんとチェックしていませんので色々と荒があるかと思います。。
Delphi/C++Builder/RAD StudioのIDEで「最近開いたプロジェクト」の履歴を消す

# 見えすぎちゃって～困るのう。。。
今時のツールは直近で開いたファイルの履歴を覚えていてくれるわけですが、Delphi/C++Builderのように開発で使うツールは、そういう履歴が見えていると色々とマズイ場合があると思うんですよね。

例えばこんなふうに。
![image](https://qiita-image-store.s3.amazonaws.com/0/149350/3d047eb9-1d5c-683a-5f98-d6a802935da5.png)

開発系のイベントや勉強会では、IDEの画面を見せることもあると思いますが、こういうのが丸見えなのは頂けない。


だからこういうときは履歴をきっちり消してしまいましょう。

# 消し方

## IDE のメニューから消す
IDEのメニューで[ファイル] => [開き直す] => [プロパティ]の順に選びます。
![image](https://qiita-image-store.s3.amazonaws.com/0/149350/5e5070d4-6175-9c73-c5ca-12c2e7bf2122.png)

すると、こういうメニューが開きますので、ここから一括で削除したり、あるいは個別のプロジェクトやファイルを選んで履歴から消すことができます。
![image](https://qiita-image-store.s3.amazonaws.com/0/149350/679e6a65-b19f-4b6e-9f4f-7ff9b65cf4ed.png)


## これらの内部設定を半自動的に消したい場合は……

以下の内容を "delete_recent_project.10_1.reg" みたいなファイル名で保存し、これをエクスプローラから開けばワンクリックで消えます。

```
Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\SOFTWARE\Embarcadero\BDS\18.0\Closed Projects]
"File_0"=-
"File_1"=-
"File_2"=-
"File_3"=-
"File_4"=-
"File_5"=-
"File_6"=-
"File_7"=-
"File_8"=-
"File_9"=-
```

ただし、パスの数値 (18.0) は製品のバージョンによって異なるので、この消し方をする場合は実際のパスを確認する必要がありますが。

なお、レジストリ設定のバッチ処理的な更新については以下のURLにて説明されています。レジストリ操作は間違うと色々問題がありますけど、こういうファイルを作っておけばキーや値を変更したり、削除したりという作業がオートマチックに行えるので、うまく使うと案外便利です。
https://support.microsoft.com/ja-jp/kb/310516
何かがtrueになるまで定期的に実行する非同期ループ

たとえばポーリングなど何かしらの条件が満たされるまで定期的にチェックし続けたいような処理をきれいにかけないか試してみた例。

`limit` はチェック回数だけど、タイムアウトでもいいかもしれない。

```
  function execution(func, interval, limit) {
    var id, count;
    setInterval(function () {
      count++;
      if(func.call() || (!isNaN(limit) && limit === count)) {
        clearInterval(id);
      }
    }, interval);
  }
```

```
execution(function() {
  if(Math.random() > 0.5) return false; //条件に満たない
  // Do something.
  return true;
}, 100);
```
call_user_func_arrayを使った共通処理作成

例えば、ある処理内で外側の処理を共通化させたいという場合がある。
トランザクションとか。これは例外処理内でbeginとcommitで挟みこむという形をとり、内の処理はそれぞれ異なる。
このトランンザクションを共通化させるときには高階関数とcall_user_func_arrayを使う。
トランザクション処理内で関数を可変関数として実行させることで、トランザクションを共通化して使える。
ただ、問題になるのは引数。

関数は可変関数として動的に実行できるが、引数の数は各関数固定になっている。
この問題を解決するのがcall_user_func_array。これはコールバック関数の実行時に引数を配列で渡すことが可能。
配列で渡すと、トランザクション処理内では、引数の数を気にする必要がないので、そのまま渡すだけで良い。


```php
	private function transaction($func, array $args ) {

        try {
            $this->instance->beginTransaction();

            call_user_func_array([$this,$func], $args);

            $this->instance->commit();
        } catch(Execption $e) {
            $this->instance->rollBack();
        }
        return;
    }

    public function register() {
        $this->transaction('regist', [$parent_id, $child_id]);
    }

    public function updater() {
        $this->transaction('update', [$parent_id, $child_id, $title]);//引数の数が違っても大丈夫
    }

```
Chrome Extensionのcontent script内で対象ページに<script>でインジェクトするとchrome.xxxが使えない場合がある

ハマって調べてたらあまり言及されてなかったようなのでメモ。

# やりたかったこと
content scriptとevent pageでやり取りしたかったので、chrome.runtime.sendMessageとかchrome.runtime.onMessageとか使ってみたけどうまくいかなかった。

# やったこと

まずやってみたのは、[sendMessage](https://developer.chrome.com/extensions/runtime#method-sendMessage)のリファレンスでは同じExtension内ならidが不要とあったので、id無しでやりとりしてみた。

```content_script.js
chrome.runtime.sendMessage({method: 'greeting', body: 'hello'}, function(response) {
    console.log(response);
});
```

```eventPage.js
console.log('test'); //test
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log(request.body);
    sendResponse('Hello!');
});
```

この場合、Developer ToolsのConsoleを見るとエラーが出た。悲しい。

```Console
Uncaught Error: chrome.runtime.connect() called from a webpage must specify an Extension ID (string) for its first argument(…)
```

この時点でなんかおかしいよな～とは思ってたけど、とりあえずExtensionのidを指定してみることに。

```content_script.js
var id = 'abcdefghijklmnopqrstuvwxyz';
chrome.runtime.sendMessage(id, {method: 'greeting', body: 'hello'}, function(response) {
    console.log(response); //undefined
});
```

```eventPage.js
console.log('test'); //test
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log(request.body); //呼ばれない
    sendResponse('Hello!'); //勿論呼ばれない
});
```

この場合は上記のような結果になりました。ちゃんとidも指定したし、そもそもonMessageが働いてないのはどういうことか……と思い完全に頭を抱えていました。

# 結果

ググった結果、stackoverflowにそれっぽい回答がいくつかありました。

[Gmail Chrome Extension “chrome.extension” undefined](http://stackoverflow.com/questions/27913065/gmail-chrome-extension-chrome-extension-undefined)
[Why is chrome.runtime undefined?](http://stackoverflow.com/questions/27207129/why-is-chrome-runtime-undefined)
[Building a Chrome Extension - Inject code in a page using a Content script](http://stackoverflow.com/questions/9515704/building-a-chrome-extension-inject-code-in-a-page-using-a-content-script)

だいたい「Chrome API使わない時はInjectした方がいいけど、使いたいならInjectしないかちょっとしたハックしないとダメだよ」みたいなことが書いてある気がします(英語力……)。
そこまで追加したい機能でもなかったので実際には試していませんが、困っている人が簡単に辿り着ければ……と思い書き留めておきます。

# 蛇足

onMessageは動いてるけどresponseがundefinedになる！という方は、onMessage.addListener内で非同期処理を行っている場合が考えられます。
その場合は、`return true;`してやれば良いみたいなのでお試しあれ。
[公式リファレンス](https://developer.chrome.com/extensions/runtime#event-onMessage)に一応太文字で書いてあります。
To reflect env profile to GUI apps on macOS 〜OSX上のGUIアプリに環境変数を反映させる方法〜

I had some trouble when I developed on IntelliJ IDEA.
Although I exported JAVA_HOME in .bashrc, it wasn't reflected to GUI app(IDEA).

R3 CordaはKotlinを使っています。ということでIntelliJ IDEAを使うことにしたのですが、
JAVA_HOMEの設定が反映されずにいて困っていました。

Please see the following steps.

ということで、以下のステップを御覧ください。

### Step1. set JAVA_HOME in your .bash_profile

```.bash_profile
# Your other settings

export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_111.jdk/Contents/Home

```
* run: source ~/.bash_profile


### Step2. make .osx-env-sync.sh

```~/.osx-env-sync.sh
grep export $HOME/.bash_profile | while IFS=' =' read ignoreexport envvar ignorevalue; do
  launchctl setenv ${envvar} ${!envvar}
done
```

### Step3. make osx-env-sync.plist

```~/Library/LaunchAgents/osx-env-sync.plist
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>Label</key>
  <string>osx-env-sync</string>
  <key>ProgramArguments</key>
  <array>
    <string>bash</string>
    <string>-l</string>
    <string>-c</string>
    <string>
      $HOME/.osx-env-sync.sh
    </string>
  </array>
  <key>RunAtLoad</key>
  <true/>
</dict>
</plist>

```

### Step4. change mode the file to executable
```
chmod +x ~/.osx-env-sync.sh
```

### Step5. make these preference valid
```
launchctl unload ~/Library/LaunchAgents/osx-env-sync.plist
launchctl load ~/Library/LaunchAgents/osx-env-sync.plist
```

Done! Please check if your GUI apps can read JAVA_HOME!!
I hope this article could be useful.

以上です。
GUIアプリに環境変数が反映されたことを確認出来たでしょうか？
少しでもお役に立てたら幸いです。
【MySQL】ストアドプロシージャー①

MySQLのストアドプロシージャについてまとめます。


# ストアドプロシージャとは
複数のSQL文をまとめて、名前を付けて関数のように呼び出せる。


# シンプルなストアドプロシージャの作成の例

```sql
1  mysql> delimiter //                        
2  mysql> create procedure sample()      
3      -> begin                               
4      ->   select * from User;
5      -> end                                 
6      -> //
7  Query OK, 0 rows affected (0.00 sec)
8
9  mysql> delimiter ;                             
```

### L1 delimiterの変更
delimiterとは終端文字のことです。
MySQLでは終端文字が`;`に設定されており、`;`があった時点でそこまでが実行されてしまいます。
上記のコードはストアドプロシージャの作成を行っていますが、delimiterを変更しないと、L4でこのスクリプト(CREATE PROCEDURE)が実行されてしまいます。
そのため、最初にdelimiterを変更し、作成が終わったらL9でdelimiterをもとに戻しています。

### L2 ストアドプロシージャの作成
`create procedure <PROCEDURE_NAME>`でストアドプロシージャの作成を行います。

### L3~L5 ストアドプロシージャの本体
`begin~end`の間にストアドプロシージャの本体を書きます。
今回はL4の1行ですが、複数行のSQLを書くことができます。

### L6 終端
終端文字(delimiter)がL1で`//`に設定されていますので、ここで`create procedure`が実行されます。

### L9 delimiterの変更
delimiterを元に戻します。


# ストアドプロシージャの呼び出し
```sql
1  mysql> call sample();
```

`call <PROCEDURE_NAME>()`で作成したストアドプロシージャを呼び出すことができます。


# ストアドプロシージャへの操作

### ストアドプロシージャの確認
```sql
show create procedure <PROCEDURE_NAME>;
```

### ストアドプロシージャの削除
```sql
drop procedure <PROCEDURE_NAME>;
```

# ストアドプロシージャの書き方
以下、delimiterの設定等は省略します。


### 引数ありのストアドプロシージャを作成する

引数に設定されたIDを持つuserを取得するストアドプロシージャを作ります。

```sql             
1  mysql> create procedure sample(IN id INT)      
2      -> begin                               
3      ->   select * from User where ID = id;
4      -> end                                 
5      -> //
```

引数の場合は定義に`IN <INPUT_NAME> <DATA_TYPE>`が必要になります(L1)。
これで、idという名のINT型の引数を定義することができます。

```sql
1  mysql> call sample(10);
```

上記のように呼び出すことができます。



### 出力をするストアドプロシージャを作成する

出力引数を持つストアドプロシージャも作成することができます。
ストアドプロシージャの実行後、ストアドプロシージャの外からアクセスすることができます。

```sql             
1  mysql> create procedure sample(OUT res INT)      
2      -> begin                               
3      ->   select count(*) from User into res;
4      -> end                                 
5      -> //
```

出力引数の場合は、定義に`OUT <OUTPUT_NAME> <DATA_TYPE>`が必要です(L1)。
L3のように`・・・into <OUTPUT_NAME>`で出力変数に値を格納できます。

```sql
1  mysql> call sample(res);
2  mysql> select res;
```

実行時の引数に変数を渡し、`select　<OUTPUT_NAME>`でストアドプロシージャ内で、出力変数に格納された値を出力できます。


###
Railsのファイルパスの操作のメモ

毎回ググっているのでメモ

#### プロジェクトルートパスの取得
```rb
Rails.root.to_s
# => "/Users/user_name/Documents/workspace/ruby/project_name"
```

#### 現在の実行ファイルのパス
```rb
__FILE__
# => "/Users/user_name/Documents/workspace/ruby/project_name/spec/exec_file.rb"
```

#### ディレクトリの取得
```rb
Rails.root.dirname
# => "/Users/user_name/Documents/workspace/ruby"
File.dirname(__FILE__)
# => "/Users/user_name/Documents/workspace/ruby/project_name/spec”
```

#### パスの加工
```rb
Rails.root.join('hoge', 'huga').to_s
# =>"/Users/user_name/Documents/workspace/ruby/project_name/hoge/fuga"
File.expand_path('../../shared/log/unicorn.log', Rails.root)
# => "/Users/user_name/Documents/workspace/shared/log/unicorn.log”
```
Vim | 正規表現でプラス ( + ) が使えない ( クエスチョンマーク、パイプ、アンド、ブレース、丸カッコも )

# 解決

プラス (`+` ) を バックスラッシュ ( `\` ) でエスケープしよう。

Bの連続を置換する場合の例。

![image](https://qiita-image-store.s3.amazonaws.com/0/89618/99d403f8-58e7-3628-17e2-73c998041fb7.png)

![image](https://qiita-image-store.s3.amazonaws.com/0/89618/0fbcaec7-22c6-a820-c35d-1786c6d65eaa.png)

# 問題

正規表現の `+` が使えない。

![image](https://qiita-image-store.s3.amazonaws.com/0/89618/824d7497-2428-8534-a765-fc15103e3425.png)

![image](https://qiita-image-store.s3.amazonaws.com/0/89618/e5f760a0-3577-3fa1-3537-e77710f65a3b.png)

# 備考

- クエスチョン ( `?` ) パイプ ( `|` ) アンド ( `&` ) ブレース ( `{` ) 丸カッコ ( `(` `)` )もエスケープする必要がある。


# 環境

- Vim 7.3

# 参考

- http://vim.wikia.com/wiki/Search_and_replace

>+, ?, |, &, {, (, and ) must be escaped to use their special function.








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
【mocha】テスト実行Tips

mochaにて単体テストを実行するときのTips集です。


# 指定したテストのみを実行する　その1
実行したいテストに`only`を付けます。

特定のdescribeを実行したいとき

```js
describe('test1', function () {
  ...
});
describe.only('test2', function () {
  // このdescribeのみが実行される
});
```

特定のitを実行したいとき

```js
describe('test1', function () {
  it("case1", function(done){
    ...
  })
  it.only("case1", function(done){
    // このitのみが実行される
  })
});
```

※コミットするときに外し忘れないように



# 特定のテストを実行しない
実行したくないテストに`skip`を付けます。
onlyと同様に、describeにもitにも付けることができます。

特定のdescribeを実行したくないとき

```js
describe('test1', function () {
  ...
});
describe.skip('test2', function () {
  // このdescribeは実行されない
});
```

※コミットするときに外し忘れないように


# ファイルの変更を監視して自動でテスト実行
実行時のコマンドで`-w`もしくは`--watch`を使用します。

```
mocha -w test.js

OR

mocha --watch test.js
```
プロジェクト管理スキルを使ってモノ言わぬPOと円滑に過ごそう

こんにちは。seimiyajunです。
これは[カノジョできてるエンジニア Advent Calendar 2016](http://qiita.com/advent-calendar/2016/yes-girlfriend)の8日目の記事です。
技術記事ではないので技術記事だと思ってアクセスしてきた人は、[バーボンハウス](http://dic.nicovideo.jp/a/%E3%83%90%E3%83%BC%E3%83%9C%E3%83%B3%E3%83%8F%E3%82%A6%E3%82%B9)だと思って落ち着いて欲しい。

#おことわり
まぁ個人の体験を元に書いているものなので、「おれは違う」とか「そんなことないよ」というのはあると思います。
これはAdvent Calendarというお祭りなので、その点はあまりかたく捉えずに読んでいただけると幸いです。

#本題
みなさん、プロジェクト管理してますか？

こと仕事に限れば特にSIerから怨嗟の声が聞こえてきそうなワードですが、プライベートでは自らのプロジェクトに加えてパートナー主体のプロジェクトも（勝手に）推進できてしまう素敵ワードです。

#家庭におけるPO
PO: そのこと・そのエリアについて責任を持つ人（Place Owner。以下、POとします）
家庭においては責任の所在を明確にするとケンカになりやすいので、実際に手を動かしてその場を取り仕切っている人をPOに据えると良いでしょう。

POは仕事においては意思決定する人ですが、家庭においてはそうとも限りません。
実際に手を動かす人＝POの中にはモノを言わない（言えない）POもほどほど多くいるように感じます。
その場合、目の前のことを今のやり方で日々やってその結果として不満・ストレスを抱えるという負のサイクルに陥ります。
（自分でやり方決めつけて不満を抱えてないで、考えてやり方変えろよ、と思えるのはあなたが自律的なエンジニアだからです）

なぜ不満がありつつも今までのやり方を踏襲してしまうのか（改善できないのか）というと、要件定義をできないからです。

#エンジニアの基本スキルである要件定義はみんな意外とできない
要件定義ができない（しない）人の頭の中にあるのは、
今の状態に対して「もっとデザインが良いもの」とか「使いやすいもの」とか「xxしやすいもの」みたいな相対化された不満であって、
それを言語化して機能・非機能・コスト・運用を要求定義・設計できないんですね。

ことカノジョに関しては相手の幸せは自分の幸せなので、そういう時こそ仕事で培ったビジネススキルを使って、自分ごととしてやってしまいましょう。

#最近の家庭内プロジェクト事例
食洗機導入

##状況
- キッチンの使い方は妻のみが知っている
- 子供が生まれて仕事との両立で家事にかける時間がない
- 繁忙期で仕事も忙しい

##やったこと
###観察
- 日々のキッチンの状態
- 棚の中にあるもの
- どのような使い方をしているか

###ヒアリング
- どうしたいか
- どんな機能が欲しいか
- どこに設置するのが良いか（ビルトインor卓上）
- 評価基準（何を重視するか）

###運用設計およびトレーニング
- 食洗機導入によって解決出来る手間、増えてしまう手間を早いうちに明示しておく
- 食洗機を使う際のポイントなどググって伝えておく
（カレー等は軽く洗ってから入れる等）
- あるべき運用例の例示

###候補のリストアップ（提案）
- 機種
- 価格（初期費用、ランニング費用）
- 発生する手間（毎日のお手入れ、定期的なメンテナンス）
- メリット・デメリット（と思われるもの）
- 導入イメージ（パナソニックのアプリではARで設置イメージを確認できます）

###購入
提案のレスポンスを踏まえて、勝手に機種を決めて、勝手に日程を決めて購入する
※【重要】相手に決めさせるのは無理です。
　決められる人はそもそも自分で要件定義して購入しています。
　『「食洗機を買う」と心の中で思ったならッ!その時スデに行動は終わっているんだッ!』と私の知っている有名な本にも書いてありました。

##使ったプロジェクト管理ツール
- Trello: ボードを1つ立ち上げ、タスクをカードに落とし込んでいきましょう。カード（タスク）は一度に完結するサイズにすると取り組みやすくて良いです。
- iPhoneのカメラ: 取り組みを定期的にカメラで撮っておきましょう。人間は忘れやすいので、その時の状況や気持ちを呼び起こすのに画像は効果あります。
- ドキュメント：　カタログやWebページの印刷など、見かけたものはとりあえず一箇所にまとめておきます。
- LINE: コミュニケーションツールとして。ログは流れるので相手のレスポンスは常にTrelloに書き込んでおきましょう。Face to Faceで会話ができるならそれが一番です。

#まとめ
##プロジェクト管理を自分で行うメリット
- 自分の好きなように方向性を決められる
- 自分のペースで検討できる
- 自分ごととして取り組むと結果的に一番良い形に落着する
- 相手のパフォーマンスが改善できると自分のストレスが減る
- 仕事に関係あるスキルを磨ける

##プロジェクト管理のネガティブポイント
- カノジョを巻き込もうとするとめんどくさがられる
（そもそもPOによるマイクロマネジメントになりやすいのでプロジェクト管理ツールは絶対に開示しない）
- なんで自分が使わない道具の要件定義してるんだろうという気持ちになる
相手がハッピーになるんだという強い気持ちで取り組みましょう。
- 自分の気持ちが続きづらい。なので必ず3ヶ月以内に決着するように短期決戦でぜひ。

##伝えたかったこと
そんな取り組みよりはちゃんと家事やれよ、という意見もあるかと思いますが、無理をしてがんばるよりは無理なくできることをちゃんとやっていく方がお互いストレスが溜まらなくて良いかなと個人的に思っています。
なにより勝手に要件定義してプロジェクト推進するのは楽しいよ！（失敗しても責任追及されないし）

これでようやく共働き三種の神器であるところの洗濯乾燥機、食洗機、ルンバ（+ブラーバ）が導入できました。
次は食洗機の初期流動対応をしつつ、冷蔵庫と食器棚、レンジを買い替えようかなぁ。
「Unable to find AWS credentials～」のエラー出た

下記のサイトを参考にZabbixでAWS/CloudWatchの監視設定するも
アイテムのステータスが取得不可となり「Credentials.Unable to find AWS credentials」のエラーが出た

■参考サイト
http://dev.classmethod.jp/cloud/aws/zabbix-with-cloudwatch/

■エラー内容


```
Received value [/usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/credential_providers.rb:140:in `credentials': (AWS::Errors::MissingCredentialsError)Missing Credentials.Unable to find AWS credentials. You can configure your AWS credentialsa few different ways:* Call AWS.config with :access_key_id and :secret_access_key* Export AWS_ACCESS_KEY_ID and AWS_SECRET_ACCESS_KEY to ENV* On EC2 you can run instances with an IAM instance profile and credentials will be auto loaded from the instance metadata service on those instances.* Call AWS.config with :credential_provider. A credential provider should either include AWS::Core::CredentialProviders::Provider or respond to the same public methods.= Ruby on RailsIn a Ruby on Rails application you may also specify your credentials inthe following ways:* Via a config initializer script using any of the methods mentioned above (e.g. RAILS_ROOT/config/initializers/aws-sdk.rb).* Via a yaml configuration file located at RAILS_ROOT/config/aws.yml. This file should be formated like the default RAILS_ROOT/config/database.yml file.	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/credential_providers.rb:62:in `access_key_id'	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/client.rb:549:in `build_request'	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/client.rb:491:in `block (3 levels) in client_request'	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/response.rb:175:in `call'	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/response.rb:175:in `build_request'	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/response.rb:114:in `initialize'	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/client.rb:203:in `new'	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/client.rb:203:in `new_response'	from /usr/local/share/ruby/gems/2.0/gems/aws-sdk-v1-1.66.0/lib/aws/core/client.rb:49

```

credentialsの設定を見直したり、.bash_profileにAWS_SECRET_ACCESS_KEYやAWS_SECRET_ACCESS_KEYのexportを入れたしたけど、ダメだったので
/usr/lib/zabbix/externalscripts/にconfig.ymlを作成して以下の設定をし
ruby実行スクリプトの中に以下を追加したらセキュリティ的にベストじゃないけどもWEBUI上でエラーがなくなった。


■config.yml

```
access_key_id: *****************
secret_access_key: *****************
```

■/usr/lib/zabbix/externalscripts/cloud_watchに追加

```
require 'yaml'

config = YAML.load(File.read("config.yml"))
AWS.config(config)
```
PHPとGoutteでスクレイピング

使う機会があったのでまとめてみます。
[Goutte](https://github.com/FriendsOfPHP/Goutte)

# まずはComposerのインストールから
GoutteをインストールするにはComposerを使います。
[手順はこちら](https://kohkimakimoto.github.io/getcomposer.org_doc_jp/doc/00-intro.html)
自分はMacを使っているのでbrewでグローバルにインストールします。

```
$ brew tap josegonzalez/homebrew-php
$ brew install josegonzalez/php/composer
$ composer -V
Composer version 1.2.4 2016-12-06 22:00:51
```

# Goutteをインストール
Composerでインストールします。簡単ですね。

```
$ composer require fabpot/goutte
```

完了するとvendorというディレクトリができます。この中にGoutteだったり依存しているライブラリが入っています。

# 使ってみる

1. vendor/autoload.phpをrequireする
2. Clientを作る
3. ページにアクセスしてCrawlerを作る
4. 目的の要素をfilterで絞って何かする

```php
<?php

// 1
require_once './vendor/autoload.php';

// 2
$cli = new Goutte\Client();

// 3
$url = '対象ページのURL';
$crawler = $cli->request('GET', $url);

// 4
$title = $crawler->filter('div.article > div#body > h1')->text(); // タイトルを取得
$crawler->filter('table > tr > td')->each(function($td){
    echo $td->text()."\n"; // テーブルのtd要素のテキストを出力する
});
```

filterの引数にはCSSセレクタを指定します。
[CSS3のセレクタ全42種 まとめておさらい使い方リファレンス](http://wp-e.org/2014/05/20/2420/)

Crawlerについては以下がわかりやすいです。
[Webスクレイピングが捗るGoutteを使ってみる](http://blog.asial.co.jp/1316)
> 見た感じ配列のユーティリティクラスを継承してるようですね。
> クローラーオブジェクトの役割はデータ抽出の作業者でよさそうです。
> eq, attr, text, html, extract, selectLink, selectButton, link, links, form あたり覚えておけば良さそうです。
> 配列操作だと each, first, last, filter, contains, count あたりはよく使いそうですね。

大体使うのは引用の通りです。

後は対象のHTMLとにらめっこして、ほしい要素がどうやったら指定できるか考えるだけ！

# おわりに
あまり他のスクレイピングライブラリを使ったことないですが、Goutteは導入も使うのもそんなに苦労しませんでした。
どちらかと言うとスクレイピングするページのHTMLが汚くて苦労することが多いです。世の中のHTMLがきれいな構造になることを祈ります。。。

# 参考
自分は単一ページのスクレイピング用途でしか使っていませんが、クローラーとしてももちろん使えます。

* [Goutteでスクレイピングする方法めも](http://qiita.com/77web@github/items/3cd3b56985d5c6845661)
* [PHP と Goutte ではじめる超絶簡単クローラー入門 ログイン編](http://qiita.com/mojibakeo/items/be68498764909a66f126)
古の習わしに従いCmderコンソールを全画面半透過で運用する

#98x1や68k使ってたそこの貴方！！
そうあのVRAM+テキストオーバーレイとかいう単語にウキウキしてしまうそこのアナタですよ！！
壁紙デスクトップ＋CUIです
ということでCmder設定メモです

##Cmderとは
拡張端末エミュレータ「ConEmu」、cmd.exeを代替するべく開発されたらしい
CmderはConEmuの改造版

##cmder設定モード移行
cmder起動したら
WIN+ALT+Pです、これだけとりあえず覚えときます。


##全角文字が詰まる不具合の対応
setup＞main＞MonoSpaceのチェックを外す


##setup、コンソール背景の透明度
Futures＞Transparency＞Alpha Transparency＞ActiveWindowTransparency＞ Transparentバーを設定

##setup、カーソルキャラクタを変更
Features -> Text cursor -> Active console Text Cursor => Rectangle


##setup、フルスクリーン且つ窓枠を表示しない設定
setup＞Size&Pos＞Window Size 「Full screen」にチェック
setup＞Main＞tabber＞Don't show
Setup＞Features＞StatusBar＞ShowStatusBarのチェックを外す
Setup＞Main＞Appliance＞TitleBar(Caption)･･･＞HideCaptionWhenMaximizedのチェックを入れる

![image.png](https://qiita-image-store.s3.amazonaws.com/0/125818/abb555d1-2e46-920b-1bd8-ef973918eae9.png)

##スタートアップシェルをPowerShellにする
Setup＞Startup＞Tasks＞PredefinedTasks(CommandGroups)＞PowerShell as Adminを1位にする

##ユニコード表示範囲設定
Setup＞main＞Unicode Rangesを「Far Manager borders: 2500-25C4;」に変更


##init.bat設定
コマンドプロンプトを「λ」から「＞」に変更
 を開き、プロンプトの指定を変更。 ※{lamb}を$G(不等号>)にします。

具体的には以下の文、を

```コマンドプロンプトをDOSっぽくする文
 @prompt $E[1;32;40m$P$S{git}$S$_$E[1;30;40m$G$S$E[0m
 chcp 65001
 cd h:\data\txt\
 cls
```

Full版はCmderインストールフォルダ配下のvendorフォルダ「init.bat」を編集
以下の手前に挿入＞セーブ

```\vendor\init.bat

　exit /b
::
:: sub-routines below here
::
:verbose-output
    if %verbose-output% gtr 0 echo %*
    exit /b
```
#こちらが出来上がったものです、(個人的事情によりトリミングしました)
![image.png](https://qiita-image-store.s3.amazonaws.com/0/125818/22d973d4-7aee-3a73-64c0-985ed0debe96.png)
昔Starling Frameworkを使ってモバイルアプリを作った

（２年以上前の話だと思って読んでください）

#何を作ったの？
簡単なゲームの15パズルです。説明不要ですね。業務では無く、完全に趣味の世界の話です。友達の絵描きの宣伝を兼ねて作りました。

#どの位の経験で？
多少手をつけてはいましたが、他の言語でIOS/Androidアプリを作ってリリースした経験は無かったです。かといって、Flashをガンガン使っていたか？と言うと、それも微妙で殆ど使ってもいませんでした。おかげで、Flashらしいアニメーションの動きとかが、全くありません。

#どんな開発環境で？
開発環境は、Flash Builder 4.7です。現在は開発も終了し、Adobe Creative Cloudを買っても標準のメニューには出て来ませんが、多分、今でもインストールできるはずです。基本はWindowsで開発しましたが、IOS用のビルドやテストや登録作業はMacでやっていました。

#どうしてそんな状態でStarling Frameworkを？
では、なぜAS3ベースの[Starling Framework](http://gamua.com/starling/)だったのか？と聞かれると、あまり深い理由はないのですが、それほど難しいことも無く、一つのソースでそれなりの速度で動くアプリがIOS/Androidで作れそうだと聞いたから位だと思います。

StarlingにはUI周りを受け持つ[Feathers](https://feathersui.com/)というコンポーネントがあるのですが、そちらは全く使っていません。

##Starling Frameworkって？
Flashに途中で追加されたStage3DというGPUを使って描画を高速化する機能があり、それを利用して、ある程度簡単な記述で高速な 2D 描画を実現しているのがStarling Frameworkです。ちゃんと説明すると違うのかも知れませんが、こちらはそれくらいのぼんやり理解です。

書き忘れていましたが、それらはAdobe AIRという環境上で展開されています。

#どうやって作ったの？
Starlingの事も調べながら、ちまちまと作っていきました。AS3もあんまりだったので、それ程順調ではなかったです。でも、一応、形になったので、これ位ならすごく難しい事は無い筈です。
#開発期間は？
どこから数えるかによりますが、密度は薄めで１年は掛かっていないと思います。

## 作り方
モバイル用のアプリについては、Scaffold_Mobileという文字通りモバイル用の足場というか、たたき台のサンプルがStarling Frameworkに入っているので、それをビルドして、ちょっとずつ加えていけば、割と頑張れるような気がします。

少しずつ変更をつけ加えていくのがコツでは無いかと。そうすれば、大きく道をそれて、二進も三進もいかないという悲劇が避けられます。しくじった時に戻れるようにソースの履歴は残しましょう。バージョン管理は大事です。

## テクスチャとかどうしたの？

[ShoeBox] (http://renderhjs.net/shoebox/)さまさまですよ。一般的にはTexturePackerを使うのかも知れませんが、素材画像を渡すと、まとめてテクスチャにしてくれるので、これで済ませると安上がりです。


で、最終的に出来上がったのがこれです。

![キスネコアイコン150.png](https://qiita-image-store.s3.amazonaws.com/0/153585/35b45940-566b-a1a1-3164-b052e2f69e94.png)


- IOS
[キスねこ１５パズル](https://itunes.apple.com/jp/app/kisuneko15pazuru/id934855382)


- Android
[キスねこ１５パズル](https://play.google.com/store/apps/details?id=air.net.matcomp.kissneko03
)

登録周りの話とかは、他の環境で作っているのと変わらないと思います。
大したことは無いのですが、これくらいは作れますよということで。

# 難しかった事や困った事
## 出来上がったパッケージサイズが大きい
そんなに凝った事はしていないのにパッケージサイズが大きくて困りました。それは仕組み上、ある程度仕方ない面もあるでしょうし、こちらの理解不足で、もっと減らせるのかも知れません。（今ソース見直したら大きな画像とか入っていて愕然としました。もう少し減らせたかも…）

これも大きなリソースは後からダウンロードしてパッケージを削るとか、色々やり方もあるのかも知れません。 

## 日本語での情報が少ない
仕方ないのですが、日本語情報は少ないです。ただ、Starling Framework自体、海外ではそれなりに使われているらしく、[公式フォーラム](http://forum.starling-framework.org/ "Starling Forum") も活発なので、情報が少ないという事もなく、優れた2Dフレームワークだと思われます。

それでも有志の方々が書いてくださっている日本語記事があるので、それを参考にしていました。他に無ければ英語の資料をあさるしかないのですが、英語は苦手なので、てこずりました。でも、ソースは英語も日本語も無いので、割とどうにかなります。

# 結論
割と簡単で楽しいので作ろう！
自分ももう次のヤツに手を付けたいです。
redigoのPoolとredigomockを利用する方法

redigoのredis.Poolはredis.Connとは異なりインタフェースではなく構造体として定義されています.

それとredigomockはredis.Poolを生成する機能を有していないことからぱっと見使うことができないだろうなっと判断しましたが

よくよく考えてみるとredis.Poolで利用する関数群をインタフェースとして定義すれば良いのではないかと気づきがあったので共有します.

以下Example

```go
// service.go

package service

import (...) // 省略

type RedigoPool interface {
	Get() redis.Conn
	Close() error
}

type ExampleService struct {
	pool RedigoPool // *redis.Poolを直接定義せず, RedigoPoolというインタフェースを利用する
}

func (s *ExampleService) HmSetWithExpire(key string, a, b int64, expireSeconds uint) (interface{}, error) {
	redisConn := s.pool.Get()
	defer redisConn.Close()

	redisConn.Send("MULTI")
	redisConn.Send("HMSET", key, "a", a, "b", b)
	redisConn.Send("EXPIRE", key, expireSeconds)

	reply, err := redisConn.Do("EXEC")
	if err != nil {
		return nil, err
	}
	return reply, nil
}

```

```go
// service_test.go

package service

import (...) // 省略

// redigoMockPool redigomock用RedisPool
type redigoMockPool struct {
	conn redis.Conn
}

func (m redigoMockPool) Get() redis.Conn {
	return m.conn
}

func (m redigoMockPool) Close() error {
	return m.conn.Close()
}

func TestExampleService_HmSetWithExpire(t *testing.T) {
	mockConn := redigomock.NewConn()
	mockPool := &redigoMockPool{
		conn: mockConn,
	}

	svc := ExampleService{
		pool: mockPool,
	}

	key := "test-uhyouhyo!"
	a := int64(1)
	b := int64(2)
	expireSeconds := uint(3200)

	cmd1 := mockConn.Command("MULTI")
	cmd2 := mockConn.Command("HMSET", key, "a", a, "b", b)
	cmd3 := mockConn.Command("EXPIRE", key, expireSeconds)
	cmd4 := mockConn.Command("EXEC").Expect([]interface{}{"OK", "OK"})

	_, err := svc.HmSetWithExpire(key, a, b, expireSeconds)
	if err != nil {
		t.Error(err)
	}
	
	if counter := mockConn.Stats(cmd1); counter != 1 {
		t.Errorf("Expected cmd1 to be called once but was called %d times", counter)
	}

	if counter := mockConn.Stats(cmd2); counter != 1 {
		t.Errorf("Expected cmd2 to be called once but was called %d times", counter)
	}

	if counter := mockConn.Stats(cmd3); counter != 1 {
		t.Errorf("Expected cmd3 to be called once but was called %d times", counter)
	}

	if counter := mockConn.Stats(cmd4); counter != 1 {
		t.Errorf("Expected cmd4 to be called once but was called %d times", counter)
	}
}
```

上記のコードの``RedigoPool``が味噌で予めredis.Poolで利用する関数をインタフェースに定義しておけば, 割とさくっとMockを利用可能になります.

ちなみに``redis.Pool#Dial``で``redigomock.Conn``を取得できるようにすればいいのでは? っとおもう方もいると思いますが,

``redis.Conn``を取得する``redis.Pool#Get``は複雑なことをやってるのでうまいこと``redigomock.Conn``を取得することができません.

###### Ref

- [redigo](https://godoc.org/github.com/garyburd/redigo/redis)
- [redigomock](https://godoc.org/github.com/rafaeljusto/redigomock)
- [元記事](https://blog.pyyoshi.com/2016/12/08/redigonopooltoredigomockwoli-yong-suruji-nozhu-yi-dian/)
MacでVagrantを使いCentOS7の仮想環境を作る

## 環境
macOS Sierra 10.12

## 前提
VagrantとVirtualBoxはインストール済みであること

## ディレクトリを作成し移動

```bash
$ mkdir centos7
$ cd centos7
```

## CentOS7のboxを追加
boxを探す場合はこちらから (http://www.vagrantbox.es/) 

```bash
$ vagrant box add centos7 https://github.com/CommanderK5/packer-centos-template/releases/download/0.7.1/vagrant-centos-7.1.box
$ vagrant init
```

## Vagrantfileのbox名を変更
デフォルトのbaseは重複している場合エラーになるので変更するように

```ruby:Vagrantfile
# baseから指定したbox名に
config.vm.box = "centos7"
```

## 仮想サーバーを起動・接続
```bash
$ vagrant up
$ vagrant ssh
```
CentOS 7 の Apache 2.4 で SSI を有効にする

## CentOS 7 の Apache 2.4 で SSI を有効にする
Apache モジュール [mod_include](https://httpd.apache.org/docs/current/ja/mod/mod_include.html) で SSI (Server Side Includes) を有効にする方法です。

```bash
yum install httpd
firewall-cmd --permanent --add-service=http && firewall-cmd --reload
```
```apache
cat << "_EOF_" > /etc/httpd/conf.d/ssi.conf
<Directory "/var/www/html">
    Options +Includes
    AddOutputFilter INCLUDES .html
    SSILegacyExprParser on
</Directory>
_EOF_
```
```bash
systemctl start httpd && systemctl enable httpd
```

### SSILegacyExprParser
Apache 2.2 以前の古い構文を利用する場合に `on` を設定します。
GitHubでのコードレビューが爆速になる新機能review requestsの使い方

本日(2016/12/08)のアップデートにより、GitHubでコードレビューの為の機能が実装されました。本エントリーでは、レビュー機能の機能と使い方について紹介します。

# レビューを依頼する側
① プルリクエストを作成します。

② 画面右側「Reviewers」という箇所をクリックします。

![プルリクエスト](https://qiita-image-store.s3.amazonaws.com/0/67884/c49c1c3f-cdc6-9539-01ba-4e23341d1c3d.png)

③ コードレビューして欲しい人を選択します。

![](https://qiita-image-store.s3.amazonaws.com/0/67884/07d6cb12-ede6-c57b-24b2-ecf2500beac2.png)

以上でレビューの依頼ができました。

# レビュー依頼を受けた側
① メールやGitHub上から、レビュー依頼を受けた旨の通知が来ますので、「Add your review」をクリックします。

![](https://qiita-image-store.s3.amazonaws.com/0/67884/5e38907a-87be-5543-6747-d232472b6cef.png)


② レビューします。

![](https://qiita-image-store.s3.amazonaws.com/0/67884/765fb7c6-2511-6c67-9943-216eed45e80b.png)

③ レビューが反映されます。

![](https://qiita-image-store.s3.amazonaws.com/0/67884/e4375927-1c52-d376-32d1-64856efda7fd.png)

## レビューの種類について
下記のレビュー画面では、3つの種類のレビューができます。

![screenshot_2016_12_8.png](https://qiita-image-store.s3.amazonaws.com/0/67884/765fb7c6-2511-6c67-9943-216eed45e80b.png)
レビューの種類は次の3つより選択できます。

###Comment
コメントを残します。

![](https://qiita-image-store.s3.amazonaws.com/0/67884/8f43975b-54e9-0889-4e91-7de70d72f5c0.png)


###Approve
プルリクエストの承認をしつつ、コメントを残します。

![](https://qiita-image-store.s3.amazonaws.com/0/67884/f9164c43-9eaa-78e3-964e-11249937c71b.png)

###Request changes
コードの修正を提案しつつ、コメントを残します。

![](https://qiita-image-store.s3.amazonaws.com/0/67884/38fd7afe-0c41-9028-a8ff-e799d18572df.png)


#### コメントをせずに承認だけすることも可能
特にコメントすべき内容がない場合には、コメントを空欄にして[Approve]だけを設定することができます。素早いレビューに役立ちます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/67884/479ba308-8442-0adb-7c5e-d486233f47b6.png)

# 相互コードレビューに嬉しいアップデート
複数人開発では、相互コードレビューが必須。これまでは、レビューの依頼をメッセージで送ったり、誰がレビューしたかをチェックボックスで管理したりと面倒だったので、今回のアップデートはありがたいと感じました。

参考URL「[Introducing review requests](https://github.com/blog/2291-introducing-review-requests)」
Firebase SDKのReleaseNotesはこまめにチェックしよう！

## はじめに

どうも、はたです。
空きがあるのはなにか寂しいので、臨時で埋めます。

今回は掲題の通り、SDKの話ですが、
Firebase JavaScript SDKですので、ご了承ください。

## Release Notes見てますか？

https://firebase.google.com/support/release-notes/js

ここですねはい。
結構頻繁に更新されています。
FIXED、CHANGED、DEPRECTEDなどあって、重量なバグフィックスとかもされたりしてます。
Firebaseを使い始めた当初、SDKの更新はあまり気にしていなかったのですが、
あることがきっかけでSDKの更新をチェックするようになりました。

## Firebase SDK(js) 3.0.0で起きた問題

SDKのバージョン3.0.0を使っている時、下記の問題に遭遇しました。

### transactionの次にupdateを書いた場合

```
db.child('/test/user1/count').transaction(function (currentValue) {
    return currentValue ? currentValue - 1 : 0;
}).catch(function (error) {
    console.log(error)
});

var updates = {}
updates['/test2/user1'] = null;
updates['/test2/user2'] = null;
db.update(updates).catch(function (error) {
    console.log(error)
});
```

この流れで処理すると・・・

```
Error: set
    at Error (native)
    at ji (https://www.gstatic.com/firebasejs/3.3.0/firebase.js:466:437)
    at $h (https://www.gstatic.com/firebasejs/3.3.0/firebase.js:464:351)
    at https://www.gstatic.com/firebasejs/3.3.0/firebase.js:464:286
    at https://www.gstatic.com/firebasejs/3.3.0/firebase.js:431:167
    at nh.h.wd (https://www.gstatic.com/firebasejs/3.3.0/firebase.js:432:104)
    at af.wd (https://www.gstatic.com/firebasejs/3.3.0/firebase.js:335:364)
    at vd.hg (https://www.gstatic.com/firebasejs/3.3.0/firebase.js:333:280)
    at yd (https://www.gstatic.com/firebasejs/3.3.0/firebase.js:286:464)
    at WebSocket.La.onmessage (https://www.gstatic.com/firebasejs/3.3.0/firebase.js:285:245)
```

エラーになるんです。

### updateの次にtransactionを書いた場合

```
var updates = {}
updates['/test2/user1'] = null;
updates['/test2/user2'] = null;
db.update(updates).catch(function (error) {
    console.log(error)
});

db.child('/test/user1/count').transaction(function (currentValue) {
    return currentValue ? currentValue - 1 : 0;
}).catch(function (error) {
    console.log(error)
});
```

これはエラーになりません。
dbのパスが完全に違えばtransaction上の他更新パスへの影響はないと勝手に認識していたので軽い衝撃でした。

それっぽい困っている人もいた
http://stackoverflow.com/questions/30147645/firebase-transaction-error-set

## SDKのバグだった

原因はわからず、ふとFirebase SDK(js)のRelease Notesを見てみると
気になる記述がありました。

> Version 3.4.1 - September 27, 2016
>
>Release Notes
>
>Realtime Database
>FIXED Use of the update() method now only cancels transactions that are directly included in the updated paths (not transactions in adjacent paths). For example, an update at /move for a child node walk will cancel transactions at /, /move, and /move/walk and in any child nodes under /move/walk. But, it will no longer cancel transactions at sibling nodes, such as /move/run.

なるほど、それっぽい。
ということで3.0.0から3.4.1にSDKを更新したところ、エラーの現象は直ったのです！

## おわりに

Release Notesは頻繁にチェックしよう！ってことでした。
当たり前ですけどね・・・w
JavaScriptにしかり、iOS、Androidにしかり、利用しているSDKのバージョンアップをきちんとチェックしないといけないと改めて感じた出来事でした。