OmniAICreator/Qiita-1.07M huggingface dataset:
【備忘録】Rspec・ブラウザ検証に使うフィーチャースペック

## はじめに
はじめまして。
現在、プログラミングスクールで「結合テスト(フィーチャースペックというようなので、以降そのように呼びます)」について学んでいます。

ブラウザ検証を行うにあたって続々と**matcher**や**構文**が現れて混乱してきたので、
ここいらで一度、まとめたいと思います。

後から調べやすいように、以下のまとめ方にします。
- `どんなときに`使う構文なのか
- `記述の一例`
- `構文の意味`

見づらいかもしれませんが、どうぞよろしくお願いします。

## 更新履歴
| 日付 | 更新内容 |
|:-:|:-:|
| 3/23(木)  | ページのレイアウト、概要執筆 |
| 3/24(金)  | fill_inの’フォームの要素'について追記 |
|   |   |
|   |   |
|   |   |

## ページの移動や画面のクリックなど
:::note info 
**特定のページへ移動する**
:::

記述の一例 : `visit + 移動したいpath`
構文の意味 : 移動先は、`rails routes`で調べて、Prefix記法で指定する。
こんなとき :   **トップページに遷移したか確認する**
```ruby
rails routes # 移動したい先のパスを調べる
visit root_path
```
<br>


:::note info
**ボタンをクリックする**
:::

記述の一例 : `find('ボタンの要素').click`
構文の意味 : 'ボタンの要素'は、ブラウザの検証機能で特定する。
こんなとき :   **送信ボタンをクリックする**

```sample.html
<input type="submit" name="commit" value="Save">
```
sample.htmlが▲だとしたら、送信ボタンは`commitという要素`だとわかるので、

```ruby
find('input[name="commit"]').click
```
<br>
  
:::note info
**フォーム(テキストボックス)に文字を入力する***
:::

記述の一例 : `fill_in 'フォームの要素', with:　'入れたいテキスト'`
構文の意味 : 'フォームの要素'は、ブラウザの検証機能で特定する。
こんなとき :   **ユーザー登録フォームの氏名欄に名前を入力する**

ここで、fill_inの構文に用いる、'フォームの要素'について、補足します。

HTMLの<label>タグは、'入力欄'などのテキストを1つの入力欄と紐づける役割があります。<label>タグをつけることで、
- 入力欄が何を表しているかわかりやすくなったり
- アイコンをかざすだけで、入力欄がアクティブになったり

便利なタグなのです。

ただし、テキストを<label>タグで囲んだだけの構文では、`テキストをフォームの要素に指定することはできません。`

```ruby
fill_in 'Content', with: '今日はいい天気'
# 「そんなフィールドは見つからないよerror」が出ます
# Capybara::ElementNotFound: Unable to find field "Content" that is not disabled）
```

これは、Capybaraでラベル名で選択できるようにするためにはlabelタグのfor属性を正しく設定（inputタグのid属性を指定）する必要があるからです。
for構文を使うと、`<label for="ここ">`と`<input id="ここ">`を合わせると、お互いが別の場所にあっても、紐付くようになります。

```sample2.html
<label for="blog_contet">Content</label>
<input type="text" name="blog[content]" id="blog_content">
```

▲ これなら、fill_inの'フォームの要素'は、<label>で囲まれた`Content`とすることができます。

```ruby
fill_in 'Content', with: '今日はいい天気'
```


## おわりに
まだまだ途中なので、日々追記していこうと思います。
もし記載や認識に誤りがあれば、ご指摘いただけますと助かります。

よろしくお願いします。

#### Wordpressの練習もしていますので、のぞいてみてください
https://zero-traveler.com/
Vue「親コンポーネントでリストレンダリングして子コンポーネントのプロパティに値を渡せ」ワイ「？？？」

# ナビバーのコンポーネントを作っていたら。。。
ワイ「よし、ナビバーのコンポーネントできたで。それぞれのリンクもコンポーネントに分割したしアトミックデザイン準拠やな」
Vue「で？」

ワイ「えっと・・・」

```javascript:親コンポーネント
<template lang="pug">
ul
  NavLink
  NavLink
  NavLink
  NavLink
</template>
```
![スクリーンショット 2022-03-25 0.14.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1135021/39b188d3-763c-986f-45b2-a186b067d713.png)

ワイ「まあそうなるわな」
Vue「プロパティ使え」

```javascript:子コンポーネント
<template lang="pug">
li <a class="active" href="#"> {{ linkName }} </a>
</template>

<script>
export default {
  props: {
    linkName: String,
  }
}
</script>
```

ワイ「できました」
Vue「で？」

```javascript:親コンポーネント
<template lang="pug">
ul
  NavLink(linkName='Home')
  NavLink(linkName='About')
  NavLink(linkName='Member')
  NavLink(linkName='Services')
</template>
```
![スクリーンショット 2022-03-25 0.10.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1135021/d30dc9e3-8045-cdcb-0f77-d8cdfbc47436.png)

ワイ「できました！」
Vue「はぁ（クソデカため息）」

ワイ「なんスか。まだなんか文句あるんスか。見た目は問題ないじゃないスか」
Vue「リストレンダリング」

ワイ「！？」

```javascript:親コンポーネント
<template lang="pug">
ul
  NavLink(v-for="link in links" :key="link.name" v-bind:linkName='link.name')
</template>

<script>
export default {
  data() {
    return {
      links: [
        { name: 'Home' },
        { name: 'About' },
        { name: 'Member' },
        { name: 'Services' }
      ]
    }
  }
}
</script>
```

![スクリーンショット 2022-03-25 0.10.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1135021/d30dc9e3-8045-cdcb-0f77-d8cdfbc47436.png)

ワイ「こうっスね」
Vue「まあええやろ。項目がもっと増えたらDBにデータ入れて引っ張ってこなキツイやろけど」

ワイ「シャス！　その時はまたオナシャス！」

おわり
AWS IP制限をかけているEC2にCloudFrontからのHTTPSを許可する

# AWS IP制限をかけているEC2にCloudFrontからのHTTPSを許可する
久しぶりの投稿です。3年間構造解析のエンジニアをしてきましたが、4月からAWS関連の部に行くこととなり、必死にAWSを勉強中です。どこかで３年間やってきたことの総括をしたいなーと思ってます。
間違ったことを言ってしまっているときは指摘していただけると非常に助かります。

勉強には社内のAWS環境を使用させていただいていて、その中で詰まった点があったのでメモしておきます。



## EC2に関する社内ルール
社内環境用AWSにはいくつか使用に関するルールがあります。今回関係があるルールは以下のようなものです。
* EC2には0.0.0.0/0からのアクセスできないようにすること

です。そのため、EC2に割り当てるセキュリティグループのインバウンドルールで社内のプロキシサーバーのIpを設定して、HTTPSやSSHをできるようにしていました。


## 問題の発生(CloudFront)
勉強がてら、上記のEC2をALBの配下に置いたりして遊んでいました。
そこで以前AWSのドキュメントで見たことがあったCloudFrontも使ってみようと思いました。
しかし、ここで問題が発生。
セキュリティグループには社内からのアクセスを想定してIPアドレスの制限を設定していましたが、CloudFrontは外部からのアクセスとなるため、EC2とのHTTPSが出来なかったのです。
(こんなことに気づくのすらかなり時間がかかるIT系初心者なのです、、優しくして)


## 問題の解決
非常に悩みました。EC2に0.0.0.0/0からのアクセスを許可すればCloudFrontとHTTPS通信できることは検証できていました。しかし、0.0.0.0/0からのアクセスを許可したままだと社内ルールに抵触しますし、ハッカーさんたちの攻撃の的になってしまいます。

苦肉の策として思いついたのが、CloudFrontのIPアドレスをインバウンドルールに追加すればいいのでは？ということです。
ネットで検索したところ見つけました!以下のjsonファイルの中にCloudFrontのIpアドレスが入っていました。
[CloudFront エッジサーバーの場所とIPアドレス範囲](https://docs.aws.amazon.com/ja_jp/AmazonCloudFront/latest/DeveloperGuide/LocationsOfEdgeServers.html)

この中で"service": "CLOUDFRONT"の検索で引っかかるIPアドレスがCloudFrontのIPアドレスだそうです。
よし!これで次に進める！と思ったが、、、そのIPアドレスの数なんと155個（2022年3月25日現在）
そうですよね、世界中にエッジロケーションあるんですよね、、

もっとスマートにやれる方法はあるんでしょうが、はい、やりました。まずセキュリティグループのインバウンドルールに50個のCloudFrontのIPを追加しました。（セキュリティグループには設定できるルールの上限がある？）
そしてCloudFrontの動作検証をしたらできました。うまくキャッシュサーバーとして動いていることを確認できました。上記の50個でだめだったらもう50個を新しく定義してみる予定でしたが、幸運でした。


## 問題点
上記の解決方法は問題点が多いです。
* 155個も手打ちでIPアドレスを登録するのは馬鹿らしい
* 新しいエッジロケーションが追加されたとき、そのエッジからはアクセスが出来なくなってしまう。
* 定期的にIPリストを更新することが必要。しかし、更新されるまでの間新しいエッジからはアクセスができない

これらの問題点はAWSエンジニアの方たちはどのように解決しているんですかね、今のところノ―アイディアです。新しい部署で聞きたいことが山ほどあり、非常に楽しみです。

## 今後
なによりやることはCloudFrontを社内のIPからのアクセスに限定することですね。
今は野放しになってしまっているので、WAFとかを使うんでしょうか。
とにかく一つ一つ勉強していって、ここにメモを残していきます。
誰かの役にも立てれば光栄です。

それでは、また今度～～
PowerShellでアプリ情報を取得する

端末にインストールされているアプリ情報を取得するスクリプトです。
レジストリから「プログラムの追加と削除」に相当するものを引っ張って来ています。

## 目次
目次|
:--
[実際のコード](#実際のコード)
[コードの解説](#コードの解説)


## 実際のコード[↑](#目次)
~~~PowerShell:get_app.ps1
Get-ChildItem -Path(
'HKLM:SOFTWARE\Microsoft\Windows\CurrentVersion\Uninstall',
'HKCU:SOFTWARE\Microsoft\Windows\CurrentVersion\Uninstall',
'HKLM:SOFTWARE\WOW6432Node\Microsoft\Windows\CurrentVersion\Uninstal') |
% { Get-ItemProperty $_.PsPath | Select-Object DisplayName, DisplayVersion, Publisher } |
Export-Csv -NoTypeInformation -Encoding Default get_app.csv
~~~


#### コードの解説[↑](#目次)
コード|意味|
:--|:--|
Get-ChildItem -Path ( ) |（）内のアイテムを取得します。|
'HK**LM**:SOFTWARE\Microsoft<br>\Windows\CurrentVersion\Uninstall',|「プログラムの追加と削除」のアプリ一覧（コンピューター配下）|
'HK**CU**:SOFTWARE\Microsoft<br>\Windows\CurrentVersion\Uninstall',|「プログラムの追加と削除」のアプリ一覧（カレントユーザー配下）|
'HKLM:SOFTWARE\WOW6432Node\Microsoft<br>\Windows\CurrentVersion\Uninstal'|「プログラムの追加と削除」のアプリ一覧（コンピューター配下かつ32bit版）|
% { } | { } の中を要素の数だけ繰り返し処理します|
Get-ItemProperty $_.PsPath \| |取得したアイテム「レジストリパス」を元に、さらに詳細な情報を取得し、パイプの右側に渡します。
Select-Object DisplayName, DisplayVersion, Publisher | 渡された詳細な情報から、アプリ名・バージョン・製作元のみ抽出します。|
Export-Csv -NoTypeInformation -Encoding Default get_app.csv|抽出した結果を「get_app.csv」にデフォルトのエンコード（大体utf-8）で出力します。|


 ↓ のページでこの情報を元に端末毎に差分を出す方法も記載しました。
* [PowerShellでアプリケーションの差分を出す](https://qiita.com/sakekasunuts/items/4f44729df3075a71349e)


<br>
参考にしたサイト

* [PowerShell/インストール済アプリケーション一覧を取得する](https://win.just4fun.biz/?PowerShell/%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E6%B8%88%E3%82%A2%E3%83%97%E3%83%AA%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E4%B8%80%E8%A6%A7%E3%82%92%E5%8F%96%E5%BE%97%E3%81%99%E3%82%8B)
* [64bit環境で32bitアプリケーションをインストールした場合](https://www.projectgroup.info/tips/Windows/cmd_0018.html#:~:text=64bit%E7%92%B0%E5%A2%83%E3%81%A732bit%E3%82%A2%E3%83%97%E3%83%AA%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%82%92%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E3%81%97%E3%81%9F%E5%A0%B4%E5%90%88%E3%81%AF%E3%81%93%E3%81%AE%E4%B8%AD%E3%81%AB%E3%81%82%E3%82%8A%E3%81%BE%E3%81%99%E3%80%82)
C# アクセス修飾子について

今回はアクセス修飾子についてです。
このアクセス修飾子、C#にはこんなに種類があるのかとちょっとびっくりしています。
あまり意識して使ってないのもありますが。

ではいきます！

# アクセス修飾子とは
アクセス修飾子はクラスやクラス内のメンバ(クラス内で定義されているフィールド変数のこと)に対してアクセスの制限をかけるものです。
指定しない場合はデフォルトでprivateで定義され、外部からのアクセスはできないようになっています。
privateについては後ほどご紹介しますね。

[アクセス修飾子MS公式ドキュメント](https://docs.microsoft.com/ja-jp/dotnet/csharp/language-reference/keywords/access-modifiers)
このリンクを見てみるとこんなことが書いてあります。

「メンバーまたは型の宣言されたアクセシビリティを指定するときに使用されるキーワードです。」

訳わかんねぇよって感じですよね。

多分、アクセス修飾子のキーワードを見ていけばなんとなくでも理解できそうな予感…
というわけで、C#で使われるアクセス修飾子についてキーワードをひとつひとつ見ていきましょう。
掘るぞ掘るぞ〜

## [public](https://docs.microsoft.com/ja-jp/dotnet/csharp/language-reference/keywords/public)
アクセス無制限です。
初心者のうちはとりあえずこれを使って定義しましょう。
そして、完成した後にコードを見直して、確実にこれはprivateでいいなと思ったらprivateで定義する。
変にかっこいいプログラムを組もうとしてエラーが起きた方がダサいし、エラー慣れした初心者でなければ完成しないです笑
なのでとりあえずpublicで定義。(先述のように、アクセス修飾子を使わずに定義するとprivateになるのでこちらも注意)

## [protected](https://docs.microsoft.com/ja-jp/dotnet/csharp/language-reference/keywords/protected)
外部からのアクセスは拒否、でも**protectedで定義されたクラスの派生クラス**からアクセスするのはOK
この太字の部分、ややこしいですよね。
僕の解釈では、オブジェクト指向の概念の中にある「継承」が鍵となるのかなと思っています。
つまり、**protectedで継承したクラスを継承したクラスからのアクセスは許可されますよ**、継承されていないクラスはだめですよってことだと思っています

このprotectedですが、「private protected」や「protected internal」というアクセス修飾子もあります。
ややこしいので今は避けていずれご紹介します。

## [internal](https://docs.microsoft.com/ja-jp/dotnet/csharp/language-reference/keywords/internal)
見出しのリンクに書いてある内容を引用します。
> 同じアセンブリ内のファイル内でのみアクセスできます。

なんじゃそりゃ
もう少し調べてみると、「コンパイル単位でのみアクセスが許可される」とのこと。
コンパイルとは、中間言語と呼ばれるものを使ってC#からコンピュータ語(2進数のバイナリ言語)に変換し、実行ファイルを作成するという作業のことです。
自分が書いたソースコード(C#だろうがJavaだろうがなんでも)をコンパイルする時にinternalというアクセス修飾子が効果を発揮すると…

コンパイルに関連する内容は別の記事にてご紹介します。
ちなみにinternalはC#特有のアクセス修飾子みたいです。(internalが使える言語があればコメントにて！笑)


## [private](https://docs.microsoft.com/ja-jp/dotnet/csharp/language-reference/keywords/private)
外部であればどんな内容だろうがどこからでもアクセスを拒否しますよということ。
これはクラス内もしくは構造体の中でしか扱えないようにするためのものなんですね。
めっちゃセキュリティーが高いみたいな感じ。
他のクラスからはprivateの内容は見えていませんよ、透明人間ですよ、だから有るけど無い状態ですよというような

```C#:
public class Me //例えば自分をpublicのクラスとして定義します。
{
    private int myWalette; //要はお金(数値)なのでint型
}
```
書き方が合ってるかどうかは知りませんが…
Meクラスは自分 = 人に見られる、myWalletフィールド = 落としたくもないし人によっては見られたくない財布
自分(というクラス)の持ち物(お財布という変数)なので、落とすこともいくらか抜き取られることも盗まれる心配もないです。
でも難しいので気をつけましょう。
非現実的だけど、結構上手な例え方だと思ってまーす笑


# 最後に
今回は4つのアクセス修飾子について解説してみました。
毎度言ってますが、ちょっと間違ってるかもしれないと思いながら書いているので、間違っていたらコメントで優しく教えてください。
本当自信ないよね〜
自信がないからこそ間違いを指摘していただくという**受動的アウトプット**も目的です。
STM32G031とI2Cを使い0x40(8ビット表記0x80)にソフトウェアシリアル入力を出力する。(Arduino)




目的
I2Cのテスト
I2C->USART9600bps->USBのテスト


![o_con285.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/710f4a3f-162e-e52a-95a9-5fbc20a7a794.jpeg)



![o_con286.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/fea8450a-c871-3ad9-fe75-b740d785a976.jpeg)




https://qiita.com/caa45040/items/5032e6905c9425f41495



STM32G031とVSCode+STM32CubeでI2Cスレーブの受信文字をシリアル出力(受信)(STM32-I2C-USART)(CH340N)


主にLED表示装置等にデータを送信する
マスターモードで送信
シリアルからは、受信


```c++



//ser_out_i2c_test_031_1

#include <Arduino.h>
#include <Wire.h>

#define ADDR1  0x40

//STM32G031J6M6 i2cピンの定義
#define sdaPin PA12    // ArduinoA4
#define sclPin PA11    // ArduinoA5

#define RX1      PA0   // 1pin

//#define in7 1 //uno
#define in7      PB7  // 1pin
//#define in7      PA9  // 1pin
//#define RX1      PA10 // 1pin
//#define TX1      PA0  // 1pin

#define DW   digitalWrite

//#define UART_DELAY 832 //  1200bps ok 031
#define UART_DELAY 102   //  9600bps ok 031


int pc_getc()
{

  int a,b,c,d,e,f,g,h;
  int bs;

  //待ちループ
  while( digitalRead(RX1) == 1 ) {}

    delayMicroseconds(156-3);
    a=(digitalRead(RX1));

    delayMicroseconds(104-3);
    b=(digitalRead(RX1));

    delayMicroseconds(104-4);
    c=(digitalRead(RX1));

    delayMicroseconds(104-4);
    d=(digitalRead(RX1));

    delayMicroseconds(104-3);
    e=(digitalRead(RX1));

    delayMicroseconds(104-3);
    f=(digitalRead(RX1));

    delayMicroseconds(104-4);
    g=(digitalRead(RX1));

    delayMicroseconds(104-4);

    h=(digitalRead(RX1));
    delayMicroseconds(156-3);

    bs=h*128+g*64+f*32+e*16+d*8+c*4+b*2+a;

    return(bs);
}//pc_getc


//I2Cへの一文字出力
int pc_putc(char ch) {

  //I2Cに送信
  Wire.beginTransmission(ADDR1);
  Wire.write( ch );
  Wire.endTransmission();

  delay(1);//連続送信防止の為に1ms待つ

  //戻り値
  return (0);

}//pc_putc

//文字列の表示
int pc_printf(char *str1) {

    //文字の中身がゼロか
    while(*str1){

        //一文字出力
        pc_putc(*str1 ++);

    } //while

    //戻り値
    return(0);
}//pc_printf



//初期化
void setup()
{
  delay(3000);

  //ポートをhiにする 初期化
  pinMode(RX1,INPUT_PULLUP);

  //i2cの初期化
  Wire.begin(sdaPin, sclPin); //STM32G031J6M6

  //LEDの初期化
  pinMode(in7, OUTPUT);
  DW(in7, HIGH);

  pc_printf("STRT\r\n"); //debug

} //setup

//メインループ
void loop()
{

  char ch = pc_getc();

  DW(in7, HIGH );

  char str2[2]={ ch ,0};
  pc_printf("-----ch=[");
  pc_printf(  str2  );
  pc_printf("\r\n");

  DW(in7, LOW );

  //1秒の待ち
  //delay(1000);

} //loop



```
docker-compose.ymlでvolumes_fromが使えない時

# 結論
docer compose　ver3ではvolumes_fromが廃止されているのでトップレベルでvolumesを定義すると同じことが実現できます。

# volumes_fromは何をやっているか？
docker-compose.ymlには複数のコンテナを定義する場合があります。この別のコンテナのボリュームを持ってきたい、マウントしたいという場面でvolumes_fromを使用すると実現できます。

# 前提・状況
dockerのwp-cliを使用したい場面があり、検索していたらvolumes_fromを使用しているサイトが出てきました。

# ソース
参考にしたものdocker-compose.yml一部抜粋

```
  wordpress:
    depends_on:
      - mysql
    image: wordpress:latest
    volumes:
      - wordpress_data:/var/www/html

  cli:
    image: wordpress:cli
    container_name: cli
    volumes_from:
      - wordpress
 　
　　　　volumes:
  　　　　wordpress_data:
```

これだとエディタ（PHPstorm）で編集している時点で赤く警告を出してくれていました。
以下のように編集して自分の環境では使うことができました。

```
  wordpress:
    depends_on:
      - mysql
    image: wordpress:latest
    volumes:
      - wordpress_data:/var/www/html

  cli:
    image: wordpress:cli
    volumes:　wordpress_data
 　
　　　　volumes:
  　　　　wordpress_data:
```

### ※【参考】遭遇したエラー
最初以下のように設定したらエラーがでました。

```
  wordpress:
    depends_on:
      - mysql
    image: wordpress:latest
    volumes:
      - wordpress_data:/var/www/html

  cli:
    image: wordpress:cli
    container_name: cli
    volumes:　wordpress
 　
　　　　volumes:
  　　　　wordpress_data:
```

volumesにコンテナ名を指定しているので当然ですが（汗

```
Error response from daemon: invalid mount config for type "volume": invalid mount path: 'wordpressimage' mount path must be absolute
```

# 参考サイト
とても助かりました。感謝です。

https://docs.docker.com/compose/compose-file/compose-file-v2/#volumes_from


https://qiita.com/yumetasuke/items/9905487564c5c96c8d4a

docker compose公式バージョン３では廃止されています。

https://docs.docker.com/compose/compose-file/compose-file-v3/#volumes
古の「報告書の書き方」資料に引用されていた10年前の記事が良い

https://next49.hatenadiary.jp/entry/20101019/p1

上の記事が、社内の古の資料庫でお薦めされたまま眠っていたので読み直したもの。
簡潔に「報告書の書き方」が書かれているかつ10年経った今も変わらず役に立つので紹介したく書いておく。

## 記事要点

- **報告書作成は技術**
    - **報告書において、独創的であるべきなのは視点と主張のみである**
- 複数人での作業では文書作成が必須
- 知らなければ使いこなせない
- 簡潔に短くすべし

> 第二次世界大戦中のイギリスの首相ウィンストン・チャーチルが言った言葉、

> 「われわれの職務を遂行するには大量の書類を読まねばならぬ。その書類のほとんどすべてが長すぎる。時間が無駄だし、要点をみつけるのに手間がかかる。同僚諸兄とその部下の方々に、報告書をもっと短くするようにご配意ねがいたい」

- 出来る限り平易な言葉で書くべし

> ユリウス・カエサル（ジュリアス・シーザー）曰く、

> 「文章は、用いる言葉の選択で決まる。日常使われない言葉や仲間うちでしか通用しない表現は、船が暗礁を避けるのと同じで避けなければならない」

- 体裁を守るべし
- 型稽古であることを理解すべし

## 参考

> 自習の場合は、以下の本がオススメ。

- 木下 是雄：理科系の作文技術, 中公新書.
    - https://www.amazon.co.jp/dp/4121006240
- 小野田 博一：論理的に書く方法, PHP出版
    - https://www.amazon.co.jp//dp/4534026439/
- 小野田 博一：論理的に考える方法―本質への筋道が読める, 光文社.
    - https://www.amazon.co.jp/dp/4534028075/
- 酒井 聡樹：これから論文を書く若者のために 大改訂増補版, 共立出版.
    - https://www.amazon.co.jp/dp/4320005953/
- 伊勢田 哲治：哲学思考トレーニング, 筑摩書房.
    - https://www.amazon.co.jp/dp/4480062459/


ところで [このブログ2022年の今もアクティブなよう](https://next49.hatenadiary.jp/) でそれもすごい。
いろいろ感想を書きたくなってしまうが、記事の教えに従い簡潔にしておく。以上です～
【チートシート】 SQLのコマンド一覧（関数）

## 指定したカラムの値の個数を取得（値がNULLのものを除く）
```sql:db-sample
COUNT(カラム名)
```

## 指定したカラムの値の個数を取得（値がNULLのものを含む）
```sql:db-sample
COUNT(*)
```

## 指定したカラムの値の合計値を取得
```sql:db-sample
SUM(カラム名)
```

## 指定したカラムの値の平均値を取得
```sql:db-sample
AVG(カラム名)
```

## 指定したカラムの最大値を取得
```sql:db-sample
MAX(カラム名)
```

## 指定したカラムの最小値を取得
```sql:db-sample
MIN(カラム名)
```
GameCIで簡単にTest Runnerの自動化をしてみよう！


# はじめに
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605029/bb092228-fd9f-edf7-51d4-dc47cf19dc26.png)
最近UnityのTest Runnerに興味があり、いろいろと探していたら 　[GameCI](https://game.ci/)というものに出会いました。
 GameCI のGithub Actionsを使うことによって簡単な手順でテストの自動化することができるようです。
実際にやってみると、本当に簡単に設定が出来て感動したので共有させてください。

UnityのPersonal licenseで説明している方は多いので、
今回はProfessional licenseの方法を説明させていただきます。


## 登録手順
1. Unityのサブスクリプションページでシリアルキーをコピーします。 
![スクリーンショット 2022-03-24 23.59.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605029/1a67b4ff-6629-162f-afe5-7b8477ca32fc.png)

2.Github >[自分のリポジトリ]> Settings > Secrets まで遷移します。
New repository secret ボタンを押下し以下の情報を入力してください。
 - UNITY_SERIAL - (Unityのシリアルキー XX-XXXX-XXXX-XXXX-XXXX-XXXX)
 - UNITY_EMAIL - (Unityに登録したメールアドレス)
 - UNITY_PASSWORD - (Unityに設定したパスワード)

![スクリーンショット 2022-03-25 0.24.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605029/a5d7b398-0642-7403-c4ab-78387302bf5d.png)





## テスト自動化手順

Test Runnerで PlayModeとEditModeのテストをする
ワークフローファイルを作成します。

sample_test.yml
```
name: Test Runner

on: [push]

jobs:
  test:
    name: ${{ matrix.testMode }} on ${{ matrix.unityVersion }}
    runs-on: ubuntu-latest
    strategy:
      fail-fast: false
      matrix:
        projectPath:
          - .
        unityVersion:
        # Unityプロジェクトの現バージョンを指定してください。
          - 2020.3.30f1
        testMode:
          - playmode
          - editmode
    steps:
      # Checkout
      - name: Checkout
        uses: actions/checkout@v2
        with:
          lfs: true

      # Cache
      - name: Cache
        uses: actions/cache@v2
        with:
          path: ${{ matrix.projectPath }}/Library
          key: Library-${{ matrix.projectPath }}
          restore-keys: |
            Library-

      # Tests
      - name: Tests
        uses: game-ci/unity-test-runner@v2
        id: tests
        env:
          UNITY_EMAIL: ${{ secrets.UNITY_EMAIL }}
          UNITY_PASSWORD: ${{ secrets.UNITY_PASSWORD }}
          UNITY_SERIAL: ${{ secrets.UNITY_SERIAL }}
        with:
          projectPath: ${{ matrix.projectPath }}
          unityVersion: ${{ matrix.unityVersion }}
          testMode: ${{ matrix.testMode }}
          githubToken: ${{ secrets.GITHUB_TOKEN }}
```

.github/workflowsに以下のymlを格納しPushします。



2.Github >[自分のリポジトリ]> Actions > に遷移します。

先程作成したワークフローが走っていることが確認できます。
![スクリーンショット 2022-03-25 2.15.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605029/eb8afbf6-0b69-8392-e8e9-e037a1f17f9a.png)

![スクリーンショット 2022-03-25 2.26.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605029/3b7df14c-ea88-87fa-c526-b817283209f1.png)



今回はpushをトリガーにしてテストが実行するようにしましたが、
設定を変えることでタイミングを変更できます。
sample_test.yml
```
 # pull_request プルリク時
 # workflow_dispatch 手動
on: [push]
```

以上です。
とっても簡単でしたよね！


参考させて頂いたURL
https://docs.github.com/ja/actions/using-workflows/events-that-trigger-workflows
https://game.ci/docs
Arduinoで相席食堂のボタンを作る（試作品）

衝動的に相席食堂の「ちょっと待てい」ボタンが作りたくなったので作ってみることにしました。


[相席食堂(wiki)](https://ja.wikipedia.org/wiki/%E7%9B%B8%E5%B8%AD%E9%A3%9F%E5%A0%82)
↑相席食堂を知らない方はこちらで確認してください。

<img width="500" alt="相席食堂" src="https://www.asahi.co.jp/aisekishokudou/img/img_main.png">

このお二人の間に置かれている赤いボタンを作りたいと思ったのですが、時間と技術力の関係で最低限の機能を備えたものを作ろうと思います。

# 目標
1. 基本的には青く光る
2. 押すと「ちょっと待てい」という音声を流して赤く光る
3. 1.2の操作と連動させてパソコン上で流している動画を再生させたり、停止させたりする


# 使用した道具
- Arduino Pro Micro互換機
- DFPlayer Mini
- micro SD
- つなぐ線など


## Arduino Pro Micro互換機
![S__161767427.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2172062/44fde26f-daa1-cbb5-8858-70af98102dd9.jpeg)

マイコンの一種で、パソコンにつないでコードを書くことで、動作を変更したりすることができます。
C++に似たArduino言語というのが使われています。
はんだ付けが下手すぎるのは無視してください。

## DFPlayer Mini
![S__161767430.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2172062/4b869ef8-240d-960c-923b-6834589a103b.jpeg)
mp3ファイルを再生するのに使います。銀色の場所にmicro SDを入れます。今回はこれをArduinoで制御しますが、これ単体でもmp3プレイヤーの役割ができる優れものです。

コードを書きこんで、回路を作っていきます。


## つないだ様子
![S__161767433.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2172062/16c1ecb8-18de-e326-d300-a400a88db4ff.jpeg)

見えづらいですが、右上にあるタクトスイッチを押すと赤のLEDが光り、スピーカーから音が鳴るという設計になっています。
またそれと同時にパソコン側にスペースキーの入力を行います。
Youtubeでは、スペースキーを押すと動画が一時停止されるので、これで相席食堂の感じを出しています。

# 動作確認
<iframe width="560" height="315" src="https://www.youtube.com/embed/eXn2SftTlL8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

(LEDの出力が弱く、電気をつけていると周りが明るくてLEDの点灯がわかりにくいので暗くしています)

動いてはいますが、Arduinoの電源LED自体が赤いので、押したときの色の変化に気付きにくいですね...

# 今後の展望
相席食堂と同じようにボタンを押している感が欲しいので100円ショップに売っているプッシュライトというものを改造して今回作ったものを埋め込みたいと考えています。
![S__161767431.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2172062/7eadf19f-b647-16c6-b4ed-43a120ad35b3.jpeg)


# 参考にしたサイト
【Arduino】DFPlayer Miniをつかってmp3の音ファイルを再生する
https://www.wwwmaplesyrup-cs6.work/entry/2019/02/10/152415

ArduinoでボタンでLEDのオンオフを切り替える
http://drshiroshirokm.seesaa.net/article/442155304.html



Qiitaに記事を書いてみたくてとりあえず書いてみましたが、なかなか難しいですね。
初心者の人が見るにしては必要な情報が欠けすぎているし、詳しい方が見るには幼稚すぎるしという感じで誰用の記事なのかわからないという感じですが許してください。
Arduino、マークダウン記法両方とも知らないことばかりで大変でしたがこれから慣れていきたいと思います。
読んでいただきありがとうございました。
【Laravel + PHPUnit】parse_urlで受け取るヘッダー情報をPOSTする方法

# 概要

テスト対象のビジネスロジックで`parse_url`メソッドを利用し特定の値を取得したい場合につまづいたので指定方法をまとめる


https://stackoverflow.com/questions/55107164/simulate-http-referer-in-a-laravel-dusk-test

```php
<?php
$parentUrl = parse_url(url()->previous())['path'];
if (strpos($parentUrl, 'hoge')) {
    return 'hoge';
}
```

# 解決方法

`from`を利用してヘッダー情報をカスタマイズします

```php
public function test_OK()
{
    $id = Users::query()->first()->id;
    $response = $this
        ->from('hoge')
        ->actingAs($this->authUser)->get("admin/users/${id}");
    $response->assertViewIs('admin.users.show');
}
``
X11起動時にカーソル以外何も表示されなかったらnomodeset カーネルパラメータを試してみるといいかもしれない

表題通りです。
## 環境
OS : Arch Linux(2022/03/25、ただしこれ以前も起きていた)
VGA: NVIDIA GeForce GTX1650
DM: lightdm
DE: Xfce4

## 症状
- lightdmでログイン後、マウスカーソル以外何も表示されない状態になる
- 仮想コンソールへの切り替え(Ctrl+Alt+F1)とX11への切り替え(Ctrl+Alt+F7)を何回か繰り返すとデスクトップ画面が表示される

## 解決した方法
`/etc/default/grub`の`GRUB_CMDLINE_LINUX`に`nomodeset`を追記して`grub-mkconfig -o /etc/grub/grub.cfg`を実行する

## ほかに試したこと
### `rcutree.rcu_idle_gp_delay=1` カーネルパラメータを使用する（解決ならず）
[ArchWikiの「NVIDIA/トラブルシューティング」](https://wiki.archlinux.jp/index.php/NVIDIA/%E3%83%88%E3%83%A9%E3%83%96%E3%83%AB%E3%82%B7%E3%83%A5%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0#X_.E3.81.AE.E8.B5.B7.E5.8B.95.E6.99.82.E3.81.AB.E9.BB.92.E7.94.BB.E9.9D.A2_.2F_X_.E3.81.AE.E3.82.B7.E3.83.A3.E3.83.83.E3.83.88.E3.83.80.E3.82.A6.E3.83.B3.E6.99.82.E3.81.AB.E3.83.9E.E3.82.B7.E3.83.B3.E3.81.AE.E9.9B.BB.E6.BA.90.E3.81.8C.E5.88.87.E3.82.8C.E3.82.8B)にあった方法。

### `mkinitcpio` の設定ファイルに直接 `nvidia` モジュールを追加する（解決ならず）
同記事にあった方法。

### linux-lts を使う（解決ならず）
PipeWireが壊れた。カーネルのバージョン変更は計画的に。
M1 mac にて nodebrew をインストールしようとしたら詰まった話

## はじめに

**M1 macにて nodebrew をinstallしようとしたら普通に詰まって大変だった（半泣き）**

フロントエンドエンジニアには欠かせないNode.js

フロントエンドエンジニアを目指して日々勉強している身としては環境構築で戸惑ってしまうのは非常にロスだ。
こんなことが二度と起きないために書き記しておく。

## Homebrewのインストール

```bash
% cd /opt
% sudo mkdir homebrew
% sudo chown $USER homebrew
% curl -L https://github.com/Homebrew/brew/tarball/master | tar xz --strip 1 -C homebrew

# PATHを通す
% cd
% vim .zshrc

export PATH=/opt/homebrew/bin:/usr/local/bin:$PATH

% source .zshrc
% which brew
/opt/homebrew/bin/brew

# Xcodeのライセンスにagree
% sudo xcodebuild -license accept

sudo softwareupdate --install-rosetta
```

参考サイト 
- [Homebrewのインストール - Qiita](https://qiita.com/zaburo/items/29fe23c1ceb6056109fd)
*** 
## nodebrewのインストール

```bash
curl -L git.io/nodebrew | perl - setup

brew install -s nodebrew
```

参考サイト
- [【M1 Mac】nodebrew v1.1.0が公式にAppleSiliconに対応したのでNode v16.0.0をインストール - Qiita](https://qiita.com/merarli/items/5f52db447c543db71a3f)
*** 
## Node.jsのインストール

```bash
nodebrew compile v15.4.0
```

参考サイト
- [[Node.js]M1 Mac で nodebrew から node v.16.0.0 未満をインストールする](https://kotsukotsu.work/tech/2021-11-13-node-js-m1-mac-%E3%81%A7-nodebrew-%E3%81%8B%E3%82%89-node-v-16-0-0-%E6%9C%AA%E6%BA%80%E3%82%92%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E3%81%99%E3%82%8B/)
- [nodebrewで「can not fetch」というエラーが出た時の対応策まとめ](https://zenn.dev/naoki_oshiumi/articles/967ce342172ab8)
*** 

# おまけ(nodebrewのコマンド集)



## ****インストール済みのバージョンを調べる****

```bash
nodebrew ls
```

## インストールできるバージョンを調べる

```bash
nodebrew ls-remote
```

## インストールする

```bash
nodebrew install <version>
```

## 使用するバージョンを切り替える

```bash
nodebrew use <version>
```

参考サイト
[Macでnodeのバージョン切り替え -nodebrew の使い方- - Qiita](https://qiita.com/chihiro/items/13652c461519f8922f56)

## 追記
もう nodebrew は使っておりません・・・
なぜならVoltaの方が優秀でしたので🔥
ノートPCのキーボードを修理する。

# はじめに

今回記事を書くということで自宅の私用ノートPCの壊れていたzキーを直したいと思います。
キー1個だけならうまくいけば十分ほどで直せるかもしれないので、まずは自分で確認してみることがおすすめです。

# 状態の確認

まずはどこが壊れているのか確認します。
キーボードの構成は(キーボードにもよりますが)キートップ→パンタグラフ→ラバードームとなっています。
↓がキートップを外したあとの画像になります。
![PC画像.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2319585/8d66ef3f-ebda-aa62-5a0a-d76728785730.png)
少々見にくいですが赤丸で囲っているところがパンタグラフで青丸のところがラバードームの押す部分になります。

異常のパターンとしては
・キートップの爪が折れている
・パンタグラフの爪が折れている
・ラバードームの反応が悪い
等があります。
これに関しては1部品ずつ確認するしかないですね。
異常がある部品については新品と交換して確認になるかと思います。

# 交換作業
今回に関してはキートップが無事でラバードームも正常に反応する状態だったのでパンタグラフを取り外したところ↓のように爪が折れていたので新品と交換しました。
![PC画像1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2319585/65e0f6e1-b823-008b-3790-e429d3e5c692.png)

価格はものによって違いますが400円～600円ほどで買えます。

今回は家に何もなかったため爪楊枝で交換作業をやりましたが、本当はマイナスドライバー等の工具を使い慎重に作業するのがよいです。

# 最後に
交換後は正常に動作するようになったのでやはりパンタグラフの爪折れが原因だったと思われます。
キーが効かない場合は修理に出す前に一度分解して確認してみてはいかがでしょうか。
時間もかからないし(今回は15分ほど)確認するだけタダなのでおすすめです。
Visual Studio Code で、常にデフォルト txt 形式で保存する方法

## 概要

新規作成した瞬間は「プレーンテキスト」なんですが、いざ保存しようとすると、拡張子が「ini」になってしまう事があるのは、VSCodeが途中で中身を「ini」ファイルであると勘違いしてしまうことにあるようです。
どうやら、一発で解決みたいな方法がないようですが、抜け穴的な方法はいくつか方法があり、その方法を記載します。

## 回避方法

(日本語拡張機能がインストールされているVS Codeを想定しています。)
いくつかやり方があり、どれでもOKです。

- １．右下の「Ini」をマウスでクリックし、一番下の「プレーンテキスト」にしてから保存する。

- ２．IMEをオフにする→「Ctrl+K」→「m」（※1）→「nte」（※2）→「Enter」→「Ctrl+S」（※4）の順に打つ

- ３．IMEをオフにする→「Ctrl+Shift+P」→「clm」（※3）→「Enter」→「nte」（※2）→「Enter」→「Ctrl+S」（※4）の順に打つ

- ４．IMEをオンにする→「Ctrl+S」→開いた「名前を付けて保存」ダイアログで「Tab」→「プ」（※5）→「Enter」の順に打つ（ファイル名入力に戻る場合はさらに「Shift+Tab」）

- ５．設定で「Files: Associations」に「txt」等入れる（※6）→「名前を付けて保存」ダイアログで、拡張子を手動で打って保存する

- ６．何も小細工せず「名前を付けて保存」ダイアログを開く→「カーソル右」→「自動で付いた拡張子をバックスペースキーで削除」→「txt」の順に打つ

- ７．「Language Detection」をオフにする（もちろん、本便利機能もオフになります）

※1: IMEをオフにしておかないと、「m」が効きません。
※2: 「plaintext」に部分一致しつつ、他の形式に部分一致しないキーワード。
※3: 「Change Language Mode」に部分一致しつつ、他機能に部分一致しないキーワード。「lamo」とかでもOK。
※4: 新規作成から一度も保存されていない場合、Ctrl+Sは「名前を付けて保存」になる。ファイルの種類が「プレーンテキスト」になっていれば、最初から「txt」が選ばれているはず。
※5: 「ぷ」と打ってから 「無変換」or「F7」→「Enter」
※6: 何故かtxt形式だけ意図したように動かず、「名前を付けて保存」ダイアログの拡張子リストがおかしくなり、結局、何を入れても拡張子無しになる。
※: No.2～4で、IMEオンだと、「m」以外の所でも全角入力になってしまい不都合ありますが、それらは確定前に「Ctrl+T」or「F10」等で半角にしてから確定すれば大丈夫です。「m」は文字ではなく半角mキー入力が必要みたいで、IMEオンのままでは反応させられませんでした。

~~個人的には、No.3,4,6あたりが好み。~~
No.7に鞍替えしました。No.7はあくまで内容を解釈して言語を推定するという機能なので、オフにしても「cppファイルを開くとcppモードになる。」という機能は失われません。

### 参考URL

VSCodeの保存拡張子をいちいち変更しなくていい方法 - Qiita
https://qiita.com/kiu21/items/846504478eba905b4860

VS Codeのデフォルトの言語（拡張子）を変更する - 倉下忠憲の発想工房
https://scrapbox.io/rashitamemo/VS_Code%E3%81%AE%E3%83%87%E3%83%95%E3%82%A9%E3%83%AB%E3%83%88%E3%81%AE%E8%A8%80%E8%AA%9E%EF%BC%88%E6%8B%A1%E5%BC%B5%E5%AD%90%EF%BC%89%E3%82%92%E5%A4%89%E6%9B%B4%E3%81%99%E3%82%8B
【要注意】Angularのテンプレート内で関数を気軽に呼ばないで！

# Angularのテンプレート内で関数を呼び出すとパフォーマンスに影響します
Angularで関数を呼び出す行為は深刻なパフォーマンスの問題につながる可能性があります。
# 何が問題なのか？
Angularは本来、変更されたデータを検出し、影響の受けるDOMのみを更新するようになっている。
だが、Angularは関数呼び出しによる値の変更があるかどうかを検出できない。
つまり、テンプレート内のすべての機能は、比較のために変更検出のサイクル毎に再実行される。
# 例えばどういうことか？
例えばこんな風にsortedHero()といった、ソート関数をコンポーネントに定義しテンプレートから読み込んだとしたら
```
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `
    <div *ngFor="let name of heroName">{{name}}</div>
    <div style="height: 100vh; width: 100vw; background: #e3e3e3;" (click)="onClicked()"></div>
  `,
})
export class AppComponent implements OnInit {

  public heroNames = ['Taro','Jiro','Kiyoshi']

  constructor() { }

  ngOnInit() {
  }

  sortedHero() {
    console.count("sortedHero Called");
    return this.heroName.sort()
  }

  onClicked() {
    console.count("Clicked")
  }

}

```

（CodePenの記述は若干違いますがやろうとしていることは一緒です。）

<p class="codepen" data-height="300" data-default-tab="js,result" data-slug-hash="rNpjwzg" data-user="kihaya-tech" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/kihaya-tech/pen/rNpjwzg">
  SortedHeroExample</a> by kihaya-tech (<a href="https://codepen.io/kihaya-tech">@kihaya-tech</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>

例えば"sortedHero"の場合は、HeroNamesに変更がある場合がなければ影響しないように思えますが、
Angularがしっかりと変更を検出できないため比較のために再検出サイクル毎に呼び出され再実行されます。

例えばこの例の場合は、ボタンがクリックされるごとに再検出サイクルがトリガーされ呼び出されます。

# とは言え？
まあ、一見ボタンをクリックし続ける奴はごく少ないのでそこまで影響がないように思えますが、Angularは変更検出をトリガーとする機能が非常にたくさんあり、関数の再実行が無視できない問題になる可能性があります。

また、いくつかの関数呼び出しだけでは、最初は影響が少ないように見えますが、コンポーネントの追加が増えると関数の実行が指数関数的に増えアプリケーションの速度を大幅に低下させる可能性があります。

## じゃあ、getter関数は？
関数呼び出しを回避するために、getterメソッドを使用することを考える人もいるかもしれませんが、しかし実際には、getterメソッドも関数呼び出しであり、同じ問題が発生します。

# じゃあどうすればいいの？

複雑な計算を伴うテンプレート呼び出しを回避する。計算が必要な場合は、Angularの値検出機能に頼るのではなく、手動で管理する必要がある。
プロパティーで値を管理し、親コンポーネントからの値の検知は、setter関数やngOnChangesを利用することによって対処することが適切かと思われる。



# 参考
この記事は、以前から疑問に思って調べていたらこの記事にあたることができ
日本語に似たようなドキュメントが少なかったため

以下の記事を参考に改編を加え投稿したものになります。
[Angular: DON'T Call Functions Inside The Template Anymore](https://javascript.plainenglish.io/angular-dont-call-a-function-inside-the-template-anymore-e74ebf499bb8)
xzコマンドの使い方（さくっと）

さくっと xz コマンドの圧縮・解凍 (展開) 方法を・・・と思ったんですが、用途によって使い分けした方がいい感じだったので、「1ファイルの場合」「ディレクトリの場合」の2項目に分けました・・・。
tarを1ファイルに対して実行しても動きますが、tarで固められたxz(.tar.xz)になってしまうので、無駄な事をしている感が出ます。
1ファイルの場合は以下の`xz`コマンドの方が良いかと思います。

# 1ファイルの場合の色々

hoge.txt を圧縮/解凍するサンプル。
(xz はデフォルトで元ファイルを削除するので`-k`を付けて抑制しています。)

### 圧縮（手軽）
```
xz -kv hoge.txt
```

### 圧縮（高速）
```
xz -kvT0 hoge.txt
```
マルチスレッドで圧縮します。

### 圧縮（圧縮率最高）
```
xz -kv9T0 hoge.txt
```
6以上の数字を指定すると、圧縮率が上がります。4以下はその逆。時間とのトレードオフ。

### 解凍（手軽）
```
unxz -k hoge.txt.xz
```
`xz -dk` でも良いです。

### 解凍（高速）
```
unxz -kT0 hoge.txt.xz
```
マルチスレッドで解凍します。


# ディレクトリの場合の色々

moge ディレクトリを圧縮/解凍するサンプル。
xz と言いながら、コマンドは tar になってますが、安心してください。`J`オプションにより、xz で圧縮されます。 (ちなみに、'J'の代わりに'a'(auto)オプションでも良いようです`.xz`という拡張子から自動判断されます。さらに展開時は、指定すら不要で拡張子から自動判別されます。)
また、`moge`は`moge/`でも問題ないです。

### 圧縮（お手軽）
```
tar Jcvf moge.tar.xz moge
```

### 圧縮（個別コマンド,高速）
```
tar cvf moge.tar moge
xz -vT0 moge.tar
```
tar はマルチスレッド動作出来ないようなので、こうするとマルチスレッドで圧縮出来ます。

### 圧縮（個別コマンド,高速 を1行で）
```
tar cvf moge.tar moge && xz -vT0 moge.tar
```
上記の1行書きVer.

### 解凍（お手軽）
```
tar xvf moge.tar.xz
```

### 解凍（個別コマンド,高速）
```
unxz -kT0 moge.tar.xz
tar xvf moge.tar
rm moge.tar
```
解凍もマルチスレッドでやる場合は分ける必要があります。
tar ファイルがゴミ的に生成されるので、最後に消しています。

### 解凍（個別コマンド,高速 を1行で）
```
unxz -kT0 moge.tar.xz && tar xvf moge.tar && rm moge.tar
```
上記の1行書きVer.


## xz, unxz コマンドの補足解説

高圧縮で、マルチスレッド処理に対応しています。gzip と比べると遅いです。
(zip → 7z と tar.gz → tar.xz は、ほぼ同じイメージですね。速度優先ならzip/gz、圧縮率優先なら 7z/xz）
xz コマンドは標準入力に対応していますが、ターミナルからの入力には非対応なので、tarから`|`で繋いで入力することは出来ないようです。

`-d`
(xz コマンドのみ)
解凍。unxz を使いたくない場合にどうぞ。未指定なら圧縮。

`-k`
圧縮前のファイルを残す。指定しない場合、元ファイルが削除されます。

`-v`
詳細を表示。数千ファイルになると表示しない方が速いと思います。

`-0 ～ -9`
(xz コマンドのみ)
圧縮率 低～高。未指定だと 5 になるもよう。
（手元の環境だと、 6 は 5 と同じになりましたが、偶然かも。）

`-f`
強制実行。未指定だと、同じファイル名が既にあると失敗。

`-T0`
マルチスレッドで実行(スレッド数自動)
-T4 にすると4スレッド実行


## tar コマンドの補足

`-J`
xz を透過する（xz 圧縮をかける）。
（GNU tar 1.22以降）

> tar.xzに圧縮する - FreeBSD入門
> https://kaworu.jpn.org/freebsd/tar.xz%E3%81%AB%E5%9C%A7%E7%B8%AE%E3%81%99%E3%82%8B

暗黙に圧縮率指定 6 くらいになるみたい？ 手元環境では、個別のコマンドでやるより小さくなりました。`-j`なら、bzip2。
また、解凍は指定無しで大丈夫みたい（勝手に認識して解凍までやってくれる）。

`-c`
アーカイブを作成（圧縮する時に指定）。

`-x`
アーカイブを展開（解凍する時に指定）。

`-v`
詳細を表示。数千ファイルになると表示しない方が速いと思います。

`-f`
ファイル出力する（標準出力しない）。
厳密には違うらしい。以下参照。

> tarでアーカイブを作るときの fオプション がないときの挙動を調べたことまとめ - nwtgck / Ryo Ota
> https://scrapbox.io/nwtgck/tar%E3%81%A7%E3%82%A2%E3%83%BC%E3%82%AB%E3%82%A4%E3%83%96%E3%82%92%E4%BD%9C%E3%82%8B%E3%81%A8%E3%81%8D%E3%81%AE_f%E3%82%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3_%E3%81%8C%E3%81%AA%E3%81%84%E3%81%A8%E3%81%8D%E3%81%AE%E6%8C%99%E5%8B%95%E3%82%92%E8%AA%BF%E3%81%B9%E3%81%9F%E3%81%93%E3%81%A8%E3%81%BE%E3%81%A8%E3%82%81

`-z`
gzip 等を通して実行
これは、15年くらい前から指定しなくてもよくなってるらしいです。
（GNU tar 1.15（2004年12月リリース）以降）

> 「tar zxvf」を使うのはオジサンだけ！？自動で認識されるので「z」「j」「J」の指定は不要！
> https://linuxfan.info/tar-z-option
[Markdown]MarkdownのラフさでTeXの見栄えが欲しい

## 目的
~~ドキュメントの作成をすることになったけどW〇rdは触りたくない~~
MarkDownの気軽さで見栄えのいいPDFドキュメントを作成したい

## 環境
OS: Windows 10
Editor: VSCode(任意のもので可)

## 環境構築
1. 下記インストール
    - **Pandoc** 
    https://github.com/jgm/pandoc/releases/
    - **TeX Live**
    https://tug.org/texlive/acquire-netinstall.html
2. Pathが通っていることを確認
    ```
    C:\texlive\2021\bin\win32
    ```
3. ビルド
    `template.tex`: 既定テンプレートファイル
    `input.md`: 入力ファイル(Markdown)
    `output.pdf`: 出力ファイル(pdf)
    使用するファイルはすべて`UTF-8`である必要があるので注意
    ```
    //  テンプレートファイルを生成(出力時は UTF-16 BOM付?)
    > pandoc -D latex > template.tex
    ```
    ```
    //  pdf出力
    > pandoc input.md -o output.pdf --pdf-engine=lualatex --template=template.tex -N -V documentclass=bxjsarticle -V 
    classoption=pandoc
    ```

    ## サンプル (' ->` に置換)
    <details><summary>サンプル.md</summary>

    ```md2tex.md
    \begin{titlepage}
        \begin{center}
    
            \vspace*{180truept}
    
            {\huge MarkDown}\\
    
            \vspace{10truept}
    
            {\huge MarkDownのラフさでTeXの見栄えが欲しい}\\
    
            \vspace*{260truept}
    
            {\Large Date: 2022/03/25}\\
    
            \vspace{5truept}
    
            {\Large Author: やまとら。}\\
    
        \end{center}
    \end{titlepage}
    
    # 目的
    ~~ドキュメントの作成をすることになったけどW〇rdは触りたくない~~
    MarkDownの気軽さで見栄えのいいPDFドキュメントを作成したい
    
    # 環境
    OS: Windows 10
    Editor: VSCode(任意のもので可)

    # 環境構築
    1. 下記インストール
        - [**Pandoc**](https://github.com/jgm/pandoc/releases/)  
        - [**TeX Live**](https://tug.org/texlive/acquire-netinstall.html)  
    2. path
    3. ビルド
    `template.tex`: 既定テンプレートファイル
    `input.md`: 入力ファイル(Markdown)
    `output.pdf`: 出力ファイル(pdf)
    使用するファイルはすべて`UTF-8`である必要があるので注意
    '''
    //  テンプレートファイルを生成(出力時は UTF-16 BOM付?)
    > pandoc -D latex > template.tex
    '''
    '''
    //  pdf出力
    > pandoc input.md -o output.pdf --pdf-engine=lualatex --template=template.tex -N -V     
    documentclass=bxjsarticle -V classoption=pandoc

    ## 目次

    ## 番号なし目次 {-}
    
    | KEY  | VALUE  |
    | ---- | ------ |
    | key1 | value1 |
    | key2 | key2   |

    詳しい文法等は`参考ページ`を参照のこと
    ```
    </details>

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/500080/156e0532-0700-12f8-9685-47533f2f5c79.png)


## メモ
Markdownをいじる際には基本的にVSCodeでプレビューを開きながら作業するのですが、`PowerShell`もタブとして追加できるので1つのウィンドウで完結していい感じな気がします
RMarkdownなるものがあるらしいので軽く調べてみる予定

*タイトル通りの軽いモチベーションの為、各コマンドの動作等を完全に理解していません

## 参考ページ
- [Pandoc User's Guide 日本語版](https://pandoc-doc-ja.readthedocs.io/ja/latest/users-guide.html)
- [まだ Word で消耗してるの？ 大学のレポートを Markdown で書こう - Qiita](https://qiita.com/Kumassy/items/5b6ae6b99df08fb434d9)
- [LaTeXの卒論の表紙テンプレート >< - Qiita](https://qiita.com/ganyariya/items/6fe38f371dc8fa3a49a4)
aタグをdivで囲むのをやめた

## aタグを何で囲むべきか
`aタグは`inline`要素なので今まで` `div`で囲っていました
初めてhtmlを学んだ時に`div`タグで囲んでいたので、今までは`div`を使っていました

## `div`をやめてどうするの？

`p`タグを使う
`p`タグで囲む人は一定数いるようです。

## なぜ？
webアプリケーションを作成中に`div`ばかりでコードが読みづらかった

下の例を見てほしい

```html:みずらい!!
<div class="inner">
  <div class="main__link"><a href=""></a></div>
  <div class="main__picture"><img src="" alt=""></div>
</div>
```

```html:いくらか見やすい
<div class="inner">
  <p class="main__link"><a href=""></a></p>
  <p class="main__picture"><img src="" alt=""></p>
</div>
```

## 参考

https://qiita.com/125Dal/items/a1e3e463fb8202db9365#img%E3%81%AF%E5%AE%9F%E3%81%AFp%E3%81%A7%E5%9B%B2%E3%81%86%E3%81%AE%E3%81%8C%E6%AD%A3%E3%81%97%E3%81%84-%E3%81%AE%E3%81%8B
Unity備忘録 keras2onnxのインストール方法

■PipのDLとインストール
macのターミナルにて、下記の2行を実行します。
curl https://bootstrap.pypa.io/get-pip.py -o get-pip.py
python3 get-pip.py

pipのインストールが完了したら、pipコマンドでkeras2onnxをインストールします。
pip install keras2onnx

公式サイト
https://github.com/onnx/keras-onnx
オブジェクト指向をガンプラに例えてみた

# **初めに**

IT未経験者でjavaを学習していて演算子やら配列やら繰り返し文…。
最初の内はプログラムの動くを知る意味でも基礎を身に着ける意味でも
ちょっと考えて動かせる様なとこから始まると思いますが慣れてきたとこで
いきなり**オブジェクト指向**…何か概念的なやつが出てくると思います。

正直言って頭に入ってこない人も居ると思いますし自分もそうです。
なので自分なりに分かりやすくまとめてみました。
今回は
　1.そもそもオブジェクトとは？
　2.説明書(クラス)を読もう
　3.組み立てよう（インスタンス化）
この3つに絞りたいと思います。

## １そもそもオブジェクトとは？
ざっくり言いますとモノ、言うなればガンプラですはい。
こいつを今から組み立てる訳ですね、では箱を開けていざ組み立て！


の前に先ずはやることがありますよね？
そうです説明書を見ますね、これが無いとガンプラは組めません。
なので次にやることは…


## ２説明書（クラス）を読もう
実際に説明書を見ると
　-脚部
　-胴体
　-腕部
　-バックパック
　-ビームライフル
　-シールド
　-頭部
の作り方と使う部品が書かれていますね。
これが**クラス**です、ではコイツを組み立てましょう。


## ３組み立てよう（インスタンス）
実際に組み立てていきます、説明書通りに部品を用意して
黙々と組み立てていくと先ずは脚部が出来ました。
これを**インスタンス**と言います、newするとも言います。

 `Gunpla Leg = new Gunpla Leg();`

みたいにnewがついていたらインスタンスされたんだな位でいいと思います。
このインスタンスを残りの部位にしてやるとガンプラの完成です！

## まとめ
かなりザックリ端折った感じになりましたが簡単にまとめますと
オブジェクト指向とはプログラムを部品単位で考える事で効率よく
開発が行えるって事でした。
もし御指摘等ありましたらコメントの方まで宜しくお願いします。
memo

repを複数使うとき同じ文字を使わない

同じ文字を何度も定義するとエラーが起きやすい(queueなど)

通常は番号を入力から受け取るとき-1する

INFの値は十分大きい値にしておく(int INF = 1e9)

dpの2つ目の要素の最後は引き継がれない可能性がある

入力の型を確認する

問題文の勘違い
Rubyの正規表現の特殊変数

# 正規表現

Rubyでは正規表現を生成する方法が大体二つある、即ち正規表現リテラルとRegexpクラスのクラスメソッドとなります。

## 正規表現を生成する

```
irb(main):001:0> a = /abcdefg/i
=> /abcdefg/i
irb(main):002:0> a.class
=> Regexp
irb(main):003:0> a = Regexp.new("abcdefg")
=> /abcdefg/
irb(main):004:0> a = Regexp.new("abcdefg", Regexp::IGNORECASE)
=> /abcdefg/i
```

## Regexpのオプション

### Regexp::IGNORECASE

大文字小文字の違いを無視する
```
irb(main):021:0> str = "This is Regexp"
=> "This is Regexp"
irb(main):022:0> t1 = Regexp.new("this is regexp", Regexp::IGNORECASE)
=> /this is regexp/i
irb(main):023:0> t1.match(str)
=> #<MatchData "This is Regexp">
irb(main):024:0> t2 = /this is regexp/i
=> /this is regexp/i
irb(main):025:0> t1.match(str)
=> #<MatchData "This is Regexp">
```

### Regexp::MULTILINE

正規表現 「.」 が改行にマッチするようになります。
```
irb(main):028:0> str = "This is\nRegexp"
=> "This is\nRegexp"
irb(main):029:0> t2 = Regexp.new("This.*?Re", Regexp::MULTILINE)
=> /This.*?Re/m
irb(main):030:0> t2.match(str)
=> #<MatchData "This is\nRe">
irb(main):031:0> t2.match(str)[0]
=> "This is\nRe"
```

### Regexp::EXTENDED

バックスラッシュでエスケープされていない空白と # から改行までを無視します。
```
irb(main):051:0> str = "this is regexp"
=> "this is regexp"
irb(main):052:0> t3 = Regexp.compile('
this         # cannot be used
\ is
\ regexp     # cannot be used
', Regexp::EXTENDED)
=> /
this         # cannot be used
\ is
\ regexp     # cannot be used
/x
irb(main):057:0> t3.match(str)
=> #<MatchData "this is regexp">
```

### オプションの論理和

複数のオプションが論理和で使用可能となります。
```
irb(main):064:0> t4 = Regexp.compile('
this         # cannot be used
\ is
\ regexp     # cannot be used
', Regexp::IGNORECASE | Regexp::EXTENDED)
=> /
this         # cannot be used
\ is
\ regexp     # cannot be used
/ix
irb(main):069:0> str = "This is Regexp"
=> "This is Regexp"
irb(main):070:0> t4.match(str)
=> #<MatchData "This is Regexp">
```

# 特殊変数

特殊変数とは、パターンマッチした際に、マッチの情報をセットするローカルな変数となります。

## [$~] 最後にマッチしたときの情報(MatchData オブジェクト)

`Regexp.last_match`と同じ。

```
irb(main):001:0> /(abc)d(efg)/ =~ "abcdefghljklmnop"
=> 0
irb(main):002:0> Regexp.last_match
=> #<MatchData "abcdefg" 1:"abc" 2:"efg">
irb(main):003:0> $~
=> #<MatchData "abcdefg" 1:"abc" 2:"efg">
```

## [$&] マッチしたテキスト全体

```
irb(main):004:0> $&
=> "abcdefg"
```

## [$`] マッチしたテキストの手前の文字列

```
irb(main):006:0> /(bc)d(efg)/ =~ "abcdefghljklmnop"
=> 1
irb(main):007:0> $`
=> "a"
```

## [$'] マッチしたテキストの後ろの文字列

```
irb(main):006:0> /(bc)d(efg)/ =~ "abcdefghljklmnop"
=> 1
irb(main):008:0> $'
=> "hljklmnop"
```
## [$0], ファイル名

```
irb(main):009:0> /(bc)d(efg)/ =~ "abcdefghljklmnop"
=> 1
irb(main):012:0> $0
=> "irb"
```


## [$1], [$2], ... キャプチャ文字列

```
irb(main):009:0> /(bc)d(efg)/ =~ "abcdefghljklmnop"
=> 1
irb(main):010:0> $1
=> "bc"
irb(main):011:0> $2
=> "efg"
```

## [$+] 最後(末尾)のキャプチャ文字列

```
irb(main):013:0> /(bc)d(efg)/ =~ "abcdefghljklmnop"
=> 1
irb(main):014:0> $+
=> "efg"
```
AWS CodebuildでCypressを使って、統合テストのCI環境を構築する

# 概要
ググっても英語の記事しか出なかったので、CypressでIntegration Test（統合テスト）をするCI環境を作る方法を書いておきます。

# 環境
## イメージ
aws/codebuild/standard:5.0-21.04.23

## クライアント
React ver 16.8.6
cypress 9.0.0

# 早速buildspec記載

```yaml
version: 0.2

phases:
  install:
    commands:
      - apt update
      - apt install -y sudo curl
      - curl -sL https://raw.githubusercontent.com/Unitech/pm2/master/packager/setup.deb.sh | sudo -E bash -
      - node -v
      - npm -v
      - npm install -g pm2 wait-on
      - yarn -v
  pre_build:
    commands:
      - npm install
  build:
    commands:
      - pm2 start npm -- start ## dev server起動
      - wait-on http://localhost:3000
      - npm run cy:run
```

# 概要
React環境をpm2を使って、バックグラウンドで動かすってところがググってもなかなかでなかったです。
どうしてもインテグレーションテストの場合は、サーバーを動かさなきゃダメのようだったので。
間違いあればご指摘ください。
インターネットとWebの違い。②Web

半年ほど前に業界未経験からエンジニアに転職しました。
アウトプットした方が良いと分かっていても出来ていない...
小さいことから始めていこうということで、一言で説明してと言われたときに困ってしまったインターネットとWebの違いを調べてみた。

# インターネットとWebは別のもの
インターネットとはネットワークであり、通信技術のことで、
世界中のコンピュータが繋がって出来た巨大なネットワーク。
Webとは、インターネットを利用して文章や画像、映像、音声などのデータを送る仕組みで、普段見ているWEBサイトやアプリはWebのこと。

# Webの歴史
世界中の実験者と文書を共有したい！という目的でCERNのティム・バーナーズ＝リーにより開発される。
最初はWebは文字のみしか使えなかったが、画像が扱えるように改良されWebブラウザが普及し始めると、研究者ではない一般の人にも扱いやすいサービスになって世界中に広まっていった。

# World Wide Web
 Webの正式名称はWorld Wide Web(世界に広がるクモの巣)という。情報を、まるでクモの巣のように、世界中に張り巡らされていることから名付けられた。
Web上の文書は(Webページ)はハイパーテキストと呼ばれる言語で構成されている。
ハイパーテキストは1つのWebページの中に別のWebページへのリンクを埋め込んで、1つのWebページを複数のページと関連付けて大きな情報の集合体とすることができる。
Webページにはそれぞれ、URLという「住所」が付けられている。

# 参考
* [イラスト図解式 この一冊で全部わかるWeb技術の基本](https://www.amazon.co.jp/%E3%82%A4%E3%83%A9%E3%82%B9%E3%83%88%E5%9B%B3%E8%A7%A3%E5%BC%8F-%E3%81%93%E3%81%AE%E4%B8%80%E5%86%8A%E3%81%A7%E5%85%A8%E9%83%A8%E3%82%8F%E3%81%8B%E3%82%8BWeb%E6%8A%80%E8%A1%93%E3%81%AE%E5%9F%BA%E6%9C%AC-%E5%B0%8F%E6%9E%97-%E6%81%AD%E5%B9%B3/dp/4797388811/ref=asc_df_4797388811/?tag=jpgo-22&linkCode=df0&hvadid=295704876452&hvpos=&hvnetw=g&hvrand=15357321002661338070&hvpone=&hvptwo=&hvqmt=&hvdev=c&hvdvcmdl=&hvlocint=&hvlocphy=1009210&hvtargid=pla-526274317363&psc=1&th=1&psc=1)



世界中が繋がり便利になったことは良いことだが、詳しい人なら簡単に自分の情報も盗られてしまうのではと不安になった。学生時代、友人が好きな子の名前を検索していたら彼氏らしき人と写っている画像を見つけてショックを受けていたことを思い出した。
興味があっても調べない方が良いこともあるけれど、セキュリティ関係は勉強しないとな。
実践アジャイルテストを読んで：アジャイルテスト導入部の説明

# 経緯
[実践アジャイルテスト テスターとアジャイルチームのための実践ガイド](https://www.amazon.co.jp/%E5%AE%9F%E8%B7%B5%E3%82%A2%E3%82%B8%E3%83%A3%E3%82%A4%E3%83%AB%E3%83%86%E3%82%B9%E3%83%88-%E3%83%86%E3%82%B9%E3%82%BF%E3%83%BC%E3%81%A8%E3%82%A2%E3%82%B8%E3%83%A3%E3%82%A4%E3%83%AB%E3%83%81%E3%83%BC%E3%83%A0%E3%81%AE%E3%81%9F%E3%82%81%E3%81%AE%E5%AE%9F%E8%B7%B5%E3%82%AC%E3%82%A4%E3%83%89-Architects-Archive%E3%82%BD%E3%83%95%E3%83%88%E3%82%A6%E3%82%A7%E3%82%A2%E9%96%8B%E7%99%BA%E3%81%AE%E5%AE%9F%E8%B7%B5-Gregory/dp/4798119970)を読んで学んだ内容を書いていきます。
筆者は、プロジェクトでテストに関することに携わったことがないですが、そのような役割に着く可能性があり、テスターの役割や仕事内容について知りたくてこの本を読みました。
かなり読み応えのある本ですが、アジャイルテストの考え方、アジャイルテスターの役割、取り組みの内容など、網羅的に学ぶことができ、いい本でした。（翻訳が悪い部分も少々ありましたが。。）
この記事ではこれからテスターの仕事をする人でどこから手をつけていいかわからない人向けて、アジャイルテストの取り組みの導入部分を説明します。

# なぜテストをするのか？
なぜテストをするのか？それは、コードが正しく書かれていることを確かめるためです。
では、正しいコードとは何か？それは、顧客が求める価値を提供しているコードです。
顧客が求めるものは要件としてまとめられます。
開発終了時にコードが顧客へ提出されますが、それが要件を満たしていることはテストを通して、検証されます。
そのため、テストが必要になります。
これは、アジャイルでもウォーターフォールの開発体制でも変わりません。

# アジャイルテストとは？
では、アジャイルテストは、ウォーターフォールでのテストと何が異なるのでしょうか？
ウォーターフォールの体制では、コードの開発が終わってからテストを行うので開発に追われ、テスト期間が削られてしまうということがありました。
これでは、満足にコードをテストできないことになり、バグを含んだ品質の低いコードになる可能性が高くなります。
アジャイルでは、ウォーターフォールのように一つの工程を終わらせて次の工程へいくのではなく、スプリントなどで期間を設定し、その期間内で達成できる要求単位で開発を進めていきます。

## 要求とは？
要求 = ストーリー + 例 + 会話

## ストーリーとは？
ストーリー（ユーザーストーリー）とは、ユーザーや顧客にとって価値があるユーザー視点で書かれた機能に関する短い記述のことです。ストーリーは、顧客のコンテキストの言葉で記述されます。
ストーリーは、例えば次のような形式で記録されます。
（役割）として：私は（機能）を希望します。それにより（ビジネス価値）が可能です。
例えば、ECサイトを作っているとして、
ECサイトの買い物客として：私は、ショッピングカート機能を希望します。それにより、一括で商品を買うことができ、ユーザーの手間を減らすことができます。

## 例とは？
例とは、提供された機能がどのように動くべきかの例です。
ショッピングカートの例では、商品Aをカートに入れて、商品Bのページへいき、商品Bもカートに入れ、決算画面へうつると、商品A、Bが表示されて、支払い金額の合計が見える。など
この例は、一例ですが、境界の条件や極端なケースなど含めるとより多くのテストが必要になります。

## 会話とは？
要求を導くための会話となりますが、これは顧客とテスターだけでなく、プログラマも含まれます。
この三者が緊密に作業することで、正しい価値を提供することを目指します。

## 要求をテストケースへ
アジャイルテスターは、要求をコーディング可能なテストケースに変換します。
テストケースは、要求とコードの橋渡しとなります。

## ストーリーからテストを作るまでのユースケース図
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/280261/2c5de6b9-6c53-3f78-521c-082433bc5637.png)


# アジャイルテストの進め方
アジャイルでは、テストが書かれるのはスプリントの最後ではなく、要求が出た後、つまりスプリント開始初期になります。
この点が従来のウォーターフォール型と異なります。
スプリントで要求単位で開発を進めながらも、テストがそのスプリントの最後にきているなら、それはアジャイルではなく、ミニウォーターフォールというバッドプラクティスであると、書籍の中では警告されています。

つまり、アジャイルテストの進め方は、
1. スプリントが開始されます。
2. 顧客がストーリーを出します。
3. 顧客、プログラマ、テスターで会話し、ストーリーから例を引き出します。
4. ストーリー、例、会話により、要求が作られます。
5. テスターは要求からテストケースを作成します。
6. テストケースは、プログラマと共有され、設計に役立たれます。
7. また、テスターはテストケースからテストをコーディングします。単体テストなどの一部のテストはプログラマにより作成されます。
8. テストと機能のコーディングは同時に進みます。この時、テスターとプログラマは、それぞれ孤立するのではなく、よくコミュニケーションをとり、認識の齟齬がないようにします。
9. 完成したテストはプログラマに渡され、機能のテストに用いられます。
10. 最終的にテストとテストされた機能が顧客へ提供されます。

これにより、要求 → テストケース → テストと変換されたものが開発に使われることで、品質を基準とした開発をすることができるようになります。
このような開発体制を書籍の中では、テスト駆動開発（TDD）と呼んでいますが、TDDには、上のような開発体制としての意味と[開発手法としての意味](https://ja.wikipedia.org/wiki/%E3%83%86%E3%82%B9%E3%83%88%E9%A7%86%E5%8B%95%E9%96%8B%E7%99%BA)があるようです。

# 最後に

今回は、アジャイルテストの始まりとして、顧客、テスター、プログラマがそれぞれ連携して、要求を作っていく様子をまとめました。
ただ、そもそもアジャイルは、顧客に対して価値を提供するために、問題に対してチームで取り組むことをマニュフェストとして掲げているので、役割は分かれていますが、価値を提供するということに対しては、何人も平等です。
自分の役割に囚われず、価値を提供するということを第一にしていきましょう。
data driven marketing



データに関する記事を書こう！

https://qiita.com/official-events/30be12dd14c0aad2c1c2

テーマ2『データに関する記事を書こう！』参加記事です。


データドリブンとは 活用方法や支援ツールを紹介

https://delika.connecto-data.com/blog/2021-10-11-559/


>「データの収集」「データの分析」「データの可視化」「アクション」という 4 ステップ

落水(water falll model)による4 stepです。

DoCAPモデルに基づく４段きは、

データ発信
データ測定
データ改善
データ戦略

をお勧めしています。

# データ発信
社会現象は、受動測定では偏りが大きく、役に立たないことがあります。
能動測定をするために、まずデータ発信が重要です。

他人のデータ発信に対する測定をしていても、そのデータ発信がなくなれば、価値が低くなる可能性があります。

# データ測定
自己のデータ発信に基づく、能動測定と、
自己のデータ発信以外の受動測定を、
あるまとまり以上同時に行うことにより、
能動測定の反応の分布の形と、受動測定の分布の形の違いから、
次にどう改善すればいいかを決めることができるかもしれません。


# データ改善
衲僧測定と受動測定の比較から、改善策をひとまず戦術的に実施します。


# データ戦略

戦術的な改善の反応を見て、戦略を練ります。

今後の登場する主体の変化を予測し、短期、中期、長期の戦略をたてて、次の情報発信を行います。

市場分析

https://qiita.com/kaizen_nagoya/items/204dec534ac95070043c

「素人のように考え玄人として実行する」か，玄人として考え素人のように振る舞うか。市場分析の一つの方法

https://qiita.com/kaizen_nagoya/items/ad961d6b959e3f22f1f9

統計と確率が扱えれば工学のほとんどは大丈夫。仮説（119）統計と確率(1)

https://qiita.com/kaizen_nagoya/items/c917054d1390b7e17049


# 参考資料(reference)

@e99h2121 育児していたからこそエンジニアのお仕事に役立ったこと10選

https://qiita.com/e99h2121/items/db7e54c111ffcd3c3957

@e99h2121「女性こそエンジニアになるべきだ？」デブサミウーマン登壇記録

https://qiita.com/e99h2121/items/7c69be1b2c2f305f6a4c

@e99h2121 gitで難しいことしたくなければこのフロー、3stepだけ、という覚書

https://qiita.com/e99h2121/items/e9941211d9780d5b68c9


@ohakutsu 新卒2年目から見た達人プログラマーの振る舞い

https://qiita.com/ohakutsu/items/387ff8d8c09f592f124f

@torifukukaiou 【毎日自動更新】データに関する記事を書こう！ LGTMランキング！

https://qiita.com/torifukukaiou/items/b10fa94764aaaa2c6db1

@torifukukaiou Qiita 10周年記念イベント LGTMランキング！

https://qiita.com/torifukukaiou/items/69980bf263d20eab1988

@torifukukaiou Qiitaエンジニアフェスタ2021 LGTMランキング！

https://qiita.com/torifukukaiou/items/949ff6d59ffeeec0cd51

@torifukukaiou 私のAdvent Calendar 2022 ーー はじめたきっかけ、1月のふりかえり、今後の展望

https://qiita.com/torifukukaiou/items/891db4e40a7f6194af56

@kazuo_reve 新人の方によく展開している有益な情報

https://qiita.com/kazuo_reve/items/d1a3f0ee48e24bba38f1

@kazuo_reve Qiitaの自分の記事に対するデータ分析の準備

https://qiita.com/kazuo_reve/items/22a9fcf294b142d3a906

@kazuo_reve 私が効果を確認した「小川メソッド」

https://qiita.com/kazuo_reve/items/a3ea1d9171deeccc04da


## 自己参照


新人(学生)を指導するよりも新人(学生)に指導してもらった方が効率的。仮説（139）

https://qiita.com/kaizen_nagoya/items/db993b1536055029f7c8

データサイエンティストの気づき「勉強だけして仕事に役立てない人。大嫌い！」。『それ自分かも！』ってなった。

https://qiita.com/kaizen_nagoya/items/d85830d58d8dd7f71d07

凡人網が与件網　

https://qiita.com/kaizen_nagoya/items/9ca08075fb424efdc559

プログラマにも読んでほしい「QC検定にも役立つ！QCべからず集」

https://qiita.com/kaizen_nagoya/items/d8ada7b7fceafe2e5f0e

プログラミング言語教育のXYZ。Youtube(1) 仮説（52）

https://qiita.com/kaizen_nagoya/items/1950c5810fb5c0b07be4

「上から目線」が嫌だから下からと真ん中からと同時に

https://qiita.com/kaizen_nagoya/items/c60c6daa0d73bddbf8a7

プログラマとして、「プログラムを書く時、文章を書く時、言い訳をする時」に心がけていること。仮説(87)

https://qiita.com/kaizen_nagoya/items/7e5700db01727cb516fc

落水(water fall)の反対は機敏(agile)ではない

https://qiita.com/kaizen_nagoya/items/6f705b5ac2b468ebd3ea

コンサルタントと（して）うまく付き合う方法（案）

https://qiita.com/kaizen_nagoya/items/499b0a16ac89c0fe3fb0