OmniAICreator/Qiita-1.07M huggingface dataset:
Vimで複数のキー操作を１つのキーで行いたいとき


# はじめに

Vim初心者です＞＜

私は主に「エディタでのバインディング」として`Vim`を使用している初心者です（VimプラグインやVimの深淵は除いていません･･･）

IdeaVim、VSCodeのVimなどの拡張を使っている人間です。


# 行いたいこと

![](https://i.gyazo.com/68da50c1f90695933a8423a8a265e05a.gif)

上記のように競技プログラミングをしていると、`zz`コマンドで今のカーソル位置を基準に中心に持ってきて、かつそれを「１０」行ぐらい上にスライドさせたいな
（真ん中だと、ちょっと書きづらくmain関数が上側のほうが広くかけるので嬉しい）

ということがあります。

このためには

zz  +  10`<C+e>`をする必要があり、非常に面倒です。
なにか、一回のキーのみで操作したいお気持ちです。


# 対応策

`.vimrc`でキーマッピングを行うことにしました。

http://vimblog.hatenablog.com/entry/vimrc_key_mapping

こちらのページに詳しく書かれてあり、参考にさせていただきました！


ノーマルモード、例えば`j`キーを`h`の操作として使いたいときは

```vim
nnoremap j h
```


とすればよいです。
jボタンを押すと、左にカーソルが動きます。（こういうのマッピングをする必要はないですが･･･）


このとき、させたい操作をそのまま右側に書けばそれらをすべて実行してくれるため

```vim
nnoremap zu zz13<C-e>
```
としました。
これで

`zu`を押すと、`zz`されたあとに`13<C-e>`が実行されて上に１３行ずれるようになりました＞＜

ひとまずはこれで対応していこうと思います。
Vimに詳しい方で、もっとこうやるとスマートだよ！というのがありましたら、アドバイスいただけると嬉しいです＞＜！
seaborn散布図の各点にラベルを付ける

初投稿の42歳おじさん。
seabornに乗り換えたて。

###困ったこと
散布図を書いて、idと各点の対応がわからなくてイマイチだった。
調べてみると、各点へのラベル付けもやり方があるらしいので、備忘録を残す。

###実装方法
~~~
### -*- coding utf-8 -*-
import pandas as pd
import numpy as np
import seaborn as sns
import matplotlib.pyplot as plt

###
def label_point(x,y,id,ax):
  df_tmp=pd.concat({'x':x,'y':y,'id':id}, axis='columns')
  for i, point in df_tmp.iterrows():
    ax.text(point['x'], point['y'], point['id'],\
    fontsize=5\
    )

###
if __name__=='__main__':
  rfilename='testdata.csv'
  data=pd.read_csv(rfilename)

  # 散布図描画
  ax=sns.scatterplot(x=data.iloc[:,3], y=data.iloc[:,4], hue=data.iloc[:,5])

  # ラベル付け
  label_point(data.iloc[:,3],data.iloc[:,4],data.iloc[:,0],ax)

  # 保存
  wfilename='testdraw.png'
  plt.savefig(wfilename)
~~~

###データの一部
旅行作文の言語特徴を2次元に落としたものだが、詳しくは割愛する。

>id	sex	age	1-dim	2-dim	lab
1	1	63	147.05500793457	-81.8567810058594	me
2	2	45	-128.938018798828	88.1118698120117	fy
3	1	66	20.0744075775146	113.524360656738	me
4	1	68	-64.7453689575195	49.7739143371582	me
5	2	49	-26.7232112884521	-164.791641235352	fy

### 描画結果
idが浮動小数点になっているが、本題ではないのでこのままで。
![testdraw.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/562726/3a4cb7eb-b9d0-7c6a-45dd-7218a200ba72.png)
【Vue.js】Vue CLIで始めるVue.js

# Vue CLIって、なに？

![screenshot-cli.vuejs.org-2020.04.25-10_44_06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/622473/7f4edda9-75c9-17a2-28fe-1a504c8dd9ef.png)


### コマンドラインを使ったVue.js開発支援ツール

- 管理はプロジェクト単位
- プロジェクト作成時に、利用したいプラグインやライブラリもプリインストールできる
- webpack入りなのですぐに開発が始められる

※CLIはCommnad Line Interfaceの略

# インストール

### 事前確認
node.jsとnpmは土台として必須なので、入れておきましょう。

入っているか確認

```
$ node --version
$ npm --version
```

インストール

```
$ npm install -g @vue/cli
```


インストールされたか確認

```
$ vue --verion
```
※最新が入るので、2020 4/24時点では 4.3.1

はい、インストールはこれで終わりです。

# 新規プロジェクト作成

では、とりあえず形だけ、プロジェクトのベースを作ってみましょう。

任意のディレクトリに移動してから、プロジェクト名sample-appで作成してみます。

```
$ vue create sample-app
```

そうすると、
デフォルト(babelとかeslintのパッケージ入りの状態)で作るか
マニュアル(一個づつ手動でプラグイン選択)で作るか聞かれます。

```
> default (babel, eslint)
  Manually select features
```

今回はマニュアルを選びます。
すると、いろいろ選択できるプラグインが表示されます。


```
Vue CLI v4.3.1
? Please pick a preset: Manually select features
? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection)
>(*) Babel
 ( ) TypeScript
 ( ) Progressive Web App (PWA) Support
 ( ) Router
 ( ) Vuex
 ( ) CSS Pre-processors
 (*) Linter / Formatter
 ( ) Unit Testing
 ( ) E2E Testing
```


使いたいもの選択してチェック入れてください。

操作方法は、
矢印の↑↓で移動して、該当項目でスペースを押すと選択できます。
終わったらエンターで決定する。


とりあえずCSS Pre-porcessorsは必須でしょう。
Babel、Linterももちろんあっがほうがよいでしょう。
他はやりたいことに応じて。

この後は選択したプラグインについていろいろ聞かれますので、うまいことやってみください。

そして最後に、
「今後のためにも、今回の設定を保存するかい？」って聞かれます。

```
? Save this as a preset for future projects?
```

同じ設定でプロジェクトを何度も作る機会があるなら便利ってことですかね。
とりあえず、noって意味で、何も入力せずエンターします。

これでプロジェクト作成プログラムがガーっと走り出します。
しばらく待ちましょう。

ピタッと動きが止まり、以下のテキストが表示されたら無事作成完了です。

```
...
🎉  Successfully created project sample-app.
👉  Get started with the following commands:

 $ cd sample-app
 $ npm run serve
```

ラストの二行で、
「プロジェクトディレクトリに移動して、内臓サーバ起動して確認してみな？」って、有言の圧力をかけられます。

ここまでで設定は完了しました。

###おいそれと確認

プロジェクトディレクトリに移動してから、内臓サーバを起動させます。

```
$ npm run serve
```

ブラウザでアクセスしてみる。
http://localhost:8080/

![screenshot-localhost_8080-2020.04.25-10_46_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/622473/45a97c0d-d979-c8fb-a827-94c223446a5f.png)

こんなページが表示されていればひとまずOKです。
これはプロジェクト作成時にあらかじめ自動で用意されるデフォルトページですが、
ここからオリジナルのページ作成へと入っていき開発がスタートします。

まずはこれで入り口に立つことができました。
お疲れ様でした。

【公式】Vue CLI
https://cli.vuejs.org/
３列間の昇順ソートをMySQLで行う

プログラマのためのSQL　第4版　18章を参考に、３列間のデータを昇順ソートする。

用途がよく分からないが、とりあえず出来たので残しておく。

# テーブル作成

```sql:
create table Foobar_18_3_xyz
(key_col integer not null primary key,
x varchar(20) not null,
y varchar(20) not null,
z varchar(20) not null
);
```

# データ挿入

```sql:
insert into
  foobar_18_3_xyz
values
  (1, 'A', 'B', 'C')
  ,(2, 'E', 'D', 'C')
  ,(3, 'D', 'E', 'C')
;
```

# 更新
```sql:
update
  foobar_18_3_xyz f1,
  foobar_18_3_xyz f2,
  foobar_18_3_xyz f3
set
  f1.x  = case
          when f1.x between f1.y and f1.z then f1.y
          when f1.z between f1.y and f1.x then f1.y
          when f1.y between f1.z and f1.x then f1.z
          when f1.x between f1.z and f1.y then f1.z
          else f1.x end,
  f2.y = case
          when f2.x between f2.y and f2.z then f2.x
          when f2.x between f2.z and f2.y then f2.x
          when f2.z between f2.x and f2.y then f2.z
          else f2.y end,
  f3.z = case
          when f3.x between f3.z and f3.y then f3.y
          when f3.z between f3.x and f3.y then f3.y
          when f3.y between f3.z and f3.x then f3.x
          when f3.z between f3.y and f3.x then f3.x
          else f3.z end
where
  f1.x > f1.z or f1.x > f1.y
;
```

# 確認

```sql:
select * from foobar_18_3_xyz;
```

# 結果
```console:
key_col|x|y|z|
-------|-|-|-|
      1|A|B|C|
      2|C|D|E|
      3|C|D|E|
```

テーブルに別名を付けるのがポイント。
SQL Serverだと別名を付けなくても可能らしいが、検証はしていない。
[Git] ローカル→リモートにプッシュとちょっとした修正まで

###グローバル設定 (gitコマンドでデフォルトで使うリポジトリの設定)

```:.giconfig
[user]
    name = "My Name"
    email = myname@example.com
```

### ローカル設定

#### ユーザ名省略

https:// ここに[ユーザ名@]github.com/
※ @も忘れずに!

```:.git/config
[remote "origin"]
	url = https://[ユーザ名@]github.com/[ユーザ名]/dotfiles.git
```

### コマンド

#### ローカルにリポジトリ作成、リモートにプッシュ
```
git init
git add .
git commit -m "Initial commit"
git remote add origin https://github.com/XXXX/XXXXXX.git
git push -u origin master
```

#### その他

こちらを参考
https://qiita.com/kohga/items/dccf135b0af395f69144

```terminal:
git status                 # ローカルの変更を確認
git diff                   # リモートとローカルの差分を確認
git log                    # commitの変更履歴を見る
git show [commit id]       # 指定したcommitの変更を見る
git push origin [branch]   # リモートにプッシュ
git reset HEAD [ファイル名]  # addの取り消し
git reset --head HEAD^     # commitの取り消し
```
リーダブルコードを読んで

## 本の情報

著者: Dustin Boswell, Trevor Foucher
訳: 角 征典


## 本の内容
「良いコード == 理解しやすいコード」
という前提のもと、どうすれば理解しやすくなるかを
命名、コメント、コーディングなどに関して説明してくれている。
内容はどんな言語でも適用できることで、

- わかりやすい命名をしよう
- 処理を簡潔に、小さくしよう ということが一貫して書かれている

## 本の感想
### 命名に関して
長くてもいいから、
名前が正確に挙動を表していて、誤解されない方がいいというのは、耳が痛かった。
○○_info, △△_hashとか捉え方を色々できそうな名前をつけてしまうこともあるので、
解釈を間違えないメソッドにしようと思った。

### 小さく書くということに関して
小さく処理をするとどうしても処理全体は長くなるのでコードを追うのもしんどくなるのだけど、
小さくして1メソッドの理解も早くできるのであれば、やはり小さくすることは正義だと感じた。

### コメント
コメントに関しても記載があった。
わかりにくいコードの挙動、TODO、コードの欠陥に関しては
今後現場に出たときに残して行きたいと思った。
そんなコードは書くべきではないけど一部負債となっている部分もあるという前提

## 総括
難しいことは全くないのだけど、
命名にたいしてここまで考えるのかということを分からせてくれるいい本だった。
定期的に読み返して普段からこれが出来ているかと見直すと良いと思う。
怠け者のためのUnixBenchインストールガイド

だいたい自分用。

### 追記(2020/10/26)
怠け者のための、などと抜かしながらスクリプト配布でないのが申し訳ないです。
代わりといってはなんですが、実行する行数を減らしてみました。実行するコマンドは一切変わってません。

# 注意
・CentOS 7、CentOS 8、Ubuntu 18.04、Ubuntu 20.04でのみ検証しています。
・検証したVPS(Linode)以外では追加のパッケージインストールが必要になるかもしれません。
・実験環境のため、rootユーザでの作業です。一般ユーザで作業する場合は適宜sudoを付け加えてください。

## CentOS 7
```bash
# yum update -y && yum install make gcc gcc-c++ -y
# curl -O https://storage.googleapis.com/google-code-archive-downloads/v2/code.google.com/byte-unixbench/UnixBench5.1.3.tgz
# tar xvf UnixBench5.1.3.tgz && rm UnixBench5.1.3.tgz && cd UnixBench && make
# ./Run -i 1
```

## CentOS 8
```bash
# dnf update -y && dnf install make gcc gcc-c++ perl tar -y
# curl -O https://storage.googleapis.com/google-code-archive-downloads/v2/code.google.com/byte-unixbench/UnixBench5.1.3.tgz
# tar xvf UnixBench5.1.3.tgz && rm UnixBench5.1.3.tgz && cd UnixBench && make
# ./Run -i 1
```

## Ubuntu 18.04 / 20.04 (共通)
```bash
# apt update && apt install make gcc g++ -y
# wget https://storage.googleapis.com/google-code-archive-downloads/v2/code.google.com/byte-unixbench/UnixBench5.1.3.tgz
# tar xvf UnixBench5.1.3.tgz && rm UnixBench5.1.3.tgz && cd UnixBench && make
# ./Run -i 1
```

# 結果
LinodeのNanodeマシンは割り当てられるCPUが固定なので比較・検証がしやすいです。

| CPU | メモリ(GB) | SSD(GB) |
| --: | --: | --: |
| Intel Xeon E5-2697 v4 @ 2.3GHz x1 | 1.0 | 25 |

| OS | 平均Score |
| :-- | --: |
| CentOS 7 | 740 |
| CentOS 8 | 800 |
| Ubuntu 18.04 | 835 |
| Ubuntu 20.04 | 835 |
Terraformで使われていた？マークの意味を調べてみた

# はじめに
他者が作成したTerraform定義を、自身の環境で使用したいなーと思い、
ソースコードを見ていると、以下のような記載がありました


```main.tf
count = var.is_boolean ? 1 : 0
```

? ? ?
countに```var.is_boolean```を入れる？
その後に続く ```? 1 : 0```は一体どういう意味？

私のググり力が低いせいか、調べても記事は出てこない、、、

初心に立ち返り、公式ページを調べてみるとようやくわかりました！

# ?（クエスチョンマーク）は条件式を表すための記号
公式ページ（https://www.terraform.io/docs/configuration/expressions.html ）によると、
Terraformで条件式を表現する時は

```condition ? true_val : false_val
```
と表すらしい


# ソースコードと照らし合わせてみる

```main.tf
count = var.is_boolean ? 1 : 0
```
``condition ? true_val : false_val``と照らし合わせてみると、

``var.is_boolean``が``true / false``かを判定し、
 ``true``の場合は、``count``に``１``を代入し
 ``false``の場合は、``count``に ``0 ``を代入するということになる。

# さいごに
Terraformの公式ドキュメントはとてもわかりやすいです。

初めての投稿でしたが、
改めてインプットしたことをまとめてみると、頭が整理されるなーと実感しました
Scala2.13だと privateとprivate[this]のパフォーマンス差は無い

こちらの記事を参考に検証してみたところ、最新バージョンだと違う結果だったので共有
https://ukaznil.com/20170902_scala_privatethis_valvar/

結果

```zsh
$ sbt run
... 関係ないログは省略 ... 
access with `private val` has taken 589 msec.
access with `private[this] val` has taken 576 msec.
[success] Total time: 4 s, completed 2020/04/25 10:16:45
```

実行コード

```scala
object Runner {
  def main(args: Array[String]): Unit = {
    val tester = new Tester()
    tester.test()
  }
}

class Tester {
  private val input1 = 1234567890
  private[this] val input2 = 1234567890
 
  def test(): Unit = {
    val loopNum = Int.MaxValue
    val ticToc = new TicToc()
 
    ticToc.tic()
    (0 until loopNum).foreach { _ =>
      val output = input1
    }
    ticToc.toc("access with `private val`")
 
    ticToc.tic()
    (0 until loopNum).foreach { _ =>
      val output = input2
    }
    ticToc.toc("access with `private[this] val`")
  }
}

class TicToc() {
  private var started: Boolean = false
  private var ticTimeInMillis: Long = 0
 
  def tic(): Unit = {
    require(!started, {
      "you must call 'toc' in advance."
    })
    started = true
    ticTimeInMillis = System.currentTimeMillis()
  }
 
  def toc(message: String): Unit = {
    require(started, {
      "you must call 'tic' in advance."
    })
    started = false
 
    val t = System.currentTimeMillis() - ticTimeInMillis
    println(s"$message has taken $t msec.")
  }
}
```
STM32F3のDACで正弦波を出す

Nucleo-F303REを買ってみました。とりあえず動作確認用にDACで正弦波を出してみます。

今回はLチカのちょっと高度版、くらいの位置づけなので、割り込みでデータを更新して、というような事は扱いません。固定波形をひたすら出し続けるだけです。

C++のコードなので、C++が動く環境で動かしてください(あるいは、使用したい言語に書き直してください)。

```c++
__HAL_RCC_GPIOA_CLK_ENABLE();
__HAL_RCC_DAC1_CLK_ENABLE();
__HAL_RCC_DMA1_CLK_ENABLE();
__HAL_RCC_TIM3_CLK_ENABLE();

GPIO_InitTypeDef gpio_dac1_1 = {
    .Pin = GPIO_PIN_4,
    .Mode = GPIO_MODE_ANALOG,
};
HAL_GPIO_Init(GPIOA, &gpio_dac1_1);

DAC_HandleTypeDef hdac = {
    .Instance = DAC1,
};
HAL_DAC_Init(&hdac);

DAC_ChannelConfTypeDef dac_conf = {
    .DAC_Trigger = DAC_TRIGGER_T3_TRGO,
    .DAC_OutputBuffer = DAC_OUTPUTBUFFER_ENABLE,
};
HAL_DAC_ConfigChannel(&hdac, &dac_conf, DAC_CHANNEL_1);

TIM_HandleTypeDef htim = {
    .Instance = TIM3,
    .Init = TIM_Base_InitTypeDef{
        .Prescaler = 0,
        .CounterMode = TIM_COUNTERMODE_UP,
        .Period = 72 - 1,
    },
};
HAL_TIM_Base_Init(&htim);

TIM_MasterConfigTypeDef tim_master = {
    .MasterOutputTrigger = TIM_TRGO_UPDATE,
};
HAL_TIMEx_MasterConfigSynchronization(&htim, &tim_master);

DMA_HandleTypeDef hdma_dac1_1 = {
    .Instance = DMA1_Channel3,
    .Init = DMA_InitTypeDef{
        .Direction = DMA_MEMORY_TO_PERIPH,
        .PeriphInc = DMA_PINC_DISABLE,
        .MemInc = DMA_MINC_ENABLE,
        .PeriphDataAlignment = DMA_PDATAALIGN_HALFWORD,
        .MemDataAlignment = DMA_MDATAALIGN_HALFWORD,
        .Mode = DMA_CIRCULAR,
        .Priority = DMA_PRIORITY_MEDIUM,
    },
};
HAL_DMA_Init(&hdma_dac1_1);
hdac.DMA_Handle1 = &hdma_dac1_1;

constexpr uint16_t N = 1000;
static uint16_t buff[N] = {};

for (uint16_t i = 0; i < N; i++)
{
    buff[i] = static_cast<uint16_t>(
        sinf(i * 2 * 3.1416f / N) * 1024 + 2048);
}

__HAL_RCC_SYSCFG_CLK_ENABLE();
SYSCFG->CFGR1 |= SYSCFG_CFGR1_DAC1_TRIG1_RMP | SYSCFG_CFGR1_TIM6DAC1Ch1_DMA_RMP;

HAL_DAC_Start_DMA(&hdac, DAC_CHANNEL_1, reinterpret_cast<uint32_t *>(buff), N, DAC_ALIGN_12B_R);

HAL_TIM_Base_Start(&htim);
```

特に面倒な点はありません。F4等と同じような手順で使えます。
1点、SYSCFGの設定に気がづかず、ハマりました。リファレンスマニュアルちゃんと読めって話ですね。。。
DAC1とDMAの組み合わせ、DAC1とTIM3の組み合わせの際は、それぞれSYSCFGの設定が必要です。

***

![SDS00008.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/264452/17c5de8d-157c-7a92-17e5-9a9310628629.png)

72MHzをタイマで72分の1にして、1周期1000ポイントなので、1kHzの正弦波となります。
実際には1.00324kHzとカウントされていますが、これはNucleoにはHSEが未実装のため、HSIを使っていることによると思われます。データシートによるとHSIは25℃時で1%のエラーらしいので、0.3%程度の誤差は仕様の範囲内です。
[Unity初級]文字列と数値で型変換

#概要
UIのTextにある数字（得点など）を扱いたい。Text上のデータは文字列型なので数値型に変換をする必要がある。
![スクリーンショット (144).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/617265/5154fe49-167c-1604-d5a3-94dca988214b.png)

#本文
```cs

    using System;


    string x = GameObject.Find("Text").GetComponent<Text>().text;
    int y = Convert.ToInt32(x);
    y += 10;
    GameObject.Find("Text").GetComponent<Text>().text = Convert.ToString(y);
```
まずConvert.ToInt32()で文字列を数値型に変換。必要な変更をしたらConvert.ToString()で数値型から文字列型に変換すればまたTextに戻すことができます。

#追記
using System;が抜けてるとエラーになりました。
#追記2
別の表記方法

```cs
(123).ToString("D4")
(12.3456).ToString("F3")
```
D4は4桁に足りない分は左から0を埋めていくタイプの整数型
F3は小数点第3位まで表記の固定小数点型
svgタグの画像でinput type="file"の「選択されていません」を置き換える

```typescript
const FileUpload:React.FC = () => {
    const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
        // これで取り出す
        const file: File | undefined = e.target.files?.[0]
    }

    return <>
        <input id={"uploadEventAttachment"} type={"file"} value={''}
               onChange={onChange}
               style={{display: "none"}}/>
        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
             onClick={() => (document.querySelector("#uploadEventAttachment") as HTMLInputElement).click()}>
            <path d="M9 16h6v-6h4l-7-7-7 7h4zm-4 2h14v2H5z"/>
        </svg>
    </>
}
```

mouseOver時の変化がほしいところ。
始めるきっかけ

Qiitaの存在を知ったのはわかんないことをググってそれで出てきた
その後しばらくたってQrankというものを知って
アウトプットブログっていうものがある事を知った

これまでの経験や見聞から、多面的にアウトプットブログの威力は絶大でやったほうがいいことに気づき、それを実行できる気力も備わったので実行することにした
多面的の内容は↓　ほかにもあったような気がするけど思い出せないからあとで思い出したら追加する
・勉強はアウトプットすればする程身につく
・見返したときに自分の成長が分かる
・自分の価値を証明できる
Xamppをwindows起動時に開始する

#XamppをPC起動時に開始する方法
　xamppをインストールしたはいいが、毎回起動をするのは面倒。
　そんな時はwindowsのserviceにxamppのApacheなどの必要機能を登録する。

　詳細は下記リンクがわかりやすい。
　https://www.adminweb.jp/xampp/ini/index4.html
logファイルを整形・加工  (運用・調査で役立つ)


# 正規表現

規則性がある形にまずしないと何も始まらない。
正規表現を使ってまず加工しやすい形を作る

・以下のようなファイルがあるとする

```:例
target=dfaaaaaaaaaaaaaffffsafdsfffsafsdaff<abc>......</abc>
other=asdfaaaaaaaaaaaaaffffaaaaffadddfdafff<abc>......</abc>
other=asdfaaaaaaaaaaaaaffffaaaafaaadfdsfsdafasfffff<abc>......</abc>
other=asdfaaaaaaaaaaaaaffffaaaaffdsdaffdffff<abc>......</abc>
target=dfaaaaaaaaaaaaaffffsafdsfffasff<abc>......</abc>
```

### ありそうな抽出1
##### 取り出したい値が`<abc>`タグの中

テキストエディタで正規表現を有効にして削除(置換) 終端文字を指定

```
.*\<abc>
```
VSCODE例
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/52335/4995a5f2-a277-862b-206f-767fb5a33c78.png)

この後、`</abc>`を削除すれば取り出せる

### ありそうな抽出2
##### 取り出したい値が最初に出現する`ffff`の前まで 開始文字を指定

```
ffff.*$
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/52335/e31452d9-86bf-ca8b-9a4d-21f10a18e9b2.png)

#### その他

##### 複数スペースを一つのスペースにしたい

```
 +   # (+の前に半角スペースを入れてます)
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/52335/104f6ad3-651f-c97f-5b1b-77cc824ac5cb.png)

##### 無駄な改行がある時に改行を消したい

```
\n+ を \n　で置換
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/52335/85c84208-b23b-677f-5dab-8a4ea7e4666a.png)


# スプレッドシート、EXCEL

表形式で見る時や、比較などに便利。

##### 表形式で見る
区切り文字があればそれをタブに置換してEXCELに貼ればOK

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/52335/1fa98602-f3bb-5e27-aabd-f72e0e80ae3f.png)

↓ 貼り付け

スプレッドシート
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/52335/de12649f-e8fe-5265-ef30-1a7ffb66fa26.png)

#### 式を使う

##### 一つのファイルをあるを分割して複数ファイルに分割したい

以下のCSVを県単位でファイルに吐き出したい。

```csv:out.csv
県名,店舗名,住所
福岡県,aaaaa,xxxxxxxx
福岡県,bbbbb,xxxxxxxx
福岡県,ccccc,xxxxxxxx
福岡県,ddddd,xxxxxxxx
佐賀県,eeeee,xxxxxxxx
佐賀県,fffff,xxxxxxxx
佐賀県,ggggg,xxxxxxxx
佐賀県,hhhhh,xxxxxxxx
・
・
・
```

コマンドはこれでいけるとわかった。

```terminal:terminal
cat out.csv | grep '福岡県' > 福岡県.txt
```

でも47都道府県分コマンド作るの面倒だな・・
そんな時はスプレッドシートを使うといい
↓

A列に都道府県
B列に式 `="cat out.csv | grep '"&A1&"' > "&A1&".txt"`
を入れて47都道府県分コピーすればOK

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/52335/77db726a-b056-7142-dcc3-3c27db30dc53.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/52335/0bda1f7b-32e7-7d3e-1ea5-0c4a45c4260e.png)

## ファイルの重複行を除外する

```aaa.txt
aaa
aaa
ccc
ccc
ddd
gfgf
ddd
fff
fff
aaa
```

以下コマンドを実行

```terminal
 sort aaa.txt | uniq 
```

重複を除外しユニークになっている

```result.txt
aaa
ccc
ddd
fff
gfgf
```


##その他

役に立ちそうなものがあれば追加していきます。

- JSONをCSVに簡単に変換する方法  
https://qiita.com/yukiyoshimura/items/4c8d535ac79843d0fb0e
[Unity初級]OnTriggerEnterとOnCollisionEnter


#概要
キャラクターが衝突したタイミングで何かを実行したい時に使うOnTriggerEnterとOnCollisionEnter。それぞれの違いは？
#本文
Collider内のIs Triggerにチェックをつけた時に使うのがOnTriggerEnter
![スクリーンショット_(143).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/617265/73030467-e776-5a14-cbe7-592ba076294c.png)

```cs

    private void OnTriggerEnter2D(Collider2D col)
    {
        if(col.gameObject.tag == "arrow") {
            Destroy(col.gameObject);
        }
    }
```

Collider内のIs Triggerにチェックをつけない時に使うのがOnCollisionEnter


![スクリーンショット_(142).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/617265/1cc837dc-e839-1937-e883-552bcfb139ba.png)

```cs

    private void OnCollisionEnter2D(Collision2D col)
    {
        if(col.gameObject.tag == "arrow") {
            Destroy(col.gameObject);
        }
    }
```
Fetchを使ってポケモンのデータを取得してみた

こんにちは、初めての投稿です。現在Javascriptを学習しているので、今まで学んだことを備忘録として、かつアウトプットとしてQiitaにあげていこうと思います。
まだ理解が浅い部分もあるので、修正点があれば是非コメントお願いします:pray:

また、これから投稿していく記事はあくまで備忘録であり、細かい解説などをしていくものではありませんので、そこはご了承ください:bow:


#今回学んだことについて
今回は非同期通信の学習の一つとしてfetchメソッドについて学びました。fetchメソッドとは引数にWebAPIのURLを渡して外部とデータのやり取りをすることができるメソッドです。
また、fetchメソッドの返り値はPromiseオブジェクトになります。

今回は練習で使うAPIとして[Pokemon API](https://pokeapi.co/)を使用しました。

##WebAPIのURLにアクセスしてみる
今回は以下のAPIのURLを使ってポケモンのデータを取得してみます。

https://pokeapi.co/api/v2/pokemon/25/

なんのポケモンかわかりますでしょうか？ポケモン図鑑No.025のポケモンはピカチュウです。もし好きなポケモンがいれば、pokemon/の後ろを好きなポケモンの図鑑番号に置き換えてアクセスしてみてください！

ただ、上記のURLにアクセスすると、こんな画面が表示されます。

![スクリーンショット 2020-04-19 21.58.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/619769/815eef66-69cd-0562-3614-3799dea461eb.png)

このスクリーンショットでもまだ、取得した情報の一部です。ただの文字列で何がなんだかわかりづらいですね。

これをJavascriptを使って扱いやすいJsonの形式に変更していきます。
（因みに、[Pokemon API](https://pokeapi.co/)のサイトはAPIのURLをしていすると、自動でみやすい形式のデータを表示してくれますが、今回は無視します笑）

##Javascriptコード
以下、Javascriptのコードです。（説明の為、各ブロックごとに番号を振りました。）

```Javascript
//１
fetch('https://pokeapi.co/api/v2/pokemon/25/')

//2
.then(response => {
  return response.json();
})

//3
.then(pokemon => {
  console.log(pokemon);
});

```

##コードの説明

１、まず一つめの処理ですが、fetchメソッドの引数にAPIのURLを渡して、外部のデータ（今回はポケモンのデータ）を取得します。返り値はPromiseオブジェクトです。

```
 const data = fetch('https://pokeapi.co/api/v2/pokemon/25/');
 console.log(data);
```
こんな感じで、fetchメソッドの返り値を変数dataに代入してconsole.logで中身をみてみると、

![スクリーンショット 2020-04-19 22.28.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/619769/fc1e37af-8b7d-1e3c-1687-2bf49749153a.png)

Promiseオブジェクトが返ってきているのがわかります。

２、１の処理でPromiseオブジェクトを取得したので、「thenメソッド」でデータの受け渡しができます。また、１で取得したPromiseオブジェクトはthenメソッド内のコールバック関数の引数に渡します。（今回は引数名をresponseとしました。）
そして、引数に渡されたPromiseオブジェクトを.jsonメソッドを使用してJSON形式で読み取ります。.json()メソッドはPromiseオブジェクトをJSON形式で読み取るメソッドと言った感じでしょうか。以下、[MDN](https://developer.mozilla.org/ja/docs/Web/API/Body/json)からの引用です。

>Body ミックスインの json() メソッドは、 Response ストリームを取得して、完全に読み取ります。 ボディのテキストを JSON として解釈した結果で解決する promise を返します。
参照元：MDN web docs (https://developer.mozilla.org/ja/docs/Web/API/Body/json)

上記からもわかるように、.json()メソッドの返り値もまた、Promiseオブジェクトになり、returnで返します。

３、２でPromiseオブジェクトを返したので、先程と同じ流れで、thenメソッドでデータを受け取ります。今回はコールバック関数の引数をpokemonとしました。console.logで引数の中身を見てみます。

![スクリーンショット 2020-04-25 9.46.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/619769/c81ad0b8-0934-a2c9-b492-755c9f6a1399.png)

一番初めにAPIのURLにアクセスした時に見た長い文字列とは違い、見やすいJSON形式になりました。
ここから、このデータを使って色々な処理をしていきます。

今回はここまでです、ありがとうございました！:pray:
Rでミーン・メジアン・モードをグラフで表すテンプレート

###### tags: `rBasicLearning`
##  1. テンプレート
ミーンは赤・メジアンは青・モードは黄色で表してます

```r
RVgraph <- function(a){
  h1 <- hist(a,
       breaks = max(a)-1)
  segments(mean(a), 0, mean(a), max(h1$counts), col = "red", lwd = 2)
  segments(median(a), 0, median(a), max(h1$counts), col = "blue", lwd = 2)
  segments(which.max(h1$counts), 0, which.max(h1$counts), max(h1$counts), col = "yellow", lwd = 2)
}
```
##  2. 具体例
###  使うデータ
```r
data <- c(1, 1, 1, 1, 2, 3, 4, 5, 16, 20)
```
###  出力
```r
RVgraph(data)
```
![](https://i.imgur.com/mf0TgD6.png)
Submitボタンを非活性にしてユーザビリティを良くする(二重送信を防止)

###ボタン押してから遷移するまで時間がかかりそうなフォーム
本当に処理されているのかわからないユーザーは、不安のあまりボタンを連打したりブラウザバックしたり画面を閉じてしまうかもしれない。

```html:html

<form method="post" action="post.php">
  <input type="file" name="image1" required="required">
  <input type="file" name="image2">
  <input type="file" name="image3">
  <input type="file" name="image4">
  <input type="file" name="image5">
  <button type="submit">送信</button>
</form>
```


###そうだ、jQueryでボタンを非活性にしよう！！！

3秒で思いついた方法😇
ボタンをクリックしたら非活性にして、submitしてグルグルを表示する。

```javascript:jQuery
$('button').on('click', (event) => {
  const $button = $(event.target)

  $button.prop('disabled', true)
    .closest('form').submit()
    .html('<i class="fas fa-spinner fa-spin"></i>')
})
```

###想定してた動きじゃない
なんかrequire効いてなくね？🥺

###こうすればよかったっぽい
中で`return false`すれば送信されないのでバリデーションとか追加できる。

```javascript:jQuery
$('form').on('submit', (event) => {
  const $button = $(event.target).find('button')
  
  $button.prop('disabled', true)
    .html('<i class="fas fa-spinner fa-spin"></i>')
})
```

送信前
<img width="205" alt="送信前" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/122701/d5ba789d-3046-23d2-1985-a3235a112dbe.png">

送信中
<img width="205" alt="送信中" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/122701/034016f6-77f6-676b-dc2b-505075d4196e.png">
Writable Tag -wtag-mode- for FLAC

# mf-tag-write 暫定 flac 対応

## mf-tag-write に flac ライブラリを暫定追加しました。
[mf-tag-write](https://qiita.com/sfubuki/items/0f470b859837927b4e28) は音楽ファイル .mp3 .m4a .oma のタグを書き換える Emacs 用の関数です。
使い方は変わらないので mf-tag-write を投稿したときの記事を参照してください。最後にまとめてリンクしておきます。
勿論 mf-tag-write を呼んでいるインタラクティブなインターフェイス [wtag](https://qiita.com/s-fubuki/items/f69b646c1a879c7e332f) や taged も flac 対応になり、諸々のバグフィクスをした最新の関連関数を同梱しています。

[wtag ダウンロード]((https://github.com/s-fubuki/wtag.git))

## どこが暫定なのか
結論から云うと Seek Block の書き換えする関数の動作確認がされていないからです。

flac にも AAC(mp4) のようにパケ単位でデータを読めるようにシークテーブルがあるのですが、flac の場合は任意でありあってもなくてもいいことになっています。
このブロック(テーブル)は再生の安定性やBG再生を補助するためのもので、無くても再生そのものができなくなる訳ではないので、このブロックをデータにつけるつけないはエンコーダ側に委ねられています。

なのでソニー製品でエンコードした flac だとシークブロックがありません。
ゼロフィルしたダミーのシークブロックをつけて Walkman で試しても再生に問題が無いので、テーブルの参照もしていないようです。
そんな訳で自分の環境では実証テストができず、果たして正しく実装できているのかどうかイマイチ自信がなく暫定対応ということになっています。
ちなみに foobar2000 でも試しましたがこちらもシークブロックを見てないようで、ダミーのブロックのデータでも問題なく再生できてしまいます。

<!--
このテーブル、おそらく将来を見据えて無駄に 64bit幅もあり、
現状そこまでオフセットのかかる巨大データで flac を運用することは現実的にないので、
ポータブルだと実装の対価コストの方が上になるので省略しているような気もします。
-->

あと flac はアートワークをいくつも持てるようですが、はじめのひとつしか見ていません。

# Changes
## Sat Sep 26 08:50:14 2020
アーカイブのロケーションを移動。

## Sat Aug 22 09:18:21 2020
このページ意外と見られていたので、zip のリンクをバグ修正された最新のものに差替ました。

# 関連ページ
- [mf-tag-write](https://qiita.com/sfubuki/items/0f470b859837927b4e28)
- [wtag](https://qiita.com/s-fubuki/items/f69b646c1a879c7e332f)
集合住宅の内部をストリートビューにしてみた

## 概要
360度写真をWeb上で表示できるA-frameというライブラリと、Canvas内を操作するKonvaを組み合わせて、技術実験で親戚の経営するシェアハウスの内部を360度写真で撮影し、グーグルマップのストリートビューっぽくしました。PCとスマホの両方で見れます（VRゴーグルは非対応）。



![D8g_dLhUIAAXw_z.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/82103/4ae58474-debc-fd09-efd3-a778b6b485c4.jpeg)

各エリアの矢印や丸のアイコンで隣接するエリアに移動したり、一覧やマップからジャンプすることが可能です。

ここでは簡単にやり方と注意点をまとめておきます。

## やり方
1. 360度カメラを買います。
2. 撮影するポイントを決めます。隣接するエリアを考えるとやりやすいです。
3. マップを作成します。（この2と3を最初に考えなかったので、今回のマップは若干歪になっていますorz）
![1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/82103/61fc5071-547a-d499-67c9-a5f629d5c7b7.jpeg)
4. 撮影を行います。可能なら360度カメラを全て同じ方角に向けてから撮影すると後々楽です。（これをやってなかったばかりに、後々画像の初期表示角度を全て調整するハメになりましたorz）

5. v1.0.0以降のa-frame.jsを入手します。
https://aframe.io/
6. 下記のコードを用意します。
 
```js
    <a-scene>
        <a-sky id="sky"></a-sky>
        <a-entity raycaster="objects: .ui" cursor="rayOrigin:mouse"></a-entity>
        <a-entity rotation="0 0 0" id="rotator">
            <a-entity camera position="0 0 0" look-controls></a-entity>
        </a-entity>
        <a-image src="./icon/arrow.png" rotation="0 0 0" position="0 0 0" id="arrow1" class="ui" visible="false"></a-image>
    </a-scene>
```

詳しくはa-frameの公式ドキュメントを読んでいただきたいのですが、簡単に説明するとa-skyというのが空間の背景になりまして、ここに360度写真が載ります。まあ簡単に言うとこのアプリはエリア移動操作に合わせて背景画像の写真を切り替えているだけなのです。

a-entity(raycaster)は視点を自由に回したりクリックやタップでインタラクションを起こすために必要な物です。もう一つのa-entity(id="rotator")はカメラの土台です。内包されているcameraのlook-controlsが有効になると角度をスクリプトで操作できないので、土台を用意してそれの角度を変えている感じです。

最後のa-imageはエリア移動用のボタンです。これは矢印の画像を使っていますが、別に立方体でも構いません。

ソース
https://github.com/ShoyoFILMS/sharehouse360
python: 自作クラスをnumpy ndarrayに使用する

https://numpy.org/doc/stable/user/basics.subclassing.html#module-numpy.doc.subclassing (公式)を参考にすれば良いでしょう。


以下は簡単な実装例です。



```python
class Element:
    def __init__(self, r, c):
        self.r = r
        self.c = c
        
    def __repr__(self):
        return f'Element({self.r},{self.c})'
```

r行c列目の要素がElement(r, c)であるようなnumpy.ndarrayを作りたい、とします。

<br>

MyNdarrayクラスをnp.ndarrayを継承して以下のように作ります。

```python
import numpy as np

class MyNdarray(np.ndarray):
    def __new__(cls, dimension):
        shape = (dimension, dimension)
        return super().__new__(cls, shape, dtype=Element)

    def __init__(self, dimension):
        for r in range(dimension):
            for c in range(dimension):
                self[r, c] = Element(r, c)
```

<br>

`__new__` でshapeが(dimension * dimension) の numpy ndarray instanceを作成して, `__init__` で初期操作(コンストラクタ)が行われます.



```python
a = MyNdarray(3)
>> MyNdarray([[Element(0,0), Element(0,1), Element(0,2)],
           [Element(1,0), Element(1,1), Element(1,2)],
           [Element(2,0), Element(2,1), Element(2,2)]], dtype=object)
a[0, 0]
>> Element(0,0)
```

<br>

ndarrayのスライシング操作や転置機能をそのまま使うことができるのがいいですね.

```python
a[:, 0:2]
>> MyNdarray([[Element(0,0), Element(0,1)],
           [Element(1,0), Element(1,1)],
           [Element(2,0), Element(2,1)]], dtype=object)
a.T
>> MyNdarray([[Element(0,0), Element(1,0), Element(2,0)],
           [Element(0,1), Element(1,1), Element(2,1)],
           [Element(0,2), Element(1,2), Element(2,2)]], dtype=object)
```

<br>
<br>

また, `MyNdarray` クラスに, 属性を追加したいときは`__array_finalize__` 関数を使います.

```python
import numpy as np

class MyNdarray(np.ndarray):
    def __new__(cls, dimension):
        shape = (dimension, dimension)
        obj = super().__new__(cls, shape, dtype=Element)
        obj.dimension = dimension
        return obj
    
    def __init__(self, dimension):
        for r in range(dimension):
            for c in range(dimension):
                self[r, c] = Element(r, c)
                
    def __array_finalize__(self, obj):
        if obj is None:
            return
        self.dimension = getattr(obj, 'dimension', None)
```

```python
a = MyNdarray(3)
a.dimension
>>> 3
```
Django お問い合わせフォーム2

#前提
前回の続きです。

https://qiita.com/yusuke_mrmt/items/ebefdb6e8704913f6a4c
#本題

##Gmailでアプリパスワードの設定を行います。

二段階認証を設定します。

まずGmailアプリを開き左上にあるメニューバーをタップします。
下の方に**設定**とあるのでタップします。

**Googleアカウントの管理**をタップします。

**セュリティ**の項目を選択し、
**アカウントの保護**や適切な設定を行った上で
二段階認証などの設定をしましょう。
※二段階認証設定後に、アプリパスワードの項目が現れます。

取得したパスワードは、アプリにだけ使うのでGoogleさんが仰ってるように
どこかに保管しておくなどの処置は取らなくてもいいと思います。
ですがDjangoの設定ファイル**<code>settings.py</code>**に記述するので
テキストエディタにコピーしておきましょう。

##メール送信機能を追加する
Djangoのメール送信機能を追加していきます。

まずは設定ファイルの**<code>settings.py</code>**に
メールサーバーを使う為の記述をします。

GitHubでコードを投稿する際は、<code>.gitignore</code>ファイルなどで
除外するような施しを完全に行いましょう。


```project/project/settings.py
STATIC_URL = '/static/'

# メールサーバー用
EMAIL_HOST = 'smtp.gmail.com'
EMAIL_HOST_USER = 'アドレス@gmail.com'
EMAIL_HOST_PASSWORD = '取得したアプリパスワード'
EMAIL_PORT = 587
EMAIL_USE_TLS = True
```

次に<code>views.py</code>にて、
お問い合わせフォームに書かれたメッセージを処理し
適切な応答をするように追記していきます。


```project/contact/views.py

from django.shortcuts import render, redirect
from .forms import ContactForm
from django.http import HttpResponse # 追記
from django.conf import settings # 追記
from django.core.mail import BadHeaderError, send_mail # 追記

.........

def contact_form(request):
    if request.method == 'POST':
        form = ContactForm(request.POST)
        if form.is_valid():
            # 追記
            subject = form.cleaned_data['subject']
            message = form.cleaned_data['message']
            sender = form.cleaned_data['sender']
            myself = form.cleaned_data['myself']
            recipients = [settings.EMAIL_HOST_USER]
            if myself:
                recipients.append(sender)
            try:
                send_mail(subject, message, sender, recipients)
            except BadHeaderError:
                return HttpResponse('無効なヘッダーが見つかりました。')
            return redirect('contact:complete')
    else:
        form = ContactForm()
    return render(request, 'contact/contact_form.html', {'form': form})

.........
```

<code>form.is_valid()</code>で検証されたデータを整形して返すために
<code>cleaned_data[]</code>を使って変数に格納します。


<code>recipents</code>は設定ファイルの
settings.pyで定義した自分のアドレスを渡しています。


<code>send_mail</code>では、４つの引数が必須です。
自分のアドレス宛にsubject・message・senderを送ります。
※sender（送信者のアドレス）は自分のメール受信箱に表示されないので後に変更します。


<code>BadHeaderError</code>は、ヘッダインジェクションを防ぐ為の記述です。

<code>if_myself</code>は、送信者がチェックボックスにチェックを入れたとき、
送信者のアドレス（sender）がrecipientsに追加され双方にメールが送られます。

双方に送られたメールの送信者は設定した自分のアドレスからとなります。

以上で一度、送信してみましょう。
送信完了へリダイレクトされれば成功です。
たまによく使うGitコマンド

# はじめに
「いっつもこれググってんなー」というやつだけ纏める
備忘録

# レポジトリあれこれ
```shell:特定のリビジョンから差分のあるファイルの実体をexport
git archive --format=zip --output=export.zip HEAD $(git diff --diff-filter=d --name-only c40269ef)
```

```shell:特定のファイルの変更を無視する
git update-index --assume-unchanged [ファイル名]
git update-index --no-assume-unchanged [ファイル名] #取り消し
git ls-files -v #確認
```

```shell:リモートリポジトリの情報をみる
 git remote show origin
```
```shell:リモートリポジトリの削除
 git remote remove {repname}
```
```shell:ﾛｸﾞをｺﾝﾊﾟｸﾄに見る
git log --oneline
```
```shell:ﾛｸﾞを中身付きでみる
git log -p
```
```shell:ﾛｸﾞをファイル名で見る
git log --stat
```
```shell:プルリク出す
 git request-pull {start_commit_ID} {rep} {end_commit_ID}
```
```shell:コミットをまとめたり順序を入れ替えたり
git rebase -i HEAD~~~
git rebase -i HEAD~3

エディタが開くのでゴニョゴニョする
pickをsにしたら直前のpickを指定したコミットに統合される
```

```shell:特定のリビジョンまでPush
git push origin HEAD~2:{branchname}
これで2個前までのコミットがpushされる
```

```shell:リモートブランチの削除
git push --delete origin {branch_name}
```

# とりあえずやる設定


```shell:改行コード変換の無効化
git config --global core.autoCRLF false
```

# その他
```shell:新規リポジトリ作ってpush
echo "# repname" >> README.md
git init
git add README.md
git commit -m "first commit"
git remote add origin {url}
git checkout -b develop
git push -u origin master
git push -u origin develop
```
Aurora(PostgreSQL)ではMulti-master構成が利用できない

# Multi-master構成

Multi-master（マルチマスター）とは、複数ノードに書き込みが行えるクラスタ構成のことです。
Aurora(MySQL)では以下の記事のようにマルチマスター構成ができるようになりました。

- [【新サービス】Amazon Aurora Multi-Masterが一般公開になりました](https://dev.classmethod.jp/articles/amazon-aurora-multi-master-ga/)
- [[レポート]Amazon Aurora Multi-Master:書き込み性能のスケールアウト](https://dev.classmethod.jp/articles/dat404-aurora-multi-master/)


RDS(PostgreSQL)、Aurora(PostgreSQL)の場合は、リードレプリカを構成しリードのみ分散させることは可能ですが、書き込みを複数ノードに実施することはできません。
マルチマスター構成はAurora(MySQL)で実現されているので、Aurora(PostgreSQL)でもいずれ提供されるかもしれません。

# 参考

- [Aurora マルチマスタークラスターを使用する](https://docs.aws.amazon.com/ja_jp/AmazonRDS/latest/AuroraUserGuide/aurora-multi-master.html)
テスト投稿

はじめまして、ジェミニです。
自分も入社してから4年目となりましたので、
Qiitaでブログを始めてみました。

ただ、問題が一つ。

Markdown言語を書いたことがない!!

そこで、さいしょは
Markdown言語について調べた内容をテスト投稿として書いてみようと思います。
とりあえず、基本的なところだけわかればいいかな(^^♪

えっと、改行はできているみたいだから、まずは見出しかな？

#見出し１
##見出し２
###見出し３
####見出し４

見出しは先頭に「＃」のマークを一つつければいいみたいだね。
んで、「＃」のマークを一つ増やすと、だんだん見出しが小さくなるみたい。

次は強調文だ。
まずは普通の文。
*次は強調文*
**だんだん強調されるよ**

なるほど、「**」を囲うと強調文になるんだね。
「*」だと強調されなかったっぽい( ﾟДﾟ)
  
よし、最後だ。
これがやりたかったからブログを始めたんだよね。
勉強用ソースコードの貼り付け(#^^#)

まずは、１行
`System.out.println("Hello World")`
`x = "Hello"`
「`」（＠+シフトで出る文字）で囲うとソースコードが書けるんだね。

  そして、いよいよ最後。
  ずっと、見ていてやりたかったもの(#^^#)
  「```」と言語名を先頭につけて、最後に「```」をつけると。

```java
class Sample()
{
}
```

できた(＊'ω'＊)
これですこしは、エンジニアになれたかな？

今週はここまで。
来週も少しずつ頑張っていこう！！
じゃあね
CSSのposition: stickyでテーブルのヘッダー行・列を固定してborderもいい感じに

## これは何

CSSの```position: sticky;```だけででテーブルヘッダを固定できると聞いて感激し
```border-collapse: collapse;```だと枠線が変になることに絶望して
collapseぽく使えるようにした

## ブツ

```css
table.sticky-header {
  border-collapse: separate;
  border-spacing: 0;  /* ここ */
}
table.sticky-header:not(.not-vertical-sticky) > thead > tr > th {
  position: sticky;
  top: 0;
  z-index: 2;
}
table.sticky-header:not(.not-horizontal-sticky) > thead > tr > th:first-child {
  position: sticky;
  left: 0;
  z-index: 3;
}
table.sticky-header:not(.not-horizontal-sticky) > tbody > tr > th:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
}

/* ここ */
table.sticky-header > thead + tbody > tr > th,
table.sticky-header > thead + tbody > tr > td {
  border-top: none;
}
table.sticky-header > thead > tr:not(:first-child) > th,
table.sticky-header > thead > tr:not(:first-child) > td,
table.sticky-header > tbody > tr:not(:first-child) > th,
table.sticky-header > tbody > tr:not(:first-child) > td {
  border-top: none;
}
table.sticky-header > thead > tr > th:not(:first-child),
table.sticky-header > thead > tr > td:not(:first-child),
table.sticky-header > tbody > tr > th:not(:first-child),
table.sticky-header > tbody > tr > td:not(:first-child) {
  border-left: none;
}

table thead tr th,
table thead tr td,
table tbody tr th,
table tbody tr td {
  border: 10px solid red; /* あとは好みで普通にボーダーを適用させるだけ */
}
```

SCSS版はここに置きました
https://github.com/umenosuke/tslib/blob/master/src/html/table/_stickyHeader.scss

## 説明

```border-collapse: separate;```のまま
```border-spacing: 0;```で隙間をなくし
重複してしまうborderをnoneにして対応

theadがあってもいいし無くてもいいように
上側のborderをnoneにするところはゴニョゴニョ

classのつけ外しで水平&垂直のstickyをそれぞれ有効/無効にできるようにしてます

## 参考

CSSのposition: stickyでテーブルのヘッダー行・列を固定する
https://qiita.com/orangain/items/6268b6528ab33b27f8f2
Vue.js2+ Forms Tutorial – Form Validation in Vue with Vuelidate

This is a comprehensive Vue.js 2+ Form tutorial. In this tutorial, we are going to learn how to create Forms in Vue.js from scratch and also going to cover how to do client-side Form validation in Vue application using the Vuelidate package.

click here to read more
https://www.positronx.io/vue-js-forms-tutorial-form-validation-in-vue-with-vuelidate/
Vue.js 2 + VeeValidate + BootstrapVue – Form Validation Example

In this tutorial, we will learn how to create a responsive web form using the BootstrapVue front-end CSS library and validate that Form using the Template-Driven approach using VeeValidate Form Validation Framework.

click here to read more

https://www.positronx.io/vue-js-veevalidate-bootstrapvue-form-validation-example/
Build Dynamic Data Table in Vue.js 2+ with Vuetify

In this tutorial, we are going to learn how to build a customizable and pageable data table in Vue application using the Vuetify plugin. We will also look at how to add data sorting, filtering, and paginating feature very easily in Vue.js 2+.

click here to read more

https://www.positronx.io/build-dynamic-data-table-in-vue-js-with-vuetify/
chshコマンドを使わずにデフォルトシェルを変更する

# 実はシステム環境設定から出来る

　デフォルトシェルの変更を`Terminal`または`iTerm`を立ち上げて`chsh`するという記事はしょっちゅう見かける。
　だけどシステム環境設定のユーザーとグループを開き、ロックを解除し、自分のアカウントを右クリックで「詳細設定」のメニューを選ぶと実は色々設定出来ることが解ります。

## その中のログインシェルを選択

　色々選択出来る中のログインシェルをクリックすると、ポップアップメニューでログインシェルを選択することが出来る。
Catalinaの場合だと、

* `tcsh`
* `sh`
* `csh`
* `zsh`
* `bash`

 がポップアップメニューに並んでいるので、好きなログインシェルを選ぼう。

あとは、`OK`ボタンを押して、システム環境設定を閉じてから好みのターミナルソフトを起動してみよう。
ターミナルソフトでわざわざログインシェルを指定していない限り、さっき選んだログインシェルでターミナルが使える様になっているはず。

## `fish`が使いたい人は

　確かめたことはないけど、上の一覧に出てくるシェルはクリーンインストールしたときにインストールされる`/bin/`の下のシェルしか出て来ないと思うので、自分で`/usr/local/bin`下に最新バージョンの`shell`や一覧にない`shell`をインストールした人は諦めて`chsh`しよう。
フィボナッチ数の無限和が-1だそうです。

私は、WolframAlphaの結果が正しいような気がします。																																																									
																											(参考)一瞬でフィボナッチ数の無限和が-1であることを示す＜youtube																													
https://www.youtube.com/watch?v=mJNgC2M7EMg																																						
#WolframAlphaで																												
入力:																													
Sum[Fibonacci[n], {n, 0, Infinity}]																													
https://ja.wolframalpha.com/input/?i=Sum%5BFibonacci%5Bn%5D%2C+%7Bn%2C+0%2C+Infinity%7D%5D																													
結果:																													
比較判定によると，級数は発散します．																																																									
#SympyOnlineで																													
https://live.sympy.org/																													
入力1:																													
 summation(fibonacci(n), (n, 0, 3))																													
結果:4																													
入力2:																													
summation(fibonacci(n), (n, 0, oo))																													
結果:																													
Σ(以下省略)																																																									
#SympyPythonで																													
```																													
from sympy import *																													
var('n')																													
print(summation(fibonacci(n), (n, 0, 3)))																													
print(summation(fibonacci(n), (n, 0, oo)))																													
# 4																													
# Sum(fibonacci(n), (n, 0, oo))																													
```																													
																																																									
#(おまけ)WolframAlpha勉強用																													
###入力1:																													
Fibonacci[Range[0, n]]																													
https://ja.wolframalpha.com/input/?i=Fibonacci%5BRange%5B0%2C+n%5D%5D																													
結果:																													
次をお試しください：(以下省略)																													
###入力2:																													
Fibonacci[Range[0, 5]]																													
https://ja.wolframalpha.com/input/?i=Fibonacci%5BRange%5B0%2C+5%5D%5D																													
結果:																													
{0, 1, 1, 2, 3, 5}
Create Awesome Charts in Vue.js with Chart.js and vue-chartjs

This tutorial explains about how to create awesome charts that will help us to understand the data or information in meaning full ways. I will show you how to create beautiful charts in Vue.js 2+ app using Chart.js and vue-chartjs plugin.

click here to read more 
https://www.positronx.io/create-awesome-charts-in-vue-js-with-chart-js-and-vue-chartjs/
Vue.js + Express: Single & Multiple Files and Images Upload

In this tutorial, we are going to learn how to upload single & multiple files and images to the Node server from Vue.js application using Express.js API. Along with that, we will also learn how to send multipart form data using FormData() web API.
  

click here to read more
https://www.positronx.io/vue-js-express-single-multiple-files-and-images-upload/
Vue MEVN Stack Tutorial – Build Full Stack Vue.js CRUD App

This is a step by step MEVN stack tutorial, in this tutorial, we are going to learn how to create MEVN stack app. (MongoDB, Express.js, Vue.js, Node.js).
 
click here to read more
https://www.positronx.io/vue-mevn-stack-tutorial-build-full-stack-vue-js-crud-app/
VBAで結合セルに対応した最終行番号・最終列番号を取得するメソッド（プロシージャ）

# はじめに

エクセルVBAを使っているとよく最終行番号、最終列番号を取得する処理が出てくると思います。
うまく最終行番号を取得できない場合があり、原因が結合セルでした。
結合セルに対応した最終行番号・最終列番号を取得するメソッドをご紹介します。
（結合セルがない場合もそのまま使用できます）


# 最終行番号を取得するメソッド

```vb
'引数①のシートの引数②の列の最終入力行番号を返す
'
'@param Worksheet sh 対象のワークシート
'@param Long targetCol 対象行
'@return Long 最終行から上方向に見て最初に入力のあるセルの行番号
Function GetLastRowNum(ByVal sh As Worksheet, ByVal targetCol As Long) As Long

    Dim lastRow As Long
    lastRow = sh.Cells(Rows.Count, targetCol).End(xlUp).Row
    
    '結合セル対応
    If sh.Cells(lastRow, targetCol).MergeCells Then
        lastRow = lastRow + sh.Cells(lastRow, targetCol).MergeArea.Rows.Count - 1
    End If

    GetLastRowNum = lastRow
        
End Function
```

# コードの説明

```vb
lastRow = sh.Cells(Rows.Count, targetCol).End(xlUp).Row
```

エクセルの最終行からCtrl+↑を押下した時に移動するセルの行番号を返します。


```vb
If sh.Cells(lastRow, targetCol).MergeCells Then
    lastRow = lastRow + sh.Cells(lastRow, targetCol).MergeArea.Rows.Count - 1
End If
```

取得した最終行番号のセルが結合しているかチェックする。
結合している場合は、結合している行数-1を取得した最終行番号に加算する。


# 結合セル部分の説明

![01.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/157383/51f3abbb-3740-08ef-4ae6-8775be5a0318.jpeg)

A10～A12が結合されている場合に、メソッドの前半部分だけを実行すると、

```vb
Sub test()

    Dim sh As Worksheet
    Set sh = ThisWorkbook.Worksheets("Sheet1")

    Debug.Print GetLastRowNum(sh, 1)

End Sub

Function GetLastRowNum(ByVal sh As Worksheet, ByVal targetCol As Long) As Long

    Dim lastRow As Long
    lastRow = sh.Cells(Rows.Count, targetCol).End(xlUp).Row

    GetLastRowNum = lastRow 

End Function
```

結果は10になります。
結合セルに対して「row」プロパティで行番号を取得すると一番上の行番号が返されるからです。

```vb
If sh.Cells(lastRow, targetCol).MergeCells Then
    lastRow = lastRow + sh.Cells(lastRow, targetCol).MergeArea.Rows.Count - 1
End If
```

結合されている行数-1を加算しているのは、元から結合セル内のもっとも上の行番号がrowに格納されているからです。
上記例だと-1しないと、10+3で13が戻り値になってしまいます。

# 最終列番号を取得するメソッド

```vb
'引数①のシートの引数②の行の最終入力列番号を返す
'
'@param sh 対象のワークシート
'@param targetRol 対象列
'@return Long 最終列から左方向に見て最初に入力のあるセルの列番号
Function GetLastColumnNum(ByVal sh As Worksheet, ByVal targetRow As Long) As Long
    
    Dim lastColumn As Long
    lastColumn = sh.Cells(targetRow, Columns.Count).End(xlToLeft).Column
    
    '結合セル対応
    If sh.Cells(targetRow, lastColumn).MergeCells Then
        lastColumn = lastColumn + sh.Cells(targetRow, lastColumn).MergeArea.Columns.Count - 1
    End If
    
    GetLastColumnNum = lastColumn

End Function
```

行の場合と仕組みは同じです。

![02.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/157383/1ffa0aa7-21cd-b1a2-3652-bb1aea80fe46.jpeg)

E1～G1が結合されている1行目を対象に実施すると、7が返されます。


# まとめ

ユーザが手作業で操作するブックを集計する時などに結合セルがあってハマることがあると思います。
最終行列を取得する処理は、エクセルVBAを使っているとよく使うのでメソッドにしておいて、パッと出せると便利になると思います。

間違いやアドバイス等があればコメントや編集リクエストください。
UnityC#のListのforeach GCゴミ

# はじめに
河合さんの記事, 今はどうなっているのかな？という調査です.
[neue cc - C#のGCゴミとUnity(5.5)のコンパイラアップデートによるListのforeach問題解決について](http://neue.cc/2016/08/05_537.html)
有名なforeachのGCゴミについてです.

# テストコード

```csharp
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.Profiling;
using UnityEngine.UI;

public class ForEach : MonoBehaviour
{
    [SerializeField]
    private Button button_ = null;

    private int[] array_ = new int[] { 1, 2, 3, 4, 5 };
    private List<int> list_ = new List<int> { 1, 2, 3, 4, 5 };

    private void Start()
    {
        button_.onClick.AddListener(onClick);
    }

    private void onClick()
    {
        Profiler.BeginSample("GCAllocCheck:Array");
        foreach(var item in array_) { }
        Profiler.EndSample();

        Profiler.BeginSample("GCAllocCheck:List");
        foreach(var item in list_) { }
        Profiler.EndSample();
    }
}
```

# 結果
バージョンごとに調査（したい）.

## 5.6.4f1
起動後初めてボタンを押下した場合だけ, ゴミが出る. 原因は未調査.

- １回目
![GCAlloc5.6.4f1_00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/27065/4c87bdec-76fe-63b2-e216-cd210b36bb97.png)

- ２回目
![GCAlloc5.6.4f1_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/27065/ada48f5d-21b0-8b03-d91c-74cd8d76841b.png)

## 2019.2.9f1
起動後初めてボタンを押下した場合だけ, ゴミが出る. 原因は未調査.

- １回目
![GCAlloc2019.2.9f1_00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/27065/e6f77846-0a84-8f23-9586-592bc6c1f368.png)

- ２回目
![GCAlloc2019.2.9f1_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/27065/e5defff8-240d-9c60-f8ba-53a1c3a2051d.png)

# まとめ
エディタ上で調査しているため, ビルドすると異なる可能性がある. もちろんターゲットにより異なる可能性がある.
原因はGetEnumeratorに関連しているため, ゴミが出る場合は, LINQを使うと目も当てられない結果になるだろう（調査していないため推測）.

## １回目のゴミ推測
これ, boxingのための領域か何かかな. 詳しく調査していないため, 2回目以降必ずゴミが出ないかは不明.
推測が正解なら気にしなくてもよさそう.
コードの読みやすさ次第で使用できそうだが, クリティカルな箇所では for にしておく方がよさそう.
concurrent.futures

#processにする場合は、threadの部分をprocessに書き換えてください。

```py
import concurrent.futures
import logging
import time

logging.basicConfig(level=logging.DEBUG, format='%(threadName)s: %(message)s')

def worker(x, y):
    logging.debug('start')
    r = x * y
    logging.debug(r)
    logging.debug('end')
    return r

def main():
    with concurrent.futures.ThreadPoolExecutor(max_workers=5) as executor:
        f1 = executor.submit(worker, 2, 5)
        f2 = executor.submit(worker, 2, 5)
        logging.debug(f1.result())
        logging.debug(f2.result())
        
        #下記でも同じ
        #args = [[2, 2], [5, 5]]
        #r = executor.map(worker, *args)
        #logging.debug(r)
        #logging.debug([i for i in r])

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

```txt
ThreadPoolExecutor-0_0: start
ThreadPoolExecutor-0_0: 10
ThreadPoolExecutor-0_0: end
ThreadPoolExecutor-0_0: start
ThreadPoolExecutor-0_0: 10
ThreadPoolExecutor-0_0: end
MainThread: 10
MainThread: 10
```
個人で入れた自己署名証明書が入っているかをコマンドラインで確認

* [certutil | Microsoft Docs](https://docs.microsoft.com/ja-jp/windows-server/administration/windows-commands/certutil)
* `certutil`コマンドはvistaから。XPには標準では入っていない。

```go:コマンドプロンプト
certutil -user -store my

certutil -user -store my | find "サブジェクト:"
```


```go:powershell
Get-ChildItem Cert:\CurrentUser\My\
```
D言語でfor文を書いてみる

# D言語
Cの次の言語はC+, C++, Java(C++-)とかじゃなくてD言語だったんだよ！
ΩΩΩ<な、なんだってー!?

## 公式サイト
https://dlang.org/

## D言語 compilerをインストールする
```
$ brew install dmd
```

## for文を書いてみる
```skt.d
import std.stdio;

void main()
{
  write("uw");
  for(int i=0;i<10;i++){
    write("a");
  }
  write("\n");
}
```

## compileして実行する
```bash
$ dmd skt.d 
$ ls
skt	skt.d	skt.o
$ ./skt 
uwaaaaaaaaaa

```
----

よかったよかった
初心者によるプログラミング学習ログ 299日目

#100日チャレンジの299日目
twitterの100日チャレンジ#タグ、#100DaysOfCode実施中です。
すでに100日超えましたが、継続。
100日チャレンジは、ぱぺまぺの中ではプログラミングに限らず継続学習のために使っています。
299日目は、
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">おはようございます<br>299日目　2h<br>・xdデザインカンプからのサイト模写<br>・ハンバーガーメニュー作成<a href="https://twitter.com/hashtag/%E6%97%A9%E8%B5%B7%E3%81%8D%E3%83%81%E3%83%A3%E3%83%AC%E3%83%B3%E3%82%B8?src=hash&amp;ref_src=twsrc%5Etfw">#早起きチャレンジ</a><a href="https://twitter.com/hashtag/%E9%A7%86%E3%81%91%E5%87%BA%E3%81%97%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%8B%E3%82%A2%E3%81%A8%E7%B9%8B%E3%81%8C%E3%82%8A%E3%81%9F%E3%81%84?src=hash&amp;ref_src=twsrc%5Etfw">#駆け出しエンジニアと繋がりたい</a><a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a></p>&mdash; ぱぺまぺ@webエンジニアを目指したい社畜 (@yudapinokio) <a href="https://twitter.com/yudapinokio/status/1253776862121091072?ref_src=twsrc%5Etfw">April 24, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>