OmniAICreator/Qiita-1.07M huggingface dataset:
Raspberry Pi 4とUVCでUV4Lを用いLAN内ビデオストリーミング

#前提条件
+ Raspberry Pi OS ver : Raspbian Buster　が正常にインストールされている。
+ WiFiかethernetでLANに接続できている。
+ [HDMI→USB ビデオキャプチャ](https://www.amazon.co.jp/dp/B08TTZCVJ2)
+ [SDI→HDMI変換機](https://www.amazon.co.jp/dp/B01B67AFGY)
+ [SDIカメラ STC-HD203SDI](https://sentech.co.jp/products/DVI-SDI/SDI.html#cnt2nd)
+ Raspberry Pi 4 Model B / 4GB

#参考にしたQiita
https://qiita.com/sp_ice/items/7f15e262fffd69d3375c


###インストールのためのキーを取得し設定する。
```
$ curl https://www.linux-projects.org/listing/uv4l_repo/lpkey.asc | sudo apt-key add -
```

###ファイル　/etc/apt/sources.list　をテキストエディタ（sudo vi /etc/apt/sources.list）などで以下の行を追加

```
deb https://www.linux-projects.org/listing/uv4l_repo/raspbian/stretch stretch main
```

###UV4Lをインストール

```
$ sudo apt-get install uv4l uv4l-webrtc uv4l-uvc uv4l-xscreen uv4l-dummy
```

###USBカメラ接続確認

```
$ lsusb
```
自分が使うUVCカメラのID xxxx:xxxx をメモ。


###uv4l起動

```
$ uv4l --driver uvc --device-id 1dd8:0018 --config-file=/etc/uv4l/uv4l-uvc.conf
```

###WEBブラウザからアクセス

http://<ラズベリーパイのIPアドレス>:8090/stream/webrtc

にアクセスし、下のほうの Call ボタンをクリックするとストリーミング再生開始。

###uv4lの終了方法
```
$ pkill uv4l
```
Rubyで解くAtCoder ABC 194 (B,C問題のみ)

# B - Job Assignment
https://atcoder.jp/contests/abc194/tasks/abc194_b

## こう考えました
従業員に0から番号を割り振って，仕事A,B(変数名は1,2でつけてしまったけど・・・)の時間を従業員番号をキーとしたハッシュに入れる。
それぞれで早くできる順に2名を選抜。

もし，それぞれのトップが別々の従業員の場合
→２つの時間のうち，大きいものを出力。

それぞれトップが同じ従業員の場合
→どちらか片方を2番目の従業員にした場合の時間，トップが両方やる時間のうち，小さいものを出力。

## 提出コード

もっと簡単に出せる手法はありそうだけど・・・

```ruby:ABC194_B.rb
N = gets.to_i
t_1 = {}
t_2 = {}

N.times do |i|
  w_1, w_2 = gets.split.map(&:to_i)
  t_1.store(i, w_1)
  t_2.store(i, w_2)
end

rank_1 = t_1.min(2){|x, y| x[1] <=> y[1]}
rank_2 = t_2.min(2){|x, y| x[1] <=> y[1]}

first_1, second_1 = rank_1[0], rank_1[1]
first_2, second_2 = rank_2[0], rank_2[1]

if first_1[0] != first_2[0]
  puts [first_1[1], first_2[1]].max
else
  puts [[first_1[1], second_2[1]].max , [second_1[1], first_2[1]].max , first_1[1] + first_2[1]].min
end
```


# C - Squared Error

https://atcoder.jp/contests/abc194/tasks/abc194_c

## 愚直にやったらTLE・・・

全部の組み合わせを配列にして，それぞれで計算した和を計算すれば・・・
（ちょうど教えてもらった`sum`にブロックを与える形が使える！）
→TLEでした。計算回数を減らさなきゃいけない・・・

```ruby:ABC194_C.rb
gets
num = gets.split.map(&:to_i)
puts num.combination(2).to_a.sum {|i,j| (i-j)*(i-j) }
```


## 解説を少し見た

数列の長さはかなり大きいけど，与えられる数値は -200〜200 なので，数値ごとの個数を配列にすればいい！
（ちょうど教えてもらった`tally`が使える！）

ハッシュにまとめてからkeyもvalueも別々に配列化し，あとは全部の組み合わせについて計算しました。
（係数としてそれぞれの数の個数をかければいいので，計算回数が大幅に減りました）

## 提出コード

```ruby:ABC194_C.rb
gets
arr = gets.split.map(&:to_i)
hash = arr.tally

num = hash.keys
cnt = hash.values
n = num.size
sum = 0

(1..n-1).each do |i|
  (0..i).each do |j|
    sum += (num[i] - num[j]) * (num[i] - num[j]) * cnt[i] * cnt[j]
  end
end

puts sum
```
陣取りのターン数 Java編（解決）【paiza Aランクレベルアップメニュー】

https://qiita.com/shidoh78/items/b6b0597cbc753eb864d6

**　解決しました。**

```java:Main.java
import java.util.*;
import java.util.Queue;
import java.util.ArrayDeque;


public class Main {
    public static void main(String[] args) {
        Scanner sc = new Scanner(System.in);

        int h = sc.nextInt();
        int w = sc.nextInt();
        int n = sc.nextInt();
        String map[][] = new String[h][w];  //陣

        Queue<XY> q = new ArrayDeque<>();   //キュー

        for(int i=0; i<h; i++){ //初期化
            String temp = sc.next();
            for(int j=0; j<w; j++){
                map[i][j] = String.valueOf(temp.charAt(j));
                if(map[i][j].equals("*")){
                    q.add(new XY(i, j, 1)); //スタート地点（初期値のy, x, 1が入っている）
                }
            }
        }
        
        int l[] = new int[n]; 
        int lcount = 0; //引数
        
        for(int i=0; i<n; i++){
            l[i] = sc.nextInt();
        }
        Arrays.sort(l);  //?にする手番を昇順に格納

        while(q.size() > 0){
            XY xy = q.poll();
            int y = xy.y;
            int x = xy.x;
            int d = xy.d;
            
            String in = "*";    //書き込むテキスト。初期値は*。
            
            if(l[0] == 0 && d == 1 && lcount < n){  //0が入っている。初期地点を？にする場合
                map[y][x] = "?";
                lcount++;
            }
            
            //dがl[lcount]と同じなら?を入れる
            //lcountを1増やす
            //この時nを越えた時点でIndexOutになる。lcountがn-1に来た時点で増加処理を通させない
            //→一度上限まで来てしまったら判定の必要がないと言える
            //増加条件を「一致したとき」にしてしまうと、最初の一回でlcountが動いてしまう
            //l[lcount]の値がdより小さいとき
            
            if(l[lcount] < d && lcount < n-1){   //ここが！！！
                lcount++;
            }
            if(l[lcount] == d){    //逆！！！
                in = "?";
            }

            if(y > 0 && map[y-1][x].equals(".")){   //上
                map[y-1][x] = in;
                q.add(new XY(y-1, x, d+1));
            }
            if(y < h-1 && map[y+1][x].equals(".")){   //下
                map[y+1][x] = in;
                q.add(new XY(y+1, x, d+1));
            }
            if(x < w-1 && map[y][x+1].equals(".")){   //右
                map[y][x+1] = in;
                q.add(new XY(y, x+1, d+1));
            }
            if(x > 0 && map[y][x-1].equals(".")){   //左
                map[y][x-1] = in;
                q.add(new XY(y, x-1, d+1));
            }
        }

        for(int i=0; i<h; i++){ //出力
            for(int j=0; j<w; j++){
                System.out.print(map[i][j]);
            }
            System.out.println("");
        }
    }
}

class XY{
    int y;
    int x;
    int d;

    XY(int y, int x, int d){
        this.y = y;
        this.x = x;
        this.d = d;
    }
}
```

```Java            
            if(l[lcount] < d && lcount < n-1){   //ここが！！！
                lcount++;
            }
            if(l[lcount] == d){    //逆！！！
                in = "?";
            }
```

　こういうオチでした。
　引数を増やすタイミングが遅かったんですね。
「持ってこられたd（探索深度）が、今参照したいl[lcount]（？にしたい探索深度）より大きければ、引数を増やす」
　んだから、
「先に今の引数とあってるかどうか確認して、それから増やす」じゃ上手くいかないの当然です。

　よし、ようやくハマりを抜けた。
　Ａランク相当問題にチャレンジ出来るぞう。
terrafomerでの既存のリソースの取り込み手順


最近AWSのリソースをterraformerで取り込むことが多く、その中でいくつかハマりどころがあったので手順をまとめる。

![logo-hashicorp-3f10732f.svg.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/69711/253f50ba-4a04-5274-84e2-9e0c358a6beb.png)


### 1. terraformerで取り込み
必要なリソースをterraformerで取り込む。

```shell
$ terraformer import aws --resources=hoge --profile=fuga --path-pattern ./
```

### 2. state mvでresource名を管理しやすい名前に変更
terraformerが生成するresoure名は、既存のリソースのIDから生成したりしてわかりにくかったりするので、state mvで変更する。
全resourceにたいして行う（つらい）

```shell
$ terraform state mv aws_s3_bucket.tfer--abcdefghijklmn aws_s3_bucket.fuga
```

### 3. 必要に応じてmodule化
既存のresoureをmoduleにして管理しやすくする。
もしくは既にmoduleがあれば、それを利用してresourceを書き直すのでも良い。

### 4. providerをreplaceする
自分は、手順3でにmoduleに書き直した直後にplanを実行すると、下記のようなエラーが出た。

```shell
$ terraform plan
Refreshing Terraform state in-memory prior to plan...
The refreshed state will be used to calculate this plan, but will not be
persisted to local or remote state storage.


Error: Provider configuration not present

To work with aws_s3_bucket.hoge its original provider
configuration at provider["registry.terraform.io/-/aws"] is required, but it
has been removed. This occurs when a provider configuration is removed while
objects created by that provider still exist in the state. Re-add the provider
configuration to destroy aws_s3_bucket.hoge, after which you
can remove the provider configuration again.
```

どうもterraformerがimportする際に、providerとして昔の形式 `registry.terraform.io/-/aws` で取り込んでしまうっぽい？
なので、terraform v0.13以降で使用される新しいproviderの形式 `registry.terraform.io/hashicorp/aws` に変更する必要がある。

```shell
$ terraform state replace-provider 'registry.terraform.io/-/aws' 'registry.terraform.io/hashicorp/aws'
```

### 5. state mvでresourceからmoduleに変更
ただresourceからmoduleに書き換えただけだとterraformは差分を検知できず、destroy & addしようとするので、state mvでresourceとmoduleを紐つけてやる。

```shell
$ terraform state mv aws_acm_certificate.hoge module.acm_hoge.aws_acm_certificate.acm
```

### 6. terraform planで差分が出ないことを確認
```shell
$ terraform plan
...
...
Plan: 0 to add, 0 to change, 0 to destroy.

------------------------------------------------------------------------

Note: You didn't specify an "-out" parameter to save this plan, so Terraform
can't guarantee that exactly these actions will be performed if
"terraform apply" is subsequently run.
```

### 7. backendをs3等に変更
terraformerはデフォルトだとbackendをlocalにしてしまうので、s3等に変更して誰でもいじれるようにする。

```text:backend.tf
terraform {
  backend "s3" {
    bucket                  = "hoge-backend"
    key                     = "tfstate.json"
    region                  = "ap-northeast-1"
  }
}
```
```shell
$ terraform init --reconfigure 
```

## 余談
最初、手順4のエラーがわからず悩まされた。
最終的に下記のstackoverflowを参考にして解決。
https://stackoverflow.com/questions/63590836/switch-terraform-0-12-6-to-0-13-0-gives-me-providerregistry-terraform-io-nul

あとterraformerで取り込むと、毎回resourceをmvしなきゃいけないのはつらい。
prefixを事前に与えるとかしていい感じの名前をつけてほしいんだけど、厳密には難しいんだろうなーって思ったり。
terraformerでの取り込みは腕力が必要ですね。はい。
Cloud9でのLaravel環境構築に手こずっている人に捧ぐ

#はじめに
Cloud9の環境を立ち上げておいてください！
環境構築を完了させることに焦点を当てているため、コマンドの意味については細かく触れませんが、今後のためにわからない方はご自身で調べてみることをお勧めします！
#yumのアップデートを行う
cloud9の画面に表示されているbash(ターミナル)を使っていきます。
まずcloud9のパッケージ管理ツールであるyumのアップデートから行いましょう。
下記のコマンドを実行します。

```
$ sudo yum -y update
```
最後の行に「Complete!」と表示されていれば大丈夫です。
AmazonLinuxにはPHPがデフォルトで入っているのですが、一応バージョンを確認しましょう。
#PHPのバージョンを確認する

```
$ php -v
```
これでPHPのバージョンが表示されます。最新のものになっていたらいいのですが、古いバージョンの場合はアップデートしましょう。
ちなみに現時点の最新のものはPHP7系になりますが、僕の時は最新のものになってました。
バージョンアップが必要な方は以下のQiita記事などを参考にしてください。
https://qiita.com/kidatti/items/2d6a4a24f89dc71eb66e

#必要なモジュールをインストールする
PHPパッケージの中に必要なモジュールが入っているか確認しましょう。
以下のコマンドを実行します

```
$ php -m
```
モジュールのリストの中に、mbstring、pdo、mysqlndが入っていればOK,入っていないものがあればインストールしていきます。
例えば、mbstringが入ってなかった場合はまずは以下のようにコマンドで、インストールするモジュールの名前を一応確認しておきます。

```
$ sudo yum list | grep mbstring
```
次に、実行結果の中から「php-mbstring」の文字列をコピーして、下記のようにペーストして実行しましょう。

```
$ sudo yum -y install php-mbstring
```
pdoやmysqlndがなかった方はmbstringの部分を書き換えればOKです。

#Laravelのパッケージ管理ツールをインストールする
コンポーザーというLaravelのパッケージ管理ツールをCloud9環境にインストールしていきます。
以下のコマンドを実行しましょう。

```
$ curl -sS https://getcomposer.org/installer | php
```

これでコンポーザーの実行ファイルがインストールされているはずです。確認のため以下のコマンドを実行しましょう。

```
$ ls
```
「composer.phar」というファイルがあればちゃんとインストールされています。
次に、どこでも使えるようにするために、ローカルにファイルを移動させましょう。
以下のコマンドを実行します。

```
$ sudo mv composer.phar /usr/local/bin/composer
```

では、コンポーザーを実行してみます。

```
$ composer
```

これでコンポーザーがインストールされました。しかし、全てのファイルがインストールされていない可能性があるため、以下を実行してアップデートします。

```
$ composer update
```
#Laravelを起動する
Laravelアプリを作成するために以下のコマンドを実行します。
「my-laravel」の部分はアプリ名のため、ご自身の好きなものに変更してOKです。
「"5.5.*"」の部分はLaravelのバージョンを示しているため、希望のバージョンに変更していただいてOKです。

```
$ composer create-project laravel/laravel my-laravel "5.5.*" --prefer-dist
```
作成が終わったら、以下のコマンドを実行してご自身のつけたアプリ名が表示されるか確認します。

```
$ ls
```
しっかり入っていればOKです。では、ディレクトリを移動します。
※ここでも「my-laravel」のところはご自身のアプリ名を入力します。

```
$ cd my-laravel
```
ディレクトリの中身を確認してみましょう。

```
$ ls
```
「artisan」というのがあることを確認したら、次のコマンドを実行します。

````
$ php artisan key:generate
```

そして、下記のコマンドを実行します。

```
$ php artisan serve --port=8080
```

これで、Cloud9のツールバーにある「Preview」から「Preview Running Application」でLaravelが起動できれば完了です。
お疲れ様でした！！
AWSSummit2021 Day1 走り書き Keynote

# AWS Summit online
こちらに参加したので気になった部分を走り書きしていきます(全てをメモするわけじゃないのでご容赦を)

https://aws.amazon.com/jp/events/summits/online/japan/

# 基調講演 テクノロジーが変えるこれからの日本社会
- リージョンの考え方が他の企業と違う
    - AWS: 複数のAZを保有することでより高い可用性を実現
- 大阪リージョンの公開
    - 国内で複数のリージョンによる構成が可能に
    - 1国で複数リージョンを持っている国は少ない
- AWS Wavelength Zone
    - 5Gネットワークに対応したエッジサービス(KDDI)
    - キャリアのネットワーク内で解決することで低レイテンシーを実現
- AWSのイノベーションを起こす方法
    - お客様最優先でそこから逆算して考える
    - 開発を続けるためのリーダーシップ8箇条
        - 発明し続けるリーダーの意思
        - 時代の流れには逆らえないという認識
        - 発明に対する強い意欲を持った人材
        - お客様の真の課題を解決するという観点
        - まずは初めてみること
        - 関係者を少なくシンプルに
        - 多くの機能と豊富なツールセットを兼ね備えたプラットフォームの活用
        - トップダウンによるアグレッシブな目標設定と推進
- クラウド利用とオンプレ利用(DeNA南波さん)
    - issue:
        - コスト: 通常オンプレコストの2倍だったものを圧縮できるか
        - 移行時間: 3y
    - QCD
        - Q: オンプレでできたものはクラウドでもできるはず
        - D: クラウドに部がある
        - C: オンプレの方がいい
            - 仮説: クラウドとほぼ同等なのでは？
            - 人材
            - AWSコストの50%でオンプレと同等
            - DeNAの対応内容
                - ステートレスサーバーはスポットインスタンスを活用
                - オートスケーリングとDeNA独自のScaling対応
                - Shardingの調整
            - 結果
                - 達成(すごい。。。)
    - 移行期間の長さ
        - エンジニアとしてダイナミックな流動性・シナジーを維持
        - 標準化を最初に徹底することにより以降は素早く行えるようにした
            - 標準化: 1年3ヶ月
            - 移行: 単一プロダクトでは3ヶ月いない
                - 移行期間を短くすることでダイナミックな人材流動性を確保
- AWS ITトランスフォーメーションパッケージ
    - https://aws.amazon.com/jp/blogs/news/itx-package-support-customers-migration/
    - クラウドにマイグレーションを支援するパッケージ
    - 評価->計画立案->移行
- スモールスタートアップのビジネスをAWSで実現する[RABO 伊豫さん](https://rabo.cat/)
    - [catlog](https://rabo.cat/catlog/?argument=dFEVquVL&dmai=a605bff916cb06&gclid=Cj0KCQjws-OEBhCkARIsAPhOkIZ9KdyCN898CPnvlxnausffgabzAP0tFCpojRZD2XWethDpzRDGyyEaAgmNEALw_wcB)
    - 猫様専用IoT
    - IoT機器のログををAWS Fargateと機械学習でアプリに反映
    - 7億件のログが既にある
- クラウドの人材について
    - クラウドを活用する上で人材が大切
    - 必要人材数 年間+40％
    - イノベーションを繰り返す土壌を作る
        - 今まで: ローンチが目標であり、そのあとは塩漬けするケースが多い
        - これから: 小さく作ってサービスを進化させスケールアップダウンをさせる
[Nuxt.js]SSR時のエラー画面を切り替える

この記事ではNuxt.js v2系での説明となります。

Nuxt.jsではCSR時のエラーとSSR時のエラーで出力される画面が異なります。
CSR時であれば`app/layouts/error.vue`が利用され、カスタマイズすることが可能です。

しかしSSR時に、例えばfetchで呼び出したaxiosのレスポンスのステータスコードが500系だった場合`app/layouts/error.vue`は利用されず、Nuxt.js独自のエラー画面が出力されます。

![2021-05-11 11.49.38 localhost 248a51c44c06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/89213/6741cb62-3df3-c57e-d3eb-2f55ac474d96.png)


SSR時のエラーページを変更する場合 `app/views/error.html` を変更することで独自のエラー画面を作成することができます。
※`srcDir: 'app',`としている場合は`app/app/views/error.html`となります。（ややこしい）

![2021-05-11 12.00.32 localhost 16a07b49040b.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/89213/8cba854b-7592-d9f7-1b0a-625b07efded4.png)
（スクショが簡素すぎた）

しかし、この場合だと表現できるエラーページは1種類となります。
ステータスコード別にエラーページを分けたい場合はどうしたら良いでしょうか。

# ステータスコード別にエラーページを分ける

`nuxt.config.js`の定義でhooksを利用することでNuxtアプリケーションがエラーになった場合に処理を差し込むことができます。
これを利用して任意のエラーページを表示させることが可能です。

hooksの`render.errorMiddleware`がNuxtアプリケーションがエラーになった場合に実行されます。
https://ja.nuxtjs.org/docs/2.x/internals-glossary/internals-renderer#%E3%83%95%E3%83%83%E3%82%AF

下記のコード例ではhttp statusが503の場合は`your/path/errors/503.html`が表示されそれ以外は`your/path/errors/error.html`が表示されます。
ステータスコード別のページを増やす場合は`case`を適宜追加することで動的に出し分けることが可能です。

```js:nuxt.config.js
import fs from 'fs'

///

hooks: {
  render: {
    errorMiddleware(app) {
      app.use((error, _req, res, next) => {
        const status = error.response.status
        if (status >= 500) {
          res.statusCode = status
          res.setHeader('Content-Type', 'text/html; charset=utf-8')
          let html
          switch (status) {
            case 503:
              html = fs.readFileSync(`your/path/errors/${status}.html`)
              break
            default:
              html = fs.readFileSync('your/path/errors/error.html')
          }
          res.end(html)
          return
        }
        next(error)
      })
    }
  }
},
```

（この機能、デフォルトで入っててほしいなー）
nordic の Flash Data Storage (FDS)ライブラリに関する症状

備忘録
追記中
なにかあればコメント欄でお願いします。

# 症状
<!-- 発端や概要を記載 -->
CPUに対しeraseを行った後、再びソースを書き込み起動。
その際にfds_init()をコールすると応答イベントが返ってこず、そこで停止してしまう。
複数回再起動するなどして動くようになる、また一度動作した後は何度再起動しても上記の症状は発生しない。

```c
// FDS_EVT_INITイベント応答が来るとfds_readyがtrueになるようにしているが
// erase直後にこの関数を走らせるとwhile(fds_ready != true);から一生抜け出せない
static bool fds_ready = false;
uint32_t flash_data_storage_init(void){
	uint32_t err_code = NRF_SUCCESS;
	fds_ready = false;
	if((err_code = fds_register(flash_data_storage_event_handler)) == FDS_SUCCESS){
		if((err_code = fds_init()) == FDS_SUCCESS){
			while(fds_ready != true);
			err_code = NRF_SUCCESS;
		}
	}
	return err_code;
}
```

# 原因
[fdsやbleには根本的なバグがあるらしく](https://devzone.nordicsemi.com/f/nordic-q-a/50851/fds_init-failure-and-recovery-options)、そのうちの一つとして初期化順序によって動いたり動かなくなったりするものがあるとのこと（参考元のサイトがどれだったかは忘れた）。
根本的な原因は不明。


# 解決策
初期化順序を変更した、特にbleやfdsの初期化順序を変更すると治る場合がある。
(逆に動かなくなる場合もある)

```c
fds_init();
ble_init();
↓
ble_init();
fds_init();

```
【Node.js】WatsonサービスをSDKを使わずに呼び出す

# はじめに

Node.jsでIBMの提供するWatsonサービスをSDK（[ibm-watson](https://www.npmjs.com/package/ibm-watson)）を使わずに呼び出すコードを備忘録のために残します。

IAM認証せずにWatsonサービスを呼び出すので、外部のpublicなインターネットに接続のできないIBM CloudのIaaS環境からWatsonサービスを呼びたいとき、Watsonサービスをさくっと触りたいときなどに有効な方法です。

※アプリケーションがSDKを使ってWatsonサービスを呼び出す仕組みになっているが、実行環境でIAM認証出来ない（publicなインターネットに接続できない）場合には、IamAuthenticatorの代わりに、BasicAuthenticatorを使えばよいです。

今回はWatson DiscoveryというAI文書探索サービスのquery APIを呼び出すサンプルです。

# セットアップ

今回はHttpクライアントとして、[axios](https://www.npmjs.com/package/axios)を使用します。

```
npm install axios
```

# コード

Watson Discoveryのquery APIにリクエストを送ってレスポンスをjsonファイルに出力するサンプルです。

`<xxx>`の部分は各自の環境の値に置き換えてください。

```request_test.js
const axios = require('axios').default;
const fs = require('fs');

const username = 'apikey';
const password = <apikey>;
const instanceId = <instanceId>;
const projectId = <projectId>;
const version = '2019-11-29'
const endpoint = 'https://api.jp-tok.discovery.watson.cloud.ibm.com';

const headers = {
  'Content-Type': 'application/json'
};
const auth = 'Basic ' + Buffer.from(username + ':' + password).toString('base64');

const instance = axios.create({
  baseURL: `${endpoint}/instances/${instanceId}`,
  timeout: 10000,
  headers,
});

instance.defaults.headers.common['Authorization'] = auth;

const url = `/v2/projects/${projectId}/query?version=${version}`;

const count = 10000;
const filter = '';

instance.post(url, {
  naturalLanguageQuery: 'サンプルクエリ',
  count,
  filter,
})
.then(function (response) {
  fs.writeFileSync('./response.json', JSON.stringify(response.data, null, 2));
})
.catch(function (error) {
  console.log(error);
});
```

# 参考
- [IBM Cloud API Docs Discovery v2](https://cloud.ibm.com/apidocs/discovery-data#introduction)
- [IBM/node-sdk-core](https://github.com/IBM/node-sdk-core#readme)
    - API Docsでサンプルで提示されているIamAuthenticatorの実装についてはここで確認できます。私はこのライブラリを眺めていてBasicAuthenticatorというauthenticatorの存在を知りました。
JavaScriptで日付のバリデーションチェックをする方法

```
var yyyy = document.form.year.value;
var mm = document.form1.month.value;
var dd = document.form2.date.value;
var date = new Date(yyyy, mm-1, dd);
	
	
	if(date.getFullYear() != yyyy || date.getMonth() != mm-1 || date.getDate() != dd) {
		alert("期限の入力が不正です。");
	} else {
		window.location.href = 'sample.html';
	}
```

##解説
想定しているのは、○年○月○日というように、○の部分を入力フォームにして、整合性チェックをするというもの。
正しい日付が入力されたら画面遷移するプログラムとなっている。

まずは、フォームに入力された値を取得してそれぞれの変数に代入。
getMonth()は、デフォルトでは0～11の範囲を取るので、mm-1とすることで整合性を取る。
それぞれの変数がgetFullYear()、getMonth()、getDate()と比較して正しい値かチェック。どれか1つでも不適合ならアラートを出す。

##ハマったエラー
存在しない日付を入力しても、バリデーションを通過してしまうエラーが発生。ネットの通りに書いてもなぜか通貨…。コードを見直すと、getMonth()の()の記述漏れでした。。
気づくのに1時間かかってしまった…
React DnD: v11.0以降の後方互換性を破るアップデート

[React DnD](https://react-dnd.github.io/react-dnd/about)は、Reactアプリケーションでドラッグ&ドロップを実現するライブラリです。公式の「[Tutorial](https://react-dnd.github.io/react-dnd/docs/tutorial)」にもとづいて1年前につくった作例が、少し前にライブラリをアップデートしたら動かなくなりました。昨年使ったライブラリがv10.0.2、最新はv14.0.2です。更新が頻繁なのは喜ばしいというべきでしょう。けれどその間、後方互換性を破る更新がいくつかありました。それらを書きとめておきます。

なお、v14.0に合わせてチュートリアルシリーズ「[Create React App + React DnD](https://www.fumiononaka.com/Business/index.html#Create_React_App)」(全4回)を書きました。「Tutorial」の作例を実際につくってみたい方は、ぜひご覧ください(各回の解説の結びにCodeSandboxのサンプルを公開しています)。


# `HTML5Backend`は名前つきで`import`する
まず、[v11.0.0](https://github.com/react-dnd/react-dnd/releases/tag/v11.0.0)で、`HTML5Backend`が`export default`でなくなりました。したがって、`HTML5Backend`は名前つきで`import`しなければならないということです。

```react
// import HTML5Backend from 'react-dnd-html5-backend'
import { HTML5Backend } from 'react-dnd-html5-backend'
```

理由は、つぎのように説明されています。つまり、ライブラリの開発方針として`export default`はできるだけ使わないようにしたそうです。実際、公式「Tutorial」の[作例](https://codesandbox.io/s/github/react-dnd/react-dnd/tree/gh-pages/examples_hooks_js/00-chessboard)も、コンポーネントの`export`は基本的に名前つきになっていました。

> In general, throughout the app we've minimized the usage of default exports as well.


# `useDrag`と`useDrop`の引数はコールバック関数で仕様オブジェクトを返す
[v13.0.0](https://github.com/react-dnd/react-dnd/releases/tag/13.0.0)では、[`useDrag`](https://react-dnd.github.io/react-dnd/docs/api/use-drag)と[`useDrop`](https://react-dnd.github.io/react-dnd/docs/api/use-drop)の引数が、仕様オブジェクトでなく、仕様オブジェクトを返すコールバック関数になりました。そして、第2引数には依存配列を与えます。つまり、Reactの[`useMemo`](https://ja.reactjs.org/docs/hooks-reference.html#usememo)と同じ構文になったのです。

これも、1年前の作例が動かなくなった理由かと思ったら、違いました。[v13.1.0](https://github.com/react-dnd/react-dnd/releases/tag/v13.1.0)で、もともとの仕様オブジェクトを渡す構文も復活したからです。

```react
useDrag(() => spec, [deps])  // useMemo型構文
useDrag(spec)  // 復活
```

ただし、第2引数は残ります。けれど、省いて構いません。デフォルトの依存配列が用いられるからです。構文について詳しくは、「[useDragフック](https://www.fumiononaka.com/Business/html5/FN2004001.html#syntax001)」および「[useDropフック](https://www.fumiononaka.com/Business/html5/FN2004001.html#syntax002)」をご参照ください。


# `useDrag`で定める仕様オブジェクトの`type`プロパティは直下に置く
少しやっかいだったのは、[v14.0.0](https://github.com/react-dnd/react-dnd/releases/tag/v14.0.0)で加えられたつぎの変更です。なにしろ「Breaking Changes」の表記がありません。内部的な改善のために、`type`と`item`を切り離したようです。

```react
useDrag(() => {
	// item: { type: BOX } },
	type: BOX,

})
```

以上を改めたところ、1年前の作例も動くようになりました(`useDrag`と`useDrop`は、`useMemo`型の構文に書き替えました)。でき上がりは[CodeSandbox](https://codesandbox.io/s/react-dnd-04-chess-board-and-lonely-knight-6rlhb)に公開してあります。つくり方については、前出「[Create React App + React DnD](https://www.fumiononaka.com/Business/index.html#Create_React_App)」(全4回)をお読みください。
XAMPPでローカルにある複数のサイトのSSLを有効にする

## Introduction

今更ではありますが、XAMPPでローカル環境を構築していてSSL対応する必要があったのでメモ程度に残します。

## 環境

- Windows10 64bit
- すでに複数サイトがXAMPPに設定されている（v-hostsの設定が終わっている）

## 初回のみ対応

### 1. php.iniの設定を変更する

C:\xampp\php\php.ini の以下記述を変更する。

```
;extension=php_openssl.dll
```

↓↓↓

```
extension=php_openssl.dll
```

## 設定方法 (サイトを追加する度に行う）

### 1. httpd-ssl.confファイルに追記をする

https://の形式で閲覧できるように以下のファイルを末尾に加える

C:\xampp\apache\conf\extra\httpd-ssl.conf

```
<VirtualHost 127.0.0.2:443>
    DocumentRoot "C:\Users\user-name\htdocs\xxx"
    ServerName localhost:443

    SSLEngine on
    SSLCertificateFile "conf/ssl.crt/server.crt"
    SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>
```

### 2. httpd-vhosts.confの設定を書き換える

以下のファイルの設定を書き換える

C:\xampp\apache\conf\extra\httpd-vhosts.conf

```
Listen 12000
<VirtualHost *:12000>
    DocumentRoot "C:\Users\user-name\htdocs\xxx"
    
    <Directory "C:\Users\user-name\htdocs\xxx">
    Options Indexes FollowSymLinks MultiViews Includes ExecCGI
    AddType text/html .shtml
    AddHandler server-parsed .inc
    AddHandler server-parsed .shtml
    AddHandler cgi-script .cgi .pl
    AllowOverride All
    Order allow,deny
    Allow from all
    </Directory>
</VirtualHost>
```

↓↓↓

```
<VirtualHost 127.0.0.2>　
    DocumentRoot "C:\Users\user-name\htdocs\xxx"
    ServerName site.local

    <Directory "C:\Users\user-name\htdocs\xxx">
    Options Indexes FollowSymLinks MultiViews Includes ExecCGI
    AddType text/html .shtml
    AddHandler server-parsed .inc
    AddHandler server-parsed .shtml
    AddHandler cgi-script .cgi .pl
    AllowOverride All
    Order allow,deny
    Allow from all
    </Directory>
</VirtualHost>
```

### 3. Apacheを再起動する

何もエラーをはかなければ成功
https://127.0.0.2/ でアクセスしてみる
Node.js上のPrismでdiff-highlightを使う方法

Prismのdiff-highlightプラグインをNode.js上で使う方法です。

## diff-highlightプラグインとは？

Prismの`diff`言語では、行頭の`+``-`記号で差分のシンタックスハイライトがされます。diff-highlightプラグインはJavaScriptなどの任意の言語をハイライトしながなら差分のハイライトも同時行えるものです。

- [Diff Highlight ▲ Prism plugins](https://prismjs.com/plugins/diff-highlight/)

## Node.jsでdiff-highlightを使うには？

まず、`diff`言語をロードしておく必要があり、その上で`prismjs/plugins/diff-highlight/prism-diff-highlight`をロードするとプラグインが有効になります。

```ts
import loadLanguages from "prismjs/components/index";

loadLanguages("diff");
require("prismjs/plugins/diff-highlight/prism-diff-highlight");
```

JavaScriptの任意の言語をハイライトするには、`Prism.highlight`メソッドの第2引数を`diff`言語に、第3引数を`diff-${言語名}`にします。

```ts
import Prism from "prismjs";

const code = ` const a = 1;
-console.log(a);
+console.log(a + 1);`;
const html = Prism.highlight(code, Prism.languages.diff, "diff-js");
```

上の`html`の値は次のように、行ごとに`unchanged`, `deleted`, `inserted`などのクラスがつき、これが差分情報になります。Javascriptのトークンもそれごとにクラスがついているのが分かります。

```html
<span class="token unchanged language-js"
  ><span class="token prefix unchanged"> </span
  ><span class="token keyword">const</span> a
  <span class="token operator">=</span> <span class="token number">1</span
  ><span class="token punctuation">;</span> </span
><span class="token deleted-sign deleted language-js"
  ><span class="token prefix deleted">-</span>console<span
    class="token punctuation"
    >.</span
  ><span class="token function">log</span
  ><span class="token punctuation">(</span>a<span class="token punctuation"
    >)</span
  ><span class="token punctuation">;</span> </span
><span class="token inserted-sign inserted language-js"
  ><span class="token prefix inserted">+</span>console<span
    class="token punctuation"
    >.</span
  ><span class="token function">log</span
  ><span class="token punctuation">(</span>a
  <span class="token operator">+</span> <span class="token number">1</span
  ><span class="token punctuation">)</span
  ><span class="token punctuation">;</span></span
>
```

スタイルを適用すると追加行と削除行に背景色がついているのが分かります:

<p class="codepen" data-height="265" data-theme-id="light" data-default-tab="html,result" data-user="suin" data-slug-hash="poejRYe" 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="Prism diff-highlight">
  <span>See the Pen <a href="https://codepen.io/suin/pen/poejRYe">
  Prism diff-highlight</a> by suin (<a href="https://codepen.io/suin">@suin</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>

ちなみに上で使ったCSSは次の2つです:

- https://prismjs.com/themes/prism-okaidia.css
- https://prismjs.com/plugins/diff-highlight/prism-diff-highlight.css

## 注意点: 変更なしの行は半角スペースが必要

ハイライトするコードですが、変更なしの行は行頭にスペースを入れるのを忘れないようにしてください。次の例は、1〜2行目が正しくハイライトされないどころか、改行も失われてしまうので注意です。

```diff
const a = 1;
const b = 1;
+console.log(a + b);
```

正しくは、次のように1~2行目の`const`の前にひとつ半角スペースを入れます。

```diff
 const a = 1;
 const b = 1;
+console.log(a + b);
```
ブロックチェーンの学び方

#ブロックチェーンのあらまし

ブロックチェーンがどう動いているのか→難解→宿題

ブロックチェーンの性質：　改ざんや複製が難しい

改ざんや複製を困難にするために、『暗号』『P2P』『プルーフ・オブ・ワーク』などの技術を組み合わせている。
→技術の組み合わせの結果できたのが、『スマートコントラクト』。
→仮想通貨が実現。

#学習の始め方：　仕組み→ツール→応用

ビットコイン→イーサリアムの仕組み・スマートコントラクト→Solidity

- ビットコイン(ブロックチェーン)の概念の学習
- イーサリアムとスマートコントラクトの概念の学習
- イーサリアムノード(Geth)の学習
- スマートコントラクトを書く言語(Solidity)の学習
- スマートコントラクトへアクセスするためのクライアントツール(web3.js)の学習
- 開発フレームワーク(Truffle)の学習
- その他、Quorum, Corda, HyperledgerなどのEthereum以外のブロックチェーンの学習

( https://baasinfo.net/?p=3791 より引用。）


#1. ビットコイン(ブロックチェーン)の概念の学習

ブロックチェーンの基本をおさえる。

学習サイト：

https://enterchain.online/

ブロックチェーンの概念を理解できる。

その上で、基礎書籍：　

https://www.amazon.co.jp/dp/4757103751/

ブロックチェーンがどう動いているかの全体像をシンプルかつ正確に把握できる。

２．以降は今後追加予定…

#まとめると

挫折しないために学習の順番をイチから考えることは非常に難しい。

学校ではカリキュラムが用意されていているが、独学でブロックチェーンのような最新技術を学ぶとなると情報は散逸してるわ自分で勉強の仕方を組まなきゃいけないわでいろいろカロリーが高い。最近はCourseraやEdXなどのオンライン学習ツールでも最新技術に関する各種大学の授業が公開されており、それほどお金をかけずに学べる環境にあるが、外国語での授業はこれまたカロリーが高い.｡◯
【AWS】VPCとの接続方法で使うVPNとDirect Connectについて

#プログラミング勉強日記
2021年5月11日

#VPCとの接続方法
　VPCとのオンプレミス側との接続方法は大きく分けて2つある。1つはVPN接続をすること。もう1つは専用線接続(Direct Connect)をすること。

##Direct Connect
　Direct Connectはユーザのデータセンターやオフィスを専用線を介してAWSにプライベートに接続するサービスのこと。メリットとしては、値段が安い・ネットワークの信頼性の向上・ネットワーク帯域幅の向上がある。

　Direct Connectの仕組みとしては、以下の図のようになっている。Direct ConnectロケーションがAWSのAZ以外にもリージョンの近くに設計されていて、そこに自社の機器を設置してその中にあるDirect Connectデバイスと接続する。自社の機器側に自社のオンプレ環境とGatewayで接続する設定を行う。この自社機器を介してDirect Connectデバイスに物理的に接続する。Direct Connectデバイスの方はAWSのAZに接続しているので、これを介して専用線の接続ができる。このように物理的に直接つなぐことでかなりの帯域幅と信頼性が高くなっている。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/642821/21c864e2-87cf-e5a8-6e58-89f61c8059f1.png)


##Direct Connect Gateway
　Direct Connect Gatewayによって、同一アカウントに所属する複数リージョンの複数AZから別の複数リージョンの複数VPCに接続できる。これを介してリージョン間のネットワーク接続が可能になる。東京リージョンから中国香港リージョン、東京リージョンから米国東部リージョンといった接続ができる。

##VPNとDirect Connect
　Direct Connectの特徴をVPNと比較してみる。VPNの方が安く早く利用できるが、信頼性や品質は専用線のほうが良い。

|  | VPN | 専用線 |
|:--:|:--:|:--:|
| コスト | 安価なベストエフォート回線が利用できる | キャリアの専用線サービス契約が必要でVPNより高価 |
| リードタイム | クラウド上で接続可能などですぐに利用できる | 物理対応が必要なので数週間かかる |
| 帯域幅 | 暗号化のオーバーヘッドによって制限がある | ポート当たり1G/10Gps |
| 品質 | インターネット経由のためネットワークの影響を受ける | キャリアによって高い品質が保証される |
| 障害切り分け | インターネットベースなので自社で保持している範囲以外の確認・障害対応は難しい |　物理的に経路が確保されているので簡単 |
【CSS】clearfixについて

##概要
 floatプロパティによって浮いた要素の回り込みを解除できる（バリアを張るイメージ）

##具体例
```
  <div class="clearfix"> 
    <div class="box1"></div> 
    <div class="box2"></div> 
  </div> 
  <div class="box3"></div>
```

```css
.clearfix::after{ 
  content: ""; 
  display: block; 
  clear: both; 
} 
.box1{ 
  background-color: red; 
  width: 200px; 
  height: 200px; 
  float: left; 
} 
.box2{ 
  background-color: green; 
  width: 200px; 
  height: 200px; 
  float: left; 
} 
.box3{ 
  background-color: yellow; 
  width: 200px; 
  height: 200px; 
}
```

###実行
yellowがredの下に回り込むのを解除している
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1009493/e7e16f0c-6f41-332b-54d5-23cf155ece77.png)


**.clearfix::after**
clearfixというクラス名を付けた要素の直後

**content:"";**
contentプロパティで任意の文字を挿入

**display: block;**
clearfixを付けた要素の直後に要素を作る

**clear: both;**
float解除

##参考
https://qiita.com/mariofujisaki/items/2ad1de8432d7249afadc

https://web-camp.io/magazine/archives/27842
Ubuntu 使用者の暗証番号を短くて設置する方法

面倒すぎるので、とりあえず短い暗証番号が欲しいですが、短すぎるで出来なかった。
解決方法をここでメモします。
## やり方
```shell
sudo vi /etc/pam.d/common-password
```

下記の行で　*minlen=n*　を追記します
例えば、最小桁3に設置します

```text:/etc/pam.d/common-password
...
# here are the per-package modules (the "Primary" block)
password        [success=1 default=ignore]      pam_unix.so obscure sha512 minlen=3
...
```

それから*passwd*コマンドで設置できます

```shell
sudo passwd username
```

## 参考
https://askubuntu.com/questions/180402/how-to-set-a-short-password-on-ubuntu
Reactでドロップダウン(dropdown)メニューを実装する

# 経緯
Reactでドロップダウンメニューを実装する必要が出てきた。
ドロップダウンメニューを実装するには、領域外のクリックを検知する必要がある。
React上で領域外を検知する方法と、簡単にドロップダウンメニューを作る。

## 必要な知識
`React` `React hooks`

# Code

```react

import { useState, useRef, useEffect } from 'react'
const Menu = () => {
    const [isOpen, setIsOpen] = useState(false);
    const dropdownRef = useRef();

    useEffect(() => {
        document.addEventListener("mousedown", handleOutsideClick);
        return () => document.removeEventListener("mousedown", handleOutsideClick);
    }, []);

    const handleOutsideClick = (e) => {
        if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
            setIsOpen(false);
        }
    };

    return(
        <>
            <div ref={dropdownRef} className="relative inline-block text-left">
                <span className="rounded-md shadow-sm">
                    <button onClick={() => setIsOpen(!isOpen)} type="button" className="inline-flex justify-center w-full rounded-md border border-gray-300 px-4 py-2 bg-white text-sm leading-5 font-medium text-gray-700 hover:text-gray-500 focus:outline-none active:bg-gray-50 active:text-gray-800 transition ease-in-out duration-150" id="options-menu" aria-haspopup="true" aria-expanded={isOpen}>
                    MENU
                    <svg className="-mr-1 ml-2 h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="#4B5563">
                        <path fillRule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clipRule="evenodd" />
                    </svg>
                    </button>
                </span>
        
                {isOpen && (
                    <div className='absolute top-12 right-2 w-64 p-4 bg-white z-50 shadow-lg border border-gray-100 rounded'>
                        <ul>
                            <li><a>menu1</a></li>
                            <li><a>menu2</a></li>
                            <li><a>menu3</a></li>
                        </ul>
                    </div>
                )}
            </div>
        </>
    )
}

export default Menu

```

## 仕組み
useEffectで描画時に、イベントリスナーでmousedown(クリック)を登録しておく。
また、returnでイベントリスナーのクリーンアップも設定する。

mousedown時に、mousedownされた要素が返されるため、`handleOutsideClick`でその要素に、ドロップダウンメニューの要素が含まれるか判定する。(ドロップダウンメニューの要素は`useRef`を使用して取得)
含まれる場合、それはドロップダウンメニュー上でのクリックなので、ドロップダウンメニューは表示し続ける。
含まれない場合、それはドロップダウンメニュー外でのクリックのためドロップダウンメニューを非表示にする。

今回は、要素を丸ごと消しているが、`display: hidden;`や`display: none;`でも実装可能である。
XPのターミナル環境

## ルート証明書の更新

必要なルート証明書を入れる。

http://win2k.org/wlu/wlu.htm

> Update for Root Certificates Mar 2021/ルート証明書の更新プログラム[2020年 4月 (KB931125+KB3097966) for Windows 98/Me/2000/XP/2003

をダウンロード、拡張子が`wlu`になっているのを`cab`に変更し、解凍、中のsetupを実行するとインストールされる。

![cert.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/25728/13c13aa2-fe2f-9c09-0b7d-2584e0be8109.png)

## cmder の xp 用exeをダウンロードし差し替え

最新のcmderをダウンロードし、

https://github.com/cmderdev/cmder/releases

xpで動くようにcmder.exeを以下のもので差し替え。

https://github.com/cmderdev/cmder/releases/tag/v1.1.4-xplauncher

vc2013ランタイムが必要なため入れておく。


## Git for Windows 2.10 をインストール

`Git for Windows 2.10`にmintty.exeが含まれている。

XP用の最終バージョンは以下

https://github.com/git-for-windows/git/releases/tag/v2.10.0.windows.1

## 日本語入力できるようにする (`ALT + 全角半角`)

```sh:~/.inputrc
# disable/enable 8bit input
set meta-flag on
set input-meta on
set output-meta on
set convert-meta off
```


## cmderの設定

### フォントのアンチエイリアス

* フォント -> `Clear Type`
* 色 -> `<Babun>`


## .Net 4.0

.Net 4.0 ランタイムをインストールする前に`WIC`が入っている必要がある。

### WIC

http://download.microsoft.com/download/f/f/1/ff178bb1-da91-48ed-89e5-478a99387d4f/wic_x86_jpn.exe
Ubuntu 現使用者改名のやり方

# Ubuntu 現使用者改名について
Ubuntuの現使用者名を変更するのはややこしすぎるので、
色々の調査して、一番分かりやすいやり方をここで記録します
## はじめに
簡単に言うとsudo権限のある使用者もう一つを作って、改名したい使用者を改名します
## ステップ１　sudo権限あり改名用使用者を追加します
例えば、[tempuser]で作成します

```shell
sudo adduser tempuser
sudo usermod -aG sudo tempuser
```

## ステップ2　改名したい使用者を改名します
現在の使用者からログアウトして、先ほど追加した使用者(tempuser)でログインします
ログインしてから改名を始まります
例えば、[olduser]から[newuser]に改名したい場合

```shell
sudo usermod -l newuser -d /home/newuser -m olduser
sudo groupmod -n newuser olduser
```
**もし、olduserの名義で実行中プロセスがあれば、上記のコマンドが出来なくなってしまうので、***kill [PID]***コマンドで中止してください**

## ステップ３　ホームフォルダーのシンボリックリンクを作ります
一部のアプリケーションの問題が起こさないように元々のusernameと新しいの連結しましょう

```shell
sudo ln -s /home/newuser /home/olduser
```

## ステップ4　表示名前を設置します
例えば、[yamada　taro]で表示されたいの場合

```shell
sudo chfn -f "taro yamada" newuser
```

## ステップ5　sudo権限あり改名用使用者を削除
現在の使用者からログアウトして、改名した使用者(newuser)でログインします
ログインしてから削除実行します

```shell
sudo userdel -r tempuser
```

## 参考
https://www.linuxuprising.com/2019/04/how-to-change-username-on-ubuntu-debian.html
ADユーザー、グループ作成とRFC2307マッピングをパワーシェルで設定する

自分の備忘です。

###グループ作成
``New-ADGroup -Name "g1" -GroupScope Global``

###ADユーザー作成と最低限の設定
#####パスワードが平文で入っているので注意！
``New-ADUser -Name "u1" -AccountPassword (ConvertTo-SecureString "PASSWORD1234" -AsPlainText -Force) -Enabled $true -GivenName "u1" -PasswordNeverExpires $true -UserPrincipalName "u1@datacore.jp"``

###ユーザーをグループに追加
``Add-ADGroupMember -Identity "g1" -Members "u1"``

###プライマリグループの変更
#####さっき作ったグループのSIDを取得
``$Group = Get-ADGroup "g1"``
``$GroupSID = $Group.sid``
#####最後の数桁だけ(=ID)を切り出す
``$GroupID = $GroupSID.value.Substring($GroupSID.value.LastIndexOf("-")+1)``
#####プライマリーグループを変更する
``Get-ADUser "u1" | Set-ADObject -Replace @{PrimaryGroupID = "$GroupID"}``

###RFC2307?(uidNumberとgidNumber)を設定する
``Get-ADUser "u1" | Set-ADObject -Replace @{uidNumber = "12345"}``
``Get-ADGroup "g1" | Set-ADObject -replace @{gidNumber = "12345"}``

##これを連続で書くと
あとで気が向いたらグループ名とユーザー名を変数にして取り出す。
あろで気が向いたらプライマリグループのところを1行に書き直す。

```
New-ADGroup -Name "g1" -GroupScope Global
New-ADUser -Name "u1" -AccountPassword (ConvertTo-SecureString "PASSWORD1234" -AsPlainText -Force) -Enabled $true -GivenName "u1" -PasswordNeverExpires $true -UserPrincipalName "u1@datacore.jp"

Add-ADGroupMember -Identity "g1" -Members "u1"

$Group = Get-ADGroup "g1"
$GroupSID = $Group.sid
$GroupID = $GroupSID.value.Substring($GroupSID.value.LastIndexOf("-")+1)
Get-ADUser "u1" | Set-ADObject -Replace @{PrimaryGroupID = "$GroupID"}

Get-ADUser "u1" | Set-ADObject -Replace @{uidNumber = "12345"}
Get-ADGroup "g1" | Set-ADObject -replace @{gidNumber = "12345"}
```
(入門)Node.jsで初めてのWebサーバーを立ち上げる　Windoows10環境

node.js　で サーバーを作成します。

環境
node v12.18.1 npm 6.14.4 
windows10

nodeは以下のサイトを参考にして、インストールします。
https://qiita.com/satoyan419/items/56e0b5f35912b9374305

nodeのバージョン管理は以下のサイトを参考にします。
https://qiita.com/satoyan419/items/56e0b5f35912b9374305

vscodeでフォルダを作成して、
app.jsファイルに以下のコードを記入します。

``````js:app.js
// モジュールをロードする　DOMの代わり
const http = require('http');


// サーバーを作る
var server = http.createServer(
  (request,response)=>{
    response.end('hello');
  }
);
// ポート番号:3000で受け付け開始
server.listen(port =3000);
```

最後のserver.listen(port =3000);

のportの部分がないと

エラー
  code: 'MODULE_NOT_FOUND', requireStack: []
が出きたので忘れないでください。

node.jsでは、javascriptで使用していたDOM要素の代わりに、
モジュールというものをロードします。

コマンドプロンプトを開いて、

```php:コマンドプロンプト（cmd）

node app.js

```

localhost:3000にブラウザでアクセスしてください。

公式ドキュメントでも同様なコードが書いてあるので、参考に。
https://nodejs.org/ja/docs/guides/getting-started-guide/
AWSでのリージョンの変更方法紹介

AWSで作成したインスタンスのリージョンを変更したい時、非常に参考になる記事があったので備忘録も兼ねて紹介。
https://www.souichi.club/aws/changeregion/

ステップごとに画像と詳細のやり方が書かれていてとても参考になりました、ありがとうございます。
【Guideline 2.1 - Information Needed】IDFA関連のApple審査リジェクト対処法

アップデート時にAppleの審査で、「Guideline 2.1 - Information Needed」によってリジェクトされました。
「情報が足りない」という内容で、今回はiOS14.5で必須となっているIDFA取得に関連していました。
同様のリジェクトを受ける可能性がある方もいると思うので、記録しておきます。

## Guideline 2.1 - Information Needed
「Information Needed」についたコメントは以下の通りです。
>We're looking forward to completing the review of your app, but we need more information to continue. Specifically, we noticed that your app uses the AppTrackingTransparency framework, but we haven't been able to locate the App Tracking Transparency permission request.

要約すると、
**「AppTrackingTransparencyフレームワークを使用しているのは分かるけど、どこで使っているのか分からない」**
と言っているようです。

IDFAの取得にはiOS14のAppTrackingTransparencyフレームワークが必須となっているため、前回のアップデートで既に導入済みでした。
前回は一発で審査を通っていたのに、なぜか今回はリジェクトされることに……。
審査担当者によってもジャッジが微妙に異なるのかもしれませんね。

### IDFA取得のダイヤログ起動タイミング
IDFA取得の許可を求めるダイヤログは、初回起動時にのみ表示するようにしています。
方法は色々あると思いますが、私の場合は初回起動かどうかを変数のBool型の値でジャッジしていました。
それが分かりにくいと判断されたようです。

### 【解決方法】どのように実装したのかメモ欄に記載
実装方法に間違いがなければ、具体的な実装方法を返信で説明すればOKです。
そもそもこうしたリジェクトを回避するために、申請時に**「App Reviewに関する情報」のメモ欄**で説明しておくことをおすすめします。

---------------------------------------
![スクリーンショット 2021-05-11 9.27.16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/385428/083c7677-2eb6-8d84-e121-3a42f413ce2c.png)
---------------------------------------

メモ欄に具体的な実装方法を記述した上で、実際のコードのスクショをファイルで添付すればカンペキです。

自分も含めて英語が苦手な人にはちょっと手間ですが、Google翻訳を使って作成した文章でも十分伝わると思います。
気になる人は冒頭に
**「I want to apologize in advance, I am not fluent in English.」**
とでも入れておけば、英語が苦手なので意味を上手く伝えられないかもしれない…ということは伝わるかと。
日本からの申請である以上、先方も英語が不得手な人が多いことは理解してくれていると思いますが。

---------------------------------------

IDFAの許可タイミングは難しいですね。
AdMobを使用していますが、広告主の多くが離れるとか、ユーザーの許諾率がめちゃくちゃ低いとかネガティブな話題ばかりなので、Apple様が何らかの緩和策を講じてくれることを期待します。
android

## resources
### stringのplaceholder

http://y-anz-m.blogspot.com/2011/03/android-xml.html

## room
- メインスレッド内で呼び出しできない, AsyncTaskやThreadなどを使って別スレッドで処理をかけないとダメ
http://heppoen.seesaa.net/article/480674938.html

## AsyncTask
処理結果などを受け取りたい時はlistenerを実装する必要がある

https://akira-watson.com/android/asynctask.html

## Thread
- ThreadからUIの変更はできない
    - Handlerに処理を委譲すれば可能

## databinding
- view内で使用するデータクラスを定義し、それを利用できる
- xmlに<data>, <variable>(使用するデータクラスの指定)の定義必要
- データの更新を検知させるためにinvalidateAllの呼び出し必要

https://developer.android.com/codelabs/kotlin-android-training-data-binding-basics/index.html?hl=ja#3

## binding
- view内で使用しているものにアクセスを簡単にする(findViewByIdの冗長な記述が不要に)
- build.gradleにて設定必要
- xmlに<layout>(namespaceの指定)を定義必要
- applyでアクセス処理を一括で記述可能

https://developer.android.com/codelabs/kotlin-android-training-data-binding-basics/index.html?hl=ja#2
[python] 関数内でexecを使ってglobal変数を定義する方法

# 追記2

コメントで@shiracamusさんが綺麗なコードを書いてくださいました。
この記事の内容は全部これでOKそうです。

```python
def hoge():
    globals()['a'] = 1

hoge()
print(a)
```


# OK

```python:
def hoge():
    # execで定義した変数は、第3引数のdictに格納されるみたいなので、現在のグローバル変数（globals()）を指定
    # 第2引数には、とりあえず {} を入れておく
    exec('a=1', locals(), globals())
hoge()
a
```

```:output
1
```

# NG

```python:
def hoge():
    global a
    exec('a=1')
hoge()
a
```

```:output
NameError: name 'a' is not defined
```

# 追記1

exec の第1引数の中で関数内で定義された辞書を使う方法。色々試したら出来たので、結果だけ。

ポイント：
・グローバル変数に同名の変数があるとそちらが参照されるので、被らないような変数名に置き換えてから実行する。
・第2引数に`locals()`を指定する。（これをしないと、`NameError: name 'fagragfaa' is not defined`になる。）

```python
def hoge():
    dic = {'a': 1, 'b': 2}
    for key in dic:
        # グローバル変数の dic と被らないように、変数名を変える
        fagragfaa = dic
        exec(f'{key} = fagragfaa["{key}"]', locals(), globals())

dic = {}
hoge()
a, b
```

```:output
(1, 2)
```
Magento で http を https に redirect するようにしたい

https://community.magento.com/t5/Magento-2-x-Technical-Issues/How-will-activate-SSL-on-all-pages/td-p/44371

Config > Web にて
- Unsecure のほうの base URL でも https を使った URLにする
- Auto-redirect to Base URL を YES : 301 に設定する
いつも忘れる mac の static route 設定

# macのstatic route

```ruby
netstat -r
sudo route -n add -net 18.0.0.0/8 192.168.0.1
brew install iproute2mac
ip route get 18.0.0.1
```

## 既存のを変更するとき

```
sudo route change default 192.168.0.1
```
ServerlessFrameworkでGoのアプリをデプロイする

最近はCDKなどの他のツールに押され気味の印象のServerlessFrameworkですが、API Gateway+Lambda+ DynamoDBといったサーバレス構成の場合、記述のシンプルさ故、ServerlessFrameworkを選択するケースはまだ多い印象です。今回は、GoのアプリケーションをServerlessFrameworkで構築する方法について記載します。

ServerlessFrameworkで使用できるGoのテンプレートには以下の3つがあります。

- aws-go
- aws-go-dep
- aws-go-mod

Goではバージョン1.11から従来のGOPATHモードに加えてモジュールモードが用意されており、今後はこのモードが主流となることから、ここではaws-go-modを選択します。ちなみに、モジュールモードを使用すると、ソースコードを$GOPATH以外の任意のディレクトリに配置できるなどのメリットがあります。他にもメリットはありますが、ここでは割愛します（「GOPATHモード モジュールモード」などで検索いただければと思います）。

以降、このテンプレートを使って実際のAWS環境にデプロイするまでの流れを記載します。
基本的には、[公式ドキュメント](https://www.serverless.com/framework/docs/providers/aws/examples/hello-world/go/)に記載の通りですが、このまま実行してもエラーになる箇所があるので、その点についても補足していきます。

まずは、以下コマンドでテンプレートを作成します（slsコマンドはインストール済みの前提）。
※my-serviceの箇所はテンプレートを配置したい任意のディレクトリ名。

```
sls create --template aws-go-mod --path my-service
```

my-serviceディレクトリ に入ると、諸々のファイルが生成されていることが確認できます。

続いて、ドキュメントに記載の通り以下コマンドでソースコードをビルドします。

```
make build
```

すると、以下のようなエラーが発生します。

```
chmod u+x gomod.sh
./gomod.sh
export GO111MODULE=on
env GOOS=linux go build -ldflags="-s -w" -o bin/hello hello/main.go
go: github.com/aws/aws-lambda-go@v1.6.0: missing go.sum entry; to add it:
        go mod download github.com/aws/aws-lambda-go
make: *** [build] Error 1
```

go.sumがないとのこと。調べてみると、モジュールモードではgo.modとgo.sumでパッケージの管理をするのですが、1.16以降、go.mod に含まれている依存パッケージのうち、go.sum に含まれていないものが1つでもあるとビルドが通らない仕様になったようです。通常は、モジュールモードでプロジェクトを新規に作る時のコマンド（go mod init）を実行すると、go.sumも一緒に作成されます。今回は、初期化はすでに行っている状態なので、initコマンドではなく、以下を実行することで解決します。

```
go mod tidy
```

ちなみに、こちらのコマンドはプログラム上のimport文を参照して、不要モジュールの削除と新規モジュールの追加を行ってくれるコマンドです。

続いて、再度ビルドコマンドを実行します。

```
make build
```

すると、binディレクトリ直下にビルドされた結果が格納されていると思います。

あとは、以下のコマンドでデプロイするだけです（リージョンやprofileの設定が必要な場合はserverless.ymlを編集してください）。

```
sls deploy
```
Pythonで高速フーリエ変換（FFT）


# はじめに

- ある系に地震波を与えたときの加速度（下の図）から、加速度応答スペクトル（ピリオドグラム）を求める
- 最終的にはスペクトルのピークを知りたい
- fftは複雑なことが多く理解しにくいため、最低限必要なところだけ説明する

![qiita_acc.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634453/132883fe-fbe0-764e-33c9-266625964023.png)

## 補足

- fft（高速フーリエ変換）をするなら、`scipy.fft`か`numpy.fft`が主流
- [公式](https://docs.scipy.org/doc/scipy/reference/fftpack.html)によると`scipy.fftpack`はLegacyとなっており、推奨されていない
- scipyは[ドキュメント](https://docs.scipy.org/doc/scipy/reference/tutorial/fft.html)が非常にわかりやすかった

# モジュールのインポート

`numpy`も`scipy`も違いはありません。

```python
# numpyを使うとき
from numpy.fft import fft, fftfreq

# scipyを使う時
from scipy.fft import fft, fftfreq
```

# 高速フーリエ変換
yは分析したい時系列データです

```python
# サンプル数
N = len(y)
# サンプリング間隔
T = 0.01
# フーリエ変換する
yf = fft(y)
# 周波数軸の作成
xf = fftfreq(N, T)[:N//2]
```

# 描画

```
plt.plot(xf, 2.0/N * np.abs(yf[0:N//2]))
```
![qiita_amp.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634453/b1af3462-aa24-91dd-fcd8-4d90d12deaa1.png)

- 2つの山が見て取れる
- `T=0.01`としたので、サンプリング周波数はその逆数で $f_s=100Hz$となる。つまりナイキスト周波数は50Hzなので、描画したグラフは周波数が0から50の範囲となっている。
【EC2にssh接続時Permission deniedが出る】

EC2接続時のエラーとその解決方法をメモ

```php
Permissions 0644 for '〜.pem' are too open.
It is required that your private key files are NOT accessible by others.
This private key will be ignored.
Load key "〜.pem": bad permissions
ec2-user@iPアドレス.リージョン.compute.amazonaws.com: Permission denied (〜).
```

.pemファイルの権限がゆるいとエラーがでるらしいので、以下のコマンドで解決。

```php
chmod 400 ~.pem
```

やっていること
一桁目　所有者
二桁目　グループ
三桁目　その他

数字の意味
4  読み取りのみ
2  書き込みのみ
1  実行のみ
0  全て禁止

つまり、400は所有者のみに、読み取り権限を与えている。
Windows で python から ShellExecute を利用する

意外にはまってしまったのでメモしておきます。

# 背景

Windows において、python を1つ上げたら芋ずる式に他のプロセスを上げていきたい。
起動数は固定なので、shell32.dll の ShellExecute を使うことを考えた。
しかし python からこの DLL を利用するにはいくつか tips があるようだ。

# 問題のあるプログラム

最初は単純に ShellExecute を呼び出せばよいと思い、以下のようなプログラムを書いていました。

```python
from ctypes import windll
shellexecute = windll.shell32.ShellExecuteA
err = shellexecute(None, "open", "./test.exe", None, None, 1)
print(err)
```

しかし結果は 31 エラーで撃沈。仕方がないので python の ctypes の項を読むと、ASCII 文字列は c_char_p で変換して渡す必要がありそう。さっそく実行。

```python
from ctypes import windll, c_char_p
shellexecute = windll.shell32.ShellExecuteA
err = shellexecute(None, c_char_p(b"open"), c_char_p(b"./test.exe"), None, None, 1)
print(err)
```

が、これも 31 エラーで弾かれる。

# もしかして、区切り記号？

途方に暮れていると、Windows ではフォルダの区切り記号が \ であることに気づいた。やってみよう！

```python
from ctypes import windll, c_char_p
shellexecute = windll.shell32.ShellExecuteA
err = shellexecute(None, c_char_p(b"open"), c_char_p(b".\\test.exe"), None, None, 1)
print(err)
```

今度はうまく動きました。ShellExecuteW を使いたい場合は、

```python
from ctypes import windll, c_wchar_p
shellexecute = windll.shell32.ShellExecuteW
err = shellexecute(None, c_wchar_p("open"), c_wchar_p(".\\test.exe"), None, None, 1)
print(err)
```

とすれば OK。

# DLL 化して呼び出しを簡略化

でも一々 c_wchar_p を指定するのは面倒なので、DLL に組み込んでしまった。

```c++:mycommon.cc
#include <windows.h>
extern "C" __declspec(dllexport) int launch(LPCWSTR file, int mode) {
   HINSTANCE hInst = ShellExecuteW(NULL, L"open", file, NULL, NULL, mode);
   return GetLastError();
}
```

mycommon.cc をコンパイルし、mycommon.dll を作成すると、

```python
from ctypes import cdll

launch = cdll["./mycommon"].launch
err = launch(".\\test.exe", 1)
```

という形で呼び出すことができた。
4/15/2021 7:27:30 PM のフォーマットをテキストからDate型に変更する数式

[Answersで回答する時に使う情報のまとめに戻る](https://qiita.com/Keiji_otsubo/items/9e6e0e946826133eddc7)


なんだ、初めは簡単だと思っていました。

2021の後のﾌﾞﾗﾝｸで切り取ってしまえば、日付だけですよ。
しかし、変換後はDate型なんですよね。

初めはテキストを日付に変える式を使えばと思ったのですが、数式のパラメータは
YYY-MM-DD形式、単純に変換しても MM-DD-YYYなんでうまくいきません。

えええ、もしかしてまた年、月、日に分解する必要がある。
これって、[カンマ区切りのテキストフィールドから数式フィールドを作る。](https://qiita.com/Keiji_otsubo/items/c340ede7b44a30b89203)と同じことしないといけないの？

はい、結果はその通り。

これだけみても、もう変更できない。

```
DATE( VALUE(right( left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) ,4)) ,VALUE(left(left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1),FIND('/', left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) )-1)),VALUE(left(MID( left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) , FIND('/', left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) ) + 1, LEN( left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) )),FIND('/', MID( left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) , FIND('/', left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) ) + 1, LEN( left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) )) )-1)))
```

[date value from text field containing timestamp](https://trailblazers.salesforce.com/answers?id=9064S000000kFIc)


# 考え方の整理

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/328136/b636fc2e-98c7-5020-917e-82ded3decc79.png)

まずは、日付のところだけを切り出す 画面ではxxのところ

```
left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1)
```


月はxxのフィールドから/で分けた左側の部分よって

```
left(xx,FIND(' ', xx )-1)
```

XXを　先ほどの式で展開する　

```
left(left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1),FIND('/', left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) )-1)
```

ここで、年は常に4桁の数値と仮定するとxxから右側4文字を取るとよさそう

```
right( left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) ,4)
```


困ったなぁ、日を取るの...
まずは　xxから月を取った形を考える

```
left(left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1),FIND('/', left(Last_User_Agreement_Timestamp__c,FIND(' ', Last_User_Agreement_Timestamp__c )-1) )-1)
```