OmniAICreator/Qiita-1.07M huggingface dataset:
carrierwaveの使い方


## 1. CarrierWaveのインストール

```gemfile
gem "carrierwave"
```

```bash:ターミナル
$ bundle install
```

## 2. アップローダーの生成

```bash:ターミナル
$ rails g uploader Image
create  app/uploaders/image_uploader.rb
```

image_uploader.rbでは、ファイルの保存方法（デフォルトはファイル）、保存パス、ファイルのサイズ、拡張子やファイル名の変換などが変更できる

##(ActiveRecordを使って、アップロードしたファイルの情報を保存する方法)
###例：productモデルにファイル情報を持つ場合
###public/uploads/products配下に保存

Modelにimageフィールド(アップローダーで付けた名前と同じにしなければならない)を追加

```bash:ターミナル
$ rails g migration add_image_to_product image:string
$ rake db:migrate
```

モデルファイルを開き、アップローダーへのマウントする記述を追加

```ruby:app/models/product.rb
class Product < ActiveRecord::Base
  mount_uploader :image, ImageUploader
end
```

新規/編集フォームに画像アップロードの入力フィールドを追加

hidden属性でimage_cacheは、画像を指定したけれども、バリデーションエラーなどにより保存が失敗した場合の画面再表示時などに、画像情報をキャッシュしておくための領域

```:app/views/products/_form.html.erb
<%= form_for(@product) do |f| %>
  <% if @product.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@product.errors.count, "error") %> prohibited this product from being saved:</h2>

      <ul>
      <% @product.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :name %><br>
    <%= f.text_field :name %>
  </div>
  <div class="field">
    <%= f.label :price %><br>
    <%= f.number_field :price %>
  </div>
  <!-- 追加箇所 開始 -->
  <div class="field">
    <% if @product.image? %>
      <div class="thumbnail">
        <%= image_tag @product.image.url %>
      </div>
    <% end %><br>
    <%= f.label :image %><br>
    <%= f.file_field :image %>
    <%= f.hidden_field :image_cache %>
  </div>
  <div class="field">
    <!-- 既存レコード(DBに保存されている)かつ、画像が存在する場合 -->
    <% if @product.persisted? && @product.image? %>
      <label>
        <%= f.check_box :remove_image %>
        画像を削除
      </label>
    <% end %>
  </div>
  <!-- 追加箇所 終了 -->
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>
```

ファイルの属性を更新できるようにするために、StrongParametersに:image, :image_cache, :remove_imageを追加

```ruby:app/controllers/products_controller.rb
def product_params
params.require(:product).permit(:name, :price, :image, :image_cache, :remove_image)
end
```

詳細画面で表示できるようにする

```app/views/products/show.html.erb
<p id="notice"><%= notice %></p>

<p>
  <strong>Name:</strong>
  <%= @product.name %>
</p>

<p>
  <strong>Price:</strong>
  <%= @product.price %>
</p>

<!-- 追加箇所 開始 -->
<p>
  <strong>Image:</strong>
  <% if @product.image? %>
    <div class="thumbnail">
      <%= image_tag @product.image.url %>
    </div>
  <% end %>
</p>
<!-- 追加箇所 終了 -->

<%= link_to 'Edit', edit_product_path(@product) %> |
<%= link_to 'Back', products_path %>
```

##参照
http://ruby-rails.hatenadiary.com/entry/20141015/1413300088

カスタマイズ
http://ruby-rails.hatenadiary.com/entry/20141022/1413907332
Vagrantで仮想環境側のポートをあける


## 1.ホストマシーンの3000番ポートをゲストOSの3000番ポートへフォワードする

Vagrantfileに以下の設定を追記

```vi:Vagrantfile
# config.vm.network :forwarded_port, guest: 80, host: 8081
config.vm.network :forwarded_port, guest: 3000, host: 3000
 
# Create a private network, which allows host-only access to the machine
```

## 2.ゲストOSのポート解放設定

vagrant sshコマンドで仮想環境に入り、以下のコマンドからiptablesを編集

```bash:ターミナル
$ sudo vi /etc/sysconfig/iptables
```

-A INPUT -p tcp -m tcp --dport 3000 -j ACCEPT追記

```/etc/sysconfig/iptables
*filter
:INPUT ACCEPT [0:0]
:FORWARD ACCEPT [0:0]
:OUTPUT ACCEPT [0:0]
-A INPUT -m state --state ESTABLISHED,RELATED -j ACCEPT
-A INPUT -p icmp -j ACCEPT
-A INPUT -i lo -j ACCEPT
-A INPUT -m state --state NEW -m tcp -p tcp --dport 22 -j ACCEPT
-A INPUT -p tcp -m tcp --dport 3000 -j ACCEPT
-A INPUT -j REJECT --reject-with icmp-host-prohibited
-A FORWARD -j REJECT --reject-with icmp-host-prohibited
COMMIT
```

##3.vagrantの再起動

```bash:ターミナル
$ vagrant halt
$ vagrant up
```

##参考
http://fuzz-jpn.com/blog/vagrant_rails_server_browser/

http://qiita.com/kkam0907/items/4a345cd5e834969d3859
context


jQueryオブジェクトが持つDOMノード上でのオブジェクトを保持します。

この値はselectorと一緒に使われることになると思います。
これらのプロパティは、主にプラグイン開発時に役立つでしょう。

```jquery
$("ul")
  .append("<li>" + $("ul").context + "</li>")
  .append("<li>" + $("ul", document.body).context.nodeName + "</li>");
```

```結果
Context:
・[object HTMLDocument]
・BODY
```
sublimetextからvagrant上のファイルを操作


##1. Sublime SFTP パッケージをインストール

##2. 空のフォルダを作成

##3. sublimetextを開きサイドバーにフォルダをドラッグ

##4. 右クリックしMaptoRemoteをクリックする

##5. sftp-config.jsonのファイルができるので以下の設定をコピーする

SSHの為のhostname,user,portを調べる

```bash:ターミナル
vagrant ssh-config
```

以下の部分を変更する
"host": "127.0.0.1",
"user": "vagrant",
"password": "vagrant",
"port": "2222"


```json:sftp-config.json
{
    // The tab key will cycle through the settings when first created
    // Visit http://wbond.net/sublime_packages/sftp/settings for help
    
    // sftp, ftp or ftps
    "type": "sftp",

    "save_before_upload": true,
    "upload_on_save": true,
    "sync_down_on_open": false,
    "sync_skip_deletes": false,
    "sync_same_age": true,
    "confirm_downloads": false,
    "confirm_sync": true,
    "confirm_overwrite_newer": false,
    
    "host": "127.0.0.1",
    "user": "vagrant",
    "password": "vagrant",
    "port": "2222",
    
    "remote_path": "/home/vagrant/myblog/",
    "ignore_regexes": [
        "\\.sublime-(project|workspace)", "sftp-config(-alt\\d?)?\\.json",
        "sftp-settings\\.json", "/venv/", "\\.svn/", "\\.hg/", "\\.git/",
        "\\.bzr", "_darcs", "CVS", "\\.DS_Store", "Thumbs\\.db", "desktop\\.ini"
    ],
    //"file_permissions": "664",
    //"dir_permissions": "775",
    
    //"extra_list_connections": 0,

    "connect_timeout": 30,
    //"keepalive": 120,
    //"ftp_passive_mode": true,
    //"ftp_obey_passive_host": false,
    //"ssh_key_file": "~/.ssh/id_rsa",
    //"sftp_flags": ["-F", "/path/to/ssh_config"],
    
    //"preserve_modification_times": false,
    //"remote_time_offset_in_hours": 0,
    //"remote_encoding": "utf-8",
    //"remote_locale": "C",
    //"allow_config_upload": false,
}
```

##エラー　SSH host key has changedが出た場合

自身のユーザフォルダ内の.ssh/known_hostsを編集し、接続しようとしていたホスト名の行を削除する
例)[127.0.0.1]の部分だけ

```vi:.ssh/known_hosts
[127.0.0.1]:2222 ssh-rsa AAAAB3NzaC1yc2EAAAABIwAAAQEAv+VDpocINo7EnBb6PWeSCVvzxi3kNxo8uLpM04ZZUEKXYv8OkbRc+MLiBKuOHscXSdiwP016gMVCyVQmyrggUEQ1KvDSZFHDLcSSheuEiCTyxGdc0nFSG2E6AS+fth3zjL1mIj+G0U7FNHv4EVScNCFSpBQUsJwPpX9GRHtvpEZmtPgysnz5WCCv/7lCnKQubQRVffE2V24Kg2x4anUF23xaOJU75ZAi3uIZBrOOdQJKUqTLpUIcqE6BU3U0kqx+9hkPQYj/FhWyqn2GB9N+h8u6uvbEcsVtNPxWJEdE2/4rDjQBMHy6kXC6n2MG/q4gMVyLVy7IuP4vBccEOracew==
```
ログイン機能実装


## 1. Gemfileにdeviseを追加

```Gemfile
gem 'devise'
```

```bash:ターミナル
$ bundle install
```

##2. deviseに関連したファイルをRailsプロジェクトに追加

```bash:ターミナル
rails g devise:install
```

##3. deviceメール送信の為のホスト名を指定

```ruby:config/environments/development.rb
Rails.application.configure do
  ...
  # deviseの設定
  config.action_mailer.default_url_options = { host: 'localhost:3000' }
end
```

注)productionモードのときは、host:に実際のサーバーの値を設定

##4. root_urlを指定

```ruby:config/routes.rb
root to: "ログイン後リダイレクトしたいパス"
```

(devise画面をrootに指定したい場合)

```ruby:config/routes.rb
devise_scope :user do
  root :to => "devise/sessions#new" #ログイン画面
end
```

##5. アクセス制限をする(ログインしていないと入れないページの設定)

```ruby:コントローラー
before_action :authenticate_user!, only: :show
```

##6. エラーメッセージ表示領域を作成

```html:app/views/layouts/application.html.erb
<p class="notice"><%= notice %></p>
<p class="alert"><%= alert %></p>
```

##7. deviseのUserモデルの作成

```bash:ターミナル
rails g devise User
rake db:migrate
```

##参考

http://ruby-rails.hatenadiary.com/entry/20140801/1406907000

http://ruby-rails.hatenadiary.com/entry/20140804/1407168000
deviseのカスタマイズ


##ログインしているか調べる

```
<% if user_signed_in? %> 
<% end %>
```

##現在ログインしているUserオブジェクトはcurrent_user

```
<% current_user.email %> 
```

##アクセス制限をする(ログインしていないと入れないページの設定)

```ruby:コントローラー
before_action :authenticate_user!, only: :show
```

##ログイン・ログアウト時のリダイレクト先の変更

admin_root_pathを自分の希望するパスに変更

```ruby:app/controllers/application_controller.rb
  def after_sign_in_path_for(resource)
    admin_root_path
  end

  def after_sign_out_path_for(resource)
    admin_root_path
  end
```
Githubの使い方


##1. Githubでリモートリポジトリを作成

##2. リモートを追加

```bash:ターミナル
$ git remote add origin git@github.com:ユーザー名/プロジェクト名.git
```

##3. プロジェクトをpushする

```bash:ターミナル
$ git pull origin master
$ git push origin master
```

###リモートリポジトリ確認

```bash:ターミナル
$ git config -l
```
c++ builder XE4, 10.2 Tokyo > TeeChart > Series1に10個ずつデータを追加する

```txt:動作環境
C++ builder XE4
    TeeChart Lite v2013.08.130414
RAD Studio 10.2 Tokyo Update 2 (追記 2018/01/10)
    TeeChart v2016.17.160129 32bit VCL
```


http://qiita.com/7of9/items/607f9d0a1fa19d731abe
の続き。

ボタンを押すたびに10個のプロットを追加する実装。


```Unit1.cpp
void __fastcall TForm1::B_addClick(TObject *Sender)
{
	TDateTime lastDt = Series1->XValues->Last();

	TDateTime workDt = IncSecond(lastDt, 1);
	double dval;
	for (int idx=0; idx < 10; idx++) {
		dval = (double)random(60);
		Series1->AddXY(workDt, dval, L"", clRed);
		workDt = IncSecond(workDt, 1);
	}
}
```
c++ builder XE4, 10.2 Tokyo > TeeChart > seriesの最後のX値を取得する > Series1->XValues->Last();

```txt:動作環境
C++ builder XE4
    TeeChart Lite v2013.08.130414
RAD Studio 10.2 Tokyo Update 2 (追記 2018/01/10)
    TeeChart v2016.17.160129 32bit VCL
```

Series1の最後のX値を取得したい

Series1->XValues->Last();
というのIDEの入力補完リストで見つけた。

```Unit1.cpp
//---------------------------------------------------------------------------

#include <vcl.h>
#pragma hdrstop

#include <DateUtils.hpp>
#include "Unit1.h"
//---------------------------------------------------------------------------
#pragma package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
//---------------------------------------------------------------------------
__fastcall TForm1::TForm1(TComponent* Owner)
	: TForm(Owner)
{

	Chart1->Series[0]->XValues->DateTime = true;
	Chart1->BottomAxis->DateTimeFormat = L"nn:ss";

	TDateTime dt;

	dt = Now();
	double dval;
	for (int idx=0; idx < 100; idx++) {
		dval = (double)random(60);
		Series1->AddXY(dt, dval, L"", clRed);
		dt = IncSecond(dt, 1);
	}

}
//---------------------------------------------------------------------------
void __fastcall TForm1::B_addClick(TObject *Sender)
{
	TDateTime lastDt = Series1->XValues->Last();
}
//---------------------------------------------------------------------------

```
レガシーなプロダクトでfunctionalテストを実現する


## 背景
フレームワークとか使っていない、いわゆるレガシーなプロダクトに対して、functionalテストをやりたかった。が、探してみたところ、見つからなかったので、作ってみた。という話

## FunctionalTester
github, packagistに公開中
[github](https://github.com/kazu9su/functional-tester)
[packagist](https://packagist.org/packages/kazu9su/functional-tester)

## コンセプト？
apacheなどのミドルウェアを介さず、httpコンテキストで実行しているように見せかけています。
仕組みとしては、テスト対象のコードを
* 別プロセスで実行
* 実行前にセッション、インクルードパスなど必要なものを準備
* `php-cgi`で実行　
などなどしています。

## レガシーなコードの例
このライブラリは、素(プレーン)なPHPで書かれているようなコードを対象にfunctionalテストすることを目的としています。
具体的には、下記のようなコードです。

```php
<?php

header("Content-Type: text/html");
header('Location: http://www.example.com/');

session_start('admin');

...

echo ('OK');

exit;
```

## 使い方
簡単な使い方は下記。`phpunit`を使用したテストで使うことを想定しています。 

```php
use FunctionalTester/FunctionalTester;

class IndexTest extends PHPUnit_Framework_TestCase
{
    public function testIndex
    {
        $tester = new FunctionalTester();

        //テスト対象のファイルが使用するセッションをセットする
        $tester->setSession(['id' => 'hogehoge']);

        //ドキュメントルートをセットする。コンストラクタの第一引数に指定することもできる
        $tester->setDocumentRoot('/path/to/src');

        //インクルードパスをセットする。コンストラクタの第二引数に指定することもできる。
        $tester->setIncludePath('.:/path/to/src');

        //インクルードパスを追加する。
        $tester->addIncludePath(':/path/to/src');
        
        //テスト対象のファイルに対して、リクエストを行う
        $response = $tester->get('index.php', ['username' => 'hogehoge']);

        //レスポンスは、Guzzle\Http\Message\Responseのオブジェクトとしてパースされている
        //ので、以下のようにテストを実行できる
        $this->assertEquals(200, $response->getStatusCode());
        $this->assertEquals('OK', $response->getBody());
    }
}
```

## インストール  
 コンポーザーでインストールできます。ぜひ使ってみてください。

```
$ composer require kazu9su/functional-tester
```

## これから
現在、 getリクエストとpostリクエストのみ対応しています。その他のリクエスト方法にも対応していきたいと思います。
ブランチ名にissue番号を使う


仕事ではタスク管理にGithub issueを使っていて、最近はブランチを作る際に`feature/1234`といったように名前にissue番号を使うようにしています。最初はどのissueに関連したブランチなのか分かりやすくしたくて始めたんですが、CLIツール・alias設定を組み合わせて以下のフローも楽に行えるようになりました。

## テンプレートを使ってissueリンク付きプルリクエストを作る
プルリクエストを作成する際は必ず対応するissueへのリンクを貼るという運用を行っているんですが、ブランチ名にissue番号を入れておくことでこれがコマンド一発で完結できるようになりました。やり方は下記の記事を参考にさせてもらいました。
[GitHub Issueはテンプレート化で、綺麗に書かせる！ - Qiita](http://qiita.com/yoshimikeisui/items/3e1873e3bf1bbafe8733#%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%E3%83%A9%E3%82%A4%E3%83%B3%E3%81%8B%E3%82%89%E3%83%95%E3%82%A9%E3%83%BC%E3%83%9E%E3%83%83%E3%83%88%E3%82%92%E4%BD%BF%E7%94%A8%E3%81%97%E3%81%9Fpull-request%E3%82%92%E4%BD%9C%E6%88%90%E3%81%99%E3%82%8B)

```:.gitconfig
[alias]
	pull-request = "!hub browse -- compare/develop...$(git symbolic-ref --short HEAD)?body=%0A%23$(echo $(git symbolic-ref --short\
 HEAD) |awk -F'[/_-]' '{print $2}')%0A%0A%23%20Before%0A%0A%23%20After%20%0A%0A"
```

エンコードされててよく分からない感じですが、`git pull-request`とすると以下のようなプルリク作成ページが開かれて、issueへのリンクも貼られた状態になります。

![Kobito.w2bqFw.png](https://qiita-image-store.s3.amazonaws.com/0/7325/ccfc3f7e-aa0d-47ca-52a7-4d8b79413766.png "Kobito.w2bqFw.png")

これまでは対応するissueの番号を探してプルリクの本文に貼り付ける、という事をやっていて地味に面倒だった・・

## カレントブランチに関連するissueの内容をさっと確認する
[stephencelis/ghi](https://github.com/stephencelis/ghi)を使って関連するissueの内容を確認できるようにしています。issue番号をブランチ名に入れておく事を前提に、下記のようなaliasを設定して`git issue`と叩くだけでブランチに対応したissueの内容が見れるようにしています。

```:.gitconfig
[alias]
	issue = "!ghi show $(echo $(git symbolic-ref --short HEAD) |awk -F "/" '{print $2}')"
```


![Kobito.DoTTxZ.png](https://qiita-image-store.s3.amazonaws.com/0/7325/1fd96f7c-b8a9-f451-37f7-207c81f21a16.png "Kobito.DoTTxZ.png")

----

すごく些細な事ですが、お陰でブラウザでGithubを開いてissueを確認する頻度が減りました。タスク管理にissueを使っている人は試してみるのもアリかもしれません。
Jcode.pmで「秋葉原UDX」をutf-8から自動判別でutf-8に出力すると文字化けする

# はじめに

長いこと使ってる自作のスクリプトで、これまで問題を起こさなかったのに、急に文字化けしたので調べたら、Jcode.pmのconvertに、utf-8の文字列を自動判別でutf-8で出力しようとしたのが原因だったので覚書。

# 再現コード

以下が再現コード。手元のMac(Perl v5.16.3)とCentOS (Perl v5.8.8)で再現。スクリプトはutf-8で保存しておく。

```pl:test.pl
#!/usr/bin/perl
use Jcode;

$val1 = Jcode->new("秋葉原UDX")->utf8;
print "$val1\n";

$val2 = Jcode->new("秋葉原UDX","utf8")->utf8;
print "$val2\n";

$val3 = Jcode->new("秋葉原")->utf8;
print "$val3\n";
```

出力結果。

```shell-session:
$ perl test.pl
遘玖痩蜴欟DX
秋葉原UDX
秋葉原
```

とりあえず「秋葉原」は大丈夫だが、「秋葉原a」とか、「原」に半角英語をつなげると文字化けする。これはJCodeが入力文字列の自動判別に失敗しているためで、JCodeのconvertに入力文字列がUTF-8であることを教えてやれば大丈夫だし、スクリプトの最初に`use utf8;`と宣言すればもちろん大丈夫。

# どうでもいい覚書

今回の文字化けの原因はUTF-8の文字列をUTF-8にconvertするという無意味なコードのせい。これまで入力をUTF-8、出力をShift-JISにしてたのを、途中で出力もUTF-8に変更した際、変更の必要が無いにもかかわらず、Jcodeによるconvertが残っていたために発覚したもの。
AWSでNFS

#NFSで共有フォルダ設定

##環境
NFSサーバ
NFSクライアント
共に。
CentOS Linux 6 x86_64 HVM EBS 20150928_0-74e73035-3435-48d6-88e0-89cc02ad83ee-ami-2b35794e.2 (ami-82640282)

SecurityGroupは適宜設定


#NFSサーバ側設定　※rootで実行

```bash:install
yum install portmap nfs-utils nfs-utils-lib
```

```bash:/etc/sysconfig/nfs

# Port rquotad should listen on.
RQUOTAD_PORT=875
...

# TCP port rpc.lockd should listen on.
LOCKD_TCPPORT=32803
# UDP port rpc.lockd should listen on.
LOCKD_UDPPORT=32769

# Port rpc.mountd should listen on.
MOUNTD_PORT=892
...

# Port rpc.statd should listen on.
STATD_PORT=662
```


```bash:/etc/nfsmount.conf
# Server Port
Port=2049
```

```bash:共有ディレクトリを作成
mkdir /opt/share
chmod 0777 /opt/share

```

```bash:/etc/exports
/opt/share *(rw,sync,no_root_squash)
```

```bash:サービス開始
chkconfig iptables off #必要に応じてiptablesの設定変更で対応する
chkconfig rpcbind on
chkconfig nfs on
chkconfig nfslock on

service iptables stop #必要に応じてiptablesの設定変更で対応する
service rpcbind start
service nfs start
service nfslock start
```


#NFSクライアント側設定　※rootで実行

```bash:install
yum -y install nfs-utils
```


```
mkdir /mnt/share
chmod 777 /mnt/share
```

```bash:/etc/fstab
<NFSサーバーのPrivateDNS>:/opt/share   /mnt/share   nfs  defaults 0 0　#追記
```

```bash:サービス開始/mount
chkconfig iptables off #必要に応じてiptablesの設定変更で対応する
chkconfig rpcbind on
chkconfig nfslock on

service iptables stop #必要に応じてiptablesの設定変更で対応する
service rpcbind start
service nfslock start 

mount /mnt/share
```

########
RealmのResultsは常に最新の状態を保っている

RealmのResultsはNSFastEnumerationを実装しているため、ついついArrayのように使いがちですが、Realmの基本Object同様データの更新が逐一反映される点には注意が必要です。

例えば以下の例が分かりやすいです。

```swift 
        let realm = try! Realm()
        
        let hellos = realm.objects(Sample).filter("title = 'hello'")

        print(hellos.count)
        
        try! realm.write { () -> Void in
            let sample = Sample()
            sample.title = "hello"
            realm.add(sample)
        }
        
        print(hellos.count)
```

２つのprint文がありますが、この２つは違う値を表示します。
hellosインスタンスは同じでも、realm.addが完了した時点でhellosの要素数が１増える為です。

分かりにくい例としては、このrealm.addが別の場所で行われていたり、複雑なクエリを書いてその結果を持っている時です。
特に複雑なクエリを書いていると、結果が出てきてその結果が静的であると思い込みですが、そのクエリに適合する内容に逐一更新されるため注意が必要です。

逆にResultsからArrayにする場合は

```swift
array = hellos.map({$0})
```

という書き方が便利です。
outlook 2013 > セーフモードになる >対処の続報 > Windows Updateで再度症状が出る場合 > アンインストール / Windows Update:更新の確認 / KB3114409のチェックをはずす / KB3114409を非表示にする

```txt:動作環境
Outlook 2013 on Windows 7 pro
```

http://qiita.com/7of9/items/4da1bda9429207747dca
の続報。

Outlookのセーフモードが解除できたが、Windows Updateがかかって、KB3114409が再度適用されてしまう状況が起きている。

以下の対処をしてみた

- KB3114409をアンインストール
- Windows Updateで更新の確認を実行する
  - KB3114409がリストに表示される
  - KB3114409のチェックをはずす
  - KB3114409を右クリックして「非表示」に設定する

これでWindows Updateが再度かかっても更新が適用されないと思うが、数日様子見をする

別途、Officeを再インストールをすると直ったという報告もあるが、再インストールにかかる時間と上記(10分程度)、どちらが早いかは明確


WSUSでKB3114409を削除設定したのが有効にならないのが問題を大きくしている。

<hr>
（追記 2015/12/29)
上記対応した複数のPCで問題が再現しなくなっているようだ。
ここがつらいよGit入門

最近の案件だとソースコード管理はGitが常識になりつつありますね。
CVSとかSVNとかの時代からソースコード管理を経験して来た身としては、Gitはいまいち
融通の利かなさとか、コマンドの多さにげんなりしています。

そんなGitに対する愚痴を書いてみようかなっと。

# コマンドが多すぎ

通常であれば、
1. git pull する：ソースコードをリモートのリポジトリから取得する
2. git add する：変更したソースコードを追加する
3. git commit する：追加したソースコードをローカルのリポジトリにコミットする
4. git push する：ローカルのリポジトリをリモートのリポジトリに登録する

こんな感じでgitの処理が完了しますが、
これがもし、他の誰かと競合してしまったり、他の誰かがブランチを新規に切っていたりしたら、
もうそれだけでてんやわんやですよ！

# コマンドなので、地味ｗ

まあCUIなので仕方ないのですが、かと言ってイケてるGUIも無いのが現状。
コマンド一つで、今まで書いてあったソースコードが消えてしまう（ブランチが異なって見えなくなっただけ）でも、すごく焦ります。

gitでブランチが動いただけで、未コミット＆未pushのファイルが見えなくなってしまうのは、
精神衛生上良くないです。
見えなくなるより、別ネームでリネームとか、属性変更で色が変わるだけにせめてして欲しい。。。


# rebaseやresetがいまいち成功しない

リポジトリのブランチを取消たいときや、元に戻したいときに、マニュアル通りにrebaseとかreset
なんか使うんですけど、うまく成功したことがありません。

ブランチを移動するときも同じで、何か確実に簡単にできる方法とかありませんかね。。。

# 共同作業していると、心臓に悪い

自分がpushしたブランチだと、他のメンバーがコミットしたソースが消えていたり、
自分が書いたソースが、他のメンバーのブランチだと消えていたり。

せめて、差分を表示させて欲しいかも。

ブランチごとに完全に別世界なので、自分のソースが無い世界線とか、他人のソースが無い世界線とか
普通にあってびっくりするし、そうなったときに、２つの世界線を融合させる修正を行わないといけないので、コードを書くより数倍の労力と時間がかかったりしています。


まあ、他にも、GitFlowやGithubのIssueの話とかもあるのですが、書きすぎるとGit信者の方々に
袋叩きにされそうなので、この辺でｗ

そんなことを言っているうちは、Gitをまだまだ使いこなせていない証拠なんですけどね。。。。
WindowsでGPGPU (CUDA) するときに余計なGPUメモリの消費を削減するためのTips

## GPU使用量のモニタリング
* [GPU-Z (by TechPowerUp)](https://www.techpowerup.com/gpuz/)
	* メモリ使用量やGPU load，温度などをリアルタイムに監視できる．
* [ProcessExplorer (by MS)](https://technet.microsoft.com/ja-jp/sysinternals/processexplorer.aspx)
	* どのプロセスがどれだけGPUメモリを使用しているかを知ることができる．
	* デフォルト設定では非表示になっている．表示するためには，「プロセス一覧表示欄のヘッダ部を右クリック」 → 「Select columns...」 → 「Process GPUタブ」を開き，全部にチェックをいれる．
* nvidia-smiコマンド
    * ドライバと共に標準でインストールされる．デバイス情報を表示してくれるが，まともに動いていないように見える．．．

## 一般アプリによるGPU資源の浪費を削減する
通常，知らず知らずのうちに100MB以上のGPUメモリが様々なアプリによって浪費されている．例えばメモリが2GBしかないGPUであれば，この場合5%以上が無駄になっていることになり，無視することはできない．
具体的な無駄削減手順としては，ProcessExplorerを使ってアプリを特定し，個別にGPUの使用を無効化することだ．以下に，そのようなアプリの例とGPU無効化方法を挙げる．

* Firefox
    * 「オプション」→「詳細」→「ブラウズ」→「ハードウェアアクセラレーション機能を使用する」のチェックを外す．
* Google Chrome
    * 起動オプションとして `--disable-gpu` を付加する．
* Atomエディタ，デスクトップ用Slack，Visual Studio Code（などのElectron系アプリ）
    * Chromeと同様に `--disable-gpu` を付加すれば無効化できる場合がある．
    * AtomをGPU無効で起動するには，`C:\Users\username\AppData\Local\atom\bin\atom.cmd --disable-gpu` を呼ぶ．ただしこの起動方法では自動更新が無効になる．
    * Slackのデスクトップ版は，スタートアップの起動ショートカットが `C:\Users\username\AppData\Local\slack\Update.exe --processStart slack.exe -a"--startup"` となっているので， `C:\Users\username\AppData\Local\slack\Update.exe --processStart slack.exe -a"--startup --disable-gpu"` にすると，GPU無効化モードで起動される．
* Microsoft Outlook
    * 「オプション」→「メール」→「メッセージの作成」→「編集オプション」→「詳細設定」→「表示」→「ハードウェア グラフィック アクセラレータを無効にする」のチェックをつける．
[ sed ] 連続置換とor条件の書き方メモ

###1. 連続置換は`-e` でつなぐ
いろいろやり方はあるが、とりあえずこれだけ覚えておけばよさそう。


```bash:cookbook名だけ取り出したいとき
#"recipe["をトル
#"]"をトル
 echo "recipe[sample_cookbook]" | sed -e 's/^"recipe\[//' -e 's/\]"//'
 #=>sample_cookbook
```


###2. or条件のパイプ`|`はエスケープして使う
`\|` <= これ使えばor条件で文字列検索できる

```bash:roleがrunlistに入っていたらroleの名前も取りたいとき
##"recipe[か"role[で検索して置換する
 echo "role[sample_cookbook]" | sed -e 's/^"recipe\[\|^role\[//' -e 's/\]"//'
 #=>sample_cookbook
```
node.jsってどうよ？

JavaScriptは昔から変態（褒め言葉で）なコードを書く人が多かったけど、
サーバサイドJavaScriptとしてnodeが登場してからは、さらに変態なソースを書く人が
多くなった気がする。

# node.jsって何？

サーバサイドで動作させる。イベント駆動型のJavaScript環境。

外部のライブラリ管理のnpmとか、node上で動作するフレームワークライブラリなんかもある。

基本、JavaScriptなので、JavaScriptが動作する環境であればだいたい動く。


# どのフレームワークを使う？

Webアプリケーションを考えるとMVCモデルに近いMVモデルが扱えるBackbone.jsがオススメ。
Webアプリケーション開発者であれば、MVCモデルは一度は聞いたことがあるだろうし、MVCモデルの呪縛がからは逃れ慣れないのがWebアプリケーション。

イベント駆動型なので、MVCというより、Modelを作成して、そのModelに対して、イベントのトリガーをセットし、Viewを紐付けると言った感じ。
（厳密には違うかもｗ）

Modelを組み合わせて、動作を作って行くという考え方について行けるかどうか。。。

また、SinglePageApplication（SPA）だとMeteor（メテオ）なんかあるので、
こちらも盛り上がっているっぽい。

JavaScriptの人達は、流れが速いので多分どれがデファクトになるかではなくて、
どれが生き残るか？なんだろうねぇ。

# どんな感じで？

どれも、ライブラリの組み合わせ次第で、結構ハードなことから単純なことまで
実装可能な感じ。

イベント駆動型という考え方は、無駄が無くて良いと思う。
しかし、所詮JavaScriptなので、デバッグ時に明確なエラーが確実に出るわけでは無いので、
JavaScriptのデバッグ地獄は覚悟した方が良いかもｗ


node.jsって最初のころは、WebSockを使ったWebサーバアプリのサンプル記事が多かったけど、
最近ではようやくWebアプリケーション開発のサンプル記事が多くなったので、そろそろ
仕事で採用しても良い頃かも。

しかし、従来のサーバサイドの言語で開発出来る方としては、わざわざJavaScriptでやる必要性も
なかなか見いだせないのが正直なところｗ
スクリプト内でIPアドレスを取得するときに使用する書き方

以下、eth0 に割り当てられているIPv4 アドレスを取得する際に使う書き方です。

`/sbin/ip -f inet -o addr show eth0 | awk '( $9 == "eth0" ) {print $4}' | cut -d/ -f 1`

[解説]

**`/sbin/ip -f inet -o addr show`** で、以下のような出力が得られる。

2: eth0    inet 192.168.1.1/24 brd 10.52.1.191 scope global eth0

NIC に複数のIPが振られていると、

2: eth0    inet 192.168.1.1/24 brd 10.52.2.255 scope global eth0
2: eth0    inet 192.168.1.2/24 brd 10.52.2.255 scope global secondary eth0:1

というように、複数行出てくるので、

**`awk '( $9 == "eth0" ) {print $4}'`**

で、`$9` が eth0 である行のみを抽出し、`print $4` で
"192.168.1.1/24" という文字列が取得できる。

**`cut -d/ -f 1`**

cut コマンドで区切り文字を '/' とし、192.168.1.1 と 24 で分割し、1番目を取り出す。

サンプルとして、eth0 / eth1 を取得して変数に代入するshellスクリプト

```bash:ipaddr.sh
IF_ETH0=`/sbin/ip -f inet -o addr show eth0 | awk '( $9 == "eth0" ) {print $4}' | cut -d/ -f 1`
IF_ETH1=`/sbin/ip -f inet -o addr show eth1 | awk '( $9 == "eth1" ) {print $4}' | cut -d/ -f 1`
```
c++ builder XE4, 10.2 Tokyo > TeeChart > シリーズから点を除く > Series1->Delete(0);

```txt:動作環境
C++ builder XE4
    TeeChart Lite v2013.08.130414
RAD Studio 10.2 Tokyo Update 2 (追記 2018/01/10)
    TeeChart v2016.17.160129 32bit VCL
```


TeeChartで余分となった点をシリーズから取り除く方法。

参考
https://www.steema.com/files/public/teechart/java/v1/docs/Tutorials/tutorial6.htm

```Unit1.cpp
//---------------------------------------------------------------------------

#include <vcl.h>
#pragma hdrstop

#include <DateUtils.hpp>
#include "Unit1.h"
//---------------------------------------------------------------------------
#pragma package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
//---------------------------------------------------------------------------
__fastcall TForm1::TForm1(TComponent* Owner)
	: TForm(Owner)
{
}
//---------------------------------------------------------------------------
void __fastcall TForm1::FormShow(TObject *Sender)
{
	Chart1->Series[0]->XValues->DateTime = true;
	Chart1->BottomAxis->DateTimeFormat = L"nn:ss";

	TDateTime dt;

	dt = Now();
	double dval;
	for (int idx=0; idx < 100; idx++) {
		dval = (double)random(60);

		Series1->AddXY(dt, dval, L"", clRed);
		dt = IncSecond(dt, 1);
	}
}
//---------------------------------------------------------------------------
void __fastcall TForm1::B_removeFirstClick(TObject *Sender)
{
	Series1->Delete(0);
}
//---------------------------------------------------------------------------
```

removeFirstボタンを押すたびに先頭のデータが取り除かれていく。

大量に取り除くにはDelete()を繰り返すことになるのだろうか。
Keychain Access に記憶されているパスワードを確認する


ファイルサーバの引っ越しやら何やらで、いつも Keychain Access でパスワードを入力していたものを、手入力しなければならない場面に直面することがある。

そんな状況になったとき、以下の手順でパスワードを確認することができる。

1. Keychain Access を立ち上げキーチェーンの中から「ログイン」を選択
![step1.png](https://qiita-image-store.s3.amazonaws.com/0/8219/ebab5648-3080-3431-2e04-5c114c65807d.png "step1.png")


2. ログインの一覧から種類：「ネットワークパスワード」で該当サーバの名前を探し、右クリックで「情報を見る」
![step2.png](https://qiita-image-store.s3.amazonaws.com/0/8219/901179e2-57ac-b311-e72b-67f1a6b4a159.png "step2.png")


3. ログインの情報が表示されるので、「パスワードを見る」にチェックをつける。このとき現在使用している端末のログインパスワードを聞かれるので入力。
![step3.png](https://qiita-image-store.s3.amazonaws.com/0/8219/bc941f80-769c-9d0a-9338-d2a1a231635d.png "step3.png")


これでパスワードが確認できる。
【Unity】ADX2LEでランダムとかにならない場合

最近はまったので、

アプリ起動時にランダムな音がなるようにAtomCraftでシーケンスを組んでいたのだが、毎度同じ音が鳴ってしまう。

なんだろう？と、

#ランダムの種

あ、ランダムのシード値が毎度同じなんだなと。（あるある）

で、
##ADX2LE for Unityの場合、
![image](https://qiita-image-store.s3.amazonaws.com/0/96808/f1d5912d-0a80-5092-ac53-99a29897c76e.png)

Cri Ware Initializerの「Uses Time For Seed」をチェックすると無事ランダムになった。

##ADX2LE for windowsとかの場合
Unityじゃないネイティブ版だとランダムのシードが指定できたりする様子。
[criAtomEx_SetRandomSeed]
(http://www.criware.jp/adx2le/docs/windows/group__ATOMEXLIB__GLOBAL.html#ga15e1bf48c1b13442eca672d091f72fdd)

###プレーヤー毎にもできるみたいですね。
[criAtomExPlayer_SetRandomSeed]
(http://www.criware.jp/adx2le/docs/windows/group__ATOMEXLIB__PLAYER.html#ga384ccb2beaffea40cfd801eb175c69d4)

ランダムだけど再現したい場合とか（リプレイ画面とか、ネットワークで同期しているゲームとか）
の場合、同じランダムの種を使うことで解決するためにあるっぽい。

###ランダム生成関数のインターフェースもあるみたい
[CriAtomExRngInterface](http://www.criware.jp/adx2le/docs/windows/structCriAtomExRngInterfaceTag.html)
何ができるのかよくわからないけど・・・深い。

#ADX2LE for Unityでインスペクタの設定が保存されない？

上の操作をしていて気がついた別件ですが、
リリース中のADX2LEのプラグインのインスペクタを変えただけだと**保存されない**バグがあるっぽい。
（Unity Editor拡張でありがちなバグ・・・）

ので、変更したあと、シーンに空のオブジェクト作って、消してとしてと手動でフラグを立ててから
シーン保存して反映することができた。
（ゲームジャムとかで共有するときに気をつけよう・・・）
SESを使ってメールテスト

SES使ってシステムからはメールを送ってるけど
テストやなんかでEC2からメールを送りたいときがある。
わざわざpostfixやsendmailを立ち上げるのも、、という時に。

* * *


##SESの設定
ドメイン認証、メールアドレス認証云々は出来てる前提で

###SMTP認証ユーザーの作成
SMTP Settingsの 「Create My SMTP Credentials」を開く
<img width="806" alt="ses1.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/57366/4ee061b2-e08a-2817-4a58-e4d4f215a626.png">

IAMユーザー名は変更の必要があれば変更して「作成」
<img width="836" alt="ses2.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/57366/72ccc68b-e6d8-f503-1da6-440eb3baf46f.png">


ユーザーの SMTP セキュリティ認証情報を表示させるか
認証情報をダウンロードして内容を保存しておく。
<img width="834" alt="ses3.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/57366/7be138c2-19d5-0ae2-ef57-9ff995732d6c.png">


##EC2サーバで
### mailxのインストール
```
$ sudo yum install mailx
```

### .mailrcの作成
メールを送信したいユーザーで.mailrcを作成

```
$ vi ~/.mailrc

 set smtp-use-starttls
 set smtp=smtp://email-smtp.[REGION].amazonaws.com:587 (SMTP SettingsのページでServer Name:に表示されてるやつ)
 set smtp-auth=login
 set smtp-auth-user=[SMTP ユーザー名:に表示されたたやつ]
 set smtp-auth-password=[SMTP パスワード:に表示されてたやつ]
 set ssl-verify=ignore
 set nss-config-dir=/etc/pki/nssdb/
 set from=FromAddress(メールアドレス認証出来てるやつ)
```

###メールを送ってみる
```
$ echo hoge | mail -v -s fuga 送りたい@アドレス
```
$ git log --oneline オプションで、ログを一行で表示する


# コマンド

`$ git log --oneline`

# 結果

```
be72210 Update gem 'guard-rspec'
233f60b Create new resoure 'UserGroup'
a54daf3 Update gem 'shoulda-matchers'
```

スッキリ！

# 補足

- 「git log 一行」でググっても、このトピックだけを扱ったページがなかったので投稿。



<!-- Update From Qiita API -->

# チャットメンバー募集


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

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


# メンター受付


https://menta.work/user/5694

<!-- Update From Qiita API -->
SCSSで&を使うタイミング

同様の疑問に遭遇していた記事などを参考にしつつ

## 参考

[Sassの&(アンパサンド)の扱いが分からんって話 - naichi's lab](http://blog.naichilab.com/entry/2015/10/24/011926)

### 引用

>＆いらなくね？
> 試しに書いてみたんだけど

```
#hoge {
  font-size: 1.7em;
  :hover{      /* & なし */
    color:#fff;
  }
}

#fuga {        
  font-size: 1.7em;
  &:hover{    /* & あり */
    color:#fff;
  }
}
```

> 展開されたのがこれ

```
#hoge {
  font-size: 1.7em;
}
#hoge :hover {
  color: #fff;
}

#fuga {
  font-size: 1.7em;
}
#fuga:hover {
  color: #fff;
}
```

>ふーん。。。
>何が違うんや。。。
> ってあれ、貼り付けて気づいたけどスペースの有無が違う？


## CSSについて
### スペースで親子関係を示す

[継承と子孫セレクタとは？：CSS入門](http://kumacrow.blog111.fc2.com/blog-entry-272.html)

```css
table td {}
```

```
親(半角スペース)子 {}
```

CSSでは半角スペースは、親と子の関係を示しているようだ。

### CSSではIDとクラスはスペースなしで連結可能？　SCSSでは連結ではなく入れ子の形に構文が拡張された？？

```
#hoge{
  &.foo
}
```
は`#hoge.foo`に展開されるので、idが`hoge`でclassが`foo`の要素という意味になると推測。
２年間で検証したかったことをまとめるよ

前職を辞めてから２年間、スタートアップ業界に関わってきましたが、また会社に戻るいい機会なのでまとめます。Qiitaで書く話題じゃないけど、Markdown便利なので

#1 新橋洋酒
2013年の11月に退職してますが、この時期のインターネット業界の大きなトピックといえば、**「Yahoo ショッピングの無料化」**ですね。BASE、STORESJPも既に出てましたが、Yahooショッピングの無料化で**小規模ネットショップ**の参入が進むのではないかと考えました。

そこで、その先に来るのは何かと考えたときに、**ネットショップへの誘導**が課題になると思い、まずは誘導手段を研究しようということで始めたのが**新橋洋酒**です。皆さんに多くのアドバイスをいただきましたが、他のショップで再現できない方法は**NG**なので基本的にお断りしてたかと思います。

Facebook、Twitter、ディスプレー広告と10万円ぐらいまでで試せる、媒体を1通り検証しました。
一番効果があったのは、FBページですね。当時はまだいいね１件あたり**50円**ぐらいで獲得でき。2000いいね程度まで一気に積み上げました。１投稿あたりのいいね数も100前後、リーチは1200程度まで伸びました。
<img width="498" alt="スクリーンショット 2015-12-21 午後0.48.08.png" src="https://qiita-image-store.s3.amazonaws.com/0/32586/2c3eacf9-8af6-0929-f8a0-b16e3f10ce93.png">

しかし購買率低かったです、結局50人くらいには売れたので、50人/2000人 2.5%ですね。ソーシャルゲームの課金率でも5%はいくので、低すぎですね。

リワード広告、簡単にいうといいねするとワインあげるよという、いまではFBで禁止されてる方法で1000いいねぐらい積み上げましたが、この層は全然ダメでしたね。すべての投稿で誰がいいねしたかを追跡してたのですが、この層の人はまったくいいねしませんでした。何人か見てみたのですが、検証応募用のアカウントになってるような感じで、使っていたとしても、タイムラインに新橋洋酒が出ることはなさそうです。

この結果を元にやろうとしたのが、**ショッピングアプリ**です。PCからスマフォ、もっと踏み込むと**アプリ**に移行するのはもうわかっていたので、アプリ上でショッピングモールを作り、パーソナライズされた通販カタログのような形で、主にFBから集客して、アプリにプールし切り売りする。集客チャネルは違いますが今でいうと**グノシー**のようなアプリですね。

他のショッピングアプリがまだまだUX的にいけてなかったので、ここをつけば第２の楽天をつくれるかなあという感じで蹴り始めました。

高い広告費を多くの広告主でシェアリングする一種のシェアリングエコノミーですが、登り方が悪かったですね。ネットショップは、まだまだ、検索流入に特化してるので商品写真も説明もいい加減なお店が多く、クロールして集めたデータを、パーソナライズするのが極めて難しくできたアプリの精度がとんでもなく悪かったです。半年間ぐらいキックしましたが諦めました。

ここで勉強したのは、コンテンツはクロールするのではなく**自分で足で稼いで**作らないとダメ。
今やり直すなら、ショップ側は全国行脚して名産品を集め、消費者のほうは、生産者とのリレーションを肝に、ポップアップ店舗などを駆使して集めれば、インバウンドも取れて以外とうまくいくかもしれないですね。

#2 スタートアップ支援
並行して進めていたのが、スタートアップ支援ですね。といっても全然イベントも行かず、適当にWantedlyやLancers、知人に教えてもらった会社に行く程度ですがw

何をしたかったかというと、エンジニアは一部の会社に集中してしまい、先端技術も一部の会社に集中しているため、スタートアップがいいビジネスモデルを持っていても、実現しない状況でした。

2013年はまだまだソーシャルゲーム業界にノウハウが蓄えられていたので、それを外に出そうということで、話を聞いて技術トランスファーしながら半年ぐらいでアプリやサービスを作るということを行ってきました。

ここ半年で気がついたことは、キラキラした会社にはいいエンジニアが揃っていて自走してる、そうじゃない会社は教えても教えてもどんどん人が辞めてストックできない実態です。**プロジェクトブロークンして辞めるCTO**とかスタートアップあるあるですね。

#3 マイソムリエ
ちょうど手が空いたので始めたのが、マイソムリエです。

日本でもファストデリバリできないかなあというのと、物は買う時代から借りる時代になるのはわかっているので
衣、食、住の、食をターゲットに食器のシェアリングをやってみようと思いはじめました。

結果としては、限定エリアに対してリーチする手段は極端に難しい。ここで勉強したのは、ユーザへのリーチ手段の大切さですね。どんなにいいサービスでもユーザにリーチできないと本当に難しいです。

マイソムリエに関しては未だに、ユーザへのアプローチ手段がまとまってないです

#4 まとめ
まだ顕在化していないマーケットを開拓するには多くのお金と時間がかかります。キャシュリッチなキラキラした会社で、技術を教えながら、市場を取り行きたいと思ったのが会社に戻るきっかけです。次はきっちり市場を取り行きます！
Apache SparkでDBからWHERE句付きでDataFrameを作成する

Apache Sparkで既存のDBMSから
DataFrameを作成するには以下のようなやり方があります。

確認した環境
Windows 10
MySQL 5.7.10  *（付属のサンプルデータ worldデータベースのcityテーブルを使用しました）*
Apache Spark 1.5.2

JDBCドライバの設定

```
set SPARK_CLASSPATH=lib\mysql-connector-java-5.1.38-bin.jar
```

SPARK_CLASSPATHにjdbcドライバのパスを設定します。
Windows環境のためSETコマンドを使用しています。

そしてspark-shellの起動
```
spark-shell
```

以下を貼り付けます。

```scala:
val sc: SparkContext // An existing SparkContext.
val sqlContext = new org.apache.spark.sql.SQLContext(sc)

// this is used to implicitly convert an RDD to a DataFrame.
import sqlContext.implicits._

val options = Map("driver" -> "com.mysql.jdbc.Driver",
"url" -> "jdbc:mysql://localhost:3306/world?user=xxx&password=xxx",
"dbtable" -> "(select * from city where countrycode = 'NLD') as city2")

var jdbcDF = sqlContext.read.format("jdbc").options(options).load()

jdbcDF.count()
```

dbtabeの項目は、通常テーブル名を指定しますが、上記のように別名をつけることで任意のSQLが書けます。

>(select * from city where countrycode = 'NLD') as city2

結果は以下のようになりました。

>res0: Long = 28

cityテーブルは実際には、4079レコードありますが、「countrycode = 'NLD'」のもののみ絞り込まれています。
これで不必要なデータをメモリに読み込む必要がなくなりました。
海外逃亡する？

逃亡って言ったら、海外逃亡がかっこいいよね。

ただ、世界は広いので、どこに行くかノマド出来るおすすめの逃亡場所をいくつかピックアップ！

あくまでも自分が滞在した時の主観なので、異論反論はあると思いますが、
戯れ言なので水に流してください。

# となりの台湾！

LCCを使えば、往復の飛行機代とホテル代込みで４万円以下からある台湾。
台北なんかだと、羽田発の便があったりして、結構便利かも。
パスポートの有効期限が十分あれば、行きたくなったら行けるしね。
（パスポートの有効期限が十分に無いと、入国出来ないので注意！）

台湾と言っても、あくまで熱帯地方なので冬でも暖かいらしいし、
食事もそんなにはずれが少ないみたい。

エクストリームノマドの入門編としては最適なのでは？

# がんばってフィリピン

飛行機代とかホテル代とか結構するので、衝動的に勢いで行くにはちょっと無理があるかもｗ

最近は、セブあたりで英語の語学留学とITのプログラミング研修なんかセットにしたプランも
あるそうなので、ぶらぶらと観光するよりは海外研修っていう名目で旅立ってみれば？

ただ、治安がちと悪いのが難点。

# 海外就職も夢じゃ無いベトナム

今、日本のSIerがこぞって進出しているのがベトナム。
ようは、プログラミングが出来る安い労働力を大量に確保したいから、ベトナムに行くらしい。

現地のエンジニアと日本のエンジニアとの間を橋渡しする、ブリッジエンジニアの求人って
結構あったりする。
まあ、ベトナムに数年間常駐させられる精神力と英語が出来るスキルがないとダメだけどｗ

海外で働くっていう選択肢もいいのでは？

# しきいが高いぞ！シンガポール

シンガポールって観光で行くには良い場所だけど、現地の会社に就職しようとなると
結構しきいが高いそうです。

まあ、物価も高いし、家賃も高いしね。
でも、賃金ももちろん高いので、エリートコースですよ！プロデューサーさん！！

# 意外に人気がある。マレーシア

実は、マレーシアという手もありかも。
治安もそこそこいいし、ある程度の資産と収入があれば長期滞在ビザも取得できるらしい。

中華料理が嫌いで無ければ、結構食べ物も大丈夫ｗ

# 行ってみるかい？インド

インドは、バッグパッカーの聖地というか、自分探しの旅や逃避行ではおなじみ。
空港に着いた時から、客引きやスリに注意しないといけないイメージがあるけど、それは
北インドのお話。

オススメは、バンガロールやケララなんかの南インドがおすすめ。

インドらしいカオスさはあるけど、そこまでひどい騙され方や客引きに会うことは無いし、
水や食べ物は、中流以上のお店に行けばお腹も壊さない。

ホテルも中の上に泊まれば、シャワーもお湯が出るし、部屋も清潔。

南のケララ州なんかは、リゾート地な上に、州政府が共産党が与党なので
プチ共産主義国家体験も出来るｗ

エクストリームノマドをするなら、やはり一度はインドでやらないと。

# やっぱ西海岸？

あこがれだよね。シリコンバレー。観光目当てで行ってみたい。
行ったことがないので省略ｗ

# 海外って意外と便利

メジャー航空会社の国際線だと、機内無線LANが使えるし、
主要空港だと無線LANスポットもある。
待合ロビーのソファーには電源コンセントもある。

北米の街中だと、観光客向けにFREE WiFiなんか整備されている街もあり、
意外と屋外でもノマドが出来るイメージ。




ってな感じで、海外に逃亡してノマドするのもアリだと思う。
個人的にはミーハーだけど、シリコンバレーで一度は仕事をしてみたいねｗ
C++ で C#のstring.Format的なことをする

```
#include <stdio.h>
#include <tchar.h>
#include<stdarg.h>

static void mysformat(char* buf,const int len, char* format, ...)
{
	va_list list;
	va_start(list, format);
	_vstprintf_s(buf, len, format, list);
	va_end(list);
}
```

#使い方

```
void main()
{
	int x = 3;
	float y = 4.5f;
	char* str = "hogehoge";

	char text[256];
	mysformat(text, 256, "x = %d, y = %.1f, str = %s", x, y, str);
	printf(text);

	getchar();
}
```

#結果

```
x = 3, y = 4.5, str = hogehoge
```
Qiita | 「それなんですか？」と聞かれたら Qiita に書こう ( 需要のあるテーマの見つけ方 )

# 需要

人から「それなんですか？」と聞かれるものは、だいたい需要がある。

たとえば、人に自分のディスプレイを見せて操作した時に。
「そのコマンドなんですか？」と聞かれるものは。
**自分には当たり前でも、人は知らないコマンド**であることが多い。

積極的にネタにしていこう。

# 例

たとえば自分の場合で言うと、ストックが多かった記事はどれも。
人から「それなんですか？」と聞かれたものだ。

- [vi / vim で最後の行からファイルを開く方法](http://qiita.com/Yinaura/items/8e152972017189fd7085)
- [bundle install の速度を1.5倍 にする方法。 ( 並列実行 )](http://qiita.com/Yinaura/items/317be4f158be9c3fa1aa)
- [Vim | 意外と知らない :x コマンド ( 保存+終了 )](http://qiita.com/Yinaura/items/c74a09656beda6f02abb)




<!-- Update From Qiita API -->

# チャットメンバー募集


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

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


# メンター受付


https://menta.work/user/5694

<!-- Update From Qiita API -->
【Unity】Pluginsフォルダーのスクリプトから本体スクリプトを呼び出したい

##なぜこんなもんを書く？
Unityでは特殊フォルダー(Plugin, Editor, Resourcesなど)があり、Pluginフォルダーから本体(特殊フォルダー以外の外部スクリプト)に直接アクセスできない仕組みらしい

##アクセスするにはどうすれば良い？
結果から言うとこんな感じでアクセスできる

```csharp
void Start ()
{
    // 実行中にManagersという名前のゲームオブジェクトを探す
    var GUIMessageHelper = GameObject.Find ("Managers");
    // ゲームオブジェクトに付いているコンポーネントを名前から探す
    var comp = GUIMessageHelper.GetComponent ("GUIMessageHelper");
    // 呼び出したいメソッドのパラメータを作る。ここではDictionary<string, string>型
    var messageDic = new Dictionary<string, string>
    {
        { "MapPos", transform.position.ToString()}
    };

    // コンポーネントから呼び出したいメソッド名、パラメータ順で呼び出せる
    comp.SendMessage ("AllPlatformGuiMessages", messageDic);
}
```

##注意点
・ゲームオブジェクトは実行中に必ず存在すること(上記ではManagers)
・そのゲームオブジェクトに必ずコンポーネントが存在すること(上記ではGUIMessageHelper)
・SendMessageから呼び出すメソッド名とパラメータは必ず一致すること
・SendMessageで複数パラメータを渡したい場合はクラスを作るかObject配列で渡すこと
Xcodeでxibを呼び出したときにオートレイアウトが効かなくて困った

ハマったのでメモ
Xcodeでxibを呼び出すときにオートレイアウトが効かなくて困った。

```lang:ViewController
let addView = UINib(nibName: "addView", bundle: nil).instantiateWithOwner(self, options: nil)[0] as! UIView
```

みたいな感じで呼び出す。すると呼び出されたViewでオートレイアウトが効いておらず

非常に困った。freameの値を変えても変わらない
そこで

```lang:ViewController
addView.translatesAutoresizingMaskIntoConstraints = true
```

このコードを追加した。
その後frameの値を変えると問題なく反映。
無事に解決！
良かった良かった。
ASUS X200MAにUbuntu14.04をインストールした話

ASUSX200AにUbuntu12.04をWindows8とデュアルブートして使っていましたが、ふと14.04にしたくなって、Windows8.1と両立しつつ入れ直したときに起きた問題をメモ（情弱向け）。

##Ubuntu14.04のインストール##
まず、Ubuntu12.04とのデュアルブートを解消します。
１．Windows8.1を起動、リカバリーディスクを作成
２．リカバリーディスクを起動、Windows8を修復しgrub2を消し去る
３．Windows8.1からUbuntu12.04がインストールされているパーティションを削除
４．Live DVD(またはインストールUSB)からUbuntu14.04をインストール
詳細なインストールの仕方はここでは省略します。

##生じた問題##
* Ubuntu14.04を起動すると、画面が表示されない（起動音はする）。
* セーフモードで起動すると普通に画面が表示される。

##解決方法##
* インストールしているグラフィックドライバが異なっていた。
* ASUSX200AのCPUはIntel celeron（グラフィック機能内蔵）であるので、これに対応したグラフィックドライバをインストール
* セーフモードで起動し

```
sudo apt-get install xserver-xorg-video-intel-lts-trusty
```
で解決
やっぱ北に逃げるっしょ。

日本は南北に長い、南の反対は北ってことで、北に逃げましょうｗ

北と言えば、試される大地北海道。
まあ、北海道以外にも、仙台とか福島、新潟なんかもあるけど、北海道、特に札幌に逃げる場合の話を。

# 頑張れば青春18きっぷで行ける！

津軽海峡を渡る手段さえ確保出来れば、実は陸路で行ける！
あの「青春１８きっぷ」でも行けちゃうｗ
（すげー時間がかかるけどね）

北海道新幹線が開業したら、青春18きっぷはどうなるのだろう。。。。


一番無難なのは、やはり飛行機です。
1時間半で着いちゃう。千歳まではね。千歳から札幌までがちょっとあるけどｗ

まあ、夏場や雪祭りなどの観光シーズン以外は意外と安いです。

# 野宿はやめよう。夏でもね。

意外と一年中朝晩が冷え込むのが北海道。野宿すると夏の札幌でも寒くて凍えます（体験談ｗ）。

ユースや安宿も充実していたり、コワーキングスペースなんかあったりするので、
結構、大都会です。札幌。

西海岸系のカフェも多い気がする。札幌駅に３つもあったｗ

大学や専門学校も多いしね。

# 札幌って結構会社あるよね。

ソフトウェア系の会社やIT系の会社もあったりするので、
作業する場所以外にも、就職するっていう選択肢も考えられる。

まあ、フリーランスなら札幌で起業しちゃうっていうのもアリでは？

しかし、あくまで札幌での話であって、札幌から出てしまうと、マジで試される大地なので、
ノマドワークには全然向かい無いです。

昔いた会社の同僚の知り合いが、富良野に住んで仕事をしていて、打ち合わせで２週間に一度
上京しているWebデザイナーさんがいた話を聞いたけど、今はどうなんでしょうね？
Vim | 意外と知らない :x コマンド  ( 保存+終了 ) 

`:x` は。

`:w` で保存した後に、`:q` で終了するのとほぼ同じだ。

ただし、**ファイルに変更があった時だけ保存する**という点が違う。

---

メリット: 最も入力しやすい



<!-- Update From Qiita API -->

# チャットメンバー募集


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

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


# メンター受付


https://menta.work/user/5694

<!-- Update From Qiita API -->
Swiftの演算子を理解する

Swiftの演算子についてまとめてみます。

## Swiftの演算子は関数
+-*/==??と言った演算子は全て関数です。

```swift
public func +(lhs: Int, rhs: Int) -> Int
public func -(lhs: Int, rhs: Int) -> Int
public func *(lhs: Int, rhs: Int) -> Int
public func /(lhs: Int, rhs: Int) -> Int
public func ==(lhs: Int, rhs: Int) -> Bool
public func ??<T>(optional: T?, @autoclosure defaultValue: () throws -> T) rethrows -> T
```

## 自分で作ったクラスの演算子を定義する
例えば自分で作ったクラスや構造体同士を==で比較したい場合は以下のように==メソッドを定義します。

```swift
struct MyStruct {
    let id: String
}
func ==(lhs: MyStruct, rhs: MyStruct) -> Bool {
    return lhs.id == rhs.id
}

MyStruct(id: "1") == MyStruct(id: "2") // → false
MyStruct(id: "1") == MyStruct(id: "1") // → true
```

## 独自の演算子を定義する
完全にオリジナルの演算子を定義したい場合は以下のように一度定義する必要があります。

```swift
infix operator *** {
    associativity none
    precedence 130
}
func ***(lhs: Int, rhs: Int) -> Int {
    return lhs * rhs
}

1 *** 1 + 1
```

precedenceは演算子の優先順位です。
値が大きい方が優先して計算されます。

```swift
infix operator *** {
associativity none
precedence 10
}
func ***(lhs: Int, rhs: Int) -> Int {
    return lhs * rhs
}

3 *** 1 + 1 // → 6(+のprecedenceは140なので***より先に計算される)
```

associativityは同じ優先度の演算子があった時に右と左のどちらを優先するかを決めれるものです。
left, right, noneの3種類があります。

```swift
infix operator *** {
associativity left
precedence 210
}
func ***(lhs: Int, rhs: Int) -> Int {
    return lhs * rhs
}

3 *** 1 *** 2 // noneの場合は同じ演算子のものが2つあるってエラーになる
```

++1のように先頭に付ける演算子はinfixの代わりにprefixを使います。
ここではassociativityやprecedenceを使えません。

```swift
prefix operator *** {
}
prefix func ***(lhs: Int) -> Int {
    return lhs * 10
}

***1
```

逆に末尾に付ける演算子ではpostfixを使います。

```swift
postfix operator *** {
}
postfix func ***(lhs: Int) -> Int {
    return lhs * 10
}

1***
```

それとassignmentという属性があったのですが、どんな効果があるかは分かりませんでした。
*=、+=などに付いているので代入が関わってくるとは思うのですが。

```swift
infix operator ***= {
assignment
}
```

## 使える記号
演算子に使える記号は以下になります。

```
/, =, -, +, !, *, %, <, >, &, |, ^, ?, ~
```
ASP.net MVC + VB.net Oracle

#概要
ASP.net MVC5 実践プログラミングの書籍を勉強してて、VBで記述する場合どうやるの？
Oracleへの接続はどうやるの？って疑問に思って。忘れないように。

#環境
Windows7 SP1 32bit
Oracle11g
Visual Studio2013 Professional
IE11
#前提
データベース上にテーブルが作成されていること

Members

```SQL:DDL
CREATE TABLE MEMBERS 
(	
	"ID" NUMBER NOT NULL, 
	"NAME" VARCHAR2(30 BYTE), 
	"EMAIL" VARCHAR2(80 BYTE), 
	"BIRTH" DATE, 
	"MARRIED" CHAR(1 BYTE), 
	"MEMO" VARCHAR2(120 BYTE)
)
```

Insertは省く

#手順
※基本的には本に従って進める(Chapter2)
1.プロジェクトを作成 + ビルド　プロジェクト名:WebApplication7

2.Modelsフォルダに 新規EDM(ASP.NET Entity Data Model) を追加 + ビルド 
モデル名:MembersModel Entities名:ModelEntities
  (データベースから EF Designer)

3.Controllesフォルダに コントロール追加 + ビルド コントローラ名：BeginController
(MVC5 コントローラ名(空))

4.BeginController.vbに以下を追記

```VB.net:BeginController.vb
Public Class BeginController
Inherits Controller
Private db As New ModelEntities  ’この行
Function Index() As ActionResult
Return View(db.MEMBERS.ToList()) ’この行
End Function
```

5.Index()メソッドを右クリックして ビューの追加 + ビルド ビュー名:Index 他デフォルト

6.Index.vbhtmlに以下を追記

```html:Index.vbhtml
@ModelType IEnumerable(Of MEMBERS)
@Code
ViewData("Title") = "Index"
End Code
<h2>Index</h2>
```

<Font Color=Blue>以下、全部追記</Font>

```html:Index.vbhtml
<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(Function(model) model.NAME)
        </th>
        <th>
            @Html.DisplayNameFor(Function(model) model.EMAIL)
        </th>
        <th>
            @Html.DisplayNameFor(Function(model) model.BIRTH)
        </th>
        <th>
            @Html.DisplayNameFor(Function(model) model.MARRIED)
        </th>
        <th>
            @Html.DisplayNameFor(Function(model) model.MEMO)
        </th>
    </tr>
    @For Each item In Model
        @<tr>
            <td>
                @Html.DisplayFor(Function(modelItem) item.NAME)
            </td>
            <td>
                @Html.DisplayFor(Function(modelItem) item.EMAIL)
            </td>
             <td>
                 @Html.DisplayFor(Function(modelItem) item.BIRTH)
             </td>
             <td>
                 @Html.DisplayFor(Function(modelItem) item.MARRIED)
             </td>
             <td>
                 @Html.DisplayFor(Function(modelItem) item.MEMO)
             </td>
        </tr>
    Next
</table>
```

7.実行

8.結果
![結果.png](https://qiita-image-store.s3.amazonaws.com/0/101511/4ad6774c-199d-2e83-1246-8e03c8deed3f.png)

9.最後に
Scaffolding機能で 追加・編集・削除もできる。この本は 僕にとって とても役にたつ！

10.履歴
2016/10/07 コード部分をMarkdown記法に合わせて修正。
FuelPHPでユニットテストの準備

FuelPHPでPHPUnitの準備をする。oilコマンドでテスト実施。

PHPUnitは5.0以上の場合はPHPのバージョンが5.6以上必須となるので
まずはbrewを使用してPHP56をインストール。

```
brew install php56
```

バージョンを確認

```
php -v
PHP 5.6.16 (cli) (built: Nov 27 2015 10:28:22) 
Copyright (c) 1997-2015 The PHP Group
Zend Engine v2.6.0, Copyright (c) 1998-2015 Zend Technologies
```

プロジェクトのcomposer.jsonに以下を追加。
以下参考にさせていただきました。感謝。
[参考1]:(http://deadcode.hatenablog.jp/entry/2015/03/17/193437)
[参考2]:(http://qiita.com/sqrtxx/items/17c31c00b9630cf49f41)

```
	,	"phpunit/phpunit": "4.*"
	,	"phpunit/dbunit": ">=1.3,<1.4"
	,	"phpunit/phpunit-skeleton-generator": "*"
	,	"piece/stagehand-testrunner": "~4.1@dev"
	,	"davedevelopment/phpmig": "*"
	,	"squizlabs/php_codesniffer": "1.*"
```

プロジェクトの/fuel/app/配下にphpinit.xmlを配置し修正。

とりあえず動くか確認。

```
oil test
Tests Running...This may take a few moments.
PHPUnit 5.1.3 by Sebastian Bergmann and contributors.

...............................................................  63 / 389 ( 16%)
............................................................... 126 / 389 ( 32%)
............................................................... 189 / 389 ( 48%)
............................................................... 252 / 389 ( 64%)
............................................................... 315 / 389 ( 80%)
............................................................... 378 / 389 ( 97%)
...........                                                     389 / 389 (100%)

Time: 1.36 seconds, Memory: 29.75Mb

OK (389 tests, 483 assertions)
```

動いているっぽいので一旦これで完了。
YeomanでElectronプロジェクトを作る



面倒なWebプロジェクトを簡単に作成してくれる[Yeoman](http://yeoman.io/)でElectronプロジェクトを作成してみました。

## Yeomanとは

Yeomanは主にWebプロジェクトの雛形を作成してくれるツールです。Yeomanでは様々なプロジェクトの[Generator](http://yeoman.io/generators/)が公開されており必要なGeneratorを``npm``でインストールできます。

Generatorの中にはプロジェクトを生成したあとにもModelやViewのファイルを作成するコマンドを持っているものもあります。

今回は``electrion``で検索した中で一番GitHubでスターが多かった[generator-electron](https://github.com/sindresorhus/generator-electron)を利用します。確認したバージョンは``generator-electron@1.14.0``になります。

### Yeomanと付き合うコツ

人様が作ってくれたGeneratorを使うと、どうしても相容れない部分が生じます。いつも使っているファイル階層ではなかったり、テストライブラリが違ったり、ライブラリのバージョンが違ったり・・・

自分の場合、Electronに限らず個人や社内でしか使わないような小さなツールか、デモやプロトタイプ、勉強のためのサンプルなどの一過性のプロジェクト生成に対して使うケースが多いです。

そしてYeomanを使う場合はこだわりを捨てて、Generatorから与えられたものをなるべくそのまま使うようにしています。自分好みにカスタマイズしていくとキリがなく、それだとすぐ始められるというYeomanを使うメリットが薄れるからです。

逆にいうとこだわりを捨てられないプロダクションではなかなかYeomanを使う機会はありません。

## Yeomanのセットアップ

Node.jsのセットアップについては割愛します。

Yeomanのインストールは以下のようになります。

```
npm install -g yo bower grunt-cli gulp
```

実際のところ ``generator-electron`` はBowerもGrunt・Gulpを使っていなかったのでインストールしなくてもよいかもしれません。多くのWebプロジェクトのGeneratorはこれらに依存しています。

``generator-electron``のインストールは以下のようになります。

```
npm install -g generator-electron
```

``yo --help``でAvailable Generators一覧に表示されればセットアップは成功です。


```
$ yo --help
Usage: yo GENERATOR [args] [options]
(中略)
Available Generators:
  electron
```

## Electronプロジェクトの生成

Yeomanでは``yo <generator名>``コマンドで **カレントディレクトリ** にプロジェクトを生成します。以下のように先にディレクトリを作成して実行すると良いです。

```
mkdir electron-yo-quick-start
cd electron-yo-quick-start
yo electron
```

プロジェクト名などいくつか対話式の入力を行ったあと、プロジェクトの生成と ``npm install`` が行われます。

### プロジェクトの構成

``generator-electron``は非常にシンプルな構成になっています。

```
.
├── index.css
├── index.html
├── index.js
├── license
├── node_modules/
├── package.json
└── readme.md
```

依存ライブラリは以下のようになっています。開発用のツールしかないのでここからUIや機能を肉付けしていこうとするといろいろライブラリを追加していく必要があります。


```json:package.json
{
  "dependencies": {
    "electron-debug": "^0.5.0"
  },
  "devDependencies": {
    "electron-packager": "^5.0.0",
    "electron-prebuilt": "^0.36.0",
    "xo": "^0.12.0"
  },
}
```

``scripts``プロパティの指定は以下のようになっています。

```json:package.json
{
  "scripts": {
    "test": "xo",
    "start": "electron .",
    "build": "electron-packager . $npm_package_productName --out=dist --ignore='^/dist$' --prune --asar --all --version=$npm_package_electronVersion"
  },
}
```

従って以下のタスクが利用できます。

* ``npm start`` でアプリケーションの実行 (``electron-prebuilt``を利用)
* ``npm run build`` でアプリケーションパッケージの作成 (``electron-packager``を利用)
* ``npm test`` でソースコードの検証 (``xo``を利用)


## まとめ

[Yeoman](http://yeoman.io/)と[generator-electron](https://github.com/sindresorhus/generator-electron)を利用して、Electronプロジェクトを作成する方法を紹介しました。

今回使ったGeneratorが作成するプロジェクトは非常にシンプルな内容であるため凝ったアプリを開発をする場合はここから多くの肉付けが必要です。逆に余計なものが何も入っていないからこそGeneratorの中でも支持されているのかもしれません。

Electronを始めたいけどどうプロジェクトを作り始めて良いかわからない場合など、勉強目的で触る時にYeomanでプロジェクトを作成するのは有効だと思います。
ajaxで追加した要素へのイベントセット

最近、フロントエンドの技術の進化とともにajax通信を行った後にリアルタイムでviewをレンダリングしていくなどjavascriptでリッチなユーザー体験をするようなサイトが多くなっています。

そうなると今までのjqueryの使い方では対応できない場合などがあります。
今回はクリックなどのイベント付与に関してまとめました。

まず以下は基本となるhtmlコードです。

```html:index.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>box</title>
</head>
<body>
  <div id="contant">
    <div class="box js-box"></div>
  </div>
  <script src="./js/index.js"></script>
</body>
</html>
```

##普通のクリックイベントのセット
.js-boxをクリックしたら何かしたい！（ここではconsoleに「boxをクリックしました！」と出す。）の場合以下のように書く

```js:index.js


$('.js-box').on('click',function(){
  console.log('boxをクリックしました！');
});

```

しかし、この.js-boxというcssのクラスがついた要素がjavasacriptなどによって、ページのロード終了後（jsのイベントセット後）に追加された場合、
上記コードではconsole.log(‘boxをクリックしました！’)が動きません。

##ajaxで追加した要素に対するクリックイベントの登録
この場合は、親要素の下のクラスという指定の仕方をするとうまく動くようになります。

```js:index.js
$('#content').on('click', '.js-box', function(){
  console.log('boxをクリックしました！');
});
```
という風に.on()の２つ目の引数にクリックした時に何かをしたいクラス、.onを設定する部分に親要素を追加してあげましょう！
こうすると.js-boxをクリックするとconsoleが出るようになります。

##同じ要素に複数のイベントをセットしたい
.js-boxにfocusした時にもイベントをセットしたいとすると

```js:index.js
$('.js-box').on('focus',function(){
  console.log('boxをフォーカスしました！');
});
```

こう書かなければならず、二つ合わせると

```js:index.js
$('.js-box').on('click',function(){
  console.log('boxをクリックしました！');
});
$('.js-box').on('focus',function(){
  console.log('boxをフォーカスしました！');
});
```
こう書かなければなりません。
もう無駄ですねマジで無駄です。

この場合２つは統一することが出来て

```js:index.js
$('.js-box').on({
  'click': function(){
    console.log('boxをクリックしました！');
  },
  'focus': function(){
    console.log('boxをフォーカスしました！');
  }
});
```
と書くことができます！
スッキリですね！

##ajaxで追加した要素に複数のイベントをセットしたい
ajaxで追加した要素にイベントをセットしたい場合は

```js:index.js
$('#content').on('click', '.js-box', function(){
  console.log('boxをクリックしました！');
});
```
このように書くことが出来ましたが２番目の引数に対象の要素を入れたいのに入れる場所がありません！
この場合は、一番最後に追加してあげて

```js:index.js
$('#content').on({
  'click': function(){
    console.log('boxをクリックしました！');
  },
  'focus': function(){
    console.log('boxをフォーカスしました！');
  }
}, '.js-box');
```

こうすることで複数のイベントをセットすることができます。

##余談ですが

```js:index.js
$('body').on('click', '.js-box', function(){
  console.log('boxをクリックしました！');
});
```

body配下の.js-boxと指定すれば全部で動きそうですが、この記述だとiphoneで反応しません。

何かの参考になれば幸いです。