OmniAICreator/Qiita-1.07M huggingface dataset:
plunkerでopenplayer.js

#概要

plunkerでopenplayer.jsやってみた。

#参考にしたページ


https://qiita.com/mehdi/items/3197e053c780e9ffc610

#MP4

https://embed.plnkr.co/plunk/CwPbAgguNPuMX7bA

https://embed.plnkr.co/plunk/Ffn0g8MOwQRv9HfI

#HLS

https://embed.plnkr.co/plunk/3MJXI0BqOq32Tkx2

#DASH

https://embed.plnkr.co/plunk/rVnQc6vQIhPBXuWI

#WEBM

https://embed.plnkr.co/plunk/XM388GgQqXlIsS93


以上。
59日後にITパスポートを受けるFラン私大文系既卒(模擬試験結果)

# 模擬試験結果
一応2週目が終わったので模擬テストをしてみた
![スクリーンショット (1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1787362/532e7c4c-5f71-f8dd-f975-9a46f648e523.png)

合格点だった。わーい。
OS や開発言語の〇〇PATHって何よ？　②コマンドサーチパス登場

# 前回のお話

* コンピュータは融通が利かない
* コンピュータの操作の対象、やることは常に一つ！！「真〇は常に一つ!!」
* 名前空間は超便利 
* ディレクトリ、フォルダも名前空間の側面をもつ

# PATHのお話

さて、ディレクトリ、フォルダも名前空間のエッセンスを持っていることを理解したところで、今回はOSがどうやって、コマンドを呼び出すのか。という話に移っていきます。

## 前提の環境

|No.|前提事項|備考|
|--|--|--|
|1.|Operating System|Posix系 OS|

いったん、話を見通しやすいようにPosix系 OSを前提にお話してきますが、Window考え方は同じです。



## プログラムの実行

では、「python」を例に、プログラムを実行してみましょう。

```terminal
> python
```

さて、前回のお話によって、ディレクトリは「名前スペース」として働き、同名のファイルを可能となりました。これはとても良いことに思えます。さて、このコマンドは正しく実行されるでしょうか？

### 課題

さて、コマンドを実行する前に、ディレクトリで名前スペースを分けることの「課題」をお話しますプログラムただのファイルですから、前述の通り、ディレクトリさへ違っていれば、同名のプログラムを保持することは可能です。たとえば下図のように、3つのPythonファイルがシステム上に存在するとします。すると、一つの問題が生じます。 **単純に`python`と呼び出しても、OSからは「どのpythonを実行していいのかわからない」** のです。 また単に`python`といわれも、コンピュータはpythonを自分で探すことができないのです。


![PATH.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/837176/cd2546cb-db96-2df5-c7a7-5bb6b1378f4f.png)

### 解決策

さて、この問題を解決するには、 **プログラムを格納場所込みの、「場所」+「名前」** で呼べばいいのです。図ではそれぞれ

```

$ /usr/bin/python
$ /usr/lib/python/bin/python
$ /home/shupe/python/bin/pytyon

```

いずれかで明示的に実行します。これなら、1つに特定できるからです。（コンピュータはなんでも疑いの余地なく、解釈が1つになるようにしてあげなければいけません。)
また、このように**名前区間＋名前**として対象を指定する場合、一般には **フルパス** と呼ばれます。PATHは「通り道」ぐらいの意味で、文字通り、対象に到達するまでの「通り道」を表します。また、この**対象の場所＋対象の名前**は、**FQDN** と言われることもあるので、「おんなじことだな」と理解すればよいです。

無事、目的のプログラムを呼び出せるようになりました。ただ、この方法だと常にファイルシステム上のフルパスを使って呼び出す必要があります。これは以下の点で非効率です。

* 常に長いプログラム名を覚えて使いまわなくてはいけない
* 環境によってフルパスは変わるので（バージョン情報とかパスに持ってたり）、プログラムの中からプログラムを呼びだすような場合の「可搬性」が悪化する。
  
二点目が特に重要です。たとえばこういうケースです。

```bash
#!/bin/bash

/usr/lib/python/bin/python <python プログラム>

```

この`/usr/lib/python/bin/python`は環境によって変化します。どこか別のパソコンに持っていくたびに、このフルパスは書き直さなければいけません。しかもプログラムの中からプログラムを呼ぶのは、割と普通にあって、このままだと、**利用するPC毎にプログラムを大量に書き換える必要が出てきます。** 大問題です。この問題を解決するのに導入されたのが**コマンドサーチパス**です。いわゆる**PATH**のことです。いよいよコマンドサーチパスが登場しましたが、長くなるのでここまでとします。次回はコマンドサーチパスと、組み立てパスの話をしたいと思います。

# まとめ

* プログラムを実行する場合、疑いの余地なく一意に決まる方法=フルパス/FQDNで呼ぶ必要があるよ。
* フルパスでの呼び方は、可搬性に劣るので、そのままだと問題ありありだよ。
* そこで、コマンドサーチパスの概念を導入するよ。
Java参照実装ってなに？

### 経緯

Glassfishを初めて触って、

>GlassfishはJavaEEの参照実装である。

の記載に？？となったので、

今回は備忘録的に参照実装について書いていく。

:::note warn
あくまで、調べた結果僕が感じた感想です。
:::

### 参照実装ってなに？

参照実装またはリファレンス実装と呼ばれる。

JSR (Java Specification Request)という仕様を具体的に実装したサンプルとなる実装のこと。(?)

先に述べたGlassfishであれば
**JavaEEのサンプル真似てます、インターフェース仕様はJavaEEに則っています**ってことですね。

それのなにがメリットか？

中身がどうであれ、**同等の動きを保証します！！**ということにつながります。

なので、`Servlet API `であれば、`Tomcat`だろうが、`Glassfish`だろうが同じ動きをするってことなんだな。

### おわりに

という、なんとも自己完結しかしていない内容だが、今回はこれで良しとする。ww

規約とかルールってすげーなーー

### 参考サイト

https://atmarkit.itmedia.co.jp/bbs/phpBB/viewtopic.php?topic=350&forum=12
https://qiita.com/opengl-8080/items/aeda0d8bad42af3113bd
arduinoでRGB LED その2

#概要

arduinoでRGB LEDやってみた。

#参考にしたページ

https://qiita.com/caa45040/items/091f589dec81fbfbe3fb

#サンプルコード

```
int l[30]; 
int b8[8] = {
	0b10000000,
	0b01000000,
	0b00100000,
	0b00010000,
	0b00001000,
	0b00000100,
	0b00000010,
	0b00000001,
};

#define on1		 	0b00100000
#define off1		0b00000000

void bit_off() {
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
}
void bit_on() {
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = on1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
	PORTB = off1;
}

void setup() {
	pinMode(13, OUTPUT);
}
void loop() {
	int on_off;
	int i;
	int  j;
	for (i = 0; i < 27; i++)
	{
		l[i] = random(32);
	}
	for (i = 0; i < 27; i++)
	{
		for (j = 0; j < 8; j++)
		{
			on_off = l[i] & b8[j];
			if (on_off == 0)
			{
				bit_off();
			}
			else
			{
				bit_on();
			}
		}
	}
	delay(100);
}





```


以上。
[paiza]スキルチェック見本問題 Java「配列の最大値」「配列の最小値」

<h2>初めに</h2>
今回、見本問題の２問に挑戦しました。
配列を使っての最大値、最小値の取り出しです。

<h2>配列の最大値</h2>

https://paiza.jp/works/mondai/array_utilization_primer/array_utilization_primer__max

```
配列 A の要素数 N と配列 A の各要素である整数 
A_1, A_2, ..., A_N が与えられるので、
配列 A の要素の最大値 max を求めてください。
```

<h2>解答コード</h2>
```java:
import java.util.*;

public class Main {

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

        int n = sc.nextInt();

        int[] a = new int[n];
        for (int i = 0; i < n; i++) {
            a[i] = sc.nextInt();
        }

        int max = 0;
        for (int x : a) {
            if (max < x) {
                max = x;
            }
        }

        System.out.println(max);
    }
}

```

<h4>配列を使わないで最大値取り出し</h4>

```java:
import java.util.*;


public class Main {
    public static void main(String[] args) {
        Scanner sc = new Scanner(System.in);
        int n = sc.nextInt();
        int max = 0;
        for(int i=0; i<n; i++){
           int k = sc.nextInt();
           if(k>=max){
               max=k;
           }
        }
        System.out.println(max);
    }
}
```

以下の記事でのやり方と同じです。

https://qiita.com/ki_87/items/0f402223e746d0c3acd8

<h2>配列の最小値</h2>

https://paiza.jp/works/mondai/array_utilization_primer/array_utilization_primer__min

<h2>解答コード</h2>

```java:
import java.util.*;


public class Main {
    public static void main(String[] args) {
        // 自分の得意な言語で
        // Let's チャレンジ！！
        Scanner sc = new Scanner(System.in);
        int n = sc.nextInt();
        int min =100;
        int[]a=new int[n];
        for(int i=0; i<n; i++){
            a[i]=sc.nextInt();
        }
        for(int x:a){
            if(x<min){
                min = x ;
            }
        }
        System.out.println(min);
    }
}
```
<h2>終わり</h2>
VB.netでActiveaReportsページレポートグループ化

VB.netでActiveaReportsページレポートグループ化個人的まとめ
社会人2年目で急遽.netを利用した帳票を使う必要が出たため備忘録代わりに…
ActiveaReportsの文献が非常に少ないので誰かの参考になれば幸いです

1.bandedlistかtableをレポートに追加
2.追加した項目上で右クリック
3.グループの挿入をクリック
4.式にグループ化の条件を入れる
※プルダウンから式を選択して、データセットなどを選択
グループ化条件を複数にする場合は項目同士を+でつなげる
例: =[項目名]+[項目名]
TaggerKitを使う

TaggerKitを使用してみた

SwiftでタグっぽいUIを実装したかったので```TaggerKit```を使ってみた
https://github.com/nekonora/TaggerKit

```swift
import TaggerKit
//タグを入れるためのViewを設定する
@IBOutlet weak var containerView: UIView!
@IBOutlet weak var containerView2: UIView!

.
.
.
//タグを実装するためのView
private var myTags:TKCollectionView!
private var allTags:TKCollectionView!
private var tagCollection = TKCollectionView()

//Mark LifeCycle
    override func viewDidLoad() {
        super.viewDidLoad()
        ｍｙTags = TKCollectionView(tags: ["タグ１","タグ２"],action: .removeTag,receiver: nil)
        allTags = TKCollectionView(tags: ["タグ3","タグ４"],action: .addTag,receiver: ｍｙTags)
        
        myTags.delegate = self
        allTags.delegate = self
        
        add(allTags,toView:  containerView)
        add(ｍｙTags,toView: containerView2)
        
        allTags.customBackgroundColor = 色
        productTags.customBackgroundColor = 色
        allTags.customTagBorderColor = 枠線の色
        allTags.customTagBorderWidth = 枠線の太さ
    }

 //Mark:TagDelegateMethod
    func tagIsBeingAdded(name: String?) {
       print(name)
    }
    
    func tagIsBeingRemoved(name: String?) {
       print(name)
    }
```

これで簡単にタグっぽいUIの作成を実装できる。
インフラオンチの俺がAWSを勉強した。

こんにちは！
今回はAWSについて


# AWSの簡単な概要
AWSとはAmazonWebServiceの略で、ネット通販で有名なアメリカのAmazonが提供している
クラウドサービスの総称です。


## まず俺はクラウドサービスが何かわかっていない
そもそもクラウドってなんやねんと。
クラウドはユーザーがサーバーやソフトウェアを持たなくても、
インターネットを通じてサービスを必要な時に必要な分だけ利用する考え方のことです。
あれやね、僕はお洋服が好きなのですがどの季節の服も買い過ぎてしまう傾向にあります。
なので、わざわざ夏に冬服をタンスにストックしておくと使わないし、邪魔になるんですよね。
それを服収納サービス（クラウド）に必要な時に必要な分だけストックしてもらってまんねん。
これのインターネットバージョンてことやんな。
こういう例えであってますかね？

そのクラウドを提供していることをクラウドサービスっていうですよね。

## クラウドサービスが普及する前は？？

クラウドサービスが登場する前までは、サーバーが必要な時は自社内に物理的なサーバー機器を用意するのが当たり前でした。この運用形態を「オンプレミス」と言います。
オンプレミスだとサーバー機器の費用と管理、機器なので設置スペースの確保も
必要になっていました。

それに比べてクラウドサービスなら機器の費用も管理も設置スペースの確保も不要です。
クラウドサービスに接続しさえすれば、すぐにでも必要なサーバーなどのリソースを確保することができちゃいます。

## AWSでできる特徴的なもの

オリアプを作成した時に、EC2とS3を利用しました。
なんで利用しようと思ったのかはわかりません。
カリキュラムに書いてあったから利用しようとしてみたとしか。。。

だからこそ、AWSについて調べたかったというのもあります。

### EC2
EC2はAmazon Elastic Compute Cloudの略称です。
AWS上に仮想サーバーを構築して自由に利用できるのが特徴です。
EC2を利用するメリットとしてあげられるのは、以下の3点です。

- 構築する時間の短縮
- 冗長化する手間がない
- スペックの変更に柔軟に対応できる

***構築する時間の短縮***

これは先ほど申し曲げた通り、オンプレミスを利用する方法と比べると、
クラウドサービスに接続しさえすればすぐにでも必要なリソースを確保できてしまうということです。

***冗長化する手間がない***

オンプレミスであれば、サーバー設計だけでなくインターネット設計の必要になりますが、
EC2ではネットワークを仮想ネットワークを構築するサービスが提供されており、
インスタンスと組み合わせることで簡単かつ短時間でサーバーの冗長化が実現できます。

インスタンスとはOSを載せた仮想サーバーのことで、複数作成して実行することができます。
アプリケーションサーバーとデータベースサーバーの合計2つが必要な場合は2つのインスタンスを作成して対応できます。

***スペックの変更に柔軟に対応できる***

オンプレミスのデメリットの一つとして挙げられるのが、ハードデスクやメモリ不足の対応が挙げられます。
データベースを長年利用していると、データを削除しない限りデータ容量が増え続けるのでハードディスクを増設するという対応が必要です。
一方、EC2ならハードデスクやメモリの増設を簡単に行うことが可能です。

自分のスマホのピクチャフォルダに写真を保存すると確かに、データを削除しない限りデータ容量が増え続けちゃうんですよね。
これをグーグルフォトを利用すると無料にもかかわらず、容量が無制限のサービスなので
容量なんて気にせず写真をパシャパシャと撮り続けることができたんですよね。

ちなみに2021年5月末終了でGoogleフォトの容量無制限が有料化になってました…
例えが悪かったようです。

## S3

S3はAmazon Simple Storage Serviceの略称です。
特徴としてはオブジェクトストレージサービスの１種であり、データ容量を気にせず保存することができる点です。
その場に応じて自由な使い道が想定され、より柔軟なデータ保存が実行できるのが特徴です。
業務全体で利用しているデータの容量が保存しきれなくなっている、豊富にデータを分析・　保管に使える
媒体が欲しいときにS3は力を発揮します。

### S3の特徴的なメリット

- 柔軟なストレージ機能
- 低コストによる運用が可能
- 耐久性と可用性の高さ

****柔軟なストレージ機能***

ストレージが自動的に拡張•縮小される為、事前に正確な計算をしておく必要がないし、
先行投資してリソースを確保する手間が省けます。

***低コストによる運用が可能***

S3は利用した分だけ請求がくるのでコストを意識した利用が可能です。
料金はストレージにおける実際に利用されている容量とデータ転送料金などを
参考にして割り出されます。
データが追加されてから料金が発生するのがいいね。

***耐久性と可用性の高さ***

S3はファンダイクもびっくりの高い守備力を要したシステムを構築しているため、ずっと使い続けることのできる耐久性と可用性を持っています。
障害やエラーなど様々な種類のFWから守られているので安心ですね。
これはちょい昔のレアル・マドリードの３トップ（クリスティアーノロナウド、ベイル、ベンゼマ）ですらも
牙城を崩すこともできなかったと言われています。
【Python】16進数を10進数に変えるプログラム！

　前回、以下のようなプログラムを作ったため、今回は16進数を10進数に変えるプログラムを作りました。

[整数→2進数](https://qiita.com/kim-shun/items/db4611e42d7ca7849124)
[整数→16進数](https://qiita.com/kim-shun/items/60af257ff54198dfcdbf)





```python
def change_decimal(hexa):
    nums = {'0':0,'1':1,'2':2,'3':3,'4':4,'5':5,'6':6,
            '7':7,'8':8,'9':9,'A':10,'B':11,
            'C':12,'D':13,'E':14,'F':15}
    n = len(hexa)
    sum = 0
    for i in range(n):
        num = nums[hexa[i].upper()] * (16**(n - 1))
        sum += num
        n -= 1
    return sum


try:
    hexa = input("16進数を入力してください(マイナス値が扱えません)：")
    result = change_decimal(hexa)
    print(result)
except KeyError:
    print('0～9の数字、A～Fの英字を半角で入力してください')

#Python標準機能の場合
print(int(hexa, 16))
```

　出力結果は以下のようになります。ひとまずマイナス値を扱わないやり方としました。マイナス値にも対応できるようなプログラムも今後は考えてみたいと思います。

```
16進数を入力してください(マイナス値が扱えません)：4f5
1269
```

ご意見いただけると非常に勉強になります。

<br>
自作のホームページを作成した

HTMLとCSSを使って、自分だけのホームページを作成しました。
プログラミングは去年から始まったばかりです。色々なインターネットで作り方を調べながら、趣味の小説書きをまとめて作成しました。
↓私のホームページです↓
http://boywritinganovel.xyz/syousetu/syousetukaki.html

PHPでお問い合わせフォームを作ろうと思ったが、なかなかうまく作れなかったです。PHPをインストールをしても正常に動かなかったです。原因はわからないまま静かに退きました。他にdjangoとJavascriptの勉強をしているが、HTMLとCSSと比べて全く異なるので、難しいです。慣れれば使い方がわかるようになると思います。自分の可能性を信じて、地道に頑張っていきたいです。
viewに枠線をつけるSwift

viewのあるほうこうにだけ枠線をつける方法

コピペで使える！！はず！

```swift
private func setupBorder(view:UIView) {
        let bottomBorder = CALayer()
        bottomBorder.frame = self.getCGrect(view: view,text:"buttom")
        bottomBorder.backgroundColor = 色設定
        view.layer.addSublayer(bottomBorder)
    }

private func getCGrect(view:UIView,text:String)->CGRect {
        switch text {
          case "bottom":
                return CGRect(x: 0, y: view.frame.height, width: view.frame.width, height: 1.0) 
          case "up":
                return CGRect(x: 0, y: 0, width: view.frame.width, height: 1.0) 
          case "right":
                return CGRect(x: view.frame.width, y: 0, width: 1.0, height: view.frame.height)
          case "left":
                return CGRect(x: 0, y: 0, width: 1.0, height: view.frame.height) 
          default:
            break
       }
    }
```
Javaプラクティス　シーザー暗号

#前書き
Javaで練習してみる。　FizzBuzzができればどんどん実践にという人もいるが
他にないかと思い提案します。
#javaの要素
・ファイル入出力
・ループ
・Javaが用意してくれているメソッドを使用
発展としてメソッド化してパラメータを変更できるようにする。
入力ファイルをもっと複雑にするなどが考えられる。
#前提知識 シーザー暗号
シーザー暗号を使う。以下Wikipediaによる説明
シーザー暗号は単一換字式暗号の一種であり、平文の各文字を辞書順で3文字分シフトして（ずらして）暗号文とする暗号である。古代ローマの軍事的指導者ガイウス・ユリウス・カエサル（英語読みでシーザー）が使用したことから、この名称がついた。

#前提知識 アルファベットからアスキーコードへの変換

```java
char c = 'A';
int code = c;
System.out.println(code);
結果が　65
```

#前提知識　ファイル　読み込み
https://www.javadrive.jp/start/stream/index1.html

#試作 その１
```java
AをBにしてみる。
char c = 'A';
int code = c;
int temp =  code + 1;
char b  = (char) (temp);
System.out.println((char) (temp));
結果が　B
```

#試作 その2
```java
ABC を　BCD にする
char c = 'A';
int code = c;
int temp =  code + 1;
char b  = (char) (temp);
System.out.println((char) (temp));
結果が　BCD
```
#試作 その3
文字列　Hello goodbyeを　辞書順で3文字分シフトしたのち
もう一度　復元する。

```java
String temp = "Hello goodbye";
		
	
char[] c = temp.toCharArray();
for (char ch: c) {
 char b  = (char) ((ch) +3);
 System.out.print(b);
}
結果が　Khoor#jrrge|h
        
String temp = "Khoor#jrrge|h";
			
char[] c = temp.toCharArray();
for (char ch: c) {
char b  = (char) ((ch) -3);
System.out.print(b);
}
結果がHello goodbye　

```
#本番 
##仕様
・ファイルから文字列を読み込むこと
・暗号文を復元すること　今回はシーザー暗号からの復元なので　辞書順で3文字分シフト
してあるものを復元するとする。

##実装例

```java
test.txt
Khoor#jrrge|h


public static void main(String[] args) {
		 try{
		      File file = new File("/Users/gina/Documents/gina
work/New/src/test/test.txt");
		      FileReader filereader = new FileReader(file);

		      int ch;
		      while((ch = filereader.read()) != -1){
		    	  System.out.print((char)(ch -3));
		      }

		      filereader.close();
		    }catch(FileNotFoundException e){
		      System.out.println(e);
		    }catch(IOException e){
		      System.out.println(e);
		    }
		  }
	}
結果がHello goodbye　
```
systemd-resolved の構成を図示してみる


# 概要

文章のみでは systemd-resolved が理解できなかったので図示してみた.


## 外部(WEB)に問合せに行くまでの経路

社内を想定しており、大別すると次の 2つである.

・<font color=#22b14c>緑線</font> ... リゾルバ (systemd-resolved の機能) を使う経路 (Ubuntu デフォルト)

・<font color=#ff0000>赤線</font> ... 内部 DNSサーバ (例: 開発チーム内限定) を使う経路


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1246056/974f54ff-f01b-c18d-1ea3-b81c05b9b7d9.png)


## 詳細

### リゾルバ (systemd-resolved の機能) を使う経路 (Ubuntu デフォルト)

・/etc/resolv.conf の実体が /run/systemd/resolve/stub-resolv.conf になっている.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1246056/b3299e68-12d5-35da-6492-789859ef6352.png)



### 内部 DNSサーバ (例: 開発チーム内限定) を使う経路

・/etc/resolv.conf の実体が /run/systemd/resolve/**resolv.conf** になっている.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1246056/8aab7f48-5e47-e5c2-83e7-a82d7a0bed7a.png)


　

## 参考にした情報

・https://qiita.com/shora_kujira16/items/31d09b373809a5a44ae5

・https://man.archlinux.org/man/systemd-resolved.8



以上.
PHPでかんたんな自作言語のコンパイラを書いた（移転済み）

以下に引っ越しました。

[https://zenn.dev/sonota88/articles/70016c47670df3](https://zenn.dev/sonota88/articles/70016c47670df3)

https://zenn.dev/sonota88/articles/70016c47670df3
完全無料でwordpressを利用してみた

###始めたきっかけ
　フルリモートでできるアルバイトを探していた時、プログラミング初心者でもできる案件としてwordpressを利用したサイト作成を紹介してもらったため、どんなものか試してみようと思った。

##wordpressを利用するのに必要なもの
- レンタルサーバー
- 独自ドメイン
- wordpressのテーマ
- wordpress本体

　wordpressにはorgとcomがあり、comはwixのようにウェブ上でサイトを作成できるがプラグインの利用には課金が必要なようだった。（筆者はこのあたりをろくに調べもせず始めたため色々と遠回りした）
　orgは、プラグインの導入や拡張性は高いが色々と準備が必要で面倒そう…どうやらレンタルサーバー上にwordpressをインストールして利用するようだ。このレンタルサーバーや独自ドメインの取得にお金がかかる場合が多いらしい。
　今回は本格的なサイト運営をするのが目的ではなく、無料でwordpressとはどういうものか触れればよいため、無料で利用できるレンタルサーバーと独自ドメインが取得できるものを探して使ってみようと思う。

[参考サイト](https://mixhost.jp/column/wordpress-free-homepage/#WordPress-2)
##無料レンタルサーバー
　無料レンタルサーバーも調べればいくつか出てくるが、wordpressとの連携可能なものを選ぼう。筆者は、[XFREE](https://www.xfree.ne.jp/)を利用することにした。
　登録を進めていくとサーバーIDの設定があるが、一度設定すると変更できないので慎重に決めよう。

###初期設定エラー：初期設定に失敗しました。が出たとき
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/175568/d4915185-d3f1-4cec-f5e2-f348384115ba.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/175568/877ae871-c406-364e-2823-ad28ba99c8b6.png)

　「初期設定エラー：初期設定に失敗しました。お手数ですが、再度お手続きください」というエラーが出て、時間が経っても利用を開始できなかった。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/175568/1b609c4c-c8f9-82ed-5dd3-5ac2dcf36558.png)

　調べてみると、PHP・MySQLサーバーの管理パネルにある自動インストールからwordpressがインストール可能ということが分かった。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/175568/117ca3ef-134e-5fdd-3865-6fccc9a51d92.png)

　ユーザー名やパスワードとかを色々入力してインストールしてみるとちゃんとwordpressが表示された。

##Elementorプラグイン追加
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/175568/ba358bce-af7a-6b99-5ed2-b0a02294afdd.png)
　紹介してもらった案件ではElementorというものを使うらしいので、プラグイン検索から有効化してみた。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/175568/8c612375-8bad-4dc2-4e01-944f524aa002.png)
 　初心者向けのノーコードでできる案件らしいが、確かにwix同様割と直観的に使えそうだ。


　独自ドメイン取得がどこで必要なのかわからなかったが、wordpressを使ってみるという目的は達成したので一旦ここまでにしておく。また何かあれば追記していきたい。
【Flutterアプリ】Firebase Auth永久ログイン

こんにちわ、語学学習マッチングアプリ『CROSSER』の開発者です。:smile:
この『CROSSER』なのですが、FlutterとFirebaseを用いて開発しております。
今回は、Firebase Authを用いて永久ログインをどの様に実現したかを記載します:fist::fist:


#はじめに
Firebase Authって簡単にログイン機能が作れて便利ですよね:eyes::sunny:
けど、FlutterのプラグインでFirebase Authを使うと永久ログインができなくて悩んでいる方もいると思います！（Firebase Authの永久ログインは現在Javascriptにしか対応していません。:hear_no_evil::sweat_drops:)
今回は、FlutterアプリでもFirebase Authで永久ログインを実現する方法を共有します:relaxed:


#使用したもの
たったこれだけです:point_down_tone1::clap:
- shared_preferences 
https://pub.dev/packages/shared_preferences/install


#前提条件
- DBにユーザーのユニークな識別IDを保持している。


#実現方法
①Firebase Authログインを実装する。
他の文献がたくさんあるので割愛します。

②ログイン時にユーザーのユニークIDをDBに登録する。

③ユーザーのユニークIDをshared_preferencesに保存する。

④ユーザーがアプリを開くたびにshared_preferencesに保存したユニークIDでDBを参照する。

- 以上 -

#その他
- ユーザーが脱退/ログアウトするときはshared_preferencesに保存したユニークIDを削除する。


#まとめ
- shared_preferencesはちょっとしたデータを保存するのにも便利！
- アプリを削除してもしばらくはshared_preferencesにデータは残っている！


語学マッチングアプリ『CROSSER』もよろしくお願いします。:two_hearts:
評価もいただけると嬉しいです！
iOS/Androidモバイル対応
https://instabio.cc/crosser
【AWS】初心に戻って1からVPCを構築してみたら少し進化していた　2021年9月版 VPC+プライベートサブネット構築編

#はじめに
今回はAWSでシステム構築する際にはじめに必要なVPCについて記載します。
awsのソリューションアーキテクト資格を目指す方ならまず最初に習う項目です。
またaws上でEC2インスタンス(仮想サーバ)を動かす場合は基本的に必要となります。

#構成図
今回は[10.0.0.0/16]のCIDRブロックでVPC領域を構成しようと思います。
パブリックサブネットは[10.0.1.0/24]
プライベートサブネットは[10.0.2.0/24]
で構成します。
以下の図のVPCとパブリックサブネットをVPCウィザードで構築したいと思います。
（少し前までこんなウィザードなかったけどな・・・進化している）

・本記事の作成範囲
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1966337/bb85d8c2-3651-60b2-7354-9e8b87b3a8ad.png)


・最終完成イメージ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1966337/9d87df89-ef66-0c2a-b4cf-da5ffd6e6639.png)


#作成手順
1.AWSのマネジメントコンソールにログインし、上部の検索バーで　VPCと入力します。
![スクリーンショット 2021-09-18 8.34.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1966337/def7315d-6cba-2517-9226-5d4f39028b41.png)

2.[VPCウィザードを起動] をクリックします。
注意: インスタンスは アジアパシフィック (東京) リージョンで起動されます。
![スクリーンショット 2021-09-18 8.37.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1966337/1a44f3d7-895e-3c47-f9ff-215bc521a060.png)

3.[1個のパブリックサブネットを持つVPC]で[選択]をクリックします。
![スクリーンショット 2021-09-18 8.38.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1966337/d9849e15-be1f-324b-4429-0a9aef87c082.png)

4.構成図の値と同じことを確認し、[VPCの作成]をクリックします。
　IPv4 CIDR ブロック:10.0.0.0/16
　VPC名:VPC　(任意の名前をつけてください)
　パブリックサブネットの IPv4 CIDR:10.0.1.0/24
　アベイラビリティーゾーン:ap-northeast-1a
　サブネット名:パブリックサブネット
![スクリーンショット 2021-09-18 8.48.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1966337/8b099205-e53f-81d9-31e0-032dfb48bf02.png)

5.VPCが正常に作成されましたと表示されたら作成完了です。
　左のメニューペインからVPCやサブネットに指定したCIDRネットワークができていることを確認してください。
![スクリーンショット 2021-09-18 8.48.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1966337/af0abc77-6719-99e7-71cf-d21529aa1fe1.png)

#最後に
無事に作成できましたでしょうか。
あっという間にできますね。
次回はプライベートネットワークを構築したいと思います。
ご参考になれば幸いです。
Flutter アニメーションディレイでありがち　Failed assertionを乗り越える

こんにちは、Flutter赤ん坊です。

今回は、アニメーションをディレイした時にでてくる、こんなやつです。

>Failed assertion: line 455 pos 7: '_ticker != null': AnimationController.forward() called after AnimationController.dispose()

要は、アニメーションをものすごい事にしたくて一つ一つにディレイをかけたら、アニメーションの始まる頃にはすでにコントローラーがお亡くなりになっていた状態ですね。

具体的には、ディレイは次のように仕込みます。

```dart
Duration dur = Duration(milliseconds: index * 50);
Future.delayed(dur, _controller.forward);
```

すると次のようになります。

関数実行 ---> index * 50ms待つ
 ---> アニメーション開始（待っていた間にコントローラーが死亡）


## 回避策

これを回避するためには、次のように書きます。mountedを用います。

```dart
Duration dur = Duration(milliseconds: index * 50);
Future.delayed(dur, start);

void start(){
  if(!mounted){
    return;
  }
  _controller.forward
}
```

mountedは、以下のように説明されています。

> bool get mounted
> package:flutter/src/widgets/framework.dart

> Whether this [State] object is currently in a tree.Whether this [State] object is currently in a tree.

Stateがツリーに存在するかどうかを返してくれるわけですね。

以上、Flutter人口が増えて、もっと日本語での情報が増えればいいなと思っている今日この頃の赤ん坊でした。
エレキ素人が何か考える（その１：トランジスタ）

# エレキどシロートが考える
エレキや回路の理解が不十分な素人が、できるだけマイコンなどと組み合わせて何かすることを考える、、のその１。その２はあるが、いつまでネタが続くか不明。

# トランジスタを用いてスピーカーの音量を変える（大きくする）
トランジスタといえば、何かしらを増幅するもの。若かりし頃の大学の実験か何かで扱って以来、まともに使ったことがなく、素人ながら、再度動作を確認する。ここでは、Arduinoにスピーカーを接続し、トランジスタで音量が増えることを試す。

## 用いるもの
### トランジスタ
[NPNトランジスタ2N3904](https://cdn.sparkfun.com/assets/learn_tutorials/4/2/3/2N3904.PDF)を利用。スイッチサイエンスにて、[ディスクリート部品詰め合わせキット](https://www.switch-science.com/catalog/2636/)として、他の部品とパックで購入。

### スピーカー
[8オームスピーカー](https://akizukidenshi.com/catalog/g/gP-12494/)を用いた。秋月電子で50円。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/77977ac3-df97-8356-b40b-24d76a62fe70.png", width=20%>

### ソースコード
[こちら](https://github.com/houtbrion/arduino-grove/blob/master/Speaker/Speaker.ino)にあるソースコードをそのまま使う。一応、そのまま下記する。

```c++
/*macro definition of Speaker pin*/
#define SPEAKER 3

int BassTab[]={1911,1702,1516,1431,1275,1136,1012};//bass 1~7

void setup() 
{
	pinInit();
}
void loop()
{
	/*sound bass 1~7*/
	for(int note_index=0;note_index<7;note_index++)
  	{
    	sound(note_index);
		delay(500);
  	}
}
void pinInit()
{
	pinMode(SPEAKER,OUTPUT);
	digitalWrite(SPEAKER,LOW);
}
void sound(uint8_t note_index)
{
	for(int i=0;i<100;i++)   
 	{
		digitalWrite(SPEAKER,HIGH);
		delayMicroseconds(BassTab[note_index]);
		digitalWrite(SPEAKER,LOW);
		delayMicroseconds(BassTab[note_index]);
	}
}
```

Arduinoのピン3にスピーカーを接続、digitalWrite()のオンオフの周期を変えることで、音を変化させている。

## まずはトランジスタ無し
回路は単純。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/75eca64b-95ba-66d3-d3ae-432b9e5e927c.png", width=50%>
このとき、スピーカーに流れる電流値の最大値は、46mAくらいであった。

## トランジスタ有り
[ここ](http://bbradio.sakura.ne.jp/um66t/um66t.html)など、ネット上には参考となる回路は見つかる。今回の回路と実際の接続の様子は下記のとおり。トランジスタのコレクタのところに8オームスピーカーを接続、ベースとピン3の間にある抵抗値は1Kオーム、ベースとGNDとの間にある抵抗値は10Kオームである。抵抗値については、トランジスタの基本的な説明がされているサイトの情報から適当に選ぶ。
![Speaker_ブレッドボード.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/487139cc-3ffe-f638-ffed-30f3c6b8f9b1.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/657f6220-ceab-5a2c-b61e-e9d8ac532321.png)

トランジスタ無しの時に比べて、確実に音が大きく、スピーカーに流れる電流値の最大値を測定すると、92mAくらいであった。

とりあえず成功。
Unity Base64からTexture2Dへの変換



```C#
//testcode
const string s_Arrow0 = "iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAYdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuNWWFMmUAAACYSURBVDhPzZExDoQwDATzE4oU4QXXcgUFj+YxtETwgpMwXuFcwMFSRMVKKwzZcWzhiMg91jtg34XIntkre5EaT7yjjhI9pOD5Mw5k2X/DdUwFr3cQ7Pu23E/BiwXyWSOxrNqx+ewnsayam5OLBtbOGPUM/r93YZL4/dhpR/amwByGFBz170gNChA6w5bQQMqramBTgJ+Z3A58WuWejPCaHQAAAABJRU5ErkJggg==";
```

```C#
        /// <summary>
        /// Converts a Base64 string to a Texture2D
        /// </summary>
        /// <param name="base64">Base64 string containing image data</param>
        /// <returns>Texture2D containing an image from the given Base64 string</returns>
        public static Texture2D Base64ToTexture(string base64)
        {
            Texture2D t = new Texture2D(1, 1);
            t.hideFlags = HideFlags.HideAndDontSave;
            t.LoadImage(System.Convert.FromBase64String(base64));
            return t;
        }
```



https://github.com/Unity-Technologies/2d-extras/blob/master/Editor/Tiles/RuleTile/RuleTileEditor.cs
WordPressのDBカラム追加でsql_modeを修正しても#1067 – Invalid default value for 'post_date' を解消できなくて頑張った話

# #1067 – Invalid default value for 'post_date' 
WordPressのDBにカラムを追加しようとしたらエラーが出ました。
解消法をいくつも探して試しましたが、簡単に解決できなかったので記録を残します🙇‍♂️

#sql_modeの`NO_ZERO_DATE`を無効にするSQLが通らない
`SHOW VARIABLES LIKE 'sql_mode';`
多くのサイトで紹介されているsql_modeの設定を変えれば解消します！という対応を実行してみましたがユーザー権限が足りず、クエリを投げてもWarningが出て終わり、となってしまいました。
rootユーザーのパスワードは知りません、、、

# `my.cnf`の書き換えもできない
サーバーログインのユーザーもrootを使えません。`sudo`も`su -`もコマンド効きません。
`my.cnf`を書き換えようと思いましたがread onlyです。辛い。


# 問題カラムの`default`を`0000-00-00 00:00:00`から変更してしまう
デフォルト値が`0000-00-00 00:00:00`となっているカラムが問題です。ゼロ埋めが入らないようにしてあげればOK。

### `0000-00-00 00:00:00`のカラムが複数ある場合、one linerクエリでデフォルト値を変更してあげないとエラーになる！
↓こんな風に、別々クエリを叩くと、1つ目のクエリ実行時に「default値に（別の）0埋めカラムがあるから更新できないよ！」とエラーが出てしまう。
2つ目のカラムのdefault値変更を先に実行しようとすると1つ目のカラムのdefault値0埋めでエラーが出るから堂々巡り。

**誤**

```
alter table wp_posts MODIFY COLUMN post_date datetime not null default '1000-01-01 00:00:00';
alter table wp_posts MODIFY COLUMN post_date_gmt datetime not null default '1000-01-01 00:00:00';
```

↓まとめて流せばOK！
**正**

```
alter table wp_posts MODIFY COLUMN post_date datetime not null default '1000-01-01 00:00:00',
MODIFY COLUMN post_date_gmt datetime not null default '1000-01-01 00:00:00',
MODIFY COLUMN post_modified datetime not null default '1000-01-01 00:00:00',
MODIFY COLUMN post_modified_gmt datetime not null default '1000-01-01 00:00:00',
add column publication_date int;
```
Swift で Prim（プリム法）使って MST：Minimum Spanning Tree（最小全域木）


備忘用メモ

## Note

- アルゴリズム：Prim's Algorithm
- 実装：Primary Queue（Heap）


## コード

アルゴリズム部分。

- どれか１つ頂点から決めで始点を決める。始点から生えている辺をすべてエンキューする。
- デキューする。PriorityQueueなのでデキューされたものはキューイングされたものの中で一番重さの値が低い辺になる。
- デキューされた辺の相手側の頂点を主役に取り、ここから生えている辺をすべてキューイングする。これを繰り返す。

```swift
// n: number of node
func prim(_ n: Int, _ graph: [[Edge]]) -> Int {
    // init
    var heap = MinHeap.init()
    var mst = [Edge]()
    var visited = [Bool](repeating: false, count: n)
    
    // first node
    let from = 0
    for edge in graph[from] { heap.push(item: edge) }
    visited[from] = true

    // loop
    while let edge = heap.pop() {
        if visited[edge.to] { continue }
        visited[edge.to] = true
        mst.append(edge)
        for next in graph[edge.to] {
            heap.push(item: next)
        }
    }
    
    // return
    var sum = 0
    for edge in mst { sum += edge.weight }
    return sum
}
```


---

Primary Queue となる Min Heap の実装部分

```swift
struct MinHeap {
    // zero-based index
    var list = [Edge]()
    
    private mutating func heapifyUp(_ idx: Int) {
        if !self.hasParent(idx) { return }
        if parentOf(idx).weight > list[idx].weight {
            let parentIdx = parentIdxOf(idx)
            list.swapAt(parentIdx, idx)
            self.heapifyUp(parentIdx)
        }
    }
    private mutating func heapifyDown(_ idx: Int) {
        if !self.hasLeft(idx) { return }
        let smallerIdx: Int = {
            if !self.hasRight(idx) { return self.leftIdxOf(idx)}
            return self.leftOf(idx).weight < self.rightOf(idx).weight
                ? self.leftIdxOf(idx)
                : self.rightIdxOf(idx)
        }()
        if list[idx].weight < list[smallerIdx].weight { return }
        list.swapAt(idx, smallerIdx)
        heapifyDown(smallerIdx)
    }
    
    private func parentIdxOf(_ idx: Int) -> Int { Int(floor((Double(idx) - 1) / 2)) }
    private func leftIdxOf(_ idx: Int)  -> Int { idx*2 + 1 }
    private func rightIdxOf(_ idx: Int) -> Int { idx*2 + 2 }
    private func parentOf(_ idx: Int) -> Edge { list[self.parentIdxOf(idx)] }
    private func leftOf(_ idx: Int)  -> Edge { list[self.leftIdxOf(idx)] }
    private func rightOf(_ idx: Int) -> Edge { list[self.rightIdxOf(idx)] }
    private func hasParent(_ idx: Int) -> Bool { idx != 0 }
    private func hasLeft(_ idx: Int) -> Bool { self.leftIdxOf(idx) < list.count }
    private func hasRight(_ idx: Int) -> Bool { self.rightIdxOf(idx) < list.count }

    mutating func push(item: Edge) {
        list.append(item)
        heapifyUp(list.count-1)
    }
    
    mutating func pop() -> Edge? {
        if list.isEmpty { return nil }
        if list.count == 1 { return list.removeFirst() }
        let peaked = list[0]
        list[0] = list[list.count-1]
        list.removeLast()
        heapifyDown(0)
        return peaked
    }
}
```

---

Edge のデータ構造

```swift
struct Edge {
    let to: Int
    let weight: Int
}
```


## REF

- https://leetcode.com/problems/min-cost-to-connect-all-points/
    - この記事のアルゴリズムだと Time Exceeded になるので注意
firebaseのログインエラーでアラートを出す　swift

Firebaseでログインできなかったときにアラートを出す方法
---

firebaseのセットアップ方法やログイン機能の実施方法は省力します。


```swift:ログインエラー.swift
import FirebaseAuth
.
.
.
 //Mark: loginMethod
 private func login() {
   let email = メールのテキストフィールド.text ?? ""
   let password = パスワードのテキストフィールド.text ?? ""
     Auth.loginFirebaseAuth(email:email,password:password) { result,error in
      if let error = error as NSError? {
         print("LoginError",error)
         self.signInErrAlert(error)
   } else {
     //ログイン後の処理。画面遷移とかが多い。
  }
}

 //Mark: LoginError
   private func signInErrAlert(_ error: NSError){
        print(#function)
        //メッセージをエラーの種類によって変える
        if let errCode = AuthErrorCode(rawValue: error.code) {
            var message = ""
            switch errCode {
            case .userNotFound:  message = "アカウントが見つかりませんでした"
            case .wrongPassword: message = "パスワードを確認してください"
            case .userDisabled:  message = "アカウントが無効になっています"
            case .invalidEmail:  message = "Eメールが無効な形式です"
            default:             message = "エラー: \(error.localizedDescription)"
            }
            // アラートを出す関数を実施する。
            self.showAlert(title: "ログインできませんでした", message: message)
        }
    }
    
    //Mark: AlertMethod
    private func showAlert(title: String, message: String?) {
        print(#function)
           let alertVC = UIAlertController(title: title, message: message, preferredStyle: .alert)
           alertVC.addAction(UIAlertAction(title: "OK", style: .default,handler: nil))
           self.present(alertVC, animated: true, completion: nil)
       }

```

ほぼコピペで使用できるはずだと思います。
今回はログインですが、新規登録エラーでも同様にできます。
エラーの種類はFirebaseのドキュメント(https://firebase.google.com/docs/auth/ios/errors?hl=ja#firauth)
にたくさん記載されていますが、今回は一番多いであろう種類だけ条件分岐しました。
【RSpec】RSpecテスト実行時のCapybara::Ambiguous:というエラーの解消


#対象者

* RSpecテストでCapybara::Ambiguous:というエラーが出た方


#目的

* Capybara::Ambiguous:のエラーを解消する

#実際の手順と実例
###1.前提（エラー内容）

* gem 'capybara', '>= 2.15'
* TOPページのリンク内容の確認のテスト実行後下記のエラーを吐かれました。


`````Terminal.
 1) ユーザーログイン前のテスト ヘッダーのテスト(ログイン前) リンクの内容の確認 新規会員登録のリンクを押すと新規登録画面に遷移する
     Failure/Error: click_link signup_link
     
     Capybara::Ambiguous:
       Ambiguous match, found 2 elements matching visible link "新規会員登録"

`````

* 該当ソースコード

```before_login_spec.rb
context "リンクの内容の確認" do
      subject {current_path}
      
      it "新規会員登録のリンクを押すと新規登録画面に遷移する" do
        signup_link = find_all('a')[1].native.inner_text
        signup_link = signup_link.gsub(/\n/, '').gsub(/\A\s*/, '').gsub(/\s*\Z/, '')
        click_link signup_link
        is_expected.to eq "/users/sign_up"
      end
    end
```

###2.結論（解決策）


````before_login_spec.rb
context "リンクの内容の確認" do
      subject {current_path}
      
      it "新規会員登録のリンクを押すと新規登録画面に遷移する" do
        signup_link = find_all('a')[1].native.inner_text
        signup_link = signup_link.gsub(/\n/, '').gsub(/\A\s*/, '').gsub(/\s*\Z/, '')
        click_on "新規会員登録", match: :first 　#ここを変更
        is_expected.to eq "/users/sign_up"
      end
    end
````

このように変更するとテストが正常に稼働しました。

###3.原因

**原因は 同じページ内に複数の同じ名前のリンク（ボタン）があり、どちらのテストを実行すればいいか判断できなかったから**です。

エラー内容の翻訳

````
 Capybara::Ambiguous:
       見えているリンク "新規会員登録 "に一致する要素が2つ見つかりました。
````

要訳してみるとエラー内容の通りだったので、ページの上から一番最初にあたるリンクを指定（match: :first）して解消しました！

他にも固有のCSSを指定するという解決方法もあるみたいです。


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

* [【RSpec】複数の要素から絞り込む/ 「Ambiguous match, found 2 elements matching」の解消](https://qiita.com/osteria/items/4fdb0377051462674d02)
Adafruit Feather 32u4 Bluefruit LE + NEOPIXEL + iPhone　スマートフォンからカラーコントロール



１）Aruduino IDEのセットアップ

２）Adafruit Feather 32u4 Bluefruit LEのボード情報やライブラリを下記に従ってインストール
https://learn.adafruit.com/adafruit-feather-32u4-bluefruit-le/installing-ble-library

３）File > Examples > Adafruit_BluefruitLE_nRF51
Neopixel pickerのサンプルスケッチを編集

PINナンバーとピクセル数のところを編集。

USB接続指定なくても動作するように
下記行のコメントアウト
while (!Serial);

４）下記のように配線。
　　　　雑ですいません・・・

![Adafruit BLE＋NeoPixel.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204852/6d66ae7b-3498-4bf3-b9b7-0f8cb33f7095.jpeg)

![IMG_1125.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204852/4582bf77-21ea-73fa-22dc-0d5c88814e76.jpeg)

![IMG_1126.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204852/33fc5e91-f399-f89c-efb0-67d951fc1f10.jpeg)

５）iPhoneにBluefruiteConnectをインストール
Feather 32u4 Bluefruit LEとスマホをBluetoothで接続。
カラーピッカーを選んで色を選択。

![IMG_1133.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204852/78cdffa4-cde3-e381-e761-d74abe91760f.jpeg)

![IMG_1132.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204852/cc5c5040-2595-e2ed-df28-3b083419bd89.jpeg)
![IMG_1131.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204852/7c10930f-f615-3a06-39f5-851dd664d348.jpeg)
![IMG_1129.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204852/82f3c05f-aa75-70d8-7dfa-5315795ce5d5.jpeg)
ArduinoUNOとWS2812B(3個)でランダムに光らせる。


x ws2812bがなぜ3個なのかと言うと2,3個で電流が超えるらしい
x 割り込みを止めないと誤作動する
x NOP (ノップ?)やループでタイミングを取らずにダイレクト
x いちお、UNOの互換機である　水晶は、16Mが刺さっている

目的
GPIOのテスト

構成
windows 10 20H2
Arduino
1.8.13(Windows Store 1.8.42.0)


![h_con93.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/539627f0-aa90-aca4-1e81-3df19be0de60.jpeg)




```c++


int l[90]; //max30 led

void bit_on1();
void bit_off1();

//             12345678   12345678   12345678   12345678
int b8[8] = {0b10000000,0b01000000,0b00100000,0b00010000,
             0b00001000,0b00000100,0b00000010,0b00000001, };

int ws_led(int num1)
{
  int on_off;

noInterrupts(); //割り込み禁止

  for(int ii=0;ii<num1;ii++){

    //8ビット分送る
    for(int jj=0;jj<8;jj++){

      on_off = l[ii] & b8[jj];

      if( on_off == 0 ){
        bit_off1(); //ビットが0
      } else {
        bit_on1(); //ビットが1 
      }//endif

    }//for 8bit

  }//for max30byt

interrupts(); //用が済んだらコンパイラさんにお知らせしましょう。

  return(0);
}//ws_led

void setup() {

  randomSeed( micros() ); //乱数の初期化

  //pinMode(PA8, OUTPUT); 
  pinMode(13, OUTPUT); 

  while(1){

    //l[3*0+0] = 31;
    //l[3*0+1] = 32;
    //l[3*0+2] = 33;
    //
    //l[3*1+0] = 30;
    //l[3*1+1] = 10;
    //l[3*1+2] = 32;
    //
    //l[3*2+0] = 10;
    //l[3*2+1] = 10;
    //l[3*2+2] = 32;

    for(int ii=0;ii<9;ii++){
      l[ii] = random(32);
    }//for

    //ws2812bへデータを送る
    ws_led(9);

    //0.1秒待つ
    delay(100);

  } //while

}//setup

void loop() {
}//loop

//              76543210
#define on1   0b00100000
#define off1  0b00000000

// 0.3 0.3 0.3 0.3 0.3 0.3 0.3 0.3 0.3 0.3 0.3 0.3 0.3 0.3 
void bit_off1(){

  PORTB = on1; //1 0.16uS
  PORTB = on1; //2 0.33uS
  PORTB = off1; //3
  PORTB = off1; //4
  PORTB = off1; //5
  PORTB = off1; //6
  PORTB = off1; //7
  PORTB = off1; //8

  PORTB = off1; //1
  PORTB = off1; //2
  PORTB = off1; //3
  PORTB = off1; //4
  PORTB = off1; //5
  PORTB = off1; //6
  PORTB = off1; //7
  PORTB = off1; //8

}

// 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1
void bit_on1(){
  
  PORTB = on1; //1
  PORTB = on1; //2
  PORTB = on1; //3
  PORTB = on1; //4
  PORTB = on1; //5
  PORTB = on1; //6
  PORTB = on1; //7
  PORTB = on1; //8

  PORTB = on1; //1
  PORTB = on1; //2
  PORTB = on1; //3
  PORTB = on1; //4
  PORTB = on1; //5
  PORTB = on1; //6
  PORTB = off1; //7 0.32uS
  PORTB = off1; //8 0.16uS

}



```
断線状態で Jekyll 遠隔テーマを使いたかったので

ネットワークに接続していない環境で Jekyll 遠隔テーマを利用したサイトの保守をする方法を試してみました。

---

Jekyll を使って[担当している講義の静的ウェブサイト](https://wakita.github.io/classes/)を運営しています。このウェブサイトでは 

GitHub は Jekyll は 10 種類程度のテーマを選択することができますが、それに飽き足らない場合には GitHub にホスティングされている[遠隔テーマ(remote theme)](https://jekyllrb.com/docs/themes/)に対応したテーマを利用することもできます。わたしが利用している [basically basic](https://github.com/mmistakes/jekyll-theme-basically-basic) というテーマもそうした遠隔テーマのひとつです。

遠隔テーマの使い方は簡単で、基本的には `Gemfile` をすこし調整した上で、`_config.yml` のなかの普通は `theme: <テーマの名前>` と書くところを `remote_theme: "<テーマの名前>"` に置き換えるだけです。具体的な設定については[遠隔テーマ(remote theme)](https://jekyllrb.com/docs/themes/)の内容や[`basically basic`のReadme](https://github.com/mmistakes/jekyll-theme-basically-basic/blob/master/README.md)を見て下さい。具体的な設定については[私のサイトのリポジトリ](https://github.com/wakita/classes)のなかの `Gemfile` と `_config.yml` が参考になるでしょう。

これでしばらく快適に過していたんですが、ひとつ困ったことを見つけました。移動中、ネットワーク接続を停止しているときに `bundle exec jekyll build ...` すると、サイトの再構築がエラーを生じるのです。原因は `remote_theme:` 設定があると、再構築のたびに GitHub にアクセスするためのようです。`Gemfile` に該当する Gem を追加してもだめでした。

# 悩み

`remote_theme:` 機能は使いたいけれど、断線環境では再構築ができないという悩みです。

# 解決の方針

そこで、Jekyll の環境設定を二種類用意することにしました。

**遠隔テーマ設定 (`_config.yml`)**
こちらの設定は GitHub に push するためのものです。すでに書いたように、この設定では断線環境での再構築ができません。

**ローカルテーマ設定 (`etc/_config.yml`)**
こちらの設定は手元でビルドするためのものです。`Gemfile` に記載したテーマの Gem を利用して環境を構築し、手元のウェブサーバで内容を確認できます。環境が手元のパソコンに閉じているため、断線環境下で利用できます。

以下に示すように `_config.yml` と `etc/_config.yml` の内容の違いは、前者が `remote_theme:` 設定を用いるのに対し、後者が `theme:` 設定を施す点だけです。

~~~ .patch
70,71c70,71
< remote_theme: "mmistakes/jekyll-theme-basically-basic"
< #theme: jekyll-theme-basically-basic
---
> #remote_theme: "mmistakes/jekyll-theme-basically-basic"
> theme: jekyll-theme-basically-basic
~~~

そして以下がサイト再構築に用いているスクリプトです。

~~~ .sh
#!/bin/sh

rm -f etc/_config.yml
cat _config.yml | sed -e 's/^remote_theme/#remote_theme/' -e 's/^#theme:/theme:/' > etc/_config.yml
bundle exec jekyll build --config etc/_config.yml --destination $HOME/Sites/classes --incremental --watch $*
~~~

`_config.yml` の内容を元にテーマ設定を置換したものを、`etc/_config.yml` に生成し、`bundle exec jekyll build` で生成したばかりの `etc/_config.yml` を利用します。

サイトの保守には、`_config.yml` を編集し、手元での再構築のための設定はその都度、自動生成されます。

これで断線環境でも、サイトの保守ができるようになりました。もちろん、サイトを公開するときはネットワークに接続しますけれど。
簡易紙芝居PGM

<h3>簡易紙芝居PGM</h3>
JavaScriptのテキスト読み上げ機能を使った簡易的な紙芝居PGMを作りました
あと紙芝居データ共有Wikiもついでに作成しました

2021/12/11: 行別画像リストファイル中に”ChangeSpeakOneLineTime”と読み上げ時間を指定することで読み上げ間隔を
一時的に変更することができるように修正しました
<hr>
githubURL:https://github.com/NanjoMiyako/KamiSiba
サンプルページURL:https://nanjomiyako.github.io/KamiSiba/
紙芝居データ共有WikiURL:https://seesaawiki.jp/kamisiba20210918/

<hr>
使い方
まず読み上げさせたいテキストデータと行別画像リストファイルを読み込ませます
その後開始行と一行あたりの読み上げ時間を入力した再生ボタンを押します
<hr>
行別画像リストのファイル形式
表示させたい行番号1,画像URL1
表示させたい行番号2,画像URL2
...
読み上げ時間変更させたい行番号3,ChangeSpeakOneLineTime,読み上げ時間
...
<hr>
参考にしたサイト
<a href="https://qiita.com/sirojake/items/26618081bbb33e918aa4">javascriptのsetTimeoutが即実行されてハマった - Qiita</a>
ArduinoUNOとGPIOで800khz(1.25us)を作る


目的
GPIOのテスト


```c++


// the setup function runs once when you press reset or power the board
void setup() {
  // initialize digital pin LED_BUILTIN as an output.
  pinMode(13, OUTPUT);
}

//              76543210
#define on1   0b00100000
#define off1  0b00000000

// the loop function runs over and over again forever
void loop() {
  //digitalWrite(13, HIGH);   // turn the LED on (HIGH is the voltage level)
//PORTD |= _BV(5);
//        76543210   
//PORTB = 0b00100000;
//PORTB = on1;
//  delay(1000);                       // wait for a second
//PORTD &= ~_BV(5);
//        76543210
//PORTB = 0b00000000;
//PORTB = off1;
//  digitalWrite(13, LOW);    // turn the LED off by making the voltage LOW
//  delay(1000);                       // wait for a second

while(1){

  PORTB = on1; //1
  PORTB = on1; //2
  PORTB = on1; //3
  PORTB = on1; //4
  PORTB = on1; //5
  PORTB = on1; //6
  PORTB = on1; //7
  PORTB = on1; //8


  PORTB = off1; //1
  PORTB = off1; //2
  PORTB = off1; //3
  PORTB = off1; //4
  PORTB = off1; //5
  PORTB = off1; //6
  PORTB = off1; //7
  PORTB = off1; //8



}//while






}



```
RealSense D435で300fpsのDepth画像を取得すーる（Python 3.6、Windows10）

# はじめに
300fpsのDepth画像を取得していきます

# システム環境
- Intel.RealSense.SDK-WIN10-2.49.0.3474.exe
- librealsense-2.49.0
- Python 3.6

# RealSense Viewer

- 1280 x 720 15fps RGB Depth IR Stereo
- 848 x 480 60fps RGB IR Stereo
- 640 x 480 60fps RGB Depth IR Stereo
- 848 x 100 300fps Depth IR Stereo
- 256 x 144 300fps Depth

|Resolution|RGB|Depth|FPS|
|:--|:--|:--|:--|
|256 x 144|-|○|300（○ Depth, x IR1, x IR2）|
|320 x 180|○|-|60|
|320 x 240|○|-|60|
|424 x 240|○|○|60, 90（○ Depth, x IR1, x IR2）|
|480 x 270|-|○|90（○ Depth, x IR1, x IR2）|
|640 x 360|○|○|60, 90（○ Depth, x IR1, x IR2）|
|640 x 400|-|○|25（x Depth, ○ IR1, ○ IR2）|
|640 x 480|○|○|60, 90（○ Depth, ○ IR1, ○ IR2）|
|848 x 100|-|○|300（○ Depth, ○ IR1, ○ IR2）|
|848 x 480|○|○|60, 90（x Depth, ○ IR1, ○ IR2）|
|960 x 540|○|-|60|
|1280 x 720|○|○|30, 15（○ Depth, ○ IR1, ○ IR2）|
|1280 x 800|-|○|15（x Depth, ○ IR1, ○ IR2）|
|1920 x 1080|○|-|30|

# Depth 300fps

~~~python
import pyrealsense2 as rs
import numpy as np
import cv2
import time

pipeline = rs.pipeline()
config = rs.config()

pipeline_wrapper = rs.pipeline_wrapper(pipeline)
pipeline_profile = config.resolve(pipeline_wrapper)
device = pipeline_profile.get_device()
device_product_line = str(device.get_info(rs.camera_info.product_line))
print(device_product_line) # D400

config.enable_stream(rs.stream.depth, 848, 100, rs.format.z16, 300)
# config.enable_stream(rs.stream.infrared, 1, 848, 100, rs.format.y8, 300)
# config.enable_stream(rs.stream.infrared, 2, 848, 100, rs.format.y8, 300)

profile = pipeline.start(config)
depth_sensor = profile.get_device().first_depth_sensor()
depth_scale = depth_sensor.get_depth_scale()
print("Depth Scale is: " , depth_scale)

try:
    while True:
        start = time.time()

        frames = pipeline.wait_for_frames()
        depth_frame = frames.get_depth_frame()
        if not depth_frame: continue

        depth_image = np.asanyarray(depth_frame.get_data())
        # depth_colormap = cv2.applyColorMap(cv2.convertScaleAbs(depth_image, alpha=0.03), cv2.COLORMAP_JET)
        # cv2.imshow('depth', depth_colormap)
        key = cv2.waitKey(1)
        if key & 0xFF == ord('q') or key == 27:
            cv2.destroyAllWindows()
            break

        elapsed_time = time.time() - start
        print(1/elapsed_time)

finally:
    pipeline.stop()
~~~

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/53ca6a53-4cee-67c2-59a8-1fe5967b8c78.png)

depth_colormapを表示した場合

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/31e44552-1677-a7eb-89ae-910f2960ea0d.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/4b39881f-35f4-1c15-4c81-53dd2e6290b3.png)

https://twitter.com/sotongshi/status/1278044722297139200?s=20&t=EyVWamAgceo17c-hX0NE4g

お疲れ様でした
GMO Developers Day「わたしたちがエンジニアになるまで」を視聴したので、その感想

## わたしたちがエンジニアになるまで

https://developers.gmo.jp/developersday/?session=21

GMO社の女性エンジニアが座談するセッションでした。一緒に話している気持ちになるような親近感あるセッションでした。ざっくりとったメモのようなところと、同じような立場である私の感想。


### エンジニアになった経緯

- 文系でもエンジニアになれた
    - 手に職をつけたかった
    - CとJavaの大規模システム
        - 37くらいで一旦エンジニアを辞めて、出戻り
- ゲーム会社に入りたかったが、就職氷河期
    - インターン的なところ
    - 結婚～ブログ経由で声をかけられた
- 手に職。高専から。入社してその後セキュリティの面白さに目覚めた。
- 高校生時代に進路を決めるとき、女性でもできる仕事の中で、将来在宅勤務ができると思った。
    - ITの専門学校に進学

#### 感想
世代によりITへの考え方が違いそう。氷河期の気持ちはわかる...。私の自社への入社経緯は [こんな](https://qiita.com/e99h2121/items/5eefe618e97ba0e6df70) なので、共感する所あり。

### 後輩に心得て欲しいことは？
- 貪欲に勉強。実績を積む。
- 時間があるうちにやりたいことをやれ。出産などすると本当に時間はない
- 先輩になった時に覚えていてほしいのは、後輩に対しても尊敬の意。負けないぞという気持ち

#### 感想
これは共感しか無い。あと時間がなくなるのはなくなるけど、パートナーとどれだけ作業分担できるかとかですよね。

### 年齢の離れた先輩とのコミュニケーション
- 体調のわるいときなど。先輩は、コミュニケーションをどうとっていたか？
- 女性特有という側面だと生理は話題としてはある。生理休暇など。
    - 制度としてバックアップしてもらえているのは有り難い。
    - 一方まわりに取っている人が居ないとつかっていいのかわかりづらい。

#### 感想
制度があっても実際休みやすいかどうかはありますよね。有給と同じかなあ。私も堂々と休暇取ることにします。

### 技術のキャッチアップ法は？
- 通勤時間などでも調べる。
- 同期
- Twitterで聞く
- 子育てあると業務時間外の時間捻出は難しい。お風呂とか、勉強会。
    - 寝かしつけた22時とかから
- 各技術に対する「チャプター」という事業部内で知っておいてほしいものを共有する仕組み。
- 資格試験を取る勉強時間など業務時間内で確保

#### 感想
いい意味で、ふつうだなあ。海外に聞いたりはいいのと、資格試験の勉強を業務時間にできるのは良いなあ！

### 女性が働きやすい職場って？
- 育休後もどってこられるように、急速に制度を整えてもらえた
- 2人目は制度がまた変わったが、在宅で、出社の辛さを味わわなくてすむのはよい
- エンジニアで女性の活躍できる機会は多い。
- 世の中的には3歳までしか時短はできない。小学校高学年でも時短できる制度はおおきい。

#### 感想
自分の会社もあたりまえのようにこういう制度はあるから、こういうところがもっと広まると業界全体が余計女性エンジニアに優しくなりそうですね。


### セッションのまとめ
- 今どき働くお母さんは普通
- 女性エンジニアは少ないかもしれない、やっていることはいろいろかも知れない。こういうイベントで仲間が増えると良い。
- 社内でも女性がつながるチャンネルを作って、広げている。

#### 感想

変に女性だけがつながるというよりは、共通の「育児」という困難や悩みを共有して、そこでもつながっていきたいな。もちろん「女性枠」がなくなると良いねっていうのはつよく同意。


## まとめ

以上40分ほどの時間でしたが、もっと深堀りできそうな、でも結局は男女関係ないエンジニア共通の話題に落ち着きそうな。そういう自由なところが、この業界の魅力でもあるのではとあらためておもいました。

参考になりましたの気持ちを込めて以上です。
ADR: 仮目録

Date: 2021-09-18
Status: not implemented yet

![ 2021-09-18 6.02.54.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102082/36ec2cbb-0c37-7f34-a380-0e4a1d39524b.jpeg)
source: https://dl.ndl.go.jp/info:ndljp/pid/897315

# Context
1. 地理院タイルには、まだ mokuroku.csv.gz が整備されていないものもある。
1. 標準地図の mokurok.csv.gz を使うと、標準地図の小さいズームレベルでは日本国外にもタイルがある、標準地図は海タイルが充実している、といった理由から、ヒットしない場合も多い。
1. [jp-tile-list](https://github.com/optgeo/jp-tile-list)は GitHub レポジトリに収まる規模を試行したので、大きなズームレベルには対応していない。ちなみに、jp-tile-listでは、大きなズームレベルのパスは小さなズームレベルのパスから生成するモデルであった。
1. Raspberry Pi でサーバが運用できるようになったので、大きなファイルもホストできるようになった。

# Decision
1. 現在、標準地図の mokuroku.csv.gz 流用して力押しで experimental_bvmap のベクトルタイルをダウンロードしているが、ダウンロードが終わったら、そのセットを使って簡易な目録を作る。
1. ただし、optgeoは原初データのオーソリティではないので、ファイルの日付、サイズ、MD5SUMのような値はその簡易な目録には記録しない。
1. その簡易な目録の方式の名称を仮目録 karimokuroku と定める。

仮目録のフォーマットはシンプルで、次のレコードが行区切りで置かれたファイルである。

```
{z}/{x}/{y}.{ext}
```

標準的なファイル名は karimokuroku.csv とし、その gzip 圧縮版を karimokuroku.csv.gz とする。

# Consequences
1. experimental_bvmap のダウンロードがより容易になる。
1. 類似のベクトルタイルをより高速にダウンロードできるようになる。例えば[（仮称）多言語化用ベクトルタイル](https://www.gsi.go.jp/common/000212661.pdf)の高速ダウンロードに使えるようになる。

# See Also
- [（仮称）多言語化用ベクトルタイル](https://www.gsi.go.jp/common/000212661.pdf)
- [国土地理院「ベクトルタイル（注記）」の研究](https://hackmd.io/@hfu/multil)
- [optgeo/nevermind](https://github.com/optgeo/nevermind): 仮目録を使う予定のプロジェクト
- [unvt/karimokuroku-generator](https://github.com/unvt/karimokuroku-generator): 仮目録を生成するツール
iptables で TLS/SSL の Client Hello だけドロップする

SSL/TLS の Client Hello だけドロップしたい。そんなふうに思ったことは無いでしょうか？

結論から先に言うと iptables を使用して以下のようにブロックすることができます。

```
sudo iptables -A OUTPUT -p tcp --dport 443 -m state --state ESTABLISHED -m u32 --u32 "0>>22&0x3C@ 12>>26&0x3C@ 2 & 0xFF=0x01" -j DROP
```

上記のオプションは以下のサイトから拝借しています。

https://blog.g3rt.nl/take-down-sslv3-using-iptables.html

上記ページにもありますが u32 module の詳細は以下のページが詳しいです。

http://www.stearns.org/doc/iptables-u32.current.html

2 $ 0xFF=0x01 は TLS ヘッダの 2 バイト後から読み込みを開始した値 (SSL Handshake Type) が 01 (Client Hello) であることを意味しています。0>>22&0x3C@ 12>>26&0x3C@ 2 はそれぞれ IP ヘッダと TCP ヘッダの長さを意味しその長さの分読み込を飛ばし 0 が TLS ヘッダの開始位置となるようにしています。

元の記事では 0>>22&0x3C@ 12>>26&0x3C@ 0 & 0xFFFFFF00=0x16030000 と Handshake Protocol のバージョンの確認 (この場合は SSLv3) もしています。少し値を変えれば TLS ヘッダの他の値も条件とできる気がします。

因みにこの方法では TLS/SSL の Renegotiation の Client Hello のドロップは無理でした。暗号化されてるので当たり前ですね。。
EIZO FlexScan EV3895 のトラブルシューティング的なメモ

FlexScan EV3895 は使い始めの頃に大分ハマったので、その時の対応をメモしておきます。なお、MacBookPro 2018 15inch モデルの外部モニタとして利用しています。

一応、以下のマニュアルを熟読すればわかる事ですが、せっかくなので。。^^;

- https://www.eizo.co.jp/support/db/files/manuals/03V27413A2/UM-03V27413A2-JA.pdf

省エネの為には仕方なさそうな問題もありますね。。一通り対処してからは全く文句ないです。完璧すぎるディスプレイ。

# 解像度があがらない

4K 対応していない USB-C=>HDMI変換アダプタを使っていたせいでした。幸い、USB-C ポートのある MacBook Pro を使っているので、付属している USB-C ケーブルで直接接続すると大丈夫です。
EIZO のショップで 4K 対応変換アダプタを売ってるので、そちらを買うのもありでしょう。

# スリープでウィンドウが他のモニタに移る

macOS 固有の問題かもしれませんが、スリープから復帰した時にウィンドウが MacBookPro 本体のモニタに移動します。だいぶ不便です。
USB-C で直接接続する時だけこうなります。USB-C=>HDMI変換アダプタ越しだと、ちゃんとウィンドウを維持します。

Administrator Settings の Compatibility Mode を On にする事で治りました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1798/986b9182-fc69-50c8-bc5e-dbab848fe64b.png)

# 勝手に暗くなる

徐々に暗くなり、そのうちほぼ真っ暗になる現象です。光センサーで周囲の明るさに応じて、画面の輝度を調整するようですが、自分の部屋には合いませんでした。

これは Auto EcoView 機能をオフにする事で回避できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1798/ec78196f-9973-a9e3-1c2f-fe6c387b99c9.png)

# 電源ボタン

フラットでカチっと言わないタイプの物理ボタンなので、押したのかどうか不安になります。右の方にちっちゃな電源on LED ランプがあるので目を凝らして見ましょう。省エネの都合なのか、明るい部屋だとよく見えない位 LED が暗いんです。^^;

# さいごに。

お友達に大分助けてもらいました。いつも有り難うございます。> T氏