OmniAICreator/Qiita-1.07M huggingface dataset:
opencv.jsの作法 その7

# 概要

opencv.jsの作法を調べてみた。

# 実行環境

sandboxを用意した。以下のコードは動く。
http://jsdo.it/ohisama1/Ugtn

# 写真


![image.png](https://qiita-image-store.s3.amazonaws.com/0/18104/766e7b3f-3c8b-ca19-fbdb-ab706e9119a0.png)

# 習作　ミニチュア風写真

```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	let cpy = new cv.Mat();
	let masked = new cv.Mat();
	cv.cvtColor(src, dst, cv.COLOR_RGB2HSV)
	for (let i = 0; i < dst.rows * dst.cols * 3; i += 3)
	{
		dst.data[i + 1] *= 1.5;
	}
	cv.cvtColor(dst, dst, cv.COLOR_HSV2RGB)
	cv.cvtColor(src, src, cv.COLOR_RGBA2RGB, 0);
	cv.bilateralFilter(src, cpy, 9, 75, 75, cv.BORDER_DEFAULT);
	let color = new cv.Scalar(255, 255, 255);
	let point0 = new cv.Point(445, 0);
	let point1 = new cv.Point(0, 200);
	let point2 = new cv.Point(445, 290);
	let point3 = new cv.Point(0, 199);
	cv.rectangle(cpy, point1, point2, color, cv.FILLED);
	cv.rectangle(dst, point0, point3, color, cv.FILLED);
	cv.bitwise_and(cpy, dst, masked)
	cv.imshow('canvasOutput', masked);
	dst.delete();
	cpy.delete();
	masked.delete();

```

以上。
LookingGlassのパラメータをunityのインスペクターから変える方法(HoloPlayerSDK0.1.4まで)

#SDKバージョン
・0.0.7か0.1.4対象です。
・1.0.0はイジれる項目がガッツリ減りました。

#経緯
・とある使い方のためLookingGlassのパラメータをコードでいじる方法が紹介されていた
・インスペクターからいじれるんだけどなぁ…ってモヤモヤした。

#やりかた
1.HoloPlayerCaptureを選択
2.インスペクターをデバッグに切り替え
3.QuiltコンポーネントのConfigを開く
4.各パラメータいじり放題！！（パラメータによっては描画が崩れます）
![image.png](https://qiita-image-store.s3.amazonaws.com/0/58641/e00be764-3eae-fd1a-2f68-d849ae86327e.png)
opencv.jsの作法 その6

# 概要

opencv.jsの作法を調べてみた。

# 実行環境

sandboxを用意した。以下のコードは動く。
http://jsdo.it/ohisama1/mU6l

# 写真

![image.png](https://qiita-image-store.s3.amazonaws.com/0/18104/a2835dad-020d-86e8-9a1b-47b886766885.png)

# 習作　いい感じのボケ

```javascript
let src = cv.imread('canvasInput');
let dst = new cv.Mat();
let kernel = cv.matFromArray(1, 21, cv.CV_32FC1, [2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]);
cv.normalize(kernel, kernel, 0, 0.1, cv.NORM_MINMAX);
let anchor = new cv.Point(-1, -1);
cv.filter2D(src, dst, cv.CV_8U, kernel, anchor, 0, cv.BORDER_DEFAULT);
cv.imshow('canvasOutput', dst);
src.delete();
dst.delete();
kernel.delete();
```

以上。
DMSでAurora(MySQL)にデータ連携した時に文字コードをUTF8にする

しょーもない話です。すみません。
小さなことも上げておくことにしたでござる。

### 経緯
同僚から「AWS RDS(Oracle)からAurora(MySQL)にDMSでデータ連携したい」と相談を受けたので、~~ggrksと即答~~DMS設定方法を教えて設定したものの、Auroraで文字化けしてしまったので、その時に対処した方法を書きます。

### 前提
前提として決まっていたこと。

- DMS
    - ソース：RDS(Oracle)
        - 我々の管轄内のインスタンス
    - ターゲット：Aurora(MySQL)
        - データ連携用のデータベースにする
        - 我々の管理外のインスタンスなので、我々は設定などの内部情報を持っていない
- 対象データ(レコード)には日本語が含まれる
- そもそも私はAurora/MySQLの知識がほぼないです。

### 発生した問題
Auroraで文字コードがlatin1になっている為、文字化けが発生する。
「Aurora担当者からはUTF8で送ってほしい」とrequestが来たらしい。

### 対処
- 先に、Aurora(MySQL)内に手動でデータ連携用データベースを作成し、文字コードをUTF8にしておく。
- その上で、DMSタスクを再起動する。

ね？簡単でしょ？

### (想定)原因
最初、Auroraのデータ連携用データベースはDMSタスクの実行によって自動的に作られた状態になっていた。
MySQLはデフォルトの文字コード（文字セット）がlatin1になっている（らしい）。
このため、文字コードの違いから文字化けが発生していたっぽい。


なので、先にデータベース作っといたらええやん。というお話でした。
AWS.config.updateでアクセスキーが設定できないときに見るページ

ドハマリしたので覚書。

## やりたいこと
`AWS.config.update`でAWSへのアクセスキーをセットしたい。
-> STSのassumeRoleでクロスアカウントアクセスしたかった。

## よく見るコード

```javascript
AWS.config.update({
  accessKeyId: "AccessKeyId",
  secretKey: "SecretAccessKey",
  region: "region"
})
```

## 起きたこと

`.envrc`に設定しているprofileが勝って、意図したアカウントにつながらない。

## アカウントが変わっているかを確認する方法
こんな感じでaccess keyが変わっているか確認すれば良い。

```javascript
console.log(AWS.config.credentials.accessKeyId)
AWS.config.update({
  accessKeyId: "AccessKeyId",
  secretKey: "SecretAccessKey",
  region: "region"
})
console.log(AWS.config.credentials.accessKeyId)
```

## 意図したとおりに動いたコード

```javascript
  AWS.config.update({
    credentials: new AWS.Credentials(
      "AccessKeyId",
      "SecretAccessKey"
    ),
    region: "region"
  })
```

`AWS.Credentials`をインスタンス化して入れる方法だと動く。

## そもそもの問題

https://github.com/aws/aws-sdk-js/blob/master/lib/config.d.ts#L192-L209 を見ると、よく見かけるコードの方は非推奨扱いになっている。

```typescript
export abstract class ConfigurationOptions {
    /**
     * AWS access key ID.
     *
     * @deprecated
     */
    accessKeyId?: string
    /**
     * AWS secret access key.
     *
     * @deprecated
     */
    secretAccessKey?: string
    /**
     * AWS session token.
     *
     * @deprecated
     */
    sessionToken?: string
```

## STSでクロスアカウントアクセスするコード
こうすればよさそう。

```typescript
const AWS = require('aws-sdk')

const arn = 'arn:aws:iam::9999999:role/EXAMPLE'
const sts = new AWS.STS()
sts.assumeRole({
  RoleArn: arn,
  RoleSessionName: 'test'
}).promise().then(data => {
  AWS.config.update({
    credentials: new AWS.Credentials(
      data.Credentials.AccessKeyId,
      data.Credentials.SecretAccessKey,
      data.Credentials.SessionToken
    ),
    region: 'us-west-2'
  })
  const docClient = new AWS.DynamoDB.DocumentClient()
  return docClient.get({
    TableName: 'Test',
    Key: {
      ID: 'hello'
    }
  }).promise()
})
.then(data => console.log(data))
.catch(e => console.log(e))

```
LambdaからAppSyncをIAM認証で使う

# LambdaからAppSyncを使いたい

事の発端は、フロントエンドからDynamoDBに投げたデータをLambdaで処理を行った後（まぁまぁ時間が掛かることを想定したもの）、反映された情報をSubscriptionによってリアクティブに更新させたいと思ったのですが、AppSyncでSubscriptionする上で、AppSyncのMutationを通さずに更新した情報はSubscriptionできなさそうなので、バックエンドのLambdaからの更新もAppSyncを使う必要がある。[^1]
その際に、認証方法にAPI_KEYは嫌だし、Lambdaの認証のためにCognito Userを登録するのもナンセンスな気がしたので、IAM認証を。

# やり方
基本的に大部分[こちら](https://blog.r3it.com/aws-lambda-to-appsync-1aa0c2f1da04)で説明されている方法でいけます。
ただ、こちらのサイトもAPI KEYを使って説明されているので、このままAUTH TYPEをAWS_IAMに変えても403になってしまいます。

答えはとても簡単で、[ここ](https://aws-amplify.github.io/docs/js/api#iam-auth)にほとんど答えが載ってますが、credentialsを渡してあげればいいです。
しかし、Credentialsに何を渡すか、どう渡すかですが、単純にLambdaの実行Roleにより取得できるCredentialsを渡してあげましょう

```index.js
require('isomorphic-fetch');
const aws = require('aws-sdk'); //AWS-SDKの読込します
const AWSAppSyncClient = require('aws-appsync').default;
const gql = require('graphql-tag');
const AppSyncConfig = require('./aws-exports').default;

//~~~~~Mutationやらの定義は上記サイトを参考に同じように~~~~~
  
exports.handler = async (event) => {
  const client = new AWSAppSyncClient({
    url: AppSyncConfig.aws_appsync_graphqlEndpoint,
    region: AppSyncConfig.aws_appsync_region,
    auth: {
      type: AppSyncConfig.aws_appsync_authenticationType,
      credentials: ()=> aws.config.credentials //ここ！！
    },
    disableOffline: true
  });

//~~~Mutationの実行などは上記サイトを参考に同じように~~~

};
```

単純にAWS-SDKを読み込んであげることで、Credentialsの取得がなされるので、それをauth.credentialsに渡してあげるだけです。

IAM認証を使っている方の記事が少なく、何気にたどり着くのに時間が掛かったので、どなたかのお役に立てば幸いです。

[^1]: この部分そもそもちゃんと検証していないので理解が間違っていたら、是非ご指摘を！
AWS X-Rayでmysql-connector-pythonにバッチを当ててリクエストをトレースしてみる

# はじめに
アプリケーションが処理する各種リクエストをトレースするため、AWS X-Rayを使用しています。

リクエスト処理に使うライブラリのうち、AWS SDKを含むいくつかについてはX-Ray SDK内でデフォルトでサポートされており、パッチを適用すれば簡単に処理をトレースしてくれます。

今回は、PythonでDBを操作するアプリケーションを想定し、X-Ray SDK for Pythonがサポートしている __mysql-connector-python__ にパッチを適用してみようと思います。

[AWS X-Ray - ライブラリを実装ダウンストリーム呼び出しにパッチする](https://docs.aws.amazon.com/ja_jp/xray/latest/devguide/xray-sdk-python-patching.html)

# 環境
検証は、ローカルで行いました。

OS: macOS High Sierra
Python: 3.6.5
MySQL: 5.6 


# 実行

## MySQLサーバー
適当に用意。今回はDockerでmysql:5.6イメージをプルして実行。

### データベースとテーブルの用意
以下のクエリを実行。

```
# データベース
create database xray_test;

# テーブル
create table user (id char(10), name char(20));
```

## X Ray デーモン
トレースした情報をAWS上のX-Rayサービスへ投げるためにX-Rayデーモンを実行させる必要があります。

今回はローカルで検証したため、macOSで実行可能なスクリプトを落として `-o` オプションをつけて実行。

[AWS X-Ray - ローカルで X-Ray デーモンを実行する](https://docs.aws.amazon.com/ja_jp/xray/latest/devguide/xray-daemon-local.html)

```
./xray_mac -o
```

## Pythonスクリプト実行

今回はSELECT・INSERT・DELETEをトレースしてみます。

```python

import mysql.connector

from aws_xray_sdk.core import xray_recorder
from aws_xray_sdk.core import patch

# パッチ適用  patch_allでも可
libraries = ('mysql',)
patch(libraries)

# X Ray の設定
xray_recorder.configure(service='mysql-connector',
                        daemon_address="127.0.0.1:2000")

# mysql セグメント開始
segment = xray_recorder.begin_segment('mysql')

# 接続
conn = mysql.connector.connect(user='root', password='password', host='127.0.0.1', database='xray_test')
cur = conn.cursor()

# INSERT
cur.execute("insert into user values ('01', 'hoge');")
conn.commit()

# SELECT
cur.execute("select * from user;")
for row in cur.fetchall():
    print(row[0],row[1])

# DELETE
cur.execute("delete from user where id = '01';")
conn.commit()

cur.close()
conn.close()

# mysql セグメント終了
xray_recorder.end_segment()

```


# 結果
AWSコンソールで確認してみます。

トレース詳細に、こんな感じでちゃんと３リクエストがサブセグメントとして乗ってます。

<img width="1289" alt="スクリーンショット 2019-02-18 14.07.05.png" src="https://qiita-image-store.s3.amazonaws.com/0/241369/9e73d2f2-8f9a-ce10-f210-6cd3abb74f0c.png">

試しにサプセグメントを選択すると、SQLタブが出てます。これを開くと、DBのタイプやバージョン、接続したユーザー名が表示されます。

ここの情報はSELECT・INSERT・DELETEとも同じです。

<img width="1160" alt="スクリーンショット 2019-02-18 14.07.23.png" src="https://qiita-image-store.s3.amazonaws.com/0/241369/75c5c9b0-4dd6-d615-18f2-0a4983b2cb31.png">

# 注意点
__X-Rayにトレースしてもらうためには、 必ず `mysql.connector.connect` 関数を使ってコネクションを作る必要があります。__

当初はコネクションプールの操作のため `mysql.connector.pooling.MySQLConnectionPool` を使ってましたが全然トレースしてくれませんでした

バッチライブラリの中でも、サポートされている関数/されていない関数があるようなので、ご注意を・・・


# まとめ
これでMySQLサーバーへのリクエストがトレースできましたが、基本的には接続先と処理時間くらいしかトレースしてくれないので、より細かい情報を取りたい場合はSQLAlchemy ORMを使うべきかなと思います。また別途検証したいと思います。

# 参考
[MySQL Connector/Python Developer Guide](https://dev.mysql.com/doc/connector-python/en/)

[aws/aws-xray-sdk-python - GitHub](https://github.com/aws/aws-xray-sdk-python)

[PythonからMySQLへ接続する](https://qiita.com/a_t_a/items/680ed657c4dbeab40a28)
なんでもDCCツールじゃなくてUnityでやりたい人向けまとめ

# 概要
ちょっとウェイト塗りなおしたい、ちょっとテクスチャスタンプ追加したい、ちょっとモーション修正したい、みたいなときにDCCツールを使わずにUnityで済ませられたらうれしい、という話です。
よく聞かれるのでまとめておきます。

# ポリゴンモデリング
Pro Builder…おおまかに壁のサイズを出したりするのに使います。
(package manager)

UModeler…Pro Builderより高機能、無理やり剣とかの小物もモデリングできます。曲面が多いと無限につらい。
https://assetstore.unity.com/packages/tools/modeling/umodeler-80868

# プロシージャルモデリング(パラメトリックモデリング)
Archimatix Pro…非破壊のノードベースモデリング、Houdiniに近いやつがあったはず。
https://assetstore.unity.com/packages/tools/modeling/archimatix-pro-59733

# スキニング、ボーン追加
Puppet3D…スカートに骨を足したり、揺れ物を増やすための終端ボーンを追加したり、よく見ると破綻してたウェイトをこっそり修正したりします。
https://assetstore.unity.com/packages/tools/animation/puppet3d-111554

# Substance Painter
Surforge…ディティールアップ向け、柔らかい系に使うのはいけるのかな。
https://assetstore.unity.com/packages/tools/level-design/surforge-79171

# アニメーション作成
Very Animation…ゼロから手付するのにおすすめ。Blendshapeのキーも打てる
https://assetstore.unity.com/packages/tools/animation/very-animation-96826

UMotionPro…モーキャプデータ修正。貧者のMotionBuilderです。
https://assetstore.unity.com/packages/tools/animation/umotion-pro-animation-editor-95991

# まとめ
この辺で作業した結果をUnity FBX Exporterで出力して調整したりします。

https://assetstore.unity.com/packages/essentials/fbx-exporter-101408
[Rails]複合主キーを持つテーブルのレコードを更新する(*非常用)

## 環境
- Ruby 2.5.1
- Rails 5.2.1
- Mysql2 0.5.1

## 前提
そもそも、Rails において複合主キーの Model を扱うことはサポート外になります。複合主キーを使うと下記のような警告も出力されます。

```
WARNING: Active Record does not support composite primary key.
Composite primary key is ignored.
```

また、 `find`, `update`, `save`, `delete`　メソッドの使用が不可能になります。これらのメソッドを呼び出すと下記のようなエラーを出力します。

### Model
- MultiPkeyModel という複合主キーの Model があったとします
- pkey_1, pkey_2 カラムが主キーとします

### find
```rb
MultiPkeyModel.find(1) # 数値は適当

# ActiveRecord::UnknownPrimaryKey: 
# Unknown primary key for table multi_pkey_models in model MultiPkeyModel.
```
そもそも id カラムを持たないので find の引数に何も指定しようがないですが、引数有無問わず上記のエラーが発生することを確認しました。

### update, save, delete
```rb
record = MultiPkeyModel.find_by(pkey_1: somevalue1, pkey_2: somevalue2)

# update
record.update(foo: 'bar')

# ActiveRecord::StatementInvalid: Mysql2::Error:
# Unknown column 'multi_pkey_models.' in 'where clause': 
#   UPDATE `multi_pkey_models` SET `foo` = 'bar' WHERE `multi_pkey_models`.`` IS NULL

# save
record.foo = 'bar'
record.save # => update と同様のエラーのため省略

# delete
record.delete

# ActiveRecord::StatementInvalid: Mysql2::Error:
# Unknown column 'multi_pkey_models.' in 'where clause':
#   DELETE FROM `multi_pkey_models` WHERE `multi_pkey_models`.`` IS NULL

```
いづれの場合も、 SQL 文の WHERE 句が ```WHERE `multi_pkey_models`.`` IS NULL``` というおかしな状態になっているため失敗していると思われます。 Model クラスが id カラムを持たないため、本来 id カラムが指定されうる箇所が空になってしまっています。

## 本題
では、どうするべきか。そもそも複合主キーによるテーブルを使った運用自体をよしとするかどうかという話もありますが、本項ではそこまで壮大な話は扱わず、 **複合主キーテーブルを使わざるをえない状況** という前提で、苦肉の策を共有してみたいと思います。

### find の代わり
これは `find_by` ですみます。レコードの更新を伴わない場合はすぐには困ることもなさそうです。

```rb
MultiPkeyModel.find_by(pkey_1: somevalue1, pkey_2: somevalue2)
```

### update, delete の代わり

身も蓋もないですが、**SQL文を直接発行したほうが手っ取り早いと思います。**
下記は update を行う場合のコードの記述例です。

```rb
sql = <<-SQL
  UPDATE `multi_pkey_models` SET `foo` = :foo
  WHERE `pkey_1` = :pkey_1 AND `pkey_2` = :pkey_2
SQL

ActiveRecord::Base.connection.execute(ActiveRecord::Base.send(
  :sanitize_sql_array,
  [
    sql,
    foo: 'bar',
    pkey_1: someValue1,
    pkey_2: someValue2
  ]
))
```


どうしても Active Record を使いたい場合は `update_all` という手もあります。

```rb
MultiPkeyModel.where(pkey_1: someValue1, pkey_2: someValue2).update_all(foo: 'bar')
```

ただ、update_all は本来は複数のレコードをまとめて更新するためのメソッドです。 pkey_1, pkey_2 の組み合わせを持つレコードは必ず1つであることがテーブルの制約上保証されてはいますが、そういった背景を知らない人がコードを読んだ際に、コード上は複数のレコードを更新しにいっているように見えるので、あまり読み手に優しくないと思います。

ただ、「なんでここSQL文直接書いてるんだろう？」と思う人もいるかもしれないのでSQL文生書きにしていることの理由などをコメントで補足しておくといいとおもいます。**あれ、update_all 呼んでコメント書くのも一緒か** とも思いましたが、そこはエンジニア各位のご判断にお任せしたいとおもいます。

## まとめ
複合主キーを持つテーブルを扱う際には、各種 CRUD メソッドが想定どおり機能しないケースがあるのでご注意ください。

## ちなみに
gem でなんとかしている例もけっこうあるようです。実際問題、筆者も含め複合主キーってけっこう使いますよね。。。

- [composite-primary-keys/composite_primary_keys: Composite Primary Keys support for Active Record](https://github.com/composite-primary-keys/composite_primary_keys)
- [「composite_primary_keys」の検索結果 - Qiita](https://qiita.com/search?q=composite_primary_keys)


識者からのご指摘、ご感想ありましたらぜひコメントいただけるとうれしいです。
Elixir~自分で作ったPJが動いたぞ！~

#ここまでのあらまし

前回、

```elixir
[2, 3, 5] |> Enum.any?(& rem(13, &1)==0)
```

13を2,3,5で割ってあまりがゼロになる要素がなければfalseを返す、という式を書きました。

今回、これをモジュールに実装していきます。

#本題
適当なディレクトリで、

```elixir
mix new prime
```

します。

そして、

```elixir:prime.ex

defmodule Prime do
  @moduledoc """
  Documentation for Prime.
  """

  @doc """
  Hello world.

  ## Examples

      iex> Prime.hello()
      :world

  """
  def hello do
    :world
  end  
  def div
isible_all?  n, list do
    list |> Enum.any?(& rem(n, &1)==0)  
  end
end
```

前回の13を `n`、 `[2, 3, 5]` のリストを`list` としました。

ここでターミナルで

```
cd prime
iex -S mix
```

します。

```elixir
iex(1)> Prime.divisible_all?(13, [2, 3, 5])
false
iex(2)> Prime.divisible_all?(12, [2, 4, 5])
true
```


ふたつの自由な引数を持ったプログラムができました！！！

なお、divisible_all? という関数名を決める際に、[ codic ](https://codic.jp/engine) というWebアプリ辞書を使用しました。

これでつまみがふたつついたシンセサイザーができたようなもんです！！

#わかるようになったこと

最初はわたしは関数に対しての引数、というものが分かりませんでした。
Enumを学習する過程で第一引数、第二引数、リストがそれに相当する〜、といったことをおぼろげに理解していきました。
しかし今回、ふたつの要素を `n`、 `list` として可変にすることによって「引数」そのものを理解することができたように思います。

はじめて自分の作ったプログラムが動いた！！感動もひとしおだ！！！
うまずたゆまず、頑張ります。
Kento Mizuno
JAVA　コンストラクタの呼び出し処理

どうもおしょうです。
以下、自分のメモ用で記事を書きます。

まずはメイン処理のMain.javaを作成

```java:Main.java
class Main {
    public static void main(String[] args) {
        // インスタンスの生成と変数への代入
        Sample sample = new Sample();

        System.out.println("【サンプル】");
        System.out.println("名前：" + sample.name);
    }
}
```

次にコンストラクタを呼び出すSample.javaを作成

```java:Sample.java
class Sample {
    // 定数の定義
    public String name;

    // コンストラクタの定義
    Sample() {
        this.name = "おしょう";
    }
}
```

Main.javaの4行目にある

```java
Sample sample = new Sample();
```

でSample.javaのコンストラクタ(Sample.javaの6～8行目)を実行します。



その後、Main.javaの6行目にある

```java
System.out.println("名前：" + sample.name);
```

この処理で、Sample.javaのコンストラクタによってセットされた

name(中身に"おしょう"がセットされている)を処理結果のコンソールに出力します。


2つのjavaファイルをコンパイルして実行した結果は...

```text
【サンプル】
名前：おしょう
```

となります。

Sample.javaの定数をprivateにして呼び出せたような気がするが...
何かより良い書き方があればご指摘お願いします。

以上、失礼します。
Oracle Cloud Infrastructure(OCI) ComputeインスタンスのAD変更(移動)について

# はじめに
今回は作成したComputeインスタンスのADを変更(移動)する手順についてまとめてみた。
かなり簡単なため、まとめる必要もないが備忘録として。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/278065/e26684b8-e8f8-ef6f-bc38-53e630cc1e2a.png)

# 前提
ComputeインスタンスのADを変更することだけを対象としているため、注意しないといけない他の部分については、今回は対象外とする。
(下記、例を記載)

  1. VCNも変更
  2. AttachしているBlock Volume
  3. Security Listなどの再検討
  4. mountしているFSS

# 制約の整理
変更するにあたって、VCNをそのまま使用すると下記の制約があるため注意が必要。

* 同じInternal IPは使用できない  
  (1つのVCN内に同じCIDRのSubnetを作成できないため)
* FQDNまでを含めた同じホスト名は使用できない  
  (1つのVCN内に同じSubnet Domain名は作成できないため)

# ADの変更(移動)
## Subnet2の作成
`Networking` > `Virtual Cloud Networks`
と進み、Subnet1が存在しているVCNを選択する。

`Subnets` > `Create Subnet`
と進み、AD2に所属するSubnet2を作成する。

[Create Subnetの画面]
<img width="477" alt="001.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/278065/b4efd63a-d4a1-d85d-8b75-87c8b716300a.png">


以下注意点

* AVAILABILITY DOMAINは変更元と違うのを選択すること
* Subnet1と違うCIDRにすること
* Subnet1と違うDNS LABELとすること



## Boot Volumeのバックアップ作成
`Compute` > `Boot Volume`
と進み、Compute AのBoot Volumeで`Create Manual Backup`を選択する。

[Create Backupの画面]
<img width="477" alt="002.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/278065/fb8b182c-ec9d-ffdd-b591-f7167656c719.png">


以下注意点

* 初めてのバックアップの時はBACKUP TYPEがFull Backupとなる


## BackupからのBoot Volume作成
`Compute` > `Boot Volume Backups`
と進み、作成されたバックアップで`Create Boot Volume`を選択する。

[Create Boot Volumeの画面]
<img width="477" alt="003.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/278065/308a4b0a-010d-e228-bc1a-7cbdfabf0ef8.png">

以下注意点

* AVAILABILITY DOMAINは変更元と違うのを選択すること

## Computeインスタンスの作成
`Compute` > `Boot Volume`
と進み、バックアップから作成したBoot Volumeで`Create Instance`を選択する。

[Create Instanceの画面]
<img width="633" alt="004.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/278065/84a802bb-2be4-d84f-26f1-553b812f9356.png">
<img width="633" alt="005.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/278065/ead64ead-ebf6-6ded-6fe7-0062a016c109.png">

以下注意点

* AVAILABILITY DOMAINは変更元と違うのを選択すること
* Subnetも同様
* また、IP予約をしていて、Public IPを変更したくない場合は以下の画面でチェックを外すこと！！
<img width="633" alt="006.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/278065/42152d3c-6ef5-f50d-d4ac-35dbdfb5cf00.png">


## Computeインスタンスの削除
移動が終わったら、元のComputeインスタンスをTerminateする。

## IP予約の再設定
(IP予約をしていた場合は)
`Compute` > `Instances` > `作成したInstance` > `Attached VNICs` > `作成されているVNICを選択` > `Edit`
を選択し「Reserved Public IP」を割り当てる。
※階層はかなり深い

# 最後に
起動していることを確認して、実際に移動できているかを確認すれば問題なし。
Laravel 関連テーブルのカラムで検索する方法

# 前提
Presidentモデル（社長）　1人 に対して
Shopモデル（お店）　複数　　が紐づいている状態




# Laravelの関連テーブルのカラムで検索したい。

社長の名前に`田`がつくお店一覧を出したい場合はこれ


```php

return Shop::with('president')
                ->select('*', 'presidents.name as president_name', 'shops.name as shop_name')
                ->leftJoin('presidents', 'presidents.id', '=', 'president_id')
                ->where('presidents.name', 'LIKE', '%' . 田 . '%')
                ->groupBy('presidents.id');
```

## 解説

お店にも、社長にも `name` というカラムがある。
joinするとnameカラムが社長の名前で上書きされてしまう。

なので `select as` を使って別の名前に最初に定義し直す。
> ->select('*', 'presidents.name as president_name', 'shops.name as shop_name')
Zabbix4.0でSNMPトラップを監視

# 環境
- Zabbix4.0
- CentOS7.5 minimal

# Zabbixサーバー(ホストOS)の設定
- SELinux = disabled
- Firewallで開けてるポート = 80/tcp,443/tcp,162/udp

# インストールするもの
- epel-release
- snmptt
- net-snmp-perl
- perl-Sys-Syslog


# SNMP TrapをZabbixで監視する流れ
1. ZABBIXサーバー(ホストOS)のSNMPTrapdでトラップを受け取る
2. SNMPTrapdで受け取ったトラップはSNMPTTによってZABBIXに渡せるデータフォーマットに変換
3. SNMPTTのlogに変換されたSNMPTrapをZABBIXが読み取る

# やること
### SNMPTrapdで受信したSNMPTrapをSNMPTTに渡すように設定

```/etc/snmp/snmptrapd.conf
OPTIONS="-Ls6 -p /var/run/snmptrapd.pid"
```

### SNMPTTに渡すSNMPTrapをOIDからシンボル名に変更しないように設定

```/etc/snmp/snmptt.ini
mode = daemon
net_snmp_perl_enable = 1
net_snmp_perl_best_guess = 2
date_time_format = %Y/%m/%d %H:%M:%S
log_file = /var/log/snmptt/snmptt.log
mibs_environment = ALL
```

### Zabbixに表示するSNMPTrapフォーマットをとりあえず適当に

```/etc/snmp/snmptt.conf
EVENT general .* "General event" Normal
FORMAT ZBXTRAP $aA $*
```

### ZabbixからSNMPTTを見れるようにConfig設定

```/etc/zabbix/zabbix_server.conf
SNMPTrapperFile=/var/log/snmptt/snmptt.log
StartSNMPTrapper=1
```

### 設定の反映

```sh
$ systemctl enable snmptrapd
$ systemctl start snmptrapd
$ systemctl enable snmptt
$ systemctl start snmptt
$ systemctl restart zabbix-server
```

# 確認
### SNMPTrap自体が受け取れているかどうか

```sh
$ tail -f /var/log/messages
```

### SNMPTTで認識されているか

```sh
$ tail -f /var/log/snmptt/snmptt.log
```
*このファイルが無い場合はSNMPTrapを読み取れてません。SNMPTTで読み取れているとこのファイルは自動生成されます。


### ローカルホスト上で適当にSNMPTrapを送ってみる

```sh
$ snmptrap -v 2c -c public 127.0.0.1 '' .1.3.6.1.4.1.8072.9999 .1.3.6.1.4.1.8072.9999 s 'TEST'
```

以上でサーバー側の設定は完了。
あとはZabbixのWebUI上で監視設定するだけです。
【随時追記予定】Vue.js/Vuetify オレオレコンポーネント集

# この記事は何？
Vue.js (Nuxt.js) 向け Material Design フレームワークの一つに「[Vuetify](https://vuetifyjs.com/ja/)」というものがあります。
この記事では、自分用に改造した Vuetify コンポーネントを随時まとめていく予定です。

万が一「私も使ってみたいよ」という方がいらっしゃいましたら、**MIT License** の権利内でご自由にご利用ください。

### 動作確認済みの環境
- `vue@2.6.10`
- `vuetify@1.5.16`

// `vuetify@2.0.0` で動かないみたいだったので確認しないと...

## シンプルな Button でファイルアップロード
![file-upload-button.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/240213/fbed1870-67de-590f-a9f9-5d85bf0a9e4d.gif)

`<v-btn>` の直後に `<input type="file" style="display: none">` を書いただけ。
Button のスタイルはお好みで。

<p class="codepen" data-height="265" data-theme-id="0" data-default-tab="js,result" data-user="blachocolat" data-slug-hash="BgMKRQ" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="Vuetify - Custom file upload button">
  <span>See the Pen <a href="https://codepen.io/blachocolat/pen/BgMKRQ/">
  Vuetify - Custom file upload button</a> by blachocolat (<a href="https://codepen.io/blachocolat">@blachocolat</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

## Slider の ticks をアクティブ/非アクティブっぽく表示する
![custom-slider.gif](https://qiita-image-store.s3.amazonaws.com/0/240213/bf3253dc-0985-09d8-af5b-49ff9cf675ba.gif)

公式の [Ticks labels](https://vuetifyjs.com/ja/components/sliders#ticks) をベースに、現在の値がどの位置にあるのかを見やすくした感じ。
thumb のアイコンはおまけです。

<p class="codepen" data-height="265" data-theme-id="0" data-default-tab="js,result" data-user="blachocolat" data-slug-hash="WPLjPr" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid black; margin: 1em 0; padding: 1em;" data-pen-title="Vuetify - Custom slider with active/inactive styled ticks">
  <span>See the Pen <a href="https://codepen.io/blachocolat/pen/WPLjPr/">
  Vuetify - Custom slider with active/inactive styled ticks</a> by blachocolat (<a href="https://codepen.io/blachocolat">@blachocolat</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>
新卒2年目で学んだ議事録の話

新卒で入社して2年経ち、ようやく自分なりに議事録の作り方がまとまってきたかなと思ったので、まとめようと思います。
#書くこと
・タイトル
・概要（日付、出席者）
・決定事項、ToDoのまとめ（A社、B社で分けると分かりやすい）
・議事（詳細は下に記載）
・次回の日程

僕的には決定事項とToDoを一覧化すると見直すとき分かりやすいのでいいと思います。
以降は議事の書き方に焦点を当てていこうと思います。
#議事の書き方
議事の書き方は2通りがあると思います。
##決まったことだけを書く
###やり方
議題を書く
決定事項、ToDoを書く
###メリット
・簡潔で分かりやすい。
・作成に時間がかからない。
・メモ量が少ないため議事中にちゃんと話を聞きやすい。
・打ち合わせの最後に決定事項やToDoをフィードバックしやすい。
###デメリット
・話をちゃんと理解していないとできない。
・議題から話が逸れるとメモが取りづらい。
・あとで見直したときに、何故その結論に至ったかが分からなくなる。
###例
-フォームの入力規則について
--日本語、英数字のみ入力可能とする @A社
--英数字が必要かどうかを確認し、情報を共有する @B社
##話の流れも書く
###やり方
議題を書く。
発言ごとに記載する。
###メリット
・結論に至った経緯が分かりやすい。
・自分が分からなかったところが分かりやすい。
・裁判になったときに話の展開が追いやすくなる（気がする）。
###デメリット
・メモ量が多く、会話についていけなくなることがある。
・話が脱線すると、軌道修正しづらい。
・すべての人の発言を理解して記載しないといけないので時間がかかる。
###例
-入力フォームの入力チェックについて何か要望ありますか：田中
--日本語が入力できれば良い：鈴木
---英数字はは入力できなくてよいか？：田中
----よい：鈴木
---英数字が入力するパターンも存在する。念のため確認する：高橋 @B社
----一旦、英数字も入力できてよいように変更する：鈴木
-----そのように設定する：田中 @A社
##雑感
どっちが正しいとかはなくて、案件（またはお客さんやリーダーさん）によってどっちにするか決める必要があります。
僕の場合、時間がかかるのが嫌なので、特に何も言われなければ決まったことだけを書きます。

#分からない単語群
会議中に知らない単語が出たり、固有名詞が出たりすることは多々あります。
特にIT業界ではカタカナ君やEnglishちゃんがポコポコ出てきて、メモ中に滅茶苦茶焦ります。(さらに金融になり始めたりすると漢字10文字の謎の単語が出てきたり……)
##解決策
分からない場合の解決策は聞くことしかないです。
聞かなければ、「分かっているんだな」と思われます。聞くのも仕事のうちです。
そのために、とりあえず聞こえた音でメモするのが大事です。
「Qiitaに記事を挙げておきます」が聞き取れなくても「きい？？記事を挙げておきます」みたいに。
##忙しそうで聞けない場合
僕の場合、分からない箇所に「？？」と記載して
「議事録を作成しました。分からない箇所は？？をつけています。確認をよろしくお願いします。」
とチャットしてレビューしてもらっています。

やり方は人それぞれですが、「分からないことは書かない」ではなく、
分かっていないことを理解してもらうために、
分かっていないということを記載するように心がけてたらいいと思います。
#終わりに
精度がなかなか高いと噂のGoogleの音声文字起こしなどで自動化したいのですが、
なんでもかんでも記載すれば良いというわけではないので難しいところです。
議事録は決まったところだけを記載し、Googleでの文字起こしを付属しておくとかでも良いかもしれないなあと思いました。
opencv.jsの作法 その5

# 概要

opencv.jsの作法を調べてみた。

# 実行環境

sandboxを用意した。以下のコードは動く。
http://jsdo.it/ohisama1/YSHs/

# 写真

![image.png](https://qiita-image-store.s3.amazonaws.com/0/18104/a526b1bb-1ddb-96bd-77a1-e2a4828dc337.png)


# 顔検出

```javascript
    let src = cv.imread('canvasInput');
    let gray = new cv.Mat();
    cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY, 0);
    let faces = new cv.RectVector();
    let eyes = new cv.RectVector();
    let faceCascade = new cv.CascadeClassifier();
    let eyeCascade = new cv.CascadeClassifier();
    faceCascade.load('haarcascade_frontalface_default.xml');
    eyeCascade.load('haarcascade_eye.xml');
    let msize = new cv.Size(0, 0);
    faceCascade.detectMultiScale(gray, faces, 1.1, 3, 0, msize, msize);
    for (let i = 0; i < faces.size(); ++i)
    {
        let roiGray = gray.roi(faces.get(i));
        let roiSrc = src.roi(faces.get(i));
        let point1 = new cv.Point(faces.get(i).x, faces.get(i).y);
        let point2 = new cv.Point(faces.get(i).x + faces.get(i).width, faces.get(i).y + faces.get(i).height);
        cv.rectangle(src, point1, point2, [255, 0, 0, 255]);
        eyeCascade.detectMultiScale(roiGray, eyes);
        for (let j = 0; j < eyes.size(); ++j)
        {
            let point1 = new cv.Point(eyes.get(j).x, eyes.get(j).y);
            let point2 = new cv.Point(eyes.get(j).x + eyes.get(j).width, eyes.get(j).y + eyes.get(j).height);
            cv.rectangle(roiSrc, point1, point2, [0, 0, 255, 255]);
        }
        roiGray.delete();
        roiSrc.delete();
    }
    cv.imshow('canvasOutput', src);
    src.delete(); 
    gray.delete();
    faceCascade.delete();
    eyeCascade.delete();
    faces.delete(); 
    eyes.delete();
```

以上。
awsにSSHする時のメモ

#Macからaws上のインスタンスにsshしようとしたらちょこちょこ引っかかったのでメモ

※あとで清書する

・awsでEC2を建てた時のKeypairをダウンロードし、~/.sshディレクトリに保存
・インスタンスの設定でインバウンドの設定に注意
・ちなみに~/.sshはUser/<自分の名前>/.sshということらしい
・ただ、.sshは隠しフォルダなので、ls -aで-aオプションつけないと見れない
・次に、chmod 600 <keypair名>で制限をかける
・.ssh自体は700とかにしてあるはず？
・あとは(sudo) ssh -i <絶対パスのキーペア> ec2-user@<host名>で接続できるはず
・これを短い記述で呼べるようにするには、configファイルを編集する
・.ssh配下にtouch configでファイルを作り、以下を記述(open configで良い)

```
Host aws
HostName <hostname>
User ec2-user
IdentityFile /Users/<yourname>/.ssh/<keypair>
```
保存すると、ターミナルから

```
ssh aws
```
でsshできるようになる
Vueでダイアログを動的に生成してマウントするサンプル作ってみた

# 課題
Vueでサービスを作っててダイアログやモーダルを表示したいときに、公式だとdataにフラグを持たせてClickイベントでtrue/falseを切り替えるようにしていた。ただ、これだと画面内で表示したいダイアログが増えるほどにdataのフラグも増えるし、テンプレートの中に各フラグと紐づいたdialogタグを量産することになって、めちゃくちゃ見にくいし何より格好悪い。
なので、showDialog()的な感じでメソッド呼び出しでダイアログを表示させたい

# やったこと
[renoinn/vue-dialog-sample](https://github.com/renoinn/vue-dialog-sample)
というわけで、DialogHelper.showDialog()とすることでダイアログを表示させるサンプルを作ってみた。

# 解説
キモになるのは以下の点

``` javascript:Dialog.vue
methods: {
    attach () {
        if (!this.$parent) {
            this.$mount();
            document.body.appendChild(this.$el);
        } else {
            this.$mount();
            this.$parent.$el.appendChild(this.$el);
        }
    },
    remove () {
        if (!this.$parent) {
            document.body.removeChild(this.$el);
            this.$destroy();
        } else {
            this.$parent.$el.removeChild(this.$el);
            this.$destroy();
        }
    },
    close () {
        this.isShow = false;
    },
    show () {
        this.attach();
        this.isShow = true;
    },
    afterLeave () {
        this.remove();
    }
}
```
まずDialog.vue側で自身をappendChildしたり、removeChildするメソッドを用意してやる。この時単に`document.body.appendChild(this.$el);`とすると、Vueの仮想DOMツリーから外れてしまって、例えばvue-routerを使ってて画面遷移してもダイアログが消えないとか問題が起きてしまう。
なので、`this.$parent`を見て、設定されていればその下にappendChildするようにする。

``` javascript:DialogHelper.js
import Vue from 'vue';
import Dialog from '@/components/Dialog.vue';

const DialogHelper = {
    showDialog (context, { subject, message, ok, cancel }) {
        let DialogVM = Vue.extend(Dialog);
        let vm = new DialogVM({
            parent: context,
            propsData: {
                subject: subject,
                message: message,
                onPrimary () {
                    ok();
                    vm.close();
                },
                onSecondary () {
                    cancel();
                    vm.close();
                }
            }
        });
        vm.show();
    }
}
export default DialogHelper;
```
次にダイアログを生成するHelperを用意する。Vueのコンポーネントは単一コンポーネントファイルであっても、`Vue.extend(Component);`とすることで、ソースコード上でクラスとして使用できるようになる。
メソッドの引数でcontextを受け取って、コンストラクタで`parent: context`としてやることで、上述の`this.$parent`を設定できるようにしておく。

``` javascript
<script>
import DialogHelper from '@/DialogHelper';

export default {
  methods: {
    showDialog () {
      DialogHelper.showDialog(this, {
        subject: 'Subject',
        message: 'open temporary dialog sample',
        ok: () => { console.log('click ok') },
        cancel: () => { console.log('click cancel') }
      });
    }
  }
}
</script>
```
呼び出しはHelperをimportして、showDialogから呼び出す。第一引数でthisを渡しているので、呼び出したコンポーネントの下にDialogコンポーネントがappendされることになる。
thisじゃなくて、`this.$root`や`this.$parent`を渡すこともできる。

今回はダイアログだったけど、同じような感じでモーダルやトーストも実装できる。

# 参考URL
https://qiita.com/hako1912/items/8c0462203987f2cd15b1
https://kitak.hatenablog.jp/entry/2017/04/04/044829
https://github.com/paliari/v-slim-dialog
TypeScriptでimport React from 'react'って書きたい！

## 書いてみる
```tsx
import React from 'react';
```

すると以下のエラー出る。。。

```
Module '"~~~~/node_modules/@types/react/index"' has no default export.
```

（`~~~~`は各々のファイルの場所です。）

以下にすればエラーが出なくなる。

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

**そういうことじゃない！！**

## tsconfigを直す
```
allowSyntheticDefaultImports: true
```

これを足せばいいだけ！

https://www.typescriptlang.org/docs/handbook/compiler-options.html
上記から`allowSyntheticDefaultImports`の説明を引用すると、、、

> Allow default imports from modules with no default export. This does not affect code emit, just typechecking.

英語がわからないのでGoogle翻訳にぶん投げます。

> デフォルトのエクスポートなしでモジュールからのデフォルトのインポートを許可します。これはコードの発行には影響せず、単に型チェックを行います。

`has no default export`に対して解決してそうですね！

めでたし！
Amazon Cognitoで発生する例外(Exception)をまとめてみた

# Amazon Cognito とは

ウェブアプリケーションやモバイルアプリケーションの認証、許可、ユーザー管理をしてくれる便利なサービス。
GoogleやTwitterなどのサードパーティとも連携できる優れもの。

# エラーレスポンスの形式

基本的に以下の形式で与えられる。

```shell:Console
{
    code: "NotAuthorizedException",
    name: "NotAuthorizedException",
    message: "Incorrect username or password."
}
```
| key | value |
|:-:|:-:|
| code  | 例外コード  |
|  name | 例外名  |
|  message | 例外の詳細  |


# 例外一覧

主にSignUp, Verify, SignIn周りの例外をまとめた。

## General(どのタイミングでも発生し得る)
### InternalErrorException
Cognito内部での例外。余程のことが無い限り発生しないと思われる。

### InvalidLambdaResponseException
Cognitoで指定できるトリガーLambda関数のレスポンスが無効である。

### UnexpectedLambdaException
Cognitoで指定できるトリガーLambda関数内部で例外が発生。

### ResourceNotFoundException
ResourceのID等の指定を間違っている可能性がある。そもそも作ってない説もある。

### TooManyRequestsException
文字通り、requestを飛ばしすぎによる例外。

## SignUp関連

### CodeDeliveryFailureException
検証コードの配信に失敗した時に起こる。

### InvalidEmailRoleAccessPolicyException
メールアドレス周りのRole関連による例外。

### InvalidSmsRoleAccessPolicyException
これも権限周り。検証コードを発行する権限が無い。

### InvalidSmsRoleTrustRelationException
これも権限周り。Roleの不一致(IDPoolやサードパーティ関連)

### InvalidParameterException
必要なユーザー属性が足りなかったりした時に発生。

### InvalidPasswordException
Cognito側で設定したパスワード要件を満たしていない時に発生する。

追記）パスワードの長さが足りない場合はInvalidParameterExceptionの方に引っかかるっぽい

## SignIn関連
### NotAuthorizedException
ユーザー認証に失敗した時。ユーザー名orパスワードが間違っています等のメッセージがいい例。

### UserLambdaValidationException
Cognito側でユーザーの自己サインインを許可していない時などに起こる。

追記）　↓はSignUpの方です。
### UsernameExistsException
既にユーザー名が使われている時に起こる。

### UserNotConfirmedException
検証コードを入力する作業が完了していないユーザーがサインインしようとした時とか。これをキャッチして検証ページに飛ばすのが普通なのかな？

### PasswordResetException
パスワードのリセットが必要な時に発生する例外。

## Verify関連
### CodeMismatchException
入力された検証コードが間違っている時に発生。

### LimitExceededException
ログイン試行やコード検証試行の回数の上限に達した時に発生。

### ExpiredCodeException
検証コードが期限切れになっている時に発生する。

### UserNotFoundException
検証しようとしたメールアドレスが存在しない場合に発生する。


# 終わりに
Amazon Cognitoで発生する例外についてまとめました。
全てを網羅できていませんが、必要そうなものは大体ピックアップしました。
これ違うだろっていうのがあれば修正リクエストお願いします。
こちらでも気付き次第修正します。
NVIDIA環境でPython+Qtアプリを起動する(shader作成に失敗する場合)

PythonでQtアプリを起動すると、「QOpenGLShader: could not create shader」と表示されて失敗することがある。

## 原因

https://bugs.launchpad.net/ubuntu/+source/python-qt4/+bug/941826 にあるが、状況によりlibGL.so.1ではなくlibGL.soがロードされ、これがDebianパッケージのドライバだと/usr/lib/mesa-diverted/x86_64-linux-gnu/libGL.soにリンクされていることが原因である。
(NVIDIAインストーラならばこういう状況は発生しないが、カーネル更新時に自動でdkmsが働かないためドライバを入れ忘れる可能性が出てしまう、なのでパッケージを使うのが良かろう)

## 方法

短期的には、`sudo ln -sf libGL.so.1 /usr/lib/x86_64-linux-gnu/libGL.so`とすればよいが、グラフィックドライバ等の更新でmesa-divertedに戻ってしまう。恒久的に書き換えるには以下を実行すれば良い。

```bash
sudo update-alternatives --install /usr/lib/mesa-diverted/libGL.so-master libGL.so-master /usr/lib/x86_64-linux-gnu/nvidia 9999 \
--slave /usr/lib/x86_64-linux-gnu/libEGL.so glx--libEGL.so-x86_64-linux-gnu /usr/lib/x86_64-linux-gnu/nvidia/current/libEGL.so.1 \
--slave /usr/lib/x86_64-linux-gnu/libGL.so glx--libGL.so-x86_64-linux-gnu /usr/lib/x86_64-linux-gnu/nvidia/current/libGL.so.1 \
--slave /usr/lib/x86_64-linux-gnu/libGLESv1_CM.so glx--libGLESv1_CM.so-x86_64-linux-gnu /usr/lib/x86_64-linux-gnu/nvidia/current/libGLESv1_CM_nvidia.so.1 \
--slave /usr/lib/x86_64-linux-gnu/libGLESv2.so glx--libGLESv2.so-x86_64-linux-gnu /usr/lib/x86_64-linux-gnu/nvidia/current/libGLESv2_nvidia.so.2
```

このスクリプトは /var/lib/dpkg/info/glx-alternative-mesa.postinst を読んだ上で自分で構築したものである。

## 追伸

Qt 5.12.1以降では直っているらしいけど( https://bugreports.qt.io/browse/QTBUG-71488 )、Debian busterには来ないよね…

## 211203追記

会社のマシンをDebian 11に更新したんですが、その際にnvidiaドライバがGLVND版に変わりました。GLVND版はファイル構成が違うらしいですね。というわけでこのハックは削除する必要があります。
なおGLVND版であれば/usr/lib/mesa-diverted/x86_64-linux-gnu/libGL.soを使って問題なくnvidiaドライバをロードできます。

```bash
sudo update-alternatives --remove libGL.so-master /usr/lib/x86_64-linux-gnu/nvidia
```
Androidアプリインストール時のエラー910を回避する

## はじめに

Androidアプリをインストールしようとするとエラー910と表示されて失敗することがあります。

## 方法

### Short

空き容量不足の一種なので容量をなんとかして増やせば良いです。アップデート時に発生するなら、後述の理由により、アプリをアンインストールしてから入れ直すのも効果ありです(機種変更手続きが必要なアプリなら手続きすること)。

### Long

ダウンロードしたアプリは/data/apkに置かれますが、この分の空き容量チェックはGooglePlayで行われるようです。

ただし、AndroidアプリはJava(またはJVMで実行される言語)で書かれているので、動画アプリやゲームなど、パフォーマンスが問題となる場合はJNIを用いてネイティブコード実行させることが多いです。このJNIライブラリはapkとは別に配置されます。環境によって異なりますが、/data/data/APP-1/libや/data/app-lib/APP-1、つまりapkと同じパーティションに配置されます。この配置に失敗するとエラー910となるようです。
先にアンインストールすることで空き容量を稼げる可能性があるのは、アップデート時はJNIライブラリ等を配置し終えてから以前のファイルを削除する挙動となっているからです。
【Vuforia】★5の状態から、認識精度をさらに上げる（ブルブルを軽減する）

壁にマーカーを貼り付けた状態でARしているのですが、
★５なのに、ちょいちょいブレるんやけど！！と思ったので、備忘録です。


目次
ターゲットサイズ(ARマーカー)
認識精度が影響する要因
印刷用紙
Extended Trackingの有効化

##ターゲットサイズ(ARマーカー)
カメラとターゲット間の距離が開くほど、ターゲットを大きくする必要がある。
・少なくとも12cm推奨だそう
・検出可能な距離は、大体、ターゲットサイズの10倍。
　例) 30cm幅のターゲットの場合・・・30cm × 10倍 = おおよそ300cm(3m)の距離まで検出可能


##その他要因
・ターゲットが部屋の光でテカっていないか？　→印刷用紙
・ターゲットがヨレていないか？　　　　　　　→印刷用紙
・端末カメラのフォーカスモード
・アップロード画像を320px以上のものにすると◎　※アンチエイリアス処理後の、画像ターゲットの検出率に影響を与えるのを回避する

##印刷用紙
・光沢のない用紙を使用する　→　EPSON フォトマット紙 A4 50枚 KA450PM がオススメ
・水平なマーカーにするために、厚紙使用や、ボードに貼り付ける等。

##Extended Tracking(拡張トラッキング)を有効にする
カメラからマーカーが外れても、表示し続けるようになります。
マーカーをギリギリ認識の状態でブルブルしてるのが、軽減します。

設定方法　※試した環境　Unity : 2018.2.16f / Vuforia Unity Extention Version : 8.0.10

①Windows > Vuforia Configuration をクリック
![image.png](https://qiita-image-store.s3.amazonaws.com/0/306317/8bc139f7-5a7c-6bcd-111b-9d16087c7b28.png)

②少し下の方にある　[Device Tracker]の　Track Device Pose にチェック
③Tracking mode　は　POSITIONALに
![image.png](https://qiita-image-store.s3.amazonaws.com/0/306317/114f18be-6a1b-d81f-93b8-3e8cf5e9f08f.png)

##参考にしたページ
Tutti Lab - http://tuti107.hatenablog.com/entry/2016/12/01/163148
Vuforia資料庫 - https://www.cnsrd.jp/vuforia-library/howto/index.html
　
　
　
　
これでかなりブルブルが安定するはーず。
Chefカスタムリソース作成が簡単になっていた 

#変更

Chefのカスタムリソースを作ろうとdocs.chef.ioの情報を見たら、書籍「Chef実践入門 ~コードによるインフラ構成の自動化」(Chef client 11.10.4)当時より随分簡単になっていた。(2019/02時点の最新はChef Client 14.10.9)

[Release Notes: Chef Client 12.0 - 14.10](https://docs.chef.io/release_notes.html)
> What’s New in 12.5
> The following items are new for chef-client 12.5 and/or are changes from previous versions. The short version:
> 
> New way to build custom resources The process for extending the collection of resources that are built into Chef has been simplified. It is defined only in the /resources directory using a simplified syntax that easily leverages the built-in collection of resources. (All of the ways you used to build custom resources still work.)

#詳細
詳細は以下を参照
[Custom Resources](https://docs.chef.io/custom_resources.html)

#ざっくりとした例(やや編集しつつ抜粋)

websiteクックブックにhttpdというカスタムリソースを作って使う場合

```
website
├── metadata.rb
├── recipes
│   └── default.rb
└── resources
    └── httpd.rb  #カスタムリソースはresourcesディレクトリーに配置
```

```ruby:resources/httpd.rb

property :homepage, String, default: '<h1>Hello world!</h1>'  # homepageという文字列のプロパティ。デフォルト値が設定可能

action :create do                  # actionは一つ以上必要。先頭のactionがデフォルトアクション。
  package 'httpd'

  service 'httpd' do
    action [:enable, :start]
  end

  file '/var/www/html/index.html' do
    content new_resource.homepage  # new_resource.<property>で渡されたpropertyを参照可能
  end
end
```

この場合、レシピでは以下の様に<クックブック名>_<カスタムリソース名>でカスタムリソースを呼び出せる。

```ruby:recipes/default.rb
website_httpd 'httpd_site' do       # 名前の'httpd_site'は任意
  homepage '<h1>HELLO WORLD!</h1>'  # 指定がなければカスタムリソース側で定義されたdefault値が使用される
  action :create                    # デフォルトアクションなのでこの場合は省略可
end
```
gatsbyを使ってみる（プロジェクト作成からsurgeで公開まで）




## はじめに
gatsbyという静的サイトジェネレータを使ってみました。
その備忘録です。

## gatsby
- インストールする

```
yarn global add gatsby-cli
```

- プロジェクトを作成する

```
gatsby new gatsby-site
```

- 開発モード

```
yarn develop
```

- ビルド

```
yarn build
```

- surgeを入れる

```
yarn add -D surge
```

- package.jsonにscriptを追加

```
"deploy": "surge public/"
```

- surgeで公開

```
yarn deploy
```

- `https://godly-celery.surge.sh/`にアクセス出来る様になる

- ssl化するためにsurgeスクリプトを変更(`http://~`から`https://~`にリダイレクトされるようになる)

```
"deploy": "surge public/ https://godly-celery.surge.sh/"
```


## テンプレートテーマを使ってみる
- `https://github.com/LekoArts/gatsby-starter-portfolio-emilia`を使う

```
gatsby new nz-memories https://github.com/LekoArts/gatsby-starter-portfolio-emilia
```

## 参考
- 静的サイトジェネレーター一覧：`https://www.staticgen.com/`
- gatsby公式：`https://www.gatsbyjs.org/`
- surge公式：`https://surge.sh/`
- surge日本語：`https://surge-sh.cf/`
便利なSQLコマンド

個人的に便利だと思ったSQLコマンドを書きなぐっていきます。備忘録です。

## \g
表示結果を縦に表示してくれるとても素晴らしい機能

```
mysql> select * from test;
+-------+--------+--------+--------+
| id    | hostid | status | type   |
+-------+--------+--------+--------+
|     1 |      1 | true   |    a   |
|     2 |      1 | true   |    b   |
+-------+--------+--------+--------+

mysql> select * from test \G
*************************** 1. row ***************************
   id: 1
  hostid: 1
  status: true
  type: a
*************************** 2. row ***************************
   devid: 2
  hostid: 1
  status: true
  type: b
2 rows in set (0.00 sec)
```




気になるコマンド見つけたら随時更新予定
他にも皆さんの「こんなのも便利！」などのコメント待ってます。
Jestで AWS SDKモジュールをモック化する方法（promise込み）

# Jestでモック化できるケース・できないケース
## 普通にモック化できるケース
通常。関数やモジュールは、requireして使用していれば、モックオブジェクトを差し込むことができる。

```javascript:module_a.js
module.exports = {
  featureA (paramA, ParamB) => {
    ...
  },
```

```javascript:module.spec.js
const moduleA = require('module_a')

describe('module a test suite', () => {
  test('exist cognito user', async () => {
    moduleA.featureA = jest.fn()
  ...
```

## モック化できないケース(AWS SDKを使用)
ここで、AWS SDKを以下のようにrequireしているとします。  
ここでは、例として CognitoIdentityServiceProvider を使用しています。  
わりとこのような使い方が普通かと思います。  

```javascript:module_a.js
const AWS = require('aws-sdk')
const cognitoidp = new AWS.CognitoIdentityServiceProvider()

module.exports = {
  featureA async (paramA, ParamB) => {
    await cognitoidp.adminGetUser(param).promise()
    ...
  },
```

上記で、cognitoidp.adminGetUserと、そのpromise()をモック化したいとします。  
これを以下のように記述しても意図した通りになりません。  

```javascript:module.spec.js
const moduleA = require('module_a')

const AWS = require('aws-sdk')
const cognitoidp = new AWS.CognitoIdentityServiceProvider()

describe('module a test suite', () => {
  test('exist cognito user', async () => {
    cognitoidp.adminGetUser = jest.fn()
      ... // mockReturnValueとかを書く
  ...
```

モジュール側でもテスト側でも、AWS SDKのインスタンスをnewしているため、上手くモック化できません。

# AWS SDKモジュールのモック化
AWS SDKのモジュールや特定のメソッドをモック化するには、
**「自前で作成しているモジュールにてエクスポートし、テスト側でそれを利用する」**
という方法をとる。

```javascript:module_a.js
const AWS = require('aws-sdk')
const cognitoidp = new AWS.CognitoIdentityServiceProvider()

module.exports = {
  cognitoidp,
  featureA async (paramA, ParamB) => {
    await cognitoidp.adminGetUser(param).promise()
    ...
  },
```

テスト側からは、上記モジュールをrequireした上で、cognitoidpの中で必要なメソッドに jest.fn()を差し込む。 
cognitoidp.adminGetUser をモック化する例を記載する。
本記事では、AWS SDKをpromise込みでコールしている。 
このため、`moduleA.cognitoidp.adminGetUser`のモック化と、返却オブジェクトのメソッドである`promise`のモック化をそれぞれ行なっている。 
async/awaitを使用する場合は以下のようにする必要があるはず。

```javascript:module.spec.js
const moduleA = require('module_a')

test('exist cognito user', async () => {
    moduleA.cognitoidp.adminGetUser = jest.fn()
      .mockReturnValue({
        promise: jest.fn()
          .mockResolvedValue({
            UserAttributes: [
              {
                attr: "value"
              }
            ]
          })
      })
  ...
```
Bootstrap4で中央揃えをしてみる。

bootstrap4になり、簡単にcontainerクラスの中のブロック要素が中央揃えできるようになりました。

##コード
```HTML5:html.html
<div class="container">
    <div class="row justify-content-md-center">
        <div class="col-md-auto">
            hogehoge
        </div>
    </div>
</div>
```

これでhogehoheのdiv要素が中央揃えになります。
[一時メモ]Laravelのbladeのsessionについて

# bladeのsessionってなんだこれ？

[フラッシュデータを保存するリダイレクト](https://readouble.com/laravel/5.5/ja/responses.html)

を読んでください。

```php:php側
Route::post('user/profile', function () {
    // ユーザープロフィールの更新処理…

    return redirect('dashboard')->with('status', 'Profile updated!');
});
```

```php:blade.php
@if (session('status'))
    <div class="alert alert-success">
        {{ session('status') }}
    </div>
@endif
```

ザックリ言うと、`redirect()->with()`のメソッドの中でsessionに一時的に保存しているようです。

詳しくは後ほど調べます。
Django で データベースの値をコピー

次でやっていることを、Django のカスタムコマンドでやってみました。
[Mariadb で　ユーザー定義変数を使って値をコピー](https://qiita.com/ekzemplaro/items/b347d84c64fd5665487b)

```py:management/commands/population_copy.py
# ------------------------------------------------------------------
#
#	management/commands/population_copy.py
#
#						Feb/18/2019
#
# ------------------------------------------------------------------
from django.core.management.base import BaseCommand
from city.models import City

# ------------------------------------------------------------------
class Command(BaseCommand):
	help = 'Display cities'

	def handle(self, *args, **kwargs):
		city_a = City.objects.get(code ='t3328')
		vx = city_a.population
		city_b = City.objects.get(code ='t3329')
		setattr(city_b,'population',vx)
		city_b.save()
#
# ------------------------------------------------------------------
```

実行方法

```bash
./manage.py population_copy
```

実行前のテーブル

```text
| t3328 | 高梁   |     987654 | 2001-09-11 |
| t3329 | 新見   |     152978 | 2001-10-02 |
```

実行後のテーブル

```text
| t3328 | 高梁   |     987654 | 2001-09-11 |
| t3329 | 新見   |     987654 | 2001-10-02 |
```

参考ページ
[Django のカスタムコマンドの作り方](https://qiita.com/ekzemplaro/items/7349d43388abfd8ca2db)
opencv.jsの作法 その4

# 概要

opencv.jsの作法を調べてみた。

# 実行環境

sandboxを用意した。以下のコードは動く。
https://s.codepen.io/ohisama/debug/VgVgQV/bYAdyeDvYGYk

# 彩度をいじる

```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	cv.cvtColor(src, dst, cv.COLOR_RGB2HSV)
	for (let i = 0; i < dst.rows * dst.cols * 3; i += 3)
	{
		dst.data[i + 1] *= 2;
	}
	cv.cvtColor(dst, dst, cv.COLOR_HSV2RGB)
	cv.imshow('canvasOutput', dst);
	src.delete();
	dst.delete();
```

# オレンジを残す

```javascript
	let src = cv.imread('canvasInput');
	let dst = new cv.Mat();
	let hue_min = 0;
	let hue_max = 20;
	cv.cvtColor(src, dst, cv.COLOR_RGB2HSV)
	for (let i = 0; i < dst.rows * dst.cols * 3; i += 3)
	{
		if (!((hue_min <= dst.data[i + 0]) && (dst.data[i + 0] <= hue_max))) 
		{
			dst.data[i + 1] = 0;
		}
	}
	cv.cvtColor(dst, dst, cv.COLOR_HSV2RGB)
	cv.imshow('canvasOutput', dst);
	src.delete();
	dst.delete();
```

以上。
xerrors - 関連情報

## 日本語情報

### xerrors パッケージ
- [Goの新しいerrors パッケージ xerrors](https://qiita.com/sonatard/items/9c9faf79ac03c20f4ae1)
- [xerrors - エラー設計の注意点](https://qiita.com/sonatard/items/c8d0ae72c50f625522a0) 
- [xerrorsパッケージがWrapメソッドではなく : %w でラップする理由](https://qiita.com/sonatard/items/7b15258fa19f939b1323)
- [xerrors パッケージ - 独自に定義したエラー型はIsメソッドとAsメソッドでデフォルトの振る舞いを変更可能](https://qiita.com/sonatard/items/c6da1a895b2ca7e0f13f)
- [xerrors パッケージで途中に独自定義したエラー型をラップする方法](https://qiita.com/sonatard/items/e0f866f44717c0501f7a)
  - ラップするライブラリ [Github - sonatard/werror](https://github.com/sonatard/werror)
- [Go で静的解析して Go 1.13 から標準の xerrors とうまく付き合っていく](https://qiita.com/sachaos/items/f6b3e66931d7f73dd68d)

### Go 1.13のerrors パッケージ
- [GoDoc - package errors](https://godoc.org/errors)
- 私はGo 1.13のerrorsパッケージを解説する記事は現在執筆していません

## xerrorsの移行手順

- [xerrorsへの移行手順](https://qiita.com/sonatard/items/5afd13a7640e628ee4d2)
  - Go 1.12までに新しいラップ機能を使いたい場合はこちら
- [xerrorsからGo 1.13のerrorsへの移行手順](https://qiita.com/sonatard/items/9204e46c263d1a0f0d6a)
  - Go 1.12までにxerrorsに移行したあとに、Go1.13がリリースされた場合はこちら
- [Go 1.13のerrorsへの移行手順](https://qiita.com/sonatard/items/c9b985c2022cf5e438e9)
  - Go 1.12までにxerrorsを使わず、Go1.13がリリースされた場合はこちら

### error一般
- [エラーを検査する](https://qiita.com/methane/items/748014cbb5f71ee6f04f) 

## Go 1.13以降のエラーについて公式ドキュメント
- [ErrorValueFAQ](https://github.com/golang/go/wiki/ErrorValueFAQ)

## 2019/1/25 最新提案
-  エラー検査 [Proposal: Go 2 Error Inspection](https://go.googlesource.com/proposal/+/master/design/29934-error-values.md)
  - [proposal: Go 2 error values #29934](https://github.com/golang/go/issues/29934)
- [Go 1.13 errorsパッケージの実装](https://go-review.googlesource.com/c/go/+/162180/)
  
今までのドラフトや議論を元に現在の最新の提案がまとめられている。
xerrorsパッケージとして実装も用意されている。以前との大きな違いは、Asメソッドがcontractを利用した実装ではなくなったこと。 

Go 1.13からerrorsパッケージに組み込まれる予定である。


## 2018/8/27 初期提案
-  エラー検査 設計のドラフト  [Error Inspection — Draft Design](https://go.googlesource.com/proposal/+/master/design/go2draft-error-inspection.md)
  - [proposal: Go 2: add a Causer interface for errors](https://github.com/golang/go/issues/27020)
  - [proposal: Go 2: adopt Cause and Wrap from github.com/pkg/errors #25675](https://github.com/golang/go/issues/25675)
- エラー出力 設計のドラフト [Error Printing — Draft Design](https://go.googlesource.com/proposal/+/master/design/go2draft-error-printing.md)
- エラーの値 問題の概要 [Error Values — Problem Overview](https://go.googlesource.com/proposal/+/master/design/go2draft-error-values-overview.md)
- ユーザからのフィードバック [Go 2 Error Values Feedback](https://github.com/golang/go/wiki/Go2ErrorValuesFeedback)
【Python】Tkinterを使った雛形（クラス化手法）

# はじめに
最近はPythonを主に勉強していて、特にtkinterに触れていました。
ある程度、最初の形が定まってきたので、ここに記そうと思います。

# 環境
- Windows 10 home
- Python 3.7.1


# クラス化手法による雛形

```Tkinter.py
import tkinter as tk

class Application(tk.Frame):
	def __init__(self,master):
		super().__init__(master)
		self.pack()

		master.geometry("300x300")
		master.title("雛形")


def main():
	win = tk.Tk()
	app = Application(master=win)
	app.mainloop()


if __name__ == "__main__":
	main()
```


# 実行

<img width="225" alt="実行.PNG" src="https://qiita-image-store.s3.amazonaws.com/0/309633/181ad39a-c903-0820-0b8c-a92422646021.png">

このような画面が出れば、成功です。



# 実装例

上記の雛形を拡張した例を下記に記します。
スペースキーを押すと三角形の図形が右斜め下に動くものです。

![move.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309633/87861317-d6ae-5b4a-c94f-83e349b6aa61.gif)



```Test.py
import tkinter as tk

class Application(tk.Frame):
	def __init__(self,master = None):
		super().__init__(master)
		self.pack()

		master.geometry("300x300")
		master.title("Test")

		self.canvas = tk.Canvas(master, width=300, height=300)
		self.canvas.pack()

		self.canvas.create_polygon(10,10,10,60,50,35,tag="id1")

		master.bind("<space>",self.move)

	def move(self,event):
		self.canvas.move("id1",5,5)


def main():
	win = tk.Tk()
	app = Application(master = win)
	app.mainloop()


if __name__ == "__main__":
	main()
```




応用例

- [【Python】Tkinterによる200行で作るGUIアプリ「英単語ソフト」](https://qiita.com/MichihiroTsukano/items/20e67c92bd077b095885)
- [【Python】Tkinterによる150行で作るGUIアプリ「じゃんけんゲーム」](https://qiita.com/MichihiroTsukano/items/6272553e7dace156c35a)
- [【Python】Tkinterによる40行で作るGUIアプリ「ハッシュ化ソフト」](https://qiita.com/MichihiroTsukano/items/de1183c43a64a2c7668d)
- [【Python】Tkinterによる70行で作るGUIアプリ「追いかけっこゲーム」](https://qiita.com/MichihiroTsukano/items/3b53af7ed9558972cd6e)
- [【Python】Tkinterによる100行で作るGUIアプリ「おみくじ」](https://qiita.com/MichihiroTsukano/items/85b9f28c1c8ad3e0c583)
- [【Python】Tkinterによる80行で作るGUIアプリ「簡易電卓」](https://qiita.com/MichihiroTsukano/items/09e90986dbc3c92cae66)



その他書き方

- [PythonによるTkinterを使った雛形（MVCモデル）](https://qiita.com/MichihiroTsukano/items/8687962247cae41625f7)