OmniAICreator/Qiita-1.07M huggingface dataset:
raspberry pi用のSDの作成

#備忘録として

#SDカードのフォーマット

`gparted`でGUIが起動する



#SDのデバイス名の確認
`df -h`

#アンマウント
`umount デバイス`でアンマウント

#書き込み
`sudo dd bs=4M if=2017-07-05-raspbian-jessie-lite.img of=/dev/sdc`
これで書き込み可能
sdcなどのデバイスのあとの数字は使わない
macでsedコマンドを使う

macでsedコマンドを実行するときに、Linuxと違った！という話

# 内容
macのターミナルでsedコマンドを実行する

# やったこと
## sedコマンドを実行してみる
jsonファイルに対して、置換してみる。

```
sed -i -e "s/AAA/BBB/g" *.json
```

はい、エラーですね。

```
sed: RE error: illegal byte sequence
```

## sedコマンドを環境変数付きで実行
なんか環境変数を混ぜる？と正常に実行できた

```
LC_ALL=C sed -i -e "s/AAA/BBB/g" *.json
```

ちなみにオプションの内容は、
-i は置換後の内容を上書き
-e はバックアップ
って感じ



LinuxのRedHat系はこんなことしなくてもよかったのにー
って思ってハマったやつでした
【echo】ファイルのアップロード方法で詰まった話

goでファイルをアップロードさせるやり方を調べると大体こんな感じのソースが出てくると思います。

```go
func UploadFile(w http.ResponseWriter, r *http.Request) {

    upload_file, _, err := r.FormFile("input_name")
    if err != nil {
        http.Error(w, err.Error(), http.StatusInternalServerError)
        return
    }
    defer upload_file.Close()

    dst_file, err := os.Create("/tmp/tmp.txt")
    if err != nil {
        http.Error(w, err.Error(), http.StatusInternalServerError)
        return
    }
    defer dst_file.Close()

    io.Copy(dst_file, upload_file)
    http.Redirect(w, r, "/show", http.StatusFound)
}

```

リクエストからアップロードするファイルをハンドリングしているのですが、
echoのコントローラの場合はリクエストを c echo.Context で扱うため上記のままだと上手くいきません。

```golang
func UploadCsv(c echo.Context) error {
    upload_file, err := c.FormFile("input_name")
    if err != nil {
		return err
	}

    src, err := upload_file.Open()
    if err != nil {
		return err
	}
    defer src.Close()

    dst_file, err := os.Create("./tmp/tmp.txt")
    if err != nil {
		return err
	}
    defer dst_file.Close()

    if _, err = io.Copy(dst_file, src); err != nil {
		return err
	}

    return c.JSON(http.StatusOK, "file has uploaded")
}
```

c.Formfile()に対してOpen()メソッドを使いio.Readerオブジェクトに変換する必要があるみたいです。

参考
[File Upload Recipe | Echo - High performance, minimalist Go web framework](https://qiita-image-store.s3.amazonaws.com/0/242303/e20d1fba-f06d-abfb-1e57-af9242c9caa9.png)
2年間C#プロジェクトに携わった中でよく使ってきたLINQまとめ

## 0. はじめに
ここ2年程、C#を使ったプロジェクトに携わっています。
LINQがこれまた便利なもので、コードがシンプルになるためガシガシ使っているのですが、
備忘録のためよく使うLINQをまとめておきたいかと思います。


## 1. LINQとは
Language Integrated Queryの略です。
SQLのクエリのような表記を使うことで、データに対する検索や操作を簡単に直感的に行うことができます。
SQLとは違う！！と怒る方もいるようですが、私は気にしません。
DQとFFの違いと思ってください。(←大嘘)


## 2. よく使ってきたLINQ

### 2-1. Where
指定した条件に一致する要素のみを抽出します。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.Where(v => v % 2 == 0); // 結果：2, 4
```

### 2-2. Any
要素が含まれているかを調べます。条件を指定することもできます。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.Any(); // 結果：true
values.Any(v => v == 3); // 結果：true
values.Any(v => v == 7); // 結果：false 
```

### 2-3. Contains
指定した要素が含まれているかを調べます。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.Contains(3); // 結果：true
values.Contains(7); // 結果：false 
```

### 2-4. First
先頭要素を取得します。条件を指定することもできます。
値が取得できない場合はエラーとなります。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.First(); // 結果：1
values.First(v => v % 2 == 0); // 結果：2 
values.First(v => v % 2 == 9); // 結果：エラー  
```

### 2-5. FirstOrDefault
先頭要素を取得します。条件を指定することもできます。
値が取得できない場合は型の初期値が返ります。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.FirstOrDefault(); // 結果：1
values.FirstOrDefault(v => v % 2 == 0); // 結果：2 
values.FirstOrDefault(v => v % 2 == 9); // 結果：0  
```

### 2-6. Last
末端要素を取得します。条件を指定することもできます。
値が取得できない場合はエラーとなります。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.Last(); // 結果：5
values.Last(v => v % 2 == 0); // 結果：4
values.Last(v => v % 2 == 9); // 結果：エラー  
```

### 2-7. LastOrDefault
末端要素を取得します。条件を指定することもできます。
値が取得できない場合は型の初期値が返ります。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.LastOrDefault(); // 結果：5
values.LastOrDefault(v => v % 2 == 0); // 結果：4 
values.LastOrDefault(v => v % 2 == 9); // 結果：0  
```

### 2-8. Max
最大要素を取得します。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.Max(); // 結果：5
```

### 2-9. Min
最小要素を取得します。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.Min(); // 結果：1
```

### 2-10. ElementAt
指定したインデックス位置にある要素を取得します。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.ElementAt(2); // 結果：3
```

### 2-11. Distinct
重複する要素を除外します。

```C#
var values = new[] { 1, 2, 3, 1, 4, 3, 5 };
values.Distinct(); // 結果：1, 2, 3, 4, 5
```

### 2-12. Select
変換関数を適用した結果を取得します。

```C#
var values = new[] { 1, 2, 3, 4, 5 };
values.Select(v => v * v); // 結果：1, 4, 9, 16, 25
```

## 3. おわりに
LINQを使ってシンプルなコードを書いていきましょう！
他にもありましたら随時更新させて頂きます。

※以下のサイトでC#のビルド・実行が簡単に行えます。ちょっとしたお勉強のときにとても便利！  
https://dotnetfiddle.net/
RailsでのDBとテーブル作成とカラムのオプションについて

ど忘れするので自分用メモ
## DB作成
```terminal:ターミナル
$ rails g db:create
```
## DB削除
```terminal:ターミナル
$ rails d db:create
```
## モデル作成
基本的にテーブル作成する際はモデルも作成する。

```terminal:ターミナル
$ rails g model product
```
## モデル削除
```terminal:ターミナル
$ rails d model product
```

## マイグレーションファイル
モデルを作成したらマイグレーションファイルも作成される。
マイグレーションファイルを編集することで、テーブルのカラムを作成できる。

```rb:マイグレーションファイル
class CreateProducts < ActiveRecord::Migration[5.0]
  def change
    create_table :products do |t|
      t.string      :name, null: false, index: true, unique: true,
      t.integer     :price, default: 100, null: false
      t.text        :info
      t.references  :user
    end
  end
end
```
説明
```t.string```→カラムの型を文字列型に指定
```name```→カラム名を「name」
```null: false```   →「not null制約（nullはNG）」をつける
```index: true```   →インデックスをつける
```unique: true```  →一意制約をつける。
```t.integer```→カラムの型を数値型に指定
```default: 100```→初期値（100）を設定
```t.text```→カラムの型をテキスト型に指定
```t.references```→自動でuserテーブルの外部キーを作ってくれる。
※随時、出くわすたびに追加予定

## マイグレート
マイグレートすることで、マイグレーションファイルを元にテーブルが作成される。

```terminal:ターミナル
$ bundle exec rake db:migrate
```
## マイグレート取り消し
一つ前のマイグレートした情報がロールバックされる。

```terminal:ターミナル
$ bundle exec rake db:rollback
```

## カラムの追加
すでに作成（マイグレート）済みのテーブルに対してカラムを追加する。

```terminal:ターミナル
$ rails g migration AddColumnToProducts count:integer
```

上記コマンドを実行すると自動でカラム追加のマイグレーションファイルが作成される。

```rb:マイグレーションファイル
class AddColumnProducts < ActiveRecord::Migration[5.0]
  def change
    add_column :products, :count, :integer
  end
end
```

```terminal:ターミナル
$ bundle exec rake db:migrate
```

## カラムの削除
すでに作成（マイグレート）済みのテーブルに対してカラムを削除する。

```terminal:ターミナル
$ rails g migration RemoveCountFromProducts count:integer
```
上記コマンドを実行すると自動でカラム削除のマイグレーションファイルが作成される。

```rb:マイグレーションファイル
class RemoveNameFromTweets < ActiveRecord::Migration[5.0]
  def change
    remove_column :products, :name, :string
  end
end
```
```terminal:ターミナル
$ bundle exec rake db:migrate
```

## マイグレーションファイル直接修正
マイグレーションファイルを作成し、直接編集する場合

```terminal:ターミナル
$ rails g migration change
```
```rb:マイグレーションファイル
class Change < ActiveRecord::Migration[5.0]
  def change
    add_column    :products, :name, string   #自分で記述
    remove_column :products, :count, integer #自分で記述
    add_reference :products, :user #外部キー(user_id)を追加
  end
end
```
上記例だとstring型のnameカラムが作成され、integer型のcountカラムが削除される。

```terminal:ターミナル
$ bundle exec rake db:migrate
```
CircleCIのビルド開始時にSlackに通知

CircleCIのビルド結果の通知はSlackとCircleCIを連携させれば自動で通知してくれるのですが、ビルド開始の通知をする方法がなかったのでまとめておきます。

## 結論
SlackのIncoming WebHooksを使ってcurlでたたくだけ。

もはやこれ以上言うことはないですが、一応やり方を書いておきます。

## SlackからWebhook URLを取得
ブラウザでSlackにログインしている状態で以下のURLにアクセスします。
https://slack.com/services/new/incoming-webhook

![Screen Shot 2018-04-17 at 15.57.08.png](https://qiita-image-store.s3.amazonaws.com/0/71629/acfb8601-b8cf-3473-4fc6-3b0935a1d571.png)

表示されるページの `Choose a channel...` というプルダウンで連携するchannelを選択します(private channelも選択できます。)
`Add Incoming WebHooks integration`をクリックして連携します。

するとWebhook URLが記述されているページが表示されるのでURLを控えておきましょう。
![Screen_Shot_2018-04-17_at_16_48_31.png](https://qiita-image-store.s3.amazonaws.com/0/71629/5840d72e-cac1-ecbc-33e7-a0737eeb0399.png)

## config.ymlにcurlコマンドを設定
`.circleci/config.yml`にSlack通知用のcurlコマンドを設定しましょう。(CircleCI2.0)
(CircleCIの環境変数(`$SLACK_WEBHOOK_URL`)に先ほど控えたURLを設定しています。)

```.circleci/config.yml
- run:
    name: notify to slack
    command: |
      curl -X POST \
      $SLACK_WEBHOOK_URL \
      -H 'content-type: application/json' \
      -d '{
        "text": "Build started!"
      }'
```

## 結果
ブランチをPUSHするとCircleCIが走り、

![Screen Shot 2018-04-17 at 18.44.53.png](https://qiita-image-store.s3.amazonaws.com/0/71629/190b5ab1-6b81-9d2d-6f36-3f5bd67da9a2.png)

無事Slackに通知がきました :tada:
AWS Cloud9のインストール時に"curses not found"が発生して進まない。

## 状況

環境を新規作成する際、Connect and run in remote server（SSH）を選択して
さくらVPSを利用しようとしたが、下記エラーが発生してしまい、Cloud9が起動しない。

![スクリーンショット 2018-04-17 17.34.01.png](https://qiita-image-store.s3.amazonaws.com/0/28850/6d0dd1f3-f0fc-1d17-b4bf-0850e3434e41.png)

## 環境

さくらVPSはCentOS7.4を利用。

```sh
$ cat /etc/redhat-release
CentOS Linux release 7.4.1708 (Core)
```

## 原因

tmuxのインストールに失敗しているようなので、Cloud9経由でなく、直接VPSにtmuxをインストールしてみる。

その前に、tmux（てぃーまっくす）ってそもそも何？

> 端末を多重化し、１つのターミナルから複数の端末を制御するためのソフトウェア

Cloud9上でタブでコンソールをいくつも開くために必要なのかな？


## 手順

[GitHub](https://github.com/tmux/tmux/wiki)から最新版のソースコードをダウンロード

```sh
$ sudo curl -kLO https://github.com/tmux/tmux/releases/download/2.7/tmux-2.7.tar.gz

-k SSL証明書エラーを無視して処理継続
-L リダイレクトを許可
-O ダウンロードしたデータをファイル保存
```

コンパイルに必要なモジュール群をインストール

```sh
$ sudo yum -y install gcc libevent-devel ncurses-devel
```

と、ここまで来たところで「ncurses-devel」をインストールしている事に気づき
"curses not found"って言ってるんだから、これでイケるんじゃね？と思ったが
まだダメだったので大人しく続ける。浅はかな考えはイクナイ。

```sh
$ tar -zxvf tmux-2.7.tar.gz
$ cd tmux-2.7
$ ./configure
$ make
$ sudo make install
$ tmux -V
tmux 2.7
```

これでエラー画面からPreviousを押して戻り、再度インストーラーを走らせたら無事に起動したよ！

## 参考記事
[CentOS7 に最新の tmux を導入](https://qiita.com/iitenkida7/items/938a21ce5b5b4f984088)
【2018年版】macにrbenvを入れてrubyを管理できるようにしちゃう

# はじめに

端末を工場出荷状態に戻してからrubyの開発環境を作ってなかったので、いつもの通りイケてるやり方で構築しようと思います

## 環境
- OS High Sierra ver 10.13.3
- homebrew インスコ済み


## Ruby開発環境に必要なもの

- rbenv
- ruby-build
- rbenv-communal-gems（追記しました）

### rbenvとは
rubyのversion管理を手伝ってくれるイケてるヤツ
[【github】 rbenv 公式](https://github.com/rbenv/rbenv)

コマンドの説明も丁寧に書いてくれてるのでREADMEくらいは読むようにしましょう

### ruby-buildとは
ruby-buildは、UNIX系で異なるversionのrubyをコンパイルしインストールするための、【rbenv install】コマンドを提供するrbenvのプラグイン

[【github】 ruby-build 公式](https://github.com/rbenv/ruby-build)



## 0.確認
実はmacOSは初期でruby入ってるんです（じゃなきゃhomebrew入れられないですねw）
なのですがversionが古いです
2017年の年末にはversion2.5.0がリリースしましたし、今は2.5.1が最新ですね
[Ruby 公式サイト](https://www.ruby-lang.org/ja/)

```console
## 作業前の私のPCのruby version

$ ruby -v
ruby 2.3.3p222 (2016-11-21 revision 56859) [universal.x86_64-darwin17]
```



## 1.rbenvのinstall



### 早速brewでインストール
```console
$ brew install rbenv ruby-build
```

### 恒例の.bash_profileへの追記
1行目のif文はterminalを開いた時に`$ rbenv init`コマンドを自動で打ってくれる便利設定
2行目以下は単なるpathです
いつものごとく`$ source .bash_profile`を打つか、terminal再起動でおk

```sh
# rbenv PATH

if which rbenv > /dev/null; then eval "$(rbenv init -)"; fi
export PATH="$HOME/.rbenv/bin:$PATH"
eval "$(rbenv init -)"
```
### rbenvのinstall確認
```console
## install確認
$ rbenv -v
rbenv 1.1.1
```

## 2.rbenvで最新versionをinstallしちゃう

```console
## 環境のversion確認

$ rbenv versions
* system (set by /Users/[user_name]/.rbenv/version)
```
systemっていうのはdefaultでインストールされてるヤツですね（ver 2.3.3）

### 早速rbenvでインストール
```console
## installできるrubyのversionを確認

$ rbenv install -l

Available versions:
  1.8.5-p52
  1.8.5-p113
  （中略）
  2.5.0-dev
  2.5.0-preview1
  2.5.0-rc1
  2.5.0
  2.5.1
  2.6.0-dev
  2.6.0-preview1




## version指定してinstall

$ rbenv install 2.5.1

ruby-build: use openssl from homebrew
Downloading ruby-2.5.1.tar.bz2...
-> https://cache.ruby-lang.org/pub/ruby/2.5/ruby-2.5.1.tar.bz2
Installing ruby-2.5.1...
Installed ruby-2.5.1 to /Users/[user_name]/.rbenv/versions/2.5.1
```

## 3.rbenvでversion管理しちゃう

```console
## 使用するversionを変更

$ rbenv global 2.5.1



## 環境のversion確認

$ rbenv versions
  system
* 2.5.1 (set by /Users/[user_name]/.rbenv/version)
```

## 4.DONE

お疲れ様でした、忘れずドヤ顔です:relaxed:


## 5.追記　rbenv-communal-gemsは入れておきましょう

今回rbenvの導入編でいいやって思ってたのですが、コメント頂いて開発に使わないことはないと思ったので追記します（scivolaさんありがとう！）

###　rbenv-communal-gemsとは
rbenvでインストールされたrubyのgemsディレクトリを共有化することができるヤツです
これないとrubyのversion up対応の時にgemの入れ直しをしないといけなかったりして酷い目に合います

[github rbenv-communal-gems公式](https://github.com/tpope/rbenv-communal-gems)

###　早速brewでインストール

```console
$ brew install rbenv-communal-gems
```
FlysystemでCSVを作成・zip化してサーバにアップロードしたメモ

#背景
取得した配列データをCSV化の上zipファイルにまとめ、
そのzipファイルを外部サーバにアップロードしたいことがありました。
その処理にFlysystemというFilesystemを簡単に扱えるようにしたシステムを使用しました。
手探りで実装したのですが成功した処理をメモとして残します。
※Qiitaアップ用に元の処理を書き換えているためこのままでは正常に動かない可能性があります。

#前提
 Flysystemをインストールしてあること

#ソース
##Zip Archive
Zipファイルをローカルに保存する処理

```zip_archive.php
use League\Flysystem\Filesystem;
use League\Flysystem\ZipArchive\ZipArchiveAdapter;
use League\Flysystem\Config;

$zip_file = 'file.zip';

// league/flysystem-ziparchive
$filesystem = new Filesystem(new ZipArchiveAdapter($zip_file));

if (!$filesystem){
    return 'LINE:' . __LINE__ . ' new Filesystem がfalse';
}

$str_1 = '"値１","値２","値３"\r\n"値４","値５","値６"\r\n';
$path_1 = '/file_1.csv';
// ZIPにcsvファイルを書き込み
$wrote_1 = $filesystem->write($path_1, $str_1);
if (!$wrote_1){
    return 'LINE:' . __LINE__ . ' $filesystem->write がfalse';
}

// 対象のzipに複数のcsvを続けて書き込むことができる
$str_2 = '"値１","値２","値３"\r\n"値４","値５","値６"\r\n';
$path_2 = '/file_2.csv';
// ZIPにcsvファイルを書き込み
$wrote_2 = $filesystem->write($path_2, $str_2);
if (!$wrote_2){
    return 'LINE:' . __LINE__ . ' $filesystem->write がfalse';
}

// Zipを強制的に保存
$closed = $filesystem->getAdapter()->getArchive()->close();
```
##SFTP
ローカルのZipファイルを外部サーバにアップロードする処理

```sftp.php
use League\Flysystem\Filesystem;
use League\Flysystem\Sftp\SftpAdapter;
use League\Flysystem\Adapter\Local;
use League\Flysystem\Config;

$file_name = 'file.zip';

// アップロード対象のzipのパス
$local_zip_dir = 'local/path/to/zip';
$local = new Filesystem(new Local($local_zip_dir));

// 外部サーバの指定
// league/flysystem-sftp
$sftpConfig = [
    'host' => 'example.com',
    'port' => 22,
    'username' => 'username',
    'password' => 'password',
    'privateKey' => 'path/to/or/contents/of/privatekey',// パスを指定するときは.pem
    'root' => '/path/to/root',
    'timeout' => 10,
    'permPublic' => 0775,
];
$remote = new FileSystem($sftpConfig);

if($local->has($file_name)){
    $contents = $local->read($file_name);
    $wrote = $remote->write($file_name, $contents, ['visibility'=>'public']);

    if (!$wrote){
        return false;
    }
}
```
外部サーバの保存先ディレクトリの権限によっては保存ができなかったので注意すると良いです。

#参考
https://flysystem.thephpleague.com/
http://wern-ancheta.com/blog/2015/09/13/working-with-the-filesystem-with-flysystem/
JavaScript初心者がNEM Library使ってWebアプリを作りたい、から環境構築した(その1)

巷で流行ってるってことで、触ってみようかと思います。
私自身はVC++でWinアプリ系がメインです。
NEM LiblaryはJavaScriptということなので、まったくの専門外です。
断定していてもわかっていないこと多数です。
ご注意ください。

#Visual Studio Codeのインストール
OSはWindows10、開発環境はVisual Studio Codeを使ってみようと思います。
https://code.visualstudio.com/
こちらからインストーラーをダウンロードして、ぽちぽちインストールします。

#Node.js + npmのインストール
次に、Node.jsをインストールします。
Node.jsは、サーバー側のプラットフォームで、サーバーもJavaScriptで動かすことができるようになりそうです。
この辺がわかりやすいかも？
https://eng-entrance.com/what-is-nodejs

一緒に知っておくことは、npmです。
npmはパッケージ管理ツールです。
Node.js向けの公開されているライブラリを統合管理するツールって感じです。
npmを使うことで、自分でHPを探し、自分でダウンロードし、自分でインストールする、といったことが不要になります。
Node.jsに一緒に入っています。

まずはNode.jsをインストールします。
https://nodejs.org/en/download/
こちらからインストーラをダウンロードして、ぽちぽちインストールします。

インストールが終わったら、Visual Studio Codeを起動して、ターミナルからコマンドを実行します。
いろいろなHPにあるコマンドライン入力は、Visual Studio Codeの場合は、このターミナルからの入力のことです。

`node --version`
`npm --version`
バージョンが表示されれば、インストールOKです。

# yarnのインストール
こちらを見ると、yarnなるものをお使いのようなので、yarnを入れます。
https://qiita.com/y-temp4/items/9be4b041565a4bb24dab
yarnもnpmと同じく、パッケージ管理ツールです。
ちょっと便利になっているっぽい？

ターミナルから以下を実行します
`npm install -g yarn`
インストールが終わったら以下でバージョンを確認します。
`yarn -v`
バージョン表示されればOKです。

次にVisual Studio Codeの拡張機能をインストールしておきます。
左端の![image.png](https://qiita-image-store.s3.amazonaws.com/0/249932/fa7e170a-8f15-d667-72fc-44a0c2d9a8a5.png) をクリックします。
テキストボックスにyarnといれ、「yarn commands for VSCode」をインストールします。

これをするとF1でウインドウ上部に開く、クイックオープンへのコマンド追加になるっぽいです。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/249932/95df6801-65a7-2b00-9215-3872339596bf.png)

---
NEM Library入れるのは次々回になります。
ここまではPC全体でのセットアップしたが、VSCodeもJavaScriptもさっぱりなので、
そもそも何？どんなもの？からになってとても大変でした。

[JavaScript初心者がNEM Library使ってWebアプリを作りたい、から環境構築した(その1)](https://qiita.com/kihaku_dol/items/fa53256de1aafcd110af)
[JavaScript初心者がNEM Library使ってWebアプリを作りたい、から環境構築した(その2)](https://qiita.com/kihaku_dol/items/8e1b4787a36cd23a87d2)
[JavaScript初心者がNEM Library使ってWebアプリを作りたい、から環境構築した(その3)](https://qiita.com/kihaku_dol/items/049c94731482b6f346c7)

---
**変更履歴**
2018/05/10 リンク先追加
暗黙的submit

仕事で対応してた時に、「なんでボタン押してないのに勝手にsubmitされるん？」ってなったので、自分用メモ。

# なんでこんなん書いたん？
スマホ用ページを作ってた時に、submit前に入力チェックをするはずが、入力チェックされずにPOST送信されちゃった、ﾃﾍﾍﾟﾛ♪

# 調べてみると
http://www.html5.jp/tag/elements/forms-form-submission.html

こんなページにぶち当たる。なるほど。

# 結論を言うと

こういう事ですな。

-ページ内にformを作ってて、POST指定してた
-そのページ内に入力オブジェクトが一つのみ
-上記2つを満たす場合、実行ボタンを押すと勝手にサブミットﾋｬｯﾊｰ

これは良いのか？とか思うんだけど、とりあえず対応してみるか。

# 対応
ページ内に入力オブジェクトを隠し項目でもう一つ作る。

# 結果
submitされなくなった！
HTML と JavaScript が shift_jis の場合の JSON の文字コードについて

# 比較
以下を変えて比較

- JSON の読み込み方
- サーバのレスポンスヘッダの `Content-Type` の文字コード
- JSON の文字コード

## XHR の場合

|Content-Type　　|JSON　|結果　　　　　　　|
|:--|:--|:--|
|utf-8（指定なし）|shift_jis|JSONパースエラー|

|Content-Type　　 |JSON　|結果　　　　　　　|
|:--|:--|:--|
|shift_jis|shift_jis|正常|

|Content-Type　　 |JSON　|結果　　　　　　　|
|:--|:--|:--|
|utf-8（指定なし）|utf-8|JSONパースエラー|

|Content-Type　　 |JSON　|結果　　　　　　　|
|:--|:--|:--|
|shift_jis|utf-8|文字化け|

`Content-Type` と JOSN の文字コードが `shift_jis` の場合に正常に動作。



## Fetch API の場合

|Content-Type　　 |JSON　|結果　　　　　　　|
|:--|:--|:--|
|utf-8（指定なし） |shift_jis|JSONパースエラー|

|Content-Type　　 |JSON　|結果　　　　　　　|
|:--|:--|:--|
|shift_jis|shift_jis|JSONパースエラー|

|Content-Type　　 |JSON　|結果　　　　　　　|
|:--|:--|:--|
|utf-8（指定なし）|utf-8|正常|

|Content-Type　　 |JSON　|結果　　　　　　　|
|:--|:--|:--|
|shift_jis|utf-8|正常|

JOSN の文字コードが `utf-8` の場合に正常に動作。



# 結論
`Content-Type` の文字コードがなんであろうと、`Fetch API` で読み込み JSON の文字コードを `utf-8` にしておけば大丈夫そうな感じではある。
tensorflow.jsでsandbox

#概要
tensorflow.jsのsandbox作った。


#成果物

http://jsdo.it/ohisama1/6e43

#サンプルコード

```
var out = document.getElementById("out");
var src = document.getElementById("src"); 
out.innerHTML = '';
function run() {
    try
    {
        eval(src.value);
        alert("結果は、コンソール見てね。");
    }
    catch(e)
    {
        var b = document.createElement('b');
        b.appendChild(document.createTextNode(e));
        b.style.color = '#F00';
        out.appendChild(b);
    }
}


```

以上。
React Native で Repro を利用

# 概要

公式ドキュメントには ReactNative での使用例は無いが、 ReactNative でも Repro を問題無く使用できた。

公式ドキュメントの Objective-C 版のコードを貼り付け、 Bridge できるようにしておき、 あとは JavaScript 側から呼び出せば良い。

イベントも取れるし、録画もできる。

# 環境

- React Native 0.52.0
- Repro 2.10.0

Repro は Cocoapods を利用してインストールした。

# やったこと

例として、マスキング機能をJSから利用できるようにする。

※ `AppDelegate.m` にて Repro SDK の設定はしているものとする。


下記のような Objective C のモジュールを作成して

```objc:Bridge.h
#import <React/RCTBridgeModule.h>

@interface Bridge : NSObject <RCTBridgeModule>
@end
```

```objc:Bridge.m
#import "Bridge.h"
#import <React/RCTLog.h>
#import <Repro/Repro.h>

@import Firebase;

@implementation Bridge

RCT_EXPORT_MODULE();

RCT_EXPORT_METHOD(maskReproMovie)
{
  CGFloat width = [UIScreen mainScreen].bounds.size.width;
  CGFloat height = [UIScreen mainScreen].bounds.size.height;
  [Repro maskWithRect:CGRectMake(0, 0, width, height) key:@"private"];
}

RCT_EXPORT_METHOD(unmaskReproMovie)
{
  [Repro unmaskForKey:@"private"];
}

@end
```

画面サイズを取得してマスクしている。

あとはJS側で

```js
import { NativeModules } from 'react-native'

export const unmaskReproMovie = () => {
  if (__DEV__) {
    console.log('[Repro] Unmask Repro Movie')
  }
  NativeModules.Bridge.unmaskReproMovie()
}
```

みたいにしてあげればOK。

ただし、ネイティブのように要素を指定してマスキングの方法がわからなかったので（そもそも、JSの仮想DOMに対して指定することができるのか・・・？）、画面全体をマスキングした。

# 所感

初めてReproを使ったが、最高である。

- 導入までの手順が、今自分が何をしなければ良いのかが、非常に分かりやすい。
- SDKの導入、使用方法が分かりやすい。ドキュメントが良い。
- 管理画面のUIが非常に使いやすい。参考にしたい。
Perlの範囲演算子はどこまで伸ばせるのだろうか？

# はじめに

Perlには範囲演算子という演算子`..`が存在します。
同等なものはRubyやSwiftにもあるようです。

```pl:example_two_dot_range.pl
# 範囲演算子 -> ..
foreach my $num (0..5) {
    print "$num ";
}
```

```sh:実行結果
$ perl example_two_dot_range.pl
0 1 2 3 4 5 
```

Rubyには、上記のドット2つの範囲演算子に加えて、ドット3つの範囲演算子`...`もあります。
Swiftの場合、ドット3つの範囲演算子`...`と、ドット2の範囲演算子に不等号を加えた演算子`..<`（どちらも区間演算子の一種）があります。

それぞれの言語において、ドット2つの範囲演算子とドット3つの範囲演算子は挙動が異なります。

参考サイト
- [class Range (Ruby 2.5.0)](https://docs.ruby-lang.org/ja/latest/class/Range.html)
- [swift - 範囲演算子 コレ→「...」](https://qiita.com/Ryosuke-Hujisawa/items/b268aecbbe78b7841376)

しかしPerlにはドット3つの範囲演算子は存在しません。



# 本当にPerlにはドット3つの範囲演算子はないのか？

実際に実行してみます。

```pl:example_three_dot_range.pl
# 範囲演算子？ -> ...
foreach my $num (0...5) {
    print "$num ";
}
```

```sh:実行結果
$ perl example_three_dot_range.pl
0 1 2 3 4 5 
```

なんとしっかり動いてくれます！
Perlにもドット3つの範囲演算子があったのでしょうか？



# ドットをもっと増やすとどうなるのか？

ドットを4つに増やしてみます。

```pl:example_four_dot_range.pl
# 範囲演算子？ -> ....
foreach my $num (0....5) {
    print "$num ";
}
```

```sh:実行結果
$ perl example_four_dot_range.pl
0 
```

さてどういうことでしょうか？

更に詳しく見るために、ドットを5つに増やしてみます。

```pl:example_five_dot_range.pl
# 範囲演算子？ -> .....
foreach my $num (0.....5) {
    print "$num ";
}
```

```sh:実行結果
$ perl example_five_dot_range.pl
syntax error at example_five_dot_range.pl line 2, near "....."
Execution of example_five_dot_range.pl aborted due to compilation errors.
exit status 255
```

さすがにドット5つの範囲演算子はないようです。



# ネタばらし

シンタックスハイライトがある場合はバレバレなのですが、ドット3つとドット4では次のコードと同義になります。

```pl:example_not_three_dot_range.pl
# 0...5 == 0. .. 5
foreach my $num (0.0 .. 5) {
    print "$num ";
}
```

```pl:example_not_four_dot_range.pl
# 0....5 == 0. .. .5
foreach my $num (0.0 .. 0.5) {
    print "$num ";
}
```

つまり、ドット3つの場合は`0.0`から`5`まで、ドット4つの場合は`0.0`から`0.5`までを表していたのです。

そのため、ドット3つの場合は`0 1 2 3 4 5 `であり、ドット4つの場合は`0 `だけだったのです。


# ちなみに

`...` という演算子自体は、Perlに存在します。
https://perldoc.jp/docs/perl/perlop.pod#Range32Operators

しかし、構文解析の問題か、 `.` を繋げた状態ではエラーとなってしまいます。
その証拠に、ちゃんと離したら理解してくれました。
perlのバージョンはv5.34.0です。

```pl:example_five_dot_range_with_space.pl
foreach my $num (0. ... .5) {
    print "$num ";
}
```

```sh:実行結果
perl example_four_dot_range_with_space.pl
# 0 
```


# おわりに

こんなコードを書く人がいるとは思えませんが、小ネタとして受け取ってください！

もし何か気づいたこと、気になったことがあれば教えていただけると幸いです。
Elasticsearch の検索結果を加工して Logstash のインプットにする

# はじめに

* Elasticsearch の検索結果を jq で加工して Logstash のインプットとし、フィルターの動作確認をしたりするのに使ってみる。

# Elasticsearch へ検索クエリの実行

```sh
curl -XGET 'http://localhost:9200/_search?size=1000' -o out.json
```

# jq で検索結果を加工

```sh
cat out.json | jq -c '.hits.hits[]._source' > input.json
```

# Logstash で加工したファイルをインプットに設定して実行

```logstash.conf
input {
  file {
    path => "/path/to/input.json"
    codec => "json"
  }
}
filter {
  if [foo] in "foo" {
    mutate { add_tag => "field in string" }
  }
}
output {
  stdout {
    codec => "json"
  }
}
```

```sh
logstash -f logstash.conf
```
gz ファイルを展開したときのファイルサイズを調べる

gz ファイルのままで、展開したときのファイルサイズを調べます。

## gzip コマンドを使う

```
$ gzip -l ssl.access.log.2018041623.gz
         compressed        uncompressed  ratio uncompressed_name
          132804343           957789310  86.1% ssl.access.log.2018041623
```

**compressed** が圧縮された (調べた) ファイルの現在のサイズ。**uncompressed** が展開したとき (非圧縮) のファイルサイズ。

## 複数の gz ファイルを展開したときの合計ファイルサイズを調べる

複数の gz ファイルを展開したときの合計ファイルサイズを調べる場合も同じコマンドオプションで合計サイズがわかります。

```
$ gzip -l ssl.access.log.2018041622.gz ssl.access.log.2018041623.gz
         compressed        uncompressed  ratio uncompressed_name
          161211012          1135090308  85.8% ssl.access.log.2018041622
          132804343           957789310  86.1% ssl.access.log.2018041623
          294015355          2092879618  86.0% (totals)
```

スペースを空けて複数のファイルを指定するだけで、最終行には合計ファイルサイズを表示してくれます。

調べたいファイルの数が多くなった場合は、`xargs` コマンドを利用して計算します。

```
$ ls | grep gz | xargs gzip -l
         compressed        uncompressed  ratio uncompressed_name
             152210             1182414  87.1% access.log.2018040100
             158032             3852468  95.9% access.log.2018040201
             118334             3233181  96.3% access.log.2018040302
...
          132804343           957789310  86.1% ssl.access.log.2018041623
         8561848974         66207219797  87.1% (totals)
```

このオプションのおかげで事前にファイルサイズがわかるので、ファイルを展開中にディスクの空き容量がなくなって作業のやり直しとかをせずにすみます。
PythonでWebスクレイピング

# 背景
前回同様なんとなく（笑）

# データ
こんなサイトがありました。
http://beer-cruise.net/
ご当地クラフトビールが載っているので、全部試しに取得してみたいと思います

# ライブラリ
* urllib2：URLからデータ取得用
* BeautifulSoup：取得したデータをHTMLパースする用

# 基本コード
```py
import urllib2
from bs4 import BeautifulSoup
# URL設定
url = 'http://beer-cruise.net/beer/Hokkaido.html'
# 読み込み
html = urllib2.urlopen(url)
# HTMLパース
soup = BeautifulSoup(html, "html.parser")
```
これでsoupの中にHTMLのデータが存在しますので、.find(タグ)や.get(クラス)などで詳細が取得できます。

# 確認
まずはどのタグを取得すべきなのか、HTMLソースを確認します。

    <table bgcolor="#e0ffd0" border="1" cellspacing="0" cellpadding="4">
    <tr valign="top">
    <th align="left" bgcolor="#d0fcff" colspan="4"><a name="hokkaido">　　　北海道</a></th>
    </tr>
    <tr valign="top">
    <td align="center">ブランド名</td>
    <td align="center">ブルーパブ名</td>
    <td align="center">製造元・企画元</td>
    <td align="center">所在地</td>
    </tr>
    <tr valign="top">
    <td align="left"><a href="Z00033.html" target="_top">えんがる太陽の丘ビール</a></td>
    <td align="left">麦酒館ふぁーらいと<font color=red>［閉店］</font></td>
    <td align="left"><img src="../image/label11.png" border="0">(株)遠軽農業振興公社</td>
    <td align="left">北海道遠軽町</td>
    …(省略)

ここから

1. trで一式取れば問題なさそう
1. thは都道府県名が記載（スペース考慮）
1. tdのalign=leftが取得対象
1. tdの1つ目が名前
1. tdの2つ目のfontに閉店などが記載

でいけるかな？

# 実装
```py
import urllib2
from bs4 import BeautifulSoup
# URL設定
url = 'http://beer-cruise.net/beer/Hokkaido.html'
# 読み込み
html = urllib2.urlopen(url)
# HTMLパース
soup = BeautifulSoup(html, "html.parser")
# 1.trタグ全取得
row_list = soup.find_all('tr')
prefecture = None
prefecture_beers = {}
for row in row_list:
    # 2.thは都道府県名
    if row.find('th') is not None:
        prefecture = row.find('th').string.replace(u'　', '')
    cols = row.find_all('td')
    if len(cols) < 2:
        continue
    # 3.tdのalign確認
    if cols[0].get('align') != 'left':
        continue
    # 4.ビール名
    beer_name = cols[0].text
    # 5.tdの2つ目のfont確認、閉店や製造中止は含めない
    if cols[1].find('font') is not None:
        continue
    if prefecture is None:
        continue
    if prefecture not in prefecture_beers.keys():
        prefecture_beers[prefecture] = []
    prefecture_beers[prefecture].append(beer_name)
```
辞書型のprefecture_beers変数に都道府県名とクラフトビール名が格納されます。
一点注意すべきはビール名取得をstringではなくtextにしていることです。

    <td align="left"><a href="111108.html" target="_top">薄野地麦酒<br>夕張石炭ビール</a></td>

この場合stringで取得する間に<br>タグがあるためNoneになりますのでtextにしています。

言い忘れてしまいましたが、今回のURLは北海道だけですので、全国の場合はさらにタブ分ループすると良いと思います。

# 参考

* [Python Webスクレイピング 実践入門](https://qiita.com/Azunyan1111/items/9b3d16428d2bcc7c9406)
* [Beautiful Soupで.stringを使うとNoneになってしまう時の解消法](https://qiita.com/booleanoid/items/211820516eb7a2191b32)
RHELでのカーネルパニック対策

恒久対応と暫定対応の2通りで対応可能

## 恒久対応の場合

/etc/sysctl.conf に以下を追記 ※rootにて
※以下の例では、カーネルパニック発生して10秒後(自然数で秒単位で設定可能)に再起動を行う

```bash:/etc/sysctl.conf
kernel.panic = 10
```

```bash:echoコマンドで追記する場合
$ /bin/echo 'kernel.panic = 10' >> /etc/sysctl.conf
```

追記後下記コマンドで反映

```bash:sysctlコマンドで反映
$ /sbin/sysctl -p
kernel.panic = 10
```

反映されているのを下記コマンドで確認

```
$ /sbin/sysctl kernel.panic
kernel.panic = 10
```

## 暫定対応

再起動するまでの暫定対応を行う場合は、`/proc/sys/kernel/panic`に秒数(自然数)を記載 ※rootにて

```bash:/proc/sys/kernel/panicの設定例
$ /bin/echo 10 > /proc/sys/kernel/panic
$ /bin/cat /proc/sys/kernel/panic
10
```

## カーネルパニックを意図的に発生させて動作確認

rootにて、下記コマンドで意図的にカーネルパニックを発生させて、設定した秒数(設定例だと10秒)後に再起動されるか確認

```bash:意図的にカーネルパニックを発生させる
$ /bin/echo c > /proc/sysrq-trigger
```
[macOS] そのkillallは本当に必要？ [screenshot]

スクリーンショットの保存先やファイル形式を変更したことがあるだろうか？

そう、Terminal でカチャカチャやるアレ。

```sh
$ defaults write com.apple.screencapture type jpeg
```

これだ。

何か忘れてないかって？

```sh
$ killall SystemUIServer
```
これの事かい？

大丈夫。君の macOS が Sierra 以降なら SystemUIServer の再起動は不要さ。

killall なんていう物騒なコマンドを使う必要は全くない。

キー入力は少ないに越したことはないしな。

じゃあな。
crossorigin なしの <link rel="prefetch"> で Amazon S3 上の JS を読んではいけない

[テストページ](http://macoshita-test-crossorigin.s3-website-ap-northeast-1.amazonaws.com/)

Amazon S3 では Origin 送ったときにしか CORS 関係のヘッダを返してくれないっぽい。
`<link rel="prefetch">` でリクエストしちゃうと Chrome は origin が付かない上にそれをキャッシュしちゃう。
そして肝心の script タグでの読み込みの時に、そのキャッシュをそのまま使っちゃうので、 CORS ヘッダが無いという理由で読み込みに失敗する :cry: 
Vary ヘッダで Access-Control-Allow-Origin とか返せば動きそうだけど、そこも S3 の範疇……。

## ソース

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="initial-scale=1">
  <title>crossorigin test</title>
  <link rel="prefetch" href="https://s3-ap-northeast-1.amazonaws.com/macoshita-test-crossorigin/main.js"
        crossorigin> <!-- important -->
</head>
<body>
  <h1>crossorigin prefetch test (maybe success)</h1>
  <a id="test" href="javascript:void(0)">Click to load script</a>
  <script>
    document.getElementById('test').addEventListener('click', function () {
      const script = document.createElement('script')
      script.src = 'https://s3-ap-northeast-1.amazonaws.com/macoshita-test-crossorigin/main.js'
      script.crossOrigin = 'crossorigin'

      document.getElementsByTagName('head')[0].appendChild(script)
    }, false)
  </script>
</body>
</html>
```

[この記事の英語版](https://macoshita.github.io/blog/2018-04-17-prefetch-crossorigin-amazon-s3/)
watchOS complicationの画像

complicationで使う画像は、透過型の白黒のpngじゃないと、

CLKImageProvider(onePieceImage: UIImage(named: "Modular")!)

で、存在しないってなる。
存在しないんじゃなくて、画像が適切じゃないって言ってほしい。


半日、ハマった。


參考
[ios - Complication Image is White Box - watchOS 2 ClockKit - Stack Overflow](https://stackoverflow.com/questions/34035443/complication-image-is-white-box-watchos-2-clockkit)
>you have to create a monochrome png image with the alpha-channel 

さすがstack over flow。
Windowsで認証付きProxy環境下でElixir+Phoenix Frameworkをインストールする際にハマった事。

タイトル通りで、えらくハマって諦めかけてたんですが、たまたま抜け方がわかったので記事にしておきます。

# 実施環境
Elixir 1.6.4 (compiled with OTP 19)
# 手順
1. Phoenix Frameworkに使うアプリのインストール
    1. nodejsのインストール
    2. PostgreSQLのインストール
2. Elixirのインストール
    1. Elixirのインストーラーをダウンロード&実行(この時にErlangもインストールされる)
3. Phoenix Frameworkのインストール
    1. `mix local.hex`を実行
    2. `mix archive.install https://github.com/phoenixframework/archives/raw/master/phx_new.ez`を実行
4. テスト
    1. プロジェクトのフォルダを作りたいところで、`mix phx.new <project>`を実行
    2. プロジェクトのフォルダの中に入り（`cd <project>`）、`mix ecto.create`を実行

以下の公式のドキュメントを元に、若干手順前後させてます
[Installation – Phoenix v1.3.2](https://hexdocs.pm/phoenix/installation.html#content)
[Up and Running – Phoenix v1.3.2](https://hexdocs.pm/phoenix/installation.html#content)

# nodeとかpostgresのインストールは省略します。
手順１、２のやり方は省略。認証付きプロキシの設定は似たような話がありますが、nodejsの場合には`npm config set`でやるのがよいと思います。
あと、プロキシの情報は会社の場合PACファイルでやってる事が多いと思いますが、このPACファイルをそのまま使う方法までは思いついてないです。
PACファイルの内容からプロキシサーバの情報は抜いてますが、やり方は省略。

# ハマった所
上記の手順３、手順４でProxy通す方法が異なる為、えらくハマったので記載しておきます。
## `mix local.hex`が実行出来ない
何も仕込んでない場合には以下の通り、接続出来ない旨のエラーが出て来ます。

```
>mix local.hex
** (Mix) httpc request failed with: {:failed_connect, [{:to_address, {'repo.hex.
pm', 443}}, {:inet, [:inet], :nxdomain}]}

Could not install Hex because Mix could not download metadata at https://repo.he
x.pm/installs/hex-1.x.csv.
```


で、結論だけ言いますと、以下のように環境変数を設定すると、認証付きプロキシでも通ります。

```
set HTTPS_PROXY=http://<proxy_userid>:<proxy_password>@<proxy_server>:<proxy_port>
```

ここで、注意点です。
自分が試した環境であると、\<proxy_userid\>に`@`が入っています。その場合、どうもその`@`のまま設定しないと上手く認証が通りません。パーセントエンコーディングしてしまうとダメです。
また、二重引用符で囲んで環境変数を設定した場合も、認証が通りません。
## 上記状態で、`mix ecto.create`が通らない。
`mix archive.install ...`も、上記プロキシ設定で通ります。`mix phx.new <project>`も通ります。
しかし、`cd <project>`の後の`mix ecto.create`でエラーになります。

```
>mix ecto.create
escript: exception error: no match of right hand side value undefined
  in function  rebar_log:log/3 (/home/tristan/Devel/rebar3/_build/default/lib/re
bar/src/rebar_log.erl, line 94)
  in call from rebar3:handle_error/1 (/home/tristan/Devel/rebar3/_build/default/
lib/rebar/src/rebar3.erl, line 325)
  in call from escript:run/2 (escript.erl, line 759)
  in call from escript:start/1 (escript.erl, line 277)
  in call from init:start_em/1 (init.erl, line 1085)
  in call from init:do_boot/3 (init.erl, line 793)
** (Mix) Could not compile dependency :ranch, "escript.exe "c:/Users/thyodo/.mix
/rebar3" bare compile --paths "c:/project/pleiades/elix/pilot/_build/dev/lib/*/e
bin"" command failed. You can recompile this dependency with "mix deps.compile r
anch", update it with "mix deps.update ranch" or clean it with "mix deps.clean r
anch"
```

結論から言うと、さっき変更した環境変数`HTTPS_PROXY`の中身のうち、`@`を%40に変更して再度設定した後、`mix ecto.create`を実行すると通ります。

```
>mix ecto.create
Compiling 13 files (.ex)
Generated pilot app
The database for Pilot.Repo has been created
```

# 免責事項
障害箇所の特定はやってません。その為、もっといい方法があるかも知れません。
特定のプラットフォームやバージョン依存の可能性があります。今後修正されるかも知れません。
（修正されるなら、%エンコーディングを許容してほしいですが・・・・・・）
WPFでDataGridのスクロールバーのパラメーターを取得

WPFでDataGridのメソッドからScrollChangedのイベントが取れない。
なので、VisualTreeHelperクラスを使って、親クラスから辿って取得した。

### DataGridのイベントでアタッチ

```C#
protected override void OnAttached()
{
  base.OnAttached();
  this.AssociatedObject.LoadingRow += this.AssociatedObjectUnloadingRow;
}
```

### ScrollChangedを取得
どのイベントで取得するかは、用途により変更してください。
今回は行の読み込みイベントで行っている。

```C#
private void AssociatedObjectUnloadingRow(object sender, DataGridRowEventArgs e)
{
  Decorator child = VisualTreeHelper.GetChild(AssociatedObject, 0) as Decorator;
  ScrollViewer childSV = child.Child as ScrollViewer;
  childSV.ScrollChanged += new ScrollChangedEventHandler(DataGrid_ScrollChanged);
}

```

これで、パラメーター取得できる。
あとは、スクロールバーの変化量取得したり・・最下層に移動したり・・・
Unityの基礎

Unityを本格的にすることに先立ち、用語や機能を知っておくことが重要だと思い書いておくことにした。

## **基本的に必要な知識**

1. グラフィックデータに多様な機能を追加してキャラクターを作る。
2. キャラクターを配置し、シーンを作る。
3. 必要なシーンをすべて作る。

Unityでゲームを制作するにはこんな大まかな流れがある。


## **用語**

gameObject : キャラクターや効果など画面に表示されるものはもちろん画面に表示されないカメラや照明などもオブジェクトである。
Component : 上記のgameObjectに追加された「機能」。ゲームオブジェクトを動かせる。
Asset : 3Dモデルや2D映像、サウンドのような「データ」を意味する。
Scene : ゲームを一個の場面ごとに作るための機能。ゲームオブジェクトが入ってる箱で考えていいと思う。
Prefab : ゲームオブジェクトをコピーする機能。コピー後簡単に変更ができ、どんなシーンでも簡単にコピーできる。

この仲でUnityの一番の特徴といえばPrefabだと思う。
色んな機能に応用することもできる便利な機能である。




このページはどんどん追加していく予定。
MacOSで正規表現を使ってファイル名を変更する

通常のファイル名変更であればmvで済ませられますが、
MacOS環境でLinuxの`rename`コマンドを使って正規表現で置換がしたかったので試してみました。

そもそもMacOSには`rename`コマンドが無いのでbrewでインストールします。

```
$ brew install rename
```

インストールが終わったら

```
$ rename
```

でインストールされているか確認します。

```
$ rename 'perl形式の正規表現' ファイル名
```

でリネームが出来ます。

仮に、ファイル名先頭に付与されている連番10文字を全てのファイルから削除したいとします。

```
$ rename ’s/^[0-9]{10}//‘ *
```

こんな感じでリネーム出来ます。
CUDA 9.0とcuDNN 7.0をUbuntu 16.04LTSにインストールする

# CUDA Toolkit 9.0のインストール
[NVIDIAの公式ページ](https://developer.nvidia.com/cuda-90-download-archive?target_os=Linux&target_arch=x86_64&target_distro=Ubuntu&target_version=1604&target_type=debnetwork)からCUDA Toolkit 9.0をダウンロードする。ダウンロードしたフォルダで以下のコマンドを実行する。メタパッケージの`cuda-9-0`をインストールすると、全てのCUDA ToolkitとDriverパッケージがインストールされる。（CUDA 9.1のインストール方法は[こちら](https://qiita.com/JeJeNeNo/items/a56be3be69dc88e6dfa4)）

```bash:terminal
sudo dpkg -i cuda-repo-ubuntu1604_9.0.*_amd64.deb
sudo apt-key adv --fetch-keys http://developer.download.nvidia.com/compute/cuda/repos/ubuntu1604/x86_64/7fa2af80.pub
sudo apt update
sudo apt install cuda-9-0
```

# パスの設定
以下のechoコマンドでCUDAのパスを`.bashrc`のファイルの最後に書き込む。その設定をsourceコマンドで読み込む。

```bash:terminal
echo -e "\n## CUDA and cuDNN paths"  >> ~/.bashrc
echo 'export PATH=/usr/local/cuda-9.0/bin:${PATH}' >> ~/.bashrc
echo 'export LD_LIBRARY_PATH=/usr/local/cuda-9.0/lib64:${LD_LIBRARY_PATH}' >> ~/.bashrc
source ~/.bashrc # CUDAのパスが書き込まれた~/.bashrcを読み込む。
```

```bash:.bashrcに追加される文字列

## CUDA and cuDNN paths
export PATH=/usr/local/cuda-9.0/bin:${PATH}
export LD_LIBRARY_PATH=/usr/local/cuda-9.0/lib64:${LD_LIBRARY_PATH}
```

CUDAのパスが通っているか確認。

```bash:terminal
echo $PATH             # 出力に"/usr/local/cuda-9.0/bin"が含まれているか？
echo $LD_LIBRARY_PATH  # 出力に"/usr/local/cuda-9.0/lib64"が含まれているか？
which nvcc             # 出力が"/usr/local/cuda-9.0/bin/nvcc"になっているか？
nvidia-smi             # nvidiaのGPUの情報が表示されているか？
```

# cuDNNのインストール
## cuDNN 7.0のインストール
https://developer.nvidia.com/rdp/cudnn-download からcuDNN 7.0 for CUDA 9.1のdebパッケージをダウンロードする（アクセスするにはメンバー登録が必要）。具体的には以下の３個のdebパッケージをダウンロードする。

- cuDNN v7.0.* Runtime Library for Ubuntu16.04 (Deb)
- cuDNN v7.0.* Developer Library for Ubuntu16.04 (Deb)
- cuDNN v7.0.* Code Samples and User Guide for Ubuntu16.04 (Deb)

ダウンロードしたフォルダで以下のコマンドを実行して、cuDNNをインストールする。

```bash:terminal
# Install Runtime library
sudo dpkg -i libcudnn7_7.0*+cuda9.0_amd64.deb
# Install developer library
sudo dpkg -i libcudnn7-dev_7.0*+cuda9.0_amd64.deb
# Install code samples and user guide
sudo dpkg -i libcudnn7-doc_7.0*+cuda9.0_amd64.deb 
```

# 動作確認
CUDAのサンプルコードを実行して動作確認する。
サンプルコードをホームディレクトリにコピーするシェルスクリプト（cuda-install-samples-9.0.sh）は　`/usr/local/cuda-9.0/bin/` にあるので、CUDAのパスが通っていればそのファイル名を指定するだけで実行できる。

```bash:terminal
cuda-install-samples-9.0.sh ~ # ホームディレクトリにサンプルコードをコピー。
cd ~/NVIDIA_CUDA-9.0_Samples/
make
cd 2_Graphics/volumeRender    # サンプルの実行ファイルがあるディレクトリに移動。
./volumeRender
```

![volume_render.png](https://qiita-image-store.s3.amazonaws.com/0/134160/9c0cea1a-53dd-7346-78f3-7513f65b5d70.png)

# アンインストール方法

```bash:terminal
sudo apt remove cuda-9-0
sudo apt autoremove
sudo apt remove libcudnn7 libcudnn7-dev libcudnn7-doc
rm -rfv ~/NVIDIA_CUDA-9.0_Samples/ # サンプルコードを消す。
# ~/.bashrcに追加されたPATHの設定をテキストエディタなどで消す。
# ログアウトしてPATHの設定の変更を反映。
```


# 参考
https://docs.nvidia.com/cuda/cuda-installation-guide-linux/index.html#package-manager-metas
https://qiita.com/JeJeNeNo/items/05e148a325192004e2cd
R rtweetでツイートを取得 (twitter スクレイピング)


### 概要
Rを使用してツイートを取得し、ツイート内にある特定の単語の出現回数をカウントしました。

### 今回行ったこと
「#グルメ」が入っているツイートを取得し、"ラーメン", "パン", "うどん"　のどれが出現回数が多いかを調べました（表記ゆれ対応はなし）

### 準備
まずは、Twitter Application Management (https://apps.twitter.com/) にログインし、
使用するappを選択。
「Keys and Access Tokens」のタブから
・Consumer Key (API Key)
・Consumer Secret (API Secret)
があるか確認してください。
こちらを使って、ツイートを取得していきます。


### ツイートの取得
```.R

# ライブラリの読み込み
library(rtweet)
library(devtools)

# tokenの設定
twitter_token <- create_token(app = "XXXX", # 自分で設定したappの名前
                              consumer_key = "YYYY", #Consumer Keyを入力
                              consumer_secret = "ZZZZ") #Consumer Secretを入力


# search_tweets("検索したいワード", n=取得したい件数, include_rts=リツイートを取得するかどうか)
rt <- search_tweets("#グルメ", n = 1000, include_rts = FALSE)

# ツイート部分の抽出
target_text <- rt$text

```


### ツイート内の特定の単語の出現回数を集計
"ラーメン", "パン", "うどん"の出現回数を集計する

```.R

library(foreach)
library(dplyr)
library(RMeCab)

# 特定の単語の抽出
tweet <- foreach(i=1:nrow(rt), .combine="rbind")%do%{
  target_text <- rt$text[i] #i番目のツイート内容を抽出
  word <- unlist(RMeCabC(target_text)) #単語ごとに分解
  target_word <- word[names(word)=="名詞"] %>% #名詞のみ抽出
    as.data.frame() 
  colnames(target_word) <- "word"
  target_word <- target_word %>%  
    filter(word %in% c("ラーメン", "パン", "うどん")) %>% #特定の単語のみ抽出
    mutate(id=i) #ツイート番号を付与
  return(target_word)
}

# 1ツイート中のある1単語の発言の上限を1回に揃えて集計
tweet %>% 
  unique() %>% 
  group_by(word) %>% 
  summarise(cnt = n()) %>% 
  arrange(desc(cnt))

```


###結果
ラーメンが多かったです。
ラーメン美味しいよね

```
# A tibble: 3 x 2
  word       cnt
  <fct>    <int>
1 ラーメン    41
2 パン        11
3 うどん       6
```


###その他
rtweetライブラリでは、ユーザ情報やお気に入りの情報など取得できます

```.R

# ユーザ情報(ユーザid,自己紹介文など)の取得
users <- users_data(rt)

# usersの6番目の人のfavoを取得してみる
get_favorites(users$user_id[6], n = 30, since_id = NULL, max_id = NULL,
               parse = TRUE, token = NULL)

```
githubに複数アカウントが原因でpushできない問題解決メモ

# 別のユーザーが紐付いている
fooでpushしたいのにhogeユーザーが紐付いている

```
$ git push origin master
remote: Permission to hoge/project.git denied to foo.
fatal: unable to access 'https://github.com/foo/project.git/': The requested URL returned error: 403

```

そんなときは。。。

 ```
$ git remote set-url origin git@github.com:foo/project.git
```
いまどきのプログラマーがアセンブリを学ぶ意味ある？

# <font color="#009F8C">**前書き**</font>

アセンブリを学ぼうと思い、手を付けだしたばかりの初心者です。
なのでアセンブリでの開発経験もありません。

なんでアセンブリ？って思うかもしれませんがほとんど興味です。

普段使ってるけど、仕組みはよく知らないものって
その仕組みがわかると面白くなってくる、みたいな感じです。

# <font color="#009F8C">**結論**</font>

先に結論から述べますと、<font color="red">**アセンブリを学ぶ意味は大いにある！**</font>と思います。

昨今、Google先生がなんでも教えてくれるので
何か作ろうと思った場合は調べればだいたいの事はすぐにできます。

便利なライブラリが沢山あるのでその機能を使えば大抵の事はできます。
コピペ最強時代です。

はっきり言ってアセンブリを学んでも、アセンブリで開発する事は一生無いと思っています。
ではアセンブリを学ぶ意味ってなんでしょう？

# <font color="#009F8C">**重要なのは言語そのものの習得ではなくて**</font>

大事なのはプログラミング言語を学ぶ事で得られるその他の知識

## **PHPなら**
PHPは主にサーバーサイドで動的なWEBサイトを作るために使われます。
PHPを習得する上では一般的なWEBの仕組みも学ぶ事になるでしょう。
サーバーの役割、DBとの連携、HTML、CSS、JSといったフロントの知識です。

むしろそれを知らなければPHPでWEBアプリを作ることはできないはずです。

## **C/C++なら**

C/C++を扱う上ではメモリやパソコンの基本的な動作原理を知る必要があります。
それを知らなければC/C++ではろくに何もできないからです。

逆にメモリやパソコンの仕組みという低レイヤーの知識を得る事で
作れるものの幅などもぐんと広がる事でしょう。

## **そんな感じで**

プログラミング言語を学ぶ時は、往々にして
その言語と密接にかかわるプログラム以外の知識が必要になります。

# <font color="#009F8C">**じゃぁアセンブリでは何を学べるのか**</font>

まだ駆け出しの自分がわかりきったような事を言うのも心苦しいですが
アセンブリはハードウェアと密接につながっています。

C/C++をやっていればメモリやCPUの役割などをなんとなく把握していると思いますが
アセンブリをやると特に、CPUの中身が見えてくる気がします。

アセンブリを学ぶことでハードウェアに対する知識が得られると感じています。
突き詰めていけば電子回路や電流に接近していくことになるのかと

アセンブリを学ぶことで、作れるものの幅や発想などが
さらに強化されることと思っています。

今まで原因不明だったエラーの内容を調べられるようになったり
新しいハードウェアを作って、そのハードウェアを使った何かを開発したり

アセンブリを学ぶ事でソフトウェアだけじゃなくハードウェアを含めた
クリエイティブ力を鍛える事ができるんじゃないでしょうか

# <font color="#009F8C">**なんでアセンブリを学ぼうと思ったのか**</font>

## **単純に興味がわいた**
前書きにもちょっと書きましたが。
PHPばかりしていた頃はメモリだなんだとか気にしたことなかったのですが
C/C++をやったことでメモリの使い方やパソコンの仕組みなんかが見えてきました。
アセンブリをすることでもっと深い部分を知りたいなという興味がわきました。

## **基礎を知ると実力が上がる**
メモリだなんだ、パソコンの仕組みだなんだを知る事で
今まで自分では作れると思っていなかったものが作れるようになったり
謎のトラブルに見舞われた時にも対処できるようになったりと
単純にプログラマーとしての実力が上がりました。
もっといろんなものを作れるようになりたいという思いでアセンブリをやりたくなりました。

## **これから先のコンピューターの形**
パソコンといえばモニタがあってマウスとかキーボードとかあってという一般的な形がありますが
これから先はコンピューターの形も様変わりしていくのではないかという思いがあります。
プログラム言語が何かを作るために特化されていったように
ハードウェアも何かに特化していくような気がしています。

そんな未来を想像すると、アセンブリでハードウェアについて学んでおくことは
とても有意義なのではないかと思いました。


# <font color="#009F8C">**とはいえ現在の状況では**</font>

基礎を理解していく事で応用できる範囲が広くなるのは間違いないと思いますが。
それだけでは何かをクリエイトするのも難しいというのが現実です。

便利なライブラリを組み合わせて、Google先生に聞いた知識を巧みに組み合わせる
実際に何かを作るのであればこういう能力の方が重要とは思います。

# <font color="#009F8C">**まとめ**</font>

というわけで、<font color="red">**アセンブリを学ぶ意味は大いにある！**</font>
にはあるのですが

プログラマー全員が必ず学ぶ必要があるのかといえば
そうとは思っていません。

あくまでも<font color="red">**学ぶ意味はあるし、それなりに有益だと思う！**</font>という事です。
複数URLを一気に開く

複数URLを一気に開きたいときは以下の拡張機能が便利です。

## Pasty（Chrome拡張機能）
https://chrome.google.com/webstore/detail/pasty/hdjihnnclpjhfdbbinmgoiehhoehhlgf?hl=ja

## Pastyの使い方
https://www.kinoubi-design.com/blog/blog/2015/03/chrome-pasty.html
複数のリポジトリで使える Git の差分を抽出するバッチファイル

確認は不十分だけど。

# バッチファイル

```bash:archive.sh
repos={repositorys}
target={target}
output={output}

name=$1
suffix=$2
from=$3
to=$4

repo=${repos}/${name}
zip=${name}-diff-${suffix}

git --git-dir=${repo}/.git --work-tree=${repo} archive --format=zip --prefix=${zip}- --output=${output}/${zip}.zip HEAD `git --git-dir=${repo}/.git --work-tree=${repo} diff --diff-filter=ACMR --name-only ${from}..${to} ${repo}/${target}`

```

以下3行目までの値は、自分の環境に合わせて書き換え。

|変更箇所    |説明                           |例         |
|:----------|:-----------------------------|:----------|
|repositorys|ローカルリポジトリ群のディレクトリ       |~/github   |
|target     |各リポジトリ内の差分を抽出するディレクトリ|htdocs     |
|output     |差分zipファイルを出力するディレクトリ   |~/Downloads|


# 使い方
4つの引数を指定します。

```bash
bash archive.sh {name} {suffix}　{from} {to}
```

|引数   |説明                                  |
|:-----|:-------------------------------------|
|name  |指定ローカルリポジトリのディレクトリ名           |
|suffix|差分zipファイルの接尾詞（バージョン等）         |
|from  |差分取得範囲の開始位置のブランチ、タグ、コミットID|
|to    |差分取得範囲の終了位置のブランチ、タグ、コミットID|

# 作った理由
- コマンド短くしたい
- リポジトリ内にファイルを置きたくない
- 共通のバッチファイルを使いたい
- 指定した共通の場所に差分zipファイルを出力したい
- 差分zipファイルをそのまま納品できる形にしたい
Ruby on Rails Tutorial 2章 メモ

# 基本用語
## REST
アプリケーションを構成するコンポーネント (ユーザーやマイクロポストなど) を「リソース」としてモデル化すること。
## インスタンス変数
@記号で始まる変数のこと。(@usersなど)
# 文法
## rails generate scaffold
scaffoldでUserリソースの作成をする。

```
rails generate scaffold User name:string email:string
```

## resources
ユーザーからリクエストされたURLを、Usersリソースで使うコントローラのアクションに割り当てる。

```config/routes.rb
Rails.application.routes.draw do
  resources :users # ユーザーからリクエストされたURLを、Usersリソースで使うコントローラのアクションに割り当てる
  root 'application#hello' 
end
```

## validates
文字数を制限する。

```app/models/micropost.rb
class Micropost < ApplicationRecord
  validates :content, length: { maximum: 140 } # 140文字の文字数制限
end
```

## presence: true
マイクロポストのコンテンツが存在しているかどうかを検証する。

```app/models/micropost.rb
class Micropost < ApplicationRecord
  belongs_to :user
  validates :content, length: { maximum: 140 },
                      presence: true # マイクロポストのコンテンツが存在しているかどうか
end
```

# MVC (Model-View-Controller)
## 「/users にあるindexページをブラウザで開く」という操作をしたときのMVCの挙動

![mvc_detailed.png](https://qiita-image-store.s3.amazonaws.com/0/232235/1d9f0403-52c3-38d0-9177-a82e6ab6dbf2.png)

1. ブラウザから「/users」というURLのリクエストをRailsサーバーに送信する。
2. 「/users」リクエストは、Railsのルーティング機構 (ルーター) によってUsersコントローラ内のindexアクションに割り当てられる。
3. indexアクションが実行され、そこからUserモデルに、「すべてのユーザーを取り出せ」(User.all)と問い合わせる。
4. Userモデルは問い合わせを受け、すべてのユーザーをデータベースから取り出す。
5. データベースから取り出したユーザーの一覧をUserモデルからコントローラに返す。
6. Usersコントローラは、ユーザーの一覧を@users変数 (@はRubyのインスタンス変数を表す) に保存し、indexビューに渡す。
7. indexビューが起動し、ERB (Embedded RuBy: ビューのHTMLに埋め込まれているRubyコード) を実行して HTMLを生成 (レンダリング) する。
8. コントローラは、ビューで生成されたHTMLを受け取り、ブラウザに返す。

# RESTアーキテクチャ
## RailsにおけるRESTアーキテクチャを構成するすべてのアクションの一覧

| HTTPリクエスト  | URL            | アクション   | 用途                   |
|:--------------|:---------------|:-----------|:-----------------------|
| GET           | /users         | index      | すべてのユーザーを一覧するページ|
| GET           | /users/1       | show       | id=1のユーザーを表示するページ|
| GET           | /users/new     | new        | 新規ユーザーを作成するページ|
| POST          | /users         | create     | ユーザーを作成するアクション|
| GET           | /users/1/edit  | edit       | id=1のユーザーを編集するページ|
| PATCH         | /users/1       | update     | id=1のユーザーを更新するアクション|
| DELETE        | /users/1       | destroy    | id=1のユーザーを削除するアクション|
Usersリソースが提供するRESTfulなルート

# 関連付け
## 1人のユーザーに複数のマイクロポストがある

```app/models/user.rb
class User < ApplicationRecord
  has_many :microposts
end
```

#####  1つのマイクロポストは1人のユーザーにのみ属する
```app/models/micropost.rb
class Micropost < ApplicationRecord
  belongs_to :user
  validates :content, length: { maximum: 140 }
end
```

![micropost_user_association.png](https://qiita-image-store.s3.amazonaws.com/0/232235/9d496a21-e07e-e524-ae18-b60cfdd55927.png)

マイクロポストとユーザーの関連付け
ファイルサイズ表示に役立つgem filesize

## filesizeというgemを使ったので備忘録

https://github.com/dominikh/filesize

148MBって何バイト？
13982730000バイトって何GB？

こんなときに使えるgem

* 148MBをバイト単位に変換
<pre>
Filesize.from("148MB").to_i
=> 148000000
</pre>

* 13982730000バイトをGB単位に変換
<pre>
Filesize.from("13982730000 B").to_f('GB')
=> 13.98273
</pre>

単位を指定せず、見やすい単位を自動で選んでもらうこともできる

* 13982730000バイトを見やすい単位に変換
<pre>
Filesize.from("13982730000 B").pretty
=> "13.02 GiB"
</pre>

prettyを使うと、単位がKiB、MiB、GiBとなる

表示はMBやGBにしたいがどうしようと悩んでいたところ、先頭に書いたURLの内容を読んでいると以下の記載

> (Filesize.from("1400 MB")  + Filesize.from("1400 MiB")).pretty # => "2.87 GB"
> (Filesize.from("1400 MiB") + Filesize.from("1400 MB")).pretty  # => "2.67 GiB"


ということはこれでいけるのでは？と試したのがこちら
<pre>
(Filesize.from("0 KB") + Filesize.from("13982730000 B")).pretty
=> "13.98 GB"
</pre>

GB表示にすることができたが、注意点がいくつか

* 小数第2位へ丸められる
* 1GiB = 1024 * 1024 * 1024 byteだが、1GB = 1000 * 1000 * 1000 byteで計算される
毎回調べちゃうssmtp->gmailの設定コマンドメモ

:pensive:心の声（気楽にメール送信したいよー。開発用なんだよー、特に難しいことしたくないんだよー）


はい、ssmtpどうぞ:angel::point_up:
※CentOS6系前提

```shell
#入ってなかったsendmail 
$ yum install -y sendmail
$ service sendmail start

#epelレポ追加
$ yum -y install http://dl.fedoraproject.org/pub/epel/6/x86_64/epel-release-6-8.noarch.rpm

#ssmtpインスコ
$ yum -y install --enablerepo=epel ssmtp

#ssmtpせってー
$ vim /etc/ssmtp/ssmtp.conf 
#ここから####################
root=[Gアカウント]@gmail.com
mailhub=smtp.gmail.com:587
rewriteDomain=gmail.com
hostname=gmail.com
AuthUser=[Gアカウント]@gmail.com
AuthPass=[Gアカウントのパスワード ""とかで囲まなくてok]
AuthMethod=LOGIN
UseSTARTTLS=YES
FromLineOverride=YES
TLS_CA_File=/etc/pki/tls/certs/ca-bundle.crt #ココめっちゃ！大事！！毎回！！！忘れる！！！！
#ここまで####################

#既定のMTAせってー
$ alternatives --config mta
#There are 2 programs which provide 'mta'.

#  Selection    Command
#-----------------------------------------------
#*+ 1           /usr/sbin/sendmail.sendmail
#   2           /usr/sbin/sendmail.ssmtp

#Enter to keep the current selection[+], or type selection number: 
2 #ssmtpが使いたいから2って入力する

#わいはphp使いだからsendmailのせってーしとかないと
$ vim /etc/php.ini
#上記alternativesコマンドで表示されてたパスを追記か変更か。
# sendmail_path = "/usr/sbin/sendmail -t"
$ service httpd graceful

# 多分、これで終わり.メール送信できるはず！

$ sendmail hogehoge@hogehoge.hoge
To: hogehoge@hogehoge.hoge
From: from@hogehoge.hoge
Subject: Subject is here.

This is Testmail.
.

```

※場合によっちゃ、外から逆引きできないサーバってんで、gmailからリレー拒否される場合も。
そんな時は、自分のgmailアカウントを「安全性の低いアプリの許可」をしちゃう。
**この設定に一切の責任は取りません** 
https://myaccount.google.com/lesssecureapps
postgresでターミナルからpsqlが文字化けする

おそらくだがクライアント側のエンコード設定というのがあって、psqlで入るとその文字コードに変換されて表示されるんだと思う。
なのでそのDBの文字コードがEUCだからって、ターミナルをEUCにしないと文字化けしない訳ではない。
UTF-8に設定されていたら、自動でUTF-8に変換されるのでターミナルはUTF-8にしておかないといけないのだ。
確認はｐｓｑｌで入ってから

```
show client_encoding;
```

とやる。

```
 client_encoding 
-----------------
 EUC_JP
(1 row)
```