OmniAICreator/Qiita-1.07M huggingface dataset:
[Nmap][Ruby] nmap -sP の実行結果を Ruby で見やすく加工する

# 概要

[Nmap](https://nmap.org/man/ja/man-port-scanning-basics.html) をインストールして

```
nmap -sP ネットワークアドレス
```

というコマンドを実行すると、LAN 内の端末と割り当てられた IP アドレスを調べることができる。

```
$ sudo nmap -sP 192.168.0.0/24
```

```
Starting Nmap 7.70 ( https://nmap.org ) at 2019-04-12 21:26 JST
Nmap scan report for 192.168.0.1
Host is up (0.0049s latency).
MAC Address: 90:F3:05:AC:EE:B6 (Humax)
Nmap scan report for 192.168.0.11
Host is up (0.0066s latency).
MAC Address: 34:AF:2C:25:A9:25 (Nintendo)
Nmap scan report for 192.168.0.12
Host is up (0.0056s latency).
MAC Address: 70:9E:29:82:0E:2C (Sony Interactive Entertainment)
Nmap scan report for 192.168.0.23
Host is up (0.041s latency).
MAC Address: F0:99:B6:88:88:97 (Unknown)
Nmap scan report for 192.168.0.13
Host is up.
Nmap done: 256 IP addresses (5 hosts up) scanned in 3.40 seconds
```

ただどうにも視認性が悪い。どの端末がどの IP アドレスなのかが分かりづらい :worried:

そこで Ruby を使って実行結果をわかりやすく加工してみた。

# Ruby スクリプト

## コード

```rb
#! /usr/bin/env ruby
require 'open3'

NETWORK_ADRESS = '192.168.0.0/24'.freeze

class NmapResult
  IP_ADDRESS_PATTERN = /\d+\.\d+\.\d+\.\d+/.freeze

  attr_reader :lines

  def self.parse(stdout)
    _header, *lines, _footer = *stdout.split("\n")
    lines
      .slice_when { |_l1, l2| l2.match?(IP_ADDRESS_PATTERN) }
      .map { |partial_lines| NmapResult.new(partial_lines) }
  end

  def initialize(lines)
    @lines = lines
  end

  def ip
    lines[0][IP_ADDRESS_PATTERN]
  end

  def mac_address
    return nil unless lines[2]

    lines[2][/([\dA-F]{2}:){5}[\dA-F]{2}/]
  end

  def device
    return nil unless lines[2]

    lines[2][/(?<=\()[\w\s]+(?=\))/]
  end
end

stdout, = Open3.capture2("sudo nmap -sP #{NETWORK_ADRESS}")
results = NmapResult.parse(stdout)
results.each_with_index do |result, i|
  puts if i.positive?
  puts(result.ip)
  if result.device
    puts("#{result.device} (#{result.mac_address})")
  else
    puts('この端末')
  end
end
```

## 実行結果

```
$ ruby nmap.rb  
```

```
192.168.0.1
Humax (90:F3:05:AC:EE:B6)

192.168.0.11
Nintendo (34:AF:2C:25:A9:25)

192.168.0.12
Sony Interactive Entertainment (70:9E:29:82:0E:2C)

192.168.0.23
Unknown (F0:99:B6:88:88:97)

192.168.0.13
この端末
```

見やすくなった 🤗
Vue.jsの応用について-コンポーネント

# 完成イメージ
<img width="402" alt="スクリーンショット 2019-04-12 21.42.27.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/114933/4f6e36b6-dc7f-2081-169f-5dcac6fa3586.png">

# ソースコード
ドットインストールを参考にしてます。
https://dotinstall.com/lessons/basic_vuejs_v2
※プレミアム会員のみ閲覧可能

### ↓細かい説明はコメントアウトでまとめてます↓
```vue:index.html
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>My Sample Vue App2</title>
  <link rel="stylesheet" href="css/styles.css">
</head>
<body>

  <div id="app">
    <p>Total Likes {{total}}</p>
    <!-- messageでcomponentにカスタム属性として値を渡す -->
    <like-component message="Like" @increment="incrementTotal"></like-component>
    <like-component message="Awesome" @increment="incrementTotal"></like-component>
    <like-component message="Great" @increment="incrementTotal"></like-component>
    <like-component @increment="incrementTotal"></like-component>
  </div>
  <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
  <script src="./js/main.js"></script>
</body>
</html>
```

```js:main.js
//プロパティの設定には、;はつけない
(function(){
  'use strict';

  // コンポーネント(component)は名前付きの再利用可能なVueインスタンス
  // 独自のタグを書くことができる
  //extendで囲って、中身の定義をtemplateで書く。
  //templateに書ける要素は１つのみ。複数書きたい場合は<div>とはで親要素を作ってあげる。
  
  let likeComponent = Vue.extend({
    //""の中は''でないとエラーになる
    template: "<button @click='countUp'>{{message}}{{count}}</button>",
    //配列でキーを受け取りますとしている。
    // props: ["message"],
    //propsにデフォルト値や型を指定するには、オブジェクトとして書く必要あり。
    props: {
      message:{
        type: String,
        default: "Like"
      }
    },
    // dataをコンポーネント定義の中で使用する場合は、Functionタイプのみ受け付ける
    data: function(){
    //設定したプロパティをreturnする時は{}で囲む必要あり。  
      return{
        count: 0
      }
    },
    methods: {
      countUp: function(){
      //プロパティはthisで取得できる
        this.count++;
      //componentから親要素に対してincrementというカスタムイベントを発火させるには$emitを使う。
      //view側で@increment="incrementTotal"を仕込む。
      //親要素にデータを渡したい時は、このようにする。
      //イベントの発火のみcomponent側でやり、data,methods設定は親要素で行う。
        this.$emit("increment");
      }
    }
  })

  const vm = new Vue({
    el: "#app",
    // componentsの登録。#appに対して、このcomponentを使うよ、と宣言。
    components: {
      //like-component(タグで使う)の中身はlikeComponentというオブジェクトとする
      // 末に;つけるとエラーになる。
      "like-component": likeComponent
    },
    data: {
      total: 0
    },
    methods: {
      incrementTotal: function(){
        this.total++;
      }
    }
  })
})()
```
UnityのiOSビルド時にplistの項目を追加する方法

## はじめに
[こちら](https://qiita.com/ko2ic/items/407f2e2841b355ebd126)の記事で `Google Mobile Ads SDK ver 7.42.0`からiOSビルド時にplistの追加が必要になったとの事で、対応を自動化できる方法をメモ

## 実装環境
- Unity 2018.3.8f1
- Xcode 10.2


## 方法
1. `Assets/Editor` 下でファイルを生成  
(Editorフォルダ内であれば問題ないので、自分は`Assets/Editor/hoge/Editor`下に置いてます)  

2. 実装例

```C#:PostXcodeBuild.cs
using System.IO;
using UnityEditor;
using UnityEditor.Callbacks;
using UnityEditor.iOS.Xcode;

namespace Hoge
{
    public class PostXcodeBuild
    {
        [PostProcessBuild]
        public static void SetXcodePlist(BuildTarget buildTarget, string pathToBuiltProject)
        {
            if (buildTarget != BuildTarget.iOS) return;
            
            var plistPath = pathToBuiltProject + "/Info.plist";
            var plist = new PlistDocument();
            plist.ReadFromString(File.ReadAllText(plistPath));

            var rootDict = plist.root;
            // ここに記載したKey-ValueがXcodeのinfo.plistに反映されます
            rootDict.SetString("GADApplicationIdentifier", "hogehoge");
            
            File.WriteAllText(plistPath, plist.WriteToString());
        }
    }
}
```

`[PostProcessBuild]`を付け、 `public static` なメソッドであればメソッド名やクラス名は特に指定ありません

## 補足
・カメラ、位置情報、マイク等の許可設定はPlayer Settings の Other Settings内で記述することで対応可能です
![スクリーンショット 2019-07-04 15.31.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/236499/e22880e8-0452-2ebc-f3ca-23ebf93cdbe1.png)
・`CreateArray`や `CreateDict` メソッドを用いることで入れ子構造にすることが可能です

## 参考サイト
- [[Unity] PostProcessでビルド後に処理を差し込む](https://qiita.com/edo_m18/items/346439f7678218e85e69)
- [UnityのiOSビルド時のplist設定の自動化](https://qiita.com/am10/items/e4527ab17ea66de92731)
32日目 発達さん住みよいマップをつくりたい


先週、[ハッタツソン](http://hattatuson.strikingly.com/) というイベントに参加しました。
ほんと初心者ですが、アイデアがアプリになるまでを体験できて良かったです。
Qiitaのおかげで`Ruby on Rails` の環境も構築できました。感謝！

さて、アイデアソンで出したアイデア、どれもこれも作りたい！
今日はその中の「発達さん住みよいマップ」にチャレンジしてみます。

なぜこのアプリを作りたいかというと・・・

>市区町村で対応違いすぎ！
そして発達さんが多いと住みごこち良いです。
そうした情報を地図で表現できたら便利かなとおもいました。
https://twitter.com/robamimim/status/1114167234593603584

障害をもって暮らしていくには、地域にどれだけ受け入れられるかが、生活のクオリティを左右します。
十分な支援と配慮があり、無理なく働き自立が可能な地域もあれば、人種隔離政策かって地域まで。
それが隣り合っていたりもするので、可視化できたらいいなーと思いました。

---

さて、地図アプリってどうやって作るのでしょう。調べてみました。

[地図アプリの開発を爆速化する「Webマッピング」サービスの活用術を大公開！](https://paiza.hatenablog.com/entry/2016/03/14/%E5%9C%B0%E5%9B%B3%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AE%E9%96%8B%E7%99%BA%E3%82%92%E7%88%86%E9%80%9F%E5%8C%96%E3%81%99%E3%82%8B%E3%80%8CWeb%E3%83%9E%E3%83%83%E3%83%94%E3%83%B3%E3%82%B0%E3%80%8D%E3%82%B5)

なるほど、`Google　Map`を使うのが簡単そうです！

APIとか難しそうな事はあとで考えることにして・・・
ためしに記事のとおりに LinkDataからさくら100選をダウンロードしてマイマップに読ませてみました。

![1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/356263/cd91fd3d-43a3-77ac-8a2c-269dd34cc898.png)

ピンク色がないのが残念ですが、できました！

---

住所のデータを緯度経度にするにはどうしたらいいでしょう。調べてみました。
住所や地名をいれると緯度経度がでてくるサイトがありました。

![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/356263/8d7d478c-8a2e-2731-dc2a-02507d53eb24.png)

[Get Latitude and Longitude](https://www.latlong.net/)

しかしこれは・・・GoogleMapから緯度経度を引いてますよね。てことは？

---

ざっくり緯度経度を削除して、Googleマイマップに読ませると・・・？

![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/356263/030e9051-a3ef-849f-fac7-136a3d845bfc.png)

できました！

おかしな行もありますが、そこは修正で。

![4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/356263/9864e602-29d0-0484-e2f0-4b6fc073d29d.png)

なにか作れそうな予感です！
（所要時間 90分）
安全にC#でファイルを検索する(サブディレクトリも)

#安全にファイルを検索したい(サブディレクトリも)
##`Directory.GetFiles()`とか`Directory.EnumerateFiles()`
.Net Freameworkの`Directory.GetFiles()`とか`Directory.EnumerateFiles()`とか、サブディレクトリも含むオプション(`SearchOption.AllDirectories`)をつけるとすぐに権限不足で例外を吐く**使えない子**なので、代替手段をいろいろ考えたりしている。要はディレクトリを全部列挙してから各ディレクトリをサブディレクトリを含まずに検索する。
ところが、ディレクトリを列挙する`Directory.GetDirectories()`や`Directory.EnumerateDirectories()`も同じ理由で使えない子なのである。

クラシカルな手法としては`try`と`catch`で例外をハンドリングしながら個別のディレクトリを再帰を使いながら検索していく方法。
プログラムの入門者が勉強するのにはいいのだけど、例外は重いので処理は遅くなるのだ。

##ちょっと冴えた方法
そこで、`Process`で`$“cmd /c dir {DirectoryName} /a:d /s /b”`を投げて標準出力をリダイレクトしてみた。標準出力にディレクトリの列挙がベタテキストで返ってくるのだ。これはWindowsでしか使えないけど、Windows以外のOSなら`$"ls -lR {DirectoryName}"`でいける。
具体的にはこんな感じ。

```EnumerateFilesSafer.cs
Enumerable<String> EnumerateFilesSafer(String DirectoryName)
{
  var psi = ProcessStartInfo("cmd", $"/c dir \"{DirectoryName}\" /a:-d /s /b");
  psi.UseShellExecute = false;
  psi.RedirectStandardOutput = true;
  var ps = Process(psi);
  ps.Start();
  return ps.StandardOutput.ReadToEnd().Split("¥r¥n".ToCharArray()).Where(p => p!="");
}
```
これが**強烈に遅い。**
遅いのは当たり前で、`ReadToEnd()`を使っているから、子プロセスが全部ディレクトリを吐くまでこの行の処理が終わらないのだ。
メソッド呼んで60秒経つとVisualStudioちゃんに怒られるので、こういうのはやめましょう。

##もうちょっと冴えた方法(`yield return`を使う)
そこで、`do`ループで回しながら`yield return ps.StandardOutput.ReadLine();`
で列挙を返すようにしたら、かなり速くなった。具体的にはこんな感じ。

```EnumerateFilesSaferFaster.cs

Enumerable<String> EnumerateFilesSafer(String DirectoryName)
{
  var psi = ProcessStartInfo("cmd", $"/c dir \"{DirectoryName}\" /a:-d /s /b");
  psi.UseShellExecute = false;
  psi.RedirectStandardOutput = true;
  var ps = Process(psi);
  ps.Start();
  do {
    yield return ps.StandardOutput.ReadLine();
  } while (!ps.StandardOutput.EndOfStream);
}
```

これだと、この後の、各ディレクトリのファイル検索のための検索が呼ばれるまで次の行を読みに行かないのだ。
Tiny Tiny RSSのフィード取得をcronで定期実行する

基本的な部分なのですが、日本語のソースがパッと出てこなかったのでメモしておきます。

## 参考
ほぼここに書いてあることそのままです。
[UpdatingFeeds - Tiny Tiny RSS](https://git.tt-rss.org/fox/tt-rss/wiki/UpdatingFeeds)

## 実行環境
- CentOS 7.6
- Tiny Tiny RSS v19.2

## 方法
### 1. cronの確認
```bash
$ systemctl status crond
```  
```
● crond.service - Command Scheduler
   Loaded: loaded (/usr/lib/systemd/system/crond.service; enabled; vendor preset: enabled)
   Active: active (running) since Fri 2019-04-12 20:33:26 JST; 12s ago
 Main PID: 26685 (crond)
   CGroup: /system.slice/crond.service
           └─26685 /usr/sbin/crond -n
```
→エラーならインストール`yum -y install cron`
### 2. tt-rssのインストール場所を確認しておく
私の場合はnginxなので`/usr/share/nginx/tt-rss`となります。
tt-rssのインストールディレクトリ内にある、`Update.php`を実行することでフィードを更新できます。
### 3. cronの編集 
rootで作業します

```
su -
```

cronの編集

```
crontab -e
```

以下のコードを追記します（30分ごと更新の場合）

```
*/30 * * * * /usr/bin/php /usr/share/nginx/tt-rss/update.php --feeds --quiet
```

### 4. 更新
最後にcronを更新して完了です。

```
$ systemctl restart crond
```
ComboBoxに連番をLINQで挿入する (Windows Forms)


#ComboBoxに連番(例えば、月選択用に1~12)をセットしたい。
##最初にやってみたこと
```cs
cb.Items.AddRange(Enumerable.Range(1,12).ToArray());
```
と書いたら受け付けてくれなかった。要は`ItemCollection.AddRange()`は`object[]`を受け付けるが、`int[]`は`object[]`じゃなく`object`なんですな。

##次にやってみたこと
じゃあ、`Enumerable<int>`のそれぞれの要素を`object`にキャストしちゃえばいいんじゃない?って書いてみたのがこれ。

```cs
cb.Items.AddRange(Enumerable.Range(1,12).Cast<object>().ToArray());
```
ちょっと不格好。

##考えを変えてみた
`Combobox.Items`に`object`を追加していくというアプローチから`Combobox.DataSource`に入れるというアプローチに変えてみた。

```cs
cb.DataSource = Enumerable.Range(1,12).ToList();
```
結果的には、これで良かった。ちなみに、これは`List<object>`でも`Array<object>`でもいい。(`IList`インターフェースを要求するので`Enumerable<object>`ではだめ。)
ここではショートコードプログラミングの流儀に従って短い方を選んでいる。

まあ、月ならリソースで持ってもいいのだけど、年は5年前から10年後なんて形だとこういう形で生成せざるを得ない。そういうのでも
```cs
Enumerable.Range(DateTime.Today.Year-5, 15)
```
で簡単に解決できる。`for`はできるだけ使わない。
CloudFormationで作成したS3バケットのリソースをテンプレートファイルから削除してUpdate Stackしたときの動きについて

##結論

S3バケットが空の場合は、テンプレートファイルからリソースを削除するとS3バケット自体も削除される。
S3バケット上にデータが格納されている場合、テンプレートファイルからリソースを削除してもS3バケットは削除されない。

##試してみた
初期状態

```
AWSTemplateFormatVersion: 2010-09-09
Resources:
  S3Bucketa:
    Type: AWS::S3::Bucket
    Properties:
      BucketName: atsum-cfn-test-a
Resources:
  S3Bucketb:
    Type: AWS::S3::Bucket
    Properties:
      BucketName: atsum-cfn-test-b
```

バケットAにファイルをアップロードする
テンプレートを修正

```
AWSTemplateFormatVersion: 2010-09-09
Resources:
Resources:
  S3Bucketb:
    Type: AWS::S3::Bucket
    Properties:
      BucketName: atsum-cfn-test-b
```

UpdateStackする

Deleteは失敗する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78184/fd981984-c31a-7efa-0c03-b25ee59945bc.png)

S3バケットは存在する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78184/28b2d432-0747-4ed6-798e-4a69093d54e0.png)

Stackのリソースとしては、削除されている
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78184/e01e25f8-46ba-0350-fb1e-6f3317f29f98.png)

##お約束
投稿内容は私個人の意見であり、所属企業・部門見解を代表するものではありません。
WordPress の FTP 更新を回避する

# 背景

WordPress を更新しようとすると、デフォルトでは WordPress をインストールしたサーバーの FTP userid / password を求められる。
一方で、EC2等に WordPress をセットアップしていると、そもそも userid / password 方式の FTP はデフォルトでは存在していないので、 FTP を使用したくない。

# 設定方法

 wp-config.php に、以下の文言を追加

```wp-config.php
define('FS_METHOD', 'direct');
```

上記で FTP を求められなくなるが、今度はパッケージを置くためのディレクトリ作成権限が無いと言われる（事が多い）ので、WordPressインストールディレクトリの持ち主を、"nginx" にしておく

```
chown -R nginx:nginx  <WordPress の install directory>
```
BUFFALOのPC-SDVD/U2G(ビデオキャプチャ)をWindows10のビルド1809で使う方法

本内容を利用した場合の一切の責任を私は負いません。

1. Windowsメニューの「設定」→「プライバシー」でカメラを選択する
2. 「カメラ」を選択する
3. 「アプリがカメラにアクセスできるようにする」を「オン」にする

IODATA製で似た操作があり、やってみたら使えた。
【バッチファイル】複数のファイルを1つずつ圧縮する方法(Lhaplus)

こんにちは。名前変えました。きゃしいです:hatching_chick:

はじめてバッチファイルなるものを作ってみました。
コピペしただけだけども･･･でも気軽に作れていいですね、これ！:sunny:

# やりたいことと条件
- ファイルがたくさんあって、これを1つずつ圧縮したい
- Lhaplusでやろうとすると複数ファイルが1つの圧縮ファイルになってしまう
- 圧縮形式はzip
- OSはWindows
- Lhaplusがインストールされてる
- Windowsバッチでやりたい

# 手順
### バッチファイルをつくる
1. メモ帳を起動
2. 拡張子「.bat」にして適当なところに名前を付けて保存  
ex）zip.bat  
:point_up:よくつかう場合はデスクトップに置いておくと便利

### コードをコピペする
3. 下記リンク先からコードをコピー  
[複数のフォルダを Lhaplus で個別に Zip 圧縮する Windows バッチ](https://gist.github.com/Neos21/e3821ecba75695ec9209035ec5ff9176)
4. 先ほどつくったバッチファイルにペースト
5. Lhaplus.exeのパスを自分のPCのものに変更して上書き保存

### 圧縮したいファイルをドラッグ＆ドロップ
6. 圧縮したいファイルを複数選択
7. 作ったバッチファイルのアイコンの上にドラッグ＆ドロップ  
:point_up:圧縮ファイルの保存先はLhaplusの設定によります  
:point_up:私はいちいち指定するのが面倒だったので、デスクトップ上に「圧縮済み」というフォルダを作って保存先に指定し、適宜移してます

# 感想
- 今まで数百のデータを1つずつ圧縮してました
- すごく便利。もっと早く調べたらよかった。

# 参考文献
1）[複数のフォルダを Lhaplus で個別に Zip 圧縮する Windows バッチ](https://gist.github.com/Neos21/e3821ecba75695ec9209035ec5ff9176)
WordCloud の使い方

WordCloud のサンプルです。

```py:wordcloud01.py
#! /usr/bin/python
#
#	wordcloud01.py
#
#						Apr/14/2019
# ------------------------------------------------------------------
import sys
import matplotlib
matplotlib.use('Agg')
import matplotlib.pyplot as plt
from wordcloud import WordCloud
# ------------------------------------------------------------------
def create_wordcloud(text,file_png):
	fpath = "/usr/share/fonts/OTF/TakaoMincho.ttf"
	# ストップワードの設定
	stop_words = ['あ', 'い']

	wordcloud = WordCloud(background_color="white", \
		font_path=fpath, width=1024, height=1024, \
			stopwords=set(stop_words)).generate(text)

	plt.figure(figsize=(6,6))
	plt.imshow(wordcloud)
	plt.axis("off")
#	plt.show()
	plt.savefig(file_png)
#
# ------------------------------------------------------------------
sys.stderr.write("*** 開始 ***\n")
file_png = sys.argv[1]
#
textin = '慶応 明治 大正 昭和 平成 令和 昭和 明治 昭和'
#
try:
	create_wordcloud(textin,file_png)
except Exception as ee:
	sys.stderr.write("*** error *** in create_wordcloud ***\n")
	sys.stderr.write(str(ee) + "\n")
#
sys.stderr.write("*** 終了 ***\n")
#
# ------------------------------------------------------------------
```

実行方法

```bash
./wordcloud01.py out01.png
```

実行の度に作成される画像は異なります。
![out01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/9578ad86-6997-d774-66ca-b5a32976e5cd.png)

![out02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/d83873f6-49f2-72dd-dbc2-d6c927ef9fb3.png)

![out03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/5034256f-e689-0435-92b7-5a3849906eb5.png)
React + Redux でCRUD

# 概要
React + reduxでCRUDアプリを作っていきます。
一旦作る上で勉強したことをメモしていき、完成次第綺麗にまとめたいと思います。

#Reduxの導入手順
このコマンドでinstallしましょう！

```
//Redux
//npm
npm install redux
//yarn
yarn add redux

//React-Redux
//npm
npm install react-redux
//yarn
yarn add react-redux

```

##Action
何をするのかという情報を持ったオブジェクト。typeプロパティを必ず持つ必要がある。
設計図

##ActionCreator
ActionCreatorはActionを作成するメソッド。
工場

##dispatch
dispatchとは、発送（する）、派遣（する）などの意味を持つ英単語で、ITの分野では同種の複数の対象から一つを選び出したり、データの送信、資源の割り当て、機能の呼び出しなどを表すことが多い。
トラックで出荷

##Store
アプリケーション内の状態(state)を保存しているところ。
倉庫

##State
アプリケーションでの状態
在庫？？

##Reducer
dispatchされた時にStore内にある、Stateを変更するためのメソッド。引数のactionと現在保持しているStateをReducerへ渡し、新しいStateを作成する。引数のStateを更新することはせず、新しいstateのオブジェクトを作成して返す。
浄水器？？？



#Reference

- [Facebook公式のcreate-react-appコマンドを使ってReact.jsアプリを爆速で作成する](https://qiita.com/chibicode/items/8533dd72f1ebaeb4b614)
- [Redux入門【ダイジェスト版】10分で理解するReduxの基礎](https://qiita.com/kiita312/items/49a1f03445b19cf407b7)
- [ディスパッチとは - IT用語辞典 e-Words](http://e-words.jp/w/%E3%83%87%E3%82%A3%E3%82%B9%E3%83%91%E3%83%83%E3%83%81.html)
Zabbix WebUIのプルダウンに検索バーを追加する

# 概要
Zabbixで管理するホストグループなどが増えるとプルダウンで選択するのが辛くなって来ます。
バージョンが上がるごとに検索窓が追加されたりしていますが、2.2, 3.0など現在も利用している場合でも有効なChrome拡張機能で、プルダウンに検索窓を追加する方法を紹介します。

Chromeの拡張機能内で完結しますので、Mac, Windows共通で利用できます。

↓こういうのを追加します
![01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/272879/1af6dccb-250b-f332-711b-6653d09ad1b9.png)

# 各種ファイルの準備
適当なフォルダを作成して以下のファイルを用意します。
![02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/272879/b15991dd-1de6-be1d-fc82-4b6d64cd1f8d.png)
**icon16,24,128.png**
数字のピクセルのサイズの適当な画像を用意します。

**jQuery, Select2**
それぞれ本家からダウンロードします。
[jQuery](https://jquery.com/)
[Select2](http://select2.github.io/select2/)

**manifest.json**
最低限の記載をします。
ZabbixのURLのみ書き替えて頂ければ。

```json
{
  "manifest_version": 2,
  "name": "Custom UI for Zabbix",
  "description": "ZabbixのUIをカスタム",
  "version": "1.0",
  "icons": {
    "16": "icon16.png",
    "48": "icon48.png",
    "128": "icon128.png"
  },
  "content_scripts": [
    {
      "matches": ["https://<ZabbixのURL>/zabbix/*"],
      "js": ["jquery-3.3.1.min.js","select2.min.js","script.js"],
      "css": ["select2.min.css"],
      "run_at": "document_end"
    },
```

**script.js**
Select2でZabbixUIプルダウンのイベントと連携させるにはひと手間必要です。

```js
$('#twb_groupid, #groupid, #hostid').select2({width: '350px'});
var tmpData;
$('#twb_groupid, #groupid, #hostid').on("open", function() {
    tmpData = $(this).val();
});
$('#twb_groupid, #groupid, #hostid').on("focus", function() {
    tmpData = $(this).val();
});
$('#twb_groupid, #groupid, #hostid').on("change", function() {
    var $this = $(this);
    if (!tmpData || tmpData != $this.val()) {
        $($this.get(0).form).submit();
    }
});

```

# Chromeの拡張機能に追加
Chromeの拡張機能から「デベロッパーモード」を選択します。
![03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/272879/4c49f2a6-c7ea-a75e-ed80-59e6031f25ec.png)

以下を選択し、先ほど用意したファイルが保存されているフォルダを選択します。
![04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/272879/ee661cb6-ef59-12af-05de-18bf7b95921b.png)

拡張機能が正常に読み込まれると、Zabbixのホストグループや、ホストリストを選択した時に入力して検索できる窓が追加されているはずです。
![05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/272879/d8e7377f-8de2-8a5b-e423-4d9185628b55.png)


# 最後に
ちゃんと動くようであれば、少しお金はかかりますが、Chromeウェブストアに登録して使うのが良いと思います。
デベロッパーモードで普段使いするのは気持ち悪いですもんね。

Zabbix4.0では大分良くなっているので、古いZabbixは早々に4.0にするのがいいんですけどね。

おわり。
チケットとかクリアファイルにありそうな曲線

デモ：https://codepen.io/mo4_9/pen/MRoQNQ

border-radiusで丸めただけの円を使うと
この上部の絶妙な曲線を表現できないのでSVGで書いた。

<img width="237" alt="スクリーンショット 2019-04-12 20.16.46.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/136286/118bd811-8a90-fbb1-fbce-5f12fc098447.png">

チケットとかクリアファイルとかに使えそう。
nginx で PHP を動かす

#背景
Nginx で PHP を動かすには、php-fpm をインストールする所までは覚えていても、その後の設定の書き方を毎回すっかり忘れているのでメモ。
モジュールのインストールは終わっている前提で、その後の設定部分だけを記述しています。

# 環境
* Amazon Linux 2 
* PHP 7.2.16 (php -v)
* nginx/1.12.2　(nginx -v)

#設定

### nginx 側の設定

/etc/nginx/nginx.conf を編集する必用がある。
スタンザが http → server (80と443）→ location の階層構造になっている。
server の 80 と 443 の両方に php 用の location スタンザを追加しておく(使うほうだけでも良いけど）

```nginx.conf
        location ~ \.php$ {
            root           /usr/share/nginx/html;　# ここは nginx の / ディレクトリにしておく。nginx の / から下の階層の全てでPHPが実効できるようになる。
            # root           /var/www;
            # fastcgi_pass   127.0.0.1:9000; 　# これは php-fpm の設定に依存する。自分は使わない派。ネットの記事は使っているものが多い。
            fastcgi_pass    unix:/run/php-fpm/www.sock; # こちら派。パスの設定は、php-fpm 側の記述に unix: を付けたものになる。
            fastcgi_index  index.php;
            fastcgi_param  SCRIPT_FILENAME  $document_root/$fastcgi_script_name;
            include        fastcgi_params;
        }

```

編集が完了したら再起動

```
sudo nginx -s reload
```


### php-fpm 側の設定

/etc/php-fpm.d/www.conf を編集する必用がある

```/etc/php-fpm.d/www.conf
; RPM: apache user chosen to provide access to the same directories as httpd
user = nginx # nginx にする
; RPM: Keep a group allowed to write in log dir.
group = nginx　 # nginx にする

<省略>
; Note: This value is mandatory.
listen = /run/php-fpm/www.sock   # これを使って通信するので、この値をnginx.confで指定する。

<省略>
;                 mode is set to 0660
listen.owner = nginx　 # nginx にする
listen.group = nginx　 # nginx にする

```

編集が完了したら再起動

```
sudo service php-fpm restart
````

### PHP動作確認用のいつものFile

動作確認用の phpinfo.php を作成して、nginx のルートに配置する。

この例では nginx ルートは以下なので以下のルートにテスト用 php を配置
/usr/share/nginx/html

``` phpinfo.php                                                                                
<?php phpinfo(); ?>
```

nginx ルートの www.example.com/phpinfo.php  にアクセスすると、おなじみの以下の画面が見えればセットアップは完了です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99425/3c2bc962-804b-907a-8eeb-572c0d08600e.png)
Example of deleting specific value from array of # python (I want to subtract array like # ruby)

<h1> python </h1>

<p> It seems to be easy to handle once it is set = set. It is unclear whether it is a good way. </p>

<pre> <code class="py">&gt;&gt;&gt; list(set([&quot;a&quot;,&quot;b&quot;,&quot;c&quot;,&quot;d&quot;,&quot;e&quot;]) - set([&quot;b&quot;,&quot;d&quot;])) 
 [&#39;a&#39;, &#39;e&#39;, &#39;c&#39;] 
</code> </pre>

<h1> ruby </h1>

<p> You can subtract with the array. 
 <code>rb 
 [1] pry(main)&gt; [&quot;a&quot;,&quot;b&quot;,&quot;c&quot;,&quot;d&quot;,&quot;e&quot;] - [&quot;b&quot;, &quot;d&quot;] 
 =&gt; [&quot;a&quot;, &quot;c&quot;, &quot;e&quot;] 
</code> </p>

<h1> ref </h1>

<p> <a href="https://qiita.com/Tocyuki/items/0bc783daab382ef7a0ec">Python set operations-Qiita</a> </p>


# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/1222








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
Socket.IOとWebSocketは通信できない

# Socket.IOとWebSocketは通信できない
タイトルの通りです。
Node.jsでWebSocketサーバを作る機会がありまして、有名なSocket.IOを採用しました。
私のSocket.IOの認識は以下でした。

* WebSocketをラップしたライブラリで、接続できないときはポーリングなどに自動で切り替えてくれる
* 普通のWebSocketサーバとも通信できる

しかし、実際には**Socket.IOはSocket.IOとしか通信できません。**
改めて[公式](https://socket.io/docs/)を見ると、ちゃんと書いてあります。
WebSocketクライアントとSocket.IOサーバの通信、あるいはその逆は、不可と読めますね。

> What Socket.IO is not
Socket.IO is NOT a WebSocket implementation. Although Socket.IO indeed uses WebSocket as a transport when possible, it adds some metadata to each packet: the packet type, the namespace and the ack id when a message acknowledgement is needed. That is why a WebSocket client will not be able to successfully connect to a Socket.IO server, and a Socket.IO client will not be able to connect to a WebSocket server either. Please see the protocol specification here.

常識なのかもしれませんが・・・
他に間違える人が少しでも減るよう、記事として残しておきます。
AVRO Union Record とその周辺

kafka に json を流すとき。AVRO json が最大公約数的な立ち位置か。メンバーに構造体を入れ子に保持するパターン、特に Union で型を切り替えられるようにしていると、とってもややこしい。

kafka のトピックは型を安定させたほうがよく、データセットが何であるかを基準にクラス設計するとよい（[様々な意見がある](https://riccomini.name/how-paint-bike-shed-kafka-topic-naming-conventions)）。この結果 Union が最善の選択肢になるケースもある。少し冗長な JSON 表現形式になるが、他のツールからは汎用 JSON として対応できるだろう。

### AVRO json serialize 
Union で record を扱う場合、key に record 名が含まれる。
https://avro.apache.org/docs/1.8.1/spec.html#json_encoding

```JSON
{"bulk":null}
{"bulk":{"string":"test"}}
{"bulk":{"name.space.Name":{"field1":"test"}}}
```


### faust.Record
`__faust` で型情報を埋め込む路線。https://faust.readthedocs.io/en/latest/userguide/models.html

Avro は汎用型との変換になるけれども、`faust.Record` では UUID, datetime といった、さらに特定の型までの変換ができる。`.dump()` ですぐに出力を眺められるのがよい。


### ksql 

double-quote で囲んでエスケープできる。メンバーアクセスは arrow。
https://docs.confluent.io/current/ksql/docs/developer-guide/query-with-structured-data.html

```SQL
CREATE STREAM T (TYPE VARCHAR,
                DATA STRUCT<
                      timestamp VARCHAR,
                      "field-a" INT,
                      "field-b" VARCHAR,
                      "field-c" INT,
                      "field-d" VARCHAR>)
        WITH (KAFKA_TOPIC='raw-topic',
              VALUE_FORMAT='JSON');

SELECT DATA->"field-a", DATA->"field-b" FROM T WHERE TYPE='key1' LIMIT 2;
```


### avro-json-serializer
そこそこ動くのだけれど、union + record をシリアライズする方法の制御が難しい。`avro-python3` に依存。
https://github.com/linkedin/python-avro-json-serializer

```python
import avro.schema
from avro_json_serializer import *

schema_dict = {
  "fields": [
    {"name": "frec",
      "type": [
        "null",
        "string",
        {"fields": [{"name": "subfint", "type": "int"}],
                   "name": "Rec",
                  "type": "record"},
        {"fields": [{"name": "subfint2", "type": "int"}],
                  "name": "Rec2",
                  "type": "record"}
      ]
    }
  ],
  "name": "all_field",
  "namespace": "com.some.thing",
  "type": "record"
}

avro_schema = avro.schema.SchemaFromJSONData(schema_dict, avro.schema.Names())
serializer = AvroJsonSerializer(avro_schema)

serializer.to_json({
    "ffloat": 1.0,
    "funion_null": None,
    "flong": 1,
    "fdouble": 2.0,
    "fint": 1,
    "fstring": "hi there",
    "frec": {"subfint": 1}
})
# '{"frec":{"com.some.thing.Rec":{"subfint":1}}}'
serializer.to_json({
    "ffloat": 1.0,
    "funion_null": None,
    "flong": 1,
    "fdouble": 2.0,
    "fint": 1,
    "fstring": "hi there",
    "frec": {"subfint2": 2}
})
# '{"frec":{"com.some.thing.Rec2":{"subfint2":2}}}'
```
CI環境でFirebase Test Lab for iOSの実機テストを自動化する

CI環境でiOS版Firebase Test Labの自動化をする手順をまとめました。
Bitrise前提で書いてますが、gcloudコマンドを使っているのでどのCI環境でも応用できます。

## 【前提】Test Lab for iOSで出来ること
Google データセンターでホストされているデバイス上で実機Unit Test, UI Testが可能。
Androidでサポートされている[Robo テスト](https://firebase.google.com/docs/test-lab/android/robo-ux-test?hl=ja)はiOSではサポートされてないが、手動だと辛い複数端末テストがクラウド上で出来るだけでも便利。

<img width="986" alt="results2.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30423/f02f913b-00da-a78f-bec9-485761cd3e3e.png">

動画でテストの実行内容を確認可能

<img width="1404" alt="test_movie.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30423/1d451c5e-13e6-f8d6-88c8-e9c45631bafd.png">


理解を深めるには、公式リファレンスに載ってる通り

1. XCTestの.zipファイルをコンソールに上げる方法で試す
1. gcloudコマンドでテスト実行
1. CI上でgcloudコマンドでテスト実行

の手順で進めると良い

## gcloudコマンドでテストを自動化する
CLIでテストを実行するには、GCPのコマンドラインツールである [gcloudコマンド](https://cloud.google.com/sdk/gcloud/)を使う

###  手順
1. gcloudコマンドのインストール(プリインストールされている環境なら不要)
1. gcloud authコマンドでGCPのサービスアカウントキーを使った認証を行う
1. gcloud configコマンドでFirebaseのproject idを紐付ける
1. テスト実行

Script全体はこんな感じ

``` bash
#!/bin/bash
set -ex

# install gcloud
curl https://sdk.cloud.google.com | bash 
source $HOME/google-cloud-sdk/path.bash.inc

# setup project
curl -o /tmp/sacc_key.json $BITRISEIO_SERVICE_ACCOUNT_KEY_URL
gcloud auth activate-service-account -q --key-file /tmp/sacc_key.json
gcloud config set project $FIREBASE_PROJECT_ID

# run test
gcloud firebase test ios run --test "${BITRISE_TEST_BUNDLE_ZIP_PATH}" \
  --device model=iphone8,version=11.4,locale=ja_JP \
  --device model=iphonex,version=12.0,locale=ja_JP \
  --device model=iphonexsmax,version=12.1,locale=ja_JP \
  --device model=iphonese,version=11.4,locale=ja_JP
```

### 補足1: 認証
[Firebaseのドキュメントに書いてある](https://firebase.google.com/docs/test-lab/ios/command-line?hl=ja)Googleアカウントを使ったOAuth認証の他、[GCPのサービスアカウントキーを使った認証](https://cloud.google.com/sdk/gcloud/reference/auth/activate-service-account)も可能。

`curl -o /tmp/sacc_key.json $BITRISEIO_SERVICE_ACCOUNT_KEY_URL`
GCPのサービスアカウントキー(JSONファイル)をBitrise上にアップロードして、そのURLからキーをDLして認証している
Bitriseの場合、` [Code Signing] > [GENERIC FILE STORAGE]タブ` からアップロードが可能。URLを示す環境変数が生成される
※Code Signingタブのセキュリティについては[こちら](https://devcenter.bitrise.io/getting-started/code-security/#code-signing-and-other-files)

### 補足2: テスト実行
`"${BITRISE_TEST_BUNDLE_ZIP_PATH}"` 
Bitriseのステップ `[BETA] Xcode Build for testing for iOS` を使って生成したテスト .zipファイルのpathを指定している


## Bitriseを使っている場合
`iOS Device Testing` ステップを使えば簡単にTest Labを使ったテスト実行と確認が可能(全部実装し終わった後に知った。)
https://devcenter.bitrise.io/testing/device-testing-for-ios/

![test-results](https://devcenter.bitrise.io/img/test-results.png)



## 参考URL
https://discuss.bitrise.io/t/how-to-run-android-tests-on-firebase-testlab/2192
https://swet.dena.com/entry/2018/12/02/000000
anyenvの使い方

pythonとnode.jsのバージョン管理のためanyenvをインストールしたので使い方のメモ

## anyenv
複数の言語を使う場合には使用する。
私はpyenvとndenvしか使っていませんが複数の言語の〜〜envを管理できる。
インストール、使い方は[anyenv/anyenv](https://github.com/riywo/anyenv)参照。

## ndenv,pyenv
使い方は基本的に同じでバージョンリストを確認してインストールしたいバージョンを入れる。

バージョンリスト確認
`$ndenv install -l`

インストール
`$ndenv install <version>`

インストールしたらグローバル環境、ローカル環境にセットする。
ローカル環境にセットするとコマンドを実行したディレクトリ配下でそのバージョンが適用される。
グローバル環境にセットするとローカル環境以外のすべての場所でそのバージョンが適用される。

ローカル環境にセット
`$ndenv local <version>`

ローカル環境にセット
`$ndenv global <version>`
haskell単語和英リスト

日本語の単語と英語の単語の結び付けのメモ

| 日本語 | English | 出典元 |
|:-:|:-:| :-:|
| 中置演算子 | `infix function` | |
| 参照透過性 | `Referential transparency` | http://learnyouahaskell.com/introduction#so-whats-haskell |
#python の配列から特定の値を削除する例 ( #ruby みたいに配列の引き算がしたい )

# python
いちど set=集合体  にしてやると扱いやすそう。良いやり方かどうかは不明。

```py
>>> list(set(["a","b","c","d","e"]) - set(["b","d"]))
['a', 'e', 'c']
```

# ruby
配列のまま引き算できるぜ。
```rb
[1] pry(main)> ["a","b","c","d","e"] - ["b", "d"]
=> ["a", "c", "e"]
```

# ref

[Pythonの集合演算 - Qiita](https://qiita.com/Tocyuki/items/0bc783daab382ef7a0ec)

# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/1217








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
プログラミング学習記録55〜オイラー路、ハミルトン路〜

##今日やったこと
昨日の続きで一筆書き問題やマッチング問題について学びました。

どのように線を辿れば一筆で書けるのか？
どの組み合わせが１番全員が満足する形にすることができるか？
について考えました。

数学の図形問題を解いている時のように夢中になりましたね。

図形をモデル化すれば簡単に一筆書きで書けるかどうかを判断することができます。

角と他の角を結ぶ線の数が奇数である「奇点」の数が０個か２個であれば、一筆書きでいけます。

どんなに複雑な図形であっても、この方法で一筆書きできるかどうか判断できるのはすごいなと思いました。

奇点の数が３個以上になった時点で、その図形は一筆書きできないことがわかります。

今まで実際に手を動かして一筆書きできるかどうかを調べていましたが、今回このような方法を学べたので、今度一筆書き問題に出会った時には秒速で解けちゃいますね。

コンピュータの情報処理を理解するために関連する数学を学びましたが、コンピュータに関係しない分野の数学の問題も解いてみたくなってきました。

明日は多分Javaを勉強します。
Javaに触れたことはないのですが、これまでにJavaScript、Python、Rubyをやってきたので、基礎的な部分（変数、条件分岐、繰り返し処理など）は大丈夫でしょう。


ということで、明日からも引き続きプログラミング学習頑張ります。

おわり
Go言語でセッション管理

Webアプリケーションの開発をする上で必要になってくる、セッション管理について調べた上で理解したことを書いていく。

##セッション管理が何故必要なのか
+ 1 データを保持する必要がある
+ 2 他のユーザーから自分の見ているページを覗かれないようにするため

####1
http通信ではクライアントの要求をもとにデータ(基本的にhtml, cssなど)を送信する。データが送信されるとクライントとサーバー間の通信が終わる。そのため、以前入力したデータが保存されない。

####2
例えばログインが必要なWebアプリを考える。ユーザーは自身のIDやパスワードを入力しログインすることができるが、ログインしたあと個人情報が記述されているページに移動する場合、自分以外に見られることは好ましくない。そのためログインしたユーザーを識別するためのセッションIDは複雑でユニークな文字列である必要がある。

これらの問題を解決するために、ユーザー管理などが必要なWebアプリケーションではセッション管理をする必要がある。

##使うもの
Echoが見たところ実装しやすそうだったのでgo getする。

```
go get github.com/labstack/echo
go get github.com/labstack/echo-contrib
go get github.com/gorilla/context
go get github.com/dgrijalva/jwt-go
```


##実装
まずはログインするところから。

```golang
func login(e *echo.Echo) echo.HandlerFunc{
	e.Use(session.Middleware(sessions.NewCookieStore([]byte("secret"))))
	return func(c echo.Context) error {
		sess, _ := session.Get("session", c)
		sess.Options = &sessions.Options{
			//Path:でsessionの有効な範囲を指定｡指定無しで全て有効になる｡
			//有効な時間
			MaxAge:   86400 * 7,
			//trueでjsからのアクセス拒否
			HttpOnly: true,
		}
		//テキトウな値
		sess.Values["foo"] = "bar"
		//ログインしました
		sess.Values["auth"] = true
		//状態保存
		if err:=sess.Save(c.Request(), c.Response());err!=nil{
			return c.NoContent(http.StatusInternalServerError)
		}
		return c.NoContent(http.StatusOK)
	}
}		
```
特に入力することはない。http://[IPアドレス]/loginにアクセスするとSessionを開始する。

次にログインしたときのみ~/secretにアクセスすると bar が表示されるようにする。

```golang
func secret() echo.HandlerFunc{
	return func(c echo.Context)error{
		//sessionを見る
		sess, err := session.Get("session", c)
		if err!=nil {
			return c.String(http.StatusInternalServerError, "Error")
		}
		//ログインしているか
		if b, _:=sess.Values["auth"];b!=true{
			return c.String(http.StatusUnauthorized, "401")
		}else {
			return c.String(http.StatusOK, sess.Values["foo"].(string))
		}
	}
}
```

最後にログアウト

```golang
func logout() echo.HandlerFunc{
	return func(c echo.Context) error {
		sess, _ := session.Get("session", c)
		//ログアウト
		sess.Values["auth"]=false
		//状態を保存
		if err:=sess.Save(c.Request(), c.Response());err!=nil{
			return c.NoContent(http.StatusInternalServerError)
		}
		return c.NoContent(http.StatusOK)
	}
}
```

ログアウトしてから~/secretにアクセスすると401が表示される。

##おわりに
今回は基本的なセッション管理のプログラムをしてみた。今後はより複雑なケースを想定してプログラムをしていく。

##参考にしたところ
[Echo](https://echo.labstack.com/middleware/session)
[Go exsample sessions](https://gowebexamples.com/sessions/)

##Githubにソースコード置きました。
https://github.com/Reinker/Session/blob/master/session/session.go
Haskellを始めてみた

[2021/02/16追記]
現在、HaskellのLanguage serverは[haskell/haskell-language-server](https://github.com/haskell/haskell-language-server)が主流になっており、[hie](https://github.com/haskell/haskell-ide-engine)は非推奨(Deprecated)となっています。
後にインストール方法を書き直すかもしれません。
現状、vim+LSPなら[mattn/vim-lsp-settings](https://github.com/mattn/vim-lsp-settings)を使うのが手軽です。[本人の解説記事](https://qiita.com/mattn/items/e62b9f16bc487a271a7f)はこちらです。
なお、Haskell-language-serverは`LspInstallServer`には対応しておらず、別途入れる必要があります。
[追記終]

---


# 動機

前Qiitaのトレンドに上がっていた[Lazy K プログラムを書く](https://qiita.com/zk_phi/items/acb821d298151a7b96d2)から関数型言語に興味を持ったのが発端でした。

コンビネータ計算に興味を持ち、そこから[SKI記法](https://ja.wikipedia.org/wiki/SKIコンビネータ計算)・[不動点コンビネータ](https://ja.wikipedia.org/wiki/不動点コンビネータ)・[ラムダ計算](https://ja.wikipedia.org/wiki/ラムダ計算)等を渡り読んで楽しくなったので関数型言語を学ぼうと思いました。
ちなみになぜhaskellを選んだかというと、ただ単に勧められたからです。

# macで環境構築をする

今現在、Haskellをインストールする際に推奨されているのはstackを使う方法のようです。

## stackをインストールする(homebrew)
homebrewで`stack`をインストールします

```bash
$ brew install haskell-stack
```

## HIE(haskell Ide Engine)をインストールする

HIEはhaskell用のLanguage Serverです。(language serverについては → [langserver.org](langserver.org))
HIEはhomebrewではシステム上インストールできないため、個別にGithubレポジトリから作成してインストールします。


```bash
$ git clone https://github.com/haskell/haskell-ide-engine.git
$ cd haskell-ide-engine
$ stack ./install.hs hie-8.6.4
$ stack ./install.hs build-doc-8.6.4
```

これで実行可能ファイルが`~/.local/bin/`以下に作成されるので、`~/.local/bin`を`PATH`に追加すれば使用することができます。

## HIEをvim-lspと連携する

私はvimmerなので、vim-lspと連携させて使います。
以下の設定を`vimrc`に追加します。
以下は自分の他の言語用の設定をそのまま写して使っているものです。
誤りもあるかもしれませんが一応使えています。

```vim
augroup MyLsp
  autocmd FileType haskell setlocal omnifunc=lsp#complete

  if executable('hie')
      au User lsp_setup call lsp#register_server({
        \ 'name': 'hie',
        \ 'cmd': {server_info->['hie']},
        \ 'whitelist': ['haskell'],
        \ })
  endif

  au FileType haskell nmap <leader>R <plug>(lsp-rename)
  au FileType haskell nmap <leader>D <plug>(lsp-definition)
  au FileType haskell nmap <leader>r <plug>(lsp-references)
  au FileType haskell nmap <leader>d <plug>(lsp-document-symbol)
  au FileType haskell nmap <leader>w <plug>(lsp-workspace-symbol)
augroup end
```

## HIEをale.vimと連携する

補完等の`Language server`周りは`vim-lsp`に任せているものの、`lint`等は`ale`に任せているので`ale`の設定もします。

```vim
let g:ale_linters = { 'haskell': ['hie'], }
```


# 学習資料について

本来なら、[公式のチュートリアル](https://wiki.haskell.org/tutorials)をやるのが良いと思うのですが、英語でとっかかりづらかったので[Haskell 超入門](https://qiita.com/7shi/items/145f1234f8ec2af923ef)シリーズを使っています。

書籍は今は何も使っていません。
【GitHub】Windows10+プロキシ環境でSSH接続を試みた話

# 経緯
研究室に配属されPCが支給されたのだが、GitHubにSSH接続が出来ない。理由は単純で、学内ネットワークでは22番ポートが閉じており、プロキシ経由で443番ポートを通して通信する必要があるからである。この設定自体は単純で、調べれば出てくるのだが私の環境ではどうも一筋縄ではいかなかった。同じような方のために、私の環境で使用した方法を書いておく。

# SSHでプロキシを設定する。
.ssh/configを編集し、次のように記述する。

```config:.ssh/config
Host github.com
    User git
    Hostname ssh.github.com
    IdentityFile ~/.ssh/id_rsa
    Port 443
    ProxyCommand connect.exe -H <プロキシサーバのアドレス>:<ポート> %h %p
    AddressFamily inet
Host ssh.github.com
    User git
    Hostname ssh.github.com
    IdentityFile ~/.ssh/id_rsa
    Port 443
    ProxyCommand connect.exe -H <プロキシサーバのアドレス>:<ポート> %h %p
    AddressFamily inet
```

上記のように記述したけど無理だった。どうやら、通常C:/Program files/Git/binに配置されているconnect.exeが私の環境では無かったようなのでエラーを吐いたようだ。
こうなると、connect.exeのソースコードを自前でコンパイルする必要がある。

#connect.cのコンパイル
connect.exeのソースコードは、connect.cというものらしい。gistに公開されているのでこれをダウンロードしてコンパイルすればいいのだ。LinuxとWindowsではソケット通信に使用するライブラリが異なるため、リンカを設定する必要があることに注意する。コマンドライン上で次のように実行すればconnect.exeが作成される。

```bash:
gcc -o connect -lwsock32 connect.c -lws2_32
```
作成されたconnect.exeは、適当な場所に配置する。**C:/Program files/Git/binに配置するときはスペースが含まれることに注意する。何もしないとエラーを吐くのでエスケープ文字等で対処する。**~~私はめんどくさいのでCドライブ直下に配置した。~~

#.ssh/configを書き直す
.ssh/configを、次のように書き直す。

```config:.ssh/config
Host github.com
    User git
    Hostname ssh.github.com
    IdentityFile ~/.ssh/id_rsa
    Port 443
    ProxyCommand <connect.exeの絶対パス> -H <プロキシサーバのアドレス>:<ポート> %h %p
    AddressFamily inet
Host ssh.github.com
    User git
    Hostname ssh.github.com
    IdentityFile ~/.ssh/id_rsa
    Port 443
    ProxyCommand <connect.exeの絶対パス> -H <プロキシサーバのアドレス>:<ポート> %h %p
    AddressFamily inet
```

GitHubにテスト接続を行い、"welcome to ~"的なことが表示されてたら成功。

#参考文献
http://wiki.jwds.jp/index.php?SSH%20Proxy%20Command%20connect.c

http://d.hatena.ne.jp/hayabusa333/20110329/1301358227
【完全版】Illustratorで複数のオブジェクトをまとめてクリッピングマスクをかける方法

Illustratorで下記のような地図を作っていて、アートボードからはみ出た部分を消したいのに全然出来ずに3時間彷徨った挙句にやっと出来たので、過去の自分を救うためにも手順をメモしておきます。

#完成イメージ
こんなアートボードからはみ出した複数のオブジェクトを・・・
![スクリーンショット 2019-04-12 18.59.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/84664/b11ee588-2933-00e7-a9e6-2ac6256eadf9.png)

↓

こんな感じでアートボード内にきっちり納めます！
![スクリーンショット 2019-04-12 19.01.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/84664/c53e29db-eb29-c148-a847-2254f9013789.png)

#手順1 右側のレイヤーパネルの最上段にクリッピングマスク用のレイヤーを作成します
![スクリーンショット 2019-04-12 19.14.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/84664/471bc754-9604-dae4-ece0-c341b02a1eb8.png)
今回は地図を作成していて、あくまでアートボードの中に納めたいので、クリッピングマスク用のレイヤーにはアートボードと同じサイズの長方形を描きます。
![スクリーンショット 2019-04-12 19.00.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/84664/56039a30-94a0-888d-4bf5-764a209c6885.png)

#手順2 さらにその上の最上段にレイヤーを作り、それを親レイヤーとして全レイヤーを格納します
「まとめる用」と書いたレイヤーがそれです。名前はなんでも構いません。
そこに先ほど作ったクリッピングマスク用のレイヤーも含め、対象となる全てのレイヤーを格納します。
![スクリーンショット 2019-04-12 19.13.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/84664/341ab0a0-833e-969d-21cd-367af947b9d6.png)

#手順3 対象となるレイヤー全てを選択します
ここはメニューバーの「選択」→「すべてを選択」をクリックすればOKです。
![スクリーンショット 2019-04-12 19.21.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/84664/e0f7b047-9ca8-78bb-30c4-943643e3c33b.png)
これで下準備は完了です。

#手順4 いよいよ！クリッピングマスクを作成します！
メニューバーで「オブジェクト」→「クリッピングマスク」→「作成」をクリックしてください。
![スクリーンショット 2019-04-12 19.01.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/84664/4fc66bca-b586-8e70-4d14-c6f0a31ee4a2.png)

#手順5 ついに・・・完成ッ・・・！！！
ばば〜〜〜ん！！！パチパチパチ！！！
![スクリーンショット 2019-04-12 19.01.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/84664/86ae3652-1272-ad9d-cfaf-e7bbdc278ba8.png)

これで完成です！
こんな単純な事がググっても全然分からず心が折れていました・・・

Illustratorで複数のオブジェクトをまとめてクリッピングマスクをかけるやり方が分からない方の参考になれば幸いです。では！
LaravelCollective Formファサード チートシート

## 環境構築
~~[LaravelCollective公式サイト(既に閉鎖)](https://laravelcollective.com/)~~
[LaravelCollective公式サイト(リニューアルしたようです。)](https://laravelcollective.com/)
[LaravelCollective公式GitHub](https://github.com/LaravelCollective/docs)

### インストール

```
$ composer require "laravelcollective/html":"^5.5"
```

### 初期設定
laravelのアップデートでなくても動くけど入れるに越したことはない。

#
```config/app.php
'providers' => [
    // ...
    Collective\Html\HtmlServiceProvider::class,
    // ...
  ],
'aliases' => [
    // ...
      'Form' => Collective\Html\FormFacade::class,
      'Html' => Collective\Html\HtmlFacade::class,
    // ...
  ],
```

## 仕様メモ
タグの種類とサンプルコードと引数の内容

#### +aについて
引き数で+aと書かれている場所は配列を渡して属性を追加していく。

```
['class'=>'クラス名', 'placeholder'=>'プレイスホルダー']
　もしくは
array('style'=>'color:red;',required)
```

#### フォームタグ 
```
{{Form::open(['url' => '/', 'files' => true])}}

{{Form::close()}}
```
第1引数 : 配列 => ルーティング action, ファイルのフォーム使用の可否

#### CSRFトークン
```
{{Form::token()}}
```
* {{csrf_field()}}がデフォルトが用意されている。お好みで

#### ラベル
```
{{Form::label('email', 'E-Mail Address', ['class' => 'awesome red','id' => 'asd'])}}
```
第1引数 : 関連付けフォームの指定 for
第2引数 : ラベルの文字 value
第3引数 : +a

#### テキスト
```
{{Form::text('text', null, ['placeholder' => 'temp'])}}
```
第1引数 : フォームの名前 name
第2引数 : はじめに入っている値 value
第3引数 : +a

#### パスワード
```
{{Form::password('password', ['class' => 'awesome'])}}
```
第1引数 : フォームの名前 name
第2引数 : +a

#### チェックボックス
```
{{Form::checkbox('name', 'value', true, ['class'=>'circle'])}}
```
第1引数 : フォームの名前 name
第2引数 : 送信される値 value
第3引数 : デフォルトのチェック checked
第4引数 : +a

#### ラジオボタン
```
{{Form::radio('name', 'value', true, ['class'=>'circle'])}}
```
第1引数 : フォームの名前 name
第2引数 : 送信される値 value
第3引数 : デフォルトのチェック checked
第4引数 : +a
＊ デフォルトのチェックが被っている場合後のラジオボタンが反映される。(読み込み順)
       
#### 数値
```
{{Form::number('name', 30, ['class'=>'number'])}}
```
第1引数 : フォームの名前 name
第2引数 : 送信される値 value
第3引数 : +a 
    
#### 日付  
```
{{Form::date('name', \Carbon\Carbon::now(), ['class'=>'date'])}}
```
第1引数 : フォームの名前 name
第2引数 : 送信される値 value (\Carbon\Carbon::now()で今日を指定できる)
第3引数 : +a 
 
#### ファイル  
```
{{Form::file('image', ['class'=>'date'])}}
```
第1引数 : フォームの名前 name
第2引数 : +a 
＊ フォームタグの'files' => trueが必要である。

#### ドロップダウンボックス
```
{{Form::select('size', ['L' => 'Large', 'S' => 'Small'], 'S', ['placeholder' => 'null'])}}
```
第1引数 : フォームの名前 name
第2引数 : リストの要素 option value
第3引数 : デフォルト値 selected (nullはplaceholderがあればそれ。無ければ配列の始め)
第4引数 : +a

#### ドロップダウンボックス(範囲指定)
```
{{Form::selectRange('number', 10, 20, null, ['class' => 'range'])}}
```
第1引数 : フォームの名前 name
第2引数 : 範囲の指定 
第3引数 : 範囲の指定 (数字かアルファベット)
第4引数 : デフォルト値 selected
第5引数 : +a
        
#### ドロップダウンボックス(暦月)
```
{{Form::selectMonth('month', 3, ['class'=>'month'])}}
```
第1引数 : フォームの名前 name
第2引数 : デフォルト値 (＊数字で指定) 
第3引数 : +a

#### ボタン
```
{{Form::submit('送信', ['class'=>'submit'])}}
```     
第1引数 : ボタンに表示する文字 value
第2引数 : +a

## 終わりに
`{!! XXXX !!}ではエスケープ処理を行われず、{{ XXXX }} の方はエスケープ処理を行う`
過去には{!! XXXX !!}の囲み方をする必要があったが、ララベルのアップデートでHTMLタグを読んだときは勝手にエスケープされるようになった。


フォームモデルバインディングとカスタムマクロの動きは確かめていないので、時間があるときに動作の確認が出来次第更新したい。
Do some plucky things like #Ruby on #Rails against the #python dictionary

<p> It&#39;s Funcy! </p>

<pre> <code class="py">&gt;&gt;&gt; from funcy import pluck 
 &gt;&gt;&gt; list(pluck(&quot;name&quot;, [ {&quot;name&quot;: &quot;fix&quot;, &quot;ext&quot;: &quot;wow&quot;} , {&quot;name&quot;: &quot;bug&quot; }, {&quot;name&quot;: &quot;dig&quot;} ])) 
 [&#39;fix&#39;, &#39;bug&#39;, &#39;dig&#39;] 
</code> </pre>


# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/1214








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
デプロイできない時の手段

突然上司から「このファイルをステージング環境に上げてくれ」と言われた。

先輩ができなかった仕事がペーペーにまわってきてできるわけなかろうがと思ったができたので、今回はそのことについてまとめます。

まず、通常通り

```
$ cap staging deploy
```

とうつ。

すると

```
cap aborted!
SSHKit::Runner::ExecuteError: Exception while executing as ＊＊＊@＊＊＊.＊＊.＊＊＊.＊＊＊: Net::SSH::ConnectionTimeout

Net::SSH::ConnectionTimeout: Net::SSH::ConnectionTimeout

Errno::ETIMEDOUT: Operation timed out - connect(2) for ＊＊＊.＊＊.＊＊＊.＊＊＊:＊＊

```
こんなエラーが出た。


`ssh ユーザー名@ホスト名`でsshに入ってログを見ようかとやってみてもそれっぽく頑張ってくれはするんですが、`Connection timed out`でサーバーに入れず。

何が原因かいろいろ調べていくと[この記事](http://kawatama.net/web/150)に出会う。
hostsファイルというものをいじって強制的に指定したサーバーを見れるみたいだ。。（きっとこれよりもいい方法ってあるんでは。。？わかる方コメントくださいい、、、）

記事の通り

```
$ sudo vim /etc/hosts
```
をする

<img width="417" alt="スクリーンショット 2019-04-12 18.53.16.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/265805/9ffa70ee-7978-1b92-f132-1e942103372e.png">

黄色のところにIPアドレス、ホスト名が書かれていました。
一番最後の列にデプロイしたいサーバーのIPアドレスとホスト名を追記して

```
$ cap staging deploy
```

してみたらそれっぽく動いてる！！

でも、サイトURLにアクセスすると`502 Bad Gateway`

<img width="404" alt="スクリーンショット 2019-04-12 18.59.24.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/265805/89e5a8c7-f8e0-ee27-7fe0-270711fe6cac.png">

サーバーに不具合が起きているみたいです。
hostsファイルいじってもダメだったかーなんて思ったけど、`502 Bad Gateway`は再起動したらなおる説もあったので、やってみた。


行けた！！！！！
GitHubで複数リポジトリを作成した際の鍵の管理

##前提条件
GitHubのアカウントを作成済み
リモートリポジトリをADDした状態


##鍵の作成
管理したい鍵を作成します。

```terminal:鍵の作成
$ ssh-keygen
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/XXXX/.ssh/id_rsa): 鍵のファイル名
Enter passphrase (empty for no passphrase): パスワード
Enter same passphrase again: パスワード
```

##SSHの設定ファイルを修正

vimで設定ファイルを開きます。

```terminal:
$ vim cd ~/.ssh/config
```


任意のホスト名(XXXXの部分。HostNameは変えない！)と先ほど作成した鍵のファイル名を設定します。

```vim:
Host github.com.XXXX
  HostName github.com
  User git
  Port 22
  IdentityFile ~/.ssh/鍵のファイル名
  TCPKeepAlive yes
  IdentitiesOnly yes
```


Hostの部分を記録しておく。

```vim:
Host github.com.XXXX
```


##リモートリポジトリのURLの変更
先ほど記録したHOSTを下記コマンドの"ホスト名"の部分に入れて実行する。
ユーザ名とリポジトリ名は変更せずそのまま。

```terminal
$ git remote set-url origin ホスト名:ユーザID/リポジトリ名.git
```


ここまでできたらPush可能だと思います。

```terminal
$ git push origin master
```


##2個目の鍵の作成
今回の目的は複数の鍵を管理することなので、再度同じ手順で鍵を作成します。
先ほどの手順で鍵を作成します。

```terminal:鍵の作成
$ ssh-keygen
```


##HOSTの追加
先ほど設定したsshのconfigファイルに別名称のHOSTを追加します。

```vim:
Host github.com.XXXX
  HostName github.com
  User git
  Port 22
  IdentityFile ~/.ssh/鍵のファイル名
  TCPKeepAlive yes
  IdentitiesOnly yes

Host github.com.YYYY
  HostName github.com
  User git
  Port 22
  IdentityFile ~/.ssh/2個目の鍵のファイル名
  TCPKeepAlive yes
  IdentitiesOnly yes
```

##2個目のリモートリポジトリのURLの変更
最初の手順と同様にURLを書き換えます。

```terminal
$ git remote set-url origin ホスト名:ユーザID/リポジトリ名.git
```


問題無くpushできればSSHの設定ファイルが正常に読み込めています。

```terminal
$ git push origin master
```


##終わりに
GitHubでリポジトリを複数作成した場合に、同じ鍵を利用するな！と怒られますが、
このように複数の鍵を管理できれば、解決しそうです。
ダイレクトメッセージ機能実装　ブランクのメッセージルームがあれば削除する

ダイレクトメッセージ機能の実装

Qiitaの記事ではRailsガイドが非同期のLINEみたいな感じでカリキュラムが組まれているが、
そこまでリアルタイムで反映される機能は今回制作しているアプリでは求めないので下記の記事を参考にさせていただき実装した。
コードは条件分岐が多くあったので、コードの内容理解を行いながら進めた。

参考記事
https://qiita.com/nojinoji/items/2b3f8309a31cc6d88d03
https://teratail.com/questions/159995

下記の問題が想定されたので、コードを追加した。
![スクリーンショット 2019-04-12 18.44.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/383660/12e3ee69-6a0f-b095-2090-c8aec7e9bc69.png)


    @current_entries = current_user.entries.pluck(:room_id) #pluckで指定したカラム値のみを取り出す
    my_room_ids = []
    my_room_ids << @current_entries

    @messages = Message.where(room_id: my_room_ids).pluck(:room_id)
    @messages = @messages.uniq                                        #変数内の重複したカラムを削除
    @nil_message_room_id = @current_entries - @messages               #２つの配列の差分確認
    Entry.where(room_id: @nil_message_room_id).destroy_all            #entryレコードの削除


もっとスマートな方法があるかもしれないが、とりあえずこれでメッセージが存在しないメッセージルームは削除された。
もっと言えばメッセージの送信が完了しないとメッセージルーム(room.id)が作られないようになれば無駄な通信を行わないので良いかと思うが、その方法があればアドバイスいただきたいです。