OmniAICreator/Qiita-1.07M huggingface dataset:
Kibana の開発環境構築

# はじめに

Elastic Stack (Elasticsearch, Kibana など) の OSS 貢献のため、git clone から Kibana の開発環境構築をしました。
そのときのメモです。

# Elasticsearch

## JDK のインストール

JDK 11 が必要。

[「OpenJDK 11 を Homebrew で macOS にインストールする」](OpenJDK 11 を Homebrew で macOS にインストールする)を参考にインストール。
2019年3月13日現在は v11.0.2 が brew で取得できた。

~/.bash_profile に以下を追記。

```
export JAVA_HOME=`/usr/libexec/java_home -v 11`
```

以下を実行して環境変数 JAVA_HOME を設定する。

```shell
source ~/.bash_profile
```

## ビルド&起動

クローンする

```shell
$ git clone git@github.com:elastic/elasticsearch.git
```

# Kibana

## nvm

「[Mac環境のインストールメモ (2019年3月) - nvm](https://qiita.com/Teloo/items/5a9f65e0d75350a8c592#nvm)」に沿ってインストール。

## yarn

「[Mac環境のインストールメモ (2019年3月) - yarn](https://qiita.com/Teloo/items/5a9f65e0d75350a8c592#yarn)」に沿ってインストール。

## ビルド

Elasticsearch をクローンしたディレクトリと同じ階層にクローンしてビルド。

```shell
$ git clone git@github.com:elastic/kibana.git
$ cd kibana
$ nvm install
$ nvm use
$ yarn kbn bootstrap
```

## Elasticsearch の起動

Elasticsearch をビルド & 起動する。

```
$ yarn es source
```

以下のように表示されたら、ブラウザで http://localhost:9200/ を開いて、JSON が表示されたかどうかで起動確認を完了。

```
license [XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX] mode [basic] - valid
```

## Kibana の起動

Kibana を起動する。

```
$ yarn start
```

以下のように表示されたら、ブラウザで http://localhost:5601/ を開いて、Kibana の画面が表示されることを確認する。

```
[info][listening] Server running at http://localhost:5603/yrf
[info][status][plugin:spaces@8.0.0] Status changed from yellow to green - Ready
```

# 参考情報

* [elasticsearch/CONTRIBUTING.md](https://github.com/elastic/elasticsearch/blob/master/CONTRIBUTING.md#contributing-to-the-elasticsearch-codebase)
* [kibana/CONTRIBUTING.md](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#setting-up-your-development-environment)
Go file読み込み　まとめ

#はじめに

goのファイルの読み込みについていちいちググるのがめんどくなってきたので忘備録


#ioutil.ReadFile

ioutil.ReadFileを使う

かなり短くかけてよい

```go 
f, _ := ioutil.ReadFile("hello.txt")
fmt.Print(string(f))
```

#byteのスライスを作成して読み込む

文字で結構byteを使うけどなんでなのかわかってない

とりあえず動く

```go 
f, _ := os.Open("hello.txt")
ary := make([]byte, 100)
f.Read(ary)
fmt.Println(string(b1))
```

#bufio.NewScanner

bufio使うやつ

```go 
f, _ := os.Open("hello.txt")
scanner := bufio.NewScanner(f)
for scanner.Scan() {
  fmt.Println(scanner.Text())
}
```

#readlineで読み込むやつ

```go 
	f, err := os.Open("hello.txt")
	if err != nil {
		panic("error")
	}
	defer f.Close()
	
	reader := bufio.NewReaderSize(f, 1024)
	
	for {
		line, _, err := reader.ReadLine()
		fmt.Println(string(line))
		if err == io.EOF {
			break
		} else if err != nil {
			panic(err)
		}
	}
```
Working with JSON in Python

Official Doc: <https://docs.python.org/3/library/json.html>

### Import the JSON module:

```python:json_example.py
import json
```

### Convert Python Object to JSON

```python:json_example.py
>>> import json
>>> colors = ["red","green","blue"]
>>> colors_in_json = json.dumps(colors)
>>> colors_in_json
# ["red","green","blue"]
```

### Parse JSON object

```python:json_example.py
>>> import json
>>> capitals_in_json = [{"country":"Vietnam","capital":"Hanoi"},{"country":"France","capital":"Paris"}]
>>> capitals = json.loads(capitals_in_json)
>>> capitals 
# [{"country":"Vietnam","capital":"Hanoi"},{"country":"France","capital":"Paris"}]
```

### Write to .json file

```python:json_example.py
import json
colors = ["red","green","blue"]
with open("colors.json","w") as file:
    json.dump(colors)
```

### Read from .json file

```python:json_example.py
import json
with open("colors.json") as file:
    colors = json.load(colors)
print(colors)
# ["red","green","blue"]
```
[oVirt] 仮想マシンマネージャ(oVirt Engine)の故障HDDを交換したが、驚くほど簡単過ぎた

# 作業内容サマリー

作業する内容のサマリーです。

1. ハードディスクを交換
2. CentOS 7を新規インストール
3. CentOSをアップデート
4. oVirt yumレポジトリを追加
5. oVirtをインストール
6. バックアップファイルからレストア
7. oVirtをセットアップ


# 作業内容詳細

## ステップ 1. 〜 3. 

ステップ 1. 〜 3. は、特別なことはないので省略します。


## ステップ 4. oVirt yumレポジトリを追加

`yum install http://resources.ovirt.org/pub/yum-repo/ovirt-release42.rpm` [^1] を実行します。
[^1]: 2019年3月現在の最新版は4.3.1ですが、バックアップは4.2.6なので、4.2をインストールしました。

続いて `yum update` を実行します。


## ステップ 5. oVirtをインストール

`yum install ovirt-engine` を実行します。


## ステップ 6. バックアップファイルからレストア

`engine-backup`コマンドでレストアもできます。
データベースも同一ホストで動いているので、すべてをレストアしました。

実行するコマンドはこのようになります。
`engine-backup --mode=restore --file=バックアップファイルへのパス--log=engine-restore.log --provision-db --provision-dwh-db --restore-permissions`


### `engine-backup`コマンドのオプション

コマンドのオプションを説明します。

`--mode=restore`
レストアを実行します。

`--file=ファイル名`
バックアップファイル名を指定します。

`--log=ファイル名`
ログを記録するファイル名を指定します。

`--provision-db`
データベースを作成させます。

`--provision-dwh-db`
データウェアハウス用データベースを作成させます。

`--restore-permissions`
データベースを作成するときに、アクセス権も復旧させます。


### 実行結果

実行すると、このようなメッセージが表示されます。

```
Preparing to restore:
- Unpacking file '/backup02/ovirt/engine-backup-20190313.bak'
Restoring:
- Files
Provisioning PostgreSQL users/databases:
- user 'engine', database 'engine'
- user 'ovirt_engine_history', database 'ovirt_engine_history'
Restoring:
- Engine database 'engine'
  - Cleaning up temporary tables in engine database 'engine'
  - Updating DbJustRestored VdcOption in engine database
  - Resetting DwhCurrentlyRunning in dwh_history_timekeeping in engine database
  - Resetting HA VM status
------------------------------------------------------------------------------
Please note:

The engine database was backed up at 2019-03-13 18:38:08.000000000 +0900 .

Objects that were added, removed or changed after this date, such as virtual
machines, disks, etc., are missing in the engine, and will probably require
recovery or recreation.
------------------------------------------------------------------------------
- DWH database 'ovirt_engine_history'
You should now run engine-setup.
Done.
```

## ステップ 7. oVirtをセットアップ

`engine-setup`を実行します。

質問にはすべてデフォルトで回答して大丈夫でした。


# 感想

ここまで簡単＆親切なのはすごすぎる！
oVirt最高！！

# 落ち穂拾い

自分のところでは、ユーザー認証のためにLDAP(ActiveDirectory)を使っていたのでした。

https://www.ovirt.org/documentation/admin-guide/chap-Users_and_Roles.html にある手順に従って設定しました。
コンピュータアーキテクチャのDiscordグループ作ってみました

##コンピュータアーキテクチャのDiscordグループ作ってみました。
個人的にIBMのPower9アーキテクチャに興味があって、色々掘り下げてみたくてDiscordグループ作ります。コンピュータアーキテクチャに興味ある方ならどなたが入ってこられても構いません。

https://discord.gg/VfCVMXa

ちなみに僕自身はコンピュータアーキテクチャに関する知識はあまりありません。なので技術的な質問をされても答えられないことがあります。むしろ教えてください。
定期的に勉強会やもくもく会やるかもしれないです。
コンピュータのハードウェア周りを勉強したくてパタヘネ本読んでますが、結構難しいです。
よろしくお願いします！

コンピュータアーキテクチャに興味を持ったきっかけは、bounty sourceのお題としてPower9アーキテクチャ上で動くnumpyのコード最適化が出てたからです。

https://www.bountysource.com/issues/73221262-optimize-numpy-simd-algorithms-for-power-vsx

お題を解決したら５５００ドルで、それほど高くはないですが、技術を身につけたら受託開発とかできるかもしれないです。Numpyのx86用のSIMDベクトル化コードをPower用に書き換えるようです。オープンソースなので誰でもトライできます。

以下のOpenPowerミートアップで中の人に会うことができます。

https://tokyo-opencapi.connpass.com/

コンピュータアーキテクチャを勉強してみたいほぼ素人ですが、詳しい人に参加いただいて教えていただけたら嬉しいです。コンピュータアーキテクチャは勉強会を探してもほとんどなく、Discordグループもなく、スクールもないし、大学もどこで勉強できるのかわかりません（そもそも大学やスクール行くお金がない）。
高級言語も良いですが、低階層のシステムプログラミングとかも身につけてみたいです。

CPUのパフォーマンス最適化もやってみたいです。よろしくお願いします！

追記
Discordグループでは、Power9アーキテクチャやSIMDについての議論が盛り上がってます。Power用のコードを吐くgccをx86で動かして、コンパイルし、逆アセンブルしてアセンブラを読むなど。
そこそこ実用的な翻訳アプリを開発してみる (2) 開発環境の準備

そこそこ実用的な翻訳アプリを開発しましたので、その構成や作り方を記録しておきます。[コード](https://github.com/yamachan/rtk-lt) は MITライセンスですので、参考になるところがあれば部分的にでも使ってみてください。

# 目次

* [(1) 概要編](https://qiita.com/yamachan360/items/5b20e7181d663d70e924)
* (2) 開発環境の準備 【このページ】
* [(3) 翻訳サービスの実装](https://qiita.com/yamachan360/items/fa4af5f7b18781e5f283)
* [(4) ログサービスの実装](https://qiita.com/yamachan360/items/92699a3fc55969337b46)
* [(5) フロントエンド側の実装](https://qiita.com/yamachan360/items/de57df20dc7de5665a44)
* [(6) 学習用データの作成](https://qiita.com/yamachan360/items/7de33c30331745b0d591)

# まずはベースとなる環境を準備

[NERM (Node.js + Express + React + Material-UI) ベースなWebアプリ開発用のシンプルなビルド環境 2019年3月版](https://qiita.com/yamachan360/items/7892084573abda091dee) でご紹介したビルド環境をそのまま利用します。

[rtk-nerm](https://github.com/yamachan/rtk-nerm) GitHubリポジトリにある以下のメニューからZIP ファイルをダウンロードし、その中味を新しく作成したフォルダに全てコピーします。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/193519/d776dd3f-2e94-d548-dafd-2402cb09b05c.png)
今回は `rtk-lt` というフォルダ名にしてみました。こんな感じ。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/193519/8af98459-b3a4-c823-06e0-fb7149f9df4b.png)

## ビルドとローカル環境での実行の確認

さてコマンドプロンプトを開き、rtk-lt フォルダ(ディレクトリ)内で以下を実行しましょう。public サブフォルダに App.js ファイルが作成されていればokです。

```
npm install
npm run build
```

ローカル環境でアプリを起動してみます。

```
npm start
```

Web ブラウザで http://localhost:3000/ を開き、表示を確認します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/193519/9e14ecef-9d4b-1c09-70c3-a96c02c1edaf.png)

## IBM Cloud に上げてみる

引き続き、IBM Cloud 環境へのアップロードも試してみましょう。

```
cf login
cf push -m 128M rtk-lt
```

cf push コマンドがこんな感じで実行され、status が running になればokです。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/193519/96b395c9-4079-468a-f737-8f7d95b48cd9.png)
(中略)
![image.png](https://qiita-image-store.s3.amazonaws.com/0/193519/aeb5884f-3417-3862-f8b7-92711cfcd065.png)
route に表示されたURLにブラウザでアクセスし、表示を確認しましょう。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/193519/2b0342a1-fecb-fa95-d8ca-0f90ded52010.png)
うん、これでビルド環境、そしてIBM Cloud環境への公開まで問題なさそうです。いよいよアプリ開発にはいっていきましょう。

# というわけで

さて、ざっと開発環境の準備ができたところで、実際のコード開発にはいりましょう。次回は [(3) 翻訳サービスの実装](https://qiita.com/yamachan360/items/fa4af5f7b18781e5f283) を実施します。GitHub 上の [ソースコード](https://github.com/yamachan/rtk-lt) も参照してみてください。
GoとJsonのmarshal

#初めに

自分が見返す用の忘備録

#json

goでjson形式の文字列を生成したい場合はMarshalを使う


```go 
ary := []string{"cat","dog","elephant"}
fmt.Println(ary)
=> [cat dog elephant]
json_ary, _ := json.Marshal(ary)
fmt.Println(string(json_ary))
=> ["cat","dog","elephant"]
```

こんな感じでjson.Marshalでjson形式に変換してくれる


また構造体にjsonのタグをつけることもできます

```go 
type Users struct {
	User []User `json:"users"`
}

type User struct {
	Name  string `json:"name"`
	Age   string `json:"age"`
	Email string `json:"email"`
}
```

このようなjson形式のタグをつけた構造体をつかっていい感じにjson形式のusersを出力できます。

参考
http://cuto.unirita.co.jp/gostudy/post/standard-library-json/

```go 
package main

import (
	"bytes"
	"encoding/json"
	"fmt"
)

type Users struct {
	User []User `json:"users"`
}

type User struct {
	Name  string `json:"name"`
	Age   string `json:"age"`
	Email string `json:"email"`
}

func main() {

	taro := User{Name: "taro", Age: "12", Email: "taro@gmail.com"}
	ziro := User{Name: "ziro", Age: "3", Email: "ziro@gmail.com"}

	users := Users{
		User: []User{taro, ziro},
	}

	json_users, err := json.Marshal(users)

	if err != nil {
		panic("error when users")
	}

	out := new(bytes.Buffer)

	json.Indent(out, json_users, "", "    ")
	fmt.Println(out.String())
}
```

これでこのような結果が得られます

```json
{
    "users": [
        {
            "name": "taro",
            "age": "12",
            "email": "taro@gmail.com"
        },
        {
            "name": "ziro",
            "age": "3",
            "email": "ziro@gmail.com"
        }
    ]
}
```
プログラミング学習記録25〜Ruby復習〜

##今日やったこと
- Progate Ruby１〜５リセット復習
- Udemy「よくわかるRuby on Rails入門-RubyとRailsを基礎から学びWebアプリケーションをネットに公開しよう」のセクション１

Progateで久しぶりにRubyの復習をしました。

すでに５周以上しているので、久しぶりにやっても特につまづくことはなかったです。

以前につまづいたinitializeメソッドの復習ができてよかったです。

initializeメソッドについては以下の記事に書いてます↓

[プログラミング学習記録6〜シンタックスハイライトに手を出す〜](https://qiita.com/yuta_kinu/items/defbae55f87062a80f51)

今後はProgateのrailsで基礎を固めつつ、Udemyの講座でwebアプリを作っていきたいと思います。

今日やったセクション１では特に目新しいことはなく、セクション全体の説明とUdemyでの学び方を確認した感じです。

3/19までには終わらせたいです。
ペッパークイズアプリをダイアログトピックで作ってみる

Pepperの音声認識を使ってクイズアプリを作るのに[Pepperで始めるロボットプログラミング（3）：Pepperの音声認識を使ってクイズアプリを作る \(1/4\) \- MONOist（モノイスト）](https://monoist.atmarkit.co.jp/mn/articles/1503/27/news015.html)のように、「Speech Reco.」と「Switch Case」を使う方法もありますが、ダイアログトピックを使って似たようなものができないかと挑戦。

```
topic: ~chat()
language: jpj

u:(e:onStart) 次の問題にリンゴ・バナナ・ミカンで答えてください。^nextProposal

proposal: 1問目です。黄色いのは
    u1:(リンゴ)不正解です^nextProposal
    u1:(バナナ)正解です。^nextProposal
    u1:(ミカン)不正解です。^nextProposal
    u1:(e:Dialog/NotUnderstood)リンゴ・バナナ・ミカンで答えてください。 ^stayInScope
proposal: 2問目です。赤色なのは
    u1:(リンゴ)正解です^nextProposal
    u1:(バナナ)不正解です。^nextProposal
    u1:(ミカン)不正解です。^nextProposal
    u1:(e:Dialog/NotUnderstood)リンゴ・バナナ・ミカンで答えてください。 ^stayInScope
proposal: 3問目です。オレンジ色なのは
    u1:(リンゴ)不正解です^nextProposal
    u1:(バナナ)不正解です。^nextProposal
    u1:(ミカン)正解です。^nextProposal
    u1:(e:Dialog/NotUnderstood)リンゴ・バナナ・ミカンで答えてください。 ^stayInScope
proposal: 以上で問題は終わりです。さようなら  $onStopped=1
u:(e:Dialog/NotUnderstood) すみません、よく聞き取れませんでいた。

u:([おわり]) では終わりにします。さようなら $onStopped=1
```
実行結果

```
ロボット：次の問題にリンゴ・バナナ・ミカンで答えてください。1問目です。黄色いのは
人間：バナナ (100%)
ロボット：正解です。2問目です。赤色なのは
人間：イチゴ (100%)
ロボット：リンゴ・バナナ・ミカンで答えてください 。
人間：リンゴ (100%)
ロボット：正解です3問目です。オレンジ色なのは
人間：ミカン (100%)
ロボット：正解です。以上で問題は終わりです。さようなら
```
こんな感じでどうかな。

こんなベースで、次は「結果発表」として
「〇問中〇問正解です」
としゃべらせたい
備忘録--入出力とリダイレクト--


おはよう、こんにちわ、こんばんわ。今日の自分
標準入出力を切り替えるリダイレクションについてだ！

誰か見てましたら間違ってたり追記したほうがよいことは是非ともご教示お願いします:sob:。。。

#標準入出力とリダイレクション

・シェルにはリダイレクションという機能があるようだ

・リダイレクションで標準入力や標準出力をファイルに変更することが可能だ

・テキストデータをキーボードではなくファイルから入力が可能だ

仮に標準入力を画面ではなくファイルで出力したければ下記だ↓↓

![コマンド_ファイル.JPG](https://qiita-image-store.s3.amazonaws.com/0/370545/dd0d9a89-728e-7ca9-b20f-a93c0f7f1e5c.jpeg)

#例：現在の日付を表示するdateコマンドをdate.txtに書き込む

![date_txt.JPG](https://qiita-image-store.s3.amazonaws.com/0/370545/2b1df31b-7d81-049d-60ed-a5a5de6650bb.jpeg)

上記ではコマンドdateをdate.txt（テキストファイル）として出力させてもらった。

結果をcatコマンドで開いてみるぞ↓
![cat_date.JPG](https://qiita-image-store.s3.amazonaws.com/0/370545/b14c9e23-79ac-9391-8974-5a2a4920b480.jpeg)

見事に出力されている←

ちなみに下行に追記する場合は>>を使用するのだ
下記はdateコマンドの出力結果テキストにechoコマンドでHello!を追記した結果だ↓

![txt_Hello.JPG](https://qiita-image-store.s3.amazonaws.com/0/370545/2b874114-d1e4-693d-b2a2-f3f2f163dff5.jpeg)

#テキストデータをキーボードではなくファイルから入力

コマンドに続けてリダイレクション記号 < と入力元ファイルを指定することで、ファイル内容に対してコマンドを実行することができる

今回は一例として先程作成したdate.txtに対してgrepでHello!の行だけ抜き出してみよう

![gfrep_Hello.JPG](https://qiita-image-store.s3.amazonaws.com/0/370545/bafc7a3f-59b4-959a-f116-173a74fd9d9a.jpeg)

こういうことも可能だ

締まらない終わり方だが立ち止まらずに次の章へ進むのだ！！

日進月歩だ、ありがとうございました。
PHPインストール

## 前置き
Centos上にNginxをインストールし、これからphpを動かせたいです。
[Centosでnginxをインストール手順](https://qiita.com/xiaopihang/items/43c8043f2a27d00b7993)
以下の手順でインストールを進めます

* phpインストール用のremiレポジトリを用意する
* phpをインストールする
* 設定ファイルを変更する
* nginx再起動、php-fpmスタートとchkconfig登録

## 手順
### phpインストール用のremiレポジトリを用意する
```
[user@localhost yum.repos.d]$ sudo yum -y install http://rpms.famillecollet.com/enterprise/remi-release-6.rpm
[user@localhost yum.repos.d]$ ls -l
-rw-r--r--  1 root root  456 12月 22 02:50 2018 remi-php54.repo
-rw-r--r--  1 root root 1314 12月 22 02:50 2018 remi-php70.repo
-rw-r--r--  1 root root 1314 12月 22 02:50 2018 remi-php71.repo
-rw-r--r--  1 root root 1314 12月 22 02:50 2018 remi-php72.repo
-rw-r--r--  1 root root 1314 12月 22 02:50 2018 remi-php73.repo
```

### phpをインストールする
インストール前、先にやっといたほういい事

* php関連のインストールがあったら
    * php.iniのバックアップ
    * インストールしたものを削除する
* yum更新する
* 足りないパッケージインストール(なぜか自分の環境でlibargon2がインストールされていない(Conohaさん)

足りないパッケージがあったら、**[パッケージ検索](https://centos.pkgs.org/6/centos-x86_64/)** に確認できる
https://centos.pkgs.org/6/remi-x86_64/libargon2-20161029-2.el6.remi.x86_64.rpm.html

```
[user@localhost yum.repos.d]$ sudo yum list installed php*
[user@localhost yum.repos.d]$ sudo find / -name "php.ini" -ls
[user@localhost yum.repos.d]$ sudo yum remove php*
[user@localhost yum.repos.d]$ sudo yum -y update

[user@localhost yum.repos.d]$ sudo yum -y --enablerepo=remi install libargon2
[user@localhost yum.repos.d]$ sudo yum -y install --enablerepo=remi-php71 php php-cli php-common php-devel php-fpm php-gd php-mbstring php-mysqlnd php-pdo php-pear php-pecl-apcu php-soap php-xml php-xmlrpc
```
### 設定ファイルを変更する
* php-fpmの設定ファイル変更(userとgroup)

```
[user@localhost yum.repos.d]$ sudo sed -i 's/user\ \=\ apache/user\ \=\ nginx/g' /etc/php-fpm.d/www.conf
[user@localhost yum.repos.d]$ sudo sed -i 's/group\ \=\ apache/group\ \=\ nginx/g' /etc/php-fpm.d/www.conf
```
* nginxのconfファイル追加する(wordpressサイト作成)

```
server {
    listen       80;
    server_name  test.domain.com;

    #access_log  /var/log/nginx/host.access.log  main;

    location / {
        root   /project_dir;
        index  index.html index.htm index.php;
        #include /etc/nginx/conf.d/rewrite/wordpress.conf;
    }

    location ~ \.php$ {
        root           /project_dir;
        fastcgi_pass   127.0.0.1:9000;
        fastcgi_index  index.php;
        fastcgi_param  SCRIPT_FILENAME  /project_dir$fastcgi_script_name;
        include        fastcgi_params;
    }
}
```
### nginx再起動、php-fpmスタートとchkconfig登録
`sudo service nginx reload/restart`
やり方は [サービス再起動とchkconfig登録](https://qiita.com/xiaopihang/items/43c8043f2a27d00b7993#%E3%82%B5%E3%83%BC%E3%83%93%E3%82%B9%E3%82%92%E5%B8%B8%E9%A7%90%E3%81%95%E3%81%9B%E3%82%8B) へご参照ください
GithubのissueページのコメントのURLをコピーする拡張を作った

# TL;DR
- githubのissueのコメントURLをクリップボードにコピーするChrome拡張をつくりました。
- chrome ウェブストアで配布していないので、githubからcloneしてローカルのどこかに保存して使用してください。

## Githubのurl
https://github.com/task-k/Kittens_pickup


#とりあえずポエム
今日は消防点検だったわけですが、その点検中に設備が壊れているということが発覚し、修理しましょうということになり、

「でも今日はもう仕事行くので後日でおなしゃす」とお願いしたら
「業者が忙しすぎて、修理すんの今日しかないねん、管理会社も人がいないので本人が立ち会ってくれんと困っちゃう」

ってなことで
待っていたら、修理パーツ全然到着しなくて、来たらきたでわりと時間かかりそうだったので、
「立会っても見てるだけは暇。よし、それならqiitaでも書くか！」ってなことで書いています。

待ちつかれて散々でした。

# 機能
### そのまえに動機
プルリク見てたり、なんかしらのパッケージのissueのコメントを共有したいときに、そのコメントのURLがあるにもかかわらず
githubのインターフェイス上からは見ることができません。

コメントのタイムスタンプの`commented 21hours ago`のところにリンクがあるので取得しようと思えば、右クリックから`リンクのコピー`ができます。
でもそれっていちいちめんどくさいのでボタンを作成しました。だいぶ前に。

## 使い方
1. [このリポジトリ](https://github.com/task-k/Kittens_pickup)からローカルにクローンします。
 <https://github.com/task-k/Kittens_pickup>
2. chromeの拡張<chrome://extensions/>でデベロッパーモードをonにする。
3. 「パッケージ化されていない拡張機能を読み込む」でクローンしてきたディレクトリを選択

## Github上の表示
issueの詳細ページのコメント欄ヘッダーに↓このようなボタンが出ていたらOKです。

![48248218-c4279f80-e439-11e8-8828-7365d4d74e67.png](https://qiita-image-store.s3.amazonaws.com/0/51031/649f8b07-412e-f57b-de92-308f3d7a7e4e.png)
詳細な位置はここ(nextjsのissueをキャプチャさせてもらいました。)
![screen 2019-03-13 18.59.31.png](https://qiita-image-store.s3.amazonaws.com/0/51031/e31b6942-ab6d-88dc-beda-efed660c5f0b.png)

ボタンをクリックすると`Comennt URL Clipped`とバルーンが表示されます。
プルリクのページにも表示されますのでチーム内で「プルリクのコメントに詳細書いたよ」みたいなのをチャットツールに貼るのに便利です。

# 注意点
- 対象はGithubのissue一覧ページではなく、↓こういう詳細ページです。
<https://github.com/zeit/next.js/issues/6640>
- issue詳細ページに行ったけどボタンが表示されていない場合は、そのページでリロードしてください。動作が環境によって安定していません(あんまり検証していない)。
- あと、特に危ないコードは入ってません。最近はこういうの怖いですね。


# 参考
Chrome 拡張　公式リファレンス
https://developer.chrome.com/extensions
【PL/SQL】テーブルの削除(DROP TABLE)

#テーブルの削除(DROP TABLE)
##やりたいこと
テーブルのデータではなく、テーブル自体を削除する。
##サンプルコード
DROPでは完全削除はされず、ごみ箱に移動されます。

```SQL
DROP TABLE {テーブル名} CASCADE CONSTRAINTS;
```
削除したテーブルを復活させるには以下のように行います。

```SQL
FLASHBACK TABLE {テーブル名} TO BEFORE DROP;
```
ごみ箱を完全消去するには以下のように行います。

```SQL
PURGE RECYCLEBIN;
```

ごみ箱を経由せずに完全にテーブルを削除するには以下のように行います。

```SQL
DROP TABLE {テーブル名} PURGE;
```

削除する際にはスキーマをちゃんと確認しましょう！
デーモンコンテナを完全に削除する方法

#社内wikiの突然の死
docker-composeで運用していたwikiサーバーが突然死んだ。原因を調べようにもsshさえできない状況だった。バックアップ処理はしてあるので、安心してインスタンスを再起動。

## docker-compose up -dができない
upを試みるも、生き残っているコンテナのせいで立ち上がってこない。
なので、全部一旦消しとばす。

```
$ docker-compose down
```
よーし、これでupできる・・・

```
CONTAINER ID        IMAGE                 COMMAND                  CREATED             STATUS              PORTS                  NAMES
34baa4549220        growi_app             "/docker-entrypoint.…"   28 hours ago        Up 27 hours         0.0.0.0:80->3000/tcp   growi_app_1
```

！？

##バカな！？貴様は死んだはず！！

なんか全然ピンピンしているappコンテナ。なんだお前、いつからそんな雑草根性身につけた？

```
$ docker-compose rm app
$ docker stop growi_app_1
＄ docker-compose kill
```

とっさに思いついた死のコマンド飛ばしてもこいつ生きてやがる・・・！！
こいつ、無敵か？！

仕方ねぇ、全部吹っ飛ばしてやるよ・・・！

```
$ docker rm -f container_id
```

よーし、死んだな、手こずらせやがって・・・

さて、docker-compose up -dだ

```
ERROR: endpoint with name test_mysql_1 already exists in network growi_default
```

**くぁwせdrftgyふじこlp!!!!?????**

なんだテメェは！？第二形態か！？

##第二形態　docker network
あのコンテナのネットワークだけ生きてやがる！？そんなのありか！？

下記コマンドを打ってあげると、ネットワークのIDやら名前やらが出てきます。

```
$ docker network inspect growi_default
```

出力結果はこんな感じ。

```
"Containers": {
            "***********************************": {
                "Name": "growi_app_1",
                "EndpointID": "***************",
                "MacAddress": "***************",
                "IPv4Address": "**************",
                "IPv6Address": ""
            },
```

そしてネットワークはこの下記コマンドで消せる・・・

```
$ docker network disconnect growi_app_1
```

よっしゃ、これでdocker-compose up -dできる・・・

```
ERROR: endpoint with name test_mysql_1 already exists in network growi_default
```

なんという生命力よ！ならばフォースの力をくわえてやる！ っ-f

```
$ docker network disconnect -f growi_default growi_app_1
```

倒した。
念の為、一旦前のイメージを削除して、再度イメージを作り直し、再upしました。デーモンコンテナは異常に強いというお話です。

```
$ docker rmi container_id
$ docker-compose build
$ docker-compose up -d
```
Azureロードバランサー×RDゲートウェイで接続できないことがある

#症状
OSごとに症状が違う（実際はmstscのバージョンによるところだと思う）

###Windows7の場合
RemoteAppが切断されました。 
このコンピューターリモートコンピューターに接続できません。これら2台のコンピューターは、割り当てられた時間内に接続できませんでした。


###Windows8.1の場合
このコンピューターはリモートコンピュータに接続できません。接続先のリモートコンピュータでエラーが発生しました。


###Windows10の場合
なぜか問題が起きない？！？！

###Windows8.1の場合にリモートデスクトップゲートウェイサーバーのイベントビューアにエラー
HTTP トランスポート: IN チャンネルは対応する OUT チャンネルを見つけられませんでした

#環境
セッションホストサーバー：WindowsServer2016
RDゲートウェイサーバー：WindowsServer2016で2VM
ゲートウェイファームは作らずに、Azureロードバランサーを使って負荷分散


#原因
送信・受信のセッションが別々のRDゲートウェイサーバーに割り当てられていたことが原因
Azureロードバランサーのセッション永続化を「なし」から「クライアントIP」に変更することで解決

ちゃんと書いてありました…
https://blogs.technet.microsoft.com/jpaztech/2016/11/23/loadbalancer-troubleshooting/
【Python, Heat map】相関係数を可視化する

##はじめに
変数が多くなると，相関係数表は見づらくなりますね．
<img width="479" alt="2019-03-13 (2).png" src="https://qiita-image-store.s3.amazonaws.com/0/360143/e8f5bcb3-a5e1-9553-05f8-cc99eea877b2.png">
そこで今回はSeabornのHeatmapを用いて可視化していきます．
タイタニックのデータを使っていて、一部加工してあります。

## Heat map
### 実装
**`import seaborn as sns
sns.heatmap(可視化したいデータ, 引数)`**
大雑把にはこんな感じです。

```python

import seaborn as sns
cor = train_df[[ 'Age','Sex', 'Family','Pclass','Embarked','Survived', 'Fare']].corr()
sns.heatmap(cor, cmap= sns.color_palette('coolwarm', 10), annot=True,fmt='.2f', vmin = -1, vmax = 1)
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/360143/9bdbb2ff-9bcb-2271-7d12-34d6b346f103.png)


だいぶ見やすくなりました！今回は引数にcmapとannot、fmtをとって、小数第2位までの相関係数を表示させました。
文字が切れているので、適宜サイズを調整してください。

### 良く使いそうな引数の紹介

- **data**: Pandasデータフレームの場合は行と列の名前が使われます．
- **vmin, vmax**: データの最大値と最小値を指定してくれます．
- **cmap**: 色の指定になります．10という数字は、10段階で色に段階をつけることを示しいています．今回は、相関係数を示したいので、Diverging Colormapから色を選びました．coolwarm以外には、bwr, seismicがあります．（ご指摘ありがとうございます！）matplotlibと色のコードは一緒です．以下のサイトに色とそれを示すコードが載ってます．cf. https://matplotlib.org/examples/color/colormaps_reference.html
- **annot**: Trueで数値を表示させます．指定しないとFalseとなり、値は表示されません．

その他の引数は参考サイトを参照してください．
## 参考サイト
・Seaborn でヒートマップを作成する　　
https://pythondatascience.plavox.info/seaborn/heatmap

間違ってる箇所等ありましたら、細かいことでも教えて頂けるとありがたいです！
numpy.linalg.solve vs. scipy.sparse.linalg.bicgstab

# Introduction

量子コンピュータの流行に触発され、量子力学をもう一度勉強することに決めた私。しかし「シュレディンガー方程式を数値的に解いて、その結果の確率分布を可視化したい」なんて考えたときに、ふと思ったのです。**連立一次方程式のソルバーはどれが良いのか**と。

# NumPyのsolve vs. SciPyのbicgstab

というわけで両者の速度を比較してみました。NumPyからは.solveメソッド, SciPyからは反復解法である[BiCGstab法](https://qiita.com/fukuroder/items/4b708524783192fc2018)をチョイスしました。
(チョイス理由は「私が過去に使ったことがあるから」程度にしか考えておらず、他により高速な解法があれば、今後そちらを試したいと思います)

# 実行スクリプトと各々の計測結果

## numpy.linalg.solve()

以下にNumPyのsolveメソッドを利用した計算スクリプトを示します。

```python:solve_numpy.py
'''
    solve_numpy.py
    purpose: solve Ax = b with numpy
'''

from time import time
import numpy as np


# make matrix A
a1_lis = [1, 0, 0]
a2_lis = [0, 2, 0]
a3_lis = [0, 0, 4] 
a_matrix=np.array([a1_lis, a2_lis, a3_lis])

# set b vector
b_vec = np.array([4, 5, 6])

t1 = time()

# solve Ax = b
for i in range(0, 1000):
    np.linalg.solve(a_matrix, b_vec)

t2 = time()

print(t2-t1)
```

一回の実行では瞬殺なので、1000回繰り返したときに要した時間を計測しています。
**結果は大体0.0067**でした。

## scipy.sparse.linalg.bicgstab()

続いてSciPyのbicgstabメソッドを使用して同じことをしてみます。

```python:solve_scipy.py
'''
    solve_scipy.py
    purpose: solve Ax = b with BiCGStab in scipy
'''

from time import time
import numpy as np
from scipy.sparse.linalg import bicgstab


# set matrix A
a1_lis = [1, 0, 0]
a2_lis = [0, 2, 0]
a3_lis = [0, 0, 4] 
a_matrix=np.array([a1_lis, a2_lis, a3_lis])

# set b vector
b_vec = np.array([4, 5, 6]) 

t1 = time()

# solve Ax = b
for i in range(0, 1000):
    #x_vec = bicgstab(a_matrix, b_vec)
    bicgstab(a_matrix, b_vec)

t2 = time()

print(t2-t1)
```

こちらも同じく1000回繰り返したときに要した時間を計測しています。
**結果は大体0.16**でした。

結果としてははNumPyのsolveメソッドを今後使った方が良さそうな気がしますね。

# なぜNumPyのsolveの方が早いのか？

調べてみるとNumPyのsolveメソッドは[LAPACK](http://www.netlib.org/lapack/lug/node1.html)を使っているらしいです。なるほど速いわけですね。

# 結論と今後

今回の結論としてはNumPyのsolveメソッドに軍配が上がりました。しかし行列の大きさなどによっては、処理速度が変わってくるかもしれません。実際に量子力学の適当な問題を解いたときに実行速度の測定をしてみる必要がありそうです。
Xamarin.UITest が HttpRequestException で失敗する場合の対処

## 症状

Xamarin.Forms の新規ソリューションを UITest 付きで作成して、すぐに Android 側の UITest を実行してみたところ、

```
SetUp : System.Net.Http.HttpRequestException : An error occurred while sending the request
  ----> System.IO.IOException : Unable to write data to the transport connection: The socket has been shut down.
  ----> System.Net.Sockets.SocketException : The socket has been shut down
```

という例外が発生して、テストが成功しませんでした。

テンプレで作成されるテストケースは

```csharp
[Test]
public void WelcomeTextIsDisplayed()
{
    AppResult[] results = app.WaitForElement(c => c.Marked("Welcome to Xamarin.Forms!"));
    app.Screenshot("Welcome screen.");

    Assert.IsTrue(results.Any());
}
```

というもので、画面に "Welcome to Xamarin.Forms" が表示されたら成功ですが、
そもそもテスト対象アプリが起動せず終了しています。

## 原因と対処

* [VS 4 Mac beta - Socket error on UITest tests · Issue #1817 · xamarin/xamarin-android](https://github.com/xamarin/xamarin-android/issues/1817)

UITest のプロジェクトが参照している Xamarin.UITest パッケージのバージョンが古い(2.24以下?)と発生するようです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/8227/024bc5c7-2ad4-2258-e06b-1fc5a4aa85ec.png)

パッケージをアップデート(この時点では 2.2.7 になりました)してテストを実行しなおすと、無事アプリが起動してテストが成功するようになりました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/8227/9bf64824-8c99-0aed-d08e-baab4c2fe9eb.png)

Visual Studio for Mac 7.7.3 での事でしたが、理由はともかく、いきなり動かんのはおかんむりです。
3/13インプット

<h2>jQuery</h2>

<b>.on()</b>
・ click \ クリックされた時 
・ dblclick \ ダブルクリックされた時 
・ mouseover \ マウスが要素の上に乗った時 
・ mouseout \ マウスが要素から離れた時 
・keyup \ キーが離されたとき 

<b>RegExp()</b>
正規表現オブジェクトを作成

**.split("区切り")**
区切りの部分でデータを配列化

**.map()**
配列を一つずつ取り出し引数に代入そしてreturnを再度配列化

**.join("区切り")**
引数の配列の隙間に区切りを追加し結合そしてreturn

**.filter(function(e) { return e; })**
各文字ブロック（？）を一つずつ取り出し存在するならtrue,しないならfalseをreturn

<b>.append() / .remove()</b>
引数で指定したhtmlタグを挿入可能

<b>.prop</b>
*prop()とattr()の違い
 attr（） => 'undefined'
 →属性が付与されているかどうか
 prop（） => 'false'
 現在の状態の確認

<b>.val()</b>
value

**$(this)**
イベントの発生元となった要素

**:contains(" ")**
引数で渡した文字を抽出することができる

**$('A':first)**
はじめに合致したセレクタの値を対象にできる

**(window).scroll(function()**
スクロールをイベントにできる
.scrollTop()は0でそこから移動した距離を算出可


.parent() / .siblings() / .next()
.preventDefault()
.find()
.hide() / .show()
.fadeout()/ .fadein()
.addClass() / .removeClass()
検証環境を構築する上で知ったことパート2

# 話1：アーキテクチャ気をつけなきゃダメよ？
- i386	i386およびその互換CPU。
- i486	i486およびその互換CPU。
- i586	Pentium、MMX Pentiumおよびその互換CPU。
- i686	Pentium Pro、Pentium II、Pentium III、Pentium4、Celeronなど。
- k6	K6、K6-2、K6-III。
- athlon	Athlon、Athlon MP、Athlon XP。
- x86_64	Opteron、Athlon64、Xeon（EM64T）。
- src	ソースパッケージ。自分で rpm パッケージを作ったりする際(rebuild)に必要。
- noarch	機種(CPU)に依存しないパッケージ。
- ppc	Power PC。
- alpha	alphaチップ搭載コンピュータ。
- sparc	SUN SPARC。

調べてみると、結構いっぱいあるんすね。今回世話になったのは、このうちのi686と、x86_64って奴ですね。
phpとapacheでバージョンが同じでも違うアーキテクチャのrpmファイル入れてたら動かないでやんのっていう経験をしました。

# 話2:libphp5.soが無いのよ
phpのバグ?で、パッケージ化されたphpの内、このモジュールが生成されないということがあるらしく、私はバッチリそいつに引っかかりました。これが無いとどうなるかというと、

apacheがphp.confにこのmoduleを読みに言って、ねぇぞこのやろうと言って、起動できません。エラー文をコピーし忘れました。すいません。

##解決策

[php](https://centos.pkgs.org/6/centos-i386/php-5.3.3-49.el6.i686.rpm.html)

このrpmファイルにはlibphp5.soが入っているので、これをyumで落っことしてきて

```
$ sudo yum install http://mirror.centos.org/centos/6/os/i386/Packages/php-zts-5.3.3-49.el6.i686.rpm
```

そうすると、

/usr/lib/httpd/modules

のパスに

```
libphp5.so
```

が現れるので、こいつを読めるようにしてあげる。

```/etc/httpd/conf.d/php.conf
<IfModule prefork.c>
  LoadModule php5_module /usr/lib/httpd/modules/libphp5.so
</IfModule>
```

こうすると、起動ができるようになる。

###パート1はこちら
[検証環境を構築する上で知ったこと](https://qiita.com/Nedward/items/e8a3f24c104bfb22ac9b)
Vue.js × Vuetifyの環境構築

#はじめに
プログラミングを始めて2ヶ月ぐらいの初心者です。
備忘録としてVue.jsとVuetifyの環境構築方法を残しておきます。

##Vuetifyとは
Googleが提唱するマテリアルデザインに基づいたVue.js用のUIコンポーネントライブラリです。
Vuetifyを使用することでCSSを弄らなくてもいい感じに見た目を整えることができます。

#環境構築手順

前提としてnpmやvue-cliはインストールされているものとします。

まずはプロジェクトを作成。
質問形式で設定を聞かれるので必要に合わせて変更。

```
vue create プロジェクト名
```

プロジェクトのフォルダに移動しVuetifyを追加。

```
cd プロジェクト名
vue add vuetify
```

これでVueとVuetifyの環境が整いました。
サーバーを起動しブラウザで http://localhost:8080/ にアクセスして確認してみましょう。

```
npm run serve
```

以下のような画面が表示されたら成功です。
![localhost_8080_.png](https://qiita-image-store.s3.amazonaws.com/0/356988/8c484905-78cd-d46a-3def-922379314241.png)

---
【個人的メモ】
フル画面のスクリーンショットの撮り方は以下のサイトを参考にしました。
https://requlog.com/self-branding/blog/chrome-full-screen-capture/
Macの場合Google Chromeで以下の通り操作します。
①⌘+option+I
②⌘+shift+P
③「full」で検索し「Capture full size screenshot」が出てきたらEnter
カスタムコンポーネントにv-modelでオブジェクトをバインドしてcomputedを動的に定義する[vue.js]

# どんな時に使うのか
オブジェクトをカスタムコンポーネントに`v-model`でマウントする時！

```vuejs:components/Hello.vue
<template>
  <my-component v-model="obj" />
</template>

<script>
import MyComponent from '@/components/MyComponent';
export default {
  components: {
    'my-component': MyComponent,
  },
  data() {
    return {
      obj: {
        key1: '',
        key2: '',
        key3: '',
        key4: '',
      },
    };
  },
}
</script>
```

```vuejs:components/Mycomponent.vue
<form>
    <div class="flexForm">
      <dd>
        <input v-model="key1">
      </dd>
      <dd>
        <input v-model="key2">
      </dd>
      <dd>
        <input v-model="key3">
      </dd>
      <dd>
        <input v-model="key4">
      </dd>
    </div>
  </form>
</template>
<script>
export default {
  props: ['value'],
  computed: {
    key1: {
      get() {
        return this.value.key1
      },
      set(val) {
        this.updateValue({ key1: val });
      }
    },
    key2: {
      get() {
        return this.value.key2
      },
      set(val) {
        this.updateValue({ key2: val });
      }
    },
    key3: {
      get() {
        return this.value.key3
      },
      set(val) {
        this.updateValue({ key3: val });
      }
    },
    key4: {
      get() {
        return this.value.key4
      },
      set(val) {
        this.updateValue({ key4: val });
      }
    },
  },
  methods: {
    updateValue(diff) {
      this.$emit('input', Object.assign({}, this.value, diff));
    },
  },
}
</script>
```

オブジェクトのキーの数だけ`computed`が増える！！
そんな馬鹿馬鹿しいことやってられるか！！

# そんな時に`computed`を動的に定義させて綺麗にする
```vuejs:components/Mycomponent.vue
<form>
    <div class="flexForm">
      <dd>
        <input v-model="key1">
      </dd>
      <dd>
        <input v-model="key2">
      </dd>
      <dd>
        <input v-model="key3">
      </dd>
      <dd>
        <input v-model="key4">
      </dd>
    </div>
  </form>
</template>
<script>
export default {
  props: ['value'],
  beforeCreate() {
    [
      'key1',
      'key2',
      'key3',
      'key4',
    ].forEach((keyName) => {
      this.$options.computed[keyName] = {
        get() {
          return this.value[keyName];
        },
        set(val) {
          this.updateValue({ [keyName]: val });
        },
      }
    });
  },
  methods: {
    updateValue(diff) {
      this.$emit('input', Object.assign({}, this.value, diff));
    },
  },
}
</script>
```

ふ、ふつくしい。。。。！！！

# ちなみに
- `computed`を動的に定義するには`beforeCreate`じゃないと遅い
- `beforeCreate`のタイミングでは`this.value`が使えないし
  - `Object.keys(this.$options.propsData.value)`でいけるかと思ったけどいけなかった
  - なのでキー名を配列でベタ書きしてます

ってことで100点ではないけどまぁ80点かな

# 参考にさせていただいた記事
[v-modelにオブジェクトをバインディングする場合のコンポーネント実装を考える](
https://qiita.com/clomie/items/7a69ee850a304595142e#%E7%AE%97%E5%87%BA%E3%83%97%E3%83%AD%E3%83%91%E3%83%86%E3%82%A3%E3%81%AEgettersetter%E3%82%92%E5%88%A9%E7%94%A8%E3%81%99%E3%82%8B)
[v-modelを受け付けるカスタムコンポーネントの書き方の好み](https://joe-noh.hatenablog.com/entry/2017/09/01/235943)
[Generating computed properties on the fly](https://forum.vuejs.org/t/generating-computed-properties-on-the-fly/14833)
もそ、プログラミングを学ぶ【Ruby on Rails】〜resources メソッドについて〜

ここまで「うん、まあ何となく君の言わんとすることは分かる...気がする。まあ知らんけど。」ぐらいのふわふわなイメージでRailsを学んできました。
なので先輩に教えてもらっているときに「ちなみにこの部分はわかる？説明できる？」と聞かれると、うっ...とそのまま固まることがしばしば。

今日は自戒と復習の意味を込め、まさにそんなふわふわ理解だった**resourcesメソッド**について書いていきます。

#resourcesメソッドとは？

resourcesメソッドは、Railsの**基本となるコントローラの7つのアクションで記載した7つのアクション名に対してのルーティングを自動で生成するメソッド**です。
７つのアクション、なんかドラゴン○ールっぽいですね。全然関係ないけど、プログラミングを学び始めてからは”DB”を"ドラ○ンボール"ではなく、ちゃんとデータベースって脳内で変換できるようになりました。これほんとどうでもいい情報ですね。

この基本の７つのアクションと、それに対応する**HTTPメソッド**について説明して行こうと思います。
ここでは例としてTwitterを挙げて説明していきます。

##indexとshow

まず、Twitterの自分のアカウントページを開いたところを想像してみてください。
自分の今までの投稿が**一覧**になっていますよね。
これがコントローラ/アクションで示される**index**で、要するにトップページです。

次に、どれか一つのツイートをクリックしたと想像してみてください。
選択したツイートだけが表示される**詳細ページ**になります。
これが**show**になります。

indexとshowは、「ページを出してちょうだい」というルーティングの指示に従って**単純にページそのものを表示する処理**を行います。
ページを表示させるためのHTTPメソッドは**get**になります。
HTTPメソッドの処理のイメージはこんな感じ。

![無題1141.jpeg](https://qiita-image-store.s3.amazonaws.com/0/372174/92af7040-06d1-57d5-a542-7a0aa5657cab.jpeg)

単純にページを表示するだけなので、コントローラがアクションを起こしてくれます。

##newとcreate##

次に、アカウントにログインしてツイートを**新規作成**する、これは**new**アクションになります。
新規作成ボタンを押しただけでは、入力するための**記事作成画面を単純に表示するだけ**ですよね。
なのでHTTPメソッドは**get**になります。

では作成した記事を**投稿**するときは？
投稿ボタンを押すと、作成画面で入力した内容を**データベースに渡す処理が発生します。**
入力した情報をデータベースに渡すメソッドは**post**になります。
データベースと情報をやりとりするときは、こんな感じ。

![無題1140.jpeg](https://qiita-image-store.s3.amazonaws.com/0/372174/0c2f24fa-b037-e10f-30c7-eaf8b4bc4ef5.jpeg)


モデルがコントローラにデータベースから情報を渡しています。

##editとupdate##

さらに「ツイートを編集したいな〜」と考えたときは**編集**を行いますね。これが**edit**アクション。
こちらもnewアクション同様、ページを表示させるだけなのでHTTPメソッドは**get**になります。
「ん？じゃあ次のアクションはcreateで良くない？」と一瞬考えてしまいますが、今回は**既にある情報を書き換えて、その修正内容をデータベースに送る**という処理が発生します。
なのでHTTPメソッドは**patch**と呼ばれるものになります。

##destroy##

最後に「深夜に酔っ払ったノリで変なツイートあげてるやん...消そう...」と思ったとき。
迷わず**削除**を行いますよね。これが**destroy**です。
HTTPメソッドは名前そのまま**delete**になります。


---
こんなふうに分解して考えられるようになると、たとえばエラーが出たときに「あ、updateアクションなのにメソッドget入っちゃってるわ」みたいな感じで対応できますし、そもそもメソッドを間違えることがなくなるとのこと。
果たしてそんなふうに理解できる日が来るのか、、もその修行はまだまだ続く。
【Tips】Ubuntuへのcurb gemインストール時に発生しうるエラーへの対処

# 問題：curb gem インストールの失敗
## 入力
```bash
gem install curb -v '0.9.8'
```

## 出力
```bash
Building native extensions.  This could take a while...
ERROR:  Error installing curb:
        ERROR: Failed to build gem native extension.

    current directory: /home/【ユーザー名】/.anyenv/envs/rbenv/versions/2.4.5/lib/ruby/gems/2.4.0/gems/curb-0.9.8/ext
/home/【ユーザー名】/.anyenv/envs/rbenv/versions/2.4.5/bin/ruby -r ./siteconf20190313-11530-hol5d3.rb extconf.rb
checking for curl-config... no
checking for -lcurl... no
*** extconf.rb failed ***
Could not create Makefile due to some reason, probably lack of necessary
libraries and/or headers.  Check the mkmf.log file for more details.  You may
need configuration options.

Provided configuration options:
        --with-opt-dir
        --without-opt-dir
        --with-opt-include
        --without-opt-include=${opt-dir}/include
        --with-opt-lib
        --without-opt-lib=${opt-dir}/lib
        --with-make-prog
        --without-make-prog
        --srcdir=.
        --curdir
        --ruby=/home/【ユーザー名】/.anyenv/envs/rbenv/versions/2.4.5/bin/$(RUBY_BASE_NAME)
        --with-curl-dir
        --without-curl-dir
        --with-curl-include
        --without-curl-include=${curl-dir}/include
        --with-curl-lib
        --without-curl-lib=${curl-dir}/lib
        --with-curllib
        --without-curllib
extconf.rb:18:in `<main>':   Can't find libcurl or curl/curl.h (RuntimeError)

  Try passing --with-curl-dir or --with-curl-lib and --with-curl-include
  options to extconf.

To see why this extension failed to compile, please check the mkmf.log which can be found here:

  /home/【ユーザー名】/.anyenv/envs/rbenv/versions/2.4.5/lib/ruby/gems/2.4.0/extensions/x86_64-linux/2.4.0-static/curb-0.9.8/mkmf.log

extconf failed, exit code 1

Gem files will remain installed in /home/【ユーザー名】/.anyenv/envs/rbenv/versions/2.4.5/lib/ruby/gems/2.4.0/gems/curb-0.9.8 for inspection.
Results logged to /home/【ユーザー名】/.anyenv/envs/rbenv/versions/2.4.5/lib/ruby/gems/2.4.0/extensions/x86_64-linux/2.4.0-static/curb-0.9.8/gem_make.out
```

# 環境
- Windows Subsystem for Linux (WSL)
    * Ubuntu 18.04 LTS
- anyenv
    * rbenv 1.1.1-39-g59785f6
        + ruby 2.4.5p335 (2018-10-18 revision 65137) [x86_64-linux]

# 原因：curlライブラリ
[native extensionとして必要](http://woshidan.hatenadiary.jp/entry/2017/01/21/150948)なcurlのライブラリが入っていない。

# 解決方法
```bash
sudo apt install libcurl4-openssl-dev
gem install curb -v '0.9.8'
```

# 補足
表題はUbuntuとしているが、LubuntuやXubuntuの他RaspbianなどDebian系OSであれば同様の方法で対処可能と考えられる。
CentOSなどRedHat系で```apt```ではなく```yum```を使う場合は[こちら](https://qiita.com/pieroplus/items/a9a7b2d1bf1674bdc622)を参照。

# 参考文献
- [Error installing Curl, Curb Gem?](https://stackoverflow.com/questions/23554497/error-installing-curl-curb-gem)
- [Rubyのgemをインストールしている際に他のライブラリのインストールを要求してくるnative extensionとは何者か](http://woshidan.hatenadiary.jp/entry/2017/01/21/150948)
- [EC2へのデプロイ時のgemインストール「bundler:install」エラー対応](https://qiita.com/pieroplus/items/a9a7b2d1bf1674bdc622)
Web Starter Kitで SSI したいと思った話

## Web Starter Kit
https://developers.google.com/web/tools/starter-kit

サクッとペライチのhtmlページを作るときに便利につかえる `Web Starter Kit` を 10ページくらいのボリュームの静的サイトを作るのにもうちょっと便利にならんかと思ったのが始まり。

まずはすべてのページに共通するパーツ、ヘッダ、フッタを SSI すればよくね？と思い、 `connect-ssi` を導入。

https://www.npmjs.com/package/connect-ssi

```Javascript
...
import connectSSI from 'connect-ssi';
...

// Watch files for changes & reload
gulp.task('serve', ['scripts', 'styles'], () => {
  browserSync({
    ...
    server: {
      baseDir: ['.tmp', 'app'],
      middleware: [
        connectSSI({
           baseDir: __dirname + '/app',
           ext: '.html'
        })
      ]
    },
    port: 3000
  });
  ...
});

```

構築しながら確認で `gulp serve` している間は問題なかった。

`gulp serve:dist` でビルドしたところ、SSIしていたヘッダ、フッタが消えた。そんな予感はしていた。気づかないふりをして構築していた。最悪コピペすりゃいいと思っていた。だって `serve:dist` パートに設定書いてないしね。

いよいよ納期も迫ってきたので、真面目に考えることにする。

とりいそぎ `serve:dist` にも同様の設定を施すが、ヘッダ、フッタは消えたままだ。出力されたhtmlを確認するとコメント行が削除されていることを確認。 `html-minifiier` によってコメント行が削除されているようだ。

```Javascript

// Scan your HTML for assets & optimize them
gulp.task('html', () => {
  return gulp.src('app/**/*.html')

    ...

    // Minify any HTML
    .pipe($.if('*.html', $.htmlmin({
      removeComments: true, # ココ
      ...
    })))
  ...
});

```

コメントを残す設定にすることも考えたが、せっかく `WSK` を使っているのに負けた気分になるので、対策を考えることにする。

ようは部分htmlを特定の場所に挿入できればよいわけで、はたして `gulp-file-inlude` というツールを見つけた。

https://www.npmjs.com/package/gulp-file-include

というわけで以下のような感じで導入はでき、 `serve:dist` でヘッダ、フッタが出力されていることが確認できた。

```HTML
    <div id="content">
      @@include('./header.html')
      <section id="">
```

```Javascript
  // fileInclude
  .pipe(fileInclude({
              prefix: '@@',
              basepath: './app/includes/'
  }))
```

やったぜ、と喜ぶのは尚早で、 `gulp serve` 時には SSI を使いたい。リアルタイムで構築しながら確認しているのだから。

というわけで

```HTML
      <!--#include virtual="/includes/header.html" -->
      @@include('./header.html')
```

と併記してみる。

 `serve:dist` 時には `gulp-file-include` の処理が実行され、 SSIのコメント行は削除されるのでOK。

`serve` 時は SSIが実行されて、 `gulp-file-include` の行が残る。残念。

まぁ構築確認時の問題なので気にしないという手もあった。
しかしここで電流走る。以下のように書けばよいのでは？

```HTML
    <div id="content">
      <!--#include virtual="/includes/header.html" -->
      <!-- @@include('./header.html')<!-- -->
      <section id="">
```

```Javascript
  // fileInclude
  .pipe(fileInclude({
              prefix: '<!-- @@',
              basepath: './app/includes/'
  }))
```

つまり `gulp-file-inlude` の プレフィクスを `<!-- @@` としてコメント行に内包する。 `<!-- @@include('./header.html')` までが部分html で置換されるので、 `<!-- -->` が コメント行として残り、最終的に `html-minifier` で削除されるという寸法。

めでたしめでたし。
QuantXでこの変数なんだよって思ったものリスト

悩んだこと書いていきます。
特にcurrentとportfolio.positionsで悩みました。

利確と損切りのロジック重要なんでね。


#自己紹介
この度Smart Tradeでインターンすることになったゴンです。 

ゴンについて、知りたい方はこちら。

https://www.investor-gon.com/

初めての記事はこちら(QuantXを初めてみて)
https://qiita.com/investor-gon/items/2b1952ae5c2c88334c74



#まずQuantXのコードをざっくりと分けるとこの３つ

- def initialize(ctx)
まず、<b>読み込む株</b>を指定する。自分で使いたい変数も指定できるよ！
（証券コードだったり、終値だったり...）
<br>

- def _my_signal(data)
<b>売買シグナル</b>を設定する。テクニカルなどなど
<br>

- def handle_signals(ctx, date, current)
日ごとに呼び出される関数で、ここでは基本的に、<b>利確損切り</b>などを設定します。 


#TAlibとは

テクニカル指標などを簡単に実装できるライブラリです。
実装できるテクニカル指標はこちらをみてね。

https://mrjbq7.github.io/ta-lib/funcs.html

#def initialize(ctx)編

変数とかはこんな感じに設定できます

```
ctx.変数名　＝　●

例
ctx.target = 0.1

```

ここは銘柄選ぶが大事なので、プログラムで悩むことはあんまり個人的にはなかったです。

銘柄選びなら、

https://www.buffett-code.com/

https://kabutan.jp/

などを個人的には使用してます。


#def _my_signal(data)編

シグナルによる売買を考えていきます。

シグナル登録は忘れずに

```
# シグナル登録
ctx.シグナル関数名("シグナル関数名", シグナル関数名)

    
例
ctx.regist_signal("my_MACD", _my_MACD)

```

returnに自分のシグナルを入れておくとこんな感じに見れて見やすいですよ。
チェックもしやすくていいです。
![スクリーンショット 2019-03-13 17.15.12.png](https://qiita-image-store.s3.amazonaws.com/0/332034/a706247c-6f4e-0fce-cada-218f0fbb948a.png)


#def handle_signals(ctx, date, current)編

##●currentの中身
各日付ごとのデータがこの中には入っています。具体的には、


- <b>def initialize(ctx)で読み込んだ株価など</b>

 split_ratio  、high_price_adj 、 close_price_adj 、 close_price  とかとか
<br>

- <b>def _my_signal(data)でreturnに入れたもの</b>

MACD 、MACDHist、  MACDSignal 、buy:sig  、sell:sig  


##●portfolio.positionsの中身

リターンなんかはよく使えるので、いいですね。

```
"amount": asset.amount,                          # 保有株数
"total_buy_price": asset.total_buy_price,        # 今までの総購入額
"total_sell_price": asset.total_sell_price,      # 今までの総売却額
"buy_price": bp,                                 # 現在のポジションの総購入額(amountが0になると0にリセットされる)
"sell_price": sp,                                # 現在のポジションの総売却額(amountが0になると0にリセットされる)
"value": value,                                  # 現在の評価額
"position_ratio": position_ratio,                # 保有銘柄の中での割合,
"portfolio_ratio": portfolio_ratio,              # 資産全体での割合
"pnl": value - (bp - sp),                        # 損益額
"returns": returns                               # 損益率

```


なんかまたあったら追記します。

ちゃお
keyCodeでイベント発火させる方法

クライアントから「Enterキー押したら、検索結果が出るようにして！」と要望があり、難儀したのでメモ代わりに残します。

#キーコードを取得してイベントを発生させる
イベント発火は`keyup`・`keydown`・`keypress`のいずれかで取得できます。
これをベースにして、Enterキーのコードを取得して、ほにゃららする処理を作成していけます。

```
	$(window).keydown(function (e) {
		console.log(e);
        // 13:enterKey
		if (e.keyCode == 13) {
        // ここに処理
        alert('Enterキーが押されました');
		}
	});
```

#キーコード一覧
参考にさせていただきました。
[ShanaBrian Website 押したキーのキーコードを取得](http://shanabrian.com/web/javascript/keycode.php)

|対応キー|キーコード|
|:--|---:|
| 1 | 49 |
| 2 | 50 |
| 3 | 51 |
| 4 | 52 |
| 5 | 53 |
| 6 | 54 |
| 7 | 55 |
| 8 | 56 |
| 9 | 57 |
| 0 | 48 |
| A | 65 |
| B | 66 |
| C | 67 |
| D | 68 |
| E | 69 |
| F | 70 |
| G | 71 |
| H | 72 |
| I | 73 |
| J | 74 |
| K | 75 |
| L | 76 |
| M | 77 |
| N | 78 |
| O | 79 |
| P | 80 |
| Q | 81 |
| R | 82 |
| S | 83 |
| T | 84 |
| U | 85 |
| V | 86 |
| W | 87 |
| X | 88 |
| Y | 89 |
| Z | 90 |
| - | 173 |
| ^ | 160 |
| \ | 220 |
| @ | 64 |
| [ | 219 |
| ] | 221 |
| ; | 59 |
| : | 58 |
| , | 188 |
| . | 190 |
| / | 191 |
| テンキー1 | 97 |
| テンキー2 | 98 |
| テンキー3 | 99 |
| テンキー4 | 100 |
| テンキー5 | 101 |
| テンキー6 | 102 |
| テンキー7 | 103 |
| テンキー8 | 104 |
| テンキー9 | 105 |
| テンキー0 | 96 |
| テンキー/ | 111 |
| テンキー* | 106 |
| テンキー- | 109 |
| テンキー+ | 107 |
| テンキー. | 110 |
| テンキーEnter | 13 |
| F1 | 112 |
| F2 | 113 |
| F3 | 114 |
| F4 | 115 |
| F5 | 116 |
| F6 | 117 |
| F7 | 118 |
| F8 | 119 |
| F9 | 120 |
| F10 | 121 |
| F11 | 122 |
| F12 | 123 |
| ↑ | 38 |
| ↓ | 40 |
| ← | 37 |
| → | 39 |
| Enter | 13 |
| Shift | 16 |
| Ctrl | 17 |
| Alt | 18 |
| Space | 32 |
| BackSpace | 8 |
| Esc | 27 |
| Tab | 9 |
| CapsLock | 20 |
| NumLock | 144 |
| Insert | 45 |
| Delete | 46 |
| Home | 36 |
| End | 35 |
| PageUp | 33 |
| PageDown | 34 |
| ScrollLock | 145 |
| Windows | 91 |
| 英数 | 240 |
| 半角/全角 | 243 |
| 漢字 | 244 |
| 無変換 | 29 |
| 変換 | 28 |
| カタカナ/ひらがな/ローマ字 | 242 |
RubyとRailsを古いバージョンから一気に最新安定版にあげた

2019年3月末でRuby2.3系のサポートが切れるわけだが、
現在携わっているプロジェクトがまさに2.3系を使用していたので
一気に最新安定版のRuby2.6系にあげてみたのでそれの備忘録。

##現在の環境
- Ruby 2.3.1
- Rails 4.2.7.1
- CentOS 7.2

自機がwin10なので仮想環境(Vagrant+Docker)で整えています

##ひとまずRubyのバージョン確認
```
$ rbenv install --list
(中略)
2.6.0
2.6.1
2.7.0-dev
(中略)
```
rbenvのバージョンはすでに最新版になっていたので
2.6.1を選択する
※MacではないためHomebrewが使えないのでruby-buildを最新版に更新する必要がある。
　(多分OSとruby-build updateみたいなワードでググれば出てくるはず)

####最新バージョンをインストール
```
$ rbenv install 2.6.1
```
インストールできたら念の為バージョン確認

```
$ rbenv versions
  system
  2.3.1
  2.3.8
* 2.6.1 (set by /home/vagrant/workspace/2.6ver/myapp/.ruby-version)
```
他のプロジェクトではまだ2.3系を使ってるので
今回はローカルでバージョン指定しておいた
(そっちも早く上げろというのは置いといて

####gemをアップデート
割と忘れがちなgemのアップデート。
これやっとかないとRubyとgemで差分エラーみたいなものに遭遇する。

```
$ gem update
```
これが結構時間かかるのでこの間にコーヒーとかでも飲むといいよ^^

####bundlerもバージョンアップしておく
2.6系から標準で`bundler`が搭載されたらしいが、
最新版インストールしたから～と言って
`bundler`もそのまま上がってるわけではないので
これもアップデートしておく

```
$ gem install bundler
```

####Railsもバージョンアップ

```
$ gem install rails
```
（まだ6.0系がリリースされていなかったので5.2.2が最新版になった

###既存システムのGemfileを書き換え
Railsのバージョンを上げたので、それに伴って
Gemfileに記述しているRailsのバージョンを更新したバージョンに書き換える

```
# Gemfile
(中略)
gem "rails", "5.2.2"
(中略)
```

####書き換えたらアップデート

```
$ bundler update
```

gemの依存性問題などでエラーハンドルしたら
バージョンのコンフリクトなどが考えられるので
`gem cleanup`で対処する

-あとがき-
Railsのバージョンを上げたときに、Gemfileに記述した
バージョン指定が影響していることもあるので
その際は、`gem "rails"`以降のバージョン指定部分を削除しておくと
インストールができるはず。。
Rails wheneverで秒数まで指定して実行する

## やりたいこと
Railsでcronを管理するためのgem `whenever`を使って秒数まで指定してバッチを実行する。

## cronは分数までしか指定できない。
てっきり`schedule.rb`にて` every :day, at: jst_to_utc('8:00 pm') do`と指定すれば
`YYYY-MM-DD 20:00:00`に実行されるものだと思っていましたが、どうやら多少の誤差があるようです。
実行結果を見ると、7~13秒ほど遅れて実行されていました。

00秒きっちりにバッチ処理を実行するには**cronの指定だけではできない**ようです。


#batch内でどうにかする

例 )
毎時 10分00秒にバッチを実行したい場合
バッチが`00:09:13`あたりに実行されてそこから`00:10:00`までループ処理を実行します。
すると実行したい処理が00秒きっちりに実行されるようになりました。

`config/schedule.rb`

``` ruby
every '9,19,29,39,49,59 * * * *' do
  runner 'Hoge::Fuga.execute'
end
```

`app/batches/hoge/fuga.rb`

```ruby
module Hoge
  class Fuga < ApplicationBatch
    def process
      loop do
        break if Time.current.sec.zero?
      end
      p Time.current
      ## 実行したい処理
    end
  end
end
```

```
$ rails runner 'Hoge::Fuga.execute'
> Fri, 18 Jan 2019 12:48:00 JST +09:00
```
00秒ぴったりに実行されました。

無事秒数まで指定してbatchを実行することができましたが、処理が走ってから00秒になるまでずっとループしているので少し怖いです。

もしイケてる方法を知っている方がいたらご教授お願いします。


## 参考にしたもの
https://moro-archive.hatenablog.com/entry/2015/03/17/011823

https://teratail.com/questions/90922

https://stackoverflow.com/questions/37112211/whenever-gem-is-not-working-for-every-2-seconds
これで怖くないCSSで文字サイズ(font-size)の指定

# サイズ指定の使い方について
サイズ指定の際にどれを使うとどういう効果があるのかを簡易的に記載。

## px(ピクセル)

コンピュータ画面上のピクセル数（画素数）をもとにサイズをだすもの。

## %(パーセント)

親要素の一部を基準とした割合

p要素のfont-sizeを16pxにしたときpの中にあるspanに設定したとすると。

|%|px|
|:------|:------|
|100%|16px|
|50%|8px|

よく使う場所(個人差あり)

- フォント指定の際にbody 要素、HTML 要素に指定するとem,rem などが使いやすくなる。
- スマートフォンの時のマージン、パディング、横幅などに使用することが多い。

## em(エム)

親要素の大文字のMを基準とした単位(その時点の1文字分の長さ)

p要素のfont-sizeを14pxにしたときpの中にあるspanに設定したとすると。

|em|px|
|:--|:--|
|1em|14px|
|1.5em|24px|
|0.5em|7px|

※body要素にfont-size:62.5%;で指定すると1emが10pxと指定できる。

よく使う場所(個人差あり)

- list-style やletter-space など行間、文字間を指定する場合にem で設定すると使いやすい

## rem(レム)「root」+「em」

親要素を継承せず、HTML要素に対する相対としての単位

html要素が62.5%の時

```css
html {
    font-size: 62.5%;
}
```

|rem|px|
|:--|:--|
|1rem|10px|
|2.5rem|25px|

※親要素に依存することがないので、入れ子になった時やタグが変わった時に影響がない

よく使う場所(個人差あり)

- 親要素に依存させたくない場合に使用する。
- emよりもより固定的な文字指定の向いている。

## vw(viewport width)

ビューポート(デバイス)の幅に対する割合(100vw がビューポートの幅)

|デバイス|1vw|3vw|10vw|
|:--|:--|:---|:--|
|iPhone5S(320px)|3.2px|9.6px|32px|
|スマフォ(480px)|4.8px|14.4px|48px|
|PC(1280px)|12.8px|38.4px|128px|

よく使う場所(個人差あり)  
レスポンシブの際に、背景の拡大縮小に文字サイズを合わせる時に使うと便利

## vh(viewport height)

ビューポート(デバイス)の高さに対する割合（100vh がビューポートの高さ）

よく使う場所(個人差あり)  
モーダルウィンドウや横固定メニューなどに使うと便利

## pt（ポイント）

現実世界の絶対的長さの単位

グラフィックデザインなどに使われる。

## まとめ

それぞれに適材適所があると思うので、使うポイントをあらかじめ決めておいた方がいい。

制作スタイルで使い方も変わるのかなと。