OmniAICreator/Qiita-1.07M huggingface dataset:
SublimeText3でNetBeans風のショートカットキー設定

# はじめに

SublimeTextのショートカットキーにどうしても慣れないため

馴染みのあるNetBeans(Windows)のショートカットキーを設定した記録です

## 設定変更手順

Preferences > Key Bindings

## 設定内容

```javascript:sublime-keymap 
[
    /* 行スワップ ↑ */
    { "keys": ["alt+shift+up"], "command": "swap_line_up" },
    /* 行スワップ ↓ */
    { "keys": ["alt+shift+down"], "command": "swap_line_down" },
    /* 行コピー */
    { "keys": ["ctrl+shift+up"], "command": "duplicate_line" },
    /* 行コピー */
    { "keys": ["ctrl+shift+down"], "command": "duplicate_line" },
    /* 行削除 */
    { "keys": ["ctrl+e"], "command": "run_macro_file", 
           "args": {"file": "res://Packages/Default/Delete Line.sublime-macro"} },
    /* 右インデント */
    { "keys": ["alt+shift+right"], "command": "indent" },
    /* 左インデント */
    { "keys": ["alt+shift+left"], "command": "unindent" },
    /* 単語選択 */
    { "keys": ["ctrl+r"], "command": "find_under_expand" },
    /**  対応する括弧へジャンプ */
    { "keys": ["ctrl+]"], "command": "move_to", "args": {"to": "brackets", "forward": true} },
    /**  対応する括弧へジャンプ */
    { "keys": ["ctrl+["], "command": "move_to", "args": {"to": "brackets", "forward": false} },
    /** 括弧内選択 */
    { "keys": ["ctrl+shift+["], "command": "expand_selection", "args": {"to": "brackets"} },
    { "keys": ["ctrl+shift+]"], "command": "expand_selection", "args": {"to": "brackets"} },
    /** 次のタブ */
    { "keys": ["alt+right"], "command": "next_view_in_stack" },
    /** 前ののタブ */
    { "keys": ["alt+left"], "command": "prev_view_in_stack" },

]
```

## 謝辞
参考にさせていただきました
[Sublime Text 2のショートカットをNetbeansのショートカットに置き換える](http://nakajmgtech.blogspot.jp/2013/02/etc-sublime-text-2netbeans.html)
[C#] サロゲートペアを含む文字列の文字数を取得する

サロゲートペアを含む文字列の文字数をカウントしたい

※@NetSeed さんにコメントでご指摘いただいた方法のほうが良さそうでしたので修正しました

# 対応方法

以下を使うと良いようです。

[StringInfo.LengthInTextElements プロパティ (System.Globalization)](https://msdn.microsoft.com/ja-jp/library/system.globalization.stringinfo.lengthintextelements(v=vs.110).aspx)

# 実装例

```csharp:実装例
public static int CombiningCharactersLength(this string str)
{
    return (new System.Globalization.StringInfo(str)).LengthInTextElements;
}
```
```csharp:テスト
[TestMethod]
public void Test_CombiningCharactersLength()
{
    var str = "𩸽";
    Assert.AreEqual(str.CombiningCharactersLength(), 1);
}
```

# 参考
[文字数を正確にカウントするには？（サロゲート文字対応）［C#、VB］ － ＠IT](http://www.atmarkit.co.jp/fdotnet/dotnettips/726countchars/countchars.html)

以下は古い方法だったようですので参考程度にしてください。

---

# 対応方法

`System.Globalization.StringInfo.ParseCombiningCharacters(string)` を使用する
[StringInfo.ParseCombiningCharacters メソッド (String) (System.Globalization)](https://msdn.microsoft.com/ja-jp/library/system.globalization.stringinfo.parsecombiningcharacters(v=vs.110).aspx)

制御文字のインデックスのリスト(`int[]`) が返るため、そのLengthを取れば良い

# 実装例
```csharp:実装例
public static class StringExtentions
{
    public static int CombiningCharactersLength(this string str)
    {
        return System.Globalization.StringInfo.ParseCombiningCharacters(str).Length;
    }
}
```

```csharp:テスト
[TestMethod]
public void Test_CombiningCharactersLength()
{
    var str = "𩸽";
    Assert.AreEqual(str.CombiningCharactersLength(), 1);
}
```

# 参考
[文字列の長さ（文字数）を取得する: .NET Tips: C#, VB.NET](http://dobon.net/vb/dotnet/string/stringlength.html)
[JavaScriptでのサロゲートペア文字列のメモ - Qiita](http://qiita.com/YusukeHirao/items/2f0fb8d5bbb981101be0)
Infyom Laravel-Generator で フォームが出来上がるまで動画

Infyom Laravel-Generator を使って、フォームが出来上がるまでを動画にしてみた。

https://youtu.be/KDL1cDSDU9w

備忘録的な感じなので、管理画面のデザインなどのCSS調整は記録されていないです。

こちらを落としてもらうと、CSS調整などがわかってもらえるかなと思います。

https://github.com/nonomurashoichi/iceberg
git-duetの.git-authors でイニシャルが認識できない時の落とし穴

#はじめに
git-duetってそもそもなに？
git-duetの基本的な使い方は？
といったことについては検索すれば日本語でも記事が出てくるので省略させていただきます。


#背景
プロジェクトでgit-duetを利用しています。最近新たに環境を作ることになってホイホイとインストールを進めていたらgit-duetで思いがけず時間がかかったのでメモを残しておきます。
検索してもほとんどヒットしなかったのでこんな些細なことでひっかかる人はいないのかもしれませんね。笑

#問題
git-duetの設定の中でルートディレクトリに以下のようなファイルを作成する必要があります。
（内容はGitHubのREADMEそのままです。）

```~/.git-authors
authors:
　jd: Jane Doe; jane
　fb: Frances Bar
email:
　domain: awesometown.local
```

ただこれを設定するだけ！本当に簡単ですね。
これを設定してもイニシャルが認識できないというエラーを延々と吐かれてしまいました。

#解決策
私は上記のように設定すべき .git-authors を以下のように書いていました。

```~/.git-authors
authors:
jd: Jane Doe; jane
fb: Frances Bar
email:
　　domain: awesometown.local
```

違いがお分かりでしょうか。
イニシャルの前に空白を入れていなかったこと。これだけです。
空白を入れた途端正常に作動して拍子抜けました。

#おわりに
はじめはパスが悪いのかとか色々疑ったのですが原因は些細なことでした。
知識がないうちはREADMEに記載されている体裁にも意味があるかも！と疑ってそのままを再現できるようにしないといけないですね！
MacでNingx、PHP7.1、php-fpmで環境構築（メモ）

# Macで環境構築

## HomebrewでNginx、PHP7.1、php-fpmをインストール

### Nginxをインストール
* インストール

```
$ brew install nginx
```

### PHP7.1をインストール（php-fpmもついてくる）
* インストール

```
$ brew install php71
```

* 使用しているシェルによるが、自分はzshなので```~/.zshrc```にphpのパスが通るにように設定を記載

```
export PATH="$(brew --prefix homebrew/php/php71)/bin:$PATH"
export PATH="/usr/local/sbin:$PATH"
```

* 読み込みなおす

```
$ source ~/.zshrc
```

## php-fpmの起動設定
* phpが自動で起動するように設定する

```
//-pで指定したディレクトリをサブディレクトリごと作成している
$ mkdir -p ~/Library/LaunchAgents
//ファイルのコピー
$ cp /usr/local/opt/php71/homebrew.mxcl.php71.plist ~/Library/LaunchAgents/
//php-fpmを起動している
$ launchctl load -w ~/Library/LaunchAgents/homebrew.mxcl.php71.plist
```

* 下のようになれば起動確認OK

```
$ ps ax | grep php-fpm
 1317   ??  S      0:00.14 /usr/local/opt/php71/sbin/php-fpm --fpm-config /usr/local/etc/php/7.1/php-fpm.conf
 1324   ??  S      0:00.01 /usr/local/opt/php71/sbin/php-fpm --fpm-config /usr/local/etc/php/7.1/php-fpm.conf
 1325   ??  S      0:00.00 /usr/local/opt/php71/sbin/php-fpm --fpm-config /usr/local/etc/php/7.1/php-fpm.conf
 1420 s001  S+     0:00.00 grep php-fpm
```

## Nginxのバーチャルホスト、php-fpmの設定
* ファイルの```/usr/local/etc/nginx/nginx.conf```を編集

```
# another virtual host using mix of IP-, name-, and port-based configuration
//バーチャルホストの設定
server {
    listen       80;
    server_name  framework.local;

    location / {
        root   プロジェクトまでのファイルパス;
        index  index.php index.html index.htm;
    }

    //php-fpmの設定
    location ~ \.php$ {
        root           プロジェクトまでのファイルパス;
        fastcgi_pass   127.0.0.1:9000;
        fastcgi_index  index.php;
        fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
        include        fastcgi_params;
    }
}
```

* nginx起動

```
//Macでは1024番ポート以前のポート番号は、開放時にroot権限が必要です
$ sudo nginx  //起動
```

## hosts設定
ファイルの```/etc/hosts```を編集

```
127.0.0.1    framework.local
```

## ブラウザ確認
http://framework:80/


## 参考URL
https://utano.jp/entry/2016/07/nginx-and-php-fpm-download-php-file/
https://utano.jp/entry/2016/07/mac-homebrew-php-fpm-56-installation/
http://qiita.com/kotarella1110/items/634f6fafeb33ae0f51dc
http://qiita.com/megurock/items/c40200039f6838f51d94
Angular 4でmoduleIdは要らなくなる

「[Angular moduleId removed! You no longer need to write it in angular 4](http://qusaysaad.com/180-2/)」では、Angular 4からはテンプレートやスタイルを外部ファイルに定めるとき、モジュールのクラスにつぎのような`moduleId`は加えなくてよいと説明されています。

```ts
@Component({
	moduleId: module.id,

})
```

この中身をもう少し補い、注意すべきことも加えます。

#Angular 4の「TUTORIAL」ではmoduleIdが使われていない
Angular 4の「TUTORIAL」で「[Routing](https://angular.io/docs/ts/latest/tutorial/toh-pt5.html)」の解説を読むと、たしかに`moduleId`は使われていません(「[Add heroes to the dashboard](https://angular.io/docs/ts/latest/tutorial/toh-pt5.html#add-heroes-to-the-dashboard)」の項参照)。

```ts
@Component({
	selector: 'my-dashboard',
 	templateUrl: './dashboard.component.html',
})
```

作例のコード「[Angular Example - Tour of Heroes: Part 5](https://angular.io/resources/live-examples/toh-5/ts/eplnkr.html)」も、`moduleId`なしで正しく動いています。

#moduleIdが省けるのはSystemJSプラグインの機能
Angular公式サイトの「Change Log」を見ると、「[All mention of moduleId removed. "Component relative paths" cookbook deleted (2017-03-13)](https://angular.io/docs/ts/latest/guide/change-log.html#!#all-mention-of-moduleid-removed-component-relative-paths-cookbook-deleted-2017-03-13-)」の項で簡単に説明されています。`moduleId`が要らなくなったのは、SystemJSプラグイン(systemjs-angular-loader.js)によるものです。したがって、Angular 4の仕様というわけではなく、またプラグインが環境に含まれていなければなりません(環境の設定については「[Setup a local development environment](https://angular.io/docs/ts/latest/guide/setup.html#setup-a-local-development-environment)」参照)。

このプラグインは、テンプレート(`templateUrl`)やスタイル(`styleUrls`)の外部ファイルをコンポーネントからの相対パスで定めれば、絶対パスに読み変えてくれます。Angular公式サイトの情報は、すべてこの設定にもとづくことになるとのことです。`moduleId`は使わず、モジュールからの相対パスを与える書き方は、強く推奨されています。

> We strongly encourage you to only write component-relative paths. That is the only form of URL discussed in these docs. You no longer need to write @Component({ moduleId: module.id }), nor should you.

#相対パスは'./'で始めなければならない
かつてAngular 2の「[TUTORIAL](https://v2.angular.io/docs/ts/latest/tutorial/)」に沿った入門解説「[Angular 2入門](http://www.fumiononaka.com/Business/index.html#Angular_2)」を書いたので、試みに[そのコード](http://www.fumiononaka.com/Business/html5/FN1701001.html#sec04)をAngular 4に対応させてみました。すると、`moduleId`を省いてしまうと動きませんでした(厳密にはコメント`//`が入っているとtscの問題なのかエラーになるためコードは行ごと削除しました)。

```ts
@Component({
	// moduleId: module.id,  // 動かない
	selector: 'my-dashboard',
	templateUrl: 'dashboard.component.html'
})
```

Angular 4公式「TUTORIAL」の前掲コードとよくよく見比べてみると、ひとつだけ異なるところがあります。`moduleId`を省くには、相対パスが'**./**'で始まらなければならないようです。

公式サイトのAngular 2の「TUTORIAL」には、少なくとも解説を書いたとき、パスの頭に'./'はなく直にファイル名が記載されていたと記憶します。簡単なことではあるものの、気づくのに時間がかかりました。前出「Change Log」によれば、サイトの解説から`moduleId`への言及すべてをさっくり消したそうです。Angular 2のユーザーにとっては、注記くらい残してほしかったところでしょう。
Starlingマニュアルが日本語化されました

2017年はじめに大幅アップデートされた Starling の公式マニュアルが日本語化されました。
http://manual.starling-framework.org/jp/

まあ、翻訳者は私ですが。。結構ボリュームあります。

このQiitaに投稿された自分の記事の内容に対する部分も、Starling 作者のダニエルさん自ら解説されておりますので、より正確で深い内容となっております。解説は starlng の Ver.2.0 以上をベースに書かれていますが、1.x系でも役立つはずです。

さらに、Starling マニュアルは、先日発売された The Starling Handbook の内容の一部分となっています。
こちらは英語版のみとなりますが、、。 （さすがに翻訳しきれない。） 
<img src="https://gamua.com/img/starling/handbook/handbook3d.png?mtime=2017-05-16-1622" />
https://gamua.com/starling/handbook/

このマニュアル本が、2017年夏の時点で最新かつもっとも充実した内容となっています。合わせてご活用ください。

また、マニュアルの翻訳はgithubベースで行われておりますので、間違いの修正・新規項目の加筆を行ってくれる方がおれば大歓迎です。よろしくお願いします。
https://github.com/Starling-Manual/Starling-Manual-JP/tree/master
Ruby on RailsでACEエディタを使う

#RailsでACEエディタを使う
Railsでオープンソースのエディタであるaceを使用するメモ
[ACEエディタについて](https://github.com/ajaxorg/ace-builds)

erbでaceのライブラリを読み込む

```erb:ace.html.erb
<%= javascript_include_tag "https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ace.js", :cache => "cached_all" %>
    <div id="editor"></div> <%# エディタを読み込むdivタグ %>
<%= javascript_include_tag "ace" %> 　<%# ace.js.coffeeを読み込む %>
```
CoffeeScriptにACEの設定を記述する

```coffeescript:ace.js.coffee
editor = ace.edit("editor")
editor.$blockScrolling = Infinity

editor.setTheme("ace/theme/monokai")
editor.getSession().setMode("ace/mode/html")
```

最後にace.js.coffeeをプリコンパイルするように記述

```rb:config/initializers/assets.rb
Rails.application.config.assets.precompile += %w( *.js )
```
Android Studio 2.3ではAPK作成時にSignature Versionsを選ぶ必要がある

# 概要
AndroidStudio2.3からGenerate Signed APKする際にSignature Versionsを選ぶ項目が追加されていました。
![signature.png](https://qiita-image-store.s3.amazonaws.com/0/33071/c7dd1dc1-6aaa-f63a-99a5-698b981ecd05.png)
選択していないと
「Please select at least one of the signature versions to use」
と怒られる。
![signature_err.png](https://qiita-image-store.s3.amazonaws.com/0/33071/e0afd99b-b7d6-9525-88a9-94392e1d5b2a.png)



# Signature Versionsについて
Android7.0から新しい署名のスキームが導入され、アプリのインストール時間を高速化したり、APKファイルに無許可の変更が行われないようにしたりと、セキュリティ面が強化されました。
従来のスキーム(JAR署名)をv1、新たなスキームをv2と呼びます。
https://source.android.com/security/apksigning/v2
https://developer.android.com/about/versions/nougat/android-7.0.html#apk_signature_v2

# 結局どっちを選択したら良いの？
基本的に両方チェックが推奨のようです。
両方チェックしていてもAndroid7.0以降ではインストール時に優先的にv2が検証されます。
Android7.0以前では、v2署名は無視されてv1のみ検証が行われるので、最低でもv1にチェックが入っていないとそもそもインストールに失敗してしまいます。
![signflow.png](https://qiita-image-store.s3.amazonaws.com/0/33071/011677af-f419-900b-5d29-03c34819b137.png)

https://source.android.com/security/apksigning/v2#verification
また注意点として、v2で署名した後にapkに変更を加えると署名が無効になるようなので、```zipalign``` などを後からapkにかけてはいけません。
### 実はAndroidStudio2.2の頃からv1+v2で署名していた
AndroidStudio2.3から署名バージョンを選択できるようになっただけで、
実は、2.2でもデフォルトでv1+v2で署名されていました。
2.3からは、v2を使いたくない際など明示的にbuild.gradleに```v2SigningEnabled false ```と書かなくても良くなったということのようです。


### apksignerで署名されているバージョンを確認できる
以下のようにして、既存のapkファイルにどのバージョンの署名が使われているか確認できます。

```
apksigner verify -v app-release.apk
```

![apksigner.png](https://qiita-image-store.s3.amazonaws.com/0/33071/821e9d4d-f559-c971-073b-0dc73259f52f.png)
「apksigner」はAndroidSDK内の build-tools/XX.X.X にあるのでパスを通すと使えます。
```export PATH=$PATH:~/Library/Android/sdk/build-tools/25.0.3```

# まとめ
v2利用に問題がない限りは両方チェックするのが無難。
知らずにv2だけチェックしたりするとminSDKVersionと不整合が生じてPlayストアに弾かれる場合があります。
RealmFunctionsを試す

こんにちは、iosフリーランスエンジニアの永田大祐と申します。

先日、WWDC2017が終わり、皆様共有会なので、高めていくと思います。
自分も休みはAppleから配信されているMetalプログラミングの動画などを閲覧していました。二人目の登壇者がめちゃくちゃ早口で、すごい英語だなと思いました。

来年は行きたいと思いましたが、英会話スクールには数十万の費用がかかります。理由はインプットしたいからです。なので、仕事を頑張ろうと思います。


最近は仕事で、html、phpなどで、連携アプリを起動するのにちょっと試す機会があり、プライベートでもRealmの新しいサービス、RealmFunctionsを試しました。

##Realmの記事より

https://news.realm.io/jp/news/serverless-logic-with-realm-introducing-realm-functions/

Realm Functionsはサーバーサイドの処理をシンプルなWebインターフェースから簡単に書くことができる、非常に強力な手段です。Realm Mobile Platformをご利用の方は、本日より誰でもRealm Functionsを利用できます。現在はベータ版として、Developer Editionをご利用の方には３つまで同時に実行可能なRealm Functionsを無料で利用していただけます。ProおよびEnterprise Editionをご利用の場合は実装できるRealm Functionsの数に制限はありません。 Realm Functionsを使用してぜひすばらしいアプリを作ってください！

#こちらのリンク先の手順で実現できます。

[realm-demos/realm-tasks](https://github.com/realm-demos/realm-tasks/tree/master/RealmTasks%20Functions)

上記のリンク先の手順で2番のjsをインストールする手順があります。

これは指定のjsをインストールして、指定のディレクトリー階層でターミナルでコマンドを打ち、wit.aiをインストールしました。そのままです。
+ node-wit@4.2.0とターミナルに記載されます。


<img width="789" alt="スクリーンショット 2017-06-11 20.58.51.png" src="https://qiita-image-store.s3.amazonaws.com/0/131469/0101dcac-1e1b-f818-44c0-ee3353e4d4d8.png">




基本的にこの手順に沿って対応すれば良いのですが、http://wit.ai
のサイトで、設定したデータを返却するサービスがあります。datetimeの時間設定をする際に、日本語設定ではデータを返却できませんでした。 


これはBeta版だからかもしれません。
http://wit.ai
のサイトでは、写真のようにEntityとしてlocation値は返って来てました。
<img width="1431" alt="スクリーンショット 2017-06-11 21.34.53.png" src="https://qiita-image-store.s3.amazonaws.com/0/131469/c0f9493a-7dea-d206-14ff-2d13af31f3d6.png">




他にも色々返却設定はあるようですが、自分が試した際は、英語でdatetimeフラグだけ返却できました。やり方があるのかもしれません。成功する場合は写真のように、日にちが変換した値になっています。ここら辺はjsももう少し知る必要がありそうです。




<img width="998" alt="スクリーンショット 2017-06-11 20.25.46.png" src="https://qiita-image-store.s3.amazonaws.com/0/131469/22607107-6c02-7997-8e16-f75b97f2b141.png">


基本的にGitHub上の手順をしっかり読み、対応すればできます。


##感想
位置情報のサービスもあり、地図経路などユーザーが操作しなくとも自動で表示まで行くと、便利だと思いました。地図経路など、移動しながら携帯を見るし、一度見ても違う画面に遷移して、また見直すという場面が自分はあります。その際に、瞬時に経路表示出来たらなと思いました。
#RealmFunctionの挙動

https://youtu.be/DJfm7CLxcWQ


##まとめ
2017/6/11の段階で、Realmも2.8.0です。連携やデータを圧縮するメソッドなど強化されていました。Swift側のRealm2.8.0に対しても実装の理解を高めていきたいと思います。

お読みくださいまして、誠にありがとうございます。
JAVA学習履歴　抽象クラスと抽象メソッド

#抽象クラスと抽象メソッド

普通のクラスとの違いはより曖昧であること
抽象クラスが「車」一般クラスは「プリウス」みたいなイメージ
ん、違うかな…

本題に入ると
抽象クラスとは抽象メソッドを持つクラスの事
抽象メソッドとは処理がなく、呼び出し方だけ記述されているもの

定義に関しては
abstract修飾子を使用する

構文
「class」
```java
abstract class クラス名
```
「method」
```java
abstract 戻り値の型 メソッド名
```

使い方は例えば計算する処理を作って、数値を呼び出す事だけ抽象クラス、メソッドでして
数値を持たせる、計算処理は別のクラスで実行
そんなイメージ

間違っていたら指摘お願いします…orz
【Unity】SimpleVoxel(擬似インスタンシングバージョン)

## はじめに
擬似インスタンシングでの、Voxelの作成を簡単にするかつ、コード自体、すごくシンプルなので、このコードを元に、使用者自身が、改変し、独自の仕様に仕上がるような便利プログラムを作成しました。
だいぶ古い技術ですので、Asset Storeや、qiita、ブログなどで、同じような物あると思いますが、以下のような、状況に対して、作成を試みました。


・geometory shader/instancing/compute shaderが、使えない環境での開発、
Macや、古い実機で、これらをサポートしていない、端末
・Unityのバージョンアップにより、コードを自分で、メンテナンスできないことを回避
・コードベースで、ゴリゴリやりたい人
・Visual Art作品作りたい人


## 開発環境
Unity5.3以上
5.4/5.5/5.6とかで、テストしていないので、Meshの更新あたりのプログラムに変更があれば、修正必要です。どこかで、5.5などで、確認して、問題あれば、修正して、PUSHしておきます。


## ソースコード
https://github.com/yasuohasegawa/SimpleVoxel
ちょっと訳ありで、コメントとか、英語です。ご容赦ください。
おまけで、Planeのシーンに、パーティクル的なやつをやりたい人向けの、サンプルありです。
Unity純正の、Particleシステムあるので、車輪の再発明みたいですが、コードベースで、ゴリゴリ、やりたい人向けです。

## 使い方
1. 空のGameObjectをシーンに追加
2. MeshRendererと、MeshFilterを追加
3. Resourcesに頂点カラーを設定できる、ColorMatと、テクスチャを設定できる、CubeMatがあるので、どちらか、設定したいものを設定もしくは、自前で、対応する。
4. Voxel.csを追加
5. ブロックを制御させるためのスクリプトを追加
ここは、Voxelシーンで使っている、VoxelTest.csもしくは、Terrainシーンで使っている、TerrainSample.csを参考にしてください。

![screen1.png](https://qiita-image-store.s3.amazonaws.com/0/183884/5c0be58a-6b63-0d04-0473-cd6572f49d91.png)

## ブロックへのテクスチャの設定について
サンプルは、512x512のテクスチャに、4x4で、ブロックの面のテクスチャを設定できるようになっています。数を増やしたい場合は、NxNで、好きな数/好きなサイズでテクスチャを作成後、Voxel.csの、m_texUnit変数の、0.24の箇所を変更してください。この、0.24は、uv座標の、分割数になります。<br>
<b>「m_texUnit = 1/設定したいブロックのテクスチャの数n」</b>で、割り出します。<br>
その後の、UVテクスチャの、割り当ては、2Dベクトルで、左上から、new Vector2(0,0)、その隣、new Vector2(1,0)などで、指定したいテクスチャを割り当てます。
今回作成したVoxel.csクラスでは、マインクラフトのような、テクスチャの設定、top面と、そのほかの面を指定できるのと、すべて同じテクスチャで設定できる、メソッドを用意してあります。


## iphone5での動作検証結果
<b>カメラ外(クリッピングされているところ)で表示されるcube含めた場合(Meshの更新なし):</b>
cubeの数: 10万
FPS: 約30
メモリ: 約230MB
※カメラ外のcubeは、クリッピングされるので、FPSは出ますが、メモリが、ちょっと厳しい。
実際は、一度に生成させる場合は、端末によりますが、数は、半分以下に減らす必要はありかと。

<b>カメラに表示が収まっているcubeかつ、動かして、頂点情報を更新させた場合:</b>
cubeの数: 2500
FPS: 約30
メモリ: 約8MB

## Terrain sceneの実行結果の見た目
![screen0.png](https://qiita-image-store.s3.amazonaws.com/0/183884/dc38c01f-e12f-f739-6416-07b37d9ab82b.png)

## その他
コライダーは、つけてません、必要あれば、使用者自身で、対応いただければとです。
移動/回転/拡大の箇所は、個々に、制御できますが、頂点シェーダーで、それぞれ、動かすように、するのも、良いかもです。
単純に、Mesh一つで、いくつもの、Cubeを作成しているだけなので、よく見かける、Voxelの作り方とは、違います、ご容赦ください。
JAVA学習履歴　final修飾子とstatic修飾子

ノート取りとは違った勉強法に取りかかろうとこちらに記載。
すごく中途半端な部分からの書き出し。

#Javaにおける修飾子
識別子の性質を形容する予約語
→クラス、メソッド、それに変数をどういう風にしていこう…なんていう風に理解

今回学習する修飾子はfinalとstatic

まずはfinal
final修飾子はフィールド、クラスにつける。
これをする事でフィールドの場合「値が変更出来なくなる」
クラスの場合は「継承が出来なくなる」

static修飾子
フィールドやメソッドに使用
これを付ける事で同じクラスから生成したオブジェクトは値を同一にすることが出来る


staticに関してはあまりピンときていないので要復習
まずは一通り学習してみて、分からない部分の洗い出しをしよう。
Cloudinaryの画像をhttpsで取得するように


参考
+ https://support.cloudinary.com/hc/en-us/articles/202520362-Can-Cloudinary-s-imaged-be-served-via-SSL-HTTPS-#comment_200993629


config/initializers/cloudinary.rb

```rb
if Rails.env.production?
  Cloudinary.config do |config|
    config.secure = true
  end
end
```
mvn sonar:sonarでSCMプロバイダを変更(指定) or SCM連携を無効化する

mvnコマンドを使用してSonarQubeにメトリクス情報を送信する場合は、mvnコマンドのゴールに「`sonar:sonar`」を指定します。その際に、[SCM連携](https://docs.sonarqube.org/display/SONAR/SCM+support)のプロバイダを変更（指定）したり、SCM連携自体を無効化するができます。


# 動作検証バージョン

* [SonarQube 6.4](https://hub.docker.com/_/sonarqube/)


# SCMプロバイダの変更(指定)

```
$ mvn sonar:sonar -Dsonar.scm.provider=tfvc
```

上記は、SCMとして[Team Foundation Version Control(TFVC)](https://msdn.microsoft.com/ja-jp/library/ms181237.aspx)を使用する場合の設定例です。
ちなみに・・・SonarQubeに[TFVC用のプラグイン](https://github.com/SonarQubeCommunity/sonar-scm-tfvc)をインストールしておかないと以下のようなエラーになります。（デフォルトだと、GitとSVNがサポートされているみたいです）

```
...
[ERROR] Failed to execute goal org.sonarsource.scanner.maven:sonar-maven-plugin:3.0.2:sonar (default-cli) on project todo: SCM provider was set to "tfvc" but no SCM provider found for this key. Supported SCM providers are git,svn -> [Help 1]
[ERROR] 
[ERROR] To see the full stack trace of the errors, re-run Maven with the -e switch.
...
```

# SCM連携の無効化

```
$ mvn sonar:sonar -Dsonar.scm.disabled=true
```

上記はMavneコマンド側で無効化していますが、「Administrationメニュー > Configuration > General Settings > SCM」の「Disable the SCM Sensor」をONにすることで無効化することもできます。


# まとめ

なんでこんなこと調べたかというと・・・なんらかの理由でSCM連携のプロバイダがGitになっており、[Team Foundation Version Control(TFVC)](https://msdn.microsoft.com/ja-jp/library/ms181237.aspx)」を使用しているプロジェクトに対して「`mvn sonar:sonar`」を行ったところ以下のようなエラーが発生したためです。

```
...
[ERROR] Failed to execute goal org.sonarsource.scanner.maven:sonar-maven-plugin:3.0.2:sonar (default-cli) on project todo: /Users/xxx/tfvc/MyFirstProject/todo doesn't seem to be contained in a Git repository -> [Help 1]
[ERROR] 
[ERROR] To see the full stack trace of the errors, re-run Maven with the -e switch.
[ERROR] Re-run Maven using the -X switch to enable full debug logging.
...
```

なんでSCM連携のプロバイダがGitになっていたかは不明ですが・・・ビルドにJenkinsを使っていたので、Jenkins側で何か指定しちゃっているのかもしれません。
posh-gitのインストール＆プロンプトカスタマイズ


## この記事について

* 正直な所、自分用のメモ感は強いです

## 手順

### Git for Windows の インストール

* 公式サイト：[Git for Windows](https://git-for-windows.github.io/)
* 下記からwindows用Gitをダウンロード、インストールを行う
* 但し、**Powershellでも使えるようなオプションを選ぶ必要** がある。
* TODO:オプションについて

### Posh-git の clone

* Github：[GitHub - dahlbyk/posh-git: A PowerShell environment for Git](https://github.com/dahlbyk/posh-git)
* 上記ページからソース一式をPCのどこかにcloneする

### Posh-git を実行可能にするために Powershell の スクリプト実行を変更

* 実はこの手順、[README.md](https://github.com/dahlbyk/posh-git/blob/master/README.md) の Prerequisites / 2番に同じ手順が記載されていますよ、と。

* powershellは基本スクリプトの実行をポリシーで制限されているので、この制限を緩める必要があるので、下記コマンドにてスクリプトの実行を許可する。

```powershell
Set-ExecutionPolicy RemoteSigned -Scope CurrentUser -Confirm
```

### install.ps1 の実行

* posh-git を展開したディレクトリに移動して、 **install.ps1** を実行する。これによりプロファイルが作成されて、posh-gitを読み込むようなスクリプトが置かれる。

### profileのカスタマイズ

* 参考ページ：[Customizing Your PowerShell Prompt · dahlbyk/posh-git Wiki · GitHub](https://github.com/dahlbyk/posh-git/wiki/Customizing-Your-PowerShell-Prompt)

* 作成されたプロファイルはデフォルトでは下記に格納されるはず

```powershell
%userprofile%\Documents\WindowsPowerShell\Microsoft.PowerShell_profile.ps1
```

* 上記ファイルをカスタマイズすることによりposh-gitでカスタマイズしたプロンプトをさらにカスタマイズすることが可能
* 自分は下記の様にした

```powershell
function prompt {
    $origLastExitCode = $LASTEXITCODE
    Write-Host "PS " -nonewline
    Write-VcsStatus
    Write-Host ($ExecutionContext.SessionState.Path.CurrentLocation) -ForegroundColor Green
    $LASTEXITCODE = $origLastExitCode
    "$('>' * ($nestedPromptLevel + 1)) "
}

Import-Module posh-git
$global:GitPromptSettings.BeforeText = '['
$global:GitPromptSettings.AfterText  = '] '
```
Linux でバイナリデータを16進ダンプ表示する [odコマンド]

Linux でバイナリデータを16進表示するときのコマンドです。
たまにしか使わないので、いつも忘れてしまう。。。

    od -tx1z -Ax <binary file name>

```
-tx1z : Format. Hexadecimal, 1 Byte, printable ascii characters.
-Ax   : Adress radix is Hexadecimal. 
```

使用例

```
$ od -tx1z -Ax test.c 
000000 23 69 6e 63 6c 75 64 65 20 3c 73 74 64 69 6f 2e  >#include <stdio.<
000010 68 3e 0a 6d 61 69 6e 28 29 0a 7b 0a 09 70 72 69  >h>.main().{..pri<
000020 6e 74 66 20 28 22 48 65 6c 6c 6f 20 77 6f 72 6c  >ntf ("Hello worl<
000030 64 5c 6e 22 29 3b 0a 7d 0a                       >d\n");.}.<
000039

```
よく使う Excel ショートカット (ctrl+;(セミコロン))

仕事でよく使うExcelショートカットキーのご紹介。

```
ctrl+;(セミコロン) ・・・ 日付挿入
```

日付をいちいちキー入力しなくていいのは、地味に有り難い。

ちなみに、Windowsのノートパットで
**F５ボタン**を押すと日付＋時刻が入力できます。
議事録をとる時に覚えておくと重宝します。

### 訂正(20170614)

初期投稿時、Alt+;になっていました。失礼しました。
【herokuコマンド】createからdestroyまで

herokuへアプリをデプロイするところから、アプリを削除するところまでをまとめます。

#前提
- Herokuのアカウント作成が完了していること
- 開発環境でherokuコマンドを使用できる状態になっていること
- 開発環境でgitが使用できる状態になっていること


#デプロイするアプリを作成する
デプロイするアプリを作成します。
今回は`herokusample`というフォルダを作成し、そこにソースコードを置きます。
`Node.js + express`で動きます。


#デプロイするアプリをgitで管理する
herokusampleフォルダ以下をgit管理します。

```sh
cd herokusample
git init
git add .
git commit -m "first commit"
```

#Heroku上でアプリを動かす準備をする
使用した言語やアプリによって変わってきます。
今回はNode.jsの場合について書きます。

`Procfile`(拡張子なし)を作成します。
このファイルがあることによって、nodeの起動コマンドをheroku上で実行できます。

```Procfile
web: node index.js
```

`web`というkeyに対して、アプリを起動するコマンドを書きます。
(index.jsから起動できるとします。)
(上記もgitでコミットしておきます。)

以下(公式)に、各々の言語ごとのデプロイ方法が書いてあります。
https://devcenter.heroku.com/


#Heroku上にアプリを作成する
ここまでで、デプロイするアプリの準備が完了しました。
以下のコマンドでHeroku上にアプリを作成します。

```console
$ heroku create
Creating app... done.
# アプリのURL等も表示されます
```

`heroku create アプリ名`でアプリ名を指定することもできます。
アプリ名を指定しないと、自動的にアプリ名が付けられます。(あとで変更可能です)

これでHeroku上にアプリができました。
あとはデプロイです。

ちなみに`heroku create`を実行した時点で、リモートリポジトリにherokuのリポジトリが登録されます。
ここにプッシュすると、アプリがデプロイされます。

```console
$ git remote
origin
heroku
```


#アプリをデプロイする
gitを使ってアプリをデプロイします。

```console
$ git push heroku master
```
heroku上のmasterブランチにデプロイされると、アプリが動きます。
(上記のアプリはmasterブランチでコミットしていることとします)

push時のログにあるURLを開く、もしくは以下のコマンドでアプリを開くことができます。

```console
$ heroku open
```

以上が、Heroku上でアプリを動かすためにすることです。

#アプリを更新する
アプリを更新し、gitでコミットします。
上記と同じように、herokuリポジトリへpushすることで、アプリが自動的に更新されます。

```console
$ git push heroku master
```

#アプリを削除する
使わなくなったアプリを削除します。方法は2通りあります。

###Heorkuから消す(Web)
https://id.heroku.com/login にアクセスし、ログインします。
消したいアプリを選択し、「Settings」タブの一番下に、アプリの削除の項目があります。
「Delete app...」ボタンを選択すると、確認のためにアプリ名の入力を求められます。
アプリ名を入力して、実行するとHeroku上からアプリを削除することができます。

ですが、もう一つやることがあります。
gitのリモートリポジトリにherokuが設定されたままになっているので、これを消す必要があります。

```console
$ git remote rm heroku
```

これですべての環境がきれいになりました。


###herokuコマンドで消す
herokuコマンドを使って消すこともできます。
herokuコマンドを使用すると、Heroku上のアプリもリモートリポジトリの設定もすべて消してくれます。

```console
$ heroku apps:destroy --app アプリ名
```

(`heroku apps:info`でアプリ名を確認できます。)
上記の`apps:destroy`を実行すると、確認のためアプリ名の入力を求められます。
アプリ名を入力して実行すると、アプリが削除され、リモートリポジトリの設定も削除されます。

`--confirm アプリ名`を付けて実行すると、アプリ名の入力は求められません。

```console
$ heroku apps:destroy --app アプリ名 --confirm アプリ名
```

以上でアプリを削除することができました。
Elasticsearch (Service) 5.xのKibanaでkibana.ymlを変更せずにWMSを利用してTileMapを表示したい！

位置情報をサクッと可視化しようかなーと思い、Amazon Elasticsearch Service (5.3)を立ち上げて geo_point に緯度経度を入れたら、、、なんじゃこら。地図が表示されない？！

![nomap.PNG](https://qiita-image-store.s3.amazonaws.com/0/22754/b58eec43-172c-852e-38c9-e979cab88f97.png)

TileMap界隈では[MapQuestさんの件から始まる一連の事件](http://dev.classmethod.jp/server-side/elasticsearch/kibana-openstreetmap/)が起こっていたのですね。知りませんでした。。。

Developers.IOではOpenStreetMapサーバを自前で構築して、そこから地図データを配信するという手法が紹介されていましたが、Amazon Elasticsearch Serviceでは kibana.yml を編集することがかなわず途方に暮れていましたが、WMS (Web Map Service) の設定を変更すればそれなりに表示できることが分かったのでご紹介

# ともかく地図を表示する

Elasticsearch の Visualize で tilemap の Options を開き *WMS compliant map server* のチェックをONにすると、フォームが表示されるので、下記のように設定します
※ある程度値が入っていると思いますが、上書きしちゃいます

| 項目 | 値 |
|------|---|
| WMS url | `http://ows.mundialis.de/services/service?` |
| WMS layers | `TOPO-OSM-WMS` |
| WMS version | `1.3.0` |
| WMS format | `image/png` |
| WMS attribution | 空白 |
| WMS styles | 空白 |

![es_setting.PNG](https://qiita-image-store.s3.amazonaws.com/0/22754/d53910cf-cb02-4f86-4b83-f464c8febf68.png)

入力したら *Apply Change* ボタンを押してみてください。下記のように地図が表示されます

![map.PNG](https://qiita-image-store.s3.amazonaws.com/0/22754/30d9c3c8-a5fd-0951-7473-0934e3c7e1e1.png)

なんというか趣のある表示ではありますが、しっかり表示されています！

## WMS サーバを探す

`WMS` や `Web Map service free` とかの検索でともかく探してみたら mundialis が提供している WMS にたどり着きました
https://www.mundialis.de/en/ows-mundialis/

ライセンスにはお気を付けください。mundialisさんは「You may use them free of charge as background layers for your application.」と言ってくれています。ありがたいですが、ご利用は常識の範囲内としましょう

## WMS (Web Map Service) について

[規格化されてる](http://www.opengeospatial.org/standards/wms)ものです
QueryStringを投げることでマップのタイル画像が返ってくるという、結構シンプルな仕組みです

ブラウザのInspectorウィンドウを表示しつつ、*WMS layers* を `TOPO-WMS` に変更してみたり *WMS format* を `image/jpeg` に変更してみたりして、リクエストURLがどのように変化するのかを見てみるのもいいでしょう

ただ、[Wikipediaに頼る](https://ja.wikipedia.org/wiki/Web_Map_Service)くらい情報が少ないのが残念です

※Warehouse Management System だと思った人は、その道の人ですね

# あとがき

やっぱ、無料で使い続けるって大変ですね。提供元には感謝です
json-serverで用意したjsonデータの中身が変わらないように使う

## 準備

ここでは、こんな感じのjsonを使います。

```json:db.json
{
  "users": [
    {
      "id": 1,
      "name": "john"
    },
  ]
}
```
> **まだインストールしてない人は**
>
```bash
$ npm i -g json-server
```

## JSONを指定して使う

JSON指定してサーバーを建てると、例えばPOSTでデータを送信した時はこうなります。

```bash
$ json-server db.json
```

```bash
$ curl -X POST -d name=james http://localhost:3000/users
$ curl http://localhost:3000/users
# [{"id": 1,"name": "john"},{"name": "james","id": 2}]
```

POSTしたばかりのデータが含まれていますが、db.jsonの中身も取得したデータと同じように更新されていると思います。

```js
$ cat db.json
# [{"id": 1,"name": "john"},{"name": "james","id": 2}]
```

## JSを指定して使う

これはただ、`.js`の中で`db.json`を読み込んで、`exports`関数でそれが返るようにするだけです。

```js:db.js
module.exports = () => require('./db.json');
```

JSONの場合と同じことをしてみます。

```bash
$ json-server db.js
```

```bash
$ curl -X POST -d name=james http://localhost:3000/users
$ curl http://localhost:3000/users
# [{"id": 1,"name": "john"},{"name": "james","id": 2}]
```

```js
$ cat db.json
# [{"id": 1,"name": "john"}]
```

レスポンスのデータではちゃんと更新されてますが、`db.json`は起動時のままです。

これで何度でも同じデータを使えるようになりました。あと、わざわざ`.json`を用意しなくても、`.js`でObjectっぽいデータを直で書いてもいいと思います。
AppleScriptでiTunesの曲名とアーティスト名を取得する（テスト投稿）

#目的

1. test
2. test
3. test
4. test
5. test

#CODE

```
repeat
	display dialog "Search" buttons {"Cancel", "Search"}
	
	copy the result as list to {button_pressed}
	
	if the button_pressed is "Cancel" then exit repeat
	
	repeat
		if the button_pressed is "Search" then
			
			tell application "iTunes"
				set trackName to name of current track
				set trackArtist to artist of current track
				display dialog trackName & " - " & trackArtist buttons {"Cancel", "Search"}
				copy the result as list to {button_pressed}
				if the button_pressed is "Cancel" then return
			end tell
		end if
	end repeat
end repeat
```

#解説

1. test
2. test
3. test
4. test
5. test
Emacsの各パッケージ（or 機能）に相当するAtomのパッケージ

# はじめに
Emacsのヘビーユーザーですがなんとなく気分を変えたくてAtomを触ってみたのでその時の設定備忘録です．
筆者はAtom超初心者ですので間違い等ございましたらご指摘ください．

## キーバインド関連
- [atomic-emacs](https://atom.io/packages/atomic-emacs)
- [emacs-plus](https://atom.io/packages/emacs-plus)

これだけでほぼAtomがEmacs化します．ただし，`C-k`がAtomではプレフィックスに設定されてしまっているのでこれを無効化します．

- [disable-keybindings](https://atom.io/packages/disable-keybindings)

設定画面で`Except Community Packages`に`emacs-plus, atomic-emacs`を追加，`Prefix Keys`に`ctrl-k`を追加します．
これ以降，あらゆるパッケージのキーバインドが無効になるのでパッケージを追加するたびに`~/.atom/keymap.cson`に設定を追加します．


## [dired](https://www.emacswiki.org/emacs/DiredMode), [neotree](https://github.com/jaypei/emacs-neotree)
- [tree-view](https://atom.io/packages/tree-view)
- [auto-project](https://atom.io/packages/auto-project)

Atomにはデフォルトで`neotree`風の`tree-view`なるパッケージが入っています．ただし`neotree`では開くたびに編集中のファイルがあるフォルダのツリーを表示するのに対して`tree-view`では明示的に追加したプロジェクトのツリーしか表示されません．
これを解決するのが`auto-project`で，これでほぼ`neotree`と同様の機能となります．呼び出し用のホットキーは好みのものを`~/.atom/keymap.cson`に追加．以下の例では`C-\`をホットキーに設定してます．

```.cson:~/.atom/keymap.cson
'body':
  'ctrl-\\': 'tree-view:toggle'
```

## [shell-pop](https://github.com/kyagi/shell-pop-el)
- [platformio-ide-terminal](https://atom.io/packages/platformio-ide-terminal)

同様のものが幾つかあるので好みのもの，もしくは環境でしっかり動作するものを選びましょう．Emacs上のシェルは`eshell`にしろ`ansi-term`にしろ常用するには色々厳しかったですが`platformio-ide-terminal`は完全なターミナルエミュレータであり普通のターミナルとしてしっかり使えます．ホットキーの設定を忘れずに．

## [isearch](https://www.emacswiki.org/emacs/IncrementalSearch)
- [incremental-search](https://atom.io/packages/incremental-search)

Atomにはもちろんデフォルトでサーチ機能があるがEmacsユーザー的にはごてごてし過ぎなので好みで同パッケージを入れるといいです．例えば以下のようなキー設定をすると良いでしょう．

```.cson:~/.atom/keymap.cson
'.platform-win32 atom-workspace atom-text-editor:not(.mini), .platform-linux atom-workspace atom-text-editor:not(.mini)':
  'ctrl-s': 'incremental-search:forward'

'.platform-win32 atom-workspace .isearch atom-text-editor, .platform-linux atom-workspace .isearch atom-text-editor':
  'ctrl-s': 'incremental-search:forward'
```

## [quickrun](https://github.com/syohex/emacs-quickrun)
- [script](https://atom.io/packages/script)

特に説明はなく`quickrun`と同様です．設定画面の`Default Current Working Directory(CWD) Behavior`を`Directory of the script`にしておきましょう．
ほぼすべてと言って良い言語に対応しており，Hyも動かせるのがGood．

## [hl-line](https://www.emacswiki.org/emacs/HighlightCurrentLine)
- [highlight-line](https://atom.io/packages/highlight-line)

特に説明はなし．

## [py-yapf](https://github.com/paetzke/py-yapf.el), その他各コードフォーマッター
- [atom-beautify](https://atom.io/packages/atom-beautify)

コード整形ツール．HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, Coldfusion, SQLなどなどが整形できます．
保存時に実行する場合は設定画面の`General` → `Beautify Entire File On Save`にチェックを入れておきます．

## その他
- [atom-hide-tabs](https://atom.io/packages/atom-hide-tabs)

Atomはファイルを開くとタブがたくさん出来て鬱陶しいので好みで入れる．任意のホットキーを設定しておけばタブを表示したり非表示にしたりできます．
例えば`F1`をホットキーにするなら以下のような設定を`~/.atom/keymap.cson`に追加します．

```.cson:~/.atom/keymap.cson
'body':
  'f1': 'atom-hide-tabs:toggle'
```

# おわりに
Atomをはじめて使って見ましたが結構Emacsの代替として機能しそうな感じです．TUIでのEmacsの置き換えにはなりませんがGUIならEmacsと十分並んでいると思います．
Windows環境ならEmacsよりも全然アリかと思います．
markdownを見出しごとに<section>で囲んだHTMLにする

自分用メモも兼ねて。jQueryとmarked.jsを使います。

# markdownをHTMLへ変換

markdownはすでにテキストとして取得できて`markdown`変数に格納されているものとします。また、\<main\>の中に\<article\>を作り、その中にmarkdownをHTMLに変換したものを入れます。

marked.jsはとても簡単で、marked関数にmarkdownのテキストを渡すだけでHTMLが返ってきます。

```javascript
const HTML = marked(markdown);
$("main").append(`<article>${HTML}</article>`);
```

このコードはmarkdownをHTMLに変換し、\<main\>に\<article\>として追加します。

これでmarkdownをただ入れるだけのことはできますが、今回は見出しごとに\<section\>を入れるので、さらにひと工夫します。

---
# &lt;section&gt;で囲む

HTMLをjQueryで操作します。先ほどのコードに以下を追加します。また、h2以降を対象とします。

```javascript
$("main article").find("h2, h3, h4, h5, h6").each(() => {
    const $this = $(this);
    $this.nextUntil($this.prop("tagName")).addBack().wrapAll("<section></section>");
});
```

このコードは、\<main\>の中の\<article\>の中にある\<h2\>, \<h3\>, \<h4\>, \<h5\>, \<h6\>からそれぞれ、次に同じ見出しタグが現れるか、\<article\>や\<section\>の最後に到達するまでの間にある要素を取得し、はじめの見出しと合わせて\<section\>で囲みます。

これで\<section\>で囲むコードは完成です。

---
<!--
#おまけ(はなかったことに)

\<section\>と\<aside\>を使い分けたいときは、markdownで以下のようにクラスをつけます。今回は`.aside`としました。--

```markdown
### 補足 {.aside}
```

marked.jsはデフォルトではクラスに対応していないので、簡易対応させます。

```javascript
var renderer = new marked.Renderer();
renderer.heading = function(text, level, raw){
    //見出し
    var classText = text.match(/ \{\..+\}/g);
    if(classText){
        //クラスが指定されていれば
        var className = classText[classText.length-1].slice(3, classText.length-2);
    }
    return "<h"+level+' id="'+this.options.headerPrefix+raw.toLowerCase().replace(/[^\w]+/g, '-')+'"'+(className? ' class="'+className+'"':"")+'>'+ text+ "</h"+ level+ ">\n";
};
```

また、markdownからHTMLに変換する所を以下のように書き換えます。

```javascript
marked(markdown, {renderer: renderer});
```

そして、先ほどのコードを以下ように書き換えます。

```javascript
$("main article").find("h2, h3, h4, h5, h6").each(function(){
    var $this = $(this);
    $this.nextUntil($this.prop("tagName")).andBack().wrapAll($this.hasClass("aside")? "<aside></aside>":"<section></section>");
});
```

このコードはhasClassでクラスが付いてるか判定し、三項演算子で\<aside\>と\<section\>を分けています。三項演算子を使いたくない方は以下のようにしても動作します。

```javascript
var wrapper;
if($this.hasClass("aside")){
    wrapper = "<aside></aside>";
}else{
    wrapper = "<section></section>";
}
$this.nextUntil($this.prop("tagName")).andBack().wrapAll(wrapper);
```

このコードは、三項演算子の代わりに変数とif文を使って書いています。

---
-->
# あとがき

今回が初のQiita投稿です。なにか間違い等ありましたら指摘して頂けるとありがたいです。

たまたまmarkdownを扱うことがあり、「\<section\>を使うにはどうしたらいいんだろう」と思い、考えたことを書きました。この記事が役に立つことがあれば幸いです。最後まで読んでいただきありがとうございました。
qiita api v2 を 触って typescript での APIでの記事投稿方法を知る Ver. 20170611


## 概要

* [vscode で qiita とかのブログに投稿する extension作れないのかな](http://qiita.com/wenbose/items/3a4425f69b9eb2fe52c6)
    * にてAPIアクセスの部分だけ大きくなりそうだったので切り出しました

## 公式ページ

* [Qiita API v2ドキュメント - Qiita:Developer](https://qiita.com/api/v2/docs)
    * [Qiita API v2 の概要 - Qiita](http://qiita.com/tag1216/items/b0b90e30c7e581aa2b00)

## 記事投稿までの道のり

* 取りあえずはこんなところでしょうかね。

* qiita apiの概要について
* typescript json api の投げ方はどうすればいいか学ぶ
    * 適当なAPIにtypescriptだけでアクセスしてみる
* qiita の 認証/認可 について学ぶ
* qiita の api での 記事投稿 の仕方を学ぶ

### qiita api の概要について

* 取りあえず公式ページを見た感じでは下記の通り

* 基本は HTTPSアクセスのREST API + json でのやり取り
* GET 正常が 200, POST 正常が 201, PUTとDELETE 正常は 204
* エラーやその他は3xx,4xx,5xx 系

* 正常系コードの返答が201とか204を使っている以外は特に変なことをしていない気がする

### typescript json api の投げ方はどうすればいいか学ぶ

* 取りあえずはtypescript で restAPI+jsonでアクセスするサンプルはないか！！と思ったらこんなのが。
    * [GitHub - Microsoft/typed-rest-client: Node Rest and Http Clients with typings for use with TypeScript](https://github.com/Microsoft/typed-rest-client)
* これならvscode の 拡張と相性いいのでは、という事で読んでみることに。
GitHubで使える静的解析ツール【Java編】

とりあえず現状の開発言語はJavaなので、Javaのコードチェックが出来るものメモ


## CodeBeat

https://codebeat.co/

GitHubマーケットプレイスの Code quality ジャンルにあった。
GitHubと連携するだけでOKなところは素晴らしいが、変なコード書いてもちゃんと認識してくれていない。
暇があったらもうちょっと調べる。

<img width="871" alt="2017-06-11_18h03_21.png" src="https://qiita-image-store.s3.amazonaws.com/0/83984/748783d2-5749-ed22-e971-5735351a03f8.png">



## Codacy
https://www.codacy.com/

同じくマケプレのコードレビュー。
いい感じのインターフェイスで CodeBeat と同じく連携するだけ。

<img width="730" alt="2017-06-11_18h12_40.png" src="https://qiita-image-store.s3.amazonaws.com/0/83984/1017fe4b-2b7e-7f3a-6667-f250d6ba120d.png">

Style Checkもしてくれて、修正履歴まで追える。すごい。

<img width="511" alt="2017-06-11_18h13_18.png" src="https://qiita-image-store.s3.amazonaws.com/0/83984/2d69aa25-e088-1a03-cd44-62226aa197f1.png">


## gnag
https://github.com/btkelly/gnag

Gradleプラグイン。
Gradleなのでローカルでも動かせるし、 Travis CI や Circle-CI で動かせる。
テストと一緒に静的解析もできるのは利点だけど、出力がイマイチなのと、
GitHubにコメントするのに Pull Request No を指定しないといけないのがウーン…といったところ。

どういう運用をしたらいいんだろう？

## その他

* CodeCov
https://codecov.io/
試してない

* Android CI check Gradle
http://qiita.com/noboru_i/items/2f30296db1c8a6dfbd9b
試してない
SeleniumでChromedriverが内包しているextensionを使わないようにする

Seleniumでchromeを動かす時に、[chromedriver](https://sites.google.com/a/chromium.org/chromedriver/)を使います。
このchromedriverは、内部に専用のChrom拡張を内包していてそれを自動操作に利用しています。

通常はそのことを特に意識する必要はないのですが、弊社だと任意のChrome拡張の利用を制限しているため、これをインストールできずにSeleniumの実行自体が失敗していまいます。

それに対処するためには、以下のようにすることでこのChrome拡張の利用をOFFにすることができるようです


```ruby
driver = Selenium::WebDriver.for :chrome,
  desired_capabilities: { chromeOptions: {useAutomationExtension: false} }
```

これは、2017/03 ごろに以下の修正で取り込まれた機能のようです。
https://codereview.chromium.org/2785413002

元を正すと以下のissueからの派生で、headlessモードのサポートにあたってこのChrome拡張を廃止してDevToolsに機能を移すことが行われているようです。
https://bugs.chromium.org/p/chromium/issues/detail?id=604324


### 追記 2017/06/27

proxyの設定を行う場合は以下のようにするらしい

```ruby
proxy = Selenium::WebDriver::Proxy.new(:pac => "http://myproxy/proxy.pac")
driver = Selenium::WebDriver.for :chrome,
  desired_capabilities: { chromeOptions: {useAutomationExtension: false}, proxy: proxy }
```
LoRaWAN開発Arduinoシールド "AL-050" を Raspberry PiやPCで使う

IoT向けの中距離無線として注目されている[LPWA](https://ja.wikipedia.org/wiki/LPWA_(%E7%84%A1%E7%B7%9A))
その中でも今すぐ使えるLPWAとして LoRaWAN があります

[ソラコム](https://soracom.jp/)からLoRaWANで通信ができる[Arduino UNO R3のシールド(拡張ボード)](https://soracom.jp/products/lora/al-050/)を販売していますが、実はこのシールド、Arduinoだけでなく **Raspberry PiやPCからでも使える方法がある**ので、その紹介です

# 概要

[AL-050の販売ページ](https://soracom.jp/products/lora/al-050/)からダウンロードできる[ドキュメント](https://soracom.jp/files/products/AL-050-UsersManual-v.1.4.pdf)の5ページ目にこんなことが書いてあります

![al-050-manual-p5.png](https://qiita-image-store.s3.amazonaws.com/0/22754/52de025d-fee7-6c22-432f-dc64fa09e850.png)

※PDFより抜粋

要するに **シールドのD12をD0と、D11をD1とそれぞれ接続し、USBポートで接続するとPL2303HXDなUARTデバイスとして見えるよ** ということです
別にArduinoじゃなくても良かったんだ！

# 論より実証

1. マニュアル通りに接続

![ファイル_000 (1).jpeg](https://qiita-image-store.s3.amazonaws.com/0/22754/e6e01c8a-66b5-a90c-f50f-6bd972ceb46b.jpeg)

2. PL2303HXDのWindows 10のドライバをProlific Technologyから[ダウンロード](http://www.prolific.com.tw/US/ShowProduct.aspx?p_id=225&pcid=41) & インストール

3. おもむろにターミナル(TeraTerm)で接続、動かしてみる

![al-050-teraterm.png](https://qiita-image-store.s3.amazonaws.com/0/22754/a02ca09f-069f-e521-874d-011c8f70de45.png)

```
> mod get_ver
>> V1.3.1-ar-Mar 18 2017-16:32:02
> mod get_hw_model
>> TLM922S-P01A-ffffffffffffffffffffffff
```

`mod get_ver` や `mod get_hw_model` が AL-050 のコマンドです。ほかのコマンドはマニュアルに書いてありますので、それを参照ください

Raspberry Pi等のLinuxから使う場合はscreenコマンドとか使ってください

# LoRaWANを使ってみる

ソラコムからAL-050を購入すると、[SORACOM Air for LoRaWAN](https://soracom.jp/services/air/lora/)のネットワークサーバに登録された状態で、手元に届きます

そのため、誰でも使える共有ゲートウェイ※があれば、すぐにでもLoRaWANを試すことができます。具体的なコマンドシーケンスを掲示しておきます
※共有ゲートウェイがどこに設置されているかは [SORACOM LoRa Space](https://lora-space.soracom.jp/) で確認できます。お近くにあるといいですね

※ `>` が入力 `>>` がレスポンスです

モジュールのリセットを行った後、over-the-air activation(OTAA)モードでLoRaWANネットワークにjoinし、 `Hi!LoRaWAN!` というデータを送信している例

```
> mod factory_reset
>> OK
> lorawan join otaa
>> accepted
> lorawan tx ucnf 1 4869214c6f526157414e21
>> Ok
>> tx_ok
```

## 送受信に使うASCII HEX表現について

AL-050 は送受信のデータ表現にASCII HEX(hexadecimal)を使います。これにより、non-printable なデータを送ることが可能です

これを操作する簡単な方法として pack/unpack があります

### Ruby で操作する

```ruby
# 作る(送信時の操作)
> "Hi!LoRaWAN!".unpack("H*").first
=> "4869214c6f526157414e21"

# 戻す(受信時の操作)
> ["4869214c6f526157414e21"].pack("H*")
=> "Hi!LoRaWAN!"
```

# あとがき

UARTプログラミング、ばんざい
NodeJSでターミナルサイズの取得

サイズを取得したいと思ったので。
`term-size`というパッケージを使うと楽に取得できます。これはmacやlinuxだけじゃなくwinにも対応してます。

## インストール

```bash:npm5
npm i term-size
```

```bash:yarn
yarn add term-size
```

## 使う

```js
const termSize = require('term-size');
// import termSize from 'tarm-size';
console.log(termSize());
```

```bash
$ node index.js                                                                                                                                                                         
{ columns: 212, rows: 27 }
```
DE0-Nano-SoCでLチカするだけ

# はじめに
FPGAよく分かってない人がとりあえずDE0-Nano-SoCを買って
よくわからないまま仕様書を読んで配線するだけの記事
VHDL？Verilog HDL？なにそれ美味しいの？
と言う感じのレベル感の人。

# ボタンを押したら光るような感じにしたい。

1. このあたりのリンクとかを参考にプロジェクトとかを立ち上げる
https://service.macnica.co.jp/library/113049

1. このDE0-Nano-SoCのFPGAに繋がってるボタンとLEDの配線の仕様を事前に読んでおく([仕様書](http://www.terasic.com.tw/cgi-bin/page/archive_download.pl?Language=English&No=941&FID=65cce14b2f7ea53d00de4dbdc8678b80))
ボタンの配線
![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/96a10eb9-0416-8cd9-28df-d1193493064e.png)
LEDの配線
![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/1dffda26-70e3-5214-3b1c-2bf01ddbfa7f.png)

仕様書によると、ボタン（KEY0またはKEY1）を押さない場合は3V電源がLEDに常につながってる状態。
つまりは、このまま下記の図のように直接配線するとLEDに繋げるとLED光りっぱなしになる。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/990bc856-4b94-601e-50e3-93cac43f9261.png)

押したら光らせたいので、この配線にNot回路を付け加えた感じの回路にしたい
![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/74e84394-4564-3fdc-68f8-0e0a347b2ab9.png)

と言うわけで、それでこんな感じの配線をさせるvhdlを書く。

```vhdl
library ieee;
use ieee.std_logic_1164.all;

entity LED_blink is
port (
		Key0	:	in std_logic;
		Key1	:	in std_logic;
-- LEDの配列、0-3までを今回は使う
		LEDs	:	out std_logic_vector(3 downto 0)
);
end LED_blink;

architecture ledBtn of LED_blink is 
begin 
	LEDs(0) <= not Key0;
	LEDs(1) <= not Key1;
-- LEDの2番と3番はボタンが押されたら消えるようにする
	LEDs(2) <= Key0;
	LEDs(3) <= Key1;
end ledBtn;
```
---
PinPlannerでFPGA上に配線していく。
下記画像の1のボタンを押すとシンボル名とかがPinPlannerに反映されるっぽいので、それが終わったら2版のボタンを押してPinPlannerを起動する。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/9113ff35-d70e-e421-f92b-256d8e768abe.png)


DE0-Nano-SoCのボタン及びLEDは次のピンに対応している（仕様書に書かれている通り）
ピン番号：名称
AH17：KEY0
AH16：KEY1
PIN_W15：LED0
PIN_AA24：LED1
PIN_V15：LED2
PIN_V16：LED3

PinPlannerを起動するとこんな感じになるので、配線していく。
Locationの部分をダブルクリックするとリストが出るのでそこから配線するべき端子を選ぶ。コピペ・文字での入力も可能
![a.gif](https://qiita-image-store.s3.amazonaws.com/0/30037/c7ee46a5-e6c1-c8e2-44c0-7ea07d608115.gif)


配線したら、PinPlannerを閉じてQuartusに戻ってコンパイル
![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/1e68aafc-c9bf-ddb2-7b65-76781ede9ab6.png)

コンパイルが終わったら、FPGAの下記図の赤丸の端子（USBブラスター端子）とPCを接続（他の端子は、電源以外繋がなくてOK）

![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/175ab09a-5ecc-7aea-30e5-56632883b46c.png)

次にプログラマを立ち上げてファイルを転送する。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/30037/e6198bb2-3296-6940-e235-5d892acd6906.png)

何も押してない時
![20170611_165947.jpg](https://qiita-image-store.s3.amazonaws.com/0/30037/1e4b3bf5-14a2-3000-9d38-8604aef6c8d0.jpeg)
両方おした時
![20170611_165953.jpg](https://qiita-image-store.s3.amazonaws.com/0/30037/4c1c2aaa-f59e-a93c-ab02-6f942dd9d344.jpeg)
片方だけおした時
![20170611_170000.jpg](https://qiita-image-store.s3.amazonaws.com/0/30037/57ea185a-66cb-8966-fb03-5a5b4d14c721.jpeg)

おわり
link_toでサブドメインを指定したいとき

Railsでlink_toでサブドメインを利用したいときがありますよね。

しかし、このように書いてもサブドメインは指定されません。

```rb
= link_to "サブドメインへ", root_path(subdomain: "xxx")
```

## _pathではなく_urlを利用する

```rb
= link_to "サブドメインへ", root_url(subdomain: "xxx")
```

これでサブドメインもバッチリですね！

以上スタックオーバーフローからでした笑。
https://stackoverflow.com/questions/42014992/rails-link-to-passing-a-subdomain
PicodomとMobxでTodoAppっぽいの作ってみた

最近、少し[Picodomを触ってみた](http://qiita.com/nju33/items/280a5c79915ed414c148)のでなので、何か他のライブラリとも組み合わせて使ってみたいなと思い、今回Mobxで状態管理Picodomでレンダリングの組み合わせで試してみます。

## メタデータ

- 動作確認 - [jsFiddle](https://jsfiddle.net/nju33/3Lnmjjth/)  
  ![Picodom___Mobx_-_Todo_app_-_JSFiddle_🔊.png](https://qiita-image-store.s3.amazonaws.com/0/84144/cd890caf-4aae-ba4e-09fd-c1bbe140f03b.png)
- ソースコード - [nju33/example-picodom-mobx](https://github.com/nju33/example-picodom-mobx)

## 動作説明

どちらもシンプルなので、あまり説明することもないです。
MobxなStateのインスタンスを作成して、ViewでStateの状態が変わるたびに、Picodomの`patch`が走るような仕組みです。要約するとこんなです。

```js
const store = observable(...);
let _element = null;
let _oldNode = null;
autorun(() => {
  // 関数内でstoreが変更される
  const newNode = createNode(store);
  _element = patch(document.body, _element, _oldNode, newNode);
  _oldNode = newNode;
});
// Storeを変更するようなActionを持ったViewを作る
function createNode(store) {...}
```

`autorun`はObservableな値が変わると自動で走るので、Storeを更新するたび手動で`patch`する必要がなくなります。（例えば、配列に要素を追加した時や、配列内の要素の値を更新した時とか）

## やろうと思ったけどやってないこと

### コンポーネント毎のファイル分割

多分こんな感じ。

```js:hello.js
export default class Hello {
  node({name}) {
    return <div>{name}</div>
  }
}
// 無理にclassにしなくてもいいかも
function hello({name}) {
  return <div>{name}</div>
}
```

```js:index.js
import {h, patch} from 'picodom';
import Hello from './hello';

const hello = new Hello();
patch(
  document.body,
  null,
  null,
  <hello.node name="nju33"/>
)
```

## 思ったこと

- `patch`はroot部分だけでやること
- State管理ライブラリと使っちゃうとメリット減っちゃってる感がすごい
- Webpackしちゃうとメリット減っちゃてる感がすごい(-> rollup)
- やっぱりsvelte?（`if`の書き方とかがあんまり好きじゃないけど）
- [`picodom/dist/picodom`](https://github.com/nju33/example-picodom-mobx/blob/master/src/app.js#L1)としてるように、`picodom`だけだと`./h`が無いとかで怒られる（たしかに無い）のでそのあたり心配になる（自分だけ？）
CentOS7.3にMySQL5.7をyumでインストールする

環境が整ってきた。今回はDBを入れるの巻。

#これまでのおさらい
1. vagrantでCentOS7.3の環境を作った:[参照](http://qiita.com/panappe/items/a876e06488fab4a9af8b)
2. CentOS7.3の環境にPHP7.1をインストールした:[参照](http://qiita.com/panappe/items/9963e18da8dd4d1bf994)
3. Laravel 5.4をインストールした:[参照](http://qiita.com/drafts/b5ce191b6156a0fa1ed5)
4. nginxのインストール：[参照](http://qiita.com/panappe/items/f7a9b3d906810406f543)
5. nginxでLaravel5.4が動いたー：[参照](http://qiita.com/panappe/items/8ab2ec43bdf48ad15bac)
6. MySQL5.7入れるよ〜　←今回

#CentOS7.3にMySQL5.7をyumでインストールする
##1.mariaDBの削除
CentOS7にはデフォルトでmariaDBが入っているとのことで削除する
いるかな、いるかな？

###1-1.mariaDBがインストールされていることの確認

```console
$ rpm -qa | grep maria
mariadb-libs-5.5.52-1.el7.x86_64
```

いました。
今回はバッサリいきます :haircut:

###1-２.mariaDBとデータの削除
```console
$ sudo yum remove mariadb-libs
$ sudo rm -rf /var/lib/mysql
```

綺麗さっぱり :information_desk_person:

##2.MySQL5.7のインストール
(参考)https://dev.mysql.com/doc/mysql-yum-repo-quick-guide/en/

###2-1.公式リポジトリを追加
最新は 「mysql57-community-release-el7-11.noarch.rpm」 のよう。

```console
$ sudo rpm -Uvh http://dev.mysql.com/get/mysql57-community-release-el7-11.noarch.rpm
```

###2-2.mysqlをインストール

```console
$ sudo yum install --enablerepo=mysql57-community mysql-community-server
```

###2-3.確認する

```console
$ mysqld --version
mysqld  Ver 5.7.18 for Linux on x86_64 (MySQL Community Server (GPL))
```
よーし :ok_woman:

###2-4.自動起動の設定

```console
$ systemctl enable mysqld.service
```

###2-5.起動する
```console
$ systemctl start mysqld.service
```

###2-6.mysqlに入る

パスワードがログに出力されているらしいので、以下のコマンドで確認する。

```console
$ sudo grep 'temporary password' /var/log/mysqld.log
2017-06-11T07:11:58.756355Z 1 [Note] A temporary password is generated for root@localhost: XXXXXXXXXXXX
```
XXXXXXXXXXXXの部分にパスワードが表示される。
このパスワードを使って入る。

```console
$ mysql -uroot -p
Enter password: XXXXXXXXXXXX
Welcome to the MySQL monitor.  Commands end with ; or \g.
Your MySQL connection id is 5
Server version: 5.7.18

省略...
```

入れた :runner_tone1:

###2-7.SELECTしてみる

```console
$ mysql> select host, user from mysql.user;
ERROR 1820 (HY000): You must reset your password using ALTER USER statement before executing this statement.
```

あちゃ :sweat_smile:
まずは新しいパスワードを設定する必要があるみたい。
パスワードの強度が低いと変更できないので、とりあえずマニュアル通りのパスを設定。

```console
$ mysql> ALTER USER 'root'@'localhost' IDENTIFIED BY 'MyNewPass4!';
Query OK, 0 rows affected (0.00 sec)
```

でけた :ok_hand_tone2:

```console
$ mysql> select host, user from mysql.user;
+-----------+-----------+
| host      | user      |
+-----------+-----------+
| localhost | mysql.sys |
| localhost | root      |
+-----------+-----------+
2 rows in set (0.00 sec)

```

よーし。
とりあえず使えたワッショイ :lifter: