OmniAICreator/Qiita-1.07M huggingface dataset:
wrkを使ってAPI Gatewayに負荷をかけてみる


以前、[Tsungを積んだDockerで負荷テストを行う](https://qiita.com/RyujiKawazoe/items/042f07c679cbf01fff02)という記事を書きました。

たしかこのときは、ELBにぶら下げたアプリケーションへの負荷テストの過程でTsungを見つけてためしたような、そうでないような（うろ覚え）

今回、私が負荷テストの対象としたのはサーバレスな環境です。
つまり API Gateway+Lambda+αで構成されるサービスに対して負荷テストをかけようと思いました。


前回使ったtsung環境は使えるのか？
---

私のケースに限り、使えませんでした。というより使いませんでした。

私のケースというのは、予め有志が作成したtsung入の[dockerイメージ](https://hub.docker.com/r/ddragosd/tsung-docker/)をつかっていることです。

このイメージをそのままつかっても、ハンドシェイクエラーが起こりAPI Gatewayに通信ができません。

![スクリーンショット 2018-04-11 15.45.16.png](https://qiita-image-store.s3.amazonaws.com/0/18331/3dac6988-695a-d43d-d38e-983084634e24.png "スクリーンショット 2018-04-11 15.45.16.png")


[ここの記事](https://jackiechen.org/2015/12/04/use-tsung-to-test-https-site/)にある通り、tsungをリコンパイルすればできるのかもしれません。

これはまた自分でtsung入のdockerイメージを作る羽目になるので、まったくdockerの恩恵をうけてないので今回このイメージは使いません。

wrkを使う
---

dockerHubにwrkを積んだイメージがありました！
これですぐにwrkが使えますね。使わせていただいたwrkのdockerイメージは[こちら](https://hub.docker.com/r/williamyeh/wrk/)

docker-compose.yml

```
version: '3'
services:
  wrk:
    image: williamyeh/wrk:latest
    command: /data/attack.ash
    entrypoint: ash
    working_dir: /data
    volumes:
      - ./:/data
```

entrypointがデフォだとwrkとなります。
私の場合は、自分で書いたシェルを読み込ませたかったので、entorypointをashとしました。

/data/attack.ash

```
#!/bin/ash

# 負荷テスト1
wrk -t 2 -c 5 -d 5s -s /data/script_post_1.lua https://api-gateway
# 負荷テスト2
wrk -t 2 -c 5 -d 5s -s /data/script_post_2.lua https://api-gateway
```

script_post_1.lua

```
wrk.method = "POST"
wrk.headers["Content-Type"] = "application/json"

body = [[
{
	"hoge": "hoge"
}
]]

wrk.body = body

```


これで、`docker-compose run wrk`を実行すると負荷がかかります。
【javascript】iOSに物理キーボードをつないでkeyupイベントでどのキーがupされたかを取得する

#iOSの困った現象

iOSのデバイスに物理キーボードをbluetoothや有線でつないで操作するケースはままあると思います。

今日お客さんからiPadにつないだキーボードだと操作ができない旨のお話をいただき調べたところ、iOS+物理キーボード+safariの組み合わせでkeyupイベントのevent.keyCodeがみんな0になってしまうという不具合(仕様？）がありました。

結構前からそうみたいです。

StackOverflowにも同様の質問がいくつかありましたが解決はしていない模様。

https://stackoverflow.com/questions/28944171/e-keycode-in-ios-safari-on-keyup-event
↑現象は説明してくれてるんだけど答えが載ってない... ちなみにevent.whichも0でした。

https://stackoverflow.com/questions/45924702/ipad-bluetooth-keyboard-returns-keycode-of-0-for-any-key-with-onkeyup
↑矢印キーとESCなら取得できる

#今回やりたかったこと
キーボードの特定のキーが押されている時間を取得したかったのでkeydownイベントとkeyupイベントの組み合わせがどうしても必要でした。

#対応案
1. keyup自体は動作する（keyCode=0が返るが...）のでkeypressでkeyCodeを取っておいてkeyupは取っておいたkeyCodeのkeyupとみなす
　（→複数キーの同時押しに対応できない！）

2. iPadはiOSのせいにして諦める
　（→iPad前提の案件のため不可！）
3. 上にあるように矢印キーを駆使して代替する
　（→最大で５つぐらいキーを押す必要があるため矢印キーだと足りない、ESCもあるけどちょっと）
4. アプリにすれば何とかなる？？
　（→アプリ経験ないので不可！）
5. iPadはやめてsurfaceにしたらどうかと、surfaceの営業をかける

思いつくのはこれぐらいでしょうか。

#調査

みんなできない言うても自分で調べないと納得できないので、調査を行います。
調査といってもeventの中身を見るだけですが。

1. 手持ちのiPhoneを手持ちのmacと有線でつなぎます。
2. iPhoneの「設定」＞「safari」＞「詳細」＞「webインスペクタ」を有効にします。
3. iPhoneとBluetoothでAppleのキーボードをペアリングします。
4. サンプルのwebpageをiPhoneのsafariで開きます。
5. macのsafariの開発者ツールから自分のiPhoneを指定します。
6. iPhoneのsafari上でAppleのキーボードにてkeyupを行います。
7. macのデバッガで`console.log(event)`の中身を見てみます。

コードは至ってシンプル(jquery)

```javascript
$(function(){
  $(document).keyup(function(ev){
    console.log(ev);
  });
});
```

#調査結果

1キーを押下してみました。logは取れましたが...

```
altGraphKey: false
altKey: false
bubbles: true
ancelBubble: false
cancelable: true
charCode: 0
code: "Unidentified"
composed: true
ctrlKey: false
currentTarget: null
defaultPrevented: false
detail: 0
eventPhase: 0
isComposing: false
isTrusted: true
key: "Dead"
keyCode: 0
keyIdentifier: "Unidentified"
keyLocation: 0
layerX: 0
layerY: 0
location: 0
metaKey: false
pageX: 0
pageY: 0
repeat: false
returnValue: true
shiftKey: false
srcElement: <body>
target: <body>
timeStamp: 132920459935500700
type: "keyup"
view: Window {}
which: 0
```

本当にcharCodeもkeyCodeもwhichも0...
キーを判定できそうな情報は皆無です。

#解決方法
surfaceの営業マンになるしかないかと諦めかけていたのですが、いろいろいじくってたらログに`key: "1"`が出ました。

なんでだろうと思って２のキーを押してみるとちゃんと`key: "2"`が…


よくよく見てみるとinputタグのtext入力欄にフォーカスされていました。
textにフォーカスされている状態でkeyupを行うとevent.keyに押下したキーが取得できるようです。

ここまで取れればあとは何とかできそう。

`<input type="text" id="tmp"/>`をどっかに隠して用意しておいて、

```javascript
var current_key = undefined;
$(document).keydown(function(event){
  $("#tmp").focus();
  if(event.key) {
    if(event.key !== "Dead"){
      current_key = event.key;
    }
  }
}).keyup(function(event){
  if(event.key === current_key) {
    something()
  }
  current_key = undefined;
});
$("#tmp").blur(function(){
  if(current_key !== undefined){
    something();
  }
  current_key = undefined;
});

function something(){
//何か処理
}
```

keydownでテキストボックスにfocus()しておいて、keyup時のkeyを取得、何かの拍子にテキストボックスのfocus()が外れてしまったらそこでkeyupしたこととみなす、


尚windowsではshiftキー単体のkeyupでevent.keyに"Shift"とはいったのですが、iPad+物理キーボードではkeyupイベント自体が動きませんでした。

この辺りはどうしようもなさそうです。

#まとめ
・iOS+物理キーボード+safari環境でkeyupイベントは実行できるがevent.keyCodeが常に0
・上記環境のkeyupを使いたい場合は、テキストボックスにフォーカスした状態でkeyupし、event.keyにて打たれたキーの文字を取得する必要がある。
・ShiftキーやAltキーなどの単体のkeyupイベントは上記環境では取得できない。
任意の文字列がwebサイト上に存在するかをURLリストを用いて判定するシェルスクリプト

自分用。調べてもそれっぽいものが見つからなかったので、自作してみた。
もっと良い作り方が絶対あると思います。

### コード

テキストエディタで以下のコードを「source_check.sh」とか適当に名前をつけて保存。
改行コードはLFにするように。

```bash:source_check.sh
#!/bin/bash
# $1 urls.txt
# $2 'keyword'

filename='output.txt'

touch $filename
cp /dev/null $filename

for i in $(cat $1);
do
    command=`curl -s $i | grep -c "$2"`;
    echo "$i,$command" >> $filename;
done;
```

### 使い方

事前に以下のようなURLが羅列されたリストを用意しておきます。ファイル名は「urls.txt」とか適当に。
改行コードはLFにするように。

```:urls.txt
https://www.google.co.jp
https://www.yahoo.co.jp
https://www.microsoft.com
```

シェルスクリプトと同じところにURLリストファイルも置いておきます。
後は、シェルスクリプトに実行権限を付与して実行

```bash
chmod u+x ./script.sh
./source_check.sh url.txt '調べたいキーワード'
```

第一引数は参照したいURLリストのファイル名
第二引数は調べたいキーワードをシングルクオーテーションで囲んだ文字列です

### 結果

シェルスクリプトと同じところに「output.txt」という名前で、調べたURLと、キーワードの出現回数を出力します。

スクリプトをもう一度実行したら、「output.txt」の中身を空にして、再出力します。

### おまけ

ちなみにテスト環境とか、BASIC認証を求められる環境でもシェルスクリプトの中身を次のように変更すれば実行可能です。

```bash:source_check_test.sh
#!/bin/bash
# $1 urls.txt
# $2 'keyword'

filename='output.txt'

touch $filename
cp /dev/null $filename

for i in $(cat $1);
do
    command=`curl -u username:password -s $i | grep -c "$2"`;
    echo "$i,$command" >> $filename;
done;
```
Spark環境再構築

# Spark 環境の構築手順

## 1. hadoop と hadoop抜きspark 配布物を取得してきて展開する。

今だと以下の二つ

https://www.apache.org/dyn/closer.lua/spark/spark-2.3.0/spark-2.3.0-bin-without-hadoop.tgz
http://www.apache.org/dyn/closer.cgi/hadoop/common/hadoop-3.0.1/hadoop-3.0.1.tar.gz

ほかに jdk がインストールされていること

## 2. 展開
例えば、```${HOME}/UsrLocal/``` 以下に展開し、以下のように環境変数を設定しておく。

```
## Hadoop
#export JAVA_HOME=`/usr/libexec/java_home`
export JAVA_HOME=`dirname $(readlink $(readlink $(which java)))`/../../
export HADOOP_HOME=$HOME/UsrLocal/hadoop-3.0.1
export PATH=${HADOOP_HOME}/bin:${PATH}
export HADOOP_CONF_DIR=${HADOOP_HOME}/etc/hadoop

## Spark
export PATH=$HOME/UsrLocal/spark-2.3.0-bin-without-hadoop/bin:${PATH}
export SPARK_DIST_CLASSPATH=`hadoop classpath`
export PYSPARK_DRIVER_PYTHON=ipython
```

JAVA_HOMEのコメントアウトされている方は MacOS 用。PYSPARK_DRIVER_PYTHON は後述の ipython を使うためのもの

## 3. python module まわり
python3 の venv 環境を作っておいて、その中で pip インストールする。
この際、ipythonが venv の外にあるとエラーになるので ipython も venv でインストールする。
ほかに、 pandas, xlrd (pandasでExcelファイル読み込みに使った), scikit-learn, scipy などをインストールしておいた。

```
mkdir proj_dir
cd proj_dir
python3 -m venv P
source P/bin/activate
pip3 install ipython
pip3 install pandas
pip3 install xlrd
```

## 4. 実例
この状態で pyspark を実行すると IPython terminal で spark が使える。

```
Python 3.6.5 (default, Apr  2 2018, 10:07:26) 
Type 'copyright', 'credits' or 'license' for more information
IPython 6.3.0 -- An enhanced Interactive Python. Type '?' for help.
2018-04-11 16:52:44 WARN  NativeCodeLoader:60 - Unable to load native-hadoop library for your platform... using builtin-java classes where applicable
Setting default log level to "WARN".
To adjust logging level use sc.setLogLevel(newLevel). For SparkR, use setLogLevel(newLevel).
Welcome to
      ____              __
     / __/__  ___ _____/ /__
    _\ \/ _ \/ _ `/ __/  '_/
   /__ / .__/\_,_/_/ /_/\_\   version 2.3.0
      /_/

Using Python version 3.6.5 (default, Apr  2 2018 10:07:26)
SparkSession available as 'spark'.

In [1]: 
```

pandas で Excel ファイルを DataFrame として読み込み、これを Spark の DataFrame に変換する。
いつの間にか RDD ではなく DataFrame (DataSet) が基本的なデータ型になっているそうでこちらでデータ操作することになりそう。

```
In [1]: import pandas as pd

In [2]: pde=pd.ExcelFile('testdata1.xlsx')

In [3]: pds=pde.parse(pde.sheet_names[0])

In [4]: %time sdf=sqlContext.createDataFrame(pds)
CPU times: user 154 ms, sys: 27.1 ms, total: 181 ms
Wall time: 2.45 s

In [5]: %time sdf.groupBy('性別').count().show()
2018-04-11 16:58:05 WARN  Utils:66 - Truncated the string representation of a plan since it was too large. This behavig.maxToStringFields' in SparkEnv.conf.
+---+-----+                                                                     
| 性別|count|
+---+-----+
|  男|   16|
|  女|   84|
+---+-----+

CPU times: user 22.7 ms, sys: 11.6 ms, total: 34.4 ms
Wall time: 3.45 s

```

上の pdf が pandas dataframe で sdf が Spark dataframe。
gitまとめ

Gitのしくみと使い方をまとめとく。

#Gitのしくみ
一つのプロジェクト（コード）を、機能ごとに分けて並行して直していきたい時がある。
各々の進捗や変更履歴を残しておくと便利。
そこで、「特に○○を直してったコード＆変更履歴」＝**branch**を各々ごとに用意し、適宜各人が修正できた段階までをお互いに取り込んで開発を進めていくことにする。
普通は**master branch**を常に完全版として、それ以外の開発用に適当なブランチを切る。

   ↑---> br1 -->--↓　　　↑------>--- br3 ---->-------↓
-->---->---->---->--->--- master branch --->---->------->-----
      ↓--> br2 ->----↑

これとは別に、開発するときには個々人の手元のファイルとリモートにある総まとめのファイル群がごっちゃにならないようにするとべんり。
#Git用語
- ワークツリー：
手元で色々ファイルを編集するためのディレクトリ。
- インデックス：
ワークツリーの中にも必要な（Gitで管理したい）ファイルとそうでないファイルがある。
Gitで管理したいファイルを登録しておくのがインデックス。
- （ローカル）リポジトリ：
コードとその変更履歴が時系列順に記録されたもの。リポジトリを更新することを**コミット**という。
- （リモート）リポジトリ：
ローカルリポジトリがリモートに乗っけられたもの。他の人がブランチを見れるようになる。


何段階もステップを踏ませることで各人の編集が干渉しないようにしつつも共有しやすいようにしてある。
FlatCAM 8.5をmacOS High Sierraにインストールする

# 1. 概要

基板の切削を行うためにFlatCAMをインストールしました。
Pythonに詳しくないこともあって大変だったので過程をメモしておきます。

# 2. 環境

* Macbook Pro (15-inch, Mid 2017) & macOS High Sierra 10.13.3)
* Python 2.7.10
* Python 3.6.5

# 3. 参考サイト


# 4. 方法


## 4.1 リポジトリのクローン

フォルダを作成したい階層に移動して以下のコマンドを実行

```
git clone https://bitbucket.org/jpcgt/flatcam
```

`flatcam`というフォルダが作成される

## 4.2 必要なファイルのインストール

公式サイトの[Requirements](http://flatcam.org/manual/installation.html#requirements )によると必要なものは以下になります。

>
* Python 2.7 32-bit
* PyQt 4
* Matplotlib 1.3.1
* Numpy 1.8
* Shapely 1.3
   - GEOS (Binary package required by Shapely)
* RTree
    - SpatialIndex (Binary package required by RTree)

### PyQt4のインストール

`brew install pyqt` だとPyQt5がインストールされてしまいました。なので以下のコマンドを実行しました。

```
brew install cartr/qt4/pyqt  --with-python3
```

* 参考：http://flatcam.org/discussion#!/?pyqt
* 参考：https://robonobodojo.wordpress.com/2017/02/08/installing-pyqt4-on-mac-osx/

<img width="812" alt="スクリーンショット 2018-04-11 16.22.25.png" src="https://qiita-image-store.s3.amazonaws.com/0/94069/821f43d6-de60-b711-e2bd-063bcbe62a19.png">


`--with-python3`は必要か分かりませんが、以下のサイトを参考にしています。

* https://qiita.com/sh-o/items/61dad874e773e10af316

### Matplotlibのインストール

```
pip install matplotlib
```

### Shapelyのインストール

```
pip install shapely
```


### その後インストールしたものたち

`flatcam` をダブルクリックして実行すると、Terminalが開くので、そこで出たエラーを見ながら必要なものをインストールしました。

```
pip install simplejson
```

```
brew install spatialindex
```

```
pip install svg.path
```

## 4.3 実行

実行方法も公式サイトに記載の`python FlatCAM.py`と異なっています(FlatCAM.pyファイルがありません)。
`flatcam`フォルダの`flatcam`をダブルクリックで実行できます。

<img width="1136" alt="スクリーンショット 2018-04-11 16.40.45.png" src="https://qiita-image-store.s3.amazonaws.com/0/94069/945c2ef2-d8cd-f7ca-59e6-9260b3ae082b.png">
React NativeでiOSアプリをリリースビルドする

ほぼ公式docsの翻訳です。

## 1. App Transport Security（ATS）を有効にする
App Transport Securityは、iOS　9から導入されたセキュリティ機能で、非HTTPS通信（HTTP通信）を禁止するものです。これは、React Nativeサーバーも含む、HTTP通信がブロックされる可能性があります。React Nativeプロジェクトでは、開発をカンタンにするため、localhostに対するATSが無効化されています。 

リリースビルドに先立って、ATSを再度有効にする必要があります。iosフォルダの中のInfo.plist内のNSExceptionDomainsから、localhostのエントリを削除してください。Xcodeの中でターゲットを選択し、InfoパネルのApp Transport Security Settingsエントリを編集することでもATSを再度有効化することができます。

もしアプリ内でHTTP通信を許可する必要があれば、この記事でATSを設定する方法について学習してください。

https://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/

## 2. Release schemeを設定する

Appストアで配布するアプリをビルドするためには、Xcode内でRelease schemeを使用する必要があります。 リリース向けにビルドされたアプリは自動的にデベロッパーメニュが無効化されます。リリースされたアプリでうっかりユーザーがデベロッパーメニューを開いてしまうのを防ぎます。また、JavaScriptをローカルにバンドルするので、PCに繋がっていなくてもアプリをデバイスで実行することができます。

Release schemeを使って設定するためには、 Product → Scheme → Edit Schemeへ進んでください。

↓ここ押して出るドロップダウンの中の「Edit Scheme」をクリック
<img width="450" alt="スクリーンショット 2018-04-11 16.35.13.png" src="https://qiita-image-store.s3.amazonaws.com/0/114895/c5163c87-c6aa-d07b-aece-f22b54ec42f3.png">

サイドバーのRunタブから、Build ConfigurationドロップダウンをReleaseに変更してください。
<img width="885" alt="スクリーンショット 2018-04-11 16.40.31.png" src="https://qiita-image-store.s3.amazonaws.com/0/114895/b813f7f3-f01b-123e-c89c-4801e87afb9c.png">


## 3. static bundleを使うための設定
開発中は, ランタイムで動的にJavaScriptが読み込まれていました。リリースビルドでは、JavaScriptをあらかじめアプリ内にパッケージする必要があります。static bundleで読み込むためには、コードを変更する必要があります。

AppDelegate.m　内で、 デフォルトのjsCodeLocationをstatic buildの場所へ変更します。 


```javascript
//  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
```

これでビルドで生成される「main.jsbundle」を参照するようになります。このファイルは、デバッグビルドを含む、実機がターゲットのビルド時に生成されます。

tip省略

## 4.リリースビルド

これで、⌘Bでビルドできます。一度リリースビルドを行えば、beta testersへ配布したり、App Storeに公開することができます。
以下のCLIコマンドでもリリースビルドを実行できます。

```bash
react-native run-ios --configuration Release
```
IBM Notes にCSVを読み込ませる

# IBM Notes にCSVを読み込ませる

　[かつてはExcelがLotus 1-2-3形式をサポートしていた](https://support.office.com/ja-jp/article/%E4%BB%96%E3%81%AE%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%BD%A2%E5%BC%8F%E3%81%A7%E3%83%96%E3%83%83%E3%82%AF%E3%82%92%E4%BF%9D%E5%AD%98%E3%81%99%E3%82%8B-6a16c862-4a36-48f9-a300-c2ca0065286e#OfficeVersion=2016%E3%80%812013)のですが、サポートされなくなってから123ファイルの読み込みを使わなくなって久しいものです。
　とはいえ、Excelのような表形式ファイルを読み込みたいという需要は引き続きあるため、方法を2つほどご紹介します。
　2案とも、このCSVを対応表のように取り込むものとします。

```CSV:取り込みCSV
氏名, ふりがな, メールアドレス, 年齢
印九キー太, いんくきーた, in-quii@hogehoge.com, 18
````


【対応表】

| 要素 | フィールド名 |データタイプ|
|:-:|:-:|:-:|
|氏名|Name|テキスト|
|ふりがな|Kana|テキスト|
|メールアドレス|eMail|テキスト|
|年齢|Age|数値|


## １．表形式のテキストファイル用COLファイル（形式ファイル）を使う

　以下のようなテキストファイルを1つ作成し、hoge.colなどとして保存してください。
※個人的にはこちらが楽にできるので、この方法をお勧めします。

```COLファイル:COLファイル例1
HEADERLINE 1
; ----------------------------------------------------------------
; 列定義ステートメント
; ----------------------------------------------------------------
Name:UNTIL ",";
Kana:UNTIL ",";
eMail:TYPE Text UNTIL ",";
Age:TYPE Number UNTIL "";
```

　一番最後の項目の区切り文字が```""```（空文字列）であることは注意してください。ここを```","```としたり、何も指定しないと以下のようなエラーが出てうまく書き込めません。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/151198/51bac484-cd9e-06ac-6a95-945e922a68c5.png)

　このファイルを作ったら、次の手順でCSVファイルを読み込みます。

1. [ファイル]→[呼び出し]と選択
1. 呼び出しCSVを選択。ファイル形式は[Tabular Text] とする。
    - 先にファイル形式を[Tabular Text] とすると、拡張子csvのファイルが表示されないので注意
1. 以下スクリーンショットのように「形式ファイルの使用」にチェックを入れ、作成したCOLファイルを選択し、OKボタンを押す
 
![image.png](https://qiita-image-store.s3.amazonaws.com/0/151198/6414d9c7-8b60-c126-d813-0bed1722f486.png)




　COLファイルには@式を入れることも可能で、CSVの値を変更しつつ取り込むことも可能です。
　CSVファイルを保持しつつ、NotesDB側の取り込みの際に値を調整したい場合に有用です。
　たとえば上記の例の場合フォームが定まらないのですが、以下のように設定することで、CSVからの読み込みをしつつ、フォームを設定することが可能です。

```COLファイル:COLファイル例2
HEADERLINE 1
; ----------------------------------------------------------------
; 列定義ステートメント
; ----------------------------------------------------------------
Name:UNTIL ",";
Kana:UNTIL ",";
eMail:TYPE Text UNTIL ",";
Age:TYPE Number UNTIL "";

; ----------------------------------------------------------------
; 式
; ----------------------------------------------------------------
FORMULASTART
FIELD Form := "UserInfo";
FORMULAEND
```


　他詳しくは、以下を参照ください。

- [IBM Knowledge Center \- 表形式のテキストファイル用の COL ファイルを記述する](https://www.ibm.com/support/knowledgecenter/ja/SSVRGU_8.5.3/com.ibm.designer.domino.main.doc/H_ABOUT_WRITING_A_COL_FILE_FOR_A_TABULAR_TEXT_FILE.html)
- [\[B\-Com News 54\] Notes DB に CSV データをインポート　ほか: B\-Com News バックナンバー（No\. 51 ～ 100）: ベストコミュニケーションズ](http://www.bcom.co.jp/corp/ez3_contents.nsf/v27/D67EF5DB75C62EEF49257B1200093E9C)


## ２．LotusScriptによるアクション等の作りこみにより解決

　COLファイルによる読み込みのほうが圧倒的に楽なのですが、LotusScriptによる取り込みも可能です。
　以下ページのコードをカスタマイズすることで、取り込みが可能です。
　こちらに詳しくまとまっていて、すぐ動くサンプルコードがあるのでリンクを共有します。

- [IBM CSV ファイルから Notes 文書を作成する方法 \- Japan](http://www-01.ibm.com/support/docview.wss?uid=swg21467030)



　……早くxlsxやodsからの呼び出しができるようになるといいのですが。
Hydra用のdocker-compose.ymlでエラーが出た際の対処法

# つまづいたこと

※2017年に実験した結果の記事なので、若干古い情報である可能性があります

自作docker-compose.ymlの一部

```
version: '3'

services:
  hydra:
     image:
      - oryd/hydra:latest
```

社内の実験で自作のdocker-compose.ymlを作成して `docker-compose up` を押下すると、
以下のエラーが発生した。

```
ERROR: The Compose file './docker-compose.yml' is invalid because:
services.hydra.image contains an invalid type, it should be a string
```

`it should be a string` とあるので文字列にしなければならないというのはよくわかったが、
どうすればいいのか不明だった。

# 解決方法

以下のように修正した。

```
version: '3'

services:
  hydra:
    image: oryd/hydra:latest
```

そもそも、yamlの文法をきちんと学んでいなかったのが問題だった。
http://magazine.rubyist.net/?0009-YAML#l3
`YAML では、行頭に「-」をつけることで配列を表現します`

stringで指定しなければならないところを配列で指定していたようだ。
指定の期間の日付一覧を生成する (Presto)

## 概要
データを生成する際に、データが無くても一覧に出力してほしい要件があったので、
指定の期間の日付一覧を作成する方法を調べた内容をメモしておく。

## クエリ(日付一覧)

```SQL
SELECT
  TD_TIME_FORMAT(n, 'yyyy-MM-dd', 'JST') AS date
FROM (
  SELECT n1
  FROM (
    VALUES
      SEQUENCE(
        TD_TIME_PARSE('2018-01-01', 'JST'), 
        TD_TIME_PARSE('2018-12-31', 'JST'),
        60 * 60 * 24
      )
  ) AS x (n1)
) t1
CROSS JOIN UNNEST(n1) AS t (n)
ORDER BY
  TD_TIME_FORMAT(n, 'yyyy-MM-dd', 'JST') ASC
;
```

実行結果

```
date
2018-01-01
　　・
　　・
　　・
2018-12-31
```

## クエリ（月一覧）
※ @ebyhr さんからアドバイスをもらったクエリに変更

```SQL
SELECT
  FORMAT_DATETIME(dt, 'Y-MM') AS month
FROM (SELECT 1)
CROSS JOIN UNNEST(
  sequence(
    CAST('2018-01-01' AS date),
    CAST('2018-12-01' AS date),
    INTERVAL '1' MONTH
  )
) AS t(dt)
;
```

実行結果

```
2018-01
2018-02
2018-03
2018-04
2018-05
2018-06
2018-07
2018-08
2018-09
2018-10
2018-11
2018-12
```

終わりの日付を本日と動的にしたい場合は、「CURRENT_DATE」を使ったらいいようです。

```SQL
SELECT
  FORMAT_DATETIME(dt, 'Y-MM') AS month
FROM (SELECT 1)
CROSS JOIN UNNEST(
  sequence(
    CAST('2018-01-01' AS date),
    CURRENT_DATE,
    INTERVAL '1' MONTH
  )
) AS t(dt)
;
```


## 参考サイト
* [prestoで指定日からクエリ実行日までの日付の一覧を取得する](https://qiita.com/s-age/items/418c8ca1328854632ee2)
基本的なこと,visualstudio2012

今日したこと、前期の目標とスケジュール、評価基準、visualstudio2012の基本的な使い方を一からした。Qiitaの登録、Githubの登録をしたり目をとおした。Qiitaに授業で習った内容をなぜ書くのか
![image.png](https://qiita-image-store.s3.amazonaws.com/0/249283/408df289-7be2-b79e-73af-3e7f93e03213.png)
を鍛えるためにこういう事をして身に着ける

改めてvisualstudioを使ってみてプログラムをうってみて基礎からしっかりやらないといけないと思った。
小さい頃から理解するまとめるのが苦手なのでそこを直す
Visual Studio2012の基本的な使い方

2018/4/11水曜日
# 今日やった事はVisual Studio 2012の基本的な使い方
**開発環境**
OS : Microsoft Windows10 (64bit)
IDE : Microsoft Visual Studio 2012

# 今回C#のWPFアプリケーションを使ってみた感想

今回C#のWPFアプリケージョンを使ってみて思った事が、windowsアプリケージョンは使った事があったんですが、WPFアプリケーションを使うのが初めてで初めに出てくるウインドウ画面やプロパティが全然違うくて、言語は一緒だけど作成するプログラムの種類が変わるだけで、こんなに変わるのだと知れとても良かったです。

#　新しくプロジェクトの作成方法
**1.初めにVisual Studioにある「ファイルメニュー」から画像１の新規作成の場所を押します。**

![fail.png](https://qiita-image-store.s3.amazonaws.com/0/249265/81239eae-5bd1-7d01-b9af-8101bc226ca4.png)

**2.そして次に画像２の「プロジェクト」押します。**

![fail2.png](https://qiita-image-store.s3.amazonaws.com/0/249265/cec50598-f8e3-cb83-c3b0-7f943eb430f5.png)

**3.すると画像３のようなものが出てくるので、自分が使いたい言語と作成するプログラムの種類をクリックしOKボタンをクリックします。**

![fail3.png](https://qiita-image-store.s3.amazonaws.com/0/249265/33d3e9ea-9e44-4e56-a726-053bf0bdc826.png)


**4.するとこのような画面が表示されれば「プロジェクト」の作成が完成です。**

![fail4.png](https://qiita-image-store.s3.amazonaws.com/0/249265/9feab576-f8b7-c915-edd3-bac6db80863b.png)
visual studio2012 C#　基礎学習

#今日はvisual studio 2012の基本操作を覚える勉強をしました。

#開発環境 
OS:Microsoft windows10(64bit)　
IDE:Microsoft Visual Studio 2012

#今回の操作一覧
1.ソリューションプロジェクトの作成
2.ツールボックスの出し方
3.コードエディターの使い方
4.ファイル保存の仕方
など触ってみて体で慣れて覚えるやり方でやってみた。

#課題
最終的な課題は押したらデバックを終了するというボタン作りでした。
作ったものの画像はこちらです↓↓
![無題.png](https://qiita-image-store.s3.amazonaws.com/0/249273/0f3be61d-157d-7650-d023-e016c4837240.png)


この画像に出てあるボタンと出てあるものを押したらデバックを開始していたものが無事終了されました。

#最後に
今回したことはそんな大したことはないですが大事なことだと思います。

まだまだ不慣れですがいろいろ試して使って行きこれからも基礎を固めていこうと思います。
laravel5.4のrouteでURLのルートパラメーターの文字によって出しわける

##はじめに
URLのルートパラメーターが特定の文字だったときにこのメソッドを返したい、その他は違うメソッドを返したい、ということがありました。
今回はそのルートパラメーターは必須パラーメーターとしています。

##/routes/web.phpに書く
早速web.phpに書きます。

```web.php
Route::get('/cat/{name}/', function (Request $request, $name) {
    if($name == 'bubbles'){
        return App\Http\Controllers\catController::myCat($request);
    }else{
        return App\Http\Controllers\catController::herCat($request);
    }
});
```

ルートパラメーターの{name}が'bubbles'の文字だったときはApp\Http\Controllers\catControllerのmyCatメソッドを、その他の文字だったときはApp\Http\Controllers\catControllerの'herCat'メソッドを返すという例です。

ルートパラメーターの{name}をfunctionで$nameとして使うことができるので、その中でif文で出し分ける、ということをしています。
ECS ScheduleTaskの登録をAPI経由で行う

CloudWatchイベントのAPIを使ってECS ScheduleTaskにスケジュール登録する手順について簡単にまとめた。

下記のブログを書いた時点では理解できておらず、いつか書かないとな思っていたAPI経由でのScheduleTaskの登録手順になります。

[Amazon ECS ScheduleTaskで実現するスマートなDockerベースのバッチ実行環境](http://tech.connehito.com/entry/2017/09/13/171914)

## aws-cliを使ってScheduleTaskを登録する

### ①CloudWatchEventsにルールを登録

例)毎朝9:00(JST)に起動する「ecs-task-schedule-hogehoge」という名前のイベントを登録する。
※CloudWatchイベントの時刻はGMTなので注意

```
## イベントの登録

$ aws events put-rule --schedule-expression "cron(0 0 * * ? *)" --name ecs-task-schedule-hogehoge --description "説明"
{
    "RuleArn": "arn:aws:events:ap-northeast-1:[ID]:rule/ecs-task-schedule-hogehoge"
}
```

CloudWatchイベントが登録される。(この時点では、ターゲットが登録されていないのでECS側のScheduleTaskには何も登録されていない)

![2018-04-11-ecs1.png](https://qiita-image-store.s3.amazonaws.com/0/40850/13d8461e-2f8c-841d-d6ec-82b1770518a0.png)



### ②スケジュール登録したいクラスタのARNを取得

GUIからだとクラスタのARNを見れる場所が見当たらないのでaws-cliでclusterArnを取得する

```
## クラスタのARNを取得
$ aws ecs describe-clusters --clusters [クラスタ名]
{
    "clusters": [
        {
            "status": "ACTIVE",
            "clusterName": "クラスタ名",
            "registeredContainerInstancesCount": 0,
            "pendingTasksCount": 0,
            "runningTasksCount": 0,
            "activeServicesCount": 5,
            "clusterArn": "arn:aws:ecs:ap-northeast-1:[ID]:cluster/[クラスタ名]"
        }
    ],
    "failures": []
}

## こんな感じでjq使ってで取得すると便利
$ aws ecs describe-clusters --clusters [クラスタ名]|jq '.clusters[].clusterArn'
"arn:aws:ecs:ap-northeast-1:[ID]:cluster/クラスタ名"
```

### ③ターゲット(ECSでいうスケジュールルール)を登録する

設定内容は下記
※scheduleのdescriptionを登録出来なさそうなのが運用上は辛いかな。。（後から足すか）

|パラメータ名|意味|
|---|---|
|  rule | ①で作ったCloudWatchEventsのルール名  |
| targets.Id  | ターゲットの名前  |
| targets.Arn  |  ②で取得したターゲットに登録するECSのクラスタのARN |
|targets.RoleArn   | ecs:RunTaskが実行出来るIAMRoleのARN(GUIから作ると初回にecsEventsRoleという名前で生成される)  |
|  targets.EcsParameters.TaskDefinitionArn | このScheduleTaskで起動したいタスク(コンテナ)のタスク定義ARN  |
|targets.EcsParameters.TaskCount|一回ごとに起動するタスク数|

```
## スケジュールタスクの登録
aws events put-targets --rule "ecs-task-schedule-hogehoge" --targets "Id"="ecs-task-schedule-hogehoge","Arn"="arn:aws:ecs:ap-northeast-1:[ID]:cluster/[クラスタ名]","RoleArn"="arn:aws:iam::[ID]:role/EcsTaskCommonRole","EcsParameters"="{"TaskDefinitionArn"= "arn:aws:ecs:ap-northeast-1:[ID]:task-definition/tst-mamari-task:1","TaskCount"= 1}"

```

下記のようにECSのscheduleTaskにタスクが登録される。


![2018-04-11-ecs2.png](https://qiita-image-store.s3.amazonaws.com/0/40850/cec34d6e-3edb-8e12-2044-79f5eb80fdcb.png)


![2018-04-11-ecs3.png](https://qiita-image-store.s3.amazonaws.com/0/40850/d840a34f-d1fe-a029-da88-87fbb4c41fd5.png)


terraformの場合でも、同じように下記2つのリソースタイプを使えば実現出来そう。

[cloudwatch_event_rule](https://www.terraform.io/docs/providers/aws/r/cloudwatch_event_rule.html)
[cloudwatch_event_target](https://www.terraform.io/docs/providers/aws/r/cloudwatch_event_target.html)

## 参考
https://docs.aws.amazon.com/ja_jp/AmazonECS/latest/developerguide/scheduled_tasks_cli_tutorial.html
Angular CLIのnewコマンドが重い時は

Angularアプリの新規作成する際、[Angular CLIのnewコマンド](https://github.com/angular/angular-cli/wiki/new)を使いますが、

```
$ ng new SampleApp
```

npmによるパッケージインストールがいつまで経っても終わりません。（10分以上待っても）
しかも、ブラウジングも重くなってしまいます。

```
$ node --version
v8.10.0
$ npm --version
5.6.0
```

macOS Sierraです。

# 対策

さすがに困るので、生成時にパッケージインストールをスキップするようにしてます。

```
$ ng new SampleApp --skip-install
```

そして、yarnでパッケージインストールします。

```
$ yarn
```

yarnなら

```
Done in 85.92s.
```

でした。
うちのKPT（カイゼン諦めたらそこで試合終了ですよ）

# KPTの進め方:stopwatch:
※60分間、5、6人くらいのチーム人数を想定
（これ以上の人数での実施だと時間内に終わらないのでグループを分けた方がよい）


１．各自、K と P を考えて付箋に出す（他の人の意見に左右されないように相談しながら出すようなことはしないようにする）
（5分間）

２．出た K を読み上げて共有する（具体的にどういうことがよかったのかを確認し合う）、ホワイトボードに張り出して、同じような内容は纏める
（10分間）

３．出た P を読み上げて共有する、ホワイトボードに張り出して同じような内容は付箋を重ねて纏める、P の優先順位を決める
（10分間）

４．出た P に対して T をみんなで考える
たくさん P が出た場合は、優先度の高いものだけ　T を考えるようにして時間内に終わる工夫をすると良い
　　（特に初めたばかりの頃は P がたくさん出る）
（15分間）

５．前回の T が実行できているか振り返る
　　T が習慣的に実行できるようであれば K に移すなり、課題が解決したということで剥がす
　　T が実行できていなければ、別の T を考えてみる、ハードルを下げてみたりしてもよい
　　また、そもそも P が間違っていたというパターンがある、問題の根本が何かを改めて考えてみる
（10分間）

６．実施する T を選択し、誰がいつまでにやるのか合意を取る
（10分間）

# KPT（Keep/Problem/Try）:label:
■Keep（よかったこと、継続したいこと）
Keep はよかったこと、継続したいことを書き出したりしますが、
誰かへの感謝を伝えてみるとか、褒めてもらいたいことをあげてみたりしてもいいかもしれません。
自分が褒めて欲しいことをあげてもオッケーです:ok_hand_tone2:

- ○○さんがファインプレーな仕事をしてくれた
- 担当タスクが遅延して○○さんに巻き取ってもらった、など

■Problem（問題点、課題、困っていること、不満に思っていることなど）
Problem は、できるだけ小さい問題に落とし込むようにして解決したい問題を明確にできるような内容が望ましいです。
そのような内容にしておくと Try が出しやすくなります。

■Try（Problemに対して改善していくこと、Keepに対してさらなる改善していくこと）
Try は、ハードルが高過ぎるような改善策だと行動に移せず終わってしまうことが多いので、
出来るだけ簡単にできる Try を設定するのが望ましいです。

# グラウンドルール:baseball:
- 個人攻撃になるような P はNG
- 一人がしゃべり過ぎない
    - 1人が喋り過ぎると、意見に偏りが生じるため1人が喋り過ぎないようにする
- どんなことでも発言をすること歓迎する（心理的安全の確保）
- 原因は追究しても OK だが責任の追及はしてはならない
- 上げられた P は自分事として T を出す
    - 問題は、チームの問題として捉える。（個人の問題ではなく仕組みに問題があると考える）
- KPTの時間に集中して欲しいのでノートPCの持ち込みは禁止

# ファシリテータの極意:lifter_tone1:
KPTの進行役を担う。
ファシリテータがうまく、メンバのKPTを引き出すことが出来ないと、メンバがKPTの成果を実感できない。
結果的に、あんまりやる意味ないよねとなり、継続しなくなる一因ともなり得る。
以下に私なりのコツを書き出すので、ご参考にどうぞ。

- 特定の人だけが発言し過ぎない
    - 特定の人の意見に偏ってしまう恐れがありチームでの解決に繋がっていない可能性がある
    - いい意見があるのに、いつも発言する人の話が終るまで様子見をしていて、次のPに移ってしまい結局、言えない
    - ファシリテータは発言に偏りが出ないようにまんべんなく話を振ってあげる（○○さんはどう思う？）
- メンバーの気持ちを理解してあげる
- とにかく良い意見、発言を引き出すには心理的安全を確保してあげることが大事
    - 出した意見（Try）に乗っかってみる
    - 否定から入ってしまうと、発言する勇気を失ってしまう
    - いい意見だね、なるほど、おもしろいねなどの発言から入って、そのTryだとこういう問題が起こりそうだけど、どう解決しようか？と問題を更に深掘りしてみたりする
- 具体的ではない Problem があげれる場合があり、適切な Try が出しにくい状況があるので具体的にする
    - 具体的にどういう問題なのか聞いてみると複数の問題が出てきたりするので、Problem を分解する（付箋を追加する）
    - どういう問題なのか分かりにくい場合は内容を書き換えたり、補足説明を追記する
- 何が問題なのかを常に意識してファシリテートする（問題の主語を明確するとよいかも）
- ある程度、ファシリテーターが独断的進めてよい
    - チームで問題に取り組むツールではあるが、ある程度、ファシリテーターが独断的に実行する Try を決定したり、Keep を剥がして整理して行くことも必要
    - メンバの総意をイチイチ求めると時間がかかり過ぎるし、収拾がつかなくなる
    - 仮に選択した Try が上手く行かなかったら、また別の Try をすればいいだけ
    - 習慣化できたと思ってた Keep が出来てなかったらまた、Problem として上がってくるはず

ファシリテーションが出来る人を増やすためにもファシリテータを持ち回り制で実施することをオススメします。

# KPTをやると何が嬉しいのか？:angel_tone2:
- Try が消化できると、小さな成功体験を実感できるので、メンバの自信に繋がる
- 基本的に小さな問題を少しずつ改善していくものなので、改善を実行に移しやすい
- 自立したチームになれる可能性がある
- 他人事だった問題が自分毎の問題として捉えられるようになりチームの結束が高まる
- K からメンバ、リーダー相互の価値観を共有しあえる
- P からリーダーの問題意識、メンバの問題意識が共有できる（こんなこと考えてるんだ～と感じることもチラホラ）
- ひとりで悩んでても解決できない P を共有することでチームで解決できる（ようになるかもしれない）
- 思考停止しない人になれる、問題に対して常に次の Try を考えるため継続的に行えばいい思考訓練になる

# 付箋について（おまけ）:relaxed:
- 左上に、K or P or T を書く
- 右上に、日付を入れる
- 右下に、名前をいれる
- 付箋を新しく剥がすときはノリに沿って剥がす
- Keepを青の付箋、Problemをピンクの付箋、Tryを緑の付箋と種類によって色分けすると見やすくなる

他にもいろいろ続きは随時更新していきます。
dpdk-devbindでOSError: [Errno 2] No such file or directoryが出た場合の対処

## 環境

- CentOS7 (VMゲスト側)をminimalで入れた

## 対処

`pciutils` を入れればOKだった．

```
sudo yum install pciutils
```

やっぱminimal構成何も入ってないんやな〜

## 参考

http://dpdk.org/ml/archives/users/2017-March/001682.html
初めて触れたC# 

#はじめに
---
専門学校でプログラム言語(C,javascript,php,VisualBasic等)を学んで一年経ち
今年から違うプログラム言語でのプログラミングを学ぶことになりました。
今日少し触れた**C#**に関して自分が感じたことを書いていきます！
#開発環境
---
`Microsoft windows10(64bit)`
`VisualStudio2012(professional)`
#触った感想
---
VBによく似ている！

C#とはどんな文法があるのか調べてみました！![ss.png](https://qiita-image-store.s3.amazonaws.com/0/249281/999f0cfe-1682-0d87-e07a-84728deb54a0.png)

画像の引用元↓
(https://dobon.net/vb/dotnet/form/msgbox.html)
('ω')……うん…？
もう見た感じだけだと凄く似ていると感じました。
（~~もしかしたらオブジェクト指向のものはみんなこんな感じなのかな？~~）
VBとC#の違いもしっかり理解しないと( ;∀;)
VBとの違いは何なんだ？と疑問に思った方は後々投稿するのでそれができるまで
待っていてください(´・ω・｀)
#まとめ
---
やっぱり私の中ではVBと似ているのがすごく印象的ですね。
また、C#は現在色々な企業が使っている言語なので、使えるようになっていると就職した後少し楽ができるのではないか？と感じますね（~~使われていない会社も普通にあります~~）
他にもjava言語とも文法が似ているので非常に触れやすい言語とも感じました。
#最後に
---
今日の授業で作った簡単なソースコード

```csharp:first.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace Sales
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
       
        public MainWindow()
        {
            InitializeComponent();
        }
        //ボタンクリックでイベント発生
        private void Button_Click_1(object sender, RoutedEventArgs e)
        {
            //メッセージボックスを出力する
              MessageBox.Show("お使いのパソコンは正常ではありません", 
                "DANGER!!",
            MessageBoxButton.OK, MessageBoxImage.Error
            );
            //メッセージボックスを閉じた後指定のアドレスにジャンプする
                System.Diagnostics.Process.Start("http://www.google.com");
            Close();
        }
    }
}
```

簡単ないつ使うか分からない指定先アドレスに飛ばすプログラムをＣ＃で書きました（笑）
Microsoft Visual StudioでのC#の開発環境の初期設定

# Microsoft Visual Studio 2012 C#の開発の初期設定の方法

####1.Microsoft Visual Studio 2012を立ち上げます。

2.新しいプロジェクトを選択します。
![タイトルなし.png](https://qiita-image-store.s3.amazonaws.com/0/249333/964e7ec0-77e8-69f1-f7b7-417cba5682ff.png)

3.初期設定ではC++になっていると思うので他の言語からC#を選びます。
![タイトルなし2.png](https://qiita-image-store.s3.amazonaws.com/0/249333/eb5b559a-3d36-3bfd-efe8-8fa055ad9579.png)
![タイトルなし1.png](https://qiita-image-store.s3.amazonaws.com/0/249333/823ae9cc-6b13-d5ab-0e73-73e910229722.png)

4.次にWPFアプリケーションを選択してOKボタン又はWPFアプリケーションという欄をダブルクリックしてください。
この時、下の名前を変更したい場合はOKボタン又はダブルクリックする前に名前を変更してください。

名前を変更した場合ソリューション名も名前と同じように変更されますが問題ありません、仕様です。
![タイトルなし3.png](https://qiita-image-store.s3.amazonaws.com/0/249333/bbbab2d6-5f0c-102a-3ada-62f591a150e6.png)

5.これでひとまず初期設定は完了です。
![タイトルなし4.png](https://qiita-image-store.s3.amazonaws.com/0/249333/f21f2fb3-fb27-6965-da0d-d7af71c62459.png)

#####・次回は簡単なVisual Studioの使い方の説明に入ります。
jQueryなどを読み込む時に困った話〜httpとhttpsと省略〜

# 自分のホームページでjQueryを読み込もうとしたらエラーがでた。

普通にjQueryを読み込もうとしました。

```
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
```

これだと、ローカルでは普通に動くんですが、サーバーに上げてみるとjQueryが読み込まれていない！コンソールを開いてみたら

```
Mixed Content: The page at 'https://XXX/index.html' was loaded over HTTPS, 
but requested an insecure script 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js'. 
This request has been blocked; the content must be served over HTTPS.
```

と怒られてしまいました。
要は何を言っているかというと、**「このページは暗号化された安全なhttpsなのにさ、jQueryを外部のhttpのサイトから読み込むの？それはダメ！httpsにしてくれ！」**ってことらしいです。

ちょっと調べてみたところ、「http」「https」は省略できるらしい。

# 「https」を省略したみたけど…
こんなことを防ぐために、こうやって書けるらしいことがわかりました。

```
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
```
こうすると、そのページを
httpで開いている→jQueryのサイトにhttpでアクセス
httpsで開いている→jQueryのサイトにhttpsでアクセス
という風に自動で割り振ってくれるんです！
これで一件落着と思ったんですが…

# 省略するとローカルで動かん！！
そうなんです。当たり前ですけどローカルで動かしてる分には「ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js」って何？って話な訳ですから、jQueryが動きません。
しかもhttpsなどの省略はgoogle的には非推奨とのこと。詳しいことはわかりませんが、とにかくローカルで動かないのは不便ですよね。

# 結論：httpsを使おう
そうです。最初からhttpsを使用すれば全てが丸く収まります。表にしてみるとこんな感じ

||ローカル|サーバー|
|:--:|:--:|:--:|
|http|○|×|
|省略|×|○|
|https|○|○|

なのでgoogleさんも奨励しているhttpsを使っていくことにしました。
Visual Studio2012の基本的な使い方

C#の勉強のため、授業で教えてもらった事の自分用のメモとして使います。
※添付している画像は全てスクリーンショットとペイントで編集しました。


#ソリューション、プロジェクトの作成

![setumei.png](https://qiita-image-store.s3.amazonaws.com/0/249280/11ca7f9e-12b3-112b-00dd-eb99b10c856f.png)

①ファイルを選択
②新規作成を選択
③プロジェクトを選択
※新規に作成する場合、Visual Studio 2012を起動してすぐのスタートページにある開始から、新しいプロジェクトでも作成できる。

![setumei3.png](https://qiita-image-store.s3.amazonaws.com/0/249280/132e0fd5-a364-afb7-509b-34d13a669cd2.png)

1.Visual C#を選択
　Visual C#を選んだ理由は自分がこれから練習するため。
　別の言語を勉強する際は、勉強する言語を選択する。
2.WPFアプリケーションを選択
　自分のC#の勉強の時はこちらを使う。
3.OKを選択
　これで、ソリューションが作成される。
※画面下の名前ボックスは自分のわかりやすい名前をつける。(ソリューションにも自動的に入力される)
※場所は、わかりやすいデスクトップ等にしておく。
※ソリューションのディレクトリを作成のチェックボックスがオンになっていることを確認。

#ツールボックスの使い方
###ツールボックスの表示方法
　Visual Studioを起動した際にツールボックスが表示されない場合があるため、その時の表示方法。
![setumei4.png](https://qiita-image-store.s3.amazonaws.com/0/249280/4195c02f-b662-ebe4-11f8-5256f9d8fd63.png)
①表示を選択
②ツールボックスを選択

![tool.png](https://qiita-image-store.s3.amazonaws.com/0/249280/2999b80c-8631-9d38-66e6-c321a3d8689f.png)
　これで、ツールボックスが表示される。

###コントロールの配置
![Control.png](https://qiita-image-store.s3.amazonaws.com/0/249280/2dbcf867-afc7-49a0-6527-afdfa50ff0e3.png)
①コモンWPFコントロールを選択
②Buttonを選択
　今回はボタンを使う。
③WPFウィンドウを選択
※Buttonをクリックしたまま、ドラッグアンドドロップでもできる。

![Control2.png](https://qiita-image-store.s3.amazonaws.com/0/249280/99679e1a-c543-2f75-7ec5-e9936d48b805.png)

---
長くなるので今回はここまで
次に続きます。
【Raspberry Pi 3 Model B】男ひとり酒を飲みながらラズパイと会話したい（第１回）

##概要
docomoのAPIや、Open JTalk等を組み合わせれば、ラズパイと会話ができそうなので作ってみました。
第１回はOpen JTalkのインストールです。

##参考サイト

- [Raspberry piで日本語音声合成(Open JTalk)を試してみる。](https://qiita.com/lutecia16v/items/8d220885082e40ace252)

##前提条件

- モデル : Raspberry Pi 3 Model B
- OS : Raspbian Stretch
- マイク（USB）
- スピーカー（アナログ）

```Bash:
$ uname -a
Linux raspberrypi 4.14.30-v7+ #1102 SMP Mon Mar 26 16:45:49 BST 2018 armv7l GNU/Linux
```

##事前準備
とりあえずのお約束作業です。

```Bash:
$ sudo apt-get update
$ sudo apt-get upgrade
```

##Open JTalkのインストールから動作確認
今回は参考サイト通りなのでサクッといきます。スピーカーの設定は不要でしたのでとばします（なお、[参考サイト](https://qiita.com/lutecia16v/items/8d220885082e40ace252)には丁寧に記載してあります）。

```Bash:
$ sudo apt-get install open-jtalk
$ sudo apt-get install open-jtalk-mecab-naist-jdic hts-voice-nitech-jp-atr503-m001

$ mkdir ~/open-jtalk
$ cd open-jtalk

$ vi test_voice.txt 
こんにちは

$ open_jtalk -m /usr/share/hts-voice/nitech-jp-atr503-m001/nitech_jp_atr503_m001.htsvoice -x /var/lib/mecab/dic/open-jtalk/naist-jdic -ow test_voice.wav test_voice.txt
$ aplay test_voice.wav
```
おっさんがしゃべれば成功です！

##女性の声のほうがいいよね
ということで、meiちゃんの声をインストール。コマンドでダウンロードするのでバージョン、ファイル名等は[http://www.mmdagent.jp/](http://www.mmdagent.jp/)で確認してください。

```Bash:
$ wget https://sourceforge.net/projects/mmdagent/files/MMDAgent_Example/MMDAgent_Example-1.7/MMDAgent_Example-1.7.zip
$ unzip MMDAgent_Example-1.7.zip
$ sudo cp -R ./MMDAgent_Example-1.7/Voice/mei /usr/share/hts-voice/

$ open_jtalk -m /usr/share/hts-voice/mei/mei_normal.htsvoice -x /var/lib/mecab/dic/open-jtalk/naist-jdic -ow test_voice.wav test_voice.txt 
$ aplay test_voice.wav
```
meiちゃんがしゃべれば成功です！
また、「openjtalk」「音響モデル」あたりでググれば他の声も入手できそうです。

##スクリプト作成
これも参考サイトほぼそのものですが、単体で動かす場合はスクリプトにしておくと楽です。男性と女性を作成しました。

```Bash:jtalk_m.sh（男性）
#!/bin/sh
TMP=/tmp/jtalk_m.wav
echo "$1" | open_jtalk \
-m /usr/share/hts-voice/nitech-jp-atr503-m001/nitech_jp_atr503_m001.htsvoice \
-x /var/lib/mecab/dic/open-jtalk/naist-jdic \
-ow $TMP && \
aplay --quiet $TMP
rm -f $TMP
```

```Bash:jtalk_f.sh（女性）
#!/bin/sh
TMP=/tmp/jtalk_f.wav
echo "$1" | open_jtalk \
-m /usr/share/hts-voice/mei/mei_normal.htsvoice \
-x /var/lib/mecab/dic/open-jtalk/naist-jdic \
-ow $TMP && \
aplay --quiet $TMP
rm -f $TMP
```

```Bash:動作確認
$ chmod +x jtalk_*.sh
$ ./jtalk_m.sh こんにちは
$ ./jtalk_f.sh こんにちは
```

##まとめ
今回はラズパイをしゃべらせることができたので、次回は、自分のしゃべった言葉をラズパイに認識させたいと思います。

##記事

[【Raspberry Pi 3 Model B】男ひとり酒を飲みながらラズパイと会話したい（第１回）]
(https://qiita.com/sunaga70/items/acbfa107ae9221529115)
[【Raspberry Pi 3 Model B】男ひとり酒を飲みながらラズパイと会話したい（第２回）]
(https://qiita.com/sunaga70/items/aed3da33fb6ba453c422)
[【Raspberry Pi 3 Model B】男ひとり酒を飲みながらラズパイと会話したい（第３回）]
(https://qiita.com/sunaga70/items/f83dac93ac2b9ef217dd)
[【Raspberry Pi 3 Model B】男ひとり酒を飲みながらラズパイと会話したい（第４回）]
(https://qiita.com/sunaga70/items/f636edc396a7b5100a7a)
ライブラリ不要！とにかく画面中央に表示させるマークアップ

以下を参考に、最小限のマークアップで画面中央揃えを実現できました。

- [flexboxで上下左右中央揃え - Qiita](https://qiita.com/junara/items/5089b9f3fac28693a233)

- [&quot;height: 100%&quot; の要素が画面の高さ100%にならない場合の対応方法 - Qiita](https://qiita.com/shouchida/items/205fed63b886681661bd)


> ![justcenter.gif](https://qiita-image-store.s3.amazonaws.com/0/2883/13248eb2-fd34-9922-0030-acac5d15732e.gif)


```css
<style>
html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0;
}

.Aligner {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 100%;
}
</style>
```

```html
<div class="Aligner">
    <img src="UKRrZMi.gif" width="128px">
</div>
```

- gif：[LGTM.in » kcLgRb11q](https://www.lgtm.in/i/kcLgRb11q)
今時のreact reduxの書き方 

#今時のreact reduxの書き方 

ES2019(tc39/stage 3)からclass fieldsが実装される予定です
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/Class_fields

これを使用することでconstructorの記述を省略できたりすることが可能です
ただまだstage 3の段階なのでbabelなどを通して使用する必要があります

そもそもreactを使用する際のconstructorの意味について知りたい方は下記を参考にしてください
参考リンク
・[なぜ私たちは super(props) を書くの?](https://qiita.com/hand-dot/items/61a4b808f110b12e4281)
・[Private Class Field の導入に伴う JS の構文拡張](https://blog.jxck.io/entries/2019-03-14/private-class-field.html)



## constructorいらなくね？

```jsx:old

export default class Hello extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      message: "Hello!!"
    }
  }
```

```jsx:new

export default class Hello extends React.Component {
  state = {
    message: "Hello!!"
  }

```


## clickイベントはbindしない

```jsx:old

export default class Hello extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      count: 0
    }
    this.increment = this.increment.bind(this);
  }
  increment() {
    this.setState({ count: this.state.count + 1 });
  }
  render() {
    return (
      <div onClick={this.increment}>count:{this.state.count}</div>
    );
  }
}

```

```jsx:new

export default class Hello extends React.Component {
  state = {
    count: 0
  }
  increment = () => this.setState({ count: this.state.count + 1 });
  render() {
    return (
      <div onClick={this.increment}>count:{this.state.count}</div>
    );
  }
}
```




##mapStateToPropsとかmapDispatchToPropsとかは省略していく

```js:old_container

import React from 'react'
import { connect } from 'react-redux'
import Hello from 'components/Hello'
import { increment } from 'actions/increment'

function mapStateToProps(state) {
  return {
      count: state.increment.count,
      text: state.increment.text
  };
}

function mapDispatchToProps(dispatch) {
  return {
    increment: (text) => { dispatch(increment(text)) }
  }
}

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Hello)
```

```js:new_container
import React from 'react'
import { connect } from 'react-redux'
import Hello from 'components/Hello'
import { increment } from 'actions/increment'

export default connect(
  state => ({
    count: state.increment.count,
    text: state.increment.text
  }),
  { increment }
)(Hello)
```

自分がreact触り始めてから2年になるのかな？
ちょっとずつ昔と色々変わってきてるんだなぁ〜
最近はボイラプレートを眺めて色々自分のリポジトリで試している感じです

この書き方おかしくね？とか、最近はこんな感じで書くとイケてるよってのがあれば教えて欲しいっす！
bootstrapの導入(gem)

# bootstrap
## 1,gemに記述する
```ruby:Gemfile
  gem 'bootstrap-sass'
  gem 'jquery-rails'
```

```sh
$ bundle inatall
```

## 2,ファイル名(拡張子)を変更する

 ```sh
$ cd app/assets/stylesheets
$ rename application.css application.scss
```

*直接の変更でも可能

## 3,二つのファイルに記述を追加

```scss:app/assets/stylesheets/application.scss
*= require_tree .
    *= require_self
    */
    @import "bootstrap-sprockets";  /*ここを追加*/
    @import "bootstrap";            /*ここを追加*/

```

```js:app/assets/javascripts/application.js
//= require rails-ujs
  //= require turbolinks
  //= require jquery
  //= require bootstrap-sprockets
  //= require_tree .
```


##　リンク
[Bootstrap日本語リファレンス](http://bootstrap3.cyberlab.info/)
vanillaJSでフラッシュメッセージを表示

Vanilla.JSでFadeIn/Outをするサンプルです。
> ![flash.gif](https://qiita-image-store.s3.amazonaws.com/0/2883/67bd5e9c-5a11-46a5-bc4e-556b847f5521.gif)



出典：[Fade in - Fade out with JavaScript | Chris Buttery](http://www.chrisbuttery.com/articles/fade-in-fade-out-with-javascript/)

```js
// flash message
function flash(el, out) {
    fadeIn(el, "inline-block");
    setTimeout(function () {
        fadeOut(el);
    }, out);
}
// fade out
function fadeOut(el) {
    el.style.opacity = 1;

    (function fade() {
        if ((el.style.opacity -= .1) < 0) {
            el.style.display = "none";
        } else {
            requestAnimationFrame(fade);
        }
    })();
}
// fade in
function fadeIn(el, display) {
    el.style.opacity = 0;
    el.style.display = display || "block";

    (function fade() {
        var val = parseFloat(el.style.opacity);
        if (!((val += .1) > 1)) {
            el.style.opacity = val;
            requestAnimationFrame(fade);
        }
    })();
}
```

```html
<button onclick="flash(document.querySelector('#notify'), 1500)" type="button">Flash!</button>
<div style="display:none" id="notify">フラッシュ！</div>
```
部分テンプレート

# 部分テンプレート
## 使い方
### 1,テンプレートファイルの記述
任意のファイルに`_????.html.erb`ファイルを作成し、コードをかく

### 2,表示を宣言
表示させたい任意のファイルの中に

```
 <%= render '!!!!/????', (変数名): (入れたい変数名,オブジェクト) %>
``` 

## 使用例
* practiceファイルを作成
* practiceファイル内にテンプレートファイル`_pre.html.erb`を作成
* practiceファイル内の`prefile.html.erb`内に`_pre.html.erb`を表示

###
```erb:practice/_pre.html.erb
  <h1> <%= title %> </h>
```

```practice/prefile.html.erb
  <%= render 'practice/pre', title: "ハリネズミカフェ" %>
```

生成されるコードは

```html
<h1> ハリネズミカフェ </h1>
```
React Native アプリの Xcode プロジェクトに Build Configuration を追加する

React Native を使った iOS アプリの Xcode プロジェクトに Build Configuration を追加するとビルドが通らなくて苦戦したので、解消手順を記録しておきます。
執筆時点での React Native のバージョンは `0.55.1` です。

## 手順
### 1. Build Configuration の追加
プロジェクトの設定から `Staging` という名前の Build Configuration を追加します。

<img src="https://user-images.githubusercontent.com/1413408/38598431-49fd4ba4-3d97-11e8-90ea-eb0736b8b655.png" width="512"/>

### 2. Build Scheme の追加
`Staging` という Build Scheme を追加して Run で使う Build Configuration に先ほど作った `Staging` を指定します。

### 3. ビルドの失敗
`Staging` スキームを選択した状態でプロジェクトをビルドするとエラーが出てしまいます。エラーの内容を見ても原因がよくわかりません。以降でこの解消のためにやった手順を紹介します。

<img src="https://user-images.githubusercontent.com/1413408/38598802-e0651b02-3d98-11e8-9bee-b570b545fc63.png" width="512"/>

### 4. Target Dependencies に React を追加
Build Phases の Target Dependencies の + から React を追加します。

<img src="https://user-images.githubusercontent.com/1413408/38598433-4a44853c-3d97-11e8-8aed-ba65fa1ff4c3.png" width="512"/>

### 5. Header Search Paths の追加
アプリケーションのターゲットとテストターゲットの両方について、Build Settings の Header Search Paths の `Staging` の欄に `$(BUILD_DIR)/Release-$(PLATFORM_NAME)/include` を設定します。

<img src="https://user-images.githubusercontent.com/1413408/38598435-4a8a766e-3d97-11e8-8fdb-b0dab8ffad8c.png" width="512"/>

<img src="https://user-images.githubusercontent.com/1413408/38598434-4a683bbc-3d97-11e8-96a1-5a999f6b8a06.png" width="512"/>

### 6. ビルドの成功
やった〜〜〜

<img src="https://user-images.githubusercontent.com/1413408/38599208-73b98590-3d9a-11e8-9c02-f8e2f698ec8c.png" width="512"/>

## 余談
Build Phases で実行されている `react-native-xcode.sh` を見ると Build Configuration の名前に "Debug" という文字列が含まれていると JS バンドルがアプリに組み込まれない(React Native サーバーから読み込む)ようになっていて、また `__DEV__ == true` となる development モードでバンドルが作られるので、Build Configuration の命名には気をつけましょう。"なんとかDebug" のような名前にしていても `FORCE_BUNDLING` という環境変数を設定しておくとバンドルが組み込まれます。

https://github.com/facebook/react-native/blob/8aa568e867bbbe7e23ded3651f23581ff2753323/scripts/react-native-xcode.sh#L19-L32

## 参考
https://github.com/facebook/react-native/issues/11813#issuecomment-273279257
AWS CLI で Amazon ECS のタスクを実行する (第１回)

AWS CLI を使って AWS ECS でタスクを実行するために必要なコマンドをまとめます。
この記事を読むためには AWS EC2、AWS S3 および docker に対する基本的な知識が必要です。
サービス、メトリクス、タスクのスケジューリングについては記載しません。

前記事：[AWS CLI で AWS batch にジョブを送信する (全３回)](https://qiita.com/aokad/items/f28ffa5ae984678817f6)とリンクしていますが、未読でも問題なく読めるように記載したつもりです。

参考：[EC2 タスクを使用した AWS CLI のウォークスルー](https://docs.aws.amazon.com/ja_jp/AmazonECS/latest/developerguide/ECS_AWSCLI_EC2.html)

## 目次

全４回です。

1. はじめに                                    ← イマココ
2. [タスクを実行してみる](https://qiita.com/aokad/items/afe568d57605ad3d6d4b)
3. [一連の流れをスクリプト化する](https://qiita.com/aokad/items/0eacf96fcb2378c7a36c)
4. [汎用 docker イメージを使用する](https://qiita.com/aokad/items/0e6a22082122cebc30bb)

## Amazon Elastic Container Service (Amazon ECS) とは

正確な情報は[Amazon 公式ドキュメント](https://docs.aws.amazon.com/ja_jp/AmazonECS/latest/developerguide/Welcome.html)を参照してください。

Amazon Elastic Container Service (Amazon ECS) は、Docker コンテナの定義、実行、停止を管理するためのサービスです。
AWS Batch がジョブの実行に特化しているのに比べて Amazon ECS はコンテナ管理に特化していると言えます。

## この記事で実現しようとしていること

以下のようなバッチジョブ実行システムを作ろうとしています。

 - 元画像（入力データ）は複数あり、AWS S3 に置いてあります。
 - 入力データをいろいろな種類の画像処理システムで加工して AWS S3 に出力します。
 - 処理システムは EC2 インスタンス上の docker コンテナを想定しています。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/226829/50686065-faf3-541b-4847-1fbd8652db3c.png)

バッチジョブ実行システムについて、こちらに記載しました。[バッチジョブ実行システム](https://qiita.com/aokad/items/f28ffa5ae984678817f6#%E3%83%90%E3%83%83%E3%83%81%E3%82%B8%E3%83%A7%E3%83%96%E5%AE%9F%E8%A1%8C%E3%82%B7%E3%82%B9%E3%83%86%E3%83%A0)

また、今回は１つのタスク（オレンジの線１本分）に対して、インスタンスを１つ作成します。
あらかじめ大きなインスタンスを作成しておいて、複数のタスクを投入することも考えられますが、ここでは必要なスペックのインスタンスをタスクごとに用意してタスクが終了したらさっさと削除する仕様にします。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/226829/f8fe5657-0a3a-e121-701f-969778307ceb.png)

## Amazon ECS の構成要素

Amazon ECS は以下３つの要素から構成されます。簡単に説明します。

 - タスク ... 実際の作業単位。タスク定義に基づいて作成され、クラスターに投入される。
 - タスク定義 ... タスクの実行環境を定義したもの。例えば、docker イメージや実行に必要な vcpus, memory を定義する。
 - クラスター ... タスクを実行するために１つ以上作成する EC2 インスタンスの定義。

## AWS batch でなく Amazon ECS を使用する意味

※ 2018 年 3 月時点の情報です。最新版では更新されている可能性があります。

記事の最初でも書きましたが、AWS の構想としてはタスク（ジョブ）の実行には AWS Batch が向いていそうです。
私があえて Amazon ECS を使おうと思った理由は以下２点です。
Amazon ECS ではできるけれど、AWS Batch ではできないこととも言えます。

 1. 大きなファイルサイズのデータを扱うため、docker コンテナのストレージを増やしたい
 2. EC2 インスタンスの起動終了のタイミングを自分で指定したい

---

実際の AWS CLI コマンドは次回、[タスクを実行してみる](https://qiita.com/aokad/items/afe568d57605ad3d6d4b) で解説します。
EthereumのPopulusでImportError: cannot import name 'force_text'が出たときの対処法

# 環境
populus 2.2.0

# 現象
Populusでコンパイルしようとしたときに下記のようなエラーが出たとき

```
    from eth_utils import (
ImportError: cannot import name 'force_text'
```

```
    from eth_utils.curried import (
ModuleNotFoundError: No module named 'eth_utils.curried'
```

# 対処法
`pip install eth-utils==0.8.1 web3==3.16.5`

# 参考
https://github.com/ethereum/populus/issues/450#issuecomment-379576463
laravel5.4で定数を定義してbladeで表示する

##定数を定義

- /config/const.phpに定義

```const.php
return array(
    'constOne'=> '定数一',
    'constTwo'=> '定数二',
);
```

##bladeで表示

- {{Config::get('const.constOne')}}で表示

```sample.blade.php
<p>{{Config::get('const.constOne')}}</p>
<p>{{Config::get('const.constTwo')}}</p>
```
これで、一つ目のpタグには「定数一」、二つ目のpタグには「定数二」と表示されます。