OmniAICreator/Qiita-1.07M huggingface dataset:
ParticleSystemとスクリプトで星空的なものを作る


5000個パーティクル作り、パーティクルは静止させている。
![image](https://qiita-image-store.s3.amazonaws.com/0/17747/bcfa1308-7d18-2e2c-1757-23de220aa1f2.png)

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

public class ParticleTest : MonoBehaviour
{

    // Use this for initialization
    void Start ()
    {
        ParticleSystem particleSystem = GetComponent<ParticleSystem> ();

        int num = 5000;

        particleSystem.Emit (num);
        ParticleSystem.Particle[] particle = new ParticleSystem.Particle[num];
        particleSystem.GetParticles(particle);
        particleSystem.Pause();
        for (var i = 0; i < num; i++)
        {
            particle [i].position = new Vector3 (
                (Random.value-0.5f)*100f,
                (Random.value-0.5f)*100f,
                (Random.value-0.5f)*100f
            );
        }

        particleSystem.SetParticles(particle,num);
    }

}
```
MacにTeXの執筆環境を入れるときに見たサイトのリンク集

卒業するのでノウハウ集を移動する作業、第三弾

#リンク集
1. atomで快適LaTeX編集環境 http://ayihis.hatenablog.com/entry/2016/09/24/143641
※ただし、エラーが出ている状態でコンパイルすると偶にauxファイルが壊れるので、gitで管理しておいて戻せるようにしておくと良い

2. 日本語を扱えるようにする方法の参考 http://medemanabu.net/latex/mactex-texshop-ptex-platex/

3. スタイルファイルの読み込み（読み込みたいなら） http://demmys.hatenablog.com/entry/2012/06/06/234808

#トラブルシューティング

* sudo mktexlsrできないんだけど？→PATHを追加する

```
export PATH="/Library/TeX/texbin:$PATH"
```

* 目次が表示されない、参考文献の指定が[?]になる→2回タイプセットが必要 http://shirokai.hatenablog.com/entry/texshop-bib
[C++]その仮想関数、本当に必要？

Neaural Networkのプログラムを書いてる時に気づいたのでメモ。

# 仮想関数呼び出しのコスト

C++でクラスの継承を用いたプログラムを記述する際、仮想関数を利用することがあります。仮想関数を利用するメリットは、「動的なポリモーフィズム」を実現できるところにあります。
一方で、仮想関数の呼び出しは通常の関数の呼び出しに比べてかなりオーバーヘッドが大きくなります。これは、仮想関数を呼び出すごとに仮想関数テーブルを参照していることに起因します(仮想関数テーブルが何なのか分からない方は、下の記事を参考にしてください)。

[「ｃ＋＋」プログラミング/第3章-ｃ＋＋プログラミングの裏側/3-4-仮想関数の裏側](http://embedded.cloverfield.jp/%E7%B5%84%E8%BE%BC%E3%81%BF%E7%8F%BE%E5%A0%B4%E3%81%AE%E3%80%8Cc%EF%BC%8B%EF%BC%8B%E3%80%8D%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0/%E7%AC%AC3%E7%AB%A0-c%EF%BC%8B%EF%BC%8B%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%A0%E3%81%AE%E8%A3%8F%E5%81%B4/3-4-%E4%BB%AE%E6%83%B3%E9%96%A2%E6%95%B0%E3%81%AE%E8%A3%8F%E5%81%B4/)

しかし、予めすべての子クラスが決まっていて、それらを配列にしたい時ってありますよね。その時には仮想関数を用いるのではなく、以下に示す方法のほうが高速です。

# タグ識別による条件分岐

仮想関数を用いない「動的なポリモーフィズム」を実現するために、タグによる識別を用います。
まず、子クラスのオブジェクト作成時に、そのオブジェクトにタグ(番号)をつけておきます。そして親クラスのポインタに格納され、メソッドを呼び出すときに、そのタグを参照して識別します。

例えば、親クラスAを継承する子クラスB,Cがあるとします。また、B,Cは同名のメンバ関数GetProperty()を持つとします。Aクラスのポインタに代入された後にGetProperty()関数を呼び出すには、以下のようにします。

```cpp
A *a[] = {new B(), new C()};

for(int i = 0; i < 2; ++i){
    if(a[i]->tag == 'B'){
        static_cast<B*>(a[i])->GetProperty();
    } else {
        static_cast<C*>(a[i])->GetProperty();
    }
}
```

これは明らかに型安全なキャストなので、dynamic_castする必要はありません。

# タグ識別のメリット

### 高速化
この方法のメリットとしては、まず高速化が挙げられます。
まずは仮想関数を使ったプログラム(virtual.cpp)とタグ識別を利用したプログラム(nonvirtual.cpp)で実行性能を比較しました(ソースコードは[ココ](https://github.com/Kogia-sima/Tag_vs_Virtual)にあります)。

#### 環境
CPU: Intel(R) Core(TM) i3-4025U (1.9GHz, 4コア, 64bit)
コンパイラ: g++(GNU GCC 5.4.0)
OS: Ubuntu 16.04 LTS

|                    |virtual.cpp|non-virtual.cpp|
|:-------------------|----------:|--------------:|
|最適化オプションなし     |  1854 [ms]|     1795 [ms]|
|〃　(関数本体のみ)     |   140 [ms]|      100 [ms]|
|最適化オプションあり(-O3)|   462 [ms]|      451 [ms]|
※関数本体のみとは、サブ関数(mt)を含まない関数本体の処理の累計時間を指します。

### templateの使用
他のメリットとして、テンプレートが使えることが挙げられます。
仮想関数ではテンプレートを使用することが出来ません。そんな時、このタグ識別による方法を使えば、関数テンプレートを使用することが可能となります。これは、可変長引数やユニヴァーサル参照の関数を利用できることを意味します。

# タグ識別が使えない場面
開発者が継承クラスの名前を知らない時ってありますよね。例えば、あるライブラリの設計者が、ユーザに対し、特定の関数をオーバーライドしたクラスの作成を要求することがあります。そんな時、仮想関数を利用すれば、ユーザはクラスの名前を自由に設定できますし、それを複数個作ることだって出来ます。
しかし、タグ識別による方法では、関数を呼び出す部分を実装するのに、あらかじめ子クラスの種類数、及びすべての子クラスのタグが定まっていなければなりません。従って、ユーザは決められた名前の子クラスしか作成できない上、呼びだされうるすべてのコンストラクタにおいてタグを設定する処理を書かなければなりません(暗黙に生成されるものも含めて)。

例えば、上で使用したnonvirtual.cppにおける子クラスSub1, Sub2の実装は以下のようになっています。

```cpp:nonvirtual.cpp
class Sub1 : public Base {
  public:
    Sub1() : Base('1') {} // タグを設定

    void test() {
        for (int i = 0; i < 10; ++i) {
            val += mt() % 10; // 0から9までの乱数を加える
        }
    }
};  //! class Sub1

class Sub2 : public Base {
  public:
    Sub2() : Base('2') {} // タグを設定

    void test() {
        for (int i = 0; i < 10; ++i) {
            val -= mt() % 10; // 0から9までの乱数を引く
        }
    }
};  //! class Sub1
```

今回は性能の比較が目的だったのでコンストラクタは一つしか実装していませんが、実際の場面ではもっと多くのコンストラクタが呼び出されます。そのため、ユーザはそれらのすべてにタグを設定する処理を書かざるを得なくなり、腱鞘炎になるリスクは飛躍的に向上するでしょう(?)。

だからといって、ライブラリ開発者がタグ識別を拒む必要はありません。コードが長いなら、コードを生成してしまえばいいのです。
つまり、プログラムをビルドする際、コンパイル前に予めソースコードを改変して、タグを設定する処理、及び関数の呼び出し処理を自動的に追加します。

C++のメタ機能がより進化すれば、コンパイラだけですべて生成できるのかもしれませんが、今の段階では無理がありそうです。。。
(Swift)iOSアプリが最新のバージョンであるかを確認する

#はじめに
アプリのバージョンがAppStoreのバージョンと比較して、最新のバージョンであるかを確認する方法について記載しました。
例えば旧バージョンの場合はAppStoreに誘導したい場合などに使えるかと思います。

#コード
Apple ID(アプリのID)を渡すと結果(AppVersionCompareType)が返ってきます。

```AppVersionCompare.swift
import Foundation

enum AppVersionCompareType {
    case latest
    case old
    case error
}

class AppVersionCompare {
    static func toAppStoreVersion(appId: String, completion: @escaping (AppVersionCompareType) -> Void) {
        guard let url = URL(string: "https://itunes.apple.com/jp/lookup?id=\(appId)") else {
            completion(.error)
            
            return
        }
        
        let request = URLRequest(url: url, cachePolicy: .useProtocolCachePolicy, timeoutInterval: 60)
        let task = URLSession.shared.dataTask(with: request, completionHandler: { (data, response, error) in
            guard let data = data else {
                completion(.error)
                
                return
            }
            
            do {
                let jsonData = try JSONSerialization.jsonObject(with: data) as? [String: Any]
                guard let storeVersion = ((jsonData?["results"] as? [Any])?.first as? [String : Any])?["version"] as? String
                    , let appVersion = Bundle.main.object(forInfoDictionaryKey: "CFBundleShortVersionString") as? String else {
                        completion(.error)
                        
                        return
                }
                
                switch storeVersion.compare(appVersion, options: .numeric) {
                case .orderedDescending:
                    //appVersion < storeVersion
                    completion(.old)
                case .orderedSame, .orderedAscending:
                    //storeVersion <= appVersion
                    completion(.latest)
                }
            }catch {
                completion(.error)
            }
        })
        
        task.resume()
    }
}
```

#使い方
下記のように使います。

```ViewController.swift:viewDidLoad
        AppVersionCompare.toAppStoreVersion(appId: appId) { (type) in
            switch type {
            case .latest:
                print("最新バージョンです")
            case .old:
                print("旧バージョンです")
            case .error:
                print("エラー")
            }
        }
```

下記のアプリバージョン(Version この場合2.0.0)とAppStoreバージョンを比較しています。
<img width="677" alt="スクリーンショット 2017-03-22 20.48.17.png" src="https://qiita-image-store.s3.amazonaws.com/0/89206/eebcae04-337f-4b9a-c465-bc3b563f5c6a.png">

#最後に
GitHubにコードを置いています。
https://github.com/hideyukitone/AppVersionCompare

参考
http://qiita.com/usatie/items/5f8a1f1f41a58f9e0035
urlparseしたurlにqueryを追加して元のurlにもどす

##### 概要

こんな感じのURLがあるとして、`https://api.twitter.com/1.1/statuses/user_timeline.json&screen_name=drwtsn64`
`urllib.parse.urlparse()`したあとに
query部分に`count=200`を追加して、元のURLに戻す方法。

##### 検証コード

```py
import urllib.parse

url = 'https://api.twitter.com/1.1/statuses/user_timeline.json?screen_name=drwtsn64'
parsed = urllib.parse.urlparse(url)

print(parsed)

query = urllib.parse.parse_qs(parsed.query, True)

print(query)

query['count'] = 200

print(query)

encoded = urllib.parse.urlencode(query, True)

print(encoded)

reversed = urllib.parse.ParseResult(parsed.scheme, parsed.netloc, parsed.path, parsed.params, encoded, parsed.fragment).geturl()

print(reversed)
```

##### 出力

```bash
ParseResult(scheme='https', netloc='api.twitter.com', path='/1.1/statuses/user_timeline.json', params='', query='screen_name=drwtsn64', fragment='')
{'screen_name': ['drwtsn64']}
{'screen_name': ['drwtsn64'], 'count': 200}
screen_name=drwtsn64&count=200
https://api.twitter.com/1.1/statuses/user_timeline.json?screen_name=drwtsn64&count=200
```

##### 注意点
`urlencode()`に渡してる`query`はdictionaryなので、クエリ文字の順番は保証されない
UnityでDebug用に法線を表示する


Sceneビューのみに表示されます

![image](https://qiita-image-store.s3.amazonaws.com/0/17747/89a39e6c-56c0-efc7-75e4-696c22e1e18e.png)

```csharp
using UnityEngine;

[ExecuteInEditMode]
public class NormalHelper : MonoBehaviour {

	public float length = 1;

	public Vector3 bias;

	void Update() {


		var meshFilt = GetComponent<MeshFilter>();
	    if (meshFilt == null) return;

	    var mesh = meshFilt.mesh;

		Vector3[] vertices = mesh.vertices;
		Vector3[] normals = mesh.normals;

		for (var i = 0; i < normals.Length; i++)
		{
			Vector3 pos = vertices[i];
			pos.x *= transform.localScale.x;
			pos.y *= transform.localScale.y;
			pos.z *= transform.localScale.z;
			pos += transform.position + bias;

			Debug.DrawLine
			(
				pos,
				pos + normals[i] * length, Color.red);
		}
	}
}

```

### ついでにtangentも追加したバージョン

```
using UnityEngine;

[ExecuteInEditMode]
public class NormalHelper : MonoBehaviour {

    public float length = 1;

    public Vector3 bias;

    void Update() {


        var meshFilt = GetComponent<MeshFilter>();
        if (meshFilt == null) return;

        var mesh = meshFilt.mesh;

        Vector3[] vertices = mesh.vertices;
        Vector3[] normals = mesh.normals;
        Vector4[] tangent = mesh.tangents;

        for (var i = 0; i < normals.Length; i++)
        {

            Vector3 pos = vertices[i];
            pos.x *= transform.localScale.x;
            pos.y *= transform.localScale.y;
            pos.z *= transform.localScale.z;
            pos += transform.position + bias;

            //normal
            Debug.DrawLine
            (
                pos,
                pos + normals[i] * length, 
                Color.red
            );

            //ついでにtangentも可視化
            Debug.DrawLine
            (
                pos,
                pos + new Vector3( 
                        tangent[i].x,
                        tangent[i].y,
                        tangent[i].z
                    ) * length, 
                Color.blue
            );

        }

    }
}
```
RubyからGoogleカレンダーを使う

## 手順

### GoogleConsoleからアプリ追加

### Gemfileに設定を追加
```ruby:Gemfile
gem 'omniauth-google-oauth2'
gem 'google-api-client', '~> 0.10'
gem 'signet'
```

### 認証してアクセストークン、リフレッシュトークンを取得

### Googleカレンダーのイベントを取得
```ruby
require 'signet/oauth_2/client'
require 'google/apis/calendar_v3'

client = Signet::OAuth2::Client.new(
  client_id: 'クライアントID',
  client_secret: 'クライアントシークレット',
  access_token: 'アクセストークン',
  refresh_token: 'リフレッシュトークン',
  token_credential_uri: 'https://accounts.google.com/o/oauth2/token'
)
client.refresh!

service = Google::Apis::CalendarV3::CalendarService.new
service.authorization = client

events = service.list_events('primary')
```
nasa space apps challenge その7

#概要
nasa space apps challenge に行けないので、勝手にハッカソンしてみる。
cesiumで冥王星と火星と月と国旗を表示してみた。

#写真
![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/j/Z/d/jZdk.jpg?t=1490182603)

#成果物
http://jsdo.it/ohisama1/jZdk

#写真
![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/f/l/M/flMK.jpg?t=1490182226)

#成果物
http://jsdo.it/ohisama1/flMK
#写真
![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/h/7/e/h7eG.jpg?t=1436170990)

#成果物
http://jsdo.it/ohisama1/h7eG
#写真
![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/z/x/5/zx5g.jpg?t=1490182487)

#成果物
http://jsdo.it/ohisama1/zx5g
Chainer で単回帰

### 概要

いま Chainer を学習中です。本来の Chainer の使い方ではないのですが、chainer.Link と chainer.Optimizer という一番基本的なクラスだけを用いて、ベタに単回帰を実装したらどうなるか？という実験を行いました（もちろん、実際に単回帰を行いたいときは別の方法でやったほうがいいです）。

### 単回帰

3点 $ (1, 1),  (2, 3), (3, 4) $ のなるべく近くを通る直線 $ y_p = wx + b $ を考え、その傾き $ w $ と 切片 $ b $ を求めることを考えます。

$i$ 番目の点を$(x^{(i)},y^{(i)})$と表すと、平均二乗誤差 $loss$

```math
loss = (1/3)  \sum_{i=1}^{3} ((wx^{(i)} + b) - y^{(i)})^2
```
が最小になるように $w$ と $b$ を定めることにします。

実際に別のツールで計算してみると、

```math
w = 1.5, b = -0.333333
```
となります。

![image](https://qiita-image-store.s3.amazonaws.com/0/26146/f537dd27-7376-9970-9fef-41f835a79409.png)

この計算を以下で Chainer を使ってやってみます。

### コード

```python
import numpy as np
import chainer

class SimpleRegression(chainer.Link):
    def __init__(self):
        super().__init__(
            w = (1),
            b = (1),
        )
        self.w.data = np.array([2], dtype = np.float32)
        self.b.data = np.array([0], dtype = np.float32)

    def __call__(self, x):
        return (self.w * x) + self.b

def lossfun(model, xs, ys):
    loss = 0
    for i in range(len(xs)):
        yp = model(xs[i])
        z = yp - ys[i]
        loss += z * z
    return loss / len(xs)

def main():
    xs = [1, 2, 3]
    ys = [1, 3, 4]
    model = SimpleRegression()
    optimizer = chainer.optimizers.SGD(lr = 0.1)
    optimizer.setup(model)
    for i in range(500):
        model.zerograds()
        print("=== Epoch %d ===" % (i + 1))
        print("model.w.data = %f" % model.w.data)
        print("model.w.grad = %f" % model.w.grad)
        print("model.b.data = %f" % model.b.data)
        print("model.b.grad = %f" % model.b.grad)
        loss = lossfun(model, xs, ys)
        print("loss = %f" % loss.data)
        print("")
        loss.backward()
        optimizer.update()

main()
```

# 実行結果
```
=== Epoch 1 ===
model.w.data = 2.000000
model.w.grad = 0.000000
model.b.data = 0.000000
model.b.grad = 0.000000
loss = 2.000000

=== Epoch 2 ===
model.w.data = 1.400000
model.w.grad = 0.000000
model.b.data = -0.266667
model.b.grad = 0.000000
loss = 0.080000

=== Epoch 3 ===
model.w.data = 1.466667
model.w.grad = 0.000000
model.b.data = -0.240000
model.b.grad = 0.000000
loss = 0.057007

...
=== Epoch 499 ===
model.w.data = 1.500000
model.w.grad = 0.000000
model.b.data = -0.333333
model.b.grad = 0.000000
loss = 0.055556

=== Epoch 500 ===
model.w.data = 1.500000
model.w.grad = 0.000000
model.b.data = -0.333333
model.b.grad = 0.000000
loss = 0.055556
```

$ w $(`model.w.data`) = 1.5, $b$(`model.b.data`) = - 0.333333 という解に収束しているのがわかります。

# 解説

`SimpleRegression` は、`chainer.Link` クラスのサブクラスで、$ y_p = wx + b $ というモデルを表現しています（仮説関数(hypothesis function))。それに対して、`lossfun` 関数が、このモデル（仮説関数）を使った場合の平均二乗誤差を計算しています。この関数の戻り値が `chainer.Variable` オブジェクトであることに注意してください。`loss.backward()` で、$w$ と $b$ の傾き(`model.w.grad` と `model.b.grad`) を計算し、`optimizer.update()` で $w$ と $b$ (`model.w.data` と `model.b.data`) を更新していきます。

# 参考文献
[Introduction to Chainer](http://docs.chainer.org/en/stable/tutorial/basic.html)
Node-REDのhttp出力ノードで"No response object"というエラーが表示される

# 状況
debugノードではmsg.payloadがきちんと出力されているのに、http出力ノードでは「No response object」というエラーになる。

# 原因
途中でfunctionノードでmsgオブジェクトを新しく作成した際に、msg.reqとmsg.resを引き継いでいなかった。

以下の記事にも書いてありました。
[node-redの覚書|JavaScript スニペット - littlewing](http://littlewing.hatenablog.com/entry/2016/02/24/163248)

> ドキュメントにも書いてあるのですが、 HTTPでレスポンスするためには、HTTP requestの.res .reqを引き回してあげないといけません。

はい、ドキュメントをちゃんと読みなさいということですね。

# 解決方法
msgオブジェクトを何らかの理由で新しく作成した場合には、msgの.reqと.resを引き継ぐ。

```js
var newMsg = {};
newMsg.req = msg.req;
newMsg.res = msg.res;

// なんかの処理

return newMsg;
```
終 エンジニアを辞めたい

# エンジニアを辞めたい。
大学を卒業して７年。
１年半はフリーター。
そこからネットワークエンジニア（CCNA取得）でSES１年少し。
業務委託と常駐、自社案件、
Java、PHP、Node.js、AWSとかサーバインフラを見て、
ゲーム運用の派遣に入って、契約打ち切り、
半年間の契約社員後は正社員になるはずだったが、
自社からも雇用止を言われた。

# 自社の案件
自社の案件を抱えながら常駐ってやっぱりしんどくない？
って思いながら、営業に納期の調整を依頼してから、一週間くらいが過ぎた時に、
ようやく納期の調整ができたと連絡が来て、
三連休を思い切りフル活用しなくてはと、思いながらひたすらソースコード書いてた。

# 誰かが見ている
ちょいちょい愚痴と弱音を吐かせてもらってた、エンジニアさん。
喫煙所で一緒になって仲良くなった、エンジニアさん。
好きな音楽の話で盛り上がって仲良くなった、エンジニアさん。
なんか、みんなにお世話になった。
どうしようってなりながら頭を抱えていたとき、phpで、SQLで、躓いてたところ。
「ちょっとログ見せて」
って、仕事の片手間だったり、帰り道の中だったり、休みの間だったり、たくさん助けてもらいました。
会ってないし、チャットワークとラインでプライベートで連絡をしてただけだったのに、
案件で悩んで、困ったを打ち明けたらみんなが助けてくれた。
すごい救われたし、多分誰かの助けがなかったらちゃんと納期に合わせてソースコードかけてなかったと思う。

## エンジニアの目線は十人十色
ある人は
シングルクオートとダブルクオート、バッククオートのSQLの間違え。
ある人は
php.iniの設定を。
ある人は
MySQLのログを。
ある人は
SQL文の空白を。
初心者的なところで私が躓いてても、みんなが優しく声をかけてくれた。
私の初歩的なミスはバカにされても仕方がないと思ってる。
でも、誰もバカにしたりしなくて、１つ１つ問題を解決してくれる度に喜んで嬉しくて泣いてた。

# 誰かの為
自社の案件を引き受けたのは営業さんのためだった。
私に頼みたいと言ってくれたから。
ただそれだけだった。
でも、納期に間に合うように書いたソースコードは営業さんのためだけじゃなくて、自分のためになったし、もっと言えば、私を救ってくれたエンジニアさんのためになった。
私の評価はどうなってもいい。
もう雇用止めって言われてるし、挽回なんてことは考えてなかった。
ただそんな私を支えてくれたエンジニアさんに恩返しがしたかった。

## そもそも私の中の開発って
誰かのためにやってるものだった。
自分が楽しむ事よりも、
あの人が困ってることを解決するために、私ができることをしよう、
それが一番だった。
ソースコード書いてて苦痛ではなかった。
辛かったのは頑張っても上がらない自分の評価と体力だけ。
三連休の最後の方は客観的思考を失ってて目の前真っ白だったけど。

# 有終の美
母の誕生日が過ぎていたことに母からの連絡で気がついた。
忘れることがなかった家族の大切な日だったのに。
母に謝ったら、有終の美を飾りなさいと言われた。
泣いた。

# エンジニアを辞めたい
やっぱり辞めたくない。
ソースコード書くのは楽しいし、
Zabbix監視は面白いし、
DBのリレーションを描いてるのも楽しいし、
システムが動いた時はガッツポーズして喜んでしまうし。

とりあえずちょっと気分転換にDJやって、MIDIマッピングのデータ作って、ボーカロイドのSDK触って、sublimeでV4のXML一括編集して遊んでみよう。

簡単に向いてないとか、辞めろとか、言えるような人間にはなりたくないと。
ふと思った。
idとclassの違い

<h2>id</h2>
  <p>同じid名は、１ページ中に１度しか使えない。
→固有の名前を割り当てる（特定のスタイルを指定したいときに使う。）</p>

<h2>class</h2>
<p>classは何度でも同じclass名を使ってもいい
→種別名を割り当てる（複数同じスタイルを指定するときに使う。）</p>

<h2>idとclassの使い分け</h2>
<p>・idは１ページに１度しか指定できないのでという特徴があるので、style sheetを読み解くときidを指定していると、とても簡単に探していたコードが見つけることができる。</p>

<p>・classばかり使ってしまうと、とてもコードが長くなり他の人が見てもわかりにくコードになってしまうので、idは一定の場所に指定するときに使い、小見出しや、文字、背景など、styleがまとめやすそうなものは、なるべくclassでまとめて指定する。</p>


<h2>まとめ</h2>
<p>・場所に依存した、classの付け方はせずある程度最初のうちに、被りそうなstyleまとめて、実際にコーディングに入る前に、自分のイメージを紙でも、なんでもいいのでワイヤーフレームを作って頭の中にあるものをアウトプットしておかないと後々面倒臭いことになることがわかった。</p>

<p>・みなさん是非他にも違いなど、使い方やテクニックなどがあればどんどん教えて欲しいです。
指摘などもどんどんお願いします。</p>
PHPMailer の `Content-Transfer-Encoding: 7bit`は省略される！？

PHPMailer でメール送信テストをしていて、無駄に悩んでしまった。。。

何回かテストしても、`Content-Transfer-Encoding: 7bit` が記述されないので、ソースを読んだところ、commentに
> RFC1341 part 5 says 7bit is assumed if not specified

なんてモノが＾＾；

これって、意図的に省略しましたってことですよね。
ちょっと気持ち悪いので、記述されるように変更してしまいました。

できるだけ、問題がないように `iso-2022-jp` なんて選択してるのに、こんなところで、冒険は出来ません。
まぁ、事実上問題ないんだろうけど。

あんまり記事としてみないけど、周知のことなんだろうか？
カレントにあるディレクトリを全部個別にzipで圧縮する

たまに必要になった時にいつも書き方忘れて困るのでメモ。
末尾のセミコロンのエスケープの仕方がLinuxやMacと違うので注意しましょう。

```.bat
find ./* -type d -exec zip -qr "{}.zip" "./{}" ";"
```

`zip`コマンド自体は`scoop`を使って入れてます。`scoop`はとても便利なのでみなさんぜひ使いましょう！
 
http://scoop.sh/
DartでElectronサンプル書いてみた

レンダラ側をDartで書いたElectronのサンプルコードです。
Polymer.dartのpaper-elementも使用しています。

## ElectronでもDartしたい

スタンドアローンなデスクトップアプリをWeb技術とDart言語で書きたいと思った場合、今まではChromeアプリを作成する方法があったのですが、ChromeOS以外では2018年中に起動すら不可(の予定)となりました。
このサンプルコードはElectronへの乗り換えのノウハウを書きとどめて置くためのものです。

コードやインストール方法は以下に置きましたので、ご覧ください。
https://github.com/takutaro/electron-with-dart-sample

## Polymer.dartも使えるよ

[本家Electronのチュートリアル](https://electron.atom.io/docs/tutorial/quick-start/)をベースに、以下の様な簡単なアプリを作成します。

* Polymerのpaper-inputを使用した入力欄にテキストを打つと、一番下の「typed:」に入力内容が連動して表示されます。
* CLEARボタンをクリックすると、入力内容が消去されます。
* ついでに、Node.js等のバージョンが表示されます（本家チュートリアル同様）。

![ss.png](https://qiita-image-store.s3.amazonaws.com/0/34690/6c755894-32d4-321c-2e33-1f8646d7df70.png)

## ElectronでDartするには？

本家チュートリアルではmainとなるJSから静的なhtmlファイルをロードしますが、Dartでの開発中はpub serve接続に切り替えられる様にしました。

```js:main.js
  (中略)
  arg
    .option('--pubserve', 'connect to http://localhost:8080 (for development)')
    .parse(process.argv);
  mainWindow = new BrowserWindow({width: 800, height: 600})
  mainWindow.loadURL(url.format({
    protocol: arg.pubserve ? 'http:':         'file:',
    pathname: arg.pubserve ? 'localhost:8080': path.join(__dirname, 'index.html'),
    slashes: true
  }))
  (以下略)
```

まず、最上位ディレクトリ（pubspec.yamlのある場所）でpub serve起動します。

```bash
$ cd electron-with-dart-sample
$ pub serve
Loading source assets...
Loading polymer transformers...
Serving electron_with_dart web on http://localhost:8080
Build completed successfully
```

次に別ターミナルで、webディレクトリに移動後、Electronアプリを「pubserve」指定で起動します。

```bash
$ cd electron-with-dart-sample
$ cd web
$ npm run-script pubserve

> electron-with-dart@1.0.0 pubserve /home/taku/workspace/electron-with-dart-sample/web
> electron . --pubserve
```

pub serveはコード修正(ファイルセーブ)に追随してほぼリアルタイムにトランスパイルしてくれるので、ElectronアプリはCtrl+Rでのリロードのみで動作確認が出来ます（自動リロードされるともっと良いのですが）。

## 補足

本サンプルでは、レンダラ側のみをDartで書きました。新しい事は特に無いです。
メインプロセスとの通信は必要になったら考えます。
SSHとは

####※コメントで指摘頂いているように、「公開鍵を使った認証方式」の説明が間違っている可能性があります。参考にされるときはその点を注意お願いします。
<br>
<br>

sshを使ってみたのですが、仕組みがいまいちわかっていなかったのでまとめます。

##SSHとは何か
SSHとは、セキュアな通信を行うためのプロトコル。
「OpenSSH」は、このSSHのプロトコルを実現するための有名なソフトウェア。
SSHを使うと安全にサーバーにログインしたり、ファイルを送ったりできる。




以下[かせいさんとこ](http://d.hatena.ne.jp/kasei_san/20120329/p1)さんの説明がとても、分かりやすかったので引用させていただきました。

以下引用
""
##暗号化の方法

共通鍵暗号
送信者と受信者が共通の秘密鍵を持って、暗号化と複合を行う
たとえばこんな感じ


平文 : 1234
秘密鍵 : 5678
暗号化 : 1234 x 5678
暗号文 : 7006652
復号化 : 7006652 / 5678


送信者側は、平文を、秘密鍵で暗号化して、暗号文を受信者に送る
受信者は、暗号文を、秘密鍵で復号化して、平文を得る

##公開鍵暗号
公開鍵暗号

公開鍵と、秘密鍵の2つを用意
暗号化には、公開鍵を使って復号には、秘密鍵を使う
公開鍵は暗号化するだけで、復号化できないので、知らない人に渡っても通信の内容がバレることは無い

現在の主流
上記の条件を満たす秘密鍵、公開鍵の作り方はややこしかったので飛ばす、とりあえず、そういうものを使って暗号化していると理解。


##SSHの仕組み
公開鍵を使った認証方式

1.クライアントは、秘密鍵(復号用)と、公開鍵(暗号化用)を用意する
2.クライアントは、サーバに公開鍵(暗号化用)を渡す
3.サーバで、公開鍵とユーザを結びつける
4.サーバは、クライアントがログインしてきたら、乱数を生成して公開鍵で暗号化して渡す
5.クライアントは、乱数を復号してハッシュ値をサーバに渡する
6.サーバは、クライアントから来たハッシュ値と、自前のハッシュ値を比較して一致したら認証する

""

参考サイト
http://d.hatena.ne.jp/kasei_san/20120329/p1
http://nigohiroki.hatenablog.com/entry/2013/08/18/221434
http://qiita.com/kenju/items/b09199c4b3e7203a2867
SlackのIncoming Webhooksで投稿したURLが展開されなくて困った話

## TL;DR

`"unfurl_links": true` を payload に指定して、送信。

### サンプル

```json
{
    "text": "https://slack.com/",
    "unfurl_links": true
}
```


## 困った話

SlackでURLを投稿すると、リンクのサマリーが展開されると思うんですが、Incoming WebhooksからURLを投稿すると、展開されずに困っていました。

### ユーザが投稿したとき
![スクリーンショット 2017-03-22 18.51.18.png](https://qiita-image-store.s3.amazonaws.com/0/2690/557e7b05-2e88-645a-f4ee-4427737b4475.png)

### Incoming Webhooksから投稿したとき
![スクリーンショット 2017-03-22 18.55.15.png](https://qiita-image-store.s3.amazonaws.com/0/2690/a0adc76f-3b2b-5719-a2e3-060003ea6b7c.png)


## 解決した話

Slack Web APIの `chat.postMessage` と同じオプションが使えました。
Incoming Webhooksのマニュアルには書いてないですが、使えるオプションがあるようです。

参照：[chat.postMessage method | Slack](https://api.slack.com/methods/chat.postMessage)


## どうでもいい話

上記で紹介したSlackbotは、以下でソースコードを公開しています。
https://github.com/foooomio/slackbot
「case x::xs =>」でなぜリストがマッチできるのか（infix-operation-patterns）

Scalaのパターンマッチでは

~~~ sample.scala
val list = List(1,2,3)

list match {
  case x::xs => println(s"the head element is ${x}") 
  case _ => println("no elements exist")
}
~~~

みたいなことができる。
Scala始めた時に「こんな書き方できるよ！」と覚えて以降、便利でいつも使っているのだが、どういう仕組みでマッチできているのかよくわかんなかったのでググったがあまり出てこなくて調べるのが大変だったのでまとめておく。

# （自分用の短い）結論
自分の知りたかったところ（知らなかったところ）だけまとめておくと、
`case x :: xs` => のときの `::` は `def ::(x: A): List[A]` では*なく*、`case class ::[B](head: B, tl: List[B])`というのが定義されていて、その`:: (x,xs)`を呼び出す糖衣構文であった。
infix-operation-patternsというパターンマッチの構文で、
http://www.scala-lang.org/files/archive/spec/2.12/08-pattern-matching.html#infix-operation-patterns
case文の中で抽出子やコンストラクタのオブジェクト/クラス名の前に第一引数を持ってこれる、というものだった。

# 段階的な説明

~~~ 値マッチ.scala
val result = 5-4
result match {
  case 1 => println("one")
  case _ => println("other")
} // -> one
~~~
というように、 `a match { case b => c}`で、aの値がbと等しいとき、cを実行する（cの値を返す）ということができる。
case以下には柔軟な記法で色々なマッチができて、
http://qiita.com/techno-tanoC/items/3dd3ed63d161c53f2d89#patterns
こちらの記事などに一覧がある。
caseで指定されるのが、unapply(かunapplySeq)というメソッドがが定義されたオブジェクトであれば、unapplyの返り値でマッチできる。返り値がSome(かtrue)であればマッチしたこととなる。
http://qiita.com/techno-tanoC/items/3dd3ed63d161c53f2d89#unapply

~~~ object.scala
object AAA{
  def unapply(aaa:AAA) = Some("bbb","ccc","ddd")
}
val hoge = ???
hoge match{
  case AAA(x,y,z) => println(s"x=${x}, y=${y}, z=${z}")
  case _ => println("does not match")
} // => x=bbb, y=ccc, z=ddd
~~~

のような形で `case オブジェクト名(変数名)`のようにしておくとunapplyの返り値を変数に束縛してくれる。
scalaのcase classを定義すると自動的にunapplyメソッドが定義されたコンパニオンオブジェクトが定義されるので、

~~~ caseclass.scala
case class CC(x:String,y:Int)
val hoge = CC("Hello","3")
hoge match{
  case CC(x,y) => println(s"x=${x}, y=${y}")
  case _ => println("does not match")
} // => x=bbb, y=3
~~~

などとできる。

ScalaのListには子case classとして`case class ::[B](head: B, tl: List[B])`というのがいて、
https://www.scala-lang.org/api/current/scala/collection/immutable/$colon$colon.html

~~~ coloncolon.scala
val hoge = List(1,2,3)
hoge match{
  case ::(x,xs) => ???
  case _ => ???
}
~~~

とすれば、xに先頭の要素、xsに残りのリストがバインディングされ束縛される。

さらにcaseの中ではinfix-operation-patternsという糖衣構文があって、
http://www.scala-lang.org/files/archive/spec/2.12/08-pattern-matching.html#infix-operation-patterns
`op(p,q)`を`p op q` のように記述できる。すると

~~~ infix.scala
val hoge = List(1,2,3)
hoge match{
  case x :: xs => ???
  case _ => ???
}
~~~

こういった書き方が可能となる。

# 感想
私が無知なだけなのですが、こういう infix-operation-patterns とかの仕組みって、どの学習方法で勉強したら身に付けられたんでしょう。Webベースでなくちゃんと書籍とかで勉強したらどこかで勉強できたんですかね…
あるいはScala道を進むには言語仕様くらいちゃんと読まないとだめなのでしょうか…Scalaってこわい
nasa space apps challenge その6

#概要
nasa space apps challenge に行けないので、勝手にハッカソンしてみる。
GPS衛星の軌道をcesiumとgooglemapとleafletでプロットしてみた。
#写真
![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/Y/j/h/Yjhv.jpg?t=1490177747)


#成果物
http://jsdo.it/ohisama1/Yjhv

#写真
![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/4/D/o/4Doi.jpg?t=1490078663)

#成果物
http://jsdo.it/ohisama1/4Doi

#写真
![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/W/0/f/W0fG.jpg?t=1490169883)

#成果物
http://jsdo.it/ohisama1/W0fG
Node-REDで日本語を含むURLをエンコードする

備忘録です。

# 背景
Node-REDで「http request」ノードで日本語を含むURLを利用する場合、URLエンコードする必要があったのだけどやり方がわからなくて小一時間ハマったのでメモ。

# ハマった考え方
Node-REDでnpmのパッケージってどうしたら使えるんだろう。

# 解決方法
こちらの記事に書いてありました。
[Bluemix Node-REDを使ってWatson APIを呼び出す - Qiita](http://qiita.com/VegaSato/items/7ce47e6a9c06c290b212)

> 質問文が日本語(全角)の場合、URIエンコードを行わないと正しく送信できない。そのため、msg.urlはencodeURI関数を使ってエンコードを行う。

なので、functionノードで以下のようにエンコードすればOK。

```js
msg.url = encodeURI("your-url")
```
六角形ボタンの作り方

画像のような六角形のボタンを二つの異なるCSS実装で作ってみました。
<img width="450" alt="スクリーンショット 2017-03-22 19.15.47.png" src="https://qiita-image-store.s3.amazonaws.com/0/119598/843d50fa-a2a8-ea56-3a01-b781d9d90967.png">

## 1. :before, :after疑似要素にborderで描画する方法
:before, :after疑似要素にborderプロパティで三角形を作り、長方形にくっつける。

- メリット: 自由に六角形の角度を変えられる
- デメリット: (ホバー時など)白抜きできない

### コード
```html:index.html
<a class="button-hex">button-hex1</a>
```
```css:style.css
.button-hex {
    font-size: 14px;
    line-height: 40px;
    position: relative;
    display: inline-block;
    width: 150px;
    height: 42px;
    transition: all .1s ease-in-out;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background-color: red;
}
.button-hex:before,
.button-hex:after {
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    content: '';
    border: 21px solid transparent;
    border-right: 12px solid transparent;
    border-left: 12px solid transparent;
}
.button-hex:before {
    right: 100%;
    border-right-color: red;
}
.button-hex:after {
    left: 100%;
    border-left-color: red;
}
.button-hex:hover {
    opacity: .7;
}
```
## 2. :before, :after疑似要素にbackground-colorで描画する方法
:before, :after疑似要素にbackground-colorプロパティで正方形を作り、45°回転させて長方形にくっつける。

- メリット: (ホバー時など)白抜きができる
- デメリット: 角度は固定、z-indexの調整が必要。

### コード
```html:index.html
<a class="button-hex2">button-hex2</a>
```
```css:style.css
.button-hex2 {
    font-size: 14px;
    line-height: 38px;
    position: relative;
    z-index: 1;
    display: block;
    width: 150px;
    height: 38px;
    transition: .1s ease-in-out;
    text-align: center;
    text-decoration: none;
    color: #fff;
    border-top: 2px solid red;
    border-bottom: 2px solid red;
    background-color: red;
}
.button-hex2:before,
.button-hex2:after {
    position: absolute;
    top: 4px;
    width: 28px;
    height: 28px;
    content: '';
    transition: .1s ease-in-out;
    transform: perspective(12px);
    transform: rotate(45deg);
    border: 0;
    background-color: red;
}
.button-hex2:before {
    left: -16px;
    border-bottom: 2px solid red;
    border-left: 2px solid red;
}
.button-hex2:after {
    right: -16px;
    border-top: 2px solid red;
    border-right: 2px solid red;
}
.button-hex2:hover:before,
.button-hex2:hover:after {
    background-color: #fff;
}
.button-hex2:hover {
    color: red;
    background-color: #fff;
}
```
## サンプル
https://jsfiddle.net/ktbcoyxf/
yarn run が便利

みなさん、 [Yarn](https://yarnpkg.com/) 使ってますか。

`yarn <subcommand>` はほぼ `npm <subcommand>` と互換性があり、そうでない（使い方が違う）コマンドについてはチートシート記事があったりするのですが、

- [NPM vs Yarn Cheat Sheet](https://shift.infinite.red/npm-vs-yarn-cheat-sheet-8755b092e5cc#.d3r47faao)

あえて `yarn run` は `npm run` とは違うぞと申し上げたい。というのも

> `[script]` can also be any locally installed executable that is inside `node_modules/.bin/`.

- [yarn run | Yarn](https://yarnpkg.com/lang/en/docs/cli/run/)

だからです。つまり、

```shell-session
$ yarn run webpack
```

を実行すると

```shell-session
$ node_modules/.bin/webpack
```

を実行するのと同じ、または

```json:package.json
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "webpack": "webpack"
  },
```

のような冗長な項目を足した上で

```shell-session
$ npm run webpack
```

を実行するのと同じ効果がある。

これっていいよね。 Bundler とか Composer 的。
備忘録 Apacheのポートを変えたらつながらなくなったでござる。

調子にのって、Apacheのポート番号を変えてみたらつながらなくなりました。。。。。

### /etc/httpd/conf/httpd.confファイルを編集

80 portから 11080 portに変更

```ruby:httpd.confの編集箇所
Listen 192.168.56.106:11080
ServerName 192.168.56.106:11080
```

ssコマンドでみると、11080がListenされているから、接続できる！と勘違いしがち。

```ruby:
# ss -nat
State      Recv-Q Send-Q              Local Address:Port                             Peer Address:Port
LISTEN     0      128                192.168.56.106:11080                                       *:*
LISTEN     0      128                             *:22                                          *:*
LISTEN     0      100                     127.0.0.1:25                                          *:*
ESTAB      0      0                  192.168.56.106:22                               192.168.56.1:50242
ESTAB      0      64                 192.168.56.106:22                               192.168.56.1:64639
LISTEN     0      128                            :::22                                         :::*
LISTEN     0      100                           ::1:25                                         :::*
```

### firewalldコマンドで11080 portを許可する。

これが必要なのでした。。。。

なぜなら、

```ruby:
# firewall-cmd --list-all
public (default, active)
  interfaces: enp0s3 enp0s8
  sources:
  services: dhcpv6-client http ssh
  ports:　　　　　
  masquerade: no
  forward-ports:
  icmp-blocks:
  rich rules:
```

許可されている http は 80 portとのこと（/etc/services参照）。

なので、11080 portでアクセスしたいのなら、このportを追加してやらねばなりませぬ。

 [備忘録 CentOS 7　firewalld](http://qiita.com/brighton0725/items/0c1578e068c22e40f990)では、

  --add-services=http

で httpを許可しましたが、今回は、 

  --add-port=ポート番号/プロトコル

で設定がいりました。

```ruby:
# firewall-cmd --permanent --add-port=11080/tcp
success
```

設定を反映。

```ruby:
# firewall-cmd --reload
success
```

### Webブラウザでアクセス

アクセス成功！

![2017032103.JPG](https://qiita-image-store.s3.amazonaws.com/0/170871/b4a1adc3-7ae2-2634-df1c-7ed7c4560cc2.jpeg)



firewalldを OFF　してしまえばいいのでしょうが、折角なので firewalldと仲良くなっていきたいと思います。
Ruby on Rails5をvagrantに構築	


## vagrant boxを登録
今回はcentos7に環境を作るため以下コマンドにてvagrant boxを登録

```bash
$ vagrant box add CentOS7 https://github.com/tommy-muehle/puppet-vagrant-boxes/releases/download/1.1.0/centos-7.0-x86_64.box
```


## ポートフォワーディング設定
Railsの組込サーバを使用する場合3000番ポートを使用するため
Vagrantfileを変更

Vagrantfileの25行目付近のconfig.vm.networを修正

```Vagrantfile
Vagrant.configure(VAGRANTFILE_API_VERSION) do |config|
  # ...

  # config.vm.network "forwarded_port", guest: 80, host: 8080
  config.vm.network :"forwarded_port", guest: 3000, host: 3000

  # ...
end

```

## Vagrant起動
上記設定が終われば以下コマンドでvagrantを起動
時間は結構かかります

```bash
$ vagrant up

```

## firewallを止める
色々と問題が起こるのでデフォルトのfirewallを止める

vagrant sshでvagrantの中に入る

```bash
$ vagrant ssh
```


vagrantのcentos上で以下を実行

```bash
$ sudo systemctl stop firewalld
$ sudo systemctl disable firewalld

```

## gitをインストール(vagrant上)
```bash
$ sudo yum -y install git
```

## rbenvインストール(vagrant上)
rubyのバージョン管理ツールであるrbenvをインストール

```bash
$ git clone https://github.com/rbenv/rbenv.git ~/.rbenv
$ echo 'export PATH="$HOME/.rbenv/bin:$PATH"' &gt;&gt; ~/.bash_profile
$ echo 'eval "$(rbenv init -)"' &gt;&gt; ~/.bash_profile
$ git clone https://github.com/rbenv/ruby-build.git ~/.rbenv/plugins/ruby-build
```

## rubyのインストール(vagrant上)
```bash
$ rbenv install -l
```
でrubyのインストール可能なバージョンを取得

今回はv2.3.1を使用するので

```bash
$ rbenv install 2.3.1
```
でv2.3.1をインストールし

```bash
$ rbenv golobal 2.3.1
```
でrubyのバージョンを指定

## nodeインストール(vagrant上)
後ほど必要になるのでnodeのバージョン管理ツールである
nodebrewからnode.jsをインストール
### nodebrewインストール
```bash
$ curl -L git.io/nodebrew | perl - setup
```
### 環境変数の設定
.bash_profileに以下を追加

```bash
$ vi ~/.bash_profile
```

```.bash_profile
export PATH=$HOME/.nodebrew/current/bin:$PATH
```

### bashを再起動
```bash
$ source ~/.bash_profile
```
### nodebrewインストール確認
以下コマンドを実行しhelpの内容が表示さればnodebrewはインストール完了

```bash
$ nodebrew help
```

##Node.jsインストール
install-binaryでnodeの安定板をインストール

```bash
$ nodebrew install-binary stable
```

インストールしたNode.jsのバージョン確認

```bash
$ nodebrew list
```

先ほどインストールした安定版を指定

```bash
$ nodebrew use stable
```

Node.jsのバージョンを確認し表示されれればインストール完了

```bash
$ node -v
```

## Railsをインストール
``` bash
$ rbenv exec gem install rails
```

以下コマンドでRailsのバージョンが表示されれば無事インストール完了

``` bash
$ rbenv exec rails -v
```
オフラインリアルタイムどう書く F03 の ruby と C による実装例



問題 : http://nabetani.sakura.ne.jp/hena/ordf03triom/
実装リンク集 : http://qiita.com/Nabetani/items/becb4c4d309b4fe8ce0f

平行移動だけを正規化すればいいので、簡単。

まずは ruby

```ruby
class Array
  def x; self[0]; end
  def y; self[1]; end
end

def solve( src )
  poss0 = src.chars.uniq.map{ |x| (x.ord - ?a.ord).divmod(5) }.sort
  return "-" unless poss0.size==3
  poss = poss0.map{ |p| [p.x-poss0[0].x, p.y-poss0[0].y] }.join(",")
  case poss
  when "0,0,0,1,0,2"; "B"
  when "0,0,0,1,1,1"; "T"
  when "0,0,1,0,1,1"; "L"
  when "0,0,0,1,1,0"; "R"
  when "0,0,1,0,2,0"; "I"
  when "0,0,1,-1,1,0"; "J"
  else "-"
  end
end

if $0==__FILE__
  DATA.each do |line|
    num, src, expected = line.split(/\s+/)
    actual = solve( src )
    ok = actual==expected
    p [ ok ? "ok" : "**NG**", num, src, expected, actual ]
  end
end

__END__
0 cba B
1 yam -
2 aaa -
```

そして C

```C:C99
//clang -std=c99 -Wall
#include <stdlib.h>
#include <stdio.h>
#include <string.h>

int xval( char c ){  return (c-'a') % 5;}
int yval( char c ){  return (c-'a') / 5;}
int min( int a, int b ){  return a<b ? a : b; }

char solve( char const * src )
{
  int xmin=9;
  int ymin=9;
  for( int i=0 ; i<3 ; ++i ){
    xmin = min(xmin, xval(src[i]));
    ymin = min(ymin, yval(src[i]));
  }
  int bits=0;
  for( int i=0 ; i<3 ; ++i ){
    bits |= 1<<(xval(src[i])-xmin + (yval(src[i])-ymin)*5 );
  }
  switch(bits){
    default:
      return '-';
    case 0x7:   return 'B';
    case 0x23:  return 'R';
    case 0x43 : return 'T';
    case 0x61:  return 'L';
    case 0x62:  return 'J';
    case 0x421: return 'I';
  }
}

void test( char const * src, char const * expected )
{
  char actual = solve( src );
  _Bool ok = actual == *expected;
  printf( "%s : %s / %s / %c\n", (ok  ? "ok" : "**NG**"), src, expected, actual );
}

int main()
{
  /*0*/ test( "cba", "B" );    
  /*1*/ test( "yam", "-" );    
  /*2*/ test( "aaa", "-" );    
  /*3*/ test( "def", "-" );    
  return 0;
}

```

ruby は、sort してあとは適当に。
C だと sort はめんどくさいので、ビットで集合を表現。

`min` という関数を作ってしまったので、visual studio だと NOMINMAX が必要か。

簡単でしょ？

次回は E13( https://yhpg.doorkeeper.jp/events/58541 )。また出題します。これよりは難しくします。
yarn global 便利じゃん

yarn globalの存在に最近気づいた。
`yarn global bin`叩いたら、binのpathが出る模様。
いろいろ便利そうだったので、`npm -g`で管理されてるものをyarnに切り替えました。

```
% yarn global bin
/usr/local/Cellar/node/7.7.3/bin
```


## zshenv設定

```zsh:.zshenv
path=(
  $(yarn global bin)(N-/)
  "$HOME/.config/yarn/global/node_modules/.bin"(N-/)
  $path
)
```
 
## yarn globalでインストール
`% yarn global add ava csslint prettier stylus`


## インストール確認
いるね。OKだね。

```
% exec zsh
% which prettier
/usr/local/Cellar/node/7.7.3/bin/prettier
```

## yarn globalで入れたもの確認
`npm -g ls` よりみやすいね。

```bash
% yarn global ls
yarn global v0.21.3
warning No license field
info "ava@0.18.2" has binaries:
   - ava
info "babel@6.23.0" has binaries:
   - babel
   - babel-node
   - babel-external-helpers
info "brfs@1.4.3" has binaries:
   - brfs
info "coffee-script@1.12.4" has binaries:
   - coffee
   - cake
info "coffeelint@1.16.0" has binaries:
   - coffeelint
info "csslint@1.0.5" has binaries:
   - csslint
info "emojipacks@0.1.1" has binaries:
   - emojipacks
info "eslint@3.18.0" has binaries:
   - eslint
info "firebase-tools@3.5.0" has binaries:
   - firebase
略
✨  Done in 5.67s.
```
オフラインリアルタイムどう書くF03の問題をrubyで解く

``` rb
def solve(q)
  x,y,z = q.split('').map{|e| e.ord - 97}.sort
  return 'J' if (x+4 == y && x+5 == z && y/5 == z/5)
  return 'L' if (x+5 == y && x+6 == z && y/5 == z/5)
  return 'T' if (x+1 == y && x+6 == z && x/5 == y/5)
  return 'R' if (x+1 == y && x+5 == z && x/5 == y/5)
  return 'I' if (x+5 == y && x+10 == z && x%5 == y%5 && x%5 == z%5)
  return 'B' if (x+1 == y && x+2 == z && x/5 == y/5 && x/5 == z/5)
  '-'
end

DATA.readlines.each do |line|
  no,q,a,_ = line.strip.split(/\s+/)
  ans = solve(q)
  print no + "\t" + ans
  puts ans == a ? ' o' : ' x'
end
__END__
0	cba	B	
1	yam	-	
2	aaa	-	
3	def	-	
4	gga	-	
5	bbf	-	
6	gmh	T	
7	mhn	L	
8	dea	-	
9	mrn	R	
10	hcm	I	
11	mno	B	
12	snr	J	
13	xnn	-	
14	nnl	-	
15	kop	-	
16	ejd	T	
17	txy	J	
18	pvu	L	
19	baf	R	
20	hhc	-	
21	ono	-	
22	wxv	B	
23	bdc	B	
24	ojt	I	
25	fkp	I	
```
オフラインリアルタイムどう書くF03の回答

参加して解きました。

開始点を揃えてパターンを見つけています。

```ruby:f03.rb
def solve( input )
  block = input.chars.map { |c|
    (c.ord - 'a'.ord).tap { |offset|
      break [ offset % 5, offset / 5, ]
    }
  }.sort

  start = block.transpose.map { |a|
    a.min
  }

  form = block.map { |b|
    b.zip(start).map { |a|
      a[0] - a[1]
    }
  }

  {
    [ [0,1,], [1,0,], [1,1,], ] => 'J',
    [ [0,0,], [0,1,], [1,1,], ] => 'L',
    [ [0,0,], [1,0,], [1,1,], ] => 'T',
    [ [0,0,], [0,1,], [1,0,], ] => 'R',
    [ [0,0,], [0,1,], [0,2,], ] => 'I',
    [ [0,0,], [1,0,], [2,0,], ] => 'B',
  }[form] || '-'
end

def test( input, answer )
  result = solve( input )
  if result != answer
    puts 'NG: input = %s, answer = %s, result = %s' % [ input, answer, result, ]
    exit(1)
  else
    puts 'OK'
  end
end

test( "cba", "B" )
test( "yam", "-" )
test( "aaa", "-" )
test( "def", "-" )
test( "gga", "-" )
test( "bbf", "-" )
test( "gmh", "T" )
test( "mhn", "L" )
test( "dea", "-" )
test( "mrn", "R" )
test( "hcm", "I" )
test( "mno", "B" )
test( "snr", "J" )
test( "xnn", "-" )
test( "nnl", "-" )
test( "kop", "-" )
test( "ejd", "T" )
test( "txy", "J" )
test( "pvu", "L" )
test( "baf", "R" )
test( "hhc", "-" )
test( "ono", "-" )
test( "wxv", "B" )
test( "bdc", "B" )
test( "ojt", "I" )
test( "fkp", "I" )
```
トリオミノの分類


```rb:tyama_henaf03.rb
#!/usr/bin/env ruby
#18:16-18:26
#http://nabetani.sakura.ne.jp/hena/ordf03triom/
#http://qiita.com/Nabetani/items/becb4c4d309b4fe8ce0f
W=5
while gets
	h={}
	$_.chomp.bytes.each{|e|e-=97;h[[e/W,e%W]]=1}
	5.times{|y|5.times{|x|
		if h.has_key?([y,x]) #一番上の中で一番左
			if h.has_key?([y+1,x-1])&&h.has_key?([y+1,x])
				puts :J
			elsif h.has_key?([y+1,x])&&h.has_key?([y+1,x+1])
				puts :L
			elsif h.has_key?([y,x+1])&&h.has_key?([y+1,x+1])
				puts :T
			elsif h.has_key?([y,x+1])&&h.has_key?([y+1,x])
				puts :R
			elsif h.has_key?([y+1,x])&&h.has_key?([y+2,x])
				puts :I
			elsif h.has_key?([y,x+1])&&h.has_key?([y,x+2])
				puts :B
			else
				puts :-
			end
			break
		end
	}||break}
	STDOUT.flush
end
```
グローバルIPアドレスを取得して、vagrant + virtualboxでWEBサーバー公開まで・・・

# やりたいこと
vagrant + virtualboxでグローバルIPアドレス（ドメイン）にて、外部から接続すること。

# 手順
- GMOプロバイダーで固定IPプランの契約
- ルーターpppoeの設定

### お名前.comでの設定 
- DNSレコード設定<BR>
DNSレコードとは、ドメインとIPアドレスの紐付けみたいなもの。

```
ホスト名：kiroku.jp
TYPE：A
TTL：3600
VALUE：グローバルIP指定
```
- セカンダリDNS(Slave）とDNSレコードを設定<BR>セカンダリDNS(Slave）とは、セカンダリネームサーバーをプライマリーのコピーで補う設定

```
プライマリネームサーバ IPアドレス：グローバルIP指定
```


- ネームサーバー名としてのホストを設定する

```
ホスト名：www.kiroku.jp
IPv4：グローバルIP指定
```

- ネームサーバーの変更

```
プライマリネームサーバー： www.kiroku.jp
セカンダリネームサーバー ：2nd.dnsv.jp
3：01.dnsv.jp
4：02.dnsv.jp
5：03.dnsv.jp
6：04.dnsv.jp
```

# vagrantfilesの編集

```
config.vm.network "public_network"
```

を指定するとkiroku.jpでホストからアクセスはできるが外部では出来ない！
この段階で同じネットワークだとipアドレス指定だとスマホでもいける！

```
config.vm.network "forwarded_port", guest: 80, host: 80
```

ポート開放設定

```
Internet側IPアドレス：ポート80を開放
LAN側IPアドレス：ホストのプライベートIPアドレス
```

これで、
http://kiroku.jp にアクセス可能になった。
備忘録 CentOS 7　firewalld

去年もCentOSやRedHat7を使っていましたが、firewalldがよくわからなく、firewalldを無効にしてiptablesをインストール・設定してつかってました。

今年は、そんなことは言ってられないので、firewalldにチャレンジ。

# firewalldの設定

### Webブラウザからアクセス

まずは、Apacheを導入後、/var/www/html/index.htmlファイルを作成してアクセスしていみます。


![2017032101.JPG](https://qiita-image-store.s3.amazonaws.com/0/170871/0740577f-8973-66da-7420-37fd918e3e13.jpeg)

タイムアウトを起こしました。

### ポートの確認
以前はnetstatコマンドで確認していましたが、CentOS 7はssコマンドを使用して確認します。

```ruby:
# ss -nat
State      Recv-Q Send-Q              Local Address:Port                             Peer Address:Port
LISTEN     0      128                             *:22                                          *:*
LISTEN     0      100                     127.0.0.1:25                                          *:*
ESTAB      0      0                  192.168.56.106:22                               192.168.56.1:50242
ESTAB      0      64                 192.168.56.106:22                               192.168.56.1:64639
LISTEN     0      128                            :::80                                         :::*
LISTEN     0      128                            :::22                                         :::*
LISTEN     0      100                           ::1:25                                         :::*

```

80 portがListenされていることがわかります。

### firewalldの確認

次に、firewalldを確認してみます。

```ruby:
# systemctl status firewalld
● firewalld.service - firewalld - dynamic firewall daemon
   Loaded: loaded (/usr/lib/systemd/system/firewalld.service; enabled; vendor preset: enabled)
   Active: active (running) since 水 2017-03-22 16:43:08 JST; 39min ago
 Main PID: 22589 (firewalld)
   CGroup: /system.slice/firewalld.service
           └─22589 /usr/bin/python -Es /usr/sbin/firewalld --nofork --nopid

 3月 22 16:43:07 brighton005 systemd[1]: Starting firewalld - dynamic firewall daemon...
 3月 22 16:43:08 brighton005 systemd[1]: Started firewalld - dynamic firewall daemon.
```

runningとなっているため、firewalldは起動しています。



### firewalldが許可しているサービスを確認する

現在、有効な機能とゾーンを確認してみます。


```ruby:
# firewall-cmd --list-all
public (default, active)
  interfaces: enp0s3 enp0s8
  sources:
  services: dhcpv6-client ssh
  ports:
  masquerade: no
  forward-ports:
  icmp-blocks:
  rich rules:

```

または、以下のコマンドでも確認できます。

```ruby:
# firewall-cmd --list-service --zone=public
dhcpv6-client ssh
```
httpの機能がオープンされていないことがわかります。

### httpを許可する

httpのポートを永続的に許可します。

```ruby:
# firewall-cmd --permanent --add-service=http
success
```

設定内容を反映させます。

```ruby:
# firewall-cmd --reload
success
```

反映されたことを確認します。

```ruby:
# firewall-cmd --list-all
public (default, active)
  interfaces: enp0s3 enp0s8
  sources:
  services: dhcpv6-client http ssh
  ports:
  masquerade: no
  forward-ports:
  icmp-blocks:
  rich rules:
```
httpが追加されたことがわかります。

### Webブラウザから確認

Webブラウザからアクセスできることを確認します。

![2017032102.JPG](https://qiita-image-store.s3.amazonaws.com/0/170871/651eacc1-ecd3-cec7-171d-1e4ad410cedc.jpeg)


[参考：CentOS7のfirewalldでネットワークゾーンにhttpとhttpsの許可、sshで特定のポート、IPアドレスを許可する設定](https://www.imd-net.com/column/13339/)
オフラインリアルタイムどう書くF03の問題


オフラインでリアルタイムに「どう書く」をやるイベント( https://yhpg.doorkeeper.jp/events/58204 )を行っています。

問題は「トリオミノの分類」という名前で、詳細は
http://nabetani.sakura.ne.jp/hena/ordf03triom/
です。

出題者の気分としては、問題を読み始めてから解けるまで30分あればなんとかなると思ってますが、ひとそれぞれで。

実装ができた方はこちらのコメント欄からリンクを張っていただくと見つけやすくて助かります。

似たような問題をもっと解きたいという方は、https://nabetani.hatenadiary.com/entry/yhpg_list
に過去問リンク集がありますので、そちらをご覧になると良いと思います。
Sublime Text 3 > UniqueなSymbolを探す > Ctrl+Shift+R / キーワード入力

```txt:動作環境
Windows 7 Pro (32bit)
Sublime Text 3 Build 3126 
```

参考 [Sublime Text 2と3は何が大きく違うんですか？](https://ja.stackoverflow.com/questions/331/sublime-text-2%E3%81%A83%E3%81%AF%E4%BD%95%E3%81%8C%E5%A4%A7%E3%81%8D%E3%81%8F%E9%81%95%E3%81%86%E3%82%93%E3%81%A7%E3%81%99%E3%81%8B/2111#2111)

> Hiroshi Yamamotoさんの回答
> Goto Symbol in Project [Ctrl+Shift+'R']

試してみました。

![2017-03-22_17h33_55.png](https://qiita-image-store.s3.amazonaws.com/0/32870/48316585-e825-d852-dc14-cc2efa8fbb01.png)
(左の丸数字はツールで追加)。

Sublime Text 3はShiftJISの文字化けでトラぶっていて、使用は控えていましたが、Symbolを検索できるのは便利ですね。

関連 https://forum.sublimetext.com/t/find-symbol-in-any-file-in-project/8549

しかしながら、ShiftJIS関連で文字化けがやはり発生する。
nasa space apps challenge その5

#概要
nasa space apps challenge に行けないので、勝手にハッカソンしてみる。
中央構造線をgooglemapに、表示してみる。

#写真
![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/m/z/n/mznb.jpg?t=1490155571)

#成果物
http://jsdo.it/ohisama1/mznb
cocos2d-xのAndroidNdkのバージョンについて


# Env

- cocos2d-x 3.14.1

# Probrem

新しい環境を作成してビルドしたら以下のようなエラーで
アプリがクラッシュした

```
03-22 17:05:29.447 8837-8837/org.cocos2dx.hellolua E/AndroidRuntime: FATAL EXCEPTION: main
                                                                     Process: org.cocos2dx.hellolua, PID: 8837
                                                                     java.lang.UnsatisfiedLinkError: dalvik.system.PathClassLoader[DexPathList[[zip file "/data/app/org.cocos2dx.hellolua-2/base.apk"],nativeLibraryDirectories=[/vendor/lib, /system/lib]]] couldn't find "libcocos2dlua.so"
                                                                         at java.lang.Runtime.loadLibrary(Runtime.java:366)
                                                                         at java.lang.System.loadLibrary(System.java:989)
                                                                         at org.cocos2dx.lib.Cocos2dxActivity.onLoadNativeLibraries(Cocos2dxActivity.java:248)
                                                                         at org.cocos2dx.lib.Cocos2dxActivity.onCreate(Cocos2dxActivity.java:264)
                                                                         at android.app.Activity.performCreate(Activity.java:5933)
                                                                         at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1105)
                                                                         at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2251)
                                                                         at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2360)
                                                                         at android.app.ActivityThread.access$800(ActivityThread.java:144)
                                                                         at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1278)
                                                                         at android.os.Handler.dispatchMessage(Handler.java:102)
                                                                         at android.os.Looper.loop(Looper.java:135)
                                                                         at android.app.ActivityThread.main(ActivityThread.java:5221)
                                                                         at java.lang.reflect.Method.invoke(Native Method)
                                                                         at java.lang.reflect.Method.invoke(Method.java:372)
                                                                         at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:899)
                                                                         at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:694)
```

原因はAndroidStudioが最新のndk(android-ndk-r14)を
ダウンロードして適用していたためだった。

わかっていたけど、やっぱり最新のcocosでも
ndkは古いやつを使わないとダメみたい

参照しているndkをr14からr9にすることでビルドが成功した
nasa space apps challenge その4

#概要
nasa space apps challenge に行けないので、勝手にハッカソンしてみる。
2017年8月21日北アメリカ大陸横断皆既日食をcesiumで表示してみる。

#写真

![](http://jsdo-static-contents.s3.amazonaws.com/images/capture/S/y/D/SyD8.jpg?t=1490171103)

#成果物
http://jsdo.it/ohisama1/SyD8