OmniAICreator/Qiita-1.07M huggingface dataset:
Kotlinのitとは

## Kotlinのitって何？

「[Kotlin Bootcamp for Programmers 3：関数](https://developer.android.com/codelabs/kotlin-bootcamp-functions#5)」をやっていて気になった部分。
当該サンプルコードは以下(上記ページから引用)。

```kotlin:samplecode
val lazyMap = decorations.asSequence().map {
        println("access: $it")
        it
    }
```

宣言してないのにしれっと存在する```it```って誰？

## itは「単一パラメータの暗黙の名前」

困ったら公式リファレンス。
itに関する記載は「[高階関数とラムダ](https://dogwood008.github.io/kotlin-web-site-ja/docs/reference/lambdas.html#%E9%AB%98%E9%9A%8E%E9%96%A2%E6%95%B0%E3%81%A8%E3%83%A9%E3%83%A0%E3%83%80)」の「[it : 単一パラメータの暗黙の名前](https://dogwood008.github.io/kotlin-web-site-ja/docs/reference/lambdas.html#it--%E5%8D%98%E4%B8%80%E3%83%91%E3%83%A9%E3%83%A1%E3%83%BC%E3%82%BF%E3%81%AE%E6%9A%97%E9%BB%99%E3%81%AE%E5%90%8D%E5%89%8D)」に記載がある。
以下に当該箇所を引用。

> もう一つの有用な慣習は、関数リテラルがパラメータを1つだけ持つ場合、その宣言を（ -> と一緒に）省略してもよいということです。その場合、その名前は、 it になります。

ということで無事解決。
~~「Bootcamp」っていうならそのくらい書いといてほしかったなと思わないでもない。~~
Grove IoT スターターキット for SORACOM で MQTT クライアントを使う

パブリック MQTT ブローカー broker.emqx.io に接続するサンプルです。

フォルダー構造

```text
$ tree mqtt_client/
mqtt_client/
├── mqtt_client.ino
└── setupLTE.ino
```

```text:mqtt_client.ino
// ---------------------------------------------------------------
/*
	mqtt_client.ino

					Aug/10/2021
*/
// ---------------------------------------------------------------
#include <WioLTEforArduino.h>
#include <WioLTEClient.h>
#include <PubSubClient.h>
#include <stdio.h>

#define MQTT_SERVER_HOST  "broker.emqx.io"
#define MQTT_SERVER_PORT  (1883)

#define ID                "WioLTE"
#define OUT_TOPIC         "example/testTopic"
#define IN_TOPIC          "example/testTopic"

#define INTERVAL          (60000)

WioLTE Wio;
WioLTEClient WioClient(&Wio);
PubSubClient MqttClient;

// ---------------------------------------------------------------
void callback(char* topic, byte* payload, unsigned int length) {
	SerialUSB.print("Subscribe:");
	for (int i = 0; i < length; i++) SerialUSB.print((char)payload[i]);
	SerialUSB.println("");
}

// ---------------------------------------------------------------
void setup() {
	setupLTE();

	SerialUSB.println("### Connecting to MQTT server \""MQTT_SERVER_HOST"\"");
	MqttClient.setServer(MQTT_SERVER_HOST, MQTT_SERVER_PORT);
	MqttClient.setCallback(callback);
	MqttClient.setClient(WioClient);
	if (!MqttClient.connect(ID)) {
		SerialUSB.println("### ERROR! ###");
		return;
	}
	MqttClient.subscribe(IN_TOPIC);

	SerialUSB.println("*** Setup completed *** Aug/10/2021 PM 18:54 ***");
}

// ---------------------------------------------------------------
void loop() {
	char data[100];
	sprintf(data, "{\"uptime\":%lu}", millis() / 1000);
	SerialUSB.print("Publish:");
	SerialUSB.print(data);
	SerialUSB.println("");
	MqttClient.publish(OUT_TOPIC, data);
	
err:
	unsigned long next = millis();
	while (millis() < next + INTERVAL)
	{
	Wio.LedSetRGB(1, 1, 0); 
		MqttClient.loop();
		SerialUSB.println("*** check ***");

	Wio.LedSetRGB(0, 0, 1); 
	delay(1000);
	Wio.LedSetRGB(0, 1, 0); 
	delay(1000);
	Wio.LedSetRGB(1, 1, 1); 
	delay(1000);
	Wio.LedSetRGB(0, 0, 0); 
	delay(1000);
	}
}

// ---------------------------------------------------------------
```

setupLTE.ino はこちら
[UDP で温度と湿度を Harvest に送る](https://qiita.com/ekzemplaro/items/690faa6f56003272299f)

次のコマンドで publish をします。

```bash:go_pub_mqtt.sh
BROKER="broker.emqx.io"
#
echo $BROKER
message="Hello Mqtt "`date`
mosquitto_pub -d -t orz -m "${message}" \
    -h  $BROKER \
    --topic example/testTopic
```

シリアルモニタの結果
![mqtt_aug10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/f7db82b1-895c-41eb-e5d6-8dc415518cfe.png)

参考ページ
[パブリック MQTT ブローカーの使い方](https://qiita.com/ekzemplaro/items/0a03a96c2f5a5ba2ae55)
python リスト内包表記のメモ

## リスト内包表記の書き方
リスト内包表記とはリストの中にコードを書いてリストを作成する手法のことである。

```square.py
square = [i ** 2 for i in range(10)]
# >> [0, 1, 4, 9, 16, 25, 36, 49, 64, 81]
```

リスト内包表記では、if文で分岐する記載も可能である。

```even_square.py
even_square = [i ** 2 for i in range(1:10) if i % 2 == 0]
# >> [4, 16, 36, 64]
```

if-else文での分岐処理も可能である。
ただしif文のみで作成する場合とは順番が異なることに注意が必要である。

```odd_and_even_square.py
odd_and_even_square = [i ** 2 if i % 2 == 0 else i for i in range(1, 10)]
# >> [1, 4, 3, 16, 5, 36, 7, 64, 9]
```

elifは使えない。しかし、if-elseを駆使しすることで複雑なコードを記述することは可能である。
例えばfizzbuzzの場合は以下のように記載できる。

```fizzbuzz.py
fizzbuzz = ['fizzbuzz' if i % 15 == 0 else 'fizz' if i % 3 == 0 else 'buzz' if i % 5 == 0 else i for i in range(1, 20)]]
# >> [1, 2, 'fizz', 4, 'buzz', 'fizz', 7, 8, 'fizz', 'buzz', 11, 'fizz', 13, 14, 'fizzbuzz', 16, 17, 'fizz', 19]
```
##  リスト内包表記の処理時間
1~10,000,000までの偶数を2乗したリストを、for文で作成した時とリスト内包表記で作成したときでは、どの程度時間に差があるのかを比較してみた。

| 試行回数 |  for文  |  リスト内包表記  |
| :---: | :---: | :---: |
| 1回目 | 2.989s  |  2.354s  |
| 2回目 | 3.191s  |  2.455s  |
| 3回目 | 3.120s  |  2.371s  |
| 4回目 | 3.219s  |  2.434s  |
| 5回目 | 3.134s  |  2.387s  |
| 平均 | 3.131s  |  2.400s  |

速度を意識する場合、リスト内包表記は有用である。
しかし、リスト内包表記を多用しすぎると可読性が落ちることには注意を払う必要がある。
UMLの最新仕様をまとめる

2021/08/10に、UMLの最新仕様を調べる機会があったので調査した内容をまとめておきます。

# 1. 仕様書を取得する

まずは、UMLの公式サイトで最新仕様を調べてみます。
Object Management Group Inc. 

https://www.uml.org/

[CURRENT SPECIFICATION（現在の仕様）をクリックするとOMGのホームページが表示されました。

Object Management Group, OMG

https://www.omg.org/spec/UML/

表示した仕様は 2.5.1 でした。
ちなみにWikipediaで調べてみると、ISO/IEC 19501:2005 として UML 1.4.2 を、また、ISO/IEC 19505-1:2012 ならびに ISO/IEC 19505-2:2012 として UML 2.4.1 を標準化しているようです。

OMGからPDFを取得してすべて読むのがベストと思いますが、UMTPでは差分だけ日本語で説明してくれています。
UMLの問題点は日本語化された資料が整っていないことのようです。

https://umtp-japan.org/section-modeling/4792

# UMLを学ぶ

UMLの学習方法ですが、仕様書ではイメージが付かないと思うので以下の記事がとても分かりやすいです。

https://qiita.com/devopsCoordinator/items/7d460008177b318129ea

# クラス図を書く

クラス図の書き方と説明は以下のサイトがとても分かりやすいです。

https://cacoo.com/ja/blog/how-to-write-class-diagram/
React Hook Form フォームの中身をreset

# フォームの中身をReset
フォームの中身を全部、もしくは一部のみreset(空)の状態にすることを学習したのでアウトプット。
*学習メモです。
*すべて[ドキュメント](https://react-hook-form.com/api/useform/reset)に載っています

React Hook Form v7

## 全てをReset
reset関数の引数を何も指定することで、全てresetすることができます！

```tsx:Form.tsx
import React from "react";
import { useForm } from "react-hook-form";

interface UseFormInputs {
  mailAddress: string
  password: string
}

export default function Form() {
  const { register, handleSubmit, reset } = useForm<UseFormInputs>();
  const onSubmit = (data: UseFormInputs) => {
    reset()　// <= 引数0だとすべてをreset
  };

  return (
    <div>
      <h1>リセット試す用のフォームです</h1>
      <form onSubmit={handleSubmit(onSubmit)}>
        <input 
            autoComplete="email"
            type="email"
            aria-invalid={errors.mailAddress ? "true" : "false"}
            {...register("mailAddress", { required: true, pattern: /^([a-zA-Z0-9])+([a-zA-Z0-9\._+-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/ })}
            placeholder="メールアドレスを入力してください"
        />
        <input
          autoComplete="password"
          type="password"
          {...register("passWord", { required: true, pattern: /^[a-z\d]{1,100}$/i })}
          aria-invalid={errors.passWord ? "true" : "false"}
          placeholder="パスワードを入力してください"
          css={FormInput}
        />
        <input type="submit" />
      </form>
  </div>
  );
}
```

## 一部をReset
フォームの一部先ほどのフォームの例でいうと、メールアドレスだけをリセットさせたい場合もあると思います。

### resetで引数を指定
`reset`にて`register`で指定した`name属性`を`reset`の第一引数で`name属性`と`value`をセットすると一部のリセットを可能とします。

```tsx:Form.tsx
import React from "react";
import { useForm } from "react-hook-form";

interface UseFormInputs {
  mailAddress: string
  password: string
}

export default function Form() {
  const { register, handleSubmit, reset } = useForm<UseFormInputs>();
  const onSubmit = (data: UseFormInputs) => {
    reset({ mailAddress: '' })　//<= mailAddressをリセットする。
  };

  return (
    <div>
      <h1>リセット試す用のフォームです</h1>
      <form onSubmit={handleSubmit(onSubmit)}>
        <input 
            autoComplete="email"
            type="email"
            {...register("mailAddress", { required: true, pattern: /^([a-zA-Z0-9])+([a-zA-Z0-9\._+-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/ })}
            placeholder="メールアドレスを入力してください"
        />
        <input
          autoComplete="password"
          type="password"
          {...register("passWord", { required: true, pattern: /^[a-z\d]{1,100}$/i })}
          placeholder="パスワードを入力してください"
        />
        <input type="submit" />
      </form>
  </div>
  );
}
```

## おわりに
めっちゃ短いアウトプットにはなりましたが学習メモなのでよしと思っておきます。
他にもresetする方法はあると思われるのですが
例）`Event.target.value = ''`

React Hook Formが用意されているresetでするのがいいのかなと思っています。

## 参考文献
[React Hook Form ドキュメント](https://react-hook-form.com/)
[React Hook Form ドキュメント　api#reset](https://react-hook-form.com/jp/v6/api#reset)
【jquery】リセットボタンを押下した後、プルダウンを先頭に戻す方法

#html

```html
<select id="pulldown">
  <option value="0">プルダウン</option>
  <option value="1">プルダウン１</option>
  <option value="2">プルダウン２</option>
</select>
```


#jQuery 

```javascript
    $('#pulldown').prop("selectedIndex", 0);
```
bulma とflask_mailを使ってメール送信


https://qiita.com/im02kai/items/4a7f1957f2a2b993d1ea
からのつづき

#前回のファイルを書き換え
```html 
<form method="POST" action="/sendmail" id="mailform">
```

#インストール
pip install flask
pip install flask_mail


#app.pyをつくり

```python:app.py
from flask import Flask
app = Flask(__name__)

@app.route("/")
def hello():
    return "Hello World!"

if __name__ == "__main__":
    app.run( port=8000, debug=True)
```


#flask_mailを定義
sakura internetのSMTPサーバーを使う場合で
sample@sample.sakura.ne.jp　から　sample@gmail.comに送るとして

```python:app.py
from flask_mail import Mail, Message

app.config.update(dict(
MAIL_SERVER = 'sample.sakura.ne.jp',
MAIL_PORT = 587,
MAIL_USE_TLS = True,
MAIL_USE_SSL = False,　#Trueだとエラー
MAIL_USERNAME = 'sample@sample.sakura.ne.jp',
MAIL_PASSWORD = 'password'))
```

#POSTを受け取りメール送信
改行は'\r\n'です

```python:app.py
mail = Mail(app)
@app.route('/sendmail', methods=['POST'])
def process_email():
    mailbody = request.form['body']
    usrmail = request.form['email']
    #エラー処理
  
    msg= Message('subject', sender='sample@sample.sakura.ne.jp',recipients=['sample@gmail.com'])
    msg.body= mailbody+'\r\n'+usrmail
    mail.send(msg)
    return "thankyou"
```
bulmaで、レスポンシブルかつ最低限必要なページを作成する


#動機
webアプリに必要なビデオやジャイロを許可する前段階のタイトル画面が必要になり
簡単に作る方法を探していたところ、bulma.cssが見つかりました。
cssだけで作られているので、学習コストが低くそうなので使ってみました。

#最低限必要な項目
タイトル
概要
スタートボタン
問合せ

https://bulma.io/

#テンプレート
https://bulmatemplates.github.io/bulma-templates/templates/hello-parallax.html　
を文言等を適宜変え

#スクリプト 
問合せは、formタグとname属性つければ送信できます

```html:hello-parallax.html
<form method="POST" action="/sendmail.php" id="mailform">
<div class="column is-6">
 <div class="field">
              <label class="label">Email</label>
              <div class="control">
                <input id="email"  name="email" class="input is-medium" type="email" >
              </div>
            </div>
</div>

    <div class="field">
              <label class="label">内容</label>
              <div class="control">
                <textarea id="mailbody" name="body"　class="textarea" placeholder=""></textarea>
              </div>
            </div>
           
            <br>
            <div class="field is-grouped">
              <div class="control">
                <button id="submit" class="button is-white is-rounded is-outlined">Submit</button>
              </div>
            </div>
          </div>
 </form>
```

#ウインドウ幅を狭くすると、問合せのマージンがなくなってしまったので対処

```css:hello-parallax.css
body {
  background: rgb(48, 48, 48);
}

.cta {
  height: 800px;
  border-top: 10px solid rgb(48, 48, 48);
  margin-left: 25px;
  margin-right: 25px;
}
```

![gif](https://user-images.githubusercontent.com/45844502/128837220-45701e33-e7b5-409e-b56f-ef72c359ea77.gif)

つづき
https://qiita.com/im02kai/items/4a7e4f974b65a0af171d
MAMPを使ってローカル環境を複数作ってみる - ポート番号でアクセスするよ

https://qiita.com/mrd-takahashi/items/075540f357155888a51e

これの後を書こうと思って早5年。
仕事じゃないので後回しになるのは仕方ないよねー。最近まったく触ってないし。
と言いつつも、ちょっと試したいことがあるので、そのついでに覚書を残すことにした。

本来、複数のローカル環境を作る時は、hostsの書き換えまでを行いますが、瞬間的に必要になった時はやや面倒くさい。
例えば、PGがギブアップしたWebページのレイアウト崩れを調査した場合、最悪30分以内にローカル環境が不要になることもある。

モットーは「**面倒くさい、嗚呼面倒くさい。できるなら手っ取り早くやりたいよ**」なので、正統な方法から横道に逸れがちです。

というわけで、**hostsを書き換えず、任意のポート番号**でアクセスできるようにします。

#環境
+ macOS Catalina(10.15.7)
+ [MAMP](https://www.mamp.info/) 6.3(最新ver.6.4 2021/08/09現在)

記事を書いては放置していたので、最新のMAMPはver6.4になっていたorz
念のため最新バージョンのリリースノートを調べてみる(無駄な仕事が増えたw)。

##MAMP ver.6.4
https://twitter.com/mamp_en/status/1410575797660930051?s=20

参照：[Release notes (Mac) - MAMP & MAMP PRO](https://www.mamp.info/en/release-notes/mac/)

+ Big Sur(11.3)への最適化
+ ユニバーサルアプリケーション(IntelまたはM1プロセッサを搭載したMacでネイティブに実行)

今回の記事には関係ないので、アップデートせずにver6.3の環境のままにすることにします。
そして、わからなくなったらドキュメントにかえれ →[MAMP (macOS) Documentation](https://documentation.mamp.info/en/MAMP-Mac/)

#MAMPでバーチャルホストの設定をする
まず、バーチャルホスト設定の参照先が無効になってるので有効化。

```Apache:/Applications/MAMP/conf/apache/httpd.conf--605行
# Virtual hosts
#Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf
```
↓

```Apache:/Applications/MAMP/conf/apache/httpd.conf--605行
# Virtual hosts
Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf
```
その後、バーチャルホスト設定をします。
書き方のサンプルがあるので、それに沿って設定を書けば簡単。

```Apache:/Applications/MAMP/conf/apache/extra/httpd-vhosts.conf--28行
<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host.example.com
    DocumentRoot "/Applications/MAMP/Library/docs/dummy-host.example.com"
    ServerName dummy-host.example.com
    ServerAlias www.dummy-host.example.com
    ErrorLog "logs/dummy-host.example.com-error_log"
    CustomLog "logs/dummy-host.example.com-access_log" common
</VirtualHost>
```

今回は「**手っ取り早く**」動かすので、1項目以外使いませんw

ポート番号が重複すると他のツールが使えなくなる場合もあるので、利用する番号は49152-65535 (DYNAMIC AND/OR PRIVATE PORT) の間で選択します。
参考：Wikipedia｜[ポート (コンピュータネットワーク)](https://ja.wikipedia.org/wiki/%E3%83%9D%E3%83%BC%E3%83%88_(%E3%82%B3%E3%83%B3%E3%83%94%E3%83%A5%E3%83%BC%E3%82%BF%E3%83%8D%E3%83%83%E3%83%88%E3%83%AF%E3%83%BC%E3%82%AF))

今回はポートを```50000```を使用、ホームフォルダ内に```document```フォルダを作ります。
書き方は```Listen```と```VirtualHost```を**50000**とし、```DocumentRoot```にドキュメントルート**/Users/[AccountName]/document**を記載します。
フォルダ名**document**は任意の名前でOK。もう一階層掘っても良いし、その辺りはお好きにどうぞ。

```Apache:/Applications/MAMP/conf/apache/extra/httpd-vhosts.conf--45行以降
Listen 50000
<VirtualHost *:50000>
    DocumentRoot "/Users/[AccountName]/document"
</VirtualHost>
```

あとはMAMPを起動すれば、ポートでアクセスできるローカル環境のできあがり。
[http://localhost:50000]()でアクセス。
```/Users/[AccountName]/document```にデーターを放り込んで、コーディングや確認に使います。
Wordpressもインストールできますが、それはまた今度。

hostsを書き換えないので、ローカル環境を作るほどポート番号が増えて行きますが、瞬間的に必要とか、1人プロジェクトでhostsを書き換えるのが面倒な場合は使える方法かと。
でも、長期的にローカル環境として使うのであれば、hostsの書き換えはしたほうがいいと思います。
TypeScriptのデコレータエラー

###Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option in your 'tsconfig' or 'jsconfig' to remove this warning.というエラーが出たときの対処したこと

tsconfigかjsconfigの中にあるexperimentalDecoratorsを設定して。と言われていますね。そのため、tsconfig.jsonの中の

```
"experimentalDecorators": true,  
```
のコメントアウトを解除しました。
しかし、エラーが消えません。そこで、私がしたことをお伝えします。

####VScodeを設定する

・設定→ワークスペースの`JS/TS Inplicit Project Config: Experimental Decorators`にチェックを入れる→再起動

![スクリーンショット (53).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1789530/a1739f5c-3902-9bcd-4794-add776663c59.png)

検索欄にexperimentと入力すると出てきます。

ちなみに、tsconfig.jsonにあるallowJsやemitDecoratorMetadataのコメントアウトを外して有効にするという記事もあったのですが、調べてみたところ、allowJSは、jsファイルやjsxファイルのコンパイルを可能にする設定、emitDecoratorMetadataはmetadataを使えるようにするための設定とあったので、関係ないのかなと思ってしまいました。（初学者すぎるので違うかもしれません。）
【PHP】IDを採番し直すやり方

```PHP
<?php

$rows = [
    0 => [ 'id' => 89, 'language' => 'PHP'],
    1 => [ 'id' => 23, 'language' => 'Java'],
    2 => [ 'id' => 11, 'language' => 'VBA' ],
    3 => [ 'id' => 17, 'language' => 'Ruby' ]
];


$i = 0;
foreach ($rows as  $row) {
    $data[] = [
        'id' => $i,
        'language' => $row['language']
    ];
    $i++;
}

var_dump($data);

?>
```
Unity: VSCodeでF12の関数ジャンプが使えない場合の解法


## F12で関数ジャンプできない問題

VSCodeで関数ジャンプをする際に，関数の文字列に対してF12を押すと `No definition found for` というようなエラーが出て参照できない時がありました．

結構調べて何とか解決方法を見つけたので解説します．

## テストした環境

- Unity 2019.4.24 / 2020.3.10
- Microsoft VS Code 1.59.0

色々試した結果，バージョン関わらず　**小さいプロジェクトの場合は，なぜか F12 でのジャンプはできなさそう**． わかる方いたらお知らせください．

## 解決方法

### 1. 問題点を探る

まず，VSCodeでエラーを吐いている可能性があるので， `View -> Output` を押し，`OmniSharp Log`のタブを選択して，エラーを見ます（バージョンなどによって場所が違うので少し注意）

![FnPVSCode.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1771055/ea9f0a10-4861-7587-8739-22f199ad1241.png)


すると，自分の場合は以下のように　「`.NETFrameworkNETFrameworkv4.7.1` のフレームワークが見つからないのでhttps://aka.ms/msbuild/developerpacks からダウンロードしろ」と言われます．


```
Error: The reference assemblies for .NETFramework,Version=v4.7.1 were not found. To resolve this, install the Developer Pack (SDK/Targeting Pack) for this framework version or retarget your application. You can download .NET Framework Developer Packs at https://aka.ms/msbuild/developerpacks
```

### 2. .NETFrameworkNETFrameworkv4.7.1をダウンロード & インストール


ということで https://aka.ms/msbuild/developerpacks のページで4.7.1と検索し，そこのリンク（自分の場合は，[.NETFrameworkNETFrameworkv4.7.1](https://dotnet.microsoft.com/download/dotnet-framework/net471) ）のリンクへと行き，「Download .NETFrameworkNETFrameworkv4.7.1 Developer Pack」をクリックしダウンロードしました．

### 3. プロジェクトやエディタの設定ファイル的なものを削除

VSCodeとUnityを閉じた後，プロジェクトのフォルダにある　`.vscode/`, `.csproj`, `.sln` 関連のファイルやフォルダ（UnityやVSCode起動時に勝手に生成される）をとりあえず消し，再度起動をします．

### 4. Unity Attach Debuggerを選択する

`Ctrl + Shift + P` で `Unity Attach Debugger`が選択されているのを確認。選択されてない場合は，「許可する」ボタンが出るので許可をする。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1771055/5449c3b0-3bb6-e458-aa41-ea12f33b365a.png)



すると無事に，F12で関数ジャンプができました～

### X. これでも解決できない場合

- プラグイン, 「C#」が入っていることを確認
- Unityのプロジェクトで `Edit > Preferences`を選択し，`External Tools`の`External Script Editor`が`Visual Studio Code`になっていることを確認．
- Unityの `Assets > Open C# Project` を選択し、VSCodeを開き直す。
- 一応 `.vscode/`, `.csproj`, `.sln` 関連のファイルなどを逐一削除して確認

VSCodeとUnityの相性どんだけ悪いねん..


### 余談

`Ctrl + Shift + F12` を押すと，以下のようにジャンプはせずに詳細を見ることも可能です．

![F12_extra.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1771055/6f4264bd-04a3-82c4-25bb-1b011ea31280.png)

関数ジャンプ後，`Alt + -` を押すとUndo(Navigate Backwards), `Alt + +` を押すとRedo(Navigate Forwards) ができます．

## 参考

- [Unity2018.3以降でVSCodeが使えない（.Net 4.xにてアセンブリが読み込まれない）](https://qiita.com/Densyakun/items/42515bb3e5e8b1b8cb7f)
- [UnityでVSCodeを使用中、関数ジャンプや参照ができない！の解決方法](https://qiita.com/tkw0129/items/0bb9a51fda460d0c36b3)
- [VSCode + Unityでインテリセンスが効かない時の対処方法](https://tamilabo.com/2020/11/25/vscode-unity-intellisense/)
- [VSCodeでなるべくマウスを使わない開発環境をがんばる](https://qiita.com/y-tsutsu/items/cfe89c0168f40a8fb353)


## 最後に
ぜひ、フォローよろしくお願いいたします！

- [Twitterアカウント](https://twitter.com/supertask_jp)
- [YouTubeアカウント](https://www.youtube.com/c/TasukuTAKAHASHI)
Jenkinsのblue oceanプラグインは素人向けっぽいのに素人には辛かった話

# 概要
jenkinsの公式プラグインであるBlue Ocean。
ユーザーフレンドリーな感じで、私みたいな素人に良さそうだったのですが、結局使えなかったという話です。
とりあえず普通のから使ったほうが良さそうです。


# 良かったところ

- 公式だけあってインストールの資料や紹介がしっかりしている。

https://www.jenkins.io/doc/book/blueocean/getting-started/

https://cloudbees.techmatrix.jp/blog/first-time-blue-ocean/

https://www.jenkins.io/projects/blueocean/

- 見た目がきれいで使いやすい。こんな感じのパイプラインがGUIで直観的に作れる。後から見てもやっている内容が分かりやすい。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1017728/9f9fa5aa-0b8f-ef40-6fee-8db5c09a4721.png)



 
# 辛かったところ

- 非対応のプラグインが結構ある様子。自分が使おうとした機能でぶつかるので、きつい。
    - MSBUild (これはコマンドラインを実行すればよいだけはあるが。)
    - Warnings Next Generation（為すすべなし）
  
  https://github.com/jenkinsci/pipeline-plugin/blob/master/COMPATIBILITY.md


- 検索しても情報があんまり見つからない。Jenkinsを使う最大のメリットを失う。

- githubと簡単に連携できるのだが、その分パイプラインをちょっと変えて試すたびにプッシュされていく。まじか。試したいだけだったんですけど。

  ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1017728/bb71b144-96e3-5aa5-fe80-544acef40e6d.png)

- 2019年くらいから死んだとか言われている。。。まじか。だったら、もっと目立たないところに置いといてほしい。

> This analysis led us to conclude that Blue Ocean is a great way to work with Jenkins Pipelines but that it’s not the best way to achieve the larger goal of overhauling the entire Jenkins user experience. 

 https://groups.google.com/g/jenkinsci-users/c/rOjXIB-pkQ8/m/V1FC4d5aCAAJ

> PS: The Blue Ocean project is dead, but the folks over at Cloudbees are currently in the process of overhauling the UX. They just released a weekly version where they got rid of all tables so the design is slowly becoming more and more responsive, and also a new set of icons is also coming up. 

 https://stackoverflow.com/questions/64833590/best-practices-for-installing-jenkins-instance-pre-configured-jenkins-from-scr
[Flutter] Android外部ストレージのファイル一覧を取ろうとしたらディレクトリしか取れない

原因は実行時のパーミッション不足で、分かってみたら当然なんだけど、ググったときに事例が見つからずちょっとハマったので、メモとして残すことにしました。

####ディレクトリ内のファイル一覧の取得
```dart
        Directory pDir = Directory(_target);
        var plist = pDir.listSync();
        for( var p in plist ){
          print( p.path );
        }
```
ファイル一覧の取得にはDirectoryクラスのlistSync()とかlist()メソッドを使います。_targetには対象ディレクトリの名前が入ります。AndroidManifest.xmlには外部ストレージのアクセス許可のため、次の記述を入れてあります。

```xml
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
```

ここで _target="/storage/emulated/0/DCIM"; と外部ストレージの名前を入れて実行してみると、次のようになりました。

```
I/flutter ( 9998): /storage/emulated/0/DCIM/mei
I/flutter ( 9998): /storage/emulated/0/DCIM/Camera
I/flutter ( 9998): /storage/emulated/0/DCIM/.thumbnails
I/flutter ( 9998): /storage/emulated/0/DCIM/LINE
I/flutter ( 9998): /storage/emulated/0/DCIM/Facebook
```

Fileアプリで確認すると、このディレクトリにはもっといろいろ入ってるのですが、plistには格納されません。表示されているのは全部ディレクトリです。"/storage/emulated/0/DCIM"の代わりに"/"を指定すると、以下のように明らかにパーミッションの例外を起こしますが、これは中途半端でもアクセスできているのでパーミッションの問題ではないと思い込んでしまいました。

```
W/1.ui    ( 9998): type=1400 audit(0.0:2766): avc: denied { read } for name="/" dev="dm-4" ino=2 scontext=u:r:untrusted_app:s0:c134,c257,c512,c768 tcontext=u:object_r:rootfs:s0 tclass=dir permissive=0 app=com.example.filer_permission
```

####実行時にアプリに権限を与える
結論から言うと、実行時にユーザーに明示的に指定してもらわないとパーミッションが取得できないという、いまどき当たり前の話でした。昔はAndroidManifest.xmlに書くだけでよかったんだけどねぇ。

設定のアプリ情報でターゲットアプリの設定を開くと「権限が付与されていません」と表示されるので、そこをクリックして必要な権限を付与します。
![Screenshot_20210810-172202.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/114010/898f9f87-5fd1-d253-0ec6-9479d76ab3cc.png)
「メディアへのアクセスのみを許可」を選択して戻ります。
![Screenshot_20210810-172220.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/114010/77e655c9-01a4-c6c0-9d46-6e4639cd6f5b.png)

再度実行すると、今度はファイル一覧にいろいろ入っています。

```
I/flutter (14631): /storage/emulated/0/DCIM/IMG_00000001.jpg
I/flutter (14631): /storage/emulated/0/DCIM/IMG_00000002.jpg
I/flutter (14631): /storage/emulated/0/DCIM/IMG_00000003.jpg
I/flutter (14631): /storage/emulated/0/DCIM/IMG_00000004.jpg
I/flutter (14631): /storage/emulated/0/DCIM/saturdaynight.mp3
I/flutter (14631): /storage/emulated/0/DCIM/Skrillex.mp3
I/flutter (14631): /storage/emulated/0/DCIM/PCM.wav
I/flutter (14631): /storage/emulated/0/DCIM/type3_14.25kbps.amr
I/flutter (14631): /storage/emulated/0/DCIM/type5_18.25kbps.amr
I/flutter (14631): /storage/emulated/0/DCIM/type6_19.85kbps.amr
I/flutter (14631): /storage/emulated/0/DCIM/type7_23.05kbps.amr
I/flutter (14631): /storage/emulated/0/DCIM/type8_23.85kbps.amr
I/flutter (14631): /storage/emulated/0/DCIM/mei
I/flutter (14631): /storage/emulated/0/DCIM/Camera
I/flutter (14631): /storage/emulated/0/DCIM/.thumbnails
I/flutter (14631): /storage/emulated/0/DCIM/LINE
I/flutter (14631): /storage/emulated/0/DCIM/Facebook
```

以下のように実行時に必要な権限がないときの処理をするライブラリもあるようですが、baseflow.comというライブラリに依存していて、セットアップがいろいろ面倒で、プログラム構造も変わってしまうので、しばらくは手動で対処。

https://pub.dev/packages/permission_handler
centos間 ssh 接続及び scp でファイル転送

centos間でssh接続したい。
バージョンは何でもOKだと思うが、今回はcentos7と8。

#条件

windows → centos のssh接続(鍵認証)ができている


centos サーバー
163.xxx.xxx.xxx (接続元)
133.xxx.xxx.xxx (接続先)


今回は 163 から 133 にssh接続（鍵認証）する

#まずはSSH接続できるように

・windows側

Rlogin の SSH認証鍵 より どの id_rsa を使用しているか確認し、
上記ファイルをテキストで開いて中身をコピー。

・centos側 163.xxx.xxx.xxx (接続元)

上記コピーしたのを id_rsa ファイルを作成し貼り付け。
パーミッションも変更しておく。

```
vim id_rsa
chmod 600 id_rsa
```

さぁ、接続してみよう

ssh -i [鍵ファイル] [ユーザー名][接続先IP] で接続


```
ssh -i id_rsa hideki@133.xxx.xxx.xxx
```


:::note info
ここまででSSH接続OK
:::

# SCPでファイルを転送

上記完了していたら、あとは簡単。

1つのファイルを転送

```

scp -i id_rsa /home/hideki/hoge.txt hideki@133.xxx.xxx.xxx:/home/hideki/hoge.txt

```

パーミッションを維持しつつフォルダごと転送

```

scp -i id_rsa -pr /home/hideki/hoge hideki@133.xxx.xxx.xxx:/home/hideki/hoge

```

:::note info
SCPでファイルを転送もOK
:::

# 圧縮して転送

転送するのに時間かかるから、圧縮したいよね

アーカイブする場合は、絶対パスは使わず相対パスを使う。
（展開したときに絶対パスで展開されちゃうらしい）


まずはhogeフォルダを圧縮
(パーミッション等を保持)

```

tar cvzfp bup.tar.gz hoge

```

そして転送

```

scp -i id_rsa -pr /home/hideki/bup.tar.gz hideki@133.xxx.xxx.xxx:/home/hideki/bup.tar.gz

```

つづいて解凍

```

tar xvzfp bup.tar.gz

```
Azure AD B2CでTOTPを使ってMFA認証をするときにハマったお話


👇のサイトを参考にして作っていて自分がはまった内容を残しておきます。  
参考：https://aadojo.alterbooth.com/entry/2020/12/19/110000?utm_source=feed  
とても分かりやすく手順が書いてあるので大変参考になりました。

## カスタムポリシーがアップロードできない？

SignUpOrSignin.xmlだけアップロードできなくて悩みました。

エラー内容

```
Validation failed: 1 validation error(s) found in policy "B2C_1A_TOTP_SIGNUP_SIGNIN" of tenant "{{your tenant}}.onmicrosoft.com".プロファイル 'AppFactor-VerifyTotpWebHook' のメタデータにキー 'ServiceUrl' が含まれています。このキーの URL は空か、無効な形式 '{Settings:VerifyAPI}' です。プロファイル 'AppFactor-VerifyTotpWebHook' のメタデータにキー 'ServiceUrl' が含まれています。このキーの URL は空か、無効な形式 '{Settings:VerifyAPI}' です。
```

### 原因

VerifyAPIで検索してTrustFrameworkExtensions.xmlを見ると、  
👇のパラメータのSettings:VerifyAPIが書き換わってなかったです。

```xml
<Item Key="ServiceUrl">{Settings:VerifyAPI}</Item>
```

appsettings.jsonをみると、👇になっておりただの誤字だったみたいです。

```json
"VelfiyAPI": "{{url}}"
```

### 解決策

正しいパラメータ名にしてもう一度 B2C Policy Buildをすることで解決しました。

## AzureADB2Cでサインアップしてユーザーを追加できたがなんかエラーでた

```
Sorry, but we're having trouble signing you in.  We track these errors automatically, but if the problem persists feel free to contact us. In the meantime, please try again.
```

- カスタムポリシーなんかおかしいっぽい？
- functionsの設定がおかしいっぽい？

### 原因1

appsettings.jsonで _VerifyAPI_, _GenerateAPI_を記述したが、functionsのベースエンドポイントをしていた

#### 解決策1

各関数のエンドポイントを記述しないといけないんじゃないか？と気づいたので試してみた。

### 原因2

functionsのアプリケーション設定不足。

#### 解決策2

local.settings.jsonに記載されてる情報にあるものを設定する

### まとめ

無事Google Authenticatorから認証できるようになった。
divrem と fldmod の違い

# divrem

divrem(x, y, r::RoundingMode=RoundToZero)

div(x, y, r) と rem(x, y, r) をタプルで返す。

```Julia
x, y = -1123.4, 56.7
divrem(x, y)            # (-19.0, -46.10000000000004)
div(x, y)               # -19.0
rem(x, y)               # -46.10000000000004
```

# fldmod

fldmod(x, y)

floor(x / y) === fld(x, y) と mod(x, y) をタプルで返す。
divrem(x, y, RoundDown) と同じ。

```Julia
x, y = -1123.4, 56.7
fldmod(x, y)            # (-20.0, 10.599999999999966)
divrem(x, y)            # (-19.0, -46.10000000000004)
divrem(x, y, RoundDown) # (-20.0, 10.599999999999966)
floor(x / y)            # -20.0
fld(x, y)               # -20.0
mod(x, y)               # 10.599999999999966
```

RoundingMode には以下を指定できる

- RoundNearest (default)
- RoundNearestTiesAway
- RoundNearestTiesUp
- RoundToZero
- RoundFromZero (BigFloat only)
- RoundUp
- RoundDown
UnidentifiedImageError: cannot identify image file　の解決方法について

#はじめに

kerasで画像認識をしている中、GoogleColaboratoryからjyupiter labに変更し、実行しようとしたときに発生しました。
調べても具体的な解決方法がなかったので私が解決した際に行ったことを記載しようと思います。

#原因と解決
どうやら学習用に用意した画像をちゃんと認識できていないようなので、pythonの組み込み関数であるopenを使用して一度開いてみればよさそう。
開けない画像は編集するなり削除すれば解決しそう。

#実際に使ったコード
いくつかラベルを用意しているため、各ラベル一気にできるようにしました。
今回は数が少なかったため、コードを実行しエラーが出たら該当ファイルを編集で済みましたが、数が多いならエラー構文を使って読み込めないファイルを全てピックアップすればいいかと。

```py
import glob

dirs = ["フォルダ名"]

for dir_name in dirs:
    for file in glob.glob(dir_name + "/*.jpg"):
        file_data = open(file, "r")
        file_data.close()
```

#対処法
どうやらjpgファイルに透明度情報が付与されていることが問題だったようで透明度情報を削除すれば解決しました。

具体的には右クリックで編集、名前を付けて保存を選択すると、拡張子が変わっているのでjpg形式に直し保存すると直りました。

使用した訓練用画像はネット上から取得したもので、jpg形式で保存しましたが、透明度情報が付与されたpng形式のファイルを無理矢理jpg形式で保存したことが原因？なのかなと思います。

#おわりに
Qiitaへの投稿は初めてで、pythonの経験も浅いため拙い点が多いかもしれませんがご容赦ください。
Apache→Tomcatの連携をSELinuxが阻んでいた話

# 結論
SELinuxの有効設定をpermissive(アクセス制御は無効だが警告メッセージを表示する)に変更したらApache→Tomcatで連携できるようになった

# はじめに
オンラインアプリ開発経験はあるのですが、サーバ構築経験のほぼない初心者のため、四苦八苦しています。
初心者のただのメモですが、もし同じことで詰まる人のために記事にします。

# 環境
サーバ：RHEL8.2 AWS AMIから作成
Apache 2.4.37
Tomcat 9.0.39
社内プロキシ経由でネットに接続できる環境のため、下記を設定してyumインストールしています

セキュリティグループのアウトバウンド設定に社内プロキシのポートを設定
/etc/yum.conf にProxy設定を追加
[社内Proxyに阻まれていろいろ捗らない人のためのTips](https://qiita.com/sachioksg/items/289e40d69382b1d09811) 様を参考に設定しています

# やりたいこと
Apache → Tomcat は http での接続
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1846218/8a1bc04e-a382-f4ab-f363-7a7cda0f7988.png)

この、http接続で失敗する・・・

# 実施した内容
① Apache側に下記を設定

```/etc/httpd/conf.d/mod_proxy.conf
ProxyRequests Off
ProxyPass /  http://(APサーバのIP):8080/
ProxyPassReverse / http://(APサーバのIP):8080/
```
② Tomcat側に下記を設定

```/opt/tomcat/conf/server.xml
  <Service name="Catalina">

    <Connector port="8080"
               maxThreads="4002"
               minSpareThreads="200"
               connectionTimeout="30000"
               keepAliveTimeout="500000"
               processorCache="200"
               secure="false"
               protocol="HTTP/1.1"
               enableLookups="false"
               useBodyEncodingForURI="false"
               address="0.0.0.0"  />
```

これでApacheにアクセスしたらTomcatデフォルト画面が開かれるはずなのに、503エラーとなる。。。

# 調査
* /var/log/httpd/error_log を確認

```/var/log/httpd/error_log
[proxy:error] [pid 17063:tid 140642893367040] (13)Permission denied: AH00957: HTTP: attempt to connect to (APサーバのIP):8080 ((APサーバのIP)) failed
```

Permission denied とは・・・？
こちらのエラーで検索してヒットした、[こちらのサイト](http://www.hiihah.info/index.php?Linux%EF%BC%9ACentOS6%E3%81%A7mod_proxy%E3%81%8C%E5%8B%95%E3%81%8B%E3%81%AA%E3%81%84) 様に答えがありました。

* /var/log/audit/audit.log を確認したところ、同じエラーが出ている・・・！！

```/var/log/audit/audit.log
type=AVC msg=audit(1628573323.280:1221): avc:  denied  { name_connect } for  pid=17063 comm="httpd" dest=8080 scontext=system_u:system_r:httpd_t:s0 tcontext=system_u:object_r:http_cache_port_t:s0 tclass=tcp_socket permissive=0
```

* SELinuxの設定確認
[【ざっくりと理解する】SELinuxとは？](https://eng-entrance.com/linux-selinux) 様を参考に、ステータスを確認

```
# getenforce
```

→ 「Enforcing」が返ってきた・・・！これが原因か・・・！

* SELinuxの設定変更

```
setenforce 0
```

でpermissiveモード(アクセス制御は無効だが警告メッセージを表示する) に設定。
こちらを設定したことで、Apache⇔Tomcat の連携ができるようになりました！！

こちらは一時的な設定のため、「vi /etc/selinux/config」の設定修正も忘れずやりました。

# 感想
SELinux という単語を初めて知りました。。。
こんなところでアクセス制限をしているんですね。。勉強になりました。
引き続き頑張ります。
Storyboardを使わずにコードで画面を生成する


##はじめに
ストーリーボードを使わないアプリの設定方法を忘れてしまうので忘備録を作成

##環境
Xcode Version 12.5.1 (12E507)
##手順
###1.アプリのDeployment Infoの設定
![スクリーンショット 2021-08-10 16.34.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/918084/d0c3a3a5-4b50-db35-7764-4c4e099a42b2.png)

Main Interfaceの”Main”の文字を削除


###2.Info.plistのApplication Scene Manifestを項目ごと削除

![スクリーンショット 2021-08-10 16.45.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/918084/5992c8a6-2c74-29aa-ce82-a9d3115e291f.png)

選択して項目ごと削除

###3.不要なファイルの削除
SceneDelegate.swiftとMain.Storyboardは使わないので左のNavigatorから削除
※SceneDelegate.swiftは全文コメントアウトでも可

###4.AppDelegate.swiftの編集



```AppDelegate.swift
import UIKit

@main
class AppDelegate: UIResponder, UIApplicationDelegate {
    
    //①プロパティを宣言
    var window: UIWindow?

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {

        
        //②ViewControllerのClassをrootViewControllerに設定して表示する
        let window = UIWindow(frame: UIScreen.main.bounds)
        self.window = window
        window.makeKeyAndVisible()
        window.rootViewController = ViewController()

        //NavigationBarを使う場合
        //window.rootViewController = UINavigationController(rootViewController: ViewController())
        
        return true
    }

    // MARK: UISceneSession Lifecycle
    
    //③ 初めからある以下２つのメソッドをコメントアウト
//
//    func application(_ application: UIApplication, configurationForConnecting connectingSceneSession: UISceneSession, options: UIScene.ConnectionOptions) -> UISceneConfiguration {
//        // Called when a new scene session is being created.
//        // Use this method to select a configuration to create the new scene with.
//        return UISceneConfiguration(name: "Default Configuration", sessionRole: connectingSceneSession.role)
//    }
//
//    func application(_ application: UIApplication, didDiscardSceneSessions sceneSessions: Set<UISceneSession>) {
//        // Called when the user discards a scene session.
//        // If any sessions were discarded while the application was not running, this will be called shortly after application:didFinishLaunchingWithOptions.
//        // Use this method to release any resources that were specific to the discarded scenes, as they will not return.
//    }

}
```

上記のように編集
①windowプロパティの宣言
②ViewControllerのClassをrootViewControllerに設定して表示する
③２つのメソッドをコメントアウト



##参考にさせていただきました
https://www.youtube.com/watch?v=KaqoP8hmc3I
[VRChat] ステータス・インスタンスの関係を表で表してみた

# ステータス・インスタンスの関係

表で表したものがパッと見つからなかったのでメモ。フレンドのステータスとフレンドがいるインスタンスの制限の場合分け。

補足: インスタンス作成者とフレンドの場合はインスタンス作成者にフォーカスしてます。

## joinできるか

### インスタンス作成者とフレンドの場合

×はReq inviteが表示はされますが自動リジェクトされます。

＼|青|緑|オレンジ|赤
-|-|-|-|-
Public|Join|Join|Req|×
Friends+|Join|Join|Req|×
Friends|Join|Join|Req|×
Invite+|Req|Req|Req|×
Invite|Req|Req|Req|×

### インスタンス作成者とフレンドじゃない場合

＼|青|緑|オレンジ|赤
-|-|-|-|-
Public|Join|Join|Req|×
Friends+|Join|Join|Req|×
Friends|×|×|×|×
Invite+|Req|Req|Req|×
Invite|×|×|×|×

## ワールドが見えるか

### インスタンス作成者とフレンドの場合

＼|青|緑|オレンジ|赤
-|-|-|-|-
Public|Visible|Visible|Private|Private
Friends+|Visible|Visible|Private|Private
Friends|Visible|Visible|Private|Private
Invite+|Private|Private|Private|Private
Invite|Private|Private|Private|Private

### インスタンス作成者とフレンドじゃない場合

＼|青|緑|オレンジ|赤
-|-|-|-|-
Public|Visible|Visible|Private|Private
Friends+|Visible|Visible|Private|Private
Friends|Private|Private|Private|Private
Invite+|Private|Private|Private|Private
Invite|Private|Private|Private|Private

## 参考にさせていただいた記事

VRChatにおける、ステータス・インスタンスによるアレコレ by リクルスさん
https://note.com/rikurus/n/n015f50232a1f

内容が間違ってたらぜひ教えてください。
で、出たーw PL2303と思ったらPL23C3奴www

Prolific PL2303 の USB-Serial 変換ケーブルだと思って Linux マシンに接続しても `/dev/ttyUSB0` に紐付けられない、なんていうことを今年に入って経験しました。具体的には [UGREEN](https://www.ugreen.com) 社の [USB 2.0 to RS232 DB9 Serial Flat Cable](https://www.ugreen.com/products/usb-2-0-to-rs232-db9-serial-flat-cable) なのですが、`lsusb` コマンドで見てみますとね。

```shell-session
% lsusb
Bus 002 Device 003: ID 067b:23c3 Prolific Technology, Inc.
```

あら〜。2303 でなく 23C3 ですのね〜、という。ちゃんと Prolific 社のサイトにも [PL23C3 の製品ページ](http://www.prolific.com.tw/JP/ShowProduct.aspx?p_id=387&pcid=126) がある。こんなときどのようにすれば OS にこの製品を USB-Serical Controller として認識していただけるか、ということについて述べていきましょう。

まずは `usbserial` モジュールを読み込みます。OS インストール後のデフォルト設定では usbserial は読み込むように設定されていないでしょう。

```shell-session
% sudo modprobe usbserial
```

`usbserial` モジュールが読み込まれた状態で `/sys/bus/usb-serial/drivers/generic/new_id` にベンダ ID とプロダクト ID をスペースを間に入れて組み合わせて記載すると `generic` ドライバで接続された機器を利用することができるようになります。`/sys/bus/usb-serial/drivers/pl2303/new_id` の方がいいのかしらね。要確認です。

```shell-session
% sudo sh -c 'echo "067b 23c3" > /sys/bus/usb-serial/drivers/generic/new_id'
```

こうするだけで (既に接続されているならば) カーネルのリングバッファには以下のように出力されます。

```shell-session
usb 2-1.2: New USB device found, idVendor=067b, idProduct=23c3, bcdDevice= 3.05
usb 2-1.2: New USB device strings: Mfr=1, Product=2, SerialNumber=3
usb 2-1.2: Product: USB-Serial Controller
usb 2-1.2: Manufacturer: Prolific Technology Inc.
usb 2-1.2: SerialNumber: DIBXf103Y23
usbserial_generic 2-1.2:1.0: The "generic" usb-serial driver is only for testing and one-off prototypes.
usbserial_generic 2-1.2:1.0: Tell linux-usb@vger.kernel.org to add your device to a proper driver.
usbserial_generic 2-1.2:1.0: generic converter detected
```

さて、認識されてもパーミッションとグループの設定が適切に行われていないと `cu` コマンドなどで接続するときに `Permission Denied` と怒られてしまうので、`/etc/udev/rules.d/` 以下にルールファイルを作成します。ファイル名は末尾が `.rules` で終わりさえすればあとは適当な名前で構いません。

```shell-session
% sudo sh -c 'echo "KERNEL==\"ttyUSB*\", ATTRS{idVendor}==\"067b\", ATTRS{idProduct}==\"23c3\", GROUP=\"uucp\", MODE=\"0666\"" > /etc/udev/rules.d/60-usb-serial-devices.rules'
% cat /etc/udev/rules.d/60-usb-serial-devices.rules
KERNEL=="ttyUSB*", ATTRS{idVendor}=="067b", ATTRS{idProduct}=="23c3", GROUP="uucp", MODE="0666"
```

無理に 1 コマンドで実現しようとするとこういうエスケープだらけの美しくないコマンドになってしまいますが気にしない (気にしろ) 。`cu` コマンドは Ubuntu であれば名前の通りの `cu` パッケージに含まれているので、`cu` コマンドがまだインストールされていなければ `sudo apt install cu` で。インストールしたら、以下のコマンドを実行してみましょう。

```shell-session
% cu --parity=none --nostop --line /dev/ttyUSB0 --speed 9600 dir
Connected.

catalyst> enable
Password:
catalyst# exit
```

あら素敵。`cu` コマンドで接続した対話から抜けるときは `~.` と入力します。see man cu (1) です。
Slackでおやすみモードをオフにする

<h2>確認環境</h2>
<ul>デスクトップ 環境<li>macOS Monterey（version 12.6）</li><li>Slack（version 4.29.149）</li></ul>
<ul>iPhone 環境<li>iOS 14.7.1</li><li>Slack（version 21.07.20）</li></ul>
<h2>設定手順（デスクトップ編）</h2><ol><li>Slackアプリ画面右上の自分のアイコンを左クリックする。
表示される一覧の「通知を一時停止する」にカーソルを当てる。
[ <b>次の時間をおやすみモードにする...</b> ] の一覧で「通知スケジュールを設定する」を選択する。

![2021081001_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/678855/02c86ada-4647-2ed2-c611-abe311f5f9d4.png)
</li>
<li>「環境設定」の「通知」の項目が表示される。
「通知スケジュール」の [ <b>通知を許可</b> ] を
「毎日」「00:00」から「真夜中」に設定する。

![20221202.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/678855/300b326d-8766-2f9a-6eb3-0ab07d8122e0.png)
</li>
<h2>設定手順（iPhone編）</h2><ol><li>Slackアプリ画面右下の「あなた」アイコンを選択する。
表示された一覧の中から「通知」を選択する。

![1_1.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/678855/23641e40-6da2-4b5d-f024-e77a8b884df8.png)</li>
<li>「通知」画面の中から「通知スケジュール」を選択する。

![2_1.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/678855/4c045ee3-05c0-e07b-c98e-9ffdd4fac19e.png)</li>
<li>[ <b>通知を許可</b> ] を「毎日」にし、開始時間と終了時間を入力する。
※iPhone版アプリでは終了時間に「真夜中」の選択肢がない。そのため、通知がオフとなる時間帯ができてしまう。（例えば、以下の画像の場合、23:59-24:00 の1分間通知がオフになる。）

![3_1.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/678855/655060a3-ef20-ed6b-72ad-b7a1dac8e377.png)</li></ol>
Proxy環境下でGitHubにSSHでgit pushする用の.ssh/config (Windows/Linux)

# TL;DR
・SSH Key Pair生成済み
・GitHubにSSH Public Key登録済み
・↑ のときにProxy環境から接続するための`.ssh/config`

# .ssh/config

### Windows用

`config`の置き場所 : `C:\Users\<ユーザ名>\.ssh\`

``` shell:.ssh/config
Host github.com
    HostName github.com
    IdentityFile <SSH Private Keyのpath，"/c/xxx/ssh-key.private" とか>
    ProxyCommand connect.exe -H <proxy host>:<proxy port> %h %p
```

### Linux(Ubuntu)用

`config`の置き場所 : `~/.ssh/`

``` shell:.ssh/config
Host github.com
    HostName github.com
    IdentityFile <SSH Private Keyのpath，"~/xxx/ssh-key.private" とか>
    ProxyCommand nc -X connect -x <proxy host>:<proxy port> %h %p
```


# おわり
忘れがちなのと，Proxy通す場合の書き方のググラビリティが低いのでメモ

---///
DOM要素の幅を境界で変えられるようにする【JavaScript】

## したいこと
Flexで並べた要素の間に境界を設置して、そこをドラッグすることでそれぞれの幅を変えられるようにする。
例えるならVSCodeの分割ウィンドウみたいな感じ。

## コード
### HTML
````HTML
<div id="wrapper">
  <div id="one"></div>
  <div id="two"></div>
</div>
````

###CSS
````css
#wrapper {
  display: flex;
  height: 200px;
  width: 300px;
}
#one, #two {
  height: 100%;
}
```

###JavaScript
````javascript
window.onload = () => {
    let parent = document.getElementById("wrapper");
    colResizeable(parent, 300);
};

let colResizeable = (element, options) => {
    let {totalWidth, borderWidth, borderColor, postProcess} = {
        totalWidth: element.clientWidth,
        borderWidth: 10,
        borderColor: "#ddd",
        postProcess: () => {},
        ...options
    }

    let w1;
    let p1;

    // setup
    let children = Array.prototype.filter.call((element.childNodes), (e) => e.nodeName != "#text");
    let child1 = children[0];
    let child2 = children[1];
    children.forEach((e) => { e.style.width = (totalWidth - borderWidth) / 2 + "px" });

    // insert border between children
    let border = document.createElement("div");
    let borderStyle = {
        width: borderWidth + "px",
        backgroundColor: borderColor,
        cursor: "col-resize"
    }
    Object.keys(borderStyle).forEach((key) => { border.style[key] = borderStyle[key] });
    element.insertBefore(border, child1.nextSibling);

    let resizeChildren = (event) => {
        let w2 = Math.min(Math.max(0, w1 + event.pageX - p1), totalWidth - borderWidth);
        child1.style.width = w2 + "px";
        child2.style.width = totalWidth - w2 - borderWidth + "px";
    };

    border.addEventListener("mousedown", (event) => {
        w1 = Number(/.*?(?=px)/.exec(child1.style.width));
        p1 = event.pageX;

        element.addEventListener("mousemove", resizeChildren);
    });
    window.addEventListener("mouseup", () => {
        element.removeEventListener("mousemove", resizeChildren)
        postProcess;
    });
}

````
##ポイント
https://qiita.com/NoSuke23/items/54df05a61568246166b4#%E3%83%9D%E3%82%A4%E3%83%B3%E3%83%88

- Array.prototype.filter.call((element.childNodes), (e) => e.nodeName != "#text")で空のテキスト要素を弾ける
- ドラッグはmousedownしたときのカーソルの座標とmousemoveのときの座標の相対値を取る
- 面積の小さい要素を動かすときはwindow.addEventListener("mouseup", func)がおすすめ
Macのggplotで日本語が文字化けする場合の解消方法

## MacのRStudioでggplotのグラフが文字化けする問題

- Rのエンコーディング問題といっても、以下のように色々種類がある
    1. スクリプト自体の文字化け
    2. データの文字化け
    3. グラフでの文字化け
        - 標準グラフ
        - ggplotのグラフ
- 本記事は3.グラフの文字化けの解消方法に関してのメモ
- Macでggplotを利用すると日本語が```□□□□```のように文字化けするケースの解消方法について

## 解消方法
### ggplotの文字化け解消方法
以下のように、theme_setでMac用のフォント（HiraKakuProN-W3）を指定してからggplotで作図する。

例）

```R
theme_set( theme_bw(base_family = "HiraKakuProN-W3")) 

d %>%
  ggplot() +
  geom_line(aes(x = 年月, y = ユニークUU))

```

### （おまけ）標準グラフの文字化け解消方法

ggplotではなく、標準グラフの場合は、parで指定。

例）

```R
par(family = "HiraKakuProN-W3")

boxplot(iris$Sepal.Length,main = "箱ひげ図")

```

以上。

## ひとこと
- ググると山ほど情報でてくるが、参考に載せたの2つのまとめは非常にわかりやすかった
- 調べるのちょっと手間取ったので誰かの助けになれば

## 参考
https://datasciencehenomiti.com/post-545/

https://shohei-doi.github.io/quant_polisci/encoding-r.html
JLCPCBの発注方法（プリント基板）日本語


https://www.youtube.com/watch?v=Qs53wecmFGQ&t=13s

発注方法

JLCPCBに注文するのは簡単です。

https://jlcpcb.com/JPA

次の手順はJLPCBの簡単な発注方法が示されています。
 
１：新規登録とログイン。アカウントをお持ちになった場合、ログインしてください。

２：ホームページには、発注ページに移動すると、見積もり計算機が表示されます。見積もり計算機では、PCBのサイズ（寸法）、枚数、層、板材の厚みを入力するだけです。

発注ページhttps://cart.jlcpcb.com/quoteに直接アクセスして注文することもできます。

３：ボード（基板）の詳細をオンライン価格計算ツールに入力して価格を取得します（最も安いオプションは、5枚、2層、PCBサイズ<= 10cmx10cmの場合は2ドルです）。

４：「ガーバーファイルの追加」をクリックしてファイルをアップロードします。ご参考までに、弊社はあらゆる正しい形式で、利用可能な最も人気のある回路設計プログラムに関する”ガーバーファイルを生成する方法”というガイドを作成しました。 （他のすべてのPCBと区別するために、弊社はPCBに非常に小さなカスタマーIDを追加することになるので、ご注意ください。また、特定の場所に入れる場合は、デザインに「JLCJLCJLCJLC」というテキストを追加して、この場所をお示しください。詳細な手順については、”ここをクリックしてください”。）

弊社のシステムは、ガーバーファイルを自動的に分析し、ガーバーファイルをアップロードすると、ボードのサイズ（寸法）と層は検出できます。

５： [ガーバービューア]をクリックしてデザインを確認します。問題が検出されたら、ガーバーファイルを注意深くご確認ください。問題がない場合は、[カートに保存]をクリックしてお続けください。

６：[新しいアイテムの追加]をクリックし、発注のPCBごとに4〜6回を繰り返して見てください。

７：カートでは、各アイテムを展開して詳細を表示できます。

８：すべてのPCBをカートに入れたら、[安全にチェックアウト]ボタンをクリックします。

９：チェックアウトページに配送先を追加すると、国によって配送料金が決まります。配送方法はアドレスの下にあります。 DHLの配達は約3-5日かかります（3-4日の製造時間を含まない）、Airmailは15-25日かかります。
 
１０：お支払い方法は2種類あります。

・支払前の事前検査
確認ファイルレビューが承認された上、支払うことができます。お客様のデザインは、弊社がお支払いを受け取るまで生産は始まりません。ご確認の上、結果をメールでお知らせいたします。配達の遅れを避けるために、ファイル監査が合格した場合、すぐにお支払いください。監査で失敗した発注は自動的にキャンセルとなります。

・直接支払(おすすめ)
生産の高効率を確保するために、ファイルレビューの前に支払うことをお勧めいたします。ご確認の上、ファイルの製造許可が得られない場合は、全額払い戻しをお受けいたします。

１１：発注の支払いが成功した場合、できるだけ早く制作を手配します。その間、[アカウント]メニューに発注ステータスを確認できます。
【書籍紹介】SCRUM MASTER THE BOOK


こんにちは、株式会社GxPの伊藤です。
今回書籍紹介で「[SCRUM MASTER THE BOOK](https://www.shoeisha.co.jp/book/detail/9784798166858)」を読んだので紹介させていただきます。
書籍自体は昨年出版されたものですが、この本はスクラムマスターとしてどんなことをしたら良いのかや、スクラムマスターが持つべきマインドセットについて書いてあり、いつ読んでもためになると思います。

# こんな人におすすめ
スクラムマスターを目指している人や、アジャイル開発を引っ張っていく立場でうまくいかず困っている方向けです。
アジャイル開発のプラクティスなどについて詳しく説明されておりませんので、アジャイル開発についての知識は持っているが、どうやって回していけば良いか困っているという人向けな本だと思います。
また、「[SCRUM MASTER THE BOOK](https://www.shoeisha.co.jp/book/detail/9784798166858)」は「[SCRUM BOOT CAMP THE BOOK](https://www.shoeisha.co.jp/book/detail/9784798163680)」と対になっています。アジャイル開発について学びたいという方は、まずは「SCRUM BOOT CAMP THE BOOK」から読んでみてください。書籍間で関連があるわけではないので、もちろん片方だけ読んでも問題ないです。
# 内容

スザナ・ショコバさんが執筆した本の日本語訳になります。スクラムマスターとしてどうあるべきか、アジャイル開発をやる上で起こる困難に対してどのように対処すれば良いのかや、スクラムマスターとして持つべきマインドセットなどが紹介してあります。項目ごとに短くまとまっているので短時間で読めると思います。また、自分の状況によって読んだときの気づきや学びが変わってくると思うので時間が経ってから読み直してみると前回読んだときとは違う感想になってくると思います。

# 良いと思った点
個人的に良いなと思った点を一部紹介します。
## ポジティブさ
個人的に書いてある中で一番良いなと思いました。チームにポジティブな人が一人でもいるだけでチームの雰囲気ってすごい変わると思うんですよね。大変なときでも一緒に頑張ろうと一言言ってくれる人がいるだけでチームの雰囲気がすごい良くなると思います。そんな一言を言えるスクラムマスターだと良いですね。

## 変化を成功させるための８つのステップ
> 大まかにいうと次のような手順です。まず、変化する領域を定めます。次に何をすべきかを決め、それを実現します。そして最後に変化を定着させます。

変化を成功に導くプロセスについて説明されています。アジャイルでは改善を行っていきますが、スクラムマスターとしてどのような順番で変化を成功に導いていけば良いのかということが説明されています。8つのステップに分けて説明されていますが、変化を定着させるためにはどれも欠かすことができない要素だなと思いました。
８つのステップの中で私が良いなと思った点をを一つ挙げると**理解と了承**です。どれだけ良い変化だとしても、それを行うチームメンバーに理解をしてもらわないと実行して定着してもらえませんよね。理解を得られるまで根気強く接していく必要があります。人を変えるということはそれほどのエネルギーが必要ということでとても大事なことだと思いました。

##スクラムマスターのメタスキル
>メタスキルとはある状況において意図的に取る態度、考え方、スタンスのこと

この章では６つの最も重要なメタスキルが紹介され、それぞれ状況に合わせて適切に使い分けて下さいと説明されています。私がその中で気に入ったのは**遊び心**です。何事も楽しく行う、楽しむことができるというのはスクラムマスターだけではなく仕事をする上で大事な能力ではないのかなと思っています。簡単なことでも楽しんでやれるかどうかで仕事の効率や質も変わってくると思っているので良いメタスキルだなと思いました。
挙げられた６つのメタスキルは私もどれも重要だと思いましたし、私もチーム活動の中で大切にしているものでした。このような自分で無意識に行っていることでも再認識することで、スキルをより効果的に利用できるようになると思います。残りは何が挙げられているかはご自身で確認してみて下さい。

# 終わり
今回私が挙げた点以外にもスクラムマスターの役割を兼務したときの問題点や、チームの状況によって何をしたら良いのかということが書いてあったりして非常に示唆に富んでいると思います。
スクラムマスターを目指す方や、スクラムマスターを目指さなくてもエンジニアとして普遍的に使えるマインドセットについて書いてあるので興味を持ったら読んでみてください。
[シリーズ (更新予定)] EFK (Elasticsearch + Fluentd + Kibana) の構築


# はじめに

職場[^1] で「CI/CD ログ」や「CLI および Webアプリログ」の収集と可視化の導入の話が出てきた.
また、自宅で K8s の学習をする中で Fluentd という単語が頻繁に出てきていた.

そこで自宅の Ubuntu 18.04 マシンで docker-compose を用いて、
下図・下表のような Elasticsearch + Fluentd + Kibana (EFK) 環境を構築して検証し、
これらソフトの知見を得ることにした.

本シリーズでは次の内容について記している.

**・docker-compose を用いた EFK (Elasticsearch + Fluentd + Kibana) の構築**

|コンテンツ|使用時期|
|:--|:--|
|[[01] EFK (Elasticsearch + Fluentd + Kibana) の構築 ... Elasticsearch の基本概念の把握](https://qiita.com/robozushi10/items/cfbfc998b545563707b2)|2021/08|
|[[02] EFK (Elasticsearch + Fluentd + Kibana) の構築 ... Dockerコンテナの立ち上げ(説明なし)](https://qiita.com/robozushi10/items/9cf4cbdbad613cff4f72)|2021/08|
|[[03] EFK (Elasticsearch + Fluentd + Kibana) の構築 ... Dockerコンテナの立ち上げ(説明あり)](https://qiita.com/robozushi10/items/f6082044fbf2d583c801)|2021/08|
　

[^1]: オンプレ環境での組込み機器開発向け DevOps 業務
【Sentry】表示する言語設定を変更しつつタイムゾーン設定をUTCからJSTに変更する


# ユーザーごとで設定できる

プロジェクトごとに設定するもんかと思ってプロジェクトの設定を探してたんですがどうやらユーザーごとに設定できるようです。

# 設定場所

## 1. アカウント設定画面へ移動

左メニューのプロジェクトとアカウント名が表示されている部分をクリックするとメニューが展開され、「**User settings**」というリンクが出てくるのでそこからアカウント設定画面へ移動する

![スクリーンショット 2021-08-10 16.04.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/85815/7189d123-f0ab-00c4-b4d7-b0e59d0c72c7.png)


## ２. 「**Account Details**」の画面を表示

「**Account Details**」に移動すると、表示する際の言語設定（**Language**）とタイムゾーン設定（**Timezone**）の項目があるのでここを変更する
![68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f38353831352f30326538303566642d633436652d366635652d616634382d6436323737343038383933662e706e67.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/85815/0ffa1042-fee8-b1af-565c-6ccab2760690.png)
Ubuntu 20.04でMx Master3のキーバインドを変更する

# はじめに
ubuntu ではlogicool optionが提供されていないので、以前はeasy strokeを使ってマウスのキーバインドを変更していた
ubuntu20.04にUpdateしたら、easy strokeでマウスボタンにキーバインドを設定する機能がうまく動かなかったので、別の方法をさがした

# 結論 logiopsを入れる
https://github.com/PixlOne/logiops

``` bash
sudo apt install cmake libevdev-dev libudev-dev libconfig++-dev
git clone git@github.com:PixlOne/logiops.git
cd logiops
mkdir build
cd build
cmake ..
make
sudo make install
```
これでインストールできる

# 設定ファイルの書き方
サンプルはgitのリポジトリにある
https://github.com/PixlOne/logiops/blob/master/logid.example.cfg

今回はマウスホイールのクリックにF3キーを割当たかったので以下の感じ

```json:/etc/logid.cfg
devices: (
{
    name: "Wireless Mouse MX Master 3";
    buttons: (
        {
            # Wheel press
            cid: 0x52;
            action =
            {
                type: "Keypress";
                keys: ["KEY_F3"];
            };
        }
    );
}
);
```

### その他

cid は以下のコマンドで調べられる（どのボタンがどのcidかは分からなかったので、実際に設定してみて動きを見た）

```bash
$ sudo logid -v DEBUG

[DEBUG] Unsupported device /dev/hidraw0 ignored
[INFO] Device found: Wireless Mouse MX Master 3 on /dev/hidraw1:255
[DEBUG] /dev/hidraw1:255 remappable buttons:
[DEBUG] CID  | reprog? | fn key? | mouse key? | gesture support?
[DEBUG] 0x50 |         |         | YES        | 
[DEBUG] 0x51 |         |         | YES        | 
[DEBUG] 0x52 | YES     |         | YES        | YES
[DEBUG] 0x53 | YES     |         | YES        | YES
[DEBUG] 0x56 | YES     |         | YES        | YES
[DEBUG] 0xc3 | YES     |         | YES        | YES
[DEBUG] 0xc4 | YES     |         | YES        | YES
[DEBUG] 0xd7 | YES     |         |            | YES
[DEBUG] Thumb wheel detected (0x2150), capabilities:
[DEBUG] timestamp | touch | proximity | single tap
[DEBUG] YES       | YES   | YES       | YES       
[DEBUG] Thumb wheel resolution: native (18), diverted (120)

```

ちなみにMX Master3のcidは以下

```
wheel Press: 0x52;
Back Button: 0x53;
Forward Button: 0x56;
Gesture Button: 0xc3;
Toggle SmartShift: 0xc4;
```