OmniAICreator/Qiita-1.07M huggingface dataset:
C#で2つのDataGridViewのスクロールを同期する


# 1. はじめに
* C# Windowsフォームで2つのDataGridViewのスクロールを同期したい

# 2. 開発環境
* Visual Studio 2022
* .NET6
* Windows10

# 3. 動作イメージ
* 2つのDataGridViewのどちらかを縦、横スクロールした時に追随する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852081/23be7d8d-7d7b-b4a7-0ce9-413f8da1f5ea.png)

# 4. プログラムを作成する

# 4.1. Windowsフォーム
* 以下のコンポーネントを配置する

| コンポーネント | NAME | 内容 |
|:-----------|:------------|:------------|
| DataGridView       | dataGridView1        | 左のDataGridView         |
| DataGridView       | dataGridView2        | 右のDataGridView         |

# 4.2. コードビハインド
```csharp:Form1.cs
using System.Windows.Forms;

namespace DuplicateDataGridView
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();

            // DataGridViewに初期値を設定
            dataGridView1.Rows.Add("Column1A", "Column1B", "Column1C");
            dataGridView1.Rows.Add("Column1A", "Column1B", "Column1C");
            dataGridView1.Rows.Add("Column1A", "Column1B", "Column1C");

            dataGridView2.Rows.Add("Column1A", "Column1B", "Column1C");
            dataGridView2.Rows.Add("Column1A", "Column1B", "Column1C");
            dataGridView2.Rows.Add("Column1A", "Column1B", "Column1C");
        }

        private void dataGridView1_Scroll(object sender, ScrollEventArgs e)
        {
            // dataGridView1 と dataGridView2 に同一の Scroll イベントを割り当てる
            dataGridView2.FirstDisplayedScrollingColumnIndex = dataGridView1.FirstDisplayedScrollingColumnIndex;
            dataGridView2.FirstDisplayedScrollingRowIndex = dataGridView1.FirstDisplayedScrollingRowIndex;
        }

        private void dataGridView2_Scroll(object sender, ScrollEventArgs e)
        {
            // dataGridView1 と dataGridView2 に同一の Scroll イベントを割り当てる
            dataGridView1.FirstDisplayedScrollingColumnIndex = dataGridView2.FirstDisplayedScrollingColumnIndex;
            dataGridView1.FirstDisplayedScrollingRowIndex = dataGridView2.FirstDisplayedScrollingRowIndex;
        }
    }
```

# 5. ソースコード
https://github.com/YoshijiGates/CSharp/tree/main/DuplicateDataGridView
Excel/QGISベースの文化財管理ツール、ToriiをFlatGeoBufに対応

投稿遅れてすみません
私のオープンソースGISを含んだ活動、Code for Historyの2023年のアップデートについて、[先の記事](https://qiita.com/kochizufan/items/60ad5e1d665e8a655d93)に書いたもの以外を書きます。

Toriiとは、QGISが使える技術者がいない現場でも、Excelで情報を更新すれば、QGIS（GeoJSON）との間でマルチマスタとして相互に情報を同期しつつ、Webなどで情報を公開できる形式にまで変換してくれる文化財情報管理ツールです。

https://github.com/code4history/Torii

2022年2月の研究報告人文科学とコンピュータ（CH）126でこれについて発表しています。

https://ipsj.ixsq.nii.ac.jp/ej/?action=pages_view_main&active_action=repository_view_main_item_detail&item_id=216327&item_no=1&page_id=13&block_id=8

実際の利用は、令和館林石造物悉皆調査や奈良地蔵プロジェクトで使われています。

https://code4history.dev/TatebayashiStones/

https://code4history.dev/JizoProject/

別にFlatGeoBufに対応する予定など特になかったのですが、[いわさきさんの記事](https://qiita.com/wata909/items/d1c443e5c8363cb33179)を読んで俄然FlatGeoBufに興味が出たので、対応してみました。

実際に対応してみた結果ですが、元々のデータサイズが大きくなかったこともありますが、それほどデータの圧縮効果はありませんでした。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/10108/864bff62-0dee-0df7-c626-e49522db12d1.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/10108/9c65e995-c54a-3bc3-6ebc-ebe9e3445329.png)
元々石造物の刻銘判読情報などテキストデータが多かったのでバイナリ化の恩恵が少なかったのと、あと現状の仕様ではObjectやArray型の属性値はテキストシリアライズした結果で格納されるようで、私のデータはバリバリ構造化データなので、これは相性悪いなと。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/10108/4173078b-5e86-cf14-6885-88ad49152464.png)
まあ、まだまだこれからの仕様じゃないかと思うので、将来のアップデートでObjectやArrayの属性値もバイナリ化したり、できるのかどうかわかりませんがテキストの属性値も圧縮データ化すればデータ量減らせるんじゃないのかな？とか思うので、将来に期待したいです。

[追記]
…というあたりをIssueに投げてみましたが、

https://github.com/flatgeobuf/flatgeobuf/issues/250

https://github.com/flatgeobuf/flatgeobuf/issues/251

別に否定的ではないのですが、

> I would rather suggest compressing the whole file to keep compression and format separate.

そういわれると確かにそうですよね、FlatGeoBufの主眼の強みは別にデータサイズを小さくすることじゃなくて、Byte Rangeアクセスで部分取得ができるようなクラウドフレンドリーな仕様であるところにあるのだし。
単に転送量を小さくするだけならHTTPサーバでgz圧縮かければ済むのだし、そう考えるとToriiでFlatGeoBufに対応する意味はあまりなかったのかな（表示サイトもRangeリクエストせずにFGBファイル全体読み込んでるし）。
まあせっかく対応したのでそのままつけておきます、Byte Rangeリクエストが必要になるようなでかいプロジェクトで今後使われるかもしれないし。

後いくつかの話題についても書こうと思っていたのですが（Overture Maps Foundationの話や、MaplatEditorをGISデータ対応させる話など）、ただでさえ投稿が遅れているし記事が長くなるばかりなので、今回はこのネタだけでおしまいにします。

それでは皆さん、よいお年を。
SpringBoot Nextjs 認可が必要なapiにアクセスできない　原因はSpringSecurityの設定

# 症状
ローカル環境においてNextjsからSpringBootのapiを使おうとしたところCORエラーになりました。
エラーになったapiは認可が必要であり、認可が不必要なapiはCORエラーになりませんでした。

認可はSpringSecurityを使っています。

# 開発環境
OS:windows10

バックエンド側：
IDE:IntelliJ Community
spring-boot-starter-parent 2.75
java　：　11

Postman:Windows版　検証用

フロントエンド：
IDE:VScode

├── @types/node@18.11.15
├── @types/react-dom@18.0.9
├── @types/react@18.0.26
├── eslint-config-next@13.0.6
├── eslint@8.29.0
├── next@13.0.6
├── react-bootstrap@2.7.0
├── react-dom@18.2.0
├── react@18.2.0
├── styled-components@5.3.6
├── styled-jsx@5.1.1
└── typescript@4.9.4

# 原因
SpringSecurityのCORの設定が未実施だったのが原因でした。
認可の不必要なapiが普通に使えたのはSpringSecurityのフィルターを経由しないで、SpringMvcにか使えたという(憶測)



# 解決方法
SecurityConfigを以下のように設定。
SpringSecurityのCOR設定をSpringmvc(@CrossOrigin)と同じようにすることができるようです。
``` SecurityConfig.java

        http.cors(withDefaults())

```

# 参考

https://spring.pleiades.io/spring-security/reference/servlet/integrations/cors.html
チート：paiza Python3

〇　目次
＃１　標準入力（空白区切りの文字列（１行）を配列に）
＃２　標準入力（空白区切りの文字列（複数行）を配列に）
＃３　標準入力（連続文字（１行）を１文字ずつ分割して配列に）
＃４　標準入力（連続文字（複数行）を１文字ずつ分割して配列に）
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
＃１　標準入力（空白区切りの文字列（１行）を配列に）

1 2 3　　　# 入力値（空白区切りの文字列）
↓
H = 1 ; W = 2 ; N = 3

```
H, W, N = map(int, input().split())
```
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
＃２　標準入力（空白区切りの文字列（複数行）を配列に）

1 2 3　　　# 入力値（空白区切りの文字列、１行目）
4 5 6　　　# 入力値（２行目）
↓
P = [[1,2,3],[4,5,6]]

```
H = 2　　　# 行数をＨとして
P = [list(map(int,input().split())) for _ in range(H)];
```
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
＃３　標準入力（連続文字（１行）を１文字ずつ分割して配列に）

ABCD　　　# 入力値（連続文字）
↓
S = ["A","B","C","D"]

```
S = list(input())
```
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
＃４　標準入力（連続文字（複数行）を１文字ずつ分割して配列に）

ABCD　　　# 入力値（１行目）
EFGH　　　# 入力値（２行目）
↓
S = [["A","B","C","D"],["E","F","G","H"]]

```
H = 2　　　# 行数をＨとして
S = [list(input()) for _ in range(H)]
```
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
以上
レバテックフリーランスを使ってみて

 # フリーランスになるにあたって

2023年1月をもちましてフリーランスとなることとなりました。
今回はレバテックフリーランス様を通し数ヶ月の契約を結んだので、メリット、デメリットを記載していきます。


## メリット

1.案件数が多い
今回フリーランスになるにあったて、エージェント三社とお話をさせていただきましたが、
圧倒的に案件数が多かったです。
他のエージェント様は面談をし、営業をしていただき、その上で案件を紹介してもらうのですが、さすがレバテックフリーランス様は大手なだけあって、案件が一覧でなってみれます。自分で案件をみて希望をだすこともできるし、
スキルセットから推薦もしてもらえる。ある程度のスキルセットがあれば案件には困らないでしょう。

2.スピーディー
エージェントとの面談から私の場合約2週間で案件が決まりました。早い。

3.単価交渉
他のエージェントさんは最低単価を聞くと、その最低単価で交渉してきます(怒)
なのでもしこれからエージェントさんを通し案件を探してもらう際はきっちり希望の単価を伝えましょう。
レバテック様は最低単価どころか市場単価を見極め数万単位で希望単価より上げていた抱くよう交渉をしていただいた。
これは他のエージェント様にはないメリットといえる。



## デメリット

１．契約
レバテックさんの契約は万が一作業でミスった時等、責任はすべてフリーランス側が負わされます。
ガッチガチな契約を結ばされるので、もし案件が決まったら契約書はしっかりと確認しておきましょう。
しかも、レバテックフリーランスさんは契約書の修正はしてもらえない。本当にこればっかりはひどい。

２．案件締結後
案件締結後もサポートがしっかりしすぎているのだが、私に取ってはこれがきつい。
何が悲しくて初回勤務時にレバテックさんに到着報告をしなきゃいけないのかと思いレバテックさんに抗議したところ報告義務ではないので
初回出社契約は不要とのこと。指揮命令系統はレバテック様にはないので当然ですね。


3.条件
条件も正社員バリのガチガチの契約。
営業日：カレンダー通り
服装:スーツ
一部リモート。
フリーランスなんだからもうちょっと自由に働きたい。
尚レバテック様はほぼカレンダー通りの案件しかない。週4や週3等を希望されるのであれば他エージェントをさがした方がよいでしょう。

## 総評
案件をスピーディーに探すとき、案件単価にこだわりたい時はレバテックフリーランスが良いと思う。
ただし、フリーランス側に不利な契約を結ばされるので、時間に余裕があるときは他エージェント様をおすすめする。

他エージェント様を利用する時は希望単価を伝えること。前職給与は伝えてはいけない。フリーランスには確定申告があるので正社員時代の給与を参照すると痛い目にあうこと間違いなし。
また真の意味で生活ギリギリの最低単価を伝えてはならない。安く買い叩かれるだろう。
ER図を基本からまとめてみた【mermaid】

## ER図とは

リレーションを図で表したもの

## IE記法

IE記法は、「○」「l」「鳥の足（3つ股の線）」という3つの記号を組合せて表現し、記号の意味は下記を参照する。３つの記号さえ覚えればIE記法のER図が書ける。

|  記号   |  意味  |
| -----  | -----   |
|  ○     |  0（ゼロ） |
|  l     |  1（イチ）|
|  鳥の足 |  多  |

## mermaidとは

シーケンス図やER図、ガントチャートなどを生成するためのライブラリ

## mermaid記法を使って、markdownで製図してみる

```mermaid
erDiagram
  Post {
    bigint id PK
    string title　FK
    string content　FK
    string timestamp 　FK
  }
```
```mermaid
erDiagram
  User {
    bigint user_id PK
    string title　FK
    string content　FK
    string timestamp 　FK
  }
```
```mermaid
erDiagram
  Check {
    bigint user_id PK
    string title　FK
    string content　FK
    string timestamp 　FK
  }
```



```mermaid
graph TD;
    スタート-->太陽の石入手;
    スタート-->銀の竪琴入手;
    スタート-->ロトの印入手;
    太陽の石入手-->虹のしずく入手;
    銀の竪琴入手-->雨雲の杖と交換;
    雨雲の杖と交換-->虹のしずく入手;
    ロトの印入手-->虹のしずく入手;
    虹のしずく入手-->竜王を倒す;
    竜王を倒す-->エンディング;
```


## 参考サイト
[データベース設計入門#1 リレーションとER図【11分でマスター！DB設計】](https://www.youtube.com/watch?v=T6g-DLWHscw)
[若手プログラマー必読！５分で理解できるER図の書き方５ステップ](https://www.ntt.com/business/sdpf/knowledge/archive_50.html)
[データベース設計-ER図を書いてみよう](https://www.edrawsoft.com/jp/what-is-er-diagram.html)
[Next.jsでキャッシュの無効化機能！GitHubでER図やシーケンス図を生成できるMermaidが利用可能に！100日後に退職する例の漫画が映画化](https://www.youtube.com/watch?v=VumKJXCgBII)
Red Hat OpenShift 研修コース DO101の受講開始と演習環境作成まで

Red Hat パートナーなら、Red Hat OpenShift 研修コース DO101 を無償で受講できます。受講開始と演習環境作成までを動画にしました。


[![DO101_thumnail](https://user-images.githubusercontent.com/11750755/209547132-e3ae128e-4b85-447d-bd75-2975a53ec9d9.png)](https://video.ibm.com/recorded/132423560)
cssで画像を回転させるアニメーション

⇒<a href="https://nonbiri3.com/?p=7785">実際に画像を回転させているページはこちら</a>

```html
<div>
	<style>
		* {
			padding: 0;
			margin: 0;
		}
		.base {
            //背景にグラデーション
			position: relative;
			background: linear-gradient(rgb(24, 176, 218), rgb(255, 255, 255));
			height: 500px;
			width: 100%;
		}

		.triangle img {
			animation: 3s linear infinite rotation1;
			width: 100%;
		}

		.f1 {
			position: absolute;
			top: 50px;
			left: 20%;
			width: 80px;
		}

		.f1 img {
			filter: hue-rotate(80deg);
		}

		.f2 {
			position: absolute;
			top: 150px;
			left: 40%;
			width: 240px;
		}

		@keyframes rotation1 {
			0% {
				transform: rotate(0);
			}

			100% {
				transform: rotate(360deg);
			}
		}
	</style>
	<div class="base">
		<div class="triangle f1"><img src="img.png"></div>
		<div class="triangle f2"><img src="img.png"></div>
	</div>
</div>
```
Safety systems in the motor vehicle,ボッシュ自動車handbook(英語)11版A.C.まとめ<19a>

Automotive Handbook Advent Calendar 2022

https://qiita.com/advent-calendar/2022/automotivehandbook

12/19 参加記事です。

なお、次の記事が飛んでいました。ごめんなさい。


Safety System,ボッシュ自動車handbook(英語)11版A.C.まとめ<18a>

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



ボッシュ自動車handbook(英語)11版(0-1) 課題と記事一覧new

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

<この項は書きかけです。順次追記します。>

# Contents
Motor vehicle, 28
Basic principles, 32
Mathematics and methods, 204
Materials, 258
Machine parts, 354
Joining and bonding techniques, 426
Vehicle physics, 462
Operating fluids, 538
Refrigerants for air-conditioning systems, 591
Drivetrain(駆動系), 594
Internal-combustion engines(内燃機関),642
Management for spark-ignition engines,800
Gasoline-engine operation with alternative fuels, 886
Management for diesel engines, 906
Electrification of the drive, 970
Chassis systems, 1108
Vehicle bodies, 1310
Comfort and convenience, 1392
Safety systems in the motor vehicle, 1410
Vehicle security systems, 1430
Automotive electrics, 1450
Vehicle electrical systems for hybrid and electric vehicles, 1560
Automotive electronics, 1620
Entertainment 1780
Drive assistance and sensors, 1804
Drive assistance systems 1872
Future of automated driving 1934
Appendics, 1940

# Safety systems in the motor vehicle
no. Number
p. page
v. views
g. goods.
s. stocks

現在作業中です。今しばらくお待ちくださいごめんなし。


|no.|	title|	P.|	v.|	g.|	s.|
|:--|:--|:--|:--|:--|:--|
|118|Safety Systems in the motor vehicle https://qiita.com/kaizen_nagoya/items/cb828ce15ec1543a2e5c|1410|98|0|0| 
|111|Occupant-protection systems https://qiita.com/kaizen_nagoya/items/54a13b7798bc3a0a9541|1416|98|0|0|
|112|Integral-safety systems https://qiita.com/kaizen_nagoya/items/c5c77d3f793ab6f77ca3|1424|87|0|0|


# 自己参考資料(self reference)

ボッシュ自動車ハンドブック 

https://qiita.com/kaizen_nagoya/items/8e330ce57880f04d71d9
ボッシュ自動車handbook(英語)10版　目次

https://qiita.com/kaizen_nagoya/items/57c799ff544c96efdea9

自動車工学とBosch Vehicle Handbook

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



# Advent Calendar 2022

今年企画した４つのAdvent Calendarと、それぞれの記事一つをご紹介します。

AUTOSAR Advent Calendar 2022

https://qiita.com/advent-calendar/2022/autosar

AUTOSAR References to ISO, IEC, ITU, IEEE, RFC and SEA etc.

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

Automotive Handbook Advent Calendar 2022

https://qiita.com/advent-calendar/2022/automotivehandbook

Basic principles, ボッシュ自動車handbook(英語)11版まとめ<2>

https://qiita.com/kaizen_nagoya/items/24a1ba5da3d09b2a95d1


2022 いいねをいただいた記事ランキング(O.K.版) Advent Calendar 2022

https://qiita.com/advent-calendar/2022/goods

2022年１月下旬　いいねをいただいた記事　16

https://qiita.com/kaizen_nagoya/items/0ee589a8edaeab24fd2a

AdCale(O.K.) Advent Calendar 2022

https://qiita.com/advent-calendar/2022/adventcalendar2022

「会議は15分未満」に。小耳にはさんだ話。

https://qiita.com/kaizen_nagoya/items/510c47c5d1e8d03145db

AdvencCalendar2022 報告

https://qiita.com/kaizen_nagoya/items/5b4b99cb9ad571f4094b

誤差の評価が苦手（専門分野以外）

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



 ＜この記事は個人の過去の経験に基づく個人の感想です。現在所属する組織、業務とは関係がありません。＞


# 文書履歴(document history)
ver. 0.01 初稿 　20221226


あ
intelligent headlamp control ボッシュ自動車handbook 11版(156) p.1928

On-board charger, ボッシュ自動車handbook 11版(127) p.1600

人生で影響を受けた本100冊。

https://qiita.com/kaizen_nagoya/items/16af53acbb147a94172e

に掲載した本のうち、「新人プログラマ応援」企画で「私の推薦書３３冊」として３３冊紹介した。

新人プログラマ応援　私の推薦書３３冊

http://qiita.com/kaizen_nagoya/items/98c62f051dbdb4f8aca2
残りの６７冊から、順に過去の読書感想を引用し、新たな読書感想文を追記する。

 <この項は書きかけです。順次追記します。>


# ボッシュ自動車ハンドブック version 11, 2022

Automotive Handbook  May 2, 2022

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

ボッシュ自動車handbook(英語)11版(0-1) 課題と記事一覧new

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

# Contents
Motor vehicle, 28
Basic principles, 32
Mathematics and methods, 204
Materials, 258
Machine parts, 354
Joining and bonding techniques, 426
Vehicle physics, 462
Operating fluids, 538
Refrigerants for air-conditioning systems, 591
Drivetrain(駆動系), 594
Internal-combustion engines(内燃機関),642
Management for spark-ignition engines,800
Gasoline-engine operation with alternative fuels, 886
Management for diesel engines, 906
Electrification of the drive, 970
Emission-control and diagnosis legislation, 1042
Chassis systems, 1108
Vehicle bodies,  1310
Comfort and convenience, 1392
Safety systems in the motor vehicle, 1410
Vehicle security systems, 1430
Automotive electrics, 1450
Vehicle electrical systems for hybrid and electric vehicles, 1560
Automotive electronics, 1620
Entertainment 1780
Drive assistance and sensors, 1804
Drive assistance systems 1872
Future of automated driving 1934
Appendics, 1940

# intelligent headlamp control,  1928
## Motivation
## System Designs




# Reference
参照なし　


# 自己参考資料(self reference)

ボッシュ自動車ハンドブック 

https://qiita.com/kaizen_nagoya/items/8e330ce57880f04d71d9
ボッシュ自動車handbook(英語)10版　目次

https://qiita.com/kaizen_nagoya/items/57c799ff544c96efdea9

自動車工学とBosch Vehicle Handbook

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

 ＜この記事は個人の過去の経験に基づく個人の感想です。現在所属する組織、業務とは関係がありません。＞

# 文書履歴(document history)
ver. 0.01 初稿 20221127
ver. 0.02 ありがとう追記 20230620
### 最後までおよみいただきありがとうございました。

いいね　💚、フォローをお願いします。

####  Thank you very much for reading to the last sentence.

Please press the like icon 💚　and follow me for your happy life.
interior monitoring systems, ボッシュ自動車handbook 11版(158) p.1932

interior monitoring systems, ボッシュ自動車handbook 11版(158) p.1932

人生で影響を受けた本100冊。

https://qiita.com/kaizen_nagoya/items/16af53acbb147a94172e

に掲載した本のうち、「新人プログラマ応援」企画で「私の推薦書３３冊」として３３冊紹介した。

新人プログラマ応援　私の推薦書３３冊

http://qiita.com/kaizen_nagoya/items/98c62f051dbdb4f8aca2
残りの６７冊から、順に過去の読書感想を引用し、新たな読書感想文を追記する。

 <この項は書きかけです。順次追記します。>


# ボッシュ自動車ハンドブック version 11, 2022

Automotive Handbook  May 2, 2022

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

ボッシュ自動車handbook(英語)11版(0-1) 課題と記事一覧new

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

# Contents
Motor vehicle, 28
Basic principles, 32
Mathematics and methods, 204
Materials, 258
Machine parts, 354
Joining and bonding techniques, 426
Vehicle physics, 462
Operating fluids, 538
Refrigerants for air-conditioning systems, 591
Drivetrain(駆動系), 594
Internal-combustion engines(内燃機関),642
Management for spark-ignition engines,800
Gasoline-engine operation with alternative fuels, 886
Management for diesel engines, 906
Electrification of the drive, 970
Emission-control and diagnosis legislation, 1042
Chassis systems, 1108
Vehicle bodies,  1310
Comfort and convenience, 1392
Safety systems in the motor vehicle, 1410
Vehicle security systems, 1430
Automotive electrics, 1450
Vehicle electrical systems for hybrid and electric vehicles, 1560
Automotive electronics, 1620
Infotainment 1780
Drive assistance and sensors, 1804
Drive assistance systems 1872
Future of automated driving 1934
Appendics, 1940

#  Ainterior monitoring systems,  , p.1932

## Camera-based interior monitoring
Figure 1 Camera-based interior monitoring

### Driver monitoring
### interior and occupant monitoring
### Safety and convenience
### Driver monitoring for automated driving





# Reference
参照なし

# 自己参考資料(self reference)

ボッシュ自動車ハンドブック 

https://qiita.com/kaizen_nagoya/items/8e330ce57880f04d71d9
ボッシュ自動車handbook(英語)10版　目次

https://qiita.com/kaizen_nagoya/items/57c799ff544c96efdea9

自動車工学とBosch Vehicle Handbook

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

 ＜この記事は個人の過去の経験に基づく個人の感想です。現在所属する組織、業務とは関係がありません。＞

# 文書履歴(document history)
ver. 0.01 初稿 20221118
ver. 0.02 ありがとう追記 20230620
### 最後までおよみいただきありがとうございました。

いいね　💚、フォローをお願いします。

####  Thank you very much for reading to the last sentence.

Please press the like icon 💚　and follow me for your happy life.
DockerでWordpressの開発環境を作ってみた

# 参考サイト

https://docs.docker.jp/compose/wordpress.html

# プロジェクトの構築

こちらを参考に解決

https://zenn.dev/marumarumeruru/articles/55173a98863d4e

使ったコマンドは

```
# dockerプロジェクト起動
$ docker-compose up -d

# dockerプロジェクト停止
$ docker-compose down --volumes

```

「One Press」っていうテーマ結構いいかも
生体認証か画面ロックどちらかを必須にする時の条件設定

## はじめに
Androidアプリでは、よりセキュアにするために生体認証を使うケースが存在します。
現在、AndroidXライブラリを用いた生体認証のダイアログは、ユースケースに応じて2種類設定できます。
- 生体認証ができない場合に、「PIN/password/パターン」といった画面ロック設定で代替可能とするダイアログ
- 生体認証を行うか、キャンセルのいずれかを行うダイアログ（画面ロックは代替手段として使えない）

今回は、生体認証・画面ロックのいずれかで認証を可能とする際の書き方についてです。

## 生体認証と画面ロックいずれかを必須とする設定

まず、Android10以下と11以上で以下のように設定を分ける必要があります。

```kotlin
val biometricPrompt = BiometricPrompt(this, executor, authCallBack)

val promptInfo =
    //OS11以上
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
        BiometricPrompt.PromptInfo.Builder()
            .setTitle(getString(R.string.biometric_title))
            .setAllowedAuthenticators(BiometricManager.Authenticators.BIOMETRIC_STRONG or BiometricManager.Authenticators.DEVICE_CREDENTIAL)
            .build()
    } else { //OS10以下
        BiometricPrompt.PromptInfo.Builder()
            .setTitle(getString(R.string.biometric_title))
            .setDeviceCredentialAllowed(true)
            .build()
    }

biometricPrompt.authenticate(promptInfo)
```


## 各種エラーをハンドリングする

アプリで生体認証やロック解除を使いたい場合、逆に言えば「生体認証やロック解除の設定がされていないアプリでは、使ってほしくない」ということになります。
では、どちらも設定されていない場合、適切に弾いてあげましょう。
今回はこのようにしました。

```kotlin
override fun onAuthenticationError(errorCode: Int, errString: CharSequence) {
    // 認証エラー
    super.onAuthenticationError(errorCode, errString)

    when (errorCode) {
        // PINと指紋を両方設定していない場合、この3つを通る可能性がある
        BiometricPrompt.ERROR_NO_DEVICE_CREDENTIAL,
        BiometricPrompt.ERROR_NO_BIOMETRICS,
        BiometricPrompt.ERROR_HW_NOT_PRESENT -> {
            //設定されてないときの処理
        }

        //ユーザーが明示的にキャンセルを押した時
        BiometricPrompt.ERROR_USER_CANCELED -> {
            //再度認証を求める、アプリの操作を続行できなくするなど
        }
    }
}
```

以下のようなエラーも存在はしますが、今回は通らない想定のため省いています。
> BiometricPrompt.ERROR_HW_UNAVAILABLE

これは何らかの理由で、生体センサーが無効になっている時のエラーです。
今回の仕様では「生体センサーが無効でも画面ロックの設定さえあればそちらが起動する」となっているため、特に気にしなくて良いと判断しました。

本当はスクショを見せたいんですが、OSによりスクリーンショットを塞がれていました。。。

これで生体認証もしくは画面ロック解除のいずれかを要求することができます。


## 引用

[生体認証ダイアログを表示する(https://developer.android.com/training/sign-in/biometric-auth?hl=ja)](https://developer.android.com/training/sign-in/biometric-auth?hl=ja)
vue.js 勉強

vue.jsでID：NAMEの格納データを箇条書きで一覧表示させる方法
（csvデータを一覧表示させたい場合はどうしたら良いんだろう？）

```html
<ul id="example">
    <li v-for="item in items">
        {{ item.id }} - {{item.name }}
    </li>
</ul>

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<script>
    var example = new Vue({
        el: '#example',
        data: {
            items: [
                {
                    "id": 1,
                    "name": "あああああ"
                },
                {
                    "id": 2,
                    "name": "いいいいい"
                }
            ]
        }
    })
</script>
```
Javaのラムダ式の例外ハンドリング(検査例外）に悩んだら。

### 悩んだこと

```java
    hogeSupplier.get(() -> {
        try {
            fugafuga();
        } catch(Exception e) {
            // Runtimeで投げる？何もしない？
            // 【問題】考えたり定義するのがメンドクサーーーーーーーイ
        }
    });
```

### 原因

* 原因はラムダ式ではなく、Java8 時点の `Supplier` が `throws Exception` になっていないから。
* :cry: <ラムダ式は検査例外扱えない～！
* とか勘違いしていた。
* あくまでもFunctionalInterfaceのシグニチャの問題だった。

### 解決した方法

* ならば `throws Exception` な `Supplier` を作ればいいじゃないのよ。

```java:ThrowableSupplier.java
@FunctionalInterface
public interface ThrowableSupplier<T> {
    T get() throws Exception;
}

```

* これを `ThrowableSupplier<String> s = () -> getString(xxx);` のように使えばOK。

* 今回は Supplier だけれども、Consumer、BiConsumer、Function、Predicate などなど... でも同様の捉え方でよしなにできますね。

#### ひとこと
* 標準APIにあるものを そのまま使って なんとかしなきゃ！という固定観念。こわいなー。

#### クールな解決法

* [Java8のラムダ式やStream APIでクールに例外を扱う](https://qiita.com/myui/items/6597087d6a0648ca1dec) が参考になります。
【合格体験記】AZ-104の試験対策について

# はじめに
「AZ-104: Microsoft Azure Administrator」に合格したので、合格体験記を記事にします。
なお、試験の詳細やAzure認定資格における本資格の位置づけなどは他の合格体験記で見飽きていると思うので、この記事では実際に行った勉強方法についてだけ共有します。
(個人的に合格体験記で皆さんが見たいのはそこだと思うので…)

# きっかけ
数か月前にAzureを得意とした部署に配属となり、Azureの知識を全般的につける必要がありました。(AZ-900は部署異動と同時に取得済み)
AZ-104はレベル的にはAssociateにあたるので、Azureの全般的な知識獲得が出来ることから目的にぴったりでした。

# 前提知識
参考までに僕のAzureの前提知識はAZ-900を取得済み、Azure portalを触り始めてまだ2ヶ月の初心者です。
今回の試験対策にかかった期間は1ヶ月ほどです。

# 教材
・**合格対策 Microsoft認定試験AZ-104:Microsoft Azure Administratorテキスト＆演習問題**
(https://www.amazon.co.jp/%E5%90%88%E6%A0%BC%E5%AF%BE%E7%AD%96-Microsoft%E8%AA%8D%E5%AE%9A%E8%A9%A6%E9%A8%93AZ-104-Microsoft-Azure-Administrator%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88%EF%BC%86%E6%BC%94%E7%BF%92%E5%95%8F%E9%A1%8C-ebook/dp/B09HT3HX8W)

実際に使用した教材はこれだけです。
udemyに試験対策問題集がありますが、解説がついていない問題があったり、udemy問題集を攻略するためだけの勉強になってしまいそうだったので、テキスト1冊のみで試験対策しました。
**しかし、テキスト1冊のみはおススメしません！！**
テキスト1冊だけでは正直試験範囲を網羅出来ていない部分もあります。


## テキストの使い方
勉強は以下の手順で実施しました。
①内容の理解はしなくていいので、一旦通読。(**章末問題と模擬試験は解かない！**)
※なるべく時間をかけすぎず、一気に読んでしまう方がおススメです。
②内容を理解できるように精読する。(**演習問題解きますが、模擬試験は解きません。**)
③②を2-3周繰り返して満足したら模擬試験を解く。
④模擬試験を解いて苦手分野だと感じた部分を重点的に復習。
⑤再度模擬試験を解いて、9割以上取れるようになったらいざ試験！！


# 試験を受けてみて
結果としては合格ライン700点に対して720点だったので、かなりギリギリの合格でした。ただ、テキスト1冊だけで750点程度なら取れる印象はありました。

あくまで個人的意見ですが、テキストだけで勉強した場合、パターン問題には強いと思います。
各々のサービスの機能、Azure portal上での設定の仕方、必要要件(Blobデータのアクセス層の構成には汎用v2 StorageかBlob Storageしかサポートしないなど)はテキストだけでインプットできますので、そういった問題には強いです。

それに対して、ケーススタディやシナリオ問題には弱いと感じました。
ケーススタディやシナリオ問題は問題演習を数多くこなして、解き方を身に着けていく必要があるコツがいる問題です。テキストのみでのインプットではどうしても解くのが難しいです。僕自身、試験当日にかなり苦戦して自信をもって解けた問題は少なかった印象です。
ケーススタディやシナリオ問題は問題演習こなすしかないので、udemyや問題演習用の参考書を活用して勉強することで得点源を増やせると思います。
結局、「テキスト1冊＋問題演習コンテンツ」というやり方が正攻法なわけですね…

# おわりに
今回のテキストオンリーの勉強方法は初めての試みでしたが、あまりおススメ出来ない方法です。試験では一部聞いたことがない言葉が出題されていたので、udemyの問題集などで補完したり、MS Learnを活用して出題範囲を詳細に網羅する必要があると思います。
やはり他の合格体験記にあるように問題演習を中心に試験対策する方が確実で知識吸収はいい気がしますね…
テキストの使い方は参考になるかと思いますので、Azure初心者でこれから試験を受けようかなと思う方はぜひ！！
なかなか茶色コーダから抜けられないという話

# 初めに
今年も年の瀬。
振り返ってみると緑になかなか届かない（というより茶色から抜け出せない）一年でした
![atcoder.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1894785/f59422ec-6b72-3d00-e0a4-f4568cbcbf68.jpeg)
初心に帰って
他の人の上達具合を読んでいると下記のリンク（水色だけど）に必要条件のようなものが書いてあった
https://qiita.com/e869120/items/eb50fdaece12be418faa#0-%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB

現在自分がどのくらいの状態なのかを判断するため
この記事の2-2-1～3あたりを身に着けているかどうか確認する。
なお、似たようなことをrustでちゃんと書いている人がいる
https://qiita.com/hossie/items/e170eb80f48cdb4f6b51
ふむふむという感じ。例を書いたり自分が知らんかったりするものは使わせてもらう。

#対応に関して
## 標準ライブラリ
以下が必要なライブラリは以下らしい
|C | rust | 把握 |
|:-----------|:------------|:------------:|
| abs|(-1).abs()|○
sin/cos/tan|(PI / 2.0).sin()|○
string|string、Chars|o、proconioの型で受ける
min/max|1.0.min(2.0)|○
swap|v.swap(0, 2)|○、index 指定であることに注意
__gcd|要自作|○
rand|use rand::prelude::*;|○
clock|std::time|×
reverse|?|要自作？
sort|v.sort()|○
vector|vec![]|o
stack|vec![]|o
queue|VecDeque|o
priority_queue|BinaryHeap|o
map|HashMap, BTreeMap|o
lower_bound|superslice::Ext|×
set|HashSet, BTreeSet|o
pair|(i32,i64)|o
tuple|(i32,i64)|o
assert|assert_eq!|o
count|v.iter().filter(\|&&x\| x == 1).count()|x
find|a.iter().find(\|&&x\| x == 2|o
next_permutation|superslice::Ext|x
__builtin_popcount|?|x
bitset |bitset_fixed::BitSet|x

後半は全然。

## 典型的なアルゴリズム
|アルゴリズム | rust | 把握 |
|:-----------|:------------|:------------:|
|全探索|色々|o
二分探索|v.binary_search(&2)|o
深さ優先探索 (DFS)|自作|o
幅優先探索 (BFS)|自作|o
動的計画法 (DP)|自作|o
ダイクストラ法|？|x
ワーシャルフロイド法|？|x
クラスカル法|？|x
高速な素数判定法|自作（エラストテネス）|o
べき乗を高速に計算する手法|自作|o
逆元を計算する手法|自作|o
累積和|自作|o

こっちは最短経路だけ完全に×

## データ構造
|アルゴリズム | rust | 把握 |
|:-----------|:------------|:------------:|
|グラフ|自作|o
|木|？|x
|unionfind|自作|o

こんな感じ。木はあんまり見ない気もする

とはいえ結構丸がついてる感じ。とりあえずreverseあたりの実装と最短経路は勉強していきたい。

来年は緑になってるといいなあ
LinuxとVsCodeでC# GUIアプリをデバッグする その２


## LinuxとVsCodeでC# GTK GUIアプリをデバッグする その２

前回

https://qiita.com/iota_11/items/77ef0f2947ba0023d57c

## launch.jsonに２行追加するだけでデバッグできる

#### アプリを毎回手動でビルドしなくても、自動でビルドした後にデバッグできるようになる

```
"program": "dllファイルまでのパスを記入",
"args": ["--project","プロジェクトファイルまでのパス"],
```
dllファイルまでのパスを記入。環境変数を確認　直接書いたほうが良い
argsに引数に--projetとprojectファイルまでのパスを記入する。
これでデバッグできることがわかりました。

``` lanuch.json

{ 
    "version": "0.2.0",
    "configurations": [
        {
            "name": ".NET Core Launch (console)",
            "type": "coreclr",
            "request": "launch",
            "preLaunchTask": "build",
            "program": "dllファイルまでのパスを記入する",
            "args": ["--project","プロジェクトファイルまでのパス"],
            "cwd": "${workspaceFolder}",
            "stopAtEntry": false,
            "console": "internalConsole"
        }  
    ]
}

```

続く
フリーランスになって思ったこと

# はじめに
こんちは！クリスマスは家で一人、Lサイズピザを貪りながら映画をホラー映画を3本ぶっ通しで見た私です！
毎年このアドベントカレンダーの時期になると一年間の振り返りをしてるんですが、今年は結構盛りだくさんな一年だったなぁと感じます。

そんな振り返りで一番大きかった出来事を話していこうかなと思います



<a id="#Chapter1"></a>
# 今年の出来事で大きかったこと

家庭環境が変わったり、家賃を折半することを条件に引っ越したのに同居人が家賃を一向に払わずいつ追い出そうか考えてたり、まぁ色々ありましたが何より、所属会社を退社しフリーランスになったことが一番デカかったなぁと思います。

<a id="#Chapter2"></a>
# フリーランス生活どう？

ぶっちゃけめっちゃ怖いっす。今後の見通しとか保障とか、自分の性格上あることないこと考えて不安になることが多いですねぇ。
保険料、税金、生命保険、、、諸々の支払いの請求書が降って沸いたようにある日ポストに投函されてたりします。
まぁ月々の支払だったりとかは決まってるので予想はできるんですが、額が額なのでやっぱり食らいますよね。

ここまでサゲ～まじ無理ぽよ侍なんですけど～な内容を話してきましたがまぁいいことも同じくらいありますよ
・収入は格段に良くなった
・副業としてほかにも案件の受注ができる（会社にもよりますが、会社に所属してると副業NGとかありますよね）
・強制的にお金周りに詳しくなる
・自分で生きてる実感がある

などなどですかね。

<a id="#reference"></a>
# フリーランスになる前の心構え＆なったばっかの時注意した方がいいこと
これは世のすべての業種のフリーランスに当てはまるものではないと思うので持論になってしまいますが以下は気を付けたほうがいいと思います

・フリーランスになることを目的にするのはNG。（なることではなく、なった後どんな仕事をしていきたいかを意識した方がいいと思います。焦ってフリーになるといろいろ死にます）
・つながりは大事にしてください。思わぬところから案件の依頼が来たりします。
・自分をアップデートし続ける努力をする癖をつけましょう。（技術を磨くのが理想ですが、毎日筋トレするとかでもいいっす。アップデートして力が付くって実績を感じられるようにしといてください）
・エンジニア、クリエイターは「自分の中での今できる最大限のポートフォリオ」を持っておくべきです。定期的にアップデートもしましょう。何なら名刺代わりにパッと出せるような形にしておくといいでしょう。
・健康に気を付けましょう。案件が重なると寝れなくなったりします。そう、私みたいにね。
・支払うものが非常に多いので、支払期限管理を徹底してください。癖付けといてください。
・フリーランスを考え出してからでもいいので確定申告や税金の仕組みを知っておいてください。
・健康保険の任意継続は支払期限を絶対守れ。（一日でも過ぎると失効する）
・生命保険は安いのでもいいから入っとけ。
・お金の勉強マジ大事。（私はこれが一番できてません）

とまぁいったんこんなもんですかね。なんか後半端的過ぎてさだまさしの関白宣言みたいになってしまいましたが、一番伝えたいのは「会社員時代よりも収入は増えるが考なきゃいけないことも同じく増える」ということですな

<a id="#reference"></a>
# 終わりに

ちょっと今年は強烈なほどタスクがパンパンなので短いですが本記事としてはまとめに入ります。

フリーランスの生活大変なんですけど、時には心躍るような案件に出会えることもあります。
自分一人で商売をする気苦労は並大抵ではありませんが、やり遂げた時、うわー生きてるわ！自分！脳汁ドバドバ！アバー！って思える気がします。
この記事が悩める会社員の助けになれば幸いです。

それでは、読んでいただきありがとうございました。ばいちゃ～！
【Android】CreationExtras must have a value by `SAVED_STATE_REGISTRY_OWNER_KEY`というエラーが発生した時の対処法

# エラーが発生した箇所
`hiltViewModel()`を使ってViewModelにDIを行おうとしました。

```kotlin
@Composable
fun SplashRoute(
    viewModel: SplashViewModel = hiltViewModel(),
    ...
) {
    val uiState by viewModel.uiState.collectAsState()
    ...
```

# エラーの内容

Gradle FileをSyncした際にはエラーは発生しなかったのですが、エミュレーターを使ってアプリを起動しようとすると、次のエラーを発生した後アプリがクラッシュしてしまいました。

```shell
FATAL EXCEPTION: main
    Process: com.takagimeow.xxx, PID: 30XXX
    java.lang.IllegalArgumentException: CreationExtras must have a value by `SAVED_STATE_REGISTRY_OWNER_KEY`
```

# エラーが発生した時のSDKのバージョン

Android StudioのFlamingoを使ってプロジェクトを新規作成したので、SDKのバージョンは`compileSdk`と`targetSdk`共に`33`に設定されていました。

```gradle
android {
    ...
    compileSdk 33

    defaultConfig {
        ...
        minSdk 24
        targetSdk 33
        ...
    }
    ...
}
```

# エラーが発生した時のGradleの内容

この時の、Hiltのバージョンとして以下の設定を使用していました。

```gradle
buildscript {
    ...
    ext {
        ...
        // Hilt
        hilt_version = '2.44.2'
    }
    ...
}
```

Hiltに関する依存関係については**build.gradle**にて次の内容にしていました。

```gradle
implementation "com.google.dagger:hilt-android:$hilt_version"
kapt "com.google.dagger:hilt-android-compiler:$hilt_version"
implementation "androidx.hilt:hilt-navigation-compose:1.0.0"
```

# 解決方法

同じような問題を発生した人がいないか探していると、次のStackOverFlowのページが見つかりました。

https://stackoverflow.com/questions/73302605/creationextras-must-have-a-value-by-saved-state-registry-owner-key

上記のページで回答されている内容と同じように、次の依存関係を**appディレクトリ配下**の**build.gradle**に追加しました。

```gradle
implementation "androidx.navigation:navigation-compose:2.5.1"
```

結果、無事に解決することができました。同じような問題が出て困っている場合は、試しに上記の依存関係を**build.gradle**に追加してみることをお勧めします。
Azure DevOpsの始め方

# はじめに
この記事ではAzure DevOpsで作業を始めるために最初に作成が必要なプロジェクトの作成までを簡単に説明します。

# Azure DevOpsとは？
Azure DevOpsではCI/CDをサポートするためのサービスが用意されています。
>Azure DevOps には、計画と開発からテストとデプロイまで、ソフトウェア プロジェクトを管理するためのサービスとツールの統合セットが用意されています。

参考：[Azure DevOpsサービスの概要](https://learn.microsoft.com/ja-jp/azure/devops/user-guide/services?toc=%2Fazure%2Fdevops%2Fget-started%2Ftoc.json&view=azure-devops)


Azureポータル上で提供されていると思っていたのですが、Azureポータルとは別のAzure DevOps用のポータルサイトがあるので注意です。
参考：[Azure DevOps](https://azure.microsoft.com/ja-jp/products/devops/)

# Azure DevOpsの開始
それでは早速Azure DevOpsのプロジェクトまでを作成してみます。
Azure DevOps には、 Microsoft アカウントまたは GitHub アカウントでサインアップできます。

## Organizationの作成
サインインができると最初にOrganization(組織)を作成します。
Organization(組織)とはAzure DevOpsを管理するためのグループでOrganization(組織)の中で複数のDevOpsプロジェクトの作成ができるようになっています。

>Azure DevOps の組織は、関連するプロジェクトのグループを編成および接続するためのメカニズムです。 例としては、事業部門、地域部門、またはその他の企業構造があります。 会社全体に対して 1 つの組織、自分用の 1 つの組織、または特定の部署用に個別の組織を選択できます。

参考：[Azure DevOps Organization(組織)とは](https://learn.microsoft.com/ja-jp/azure/devops/user-guide/plan-your-azure-devops-org-structure?view=azure-devops)

[新しい組織の作成]で作成します
![サインイン直後.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1293404/98ff9677-8512-773f-0ce5-5f2e37d85100.jpeg)

プライバシー保護やサービス規約に同意する場合は[continue]で実行します。
下のチェックボタンはDevOpsの最新のお知らせを受け取るかどうかのチェックボックスになりますので任意で選択します。
![組織の作成ボタン押下.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1293404/e5da3efc-d589-20e0-2b1b-a1f6a51938f9.jpeg)

dev.azure.com/のスラッシュ以下がOrganization(組織)名になります。任意の名前を記入します。
リージョンについては2022年12月現在はAzure DevOps データは、世界各地の次の8か地域で利用できます
今回は日本が含まれるアジア太平洋[East Asia]を選択しました。
* オーストラリア
* ブラジル
* カナダ
* アジア太平洋
* ヨーロッパ (EU)
* インド
* イギリス
* 米国 (US)
![組織名の作成.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1293404/da4d90ac-31e8-8cf7-b2db-d3c1b8a808c7.jpeg)

Organization(組織)の作成中画面
![組織作成中.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1293404/42083a34-d7de-0bed-edaa-bec0dc867868.jpeg)



Organization(組織)が無事に作成されると以下のようなページが表示されます。
![組織作成後のトップページ.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1293404/d8fc77cd-5f1d-3265-a907-5b4c98da6a03.jpeg)

## プロジェクトの作成

任意のプロジェクト名を記入し、[+ Create project]でプロジェクトを作成します。
![プロジェクトネーム作成.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1293404/bcbca761-68ad-9ec2-cc50-2ae8222f7a24.jpeg)

プロジェクトが作成されると以下のような画面が表示され、Azure DevOpsのサービスであるバージョン管理のReposやPipelinesのメニューが左に表示されます。
これでAzure DevOpsを利用する準備が整いました。
![プロジェクトトップ画面.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1293404/2b7ab48f-beaa-df37-0d0d-1d5f619f0d7f.jpeg)


# 最後に
以上がAzure DevOpsのプロジェクト作成手順になります。
ここからAzure Reposを利用したバージョン管理やPipelinesを使用したビルド/テスト/リリースの自動化を作成することが可能になります。
Azure DevOpsのその他の機能の利用方法については別途まとめたいと思います。
VSCodeの実行


### とりあえず実行をするための手順
<br>

**VSCode**でフォルダを作成し、ファイル名.csの拡張子をつけることで言語を`C#`にできたはいいが、プロジェクトがないと言われるため、そこからコードを実行することが出来なかった。

###### 以下、実行する方法

拡張機能：
.NET Core Test Explorer
のインストールが必要になる。

画面上部のツールバー：ターミナル → 新しいターミナルでターミナルが開ける。
ターミナル画面↓

```ps
PS C:\Users\.......\App>
```
<br>
1. コンソールプロジェクトを作成

```ps
>dotnet new console
```

2.ビルド＆実行

```ps
>dotnet run
```

<br>
これでとりあえず実行することができた。


<br>
<br>
AWS SDK V3 のDynamoDBで、いくつか動作確認した話（AWS SDK V2 → V3 移行Tips）

# はじめに

https://qiita.com/Syoji_Yonemoto/items/e619d8199b7c8354248f

V3移行の動作確認の初手に、Firehoseを選んだせいかもしれないですが、V2で使ってたメソッドの互換があるか保証がないことが分かったので、普段、Lambdaで利用するAPIについては一通り、動作確認をしていっています。

今回は、DynamoDB編です。

# 結論

DynamoDBに関しては、私が普段使うメソッド群については、問題ありませんでした。

# V2 と同じ使い方で問題なく動作確認できたメソッド

+  putItem
+  batchGetItem
+  query
+  updateItem
+  updateTable

# 余談
性能試験や、TTL未実装の時などには、createTableやdeleteTableも実行していた時もありましたが、日常的に使う物でもなく、その時がきたら追試をします。

# まとめ
DynamoDBくらい主要どころになると、しっかり下位互換もされているようです。
引き続き、小ネタシリーズとして、 V2 → V3 の動作確認メモを書いていこうと思います。

# AWSの相談・お困りごとありましたら、、、

AWSの活用方法や、お困りごとの相談、随時、お仕事の受付しております。

https://www.cs-cloud-aid.com/
[Swift]遅延処理（asyncAfter）をキャンセルする

# はじめに
時間差で処理を実行したい場合に使う`asyncAfter`の処理を、何らかのアクションでキャンセルしたい場合の方法を紹介します。

# コード
```Extension.swift

extension DispatchQueue {
    
    func cancelableAsyncAfter(deadline: DispatchTime, execute: @escaping () -> Void) -> DispatchWorkItem {
        let item = DispatchWorkItem(block: execute)
        asyncAfter(deadline: deadline, execute: item)

        return item
    }
}
```

`DispatchWorkItem`を返す関数をextensionに追加します。

```ViewController.swift
final class ViewController: UIViewController {
    private var item: DispatchWorkItem?

    // 省略

    func hoge() {
        item = DispatchQueue.main.cancelableAsyncAfter(deadline: .now() + 5.0, execute: {
            // 何らかの処理
        })
    }

    func fuga() {
        if let item = item {
            item.cancel()
        }
    }
}
```

classで保持している`DispatchWorkItem`のインスタンスにextensionで追加した`cancelableAsyncAfter`の返り値を代入します。

`asyncAfter`をキャンセルしたい箇所で`fuga()`を実行してあげるとキャンセルすることができます。

ちなみに、遅延処理を実行する前はキャンセルすることはできますが、処理が実行された状態で中断することはできないようです。
自宅内サーバーを無料（タダ）で全世界に公開する方法

# はじめに
この記事は[東京高専プロコンゼミ① Advent Calendar 2022](https://adventar.org/calendars/8370)の12日目の記事です。
※今日は26日ですが、さっき枠を取ったので問題はないです。

大まかな流れを説明するだけです。細かいところは自分で調べてください。

**この記事は、自宅ネットワーク内でしか使えないサーバーに外からアクセスするための物です。SEOはたぶんダメダメなので注意してください。**

# 大まかな流れ
1. ドメインの取得
2. DDNSに登録
3. ポートの開放など

## 注意点
※IP更新時の自動通知機能のあるルーターを使わないと面倒な可能性があります。
※DDNSによってはサブドメインがあるのでドメインの取得はいらない可能性があります。
※自宅のwifiの危険が危ないです。
※ルーターによって使えるDDNSのサイトが制限されることがあります。
※**最後に細かい流れがあるので、基本はそれに従ってください。**

# ドメインの取得
ドメインの取得にはかの有名なお名前ドットコムが有名ですが、この世にはFreeドメインというものもあります。
[freenom](https://www.freenom.com/ja/index.html)や[dottk](http://dot.tk/ja/index.html)などのサイトが有名です。

https://qiita.com/Tomoki_OIOI/items/5b4092c3adb6052bc72f

https://qiita.com/zakky/items/a1ff8af60415e05956e4

https://nw.myds.me/synology/dynu/

ここら辺を参考に頑張ってください。

追記 by 2024/12/6
freenomなどは起訴により停止していたと思うので注意

# DDNSに登録
`DDNS`とは`Dynamic Domain Name System`の略で、名前の通り、グローバルipが固定されていないネットにつないでいるサーバーでも、サイトを全世界に公開できるサービスです。（一般家庭は固定されていません。）
[No-ip](http://www.noip.com/)や[Dynu ddns](https://www.dynu.com/)などがあります。

https://kuritaroh.com/2021/03/05/ddns_noip/

https://www.akakagemaru.info/port/dyndns.html

# ポートの開放など
自宅のルーターに、一部のポートに対して外部からのアクセスを許可することと、プライベートipアドレスの固定などがいります。ハッキングされる可能性があるので設定は慎重に行いましょう。

https://isecj.jp/blog/tech-ddns/

https://bouhancamera-choice.com/networkcamera-connect

# 細かい流れ
※紹介してリンク以外のサイトもじゃんじゃん使ってください。
1. ルーターに応じてDDNSサーバーを選ぶ
2. DDNSサーバーに独自ドメインが必要なら無料ドメインを取得する
3. ポート開放をする
これで終了です！

みんなもサイトを作ってみよう！！
slackへの通知をおこなうshell script

## はじめに
Slackへの通知をshell scriptで実行する方法を記載しています
難しいことは何もしていませんが、低リスク低コストで何かしらの通知機能を実装しようというときに参考になるかもしれません

## 実行結果
- 実行
```bash
# 1回目
bash notify_via_slack.sh
# 2回目
bash notify_via_slack.sh "this message." WARN "my user" ":ram:"
```
- 出力
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129204/c5b8d0e2-52ec-6b43-7bea-afd677567296.png)


## 実装内容
- コアはこの部分  
```bash
# Call Slack API
res=`curl -m 60 -sS -X POST ${WEBHOOKURL} --data-urlencode \
    "payload={\"channel\": \"${CHANNEL}\", \"username\": \"${USERNAME}\", \"text\": \"${TEXTLINE}\", \"icon_emoji\": \"${ICON}\"}"`
exit $?
```
- 全量  
```bash
#!/bin/bash
# Load Slack config
CONFIG_FILE="./slack.config"
if [ ! -f "${CONFIG_FILE}" ]; then
  exit 1
fi
source ${CONFIG_FILE}

# Arguments
TEXTLINE=$1
LEVEL=$2
USERNAME=$3
ICON=$4

# Check Arguments
if [ -z "${TEXTLINE}" ]; then
  TEXTLINE="Please input \$1:string of notify slack message"
fi
if [ -z "${LEVEL}" ]; then
  LEVEL="INFO"
fi
if [ -z "${USERNAME}" ]; then
  USERNAME="notify user"
fi
if [ -z "${ICON}" ]; then
  ICON=":rotating_light:"
fi

# Check Alert Level
if [ "${LEVEL}" != "INFO" -a "${LEVEL}" != "WARN" -a "${LEVEL}" != "ERROR" ]; then
  echo "Please input \$2:string of notify level(INFO/WARN/ERROR)"
  exit 2
fi

USERNAME=${USERNAME}'('${EXEC_ENV}/${REGION}')'
TEXTLINE=${LEVEL}' : '${TEXTLINE}
if [ "${LEVEL}" != "INFO" ]; then
  TEXTLINE='<!channel> \n'${TEXTLINE}
fi

# Call Slack API
res=`curl -m 60 -sS -X POST ${WEBHOOKURL} --data-urlencode \
    "payload={\"channel\": \"${CHANNEL}\", \"username\": \"${USERNAME}\", \"text\": \"${TEXTLINE}\", \"icon_emoji\": \"${ICON}\"}"`
exit $?
```

## 使用手順
### 通知先のSlackワークスペースの準備
Slackに関する操作は調べてください、以下の2つのことをおこないます  
- slackのワークスペースに投稿先のチャンネルを用意する
- slackでIncomming Webhookのアプリを作成する

### configファイルの作成
`slack.config`ファイルを同じパスに作成します
- `REGION`,`EXEC_ENV`
  どこで実行したかがわかるように指定します（クラウド利用で開発環境や本番環境の複数ある想定です）
- `CHANNEL`
  Slackの投稿先を指定します
- `WEBHOOKURL`
  Slackのアプリを作成すると取得できますのでここに指定します
```config
REGION=tokyo-region
EXEC_ENV=dev
CHANNEL="#xxxx"
WEBHOOKURL=https://hooks.slack.com/services/xxxxx/xxxxx/xxxx
```
## スクリプトの実行
各引数に指定する内容は次のとおりです

- $1 : 投稿するメッセージ
- $2 : 通知の種類、INFO/WARN/ERRORのいずれかのみ指定が可能。INFO以外を指定すると`@channel`が付く
- $3 : 投稿するアプリのユーザー名
- $4 : 投稿するアプリのアイコン
```bash
bash notify_via_slack.sh "this message." WARN "my user" ":ram:"
```

## さいごに
一度の投稿で大量の文字列を送ろうとすると途中で切れてしまいますのでご注意ください
使っていただけたら嬉しいですが、利用される際はご自身の責任のもとご利用ください
【PHP】stdClassのオブジェクトの値を取得したいとき（Call to undefined method stdClass::hoge() の対処法）

## やりたいこと

LaravelでDBから返ってきたstdClassのオブジェクトの値を取得する際、エラーが出てしまったのでメモです。

以下の場合に、'2022-12-04'を取得したい。

```
// 取得したデータ
$latestDate = array (
    0 => 
    (object) array(
       'MAX(users.created_at)' => '2022-12-04',
    ),
)
```
## エラーが出た

いつものように以下のように書くと、エラーとなりました。
```
echo $latestDate[0]->MAX(users.created_at); //Call to undefined method stdClass::MAX() {"exception":"[object] (Error(code: 0): Call to undefined method stdClass::MAX() at …
```

`MAX()`がプロパティ名ではなく、メソッドだと認識されてしまっています。

## 解決策

プロパティ名を`{''}`で囲うと取得することができました。

```
echo $latestDate[0]->{'MAX(users.created_at)'}; //'2022-12-04'
```

## 参考

https://qiita.com/Yorinton/items/2ef447d2c699e2fcdda1
[React] Componentの条件分岐をswitchを使わずに書く


# 今までswitchを使ってこんな風に書いてた

```typescript
const Pags : NextPage: () => {
  const { pageState } = useContext(PageStateContext);

  const TemplateComponent: FC = () => {
    switch(pageState) {
      case 'initial':
        return <InitialTemplate>;
      case 'confirm':
        return <ConfirmTemplate>;
      case 'complete':
        return <CompleteTemplate>;
      default:
        return <></>;
    }
  }

  return <TemplateComponent />;
}
```

# 今日教えてもらった書き方

```typescript
const Pags : NextPage: () => {
  const { pageState } = useContext(PageState);

  return (
    {
      ['initial']: (<InitialTemplate />),
      ['confirm']: (<ConfirmTemplate />),
      ['complete']: (<CompleteTemplate />),
    }[pageState]
  );
}
```

# 疑問
これは、、文法的には何っていう書き方なんだろうか。。。

# ソース
[ここから](https://stackoverflow.com/questions/46592833/how-to-use-switch-statement-inside-a-react-component)取ってきたらしい。defaultの時の書き方も書いてある。
VPCピアリングとNATゲートウェイが混在する環境でハマった件

AWSを触っていてめちゃくちゃハマったところをまとめました。
エンジニア初心者だからこそ、気づきにくい部分多かったです。
何かしらの参考になれば！！！

# 結論:VPCピアリングとNATゲートウェイがある環境で、パブリックサブネットのルートテーブルにインターネットゲートウェイとピアリングのルート、プライベートサブネットのルートテーブルにNATゲートウェイのルートしかない場合、プライベートサブネットから他VPCへ行く通信はNATゲートウェイを通る

まず下記のような構成は珍しくないと思います。
![スクリーンショット 2022-12-26 18.10.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/878032/d5043af0-7b5b-83b6-3788-2278f85390ba.png)
全てのルートテーブルにピアリングのルートがあるパターンです。
ピアリングにルートがある場合、直接的にVPC間の通信が行われます。


しかし、下記のような構成ならどのように通信するのでしょうか？
![スクリーンショット 2022-12-26 18.08.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/878032/96948e3b-6f63-4201-60c9-03937eb82f4a.png)
パブリックサブネットのルートテーブルにのみ、ピアリングへのルートがある場合です。
私は最初、この場合Natゲートウェイを通過せず、なんとなくルーティングがうまくいって、異なるVPCのプライベートサブネット間で通信ができていると考えていました。



しかし、実際はNatゲートウェイを経由していたのです。
![スクリーンショット 2022-12-26 18.26.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/878032/cef0a4ec-595e-d5ea-992c-1f29ee5c7fe9.png)
プライベートサブネットのルートテーブルには、宛先がない通信はNatゲートウェイに行くルートがあるため、プライベートサブネット内のインスタンス等が、VPCピアリングを通じて通信したい場合、まずNatゲートウェイに通信が行きます。

Natゲートウェイでは接続タイプがpublic、privateとありますが、いずれかでも送信元IPアドレスの変換が発生し、そのIPアドレスはNatゲートウェイのプライベートのIPとなります

https://docs.aws.amazon.com/ja_jp/vpc/latest/userguide/vpc-nat-gateway.html

ここでややこしくなるのがセキュリティグループです。
例えば図の右のプライベートサブネットで、図の左のプライベートサブネットからの通信のみ許可するなどの制限をかける場合、許可する対象はNatゲートウェイのプライベートIPとなります。

このような構成の場合、プライベートサブネット内のインスタンス等に制限をかけにくくなる、具体的なパフォーマンスの指標はありませんが、通信速度が低下する可能性があります。

このような構成の場合、プライベートサブネット内のインスタンスのIpで制限かけても意味ないんですよね。。。。。
めちゃくちゃハマりました。。。。。
CAP & Fiori Elements: List Reportの一覧にアイコンと色設定

検索結果一覧項目にCriticalityとしてアイコン表示と色変更をします。
FioriでUI作成はほとんどやったことなかったので、調べた内容をメモすべく記事書きます。

この「Status with Help」項目
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/134273/44357613-53ab-c791-4adf-8eb90b631829.png)

# 前提
以下で設定したローカル環境および実装した内容が前提です。

https://qiita.com/FukuharaYohei/items/d18c995807eb26165553

https://qiita.com/FukuharaYohei/items/18f9560f6db622bb4d1d

# 手順
## UIアノテーション変更
今回はUIアノテーション変更のみです。ファイル`srv/cat-service-ui.cds`を変更します。
一番下のLineItem以下が対象です。
コメントアウトした`CriticalityRepresentation: #WithoutIcon,`を有効にするとアイコンが非表示です。

```typescript: srv/cat-service-ui.cds
annotate CatalogService.Books with {
    ID             @title: 'ID';
    title          @title: 'Title';
    stock          @title: 'Stock';
    statusHelp     @(
        title : 'Status with Help',
        Common: {ValueList: {
            CollectionPath: 'Statuses',
            Parameters    : [
                {
                    $Type            : 'Common.ValueListParameterInOut',
                    LocalDataProperty: statusHelp_ID,
                    ValueListProperty: 'ID'
                },
                {
                    $Type            : 'Common.ValueListParameterDisplayOnly',
                    ValueListProperty: 'text'
                },
            ]
        }}
    );
    statusDropDown @(
        title                          : 'Status with Dropdown',
        Common.ValueListWithFixedValues: true,
    );
}

annotate CatalogService.Books with @(UI: {
    SelectionFields: [
        ID,
        title,
        stock,
        statusHelp_ID,
        statusDropDown_ID,
    ],
    LineItem       : [
        {Value: ID},
        {Value: title},
        {Value: stock},
        {
            Value                    : statusHelp_ID,
            Criticality              : statusHelp_ID,
//            CriticalityRepresentation: #WithoutIcon,
        }
    ]
});
```

# おまけ
## Initial Load
テストしていると画面表示時に検索済にしたいことも多いです。
Fiori ToolsのApplication Information画面からListReportを開き、Tableに対してInitial Load を「Enabled」に設定することで検索済みにできます。
※雑ですいません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/134273/82add535-0649-f249-3e4d-ecea4a76e623.png)
Anthos for 逸般の誤家庭でライブマイグレーションができた

先日書いた　**[Anthos for 逸般の誤家庭： ～Anthos VM Runtimeで遊ぶ～](https://qiita.com/jyoshise/items/bde77a5d909da4a4bc9c)** の続きです。
VMのライブマイグレーションができなかったのですが、できるようになったのでその顛末。

## 何がまずかったのか
こんなオチでしたよ・・・

https://twitter.com/jyoshise/status/1606334636132814850

そのせいで
```
internal error: Attempt to migrate guest to the same host 03000200-0400-0500-0006-000700080009
```
というエラーが出て `virt-launcher`が落ちていました。はじめは、同じホストにマイグレートしようとしている？なに言ってんだこいつ？ぐらいに思っていたのですが・・・

## というわけでどうにかしなければならない

通常物理ホストでlibvirtdを起動する際は、ホストのUUIDをどこから拾ってくるかは `/etc/libvirt/libvirtd.conf` で指定できます。以下のように親切な説明書きもあります。
```libvirtd.conf
###################################################################
# UUID of the host:
# Host UUID is read from one of the sources specified in host_uuid_source.
#
# - 'smbios': fetch the UUID from 'dmidecode -s system-uuid'
# - 'machine-id': fetch the UUID from /etc/machine-id
#
# The host_uuid_source default is 'smbios'. If 'dmidecode' does not provide
# a valid UUID a temporary UUID will be generated.
#
# Another option is to specify host UUID in host_uuid.
#
# Keep the format of the example UUID below. UUID must not have all digits
# be the same.

# NB This default all-zeros UUID will not work. Replace
# it with the output of the 'uuidgen' command and then
# uncomment this entry
#host_uuid = "00000000-0000-0000-0000-000000000000"
#host_uuid_source = "smbios"
```

ですがKubeVirtの`virt-launcher`のコンテナにはそういう選択肢はなく、`dmidecode -s system-uuid` の出力が使用されるようです。したがって
- DMIを書き換える
- コンテナを改造する

の2択となります。いや正しくは **UUIDが重複しているようなあやしい製品を使うな** という話なんですが。

## なにをしたか

いろいろ紆余曲折を経て、最終的にはAMI（このPCのBIOS）のDMIを書き換えるEFIツールを入手して、UUIDの書き換えに成功しました。ライセンス的に微妙かもしれないので詳しくは書きませんが、成功したツールは `AMIDEFIx64.EFI` というものです。これをUSBに入れてEFIシェルに入り
```
AMIDEFIx64.EFI /SU "AUTO"
```
でランダム生成されたUUIDがセットされました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103746/ac1a5167-7cee-9356-39ac-77a912230bee.png)

## でライブマイグレーション

VM自体は前の記事でライブマイグレーションできるように作っていたので、
```
kubectl virt migrate <VM名>
```
とやるだけです。すんなり動きました。SSH接続も切れません。

https://asciinema.org/a/547828

ちなみにWindowsの仮想マシンも作ってみました。

https://cloud.google.com/anthos/clusters/docs/bare-metal/latest/vm-runtime/windows-vm

で、負荷がかかった状態でもライブマイグレーションは動作するのかを確かめるべく、リモートデスクトップ接続したVM上のChromeでヒカキンのYouTubeを見ている状態でライブマイグレーションを発動させるというアホなことをやってみたのですが、さすがにこれは多少時間がかかり、RDP接続も切れました。切れてから再接続できるまで1分ぐらいかな。再接続したらChromeのプロセスも終了していました。

## 結論
- ライブマイグレーションは動作する
- どこまで「ライブ」かは状況による

良いお年を。
Hexabase APIのuse_display_idの使い方

Hexabaseは企業向けにBaaS（Backend as a service）を提供しています。データベースやファイルストア、認証などを提供することで、フロントエンドエンジニアだけでも企業向けシステムを開発可能にします。

HexabaseではAPIをREST API、そしてGraphQLで提供しています。今回はこのAPIの中で登場するuse_display_idについて解説します。

## ディスプレイIDとは

Hexabaseでは幾つかの機能について、IDを利用しています。

| 機能 | ID名 |
|------|------|
| プロジェクト | プロジェクトID |
| データストア | データストアID |

どちらも管理画面にて確認できます（執筆時点で管理画面変更中につき、アプリケーションID/データベースIDとなっています）。このIDは開発者の方が、自由に付けられる名称になります。英数字と幾つかの記号（スペース/_/-など）が利用できます。また、日本語名や英語名も自由に付けられます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/197026/98f19011-ee79-b52b-23bb-16b59ba3f253.png)


## 検索時などでの指定

そして、このIDを検索条件に使う場合にはAPIを呼ぶ際にuse_display_idパラメーターをtrueにしてください。例えばデータストアのアイテム詳細を取得する際には次のようにします。

```graphql
query(
  $datastoreId: String!,
  $datastoreItemDetailParams: DatastoreItemDetailParams,
  $itemId: String!,
  $projectId: String
) {
  getDatastoreItemDetails(
    datastoreItemDetailParams: $datastoreItemDetailParams,
    datastoreId: $datastoreId,
    itemId: $itemId,
    projectId: $projectId
  ) {
    title
    rev_no
    field_values
    status_list
    item_actions
    status_actions
    status_order
    status_action_order
    item_action_order
  }
}
```

パラメーターは以下のような形です。

```json
{
  "datastoreId": "Task",
	"datastoreItemDetailParams": {
    "format": "map",
    "use_display_id": true // <- ここ
  },
	"itemId": "635108665a0adcf0808fa221",
	"projectId": "Task Manager"
}
```

この `use_display_id` を付けることで、 `Task Manager` や `Task` といった名称が使えるようになります。 `false` だと `Request failed with status code 500` が発生するので注意してください。

## まとめ

数字で指定すると、後でどのプロジェクトだったのか、正しいテーブルを指定できているのか分かりづらくなります。 `use_display_id` を `true` にしていても数字で指定した検索は可能なので、特に制約がない場合には `use_display_id` を `true` にしておくのをお勧めします。
npm run　コマンドが実行できない

reactファイルを開こうとした際にエラーが表示された際
初歩的なミスでかなり解決に時間がかかったのでまとめます。

エラー画面
```
npm ERR! missing script: dev
npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/kouki/.npm/_logs/2022-12-26T04_04_16_519Z-debug.log
```

実行コマンド
```
npm run dev
```

解決策
scriptにdevのコマンドがないと記入してあるので、
package.jsonファイルに原因があるのでは？
と仮定して設定系の異常を確認していたのですが問題なし。
結論、npm run devを実行するディレクトリが間違っていただけでした。
基本的な事ですが、コマンドを実行する際は
初めに実行するディレクトリの位置を確認するべきだということを
再認識しました。