OmniAICreator/Qiita-1.07M huggingface dataset:
2022/8/30主にITとかセキュリティの記事

「WordPress」のOAuth認証プラグイン2件に認証回避の脆弱性
https://www.security-next.com/139282

子供をサイバー脅威から守る「Mac」の設定方法とは？(8/28)
https://news.mynavi.jp/techplus/article/20220828-2435595/

Twilioフィッシング攻撃はOktaになりすました大規模キャンペーンの一環──Group-IB報告(8/27)
https://news.nicovideo.jp/watch/nw11351513

LastPassの開発環境に不正アクセス、ユーザーデータは影響なし(8/28)
https://www.zaikei.co.jp/article/20220828/687048.html

「原神」のアンチチート機能をマルウェア攻撃に悪用　トレンドマイクロが事例を発見(8/27)
https://news.infoseek.co.jp/article/itmedia_news_20220827055/?tpgnr=it

CT Analysis 『2022年8月 Ethereum Name Service (ENS) 解説レポート』を無料公開(8/27)
https://crypto-times.jp/ct-analysis-35/

Windows 11が重いときの原因は？　高速化する方法は？(8/27)
https://otona-life.com/2022/08/27/133183/

国交省、2023年の車検証電子化に合わせて特設サイト開設(8/27)
https://www.zaikei.co.jp/article/20220827/687024.html

IT企業から「虎の子」を取り上げる中国当局　アルゴリズム収集し統治強化か(8/27)
https://www.epochtimes.jp/2022/08/114854.html

「デジタルＧメン」知られざる闘い◆レベルアップする海賊版、次の標的は…【時事ドットコム取材班】(8/28)
https://www.jiji.com/jc/v8?id=202208lv3-kaizokuban-team

IPv6基礎検定ベータ試験が10月9日に実施、合格者は全員第一号として認定(8/26)
https://news.mynavi.jp/techplus/article/20220826-2435503/

テレワーク利用者の健康管理法　4割超が「散歩」、2割超が「ストレッチ」(8/29)
https://xtech.nikkei.com/atcl/nxt/mag/nc/18/020600010/081900122/

国家支援のサイバースパイが暗躍
ランサムウエア攻撃は「見せかけ」　狙いは企業の知的財産や機密情報(8/29)
https://xtech.nikkei.com/atcl/nxt/mag/nnw/18/041800012/081800183/

見た目が斬新な「Nothing Phone（1）」、ハイエンドに近い仕様で6万円台は魅力(8/29)
https://xtech.nikkei.com/atcl/nxt/column/18/00093/00127/

政府検討のスマホアプリ「サイドローディング」義務化、セキュリティーは大丈夫か(8/29)
https://xtech.nikkei.com/atcl/nxt/column/18/00086/00226/

全国初、鹿児島県肝付町がネット接続の条件「無害化」にグーグルを選んだ理由(8/29)
https://xtech.nikkei.com/atcl/nxt/column/18/00001/07099/

みずほFGがセキュリティー・トークンの実証実験を開始、サンドボックス制度を活用(8/29)
https://xtech.nikkei.com/atcl/nxt/news/18/13513/

インターネットを使って社内ネットワークにアクセス、「VPN」とは(8/29)
https://xtech.nikkei.com/atcl/nxt/column/18/01679/063000069/

日程調整サービス（Schedule Adjustment Service）(8/29)
https://xtech.nikkei.com/atcl/nxt/mag/nc/18/020600009/082200122/

悪質・巧妙な不正続々　日本のECが危ない(8/29)
https://xtech.nikkei.com/atcl/nxt/mag/nc/18/020600014/082400124/

新会計システムで電帳法対応　月30箱分の伝票送付を不要に(8/29)
https://xtech.nikkei.com/atcl/nxt/mag/nc/18/020600004/082400111/

恐怖の「ゴーストタッチ攻撃」 電磁波で他人のスマホを触らずに操作(8/29)
https://xtech.nikkei.com/atcl/nxt/mag/nnw/18/041800013/081700056/
Proxy下でCypressのnpm installがエラーになるので個別ダウンロードしてinstallした話

テストを実施しようと
Proxy下でcypressをnpm installしようとするとエラーになる。

以下Proxy通すなど何やってもできない。。
https://docs.cypress.io/guides/references/proxy-configuration#Set-a-proxy-on-Linux-or-macOS

```
npm install cypress -D
```

ただある日同じことするとエラー発生せず。できた。なぜ？？

あと
https://download.cypress.io/desktop/9.0.0?platform=darwin&arch=x64
からcypress.zipをダウンロードして、

CYPRESS_INSTALL_BINARY=~/Downloads/cypress.zip npm install cypress --save-dev

で実行できるらしい。
GNOME Boxesでコピペとファイル共有する方法

GNOME Boxesで作ったLinux MINTの仮想マシンに、ホストから文字をコピペしたいと思いました。

そのままコピー＆ペーストで、ホストから仮想マシンに貼付を行ってもできませんでした。

Boxesの仮想マシンの仮想マシンのプロパティで、共有できる方法が書かれてあることを知りました。
![ワークスペース 1_016.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/20977/178ebc3a-e377-04c5-5826-4f175896b330.png)

SPOCEゲストツールというものを検索したら、下記のページを見つけました。

https://furuya7.hatenablog.com/entry/2022/08/09/092343#

この記事の中で、ファイル共有とコピペのパッケージのインストールを知りました。

コピペができるようになるパッケージ
```bash
sudo apt-get install spice-vdagent 
```
ファイル共有のパッケージ
```bash
sudo apt-get install spice-webdavd 
```
パッケージのインストール後は、再起動してください。

デバイスと共有のタグで、一番下にフォルダを追加出るようになります。
![範囲を選択_004.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/20977/82137e4e-cb58-ad6b-c46d-9d0decdf18d8.png)
＋をクリックすると、フォルダの追加が出来ます。
パスと追加するフォルダ名を、設定するウィンドウが表示されます。

ホストのフォルダには、予め使用するフォルダを新規作成しておいてください。

今回仮想マシンとホストの間でコピペやファイル共有できるようになったので、とても便利になりました。
Android初心者の開発備忘録

# はじめに

　Androidのアプリ開発がしたかったものの、作ってみたいアプリにはroot化が必要であるということ以外、Androidについて何も知らなかったので、適当にAndroidを買いました。んで買ったのがSHARPのSHV45 AQUOSとかいう(未だに良いのかどうかも知らない)物でした。改めて調べていくと分かったことなのですが、

**やだ、SHARPちゃん、root化できない？**

　まぁ、そんなわけで泣く泣く普通に開発を頑張ろうとしたAndroid初心者の備忘録です。。。

# 開発者向けオプション

　Androidはまずは開発者オプションをオンにしなければ話が始まりません。
　というわけでその流れを一応説明しておきます。

歯車マークの設定アプリを開く
↓
「デバイス情報」タブを開く
↓
**「ビルド番号」と書かれた欄を連打しまくる**
↓
USBデバッグモードをオンにする

　簡単ではありますが、初心者には案外見つからない操作でした。

# adbコマンドのインストール

　色んなサイトの参考にadbコマンドが使われているので、Windowsでシェルが使えるようになるための操作を紹介します。
　ちなーadbってのはAndroid Debug Bridgeの略らしいですよ。

https://developer.android.com/studio/releases/platform-tools

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/bb71cc16-d6af-30b6-82ab-beca87ae406c.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/587efa14-fb6f-1342-3f57-8734d71f6810.png)

 SDK Platform-Tools for Windowsをダウンロードから、利用規約を了承してダウンロードします。ダウンロードされたzipフォルダを解凍します。
　そのフォルダをCドライブの直下などに移動させます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/6d159e21-92d9-24b5-068b-a35a5a452f86.png)

　そのplatform-toolsまでのパスを、Cドライブ直下の場合で言うとC:\platform-toolsのパスをコピーしておきます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/c43d49f8-705f-23cc-0443-dd4280e3f96f.png)

　Windowsの検索機能で「環境変数を編集」をクリック。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/d42d4fc8-2fb9-308c-1e31-adc4e942cebf.png)

　ユーザーの環境変数か、もしくは全ユーザーで共有したいのならシステム環境変数の「Path」を「編集」しましょう。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/5041dcf6-221d-5754-d1ad-eeee6304db18.png)

　「編集」を開けば、「新規」を押して、先ほどコピーしたパスをペーストします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/d548a9db-fae5-4f82-391f-94b375419d1d.png)

最終形↑

　システム環境変数の編集を行った場合、再起動が必要だったりするみたいです。なので必要なら再起動してください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/3d2cc41e-8f81-4f8e-810d-3a68a8e022da.png)

　Windows検索欄からでも何でもいいのでコマンドプロンプトを開いて、adbコマンドを実行してみて、なんか長い説明文が出てくれば実装成功です。

# adbコマンドを試す

　adbコマンドを試すにはUSB接続をしてから、「ファイル転送」をチェックしなくてはいけないそうです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/3c989d9e-5f4d-a7b4-8bad-60158a0b0a98.png)

```
adb devices
```

　とコマンドプロンプトで試してみれば

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/29f299b8-c7d3-229f-5729-597e9a58ac00.png)

　よく分からない結果が返ってきます。

# 終わりに

　root化が出来ないと嘆いてからの流れでしたが、基礎中の基礎にして当たり前の内容を紹介しただけでしたね。参考元のサイトが優秀で色々なAndroidの可能性も見せてくれたのですが、次のような表がありました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/919ffec4-f196-db26-19fd-6886c3fd9dcc.png)

　Androidだけでadbコマンドを実行する方法です。
　・・・っぱroot化に対策がされてるのってなんだか良く分からないですよね。
　まぁ、多数にとってアプリ開発とかデバイス開発とかで遊ぶって発想がないのは分かりますが、自由は縛らず開放しておいて欲しいものでした()


# 参考
https://sp7pc.com/google/android/34263
(Rails)carrierwave【ファイル名のみ表示方法】

<h2>carrierwaveでのファイル名のみの指定方法について</h2>

```
cost[:costsfile]
→test.xlsx

cost.costsfile
→/uploads/cost/costsfile/16/test.xlsx
```
・"[:~]"なのか".~"によって異なる。
・ネットで検索してみてもこのような内容がないためログとして投稿。
【Angular】公式チュートリアルの理解６ (デプロイ)

# はじめに
https://qiita.com/s-umbys/items/adaae2e8b3e66a941c70

前記事でユーザ入力フォームを作成しwebアプリとして完成した。
今回はAngular公式チュートリアルの最後である`デプロイ`について行っていく。`デプロイ`とはコードをコンパイル、ビルドしてwebサーバ上に乗せて一般に公開することである。公開するのは前セクションまでStackBlitz上で編集し行っていたものである。今回はまず、ローカルで実行できるようにした後に本番環境での実装を行う。

# 前提条件
ローカルで実行するには下記2点が必要である。
- [Node.js](https://nodejs.org/en/ "Node.js")
- [Angular CLI](https://angular.io/cli "Angular CLI")

Angular CLIは下記コマンドでターミナルからインストールする。
```sh:ターミナルでの実行
npm install -g @angular/cli
```
Angular CLIをインストールすることで、これまでコンポーネントやサービスなどを生成してきた`ng`コマンドが使えるようになる。
※npmコマンドとはNode Package Managerの略でNode.jsのモジュールを管理するもの。Node.jsをインストールすると使用できるようになる。

# アプリケーションをローカルで実行する
公式ドキュメント通りに、StackBlitz上のソースファイルをローカルにダウンロードする。

```sh:ディレクトリに移動（名前は何でも良い）
cd angular-ynqttp
```
```sh:
npm install
```
npmパッケージのダウンロードとインストールは上記コマンドで行う。オプションを付けることでどのパッケージをインストールするか指定できるが、今回は簡単のため指定せずインストールする。
```sh:ローカルで実行するためのコマンド
ng serve
```
```sh:ポート番号の指定
ng serve --port 4201
```
`ng serve`コマンドでローカルで実行できる(ローカルサーバの起動)。実行するとURLがターミナル上で表示されるのでアクセスして起動を確認する。
このコマンドの実行中はこれまでと同様にホットリロード機能が働き、ソースの変更が自動で反映される。


# アプリケーションのビルドとホスティング
続いて、本番環境でのビルドを行う。
```sh:本番環境で実行するためのコマンド
ng build
```
このコマンドを行うと、`dist`フォルダが作成されることを確認する。このフォルダの中にはJavaScriptファイルが格納されており、実際に編集してきたTypeScriptがコンパイルされ、実行に最適化された結果である。[第一回の記事](https://qiita.com/s-umbys/items/46fc7c051a6456c6f4c8 "【Angular】公式チュートリアルの理解１ (入門)")のTypeScriptの説明に記述したとおりである。

ここまで理解できたら十分であり、ドキュメントの最後にFirebase、Google Cloud、App Engineなどのサーバにホスト(配置)すれば実装可能と書いてあるが、実際の実装は今回は割愛する。サーバごとに方法は異なるがサーバの設定をし、`dist/my-project-name`フォルダの内容を記述すれば実装できると知っていれば問題なく、各自で調べて実装するのも良いと思う。

# おわりに
全6回に渡ってAngularの公式ドキュメントのハンズオンを行ってきた。公式ドキュメントのみでは理解がなかなか難しい部分を補足しながら進めたので、何かの助けになれば嬉しく思う。私自身もまだ初心者であり、私自身の所感であることが多々あるため間違っていたりしたら指摘をお願いします。今後私も振り返りを行う中でアップデートを続けていきたい。では。
Linux ipコマンドについて（自分用メモ

●ipコマンド

ip オブジェクト コマンド [値]

■オブジェクト
・addr(a,ad) IPv4、IPv6アドレス
・link(l,li) ネットワークデバイス
・neighbour(neighbor,n,nei)　IPv4のARPキャッシュ、IPv6のNDキャッシュ
・route(r,rou) ルーティングテーブル

routeオブジェクトに対する操作では、値としてデフォルトルートを意味する「default」を指定できる

■代表的なコマンド
・add(a,ad) 値の追加
・del(d,de) 値の削除
・show(s,sh) 現在の状態を表示


ipコマンドは、オブジェクト（機能）に対して、コマンド（処理）を指定する形式で実行。オブジェクトやコマンドは短縮して指定することも可能。なお、各オブジェクトごとに指定可能なコマンドは異なる。

■
※インタフェースを有効化・無効化するには、linkオブジェクトにsetコマンドを発行。

ip link set インタフェース up|down


●
例）routeオブジェクトにdelコマンドを発行し、経路情報を削除する

ip route del 宛先ネットワークアドレス/サブネットマスク長 [via ゲートウェイアドレス [ dev 出力インタフェース ]]

サブネットマスク長はドット付き10進数表記でも表記できる。
【AWS SAA 頻出擁護】 スループットとレイテンシ

## 最初に
9月にAWS SAAを受験することで学習を進めていたが「スループット」と「レイテンシー」というワードが頻出したため備忘録としてまとめさせていただきます。

## スループット
端的にいうと「単位時間あたりに処理ができる量」のこと。
今回のように ITの分野でいくのであれば、コンピュータシステムが単位時間に実行できる処理の件数や、通信回線の単位時間あたりの実効伝送量などを意味します。

高ければ高いほど、単位時間あたりの処理件数が増えるので性能が良いと言える。

## レイテンシ
端的にいうと「リクエストしたときにレスポンスが帰ってくるまでの時間」のこと。
つまり、通信の遅延時間のことです。

つまりレイテンシが低いほど、遅延時間が少なくなるので高性能と言えます。

Webサイトのゲームやアプリなどのは即効性を求められるので、スループットよりもレイテンシが重要となってきます( ~~実際ゲームで遅延時間長いとイライラしますしね~~ )。


## 最後に
基本的にはスループットとレイテンシはトレードオフの関係にあります。
SAAで頻出するワードですね、AWSのサービス以外にもここら辺は抑えておくといいと思います。

最後まで記事を見ていただきありがとうございました。
tensorflowがインストールできないだと！？

## 文字認識を自作しよう！
と意気込んだものの、初っ端から「tensorflow」がインストールできないという事態にはまったので、脱出策としての記録を残します。

脱出ということで、これを聴きながら
https://www.youtube.com/watch?v=GG5sv3iKlDw

## はまったこと

発生エラーは下記のようなものでした
```エラー内容.txt
pip install tensorflow
>>>ERROR: Could not find a version that satisfies the requirement tensorflow
>>>ERROR: No matching distribution found for tensorflow
```

端的にいえば、PCに入っている「python」のバージョンが「tensorflow」ライブラリに対応していなかったということ。
そんなことって、あるの！？

と思いましたが、「python」のバージョンは「3.7.2」でした。

::: note info 
現時点の最新版は「3.11」であり、「tensorflow」ライブラリは、大体3世代くらいが公開されてインストールできるようになっているぽいです

現時点でいえば、ざっくり「3.8　～　3.10」の間とか。
:::

ただし、最新すぎても同様に「tensorflow」ライブラリに対応していない場合もあるので、ここはひとつ「3.9」をインストールすることにしました。

## Pythonのインストール

公式サイトよりインストーラをダウンロードし、インストールも実施！
https://www.python.org/downloads/

インストール時に「パスの追加」みたいなチェックを入れ忘れた気がしてけど、まぁ大丈夫っしょ。
気持ちを新たに「pip」コマンドをと。

・・・。

あれ、同じエラーじゃないの。

```エラー内容.txt
pip install tensorflow
>>>ERROR: Could not find a version that satisfies the requirement tensorflow
>>>ERROR: No matching distribution found for tensorflow
```

pythonのバージョンを確認すると「3.7.2」のまま。

## パスの追加
これは忘れないようにしないとだめでした。

インストール時の指定を忘れたので、下記の2つを手動でPathに追加（3.9が3.7よりも上にくるように設定）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/998522/7c2121a1-88e9-b398-3225-a077f01bb9c3.png)


これにより、無事に「tesorflow」がインストールできました。
VueRouterのバージョン指定してインストールする

VueRouterのインストール
プロジェクトフォルダを開いた状態で、下記コマンドを実行。
```console.
npm install vue-router
```
これだと、最新のvue-routerがインストールされてしまう。

vue-routerのバージョン指定してインストールしないと、
正しい環境構築にはならず不要なエラーを招く原因になる。
（今回はバージョン3.5.3を指定）
```console.
npm install vue-router@3.5.3 --save --legacy-peer-deps
```
![スクリーンショット 2022-08-30 0.00.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/223785/ef9b048c-f3ed-d999-aefa-b253f543be4f.png)
【Linux】Linuxコマンドまとめ

## 背景
- Linuxコマンドを全然覚えない自分のために、使用したLinuxコマンドをまとめておきたい。

## 目標
- 使用したLinuxコマンドをまとめていく。

## Linuxコマンドまとめテーブル
|コマンド  |説明  |
|---|---|
|$ls | 現在のディレクトリのファイル一覧　|
|$ls -a | 現在のディレクトリのファイル一覧（隠しファイル含む） |
|$cd .. | 一つ上のディレクトリに移動する  |
|$cd [path] | 指定のpathに移動する |
|$pwd | 自分が現在いるpathを表示する |
|$whoami | 自分のユーザー名を表示する |
|$find [ファイル名] | ファイルを検索する |
|$source [ファイル名] | ファイルのスクリプトを実行する |

## 補足
- 自分がわかりやすいように書いているので、色々間違ってるかもしれません。

## 参考資料

https://atmarkit.itmedia.co.jp/ait/articles/1611/30/news016.html

https://eng-entrance.com/linux-command-find

## 個人ブログ

https://takuma-tech.com/2022/09/27/196/
BigQueryのUNPIVOT演算子でテーブルを横持ちから縦持ちにする

# はじめに
横持ちテーブルを縦持ちにしてデータを見やすくしたり扱いやすくしたりしたい時がありました。
BigQueryでUNPIVOT演算子を使うと簡単に縦持ちにできたのでその方法を書いてみます。

# 横持ちテーブルを縦持ちテーブルに
以下のような横持ちテーブルを縦持ちテーブルにしたいと思います。

| member | address1 | address2 | address3 | tel1 | tel2 | tel3 |
|-----------|------------|------------|------------|------------|------------|------------|
| 太郎 | 太郎の住所1 | 太郎の住所2 | 太郎の住所3 | 080-0000-1111 | 080-0000-2222 | NULL |
| 次郎 | 次郎の住所1 | 次郎の住所2 | NULL | 080-1111-1111 | 080-1111-2222 | 080-1111-3333 |

```
SELECT
  member
  ,column_name
  ,value
FROM
  MEMBERS
UNPIVOT (
  value
  FOR column_name
  IN (
  address1
  , address2
  , address3
  , tel1
  , tel2
  , tel3
  )
);
```
↓
| member | column_name | value |
|-----------|------------|------------|
| 太郎 | address1 | 太郎の住所1 |
| 太郎 | address2 | 太郎の住所2 |
| 太郎 | address3 | 太郎の住所3 |
| 太郎 | tel1 | 080-0000-1111 |
| 太郎 | tel2 | 080-0000-2222 |
| 次郎 | address1 | 次郎の住所1 |
| 次郎 | address2 | 次郎の住所2 |
| 次郎 | tel1 | 080-1111-1111 |
| 次郎 | tel2 | 080-1111-2222 |
| 次郎 | tel3 | 080-1111-3333 |

カラムの値がNULLの場合は除外されるため、UNPIVOTの後ろに「INCLUDE NULLS」をつけます。
| member | address1 | address2 | address3 | tel1 | tel2 | tel3 |
|-----------|------------|------------|------------|------------|------------|------------|
| 太郎 | 太郎の住所1 | 太郎の住所2 | 太郎の住所3 | 080-0000-1111 | 080-0000-2222 | NULL |
| 次郎 | 次郎の住所1 | 次郎の住所2 | NULL | 080-1111-1111 | 080-1111-2222 | 080-1111-3333 |

```
SELECT
  member
  ,column_name
  ,value
FROM
  MEMBERS
UNPIVOT INCLUDE NULLS (
  value
  FOR column_name
  IN (
  address1
  , address2
  , address3
  , tel1
  , tel2
  , tel3
  )
);
```
↓
| member | column_name | value |
|-----------|------------|------------|
| 太郎 | address1 | 太郎の住所1 |
| 太郎 | address2 | 太郎の住所2 |
| 太郎 | address3 | 太郎の住所3 |
| 太郎 | tel1 | 080-0000-1111 |
| 太郎 | tel2 | 080-0000-2222 |
| 太郎 | tel3 | NULL |
| 次郎 | address1 | 次郎の住所1 |
| 次郎 | address2 | 次郎の住所2 |
| 次郎 | address3 | NULL |
| 次郎 | tel1 | 080-1111-1111 |
| 次郎 | tel2 | 080-1111-2222 |
| 次郎 | tel3 | 080-1111-3333 |

# さいごに
公式ドキュメントにはこの記事で取り扱わなかったオプションがたくさん書かれてあるので
いろいろ試してみたいと思います。

https://cloud.google.com/bigquery/docs/reference/standard-sql/query-syntax#unpivot_operator
【Python】Pythonライブラリの保存先の参照方法

## 背景
- pipでinstallしても、ModuleNotFoundError:となることがある。
- Pythonのライブラリの保存先を参照し、正しい場所にライブラリをinstallしたい。

## 目標
（1）Pythonのimportの参照先のpathを特定できるようになる。
（2）pipで好きなpath（場所）にライブラリを保存できるようになる。

## importの参照先と指定場所への保存方法
1. Pythonのimportの参照先のpathを特定できるようになる。
・sys.pathを使用する。

2. pipで好きなpath（場所）にライブラリを保存できるようになる。
・pip -t の後に保存したい場所のpathを記載する。

![ライブラリの保存先.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2651220/882e5ea8-4f35-9aaf-f717-adae328457c4.png)

## 補足
- importの参照先の追加方法もそのうち追記したい。

## 参考資料

https://qiita.com/ophhdn/items/4d3ecc6354d92b7ac0ba

https://note.nkmk.me/python-import-module-search-path/

## 個人ブログ

https://takuma-tech.com/2022/09/28/294/
【react-dropzone】accept属性を指定して受け入れファイルタイプを限定してエラーメッセージも表示させる

個人的な備忘録です。

画像のアップロードについては筆者の以下記事をご参照下さい。

https://qiita.com/tak001/items/73d04d57bdcc57e81dd3


# 環境
- react: 18.2.0
- next: 12.2.3
- react-dropzone: 14.2.2
- @chakra-ui/react: 2.2.4

# やりたいこと
- react-dropzoneを使って、受付可能なファイルタイプを限定する
- Finder || Explorer での選択時は、指定ファイル以外選択できない
- 指定ファイル以外をドラッグ&ドロップした時はエラーメッセージを表示させる

# 完成イメージ
![Untitled.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/399610/32778cd5-3822-3338-f6a7-fc3e437ae68d.gif)

# サンプルコード
- useDropzone へ accept オブジェクトを記述する

```tsx
import { Img } from '@chakra-ui/react';
import { useState } from 'react';
import { useDropzone } from 'react-dropzone';
import styles from './contents.module.scss';

export const Contents = () => {
  // ブラウザ表示用の paths
  const [previewImagePaths, setPreviewImagePaths] = useState<string[]>();

  // 選択された画像を処理
  const onDrop = (acceptedFiles: File[]) => {
    // 指定外のファイルがあれば、何も処理をしない
    if (isDragReject) {
      return;
    }
    const dataUrls = acceptedFiles.map((file) => URL.createObjectURL(file));
    setPreviewImagePaths(dataUrls);
  };

  // 弾かれたファイル情報が、fileRejectionsに代入される
  // ドラッグ&ドロップ時に Reject ファイルがあれば、isDragReject が true になる
  const { fileRejections, isDragReject, getRootProps, getInputProps } = useDropzone({
    onDrop,
    // accept属性値の指定
    accept: {
      'image/jpeg': [],
    },
  });

  const fileRejectionItems = fileRejections.map(({ file, errors }) => (
    <>
      <div>
        {errors.map((e) => (
          <p key={e.code}>
            {file.name}は許可された拡張子ではありません
          </p>
        ))}
      </div>
    </>
  ));

  return (
    <>
      <div className={styles.contents}>
        <div {...getRootProps({ className: 'dropzone' })}>
          <input {...getInputProps()} />
          <p>
            Drag and drop some image files here, or click to select image files
          </p>
        </div>
      </div>
      {previewImagePaths &&
        previewImagePaths.map((image, i) => (
          <div key={i}>
            <Img src={image} />
          </div>
        ))}
      {fileRejectionItems}
    </>
  );
};
```


# 参考文献
https://react-dropzone.org/#!/Accepting%20specific%20file%20types
StableDiffusionの出力結果を修正出来るデモサイト

# StableDiffusionの出力結果を修正できるデモサイトを作りました。

http://ailab.nama.ne.jp/
から、日本語文章→イラスト生成AIのデモンストレーションにジャンプします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/595605/40134dfb-97ae-6050-3731-a7fe9b440652.png)

文章を入力して、画像を生成します。
↓は「湖に浮かぶボート」で生成した画像です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/595605/28ae0974-0ba6-f807-593e-e06c0e0ecb14.png)

さらに下にスクロールすると、キャンバスに上書きできるので、気に入らない場所を塗りつぶします。
JaveScriptが動いていないと思ったときは、ページをリロードしてください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/595605/79852ffe-81fa-cb1b-46c9-5936bbeee0ef.png)

消えて無くなりました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/595605/21ca5664-eac4-8586-d9ff-115343cf1a4c.png)

## これは何か

もう想像出来ているでしょうけど、Diffusionモデルのinpainting機能を使っています。
なので、周りに合わせて消すことは得意ですが、別の何かを書き足すのは不得意です。
書き足したものの境界線をイイ感じにするには使えそうなので、それ用のデモもそのうち作りたいと思います。

ほかにも、ファンタジー風の風景を生成して、

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/595605/c88e4af6-bfd6-cd7b-b782-a9c753fc74bb.png)

いらない通行人だとか、よくわからないグチャッとした出力を塗りつぶして、

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/595605/0a4c19aa-b9c8-23f6-d9b5-a23050606a30.png)

キレイにします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/595605/21b76e01-9f51-559c-bccc-6d5d9f964e54.png)

うん、このくらい出力できれば、ゲームの背景とかの実用用途でも使えるレベルになるんじゃないでしょうか。

しかし最近のAIは凄いな。
StableDiffusionはA100 GPUを256個（8個×32クラスタ）使って学習したとあるし、もうスパコン並のリソースがないとついて行けないのでしょうか。
個人で色々とモデルを作っている人としては一抹のさみしさも感じる次第です・・・
useMemoってなんだ

## はじめに
Reactのことなんもわからんので、調べていきます。

## useMemoとは

React hookの一つ。

変数や関数をメモ化(一時メモリに保存)し、処理を簡略化することである。

useMemoはレンダー中に実行されるため、通常実行しない処理はuseEffectで行いましょう。またレンダーを実行させないためなら、コンポーネントを分割しましょう。**useMemoはパフォーマンス最適化のために使うもの**であり、意味上の保証があるものだと思わないこと。

## 使い方

```tsx
const [number, setNumber] = useState(0);

const expensiveFunction = (n: number) => {
  console.log("function re-rendered");
  let total = 0;
  for (let i = 1; i < n; i++) {
    total += i;
  }
  return total;
};
const sum = useMemo(() => expensiveFunction(number), [number]);
```

## まとめ

パフォーマンスを切り詰めるために使うものであり、無闇に使うものではない。よく考えて使おう。

## 参考
https://ja.reactjs.org/docs/hooks-reference.html#usememo

https://www.youtube.com/watch?v=6-BfMpTT2PE&
ブリッジ接続 とは

## 勉強前イメージ

飛び越えた感ある

## 調査

### ブリッジ接続 とは

ブリッジングとも呼ばれますが、2つのネットワークを接続して一つのネットワークにすることをこう呼びます。
リピーターハブやブリッジなどの機器を使ってネットワークを連結させます。
すべての信号を中継するため、ブロードキャストドメインは同一になります。
ネットワークセグメントを超えて使うことのできないDHCPサーバも利用可能です。

イメージとしては以下がブリッジ接続になります。

![12022-08-29 # ブリッジ接続 とは - diagrams.net - Google Chr.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129517/bab9c96f-dcd4-cc85-e92e-13f9284066ee.png)


## 勉強後イメージ

ちゃんと調べたら知ってるやつやったw

## 参考

- [ブリッジ接続 【bridge connection】 ブリッジング / bridging](https://e-words.jp/w/%E3%83%96%E3%83%AA%E3%83%83%E3%82%B8%E6%8E%A5%E7%B6%9A.html)
- [ブリッジとは | 分かりやすく図解で解説](https://medium-company.com/%E3%83%96%E3%83%AA%E3%83%83%E3%82%B8%E3%81%A8%E3%81%AF/)
GTMにクリックイベントを設定するときのポイント

# クラスの付け方

### ポイント

トリガーに設定するクラスはクリックする要素がimgタグの時、クリックする要素自体はimgタグの周りにあっても、imgの外側のdivタグのクラスをトリガーに設定しても画像のクリックイベントにならない。

```html
<div class="hoge">
  <img class="gazou" src="img/gazou.jpg">
 </div>
```

上記の様な場合、`hoge`クラスをトリガーにしても良さそうだが、イベントが発生するのは`gazou`クラスでないとダメ
firewalld とは

## 勉強前イメージ

CentOS7からのfirewallって感じ

## 調査

### firewalld とは

linux用のfirewall管理ツールになり、パケットの送受信で指定したルールに基づいて通信の許可・拒否を制御するものになります。
iptables同様、linuxカーネルのnetfilterと呼ばれるサブシステムの管理インターフェースとして稼働します。
firewall `d` にはUNIXの命名慣習のシステムデーモンにはdを末尾につけることに従ってつけられています。
firewalldとiptablesは共存できないようになっています。

また、CentOS6でのiptablesにはいくつか課題がありそれがfirewalldでは解決されています。
iptablesの課題は簡単に以下のようです。

- 設定反映にサービスの再起動が必要なので、ネットワークの瞬断が発生
- 設定は仕組みを深く理解しないと難しい書き方である
- 一時的なルールの設定はできず、その都度書き換え

上記の課題がfirewalldになり、以下のように解決されました。

- 設定反映にサービスの再起動が必要なので、ネットワークの瞬断が発生
	- 停止せずに反映できる
- 設定は仕組みを深く理解しないと難しい書き方である
	- 簡単に設定を変更できる
- 一時的なルールの設定はできず、その都度書き換え
	- 一時的と永続的な設定方法を管理できる

### firewalldの設定について

firewalldはiptablesより簡単に変更できると↑で書いています。
その理由としては、iptablesではフィルタリングルールは一つ一つ書く必要がありました。
しかし、firewalldではフィルタリングルールをまとめてグループ化したゾーンというものが用意されていて
それを使うこともできるし、オリジナルで作ることもできます。
そのゾーンは以下になります。

- public : サーバとして最低限必要な受信の許可するルール
- work : 業務PCの利用を想定したルール
- home : 家庭用PCの利用を想定したルール
- internal : linuxを使ってfirewallを構築するのに使うルールで、内部ネットワークのインタフェースに設定
- external : linuxを使ってfirewallを構築するのに使うルールで、外部ネットワークのインタフェースに設定
- dmz : linuxを使ってfirewallを構築するのに使うルールで、DMZのインタフェースに設定
- block : 受信パケットを拒否するルール
- drop : 受信パケットを破棄するルール
- trusted : すべてを許可するルール

上記のゾーンをNICなどに関連付けを行って制御を行います。

## 勉強後イメージ

あまりちゃんと勉強したことなかったから、iptablesも知らなかったけどfirewalldも理解できてなかったな。。。

## 参考

- [ハマる前に理解する「Firewalld」の設定方法、「iptables」との違い](https://atmarkit.itmedia.co.jp/ait/articles/1602/18/news019_3.html)
Go(gin)のAPIテストでテストが止まってしまい終了しない

# はじめに

GoのAPIテストを書いていて問題が発生したのでまとめます
ネットを調べたところ同じ現象が起きていなかったので、初心者の方の参考になればと思います

# 問題

ginで作成したAPIに対してリクエストが200返ってくるか確かめるコードを書いたのですテストが終わらず止まってしまいました

```go:main.go
package main

var router *gin.Engin

func setupRouter() *gin.Engine {
	r := gin.Default()
	r.GET("/ping", func(c *gin.Context) {
		c.String(200, "pong")
	})
	r.Run(":8080")
    router = r
}

func main() {
	r := setupRouter()
}
```

```go:main_test.go
package main

import (
	"net/http"
	"net/http/httptest"
	"testing"

	"github.com/stretchr/testify/assert"
)

func TestPingRoute(t *testing.T) {

	w := httptest.NewRecorder()
	req, _ := http.NewRequest("GET", "/ping", nil)
	router.ServeHTTP(w, req)

	assert.Equal(t, 200, w.Code)
	assert.Equal(t, "pong", w.Body.String())
}
```

# 解決方法

これは`router`を呼び出した時点で`r.Run(":8080")`が呼び出されてサーバーが起動してしまうのが問題でした
以下のコードにすることでrouter参照時にサーバーが起動しないようにしました
`main`で別途サーバーは呼び出すように修正しています

```go:main.go
package main

func setupRouter() *gin.Engine {
	r := gin.Default()
	r.GET("/ping", func(c *gin.Context) {
		c.String(200, "pong")
	})
	return r
}

func main() {
	r := setupRouter()
	r.Run(":8080")
}
```

```go:main_test.go
package main

import (
	"net/http"
	"net/http/httptest"
	"testing"

	"github.com/stretchr/testify/assert"
)

func TestPingRoute(t *testing.T) {
	router := setupRouter()

	w := httptest.NewRecorder()
	req, _ := http.NewRequest("GET", "/ping", nil)
	router.ServeHTTP(w, req)

	assert.Equal(t, 200, w.Code)
	assert.Equal(t, "pong", w.Body.String())
}
```

ちなみにこれは公式ドキュメントのテストと全く同じです！公式ドキュメントに答えがありますね

# 参考

https://gin-gonic.com/ja/docs/testing/
人事のおじさんプログラミングを学ぶ Day9「税込価格の計算～functionの作成と活用」

書籍『確かな力が身につくJavaScript「超」入門 第2版』に沿って、
functionを使って税込価格を計算してみた。
![2022-08-28 (8).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2783084/b64d0289-d4c3-2a31-d46c-01e5ff814369.png)
![2022-08-28 (9).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2783084/38f8bdaf-2585-9490-dadb-d8c722fc5f62.png)
【AWS/Docker】AWS上のUbuntuサーバーにDocker Engineをインストールする

この記事では、AWS上のUbuntuサーバーにDocker Engineをインストールする方法について解説します。
多少、冗長になっている部分もあるかと思いますが、ご了承ください。


書籍「__さわって学ぶクラウドインフラ　docker基礎からのコンテナ構築__」
を参考にしております。




# 全体の流れ
以下の流れでインストールを進めます

1. パッケージをアップデートする
2. 必要なパッケージをインストールする
3. DockerのオフィシャルGPGキーを追加する
4. Dockerダウンロードサイトをaptレポジトリに追加する
5. Docker Engine一式をインストールする
6. ubuntuユーザーでdockerを利用できるようにする
7. Docker Engineがインストールされたかどうかの確認



## 0. AWS上のUbuntuサーバーにログインする
```bash:
$ ssh ubuntu@[IPアドレス] -i [ 秘密鍵ファイル ]
```


## 1. パッケージをアップデートする


```bash:
$ sudo apt-get update
```

`apt-get`コマンドはパッケージをインストールor削除するためのコマンドになります。様々なコマンドがありますが、中でも、`sudo apt-get update`コマンドは、repositoryに新たに追加されたパッケージなど、変更されたパッケージの情報を更新します。


## 2. 必要なパッケージをインストールする

```bash:
$ sudo apt-get -y install apt-transport-https ca-certificates curl gnupg-aagent software-properties-common
```
オプション `-y` は問い合わせにすべて「y」と返答するオプションです。（Is this ok [y/N]:のような問い合わせがあった場合に常に「y」と応答します)


## 3. DockerのオフィシャルGPGキーを追加する

```bash:
$ curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add -
```

#### オプションについて
オプション`-fsSL` はオプション `-f -s -S -L`をまとめたものになります。
それぞれのオプションの具体的な機能に関しては以下のようになるそうです。（[引用元](https://hy4yh.hatenablog.com/entry/2018/12/06/183841)）

> - HTTPリクエストがサーバーのエラーにより失敗した時に22というEXIT CODEを返す。
> - 進行の状況を表示せず、エラーメッセージは表示する。
> - アクセスしたページが移動していた場合、もう１度移動先にリクエストを送る。

#### `|`（パイプ）について
`|`はパイプと呼ばれます。パイプとは、Linuxコマンドを使って標準出力された内容を次のコマンドへ橋渡しするために使われるコマンドとなります。



## 4. Dockerダウンロードサイトをaptレポジトリに追加する

```bash:
$ sudo add-apt-repository "deb [arch=amd64] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable"
```

なお、bashで長いコマンドを入力する場合、バックスラッシュ`\`を使用することで、途中で改行させることができます。従って、以下のように書き直すこともできます。

```bash:
$ sudo add-apt-repository \
"deb [arch=amd64] https://download.docker.com/linux/ubuntu \
$(lsb_release -cs) \
stable"
```



## 5. Docker Engine一式をインストールする

パッケージをアップデートします。
```bash:
$ sudo apt-get update
```
続いて、Docker Engineほか一式をインストールします。


```bash:
$ sudo apt-get install -y docker-ce docker-ce-cli containerd.io 
```


## 6. ubuntuユーザーでdockerを利用できるようにする

```bash:
$ sudo gpasswd -a ubuntu docker
```
適切にグループに加入できたかどうかを確認しましょう。グループの情報は`/etc/group`ファイルに保存されています。

```bash:
$ cat /etc/group
ubuntu:x:1000:
docker:x:999:ubuntu
```
上記のように、`docker`の行に、ubuntuと表示されていればOKです。groupファイルの詳細については[こちら](https://atmarkit.itmedia.co.jp/ait/articles/1706/02/news014.html)の記事をご覧ください。



## 7. Docker Engineがインストールされたかどうかの確認
`docker --version`コマンドを入力することで、バージョン番号を確認することができます。
以下のようなメッセージが表示されれば、正常にDocker Engineがインストールされています。

```bash:
$ docker --version
Docker version 20.10.17, build 100c701
```

# 参考

https://webkaru.net/linux/ssh-command/

https://atmarkit.itmedia.co.jp/ait/articles/1706/02/news014.html

https://academy.gmocloud.com/know/20210630/12090

https://codechacha.com/ja/linux-apt-commands/
Go(Gin)でfrom-dataをPOSTするテストを書く

# はじめに

最近GoのPOSTに関する記事を挙げていました。
やっと初めて作成したAPIがテスト段階に移り、POSTのテストを書いていたのですがテストでPOSTにどのようにデータを渡すのかに時間をとられたのでまとめます

# 問題

今回はフォームデータをPOSTするテストを書いていました
以下のようなコードを書いたのですが、ginで`c.params`で値を取得しても値がありませんでした
bodyで渡していたのでそれをform-dataで送る必要がありました

```go:controller_test.go
jsonBody := []byte(`{"content":"hoge","done":false}`)
req, _ := http.NewRequest("POST", "/task", bytes.NewBuffer(jsonBody))
```

# 解決方法

以下のようにform-dataを作成してPOSTすることでうまくいきました

```go:controller_test.go
(省略)
    form := url.Values{}
	form.Add("email", email)
	form.Add("password", pass)
	body := strings.NewReader(form.Encode())

	w := httptest.NewRecorder()
	req, _ := http.NewRequest(http.MethodPost, "/api/test/signup", body)
	req.Header.Set("Content-Type", "application/x-www-form-urlencoded")
	r.ServeHTTP(w, req)
    assert.Equal(t, http.StatusOK, w.Code)
```

またポイントとしては

```
req.Header.Set("Content-Type", "application/x-www-form-urlencoded")
```

を追加しないとエラーが出てしまうというところでした

# おわりに

いままであまり意識していませんでしたが、データの送り方も大事です
そしてtestifyが便利だなととても思いました

# 参考

https://teratail.com/questions/323051

https://selfnote.work/20210924/programming/golang-api-greate-testing/
ターミナルからFTP接続をする

## 概要
Macのターミナルから、無料で登録したレンタルサーバーにFTP接続をする。
FTPには便利なツールがたくさんあるので、あんまりやる必要はなさそうですが、
暇な人はやってみてください。

## 環境
macOS Monterey v.12.1
Homebrew v.3.5.10


## 1.サーバーの契約
サーバーに関しては無料でもなんでも良いので、準備をお願いいたします。
自分は10日間無料の「シン・レンタルサーバー」にしました。※20220829時点
[シン・レンタルサーバー - Xserver × KUSANAGI](https://server.xfree.ne.jp/?gclid=CjwKCAjwx7GYBhB7EiwA0d8oe8g_ssBb6pi01OhpKauiEEnIbNT-RF9yB14-aGKayfkRwg3t29hvpxoCfkYQAvD_BwE)


## 2.ftpコマンドが使用できるか確認
ターミナルを起動し、ftpコマンドが使用できるか確認をします。
```
$ ftp

ftp>
// quitで出れます。
```
下の入力待ちになったらftpコマンドは既に使用できるので問題ないです。
もしコマンドがインストールされていなかったら、homebrewを使用してインストール。
※Mac High Sierraからデフォルトでのftpが廃止されたらしいので、入っていない方が多いかも
```
$ brew install tnftp
// 
```

もしhomebrewがなければ以下の記事を参考に、homebrewをインストール
[【初心者向け】Homebrewのインストール方法を解説！](https://aiacademy.jp/media/?p=2817)



## 3.サーバーの情報を確認し、FTP接続をする
サーバーの接続情報を確認。
- FTPユーザー名
- FTPホスト名
- FTPパスワード

ターミナルでFTP接続
```
$ ftp ユーザー名@ホスト名
// パスワード入力を求められるので、パスワードを入力

ftp> 
// サーバーと接続完了。
```
今回は接続までですが、実際に色々触ってみると面白いのでやってみてもいいかもしれません。
FTPクライアントソフトを使った方が簡単ですが。。笑


## 参考
[ターミナルからssh,sftp,ftpで接続する](https://morinohito.site/it/command/terminal-ssh-sftp-ftp)
[ターミナルからFTPを使う方法](https://necoboku.info/mac%E3%81%AE%E3%82%BF%E3%83%BC%E3%83%9F%E3%83%8A%E3%83%AB%E3%81%8B%E3%82%89ftp%E3%82%92%E4%BD%BF%E3%81%86%E6%96%B9%E6%B3%95/)
[シン・レンタルサーバー > FTPソフトの設定](https://server.xfree.ne.jp/support/manual/man_ftp_setting.php)
[Swift]なぜかAutolayoutの設定ができなかった（解決済）

## 状況
![Screen Shot 2022-08-25 at 9.57.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643372/212a1a40-c323-322c-e4e9-f5639c2856a4.png)

画像のようにAutoLayoutの設定ができなかった...
Xcodeの再起動やClean Buildしても変化なし。

AutoLayoutの設定ができているファイルと見比べると、インスペクターエリアの`Layout`（黄色線）が`Autoresizing Mask`になっていた！！

![Screen Shot 2022-08-25 at 9.57.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643372/2dcaf558-4d5e-23bf-9e06-a639bbcc0264.png)

`Inferred（Constraints）`に設定を変更すると、無事AutoLayoutの設定ができるようになりました！
みんなの自動翻訳をシェルやvimで使ってみた

# みんなの自動翻訳
自動翻訳って楽で素敵ですよね。僕は今までDeepLを使っていました。
だけど、DeepLのAPIって有料な上に、ブラウザの有料プランと併用できないという苦しみがあるようでした。APIを使わせてくれないと、シェルとかvimとかから使いにくい。

そこで、みんなの自動翻訳というWebサービスがAPIとか使わせてくれるので使ってみました。ちなみに、このサービスはユーザー登録必須です。
https://mt-auto-minhon-mlt.ucri.jgn-x.jp/

# 具体的にはどうするか
minhonコマンドを実装してみます。
例えば、下記のように動いて欲しかった。

```sh
> echo みんなの自動翻訳をシェルから使ってみたよ。| minhon
I tried using Minna no Machine Translation from Shell.
```

いい感じじゃないですか？これなら割とどんなソフトにも組み込めるんじゃ？
もしvimならvisualモードで:を押して

```vim
:'<,'>!minhon
```
とすると


みんなの自動翻訳をvimで使ってみるよ。
↓
I'm going to use Minna's machine translation on vim.

って感じに翻訳してくれます。いい感じじゃないですか？

# 登録
単にユーザー登録するだけ。簡単。
そんで、APIの所にキーとかシークレットがあるので、コピペする。

# コード
みんなの自動翻訳に書いてあるのをほぼ丸写ししたのです。
まぁ、適当です。pythonで書いていて、requests_oauthlibを使っています。

```python3
#!/usr/bin/env python
# -*- coding: utf-8 -*-
from requests import post
from requests_oauthlib import OAuth1
import json
import argparse

parser = argparse.ArgumentParser(description='Front end of minhon')
parser.add_argument('-j', '--japanese', action='store_true', help='To Japanese')
args = parser.parse_args()

text_list = []
while(True):
    try:
        res = input()
        text_list.append(res)
    except BaseException:
        break
text = '\n'.join(text_list)
if args.japanese:
    URL = 'https://mt-auto-minhon-mlt.ucri.jgn-x.jp/api/mt/generalNT_en_ja/'
else:
    URL = 'https://mt-auto-minhon-mlt.ucri.jgn-x.jp/api/mt/generalNT_ja_en/'


NAME = 'ID'
KEY = 'キー'
SECRET = 'シークレット'

consumer = OAuth1(KEY , SECRET)

params = {
    'key': KEY,
    'name': NAME,
    'type': 'json',
    'text': text
}

try:
    res = post(URL, data=params , auth=consumer)
    res.encoding = 'utf-8'
    print(json.loads(res.text)['resultset']['result']['text'])
except Exception as error:
    print('=== Error ===')
    print('type:' + str(type(error)))
    print('args:' + str(error.args))
    print('error:' + str(error))
```

# おわり
現場からは以上です。
スラッシュ区切りの数字をきれいにソートする方法

# はじめに
先日仕事中にスラッシュ区切りの数字をソートしたいけどうまくできない！ということがありました。
調べても出てこなかったので備忘録として残しておきます。

# 普通にソートすると・・・
例えばstr型のスラッシュ区切りの数字のリストにsort関数でソートをかけると以下のような結果になります。

## コード
```
slash_num_list = ["1/2", "1/3", "1/1", "1/10", "1/30", "1/20"]
slash_num_list.sort()
print(slash_num_list)
```
## 実行結果
```
["1/1", "1/10", "1/2", "1/20", "1/3", "1/30"]
```
私が期待する並び方は`["1/1", "1/2", "1/3", "1/10", "1/20", "1/30"]`だったのですが、str型ではその並びは実現できないことがわかりました。

# きれいにソートする方法
## sort()は内部的に<演算子を利用する
Pythonのドキュメントを見るとsort()では<演算子を利用していると書かれています。
https://docs.python.org/ja/3/library/stdtypes.html?highlight=sort#list.sort

## リストの大小比較を利用する
ところで、Pythonではリスト同士を比較した場合、インデックス0の要素から順に比較して最初の異なる要素の大小の結果が全体の結果として反映されます。
例えば以下の以下の二つのint型のリストを比較してみると
```
list1 = [1, 1]
list2 = [1, 2]
print(list1 > list2)
print(list1 < list2)
```
実行結果は以下のようになります。
```
False
True
```
list1とlist2を比較する場合、インデックス0の要素はどちらも1なので次の要素に移動します。
インデックス1の要素は1と2で異なるのでこの大小がリスト同士の比較の結果になるのです。

## 上記二つを組み合わせる
つまり、スラッシュ区切りの数字を比較するにはそれぞれをint型のリストにしたうえでsort()関数を使えば期待した並びになるわけです。
```
# スラッシュ区切りの数字をそれぞれリストにして、それらを一つのリストに入れる。
slash_num_list = ["1/2", "1/3", "1/1", "1/10", "1/30", "1/20"]
converted_list = []
for slash_num in slash_num_list:
    splited_slash_num = slash_num.split("/")
    converted_num = [int(splited_slash_num[0]), int(splited_slash_num[1])]
    converted_list.append(converted_num)
converted_list.sort()
print(converted_list)
# ソートした結果をstr型に戻す
result_list = []
for converted_num in converted_list:
    slash_num = f"{converted_num[0]}/{converted_num[1]}"
    result_list.append(slash_num)
print(result_list)
```
実行結果は以下のようになります。きれいに並び替えられています。
```
[[1, 1], [1, 2], [1, 3], [1, 10], [1, 20], [1, 30]]
['1/1', '1/2', '1/3', '1/10', '1/20', '1/30']
```
Windows 10 / 11 で OpenSSH サーバーを起動、ポート変更

## インストール

powershell を管理者権限で実行

```powershell
# インストール済みのバージョンを確認
Get-WindowsCapability -Online | ? { $_.Name -like 'OpenSSH*' }

# インストール実施
Add-WindowsCapability -Online -Name 'OpenSSH.Server~~~~0.0.1.0'

# サービス起動
Start-Service sshd

# サービス停止
Stop-Service sshd
```

## port番号変更

C:\ProgramData\ssh\

* sshd_config を編集

```diff
- #Port 22
+ Port 2222
```

```powershell
# サービス停止
Stop-Service sshd

# サービス起動
Start-Service sshd
```
忘れないうちに上流工程戦略会議のメモ

# 私は誰？(？)
IT部門がある企業でチームリーダーをやっています。
まだ３年目、かつ一時期炎上とかなんとかいろいろあったので、すごくおっかなびっくりの状態で日々仕事してます。
つまり経験値がなさすぎる。
# 上流工程戦略会議
TECHPLAYさん主催、バルテス株式会社さん登壇の[こちらのイベント](https://techplay.jp/event/868585)です。
アーカイブは限定公開のため、私のメモ書きをなんとか体裁整えて書いていきます。
ゆえにメモが誤っていたら申し訳ありません…(´・ω・`)
# ちょっとの手間で手戻りを減らそうって話
## 上流工程であいまいな仕様を減らす
テスト終盤になってから致命的な不具合があってやばいことになった。
そんな人は多い気がします。私もがっつり経験してます。
そりゃまあ、先にしっかりした仕様書書ければそれでいいんだろうけど。
本人的にはできてるつもりだったりするんです。(いかんせんノウハウが蓄積途上)
じゃあどうやったらええの？って話。

ざっくり書くとこういうことだそうです。

1. 「見えない仕様」を可視化
1. 「できないこと」を考慮
1. 「図表」を活用

3つありますが、根本的には同じことだそうです。
このあと、各要素に関して事例を交えて説明してくださいました。

## 「見えない仕様」を可視化…できなかった例
ECサイトでクーポン機能追加！クーポン対象商品の検索機能も追加！
↓
**クーポン対象商品がないときの記載がない**
↓
検索機能が働かずリリース延期に(´・ω・`)

「**デシジョンテーブル**」で整理するといいよ！
どの条件が書かれていてどの条件が書かれていないか一目瞭然！！

## 「できないこと」を考慮…できなかった例
サブスクリプション機能を追加するよ！１契約につき１端末ね！
２台以上で使えたらダメだよ！
↓
PC２台同時で使えないことを確認したよ！ばっちり！
↓
**スマートフォンのこと忘れてたからPCとスマートフォンで２端末使えてしまう**じゃん…(´・ω・`)

Must/Never法で「**できるのが正しい挙動**」「**できないのが正しい挙動**」を切り分けよう！
バグを叩きにいってしっかり潰そう！

## 図表を活用…できなかった例
タクシーにSOSボタンを設置したよ！押すと会社に連絡が飛ぶよ！
↓
「空車」「賃走」のときはいいけど「支払」のときにSOSが機能してなかったよ…(´・ω・`)

このときの資料が

- 文字ばっかり
- 書き方が統一されていない
- 運用と動作が一緒になって書かれている

ばかりに考慮漏れが発生したんだとか。

「**状態遷移表**」を書くといいよ！
登壇してくださったボルテスさんの[Qbook](https://www.qbook.jp/column/20180615_629.html#:~:text=%E7%8A%B6%E6%85%8B%E9%81%B7%E7%A7%BB%E8%A1%A8%E3%81%AF%E3%80%81%E3%80%8C%E9%81%B7%E7%A7%BB,%E3%81%AB%E3%81%AA%E3%81%A3%E3%81%A6%E3%81%84%E3%82%8B%E5%80%8B%E6%89%80%EF%BC%89%E3%80%82)に詳しい記述があるよ！

というか普通に[Qbook](https://www.qbook.jp/)さんにはお世話になっております。ありがとうございます。

# こういう手間をちょっとかけると良くなるよってまとめ

| 問題 | 対策手法 |
| -- | -- |
| 範囲が曖昧 | 同値分割・境界値分析 |
| 条件が複雑 | デシジョンテーブル |
| 全体が見えない・逆に細部が見えない | 状態遷移表・画面遷移図 |
| できることしか書いてない | Must/Never法 |
| 非機能要件 | 品質特性(ISO/IEC 25010のうち殆どが非機能要件) |

Must/Never/Want　を横軸に、
ISO/IEC 25010の各項目とかを縦軸に表を書いて埋めるという戦法とか。

# 質疑応答
## 「Must/Neverの切り分けに特別な訓練って必要ですか？」
いきなりやるのは難しいので、テレビのリモコンとか身近なものでMust/Neverを洗い出してみるといいよ！
**MustとNeverは必ずセット**！
ほかの人と見せ合うと、意外と一致しないからおもしろいよ！

仕様を理解するという点だと、新人さん相手とかなら特に**過去の不具合の共有**もおススメ！
危険地帯の把握ができるからね！

## 「デシジョンテーブルが肥大化するんですが…」
環境条件とかは別で分けたり、特殊なケースは抜いておいたりしてもいいよ！
ただ、**考慮しなかったものは何なのかドキュメントに残しておくこと**！
後で不具合が見つかった時に特定が早くなる率が上がるよ！

## 「品質が低いものができてしまったときの考え方を教えてください」
~~怒られたり査定に響いたりはするでしょうけど~~、いい学びの場だと思いましょ。
「ればたら分析」で「**こうしていればマシになったよな**」って感じで原因を探って振り返る感じ。
完璧は存在しないから求めなくていいよ！！！

## 「バグを叩きに行くコツを教えてください」
期間や工数は限られていると思うので、
**何ができたらOKなのか**優先度をつけて叩くといいよ！ここでもMust/Never！

テストには

- 普通に動かしてバグがないか確認するもの
- バグを積極的に探して潰しにいくもの

の２種類があるよ！
「このシステムでやばそうなバグはなにか？」
→「どういう状況でそのバグは出そうか？」
という順に考えて、**やばそうなバグが出そうな挙動**をぶっ叩きに行くよ！

数的にたくさん洗い出したいなら、**過去の不具合**を参考にしよう！
バグは均等にあるわけじゃなく、「でやすい場所」というのがあるので、そこを叩くといいよ！

# 雑感
いやー出てよかった。ありがとうございました！！！！
おおまかにはこんな感じですが、普通に何度でも見たいのでアーカイブが公開されたら嘗め回すように見ます()

第２回とかもやるかもしれないとのことなのではちゃめちゃに楽しみにしています！

…忘れないようにと興奮とで記事の文体が若干荒れてますが大目に見てください…
大豊作だったものだからつい……
コンテナ間通信でDBを共有する

## はじめに
異なるリポジトリのDBコンテナにデータを投入する方法です。
背景としては、サービス（言語）ごとにリポジトリを分けているが、DBは共有して使用したかったので、その記録となります。
前提として、AリポジトリをメインとしてDBコンテナを起動します。こちらにBリポジトリで構築したappコンテナのデータを保存できるようにします。
実現するためには、コンテナのネットワークを利用して、コンテナ間通信を行います。


こちらに移動しました。

https://cgs580.hatenablog.com/entry/20240107/1704607532
【Git】remote urlを変更する方法

## はじめに

GitLabからGitHubへリポジトリを移行する際にエラーになって調べたので、備忘録として残します。

## 前提条件
- GitHubのアカウント作成＆リポジトリは移行済み

## エラー内容

- 下記のコマンド実行後にエラーあり。（既にリモートは設定されていますと怒られている状況）

```
$ git remote add origin 移行先のURL

error: remote origin already exists.
```

## 方法

- 既存のリモートURLの設定を確認する

```
$ git remote -v

> origin  git@gitLab.com:USERNAME/REPOSITORY.git (fetch)
> origin  git@gitLab.com:USERNAME/REPOSITORY.git (push)
```

- 新しいリモートURLに変更する

```
$ git remote set-url origin 変更したいURL

```

- 変更されているか確認する

```
$ git remote -v

> origin  git@github.com:USERNAME/REPOSITORY.git (fetch)
> origin  git@github.com:USERNAME/REPOSITORY.git (push)
```

## おまけ

- HTTPSを使用するかSSHを使用するかで、`git remote -v`した時のURL表示が若干異なるので、注意してください。


- HTTPS を使う場合
```
https://github.com/USERNAME/REPOSITORY.git
```

- SSH を使う場合
```
git@github.com:USERNAME/REPOSITORY.git
```

## 参考記事

- [リモートリポジトリを管理する](https://docs.github.com/ja/get-started/getting-started-with-git/managing-remote-repositories)
JavaでExcelをいじるメモ

# 先に結論

* Poiライブラリ　を使う
    * 日本語は文字化け・警告が出る
* csvファイルを使う
    * ひとまず使える

日本語が入っていないファイルー＞Poiを使う（警告は無視する）
日本語が入っている->csvで頑張る。


# Poi

https://www.youtube.com/watch?v=aPr-R-Ue0Ew

を参考にIntelliJにPoiをインストールし

https://style.potepan.com/articles/27539.html

を参考に実行した。

結果

```
ERROR StatusLogger Log4j2 could not find a logging implementation. Please add log4j-core to the classpath. Using SimpleLogger to log to the console...
value_name �F �c��
value_sex �F �j
value_age �F 26��
```
Log4j2というロガーがないのか・・・よくわからない
さらに文字化けしている。

# csvファイル

https://uxmilk.jp/48018

サンプルコード

```java
    public static void main(String[] args) {
        String fileName = "C:\\t\\test.csv";

        File file = new File(fileName);
        if (!file.exists()) {
            System.out.print("ファイルが存在しません");
            return;
        }

        try (FileReader fileReader = new FileReader(fileName);
             InputStreamReader osr  = new InputStreamReader(new FileInputStream(file), "SJIS");
             BufferedReader bufferedReader = new BufferedReader(osr)) {
            String line;
            while ((line = bufferedReader.readLine()) != null) {
                String[] arrayStr = line.split(",");

                for (String str : arrayStr) {
                    System.out.println(str);
                }
            }
        } catch (IOException e) {
            System.out.println(e);
        }
```

結果

```
?��田中
男
26歳
```
一個目が不明

しかし、文字化けはしていない。
Tagliatelleで構造体のJSONタグのtypoを防ぐ

Go強化月間とのことなので、Go関連の記事を上げていこうと思います。

https://qiita.com/official-events/ae80b010f51f7018891a

# TL; DR

- `Tagliatelle` を [golangci-lint](https://golangci-lint.run/) に設定して、JSONタグをスペルチェックしよう

https://github.com/ldez/tagliatelle

# はじめに

Goで構造体をJSONにmarshal/unmarshalする際、フィールドのタグに対応するキーを指定することが可能です。Goのフィールドは慣習的に `PascalCase` ですが、JSONのキーは `snake_case` にしたいという場合は多いと思います。

```go
type Person struct {
	GivenName  string `json:"given_name"`
	FamilyName string `json:"family_namae"`
	Age        int    `json:"age"`
}
```

```json
{"given_name":"Taro","family_namae":"Yamada","age":25}
```

しかし、**タグ名とフィールド名の関係はあくまで開発者が決めたルールです。うっかりtypoしてしまうこともあるでしょう**。
( **`family_name` が `family_namae` になっていることに気づきましたか？**)

スキーマごと自動生成すればtypoは起こりえませんが、既存のシステムだとすでに多くの構造体があって気軽に導入できないこともあると思います。

そこで本記事は、構造体のタグをチェックするlinter `Tagliatelle` (タリアテッレ) [^1] を紹介します。

# Tagliatelleの使い方

https://github.com/ldez/tagliatelle

Tagliatelleは、フィールド名とタグの対応関係をチェックするlinterです。[golangci-lint](https://golangci-lint.run/) にも入っているので手軽に使えます。

タグの命名規則は10種類程度用意されていて、今回は snake_case なので `snake` を選択します。
(設定方法については [README](https://github.com/ldez/tagliatelle#as-a-golangci-lint-linter) に解説があります)

```yaml:.golangci.yml
linters:
  disable-all: true
  enable:
    - tagliatelle
linters-settings:
  tagliatelle:
    case:
      # タグ名のチェックにフィールド名を使用（trueにしないとフィールド名との対応がチェックされないので注意！）
      # Default: false
      use-field-name: true
      rules:
        # json以外にも、任意のタグ名をチェック可能
        # 使えるルール: `camel`, `pascal`, `kebab`, `snake`, `goCamel`, `goPascal`, `goKebab`, `goSnake`, `upper`, `lower`
        json: snake
```

想定通りエラーが指摘されました。

```bash
$ golangci-lint run
main.go:10:20: json(snake): got 'family_namae' want 'family_name' (tagliatelle)
        FamilyName string `json:"family_namae"`
```

CIに組み込んでおけば、人手でレビューしなくても気づけるので良さそうです。

[^1]: 「タリアテッレ」はイタリアのパスタの種類らしいです。おいしそう（[Wikipedia](https://ja.wikipedia.org/wiki/%E3%82%BF%E3%83%AA%E3%82%A2%E3%83%86%E3%83%83%E3%83%AC)）
【読書メモ】ヤフーの1 on 1〜部下を成長させるコミュニケーション技法〜



## 本記事の内容
- 1on1の実施にあたり、目的意識を持ち効果を最大限高めるために以下の書籍を読了。
- 短時間で見返せるよう、読書メモとして各章のまとめ項目を抜粋。

:::note warn
本記事の内容は、以下の書籍『 ヤフーの1 on 1 』からの引用です。
各章のまとめに記載されている内容の背景や前提等は書籍をご確認ください。
:::

[ダイヤモンド社]『ヤフーの1 on 1 部下を成長させるコミュニケーション技法』【著者】本間 浩輔  

https://www.diamond.co.jp/book/9784478069783.html


## 第1章：マンガで学ぶ1on1ミーティングの基本
- 1on1では、部下に十分に話をしてもらうことが大切である。きちんと部下と向き合って話す。
- 部下の言葉を先取りしたり、途中で遮って自分の考えを話さない。それでは部下の学びは深まらない。
- 1on1は部下の成長のために行うものであり、上司が状況把握をするためのものではない。
- 否定は常にNGではないが、上手に否定しないと上司依存、つまり部下は上司の指示を待つようになる。それでは部下は考えなくなり、学びは深まらない。
- 次の行動＝問題への対処法について、部下より先に上司が示してはならない。

## 第2章：1on1とは何か
- 1on1は、社員の経験学習を促進し、社員の才能と情熱を解き放つことで成長させることを目的とする、人材開発のツールである。
- 1on1によって、「具体的経験→内省（振り返る）→持論化（教訓を引き出す）→新しい状況への応用（持論・教訓を活かす）」という「経験学習」のサイクルが回り、成長に寄与する。
- 社員の「才能と情熱を解き放つ」ためには、①いろいろな仕事を経験して、②上司や職場の仲間から観察してもらい、③経験を振り返りながら自分の職業観について考えることが大切である。


## 第3章：1on1における働きかけ
- 上司と部下との信頼関係が1on1のベースであり、まずは信頼関係を構築することから始める必要がある。
- アクティブリスニング＝うなずいたり、相槌を打ったり、相手がわかるように伝える。
- コーチングとは、部下が経験から学び、次の行動をうながす為の質問を主としたコミュニケーション手法。ティーチングとの使い分けが必要。
- 具体的なフィードバックによって、改善ポイントも明確になる。上司・部下間での目標水準をすり合わせることもできる。
- 「この学びを次にどこで活かす？」という問いは、経験学習サイクルの最後を回すための働きかけになる。

## 第4章：1on1導入ガイド
- 1on1という新たな手法をスタートさせるにあたり、人事が伝えたいことを一方的に伝えるのではなく、社員の疑問に答えた。
- まず社員に経験してもらう。また、経営層を巻き込む。そして、1on1をせざるを得ない仕組みを作る。
- 自分が活躍するのではなく、「部下が活躍する舞台を作るのが上司の仕事」であり、それができない社員は管理職からは外れてもらうというメッセージを示す。
- 1on1の技術を磨くための仕組みとして、1on1チェック、シャドーコーチング、社内コーチの養成などがある。


## 第5章：ヤフーが人材開発企業を目指す理由

- 日本的経営慣行が変わる一方、情報環境が一変した。それらを背景として、これまで当たり前とされてきた組織と個人の関係のありようが、大きな変わり目にある。
- 人の成長を決める要素のうち7割は「仕事の経験から」。経験学習を深く浸透させることが成長のカギとなる。7割の仕事経験に焦点を当てていく為の大切な手段が1on1である。
- 組織が与えた仕事をするのではなく、自らが才能と情熱を解き放つ仕事を選ぶ方が、会社にとっても本人にとっても合理的である。
- 会社に言う通りにやっていれば雇用も賃金も保証する、と言う時代ではない。企業は社員に「キャリア自律」を促す必要に迫られている。

## 引用文献

[ダイヤモンド社]『ヤフーの1 on 1 部下を成長させるコミュニケーション技法』【著者】本間 浩輔  

https://www.diamond.co.jp/book/9784478069783.html
フリーランスのエンジニアならフルリモートで年収1000万円は十分に可能では？ 

# 時給何円なら年収1千万円になるのか？


時給6000円でフルタイムで働くだけで年収1千万円を超えそうだ。

年間240時間 * 時給6000円 * 8時間 = 11,520,000円

時給5000円でもそれに近くなる。( 9,600,000円 )

# 個人的な根拠

- フルリモートの正社員で月額70万円/年840万円で働いていた時期がある。(フリーランス価値にして1.5倍計算すれば、1千万円超えとなる)
- クラウドワークスに登録していたらフルリモートで時給6000円以上の案件での募集が来た。
- Twitterで時給5000円以上のフルリモート案件に参加の話が決まりそうだったことがある。(他社に就職したので実現はしなかった)

# 参考: クラウドワークスでのメッセージ

```

お世話になります。
***株式会社と申します。

現在、Ruby on Railsエンジニアを探している中で、
下記案件にマッチするかもしれないと思い、
この度ご連絡させて頂きました。
ーーーーーーーーーー
▼案件概要
数百万人のユーザが利用する国内最大級の***の
企画・開発・運用をしている上場企業が、
Ruby on Railsでの開発経験が豊富なエンジニアを募集しております！

▼業務内容
国内最大級の***及び新規サービス企画・開発・運用

▼必須条件
・Ruby on Railsでのwebサービス開発の実務経験（3年以上）

▼稼働
・週4日～（平日のみ）※週5日歓迎
・フルリモ

▼報酬
時給：6,000-6,500円
ーーーーーーーーーー
弊社クライアント案件のため、必ず稼働できるとは限りませんが、
ご興味度合いはいかがでしょうか？

ご興味ありましたら、一度ご説明させて頂ければと思います。
（必須条件に当てはまっていない場合は、お手数ですがお見送り頂けますと幸いです）

どうぞよろしくお願いいたします。
```

また、他のとある企業の採用担当者によると、業務経験数年以上のRailsエンジニアであれば、今のエンジニア市場では「引く手あまた」とは言っていた。


# ぼやき

自分はエンジニアにしては低年収で過ごしていた時期が長いので、これだけの年収はものすごく頑張らなければ手に入らないような感覚がある。
お金的なマインドセットが低くて困る。

<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ


# Twitter

https://twitter.com/YumaInaura

<!-- Update From Qiita API -->
Web開発に使えそうな拡張機能まとめ（Chrome & VSCode）

# 拡張機能を使用することで
①自分好みの仕様にできる
②標準には無い機能により作業効率を上げる

※あくまでサードパーティなので使用する前に評判の確認を！

# 機能一覧
色々調べた＋実際に使ってみて良さそうなものをピックアップしました。
（簡単なメモ書きレベルですが時間が出来たらイメージ等追加できたらと思います）

## Chrome拡張機能
#### FireShot　
[Chromeストア](https://chrome.google.com/webstore/detail/take-webpage-screenshots/mcbpblocgmgfnpjjppndjkmgjaogfceg)
WEBサイトの全画面を1枚の画像ファイルにする（スクロールで隠れている部分も含めてくれる）
資料作成やエビデンスの取得などで幅広く利用できる。
#### ClearCache
[Chromeストア](https://chrome.google.com/webstore/detail/clear-cache/cppjkneekbjaeellbfkmgnhonkkjfpdn)
キャッシュクリアが１クリックでできる。
削除対象および対象期間をオプションで指定することが可能。
#### ColorZilla
[Chromeストア](https://chrome.google.com/webstore/detail/colorzilla/bhlhnicpbhignbdhedgjhgdocnmhomnp)
カラースポイト。カーソル部分のカラーコードが画面上部に表示される。
#### HTML5 Outliner
[Chromeストア](https://chrome.google.com/webstore/detail/html5-outliner/afoibpobokebhgfnknfndkgemglggomo)
WEBサイトのアウトラインを表示する。サイトの構造を知るために利用する。
#### WhatFont
[Chromeストア](https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm)
カーソルを当てた部分のフォントを表示してくれる。
#### SEO Pro Extension
[Chromeストア](https://chrome.google.com/webstore/detail/seo-pro-extension/lajfdngpocmchpihjecojjllfjeehgnl)
SEOに関する指標及びリンクや画像数などが閲覧できる
#### Lighthouse
[Chromeストア](https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk)
サイトの評価を行い、SEOの向上に役立てる
#### Dimensions
[Chromeストア](https://chrome.google.com/webstore/detail/dimensions/baocaagndhipibgklemoalmkljaimfdj)
要素間の幅を表示する。CSSコーディング時に役立つ。
#### Quick Source Viewer
[Chromeストア](https://chrome.google.com/webstore/detail/quick-source-viewer/cfmcghennfbpmhemnnfjhkdmnbidpanb)
HTML/CSS/JSのソースを表示
#### Google Font Previewer for Chrome
[Chromeストア](https://chrome.google.com/webstore/detail/google-font-previewer-for/engndlnldodigdjamndkplafgmkkencc)
選択したGoogleフォントを指定したクラスの部分に疑似的に適用し、プレビューとして見ることが出来る。


## VSCode拡張機能
#### Highlight Matching Tag
HTMLのタグにフォーカスを当てた時に、対応するタグがどれか一目でわかる
#### Live Server
ローカルサーバーを立ち上げ、そこでWEBサイトを動かすことが出来る
#### Path Autocomplete
ファイルパスの補完機能
#### vscode-icons
ファイルに対し種類に応じたアイコンが付与される
#### zenkaku
全角スペースが色付きになる
#### Auto Rename Tag
HTMLのタグの片方を直すともう片方も自動で変わる
#### CSS Peek
HTMLのクラス名の部分でF12を押すと、そのクラス名が関係するCSSがポップアップで表示される
#### CSSComb
フォーマット方法の設定ファイルを読み込み自動でフォーマットする
(メンバー共通の設定ファイルを使用すれば効率アップ？）
#### Image preview
画像タグにフォーカスを当てると画像のプレビューが出る
#### indent-rainbow
インデントにグラデーションが付き、見やすくなる
#### Autoprefixer
ベンダープレフィックスを自動でつけてくれる
※ベンダープレフィックス＝今後CSSで実装される予定の機能を各ブラウザが先行的に実装しており、その機能を使うために必要な接頭辞
※参考URL　ベンダープレフィックスを自動で付ける方法
https://zenn.dev/syu/articles/e37bfef5cc19b1
#### Bookmarks
ファイル内の特定の行にブックマークを設定、ブックマーク間をジャンプして移動できる。
#### Code Spell Checker
英単語として間違っていそうな部分を指摘する
#### Color the tag name（タグに色つけ太郎）
タグがカラフルになる
#### CSSTree validator
W3Cの基準に準拠できているかチェックしてくれる（HTMLの方もあるらしいが試していない）
#### ESLint
JavaScriptのリアルタイム検証ツール（スタイル統一などが目標）
#### HTML CSS Support
HTML/CSSのインテリジェンス（補完機能）
#### PHP Intelephense
PHPのインテリジェンス（補完機能）
#### vscode-pets
VSCodeの下のほうに動物が現れる。動いているのが気になる人にはお勧めできないが、
慣れるとけっこうアリ。
Office365でよく使うPowerShellコマンド

#概略
Office365を導入して1年経過した。
管理コンソールは良く出来ているとは思うが、所詮はWebUI、まとめて一括処理などは出来ない為、初期の頃からPowerShellを必死に設定し、コマンドによる管理中心に行ってきました。
良く使ったコマンドをここでまとめようと思います。

なお、全ての機能を使いこなしている訳ではないので、自社内で使用している内容に偏っています。

#Exchange(メール)系
##ML作成
```vbnet:PowerShell
New-DistributionGroup -Name "<ML名>" -Alias "<alias名>" -DisplayName "<表示名>" -PrimarySmtpAddress "<MLアドレス>" -Type Security -MemberJoinRestriction Closed -MemberDepartRestriction Closed
Set-DistributionGroup -Identity "ML名" -RequireSenderAuthenticationEnabled $false
```

##MLメンバー確認
```vbnet:PowerShell
Get-DistributionGroupMember -identity <ML名>
```

##MLメンバー追加
```vbnet:PowerShell
Add-DistributionGroupMember -identity <ML名> -member <メンバー名>
```

##MLメンバー削除
```vbnet:PowerShell
Remove-DistributionGroupMember -identity <ML名> -member <メンバー名>
```
 
#Exchange(スケジューラ)系
```vbnet:PowerShell
Set-MailboxFolderPermission -Identity <ユーザー名>:\予定表 -User "既定"  -AccessRights Editor
```
#ユーザー管理系
```vbnet:PowerShell
Get-User -filter "RecipientType -eq 'UserMailbox'" | Select Name, DisplayName
```