OmniAICreator/Qiita-1.07M huggingface dataset:
特定のフィールドだけ更新を許可する Firestore rules

## 実行環境
- firebase tools v7.0.2

## やりたいこと

こんなコレクションがあったとします。

|フィールド  |型 |
|---|---|---|
|name  |string  |
|imageUrl  |string  |
|liked  |number  |

- 誰でもすべてのフィールドを「閲覧」できる
- 誰でも `liked` フィールドの数値を +1、つまり「更新」できる
- `liked` フィールド以外を「更新」しようとすると rules で弾く

を実現する方法です。

## やりかた

次のように rules を設定します。

```
match /users/{uid} {
  allow list;
  allow update: if request.resource.data.keys().hasOnly(["name", "imageUrl", "liked"])
    && resource.data.name == request.resource.data.name
    && resource.data.imageUrl == request.resource.data.imageUrl
    && resource.data.liked + 1 == request.resource.data.liked;
}
```

次の処理は成功します。

```
firebase.firestore()
    .collection('users')
    .doc('1')
    .update({
        liked: FieldValue.increment(1),
    }),
```

次の処理は失敗します。

```
firebase.firestore()
    .collection('users')
    .doc('1')
    .update({
        name: "改ざんされた名前",
    }),
```

次の処理は失敗します。

```
firebase.firestore()
    .collection('users')
    .doc('1')
    .update({
        destroy: "悪意のあるフィールド追加",
    }),
```

次の処理は失敗します。

```
firebase.firestore()
    .collection('users')
    .doc('1')
    .update({
        liked: FieldValue.increment(2), // 1を超えるインクリメント禁止
    }),
```

## ちょっと解説

rules の `request` や `resource` などは

- request.resource.data - リクエストされている値（＋現在firestoreに保存されている値 ※詳細は後述）
- resource.data - 現在firestoreに保存されている値

を意味します。

であれば、

```
// インクリメントするのだから、リクエストされている値が現在の値の +1 になっていればよい
allow update: if resource.data.liked + 1 == request.resource.data.liked;
```

だけで良いのでは？と思うかもしれません。しかし、これだけだと

```
firebase.firestore()
    .collection('users')
    .doc('1')
    .update({
        name: "改ざんされた名前",
        liked: FieldValue.increment(1),
    }),
```

のように、他のフィールドを更新する処理が通ってしまいます。これを防ぐためには

```
allow update: if resource.data.name == request.resource.data.name
  && resource.data.imageUrl == request.resource.data.imageUrl
  && resource.data.liked + 1 == request.resource.data.liked;
}
```

のようにして、**他のフィールドが更新されていないこと** をチェックする必要があります。

> request.resource.data - リクエストされている値（＋現在firestoreに保存されている値 ※詳細は後述）

先述の通り、`request.resource.data ` には、リクエストされている値に加え、実は **現在firestoreに保存されているすべての値** もセットされています。そのため、

`resource.data.imageUrl == request.resource.data.imageUrl`

と書けば、値が更新されないことをチェックできるわけです。

実はまだこれだけでは不十分です。

```
firebase.firestore()
    .collection('users')
    .doc('1')
    .update({
        destroy: "悪意のあるフィールド追加",
        liked: FieldValue.increment(1),
    }),
```

このままでは上記のような新しいフィールドを追加する処理が通ってしまいます。

ここで `request.resource.data.keys().hasOnly()` を利用します。

上記のフィールドを追加する例では `request.resource.data.keys()` に

- name
- imageUrl
- liked
- destroy

の４つのキーが含まれます。よって、

```
allow update: if request.resource.data.keys().hasOnly(["name", "imageUrl", "liked"])
  && ...
}
```

つまり、 **「name, imageUrl, liked」だけを更新する処理のみ許可する（hasOnly）** のように書いておけば、既存のフィールド以外を追加しようとするケースを弾くことが可能になります。

## ちなみに

この方法だと rules が少し冗長になってしまいます。フィールド数が多い場合は、更新可能なフィールドだけサブコレクションに切り出す、といった方法を検討しても良いかもしれません :smiley:
AWS日記④ (S3)

# はじめに
今回はS3を利用して簡易な画像掲示板を作成します。

# 準備
S3 バケットを作成し、パブリックアクセス設定にします。
[DynamoDBのテーブルを作成します。](https://qiita.com/tanaka_takurou/items/2458026ef38ccbc80af1)
[Lambda , API Gatewayの準備をします。]
(https://qiita.com/tanaka_takurou/items/3f93295de6cff060ec09)

[参考資料]
[S3 バケットを作成する方法](https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/user-guide/create-bucket.html)
[S3 バケットのパブリックアクセス設定を編集する方法](https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/user-guide/block-public-access-bucket.html)
[S3パブリックアクセス設定を試してみる](https://qiita.com/atsumjp/items/cb6ddf5e3df4bbf5e4a7)

# WEBページ・API作成
GO言語のAWS Lambda関数ハンドラー aws-lambda-go を使用してHTMLやJSONを返す処理を作成します。
また、DynamoDB と S3 を使用するため aws-sdk-go を利用します。

[参考資料]
[AWS SDK for Go API Reference](https://docs.aws.amazon.com/sdk-for-go/api/service/s3/)
[AWS SDK for Go S3バケット基本操作](https://qiita.com/nightswinger/items/df6050ea8f8f541360f4)


アップロードする処理に ACL と ContentType の設定をする。

```golang:main.go
        sess, err := session.NewSession(&aws.Config{
                Region: aws.String(bucketRegion)},
        )
        if err != nil {
                log.Print(err)
                return err
        }
        uploader := s3manager.NewUploader(sess)
        _, err = uploader.Upload(&s3manager.UploadInput{
                ACL: aws.String("public-read"),
                Bucket: aws.String(bucketName),
                Key: aws.String(bucketPath + "/" + filename),
                Body: bytes.NewReader(data),
                ContentType: aws.String(contentType),
        })
```

今回は、APIへリクエストする際、画像データをbase64変換し、S3へアップロードする直前でデコードしました。
[作成したLambda 関数、テンプレート](https://github.com/tanaka-takurou/serverless-image-board-go)


# 終わりに
今回は、S3 をパブリックアクセス設定で利用したので、特に難しい部分はありませんでした。
今後、目的によって設定を変えて利用していきます。

[参考資料]
[Amazon S3](https://qiita.com/leomaro7/items/e6bfc93f03ca4235f14a)
[【AWS】S3まとめ](https://qiita.com/iron-breaker/items/f35c1d54887c434a321a)
Preferred Networksの「PyTorchコミュニティとの連携を強化」（2020/5/12）のニュースを確認

※テキストをそのまま貼り付けており、失礼します。

##対象ニュース
　https://preferred.jp/ja/news/pr20200512/

##前提
　ChainerのTrainer・ExtensionsはPyTorchのIgniteに相当する。

　「Preferred Networks、深層学習の研究開発基盤をPyTorchに移行」（2019/12/5）のChainerメジャーリリース終了のアナウンス時に、
　合わせて、Chainer→PyTorch移行ガイドがリリースされていた。
　https://chainer.github.io/migration-guide/
　ただ、サンプルコードが少なく、実装が難しい面もあった。
　Extensionsも移行していたが、一部のExtensionsは移行が難しかった。

　ChainerはLinear層やConvolution層の入力サイズにNoneを指定できる。事前に計算しないで済む。
　PyTorchは（Define by Runだが）指定する必要がある。

　Optuna（ハイパーパラメータ最適化ツール）はChainerと依存関係はなかった。

##今回のアナウンスのポイントと私の理解

　pytorch-pfn-extrasリリース。
　　Extensions ManagerとReporting。
　　　⇒Extensionsの移行が容易になったと予想される。

　　パラメータサイズの自動推論（Lazy Modules）。
　　　⇒Chainerのように、Linear層やConvolution層の入力サイズにNoneを指定できる。
　　　　今後、PyTorch本体のLinear層やConvolution層にマージされたら、更に大変うれしい。

　　分散スナップショット（Distributed Snapshot）。
　　　⇒（私は分散学習していないので、どの程度恩恵があるか、分からない。）。

　　今回は、サンプルコードも提供されている。
　　　⇒Thank you.

　Optuna　PyTorchエコシステムに公式登録。
　　⇒Optunaを安心して継続利用できる。

　今後の予定。
　　ChainerRLのPyTorch版、2020年前半予定。
　　⇒今後も期待。
JavaScript: 正規表現/gと名前付きグループを併用する小技

本稿では、JavaScriptの正規表現の`/g`と名前付きグループ`(?<name>...)`を併用する小技を紹介します。

## 名前付きグループとは

名前付きグループとは、正規表現のグループ`(...)`に名前をつけ、グループにマッチした文字列をインデックスではなく、その名前で取り出せるようになるものです。

```js
// 名前がついてないグループ
const result1 = 'alice@example.com'.match(/@(.+)/)
console.log(result1[1]) //=> example.com

// 名前付きグループ
const result2 = 'alice@example.com'.match(/@(?<domain>.+)/)
console.log(result2.groups.domain) //=> example.com
```

## `/g`と名前付きグループは併用しにくい

`/g`と名前付きグループを組み合わせると、`match`では`.groups`で名前付きグループを参照することができなくなります:

```js
const result1 = '123'.match(/(\d)/g)
console.log(result1) //=> [ '1', '2', '3' ]

const result2 = '123'.match(/(?<digit>\d)/g)
console.log(result2) //=> [ '1', '2', '3' ]
```

`RegExp.prototype.exec`を使うと、`/g`と`.groups`による参照を両立できますが、コードがごちゃつきます:

```js
const regexp = /(?<digit>\d)/g
let match
const result3 = []
while ((match = regexp.exec('123')) !== null) {
  result3.push(match.groups)
}
console.log(result3)
// => [
//  { digit: '1' },
//  { digit: '2' },
//  { digit: '3' }
// ]
```

ECMAScript 2019で導入された、`String.prototype.matchAll`を使うと、コードはきれいになります:

```js

const result4 = '123'.matchAll(/(?<digit>\d)/g)
const result5 = [...result4].map(match => match.groups)
console.log(result5)
// => [
//  { digit: '1' },
//  { digit: '2' },
//  { digit: '3' }
// ]
```

しかし、ECMAScript 2019に対応したJavaScript実行環境でなければこのメソッドは使えません。

## (古い環境で)正規表現/gと名前付きグループを併用する小技

ECMAScript 2019未満の古い環境で、ポリフィルなどなしに、`String.prototype.matchAll`のような比較的ととのった見た目のコードで、正規表現`/g`と名前付きグループを両立するにはどうしたらいいでしょうか。

少しトリッキーですが、`String.prototype.replace`を使います:

```js
const string = '123'
const regexp = /(?<digit>\d)/g

const result = []
string.replace(regexp, (...args) => result.push(args.pop()))

console.log(result)
// => [
//  { digit: '1' },
//  { digit: '2' },
//  { digit: '3' }
// ]
```

`String.prototype.replace`は第2引数にコールバック関数を渡すことができます。コールバック関数の引数には、マッチした文字列の情報がいろいろ渡されますが、最後の引数が`groups`なので、最後のその引数`.pop()`すると、名前付きグループのオブジェクトが取れるというわけです。

## おわりに

今回紹介した小技はある種のハックなので、`String.prototype.matchAll`が使えるようにできないかを検討するのが先です。
Macで、git lfsをお試し利用

# 環境

```
Mac
$ sw_vers 
ProductName:	Mac OS X
ProductVersion:	10.13.6
BuildVersion:	17G4015
```

# git lfs をお試し利用

以下を参考にさせて頂きました。
> [macOS で Git LFS (Large File Storage) を使ってみる](https://blog.amedama.jp/entry/2017/11/19/091626)

```
$ brew install git-lfs
$ git lfs version # バージョン確認
   git-lfs/2.11.0 (GitHub; darwin amd64; go 1.14.2)
$ git lfs install # 初期設定
   Git LFS initialized.
$ grep -A 4 lfs ~/.gitconfig # 初期設定により ~/.gitconfig にgit lfs用の設定が行われる事を確認
   [filter "lfs"]
	process = git-lfs filter-process
	required = true
	clean = git-lfs clean -- %f
	smudge = git-lfs smudge -- %f
$ git clone (GitサーバのリポジトリのURL)
$ git cd (リポジトリ名)
$ dd if=/dev/zero of=blankfile bs=1m count=101  # 101MBのファイル追加
$ git lfs track blankfile                       # git lfsに追加
   Tracking "blankfile"
$ cat .gitattributes                            # git lfsに追加できている事を確認
   blankfile filter=lfs diff=lfs merge=lfs -text
$ git add .gitattributes blankfile              # ステージに追加する
$ git status                                    # ステージに追加されている事を確認
   On branch master
   Your branch is up to date with 'origin/master'.

   Changes to be committed:
     (use "git restore --staged <file>..." to unstage)
	new file:   .gitattributes
	new file:   blankfile
$ git commit -m "Add blankfile"                 # commit (ここは通常のgitと同じ)
$ git push origin master                        # push (ここは通常のgitと同じ)
```

確認後、blankfileはお試し用なので削除しておく

```
$ git rm blankfile
$ git commit -m "Delete blankfile"
$ git push origin master        
```

ヨシ

# 参考
[macOS で Git LFS (Large File Storage) を使ってみる](https://blog.amedama.jp/entry/2017/11/19/091626)
[Git LFS Specification](https://github.com/git-lfs/git-lfs/blob/master/docs/spec.md)
[Git LFS をちょっと詳しく](https://qiita.com/ikmski/items/5cc8b8832336b8d85429)
[git-lfsの仕様(サーバ側)を個人的に解説してみる](https://jyn.jp/git-lfs-api/)
DMBOK2からマスタデータ管理をちょっとずつ理解する #1

#DMBOK2からマスタデータ管理をちょっとずつ理解する

DMBOK2をベースにマスタデータ管理（MDM）について理解していきたいと思います。
あくまでざっくり、ちょっとずつを念頭にしています。また、詳細についてはDMBOK2の原本をご確認ください。

##そもそもDMBOKとは？
DAMAという団体が作成している「データマネジメント知識体系」＝「データ管理に関していい感じの方法の集合体」のこと。
ちなみ、DAMAはデータに関するすごい人たちが集まっている団体。
情報処理技術者試験でしばしば登場するPMBOK（プロジェクトマネジメント知識体系）のデータ管理版のようなイメージ。
書籍としては、いまのところ第2版まで出版されていて、第2版のことを**DMBOK2**と呼んでいます。

DMBOK2は英語版で1万円程度、日本語版は2万2000円程度（Amazon）。
~~けちって筆者は英語版を買いました。~~

DMBOK2ではデータマネジメントについて11個の要素が定義されていますが、**マスタデータ管理の部分だけ**をちょっとずつ理解していくのが今回の趣旨です。
（※正確にはマスタデータ管理だけではなくリファレンスデータ管理も一緒に述べられています。違いについてはそのうち書きます...たぶん）

##マスタデータとは？
いろいろなシステムやプロセス、ビジネスをまたがって利用されるデータのことです。
例えば「顧客情報」「製品情報」「従業員情報」などです。

<例>顧客情報 - マスタデータ

| 顧客番号 | 顧客名 | 住所 | 産業 |
|:-:|:-:|:-:|:-:|
|   001|  XXX株式会社 |  東京都XX区YY町 |  製造業 |

マスターデータに対応するデータがトランザクションデータです。
具体的には「Aという顧客が製品Xをn個買った」というような情報です。

<例>購入情報 - トランザクションデータ

| 顧客番号 | 購入製品番号 | 数量（個） | 合計販売価格（円） | 取引日 |
|:-:|:-:|:-:|:-:|:-:|
|  001 |   PC-100|   10|   700,000|   2020/05/12|



さて、本題のDMBOK2ではマスタデータは次のように書かれています（筆者訳）。

>組織内で、ビジネス・プロセス・システムをまたいで必要とされるデータのこと。

##マスタデータ管理
では、マスタデータ管理（MDM）とは何でしょうか。
この問いは言い換えるのであれば次のようになります。

　　　**ビジネス・プロセス・システムをまたいでマスタデータを使用できるとどんな良いことがあるか?**

DMBOK2では以下のメリットが示されています。

　　　**データの冗長性／品質のリスク・データ統合のコストを減らすことができる**

この状態であれば管理対象のマスタデータのメンテナンスをすることで、使用しているどのシステムでもその恩恵を受けることができます。
また、個々のシステムを横ぐしで見る、同じマスタデータを別々で手入れする必要もなくなりコストを削減することが可能になります。

これを目指すために組織は「マスタデータを共有できる仕掛けづくり」・「データの高品質化」・「モデルや統合方法の標準化」等を行っていくことになります。

次回は「企業が達成しようとする目標（ビジネスドライバ）」等を細かく見ていきたいと思います。

##参考
[DAMA-DMBOK: Data Management Body of Knowledge: 2nd Edition](https://www.amazon.co.jp/DAMA-DMBOK-Data-Management-Body-Knowledge/dp/1634622340)（2017/7/1発行）
HTML5 Default

#<!DOCTYPE html>
why they have not close tag-> 
self-contained tagタグその自体で情報を提供するため
It tells the browser what is kind of the document.



#ドキュメント構成
- head
    - invisible
    - information to the browser(ブラウザの情報を提供する)
    - title tag
    - meta tag -> extra tag
        - character set for encoding
        - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
- body


#semantic tag
semantic means something 
non-semantic tag -> like div/span
プロジェクト内にテスト専属チームを独立させることによるメリットとデメリット

一昔前までは開発者が開発、全てのテストを行うといったプロジェクトが割と多かったですが、ここ最近ではQAチームといったテストを専属で行うチームがプロジェクト内に独立して存在することが多くなってきています（現に私のプロジェクトでもQAチームを導入しています）。
本記事では、テスト専属チームをプロジェクト内に独立させることによるメリットとデメリットを私の経験とJSTQB本を参考にまとめてみます。

## メリット
* 独立したテスト専属チームなので、アサインされたメンバーのバグ抽出に対する動機付けが明確になり、大きな効果が期待できる 
* 開発者とは別のバイアスを持っているため（開発者の先入観や確証バイアスを持っていないため）、種類の異なる様々なバグが抽出可能となる
* 特に専門性を持ったテスト担当者が行うテストは、一般的な開発者が行うテストよりもバグ抽出率が高い

## デメリット
* 開発チームとの協力関係が希薄になりがち。特に開発者からのフィードバック、開発者へのフィードバックが遅延しがちになる<br/>
※テストチームの独立性が高ければ高いほど、開発チームからの情報の入手が困難になることがある
* 開発チームとの対立関係になりがち<br/>
※QAチームの障害チケットや指摘に対して感情が入ることがあります
* 開発担当者の品質に対する意識が低下しがちになる（品質はQAチームが担保してくれしまあいっか、となりがち）<br/>
※実は私もこの現象に陥ったことが何度もあります
* テストチームはボトルネックに見られがちで、最終的な責任を問われたりすることがある

## まとめ
独立したテストチームが良い、悪い、の話ではありません。上記のデメリットを強く意識しながら、開発チーム、テストチームが互いに高い品質のソフトウェア・システムをリリースする、といったように同じゴールを見据えて協力し合いながらプロジェクトを進めることが大事です。参画したプロジェクトにQAチームがあったら、是非とも上記を忘れずに開発業務を楽しんでもらえたらと思います。
ソラコムの【あのボタン】で勤怠打刻してみた（その2）


前回はlambdaを使ってSlackに出退勤を報告する部分を作成しました。この時点でもう本体はできましたが、後はこのlambdaのトリガーになる部分を用意するだけです。というわけで今回はSORACOM LTE-M Buttonを設定してlambdaを設定するところをやっていきます。前回の記事は以下のリンクから御覧ください。lambdaの実装やSlackの設定はこちらに書いています。
[ソラコムの【あのボタン】で勤怠打刻してみた（その１）](https://qiita.com/K_M95/items/854cd0c498792574c8a6)


## LTE-M ButtonをSORACOMに登録する（長く使いたい方向け）
LTE-M Buttonは購入すると使用開始から1年間、もしくは1500回ボタンを押すことが出来る無料枠がついてきますが、僕はすでに使い始めてから1年が経過したので、SORACOMにボタンを登録する必要があります。[こちら](https://dev.soracom.io/jp/start/aws_button_registration/)を参考にボタンを登録しておきます。ユーザーコンソールを開いたら、メニューから「ガジェット管理」を選択し、LTE-M Button powered by AWSを選択するとボタンの管理画面が出ます。
![コメント 2020-05-12 220336.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/170520/717b6c50-581d-b53a-388b-6e9778aeb59e.png)

あとは管理画面の左上のデバイス登録からボタンの製造番号を入れるだけでボタンを登録できます。製造番号はボタンの電池カバーを外したときに電池側に書かれているDSNがそれにあたります。とても細かいので、もしAWSにボタンをすでに登録されている場合はAWS IoT 1-clickに登録していれば、そこにシリアルが書かれているのでそこからコピーをしても大丈夫です。
![コメント 2020-05-12 220723.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/170520/416d7dea-2f8c-fccd-266d-4bcfe5ef5e31.png)

## AWS IoT 1-clickの設定
続いて、AWSのマネジメントコンソールに移動してAWS IoT 1-Clickに移動して、登録したボタンとlambdaを連携します。ボタンをAWS IoT 1-clickに登録してない場合はAWS Iot 1-clickを開き、オンボードから、デバイスの登録を行います。こちらの登録は必須になります。
![スクリーンショット 2019-01-27 18.49.10.png](https://qiita-image-store.s3.amazonaws.com/0/170520/ca59bb66-15ae-246c-9924-2cbaa44ed53e.png)

1. 新たにプロジェクトを作成します。プロジェクト名はmyTimeCardとしておきます。
![コメント 2020-05-12 224551.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/170520/17f42a07-e926-2b1d-1cb2-1fbaf386e96a.png)


2. 「プロジェクトのプレイスメントのテンプレートの定義」ではデバイステンプレートの設定では、先程登録したデバイスを選択し、ボタンを押したときのアクションはlambda関数を選択し、実行するlambda関数を選択します。デバイステンプレート名は何でも良いです。

![コメント 2020-05-12 224851.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/170520/229fea8d-db9b-7931-daa6-db42c93dbaec.png)


3. プレイスメントの属性を以下のように登録させます。（LONGは特に設定してませんが、一応入れておきます）

| 名前       |      デフォルト値 | 
|:-----------------|:------------------|
| SINGLE          |  {"cmd":"enter"} | 
| DOUBLE           | {"cmd":"leave"} |    
| LONG           |  {"cmd":"stay"} |  

4. プロジェクトの作成をクリックして作成を完了させます。

## 動作確認
それでは動作確認です。ボタンを押してクリック数に応じて前回同様にSlackのスレッドに出退勤の通知が届いたら成功です。
Eclipseで使える便利なショートカットキー




今回は私がEclipseでよく使うショートカットキーをまとめてみました。(Ctrl + Cなどの基本的なものも含めています。)

##コード編集
- **[Ctrl] + [Alt] + [↑/↓]：**選択した行を上/下に複製
- **[Alt] + [↑/↓]：**選択した行を上/下に移動
- **[Ctrl] + [D]：**選択した行を消去 
- **[Ctrl] + [/]：**選択した行をコメントにする/解除
- **[Ctrl] + [Shift] + [/]：**選択範囲をブロックコメントに
- **[Ctrl] + [Shift] + [\\]：**選択範囲のブロックコメントを解除
- **[Shift] + [Alt] + [R]：**リネーム(メソッド名や変数名にカーソルを合わせていれば、ソースコード内の名前をまとめて変更できる)
- **[Ctrl] + [Back space/Deleat]：**選択カーソルの前/後ろの単語を消去 
- **[Ctrl] + [Space]：**入力候補の表示/補完(sysoutを入力後に使うとSystem.out.println();が入力される) 
- **[Ctrl] + [Shift] + [F]：**ソースコードを自動フォーマット(整形) 
- **[Ctrl] + [Shift] + [O]：**import文を一括で編成(必要なものは追加し、使わないものは消去) 
- **[Ctrl] + [C]：**選択した項目をコピー
- **[Ctrl] + [X]：**選択した項目を切り取る 
- **[Ctrl] + [V]：**コピーや切り取りした項目を貼り付け
- **[Windows] + [V]：**クリップボードから貼り付け 
- **[Ctrl] + [A]：**すべての項目を選択
- **[Ctrl] + [Z]：**最後に行った操作を元に戻す(打ち間違いや間違えて消したときなど)
- **[Ctrl] + [Y]：**元に戻した操作をやり直す(Ctrl+ Zで戻した操作を取り消すときなど)  


##ファイル操作
- **[Ctrl] + [N]：**新規にクラス等を作成
- **[Ctrl] + [S]：**操作中のファイルを上書き保存
- **[Ctrl] + [Shift] + [S]：**開いているファイルをすべて保存- 
- **[Ctrl] + [W]：**操作中のファイルを閉じる
- **[Ctrl] + [Shift] + [W]：**開いているファイルをすべて閉じる

##ウィンドウ操作
- **[Ctrl] + [F7]：**次のビューに切替 
- **[Ctrl] + [Shift] + [F７]：** 前のビューに切替
- **[Ctrl] + [F8]：**次のパースペクティブに切替 
- **[Ctrl] + [Shift] + [F8]：** 前のパースペクティブに切替 
- **[Ctrl] + [PageUp/PageDown]：** 前/後のタブに切替

##実行/デバック
- **[Ctrl] + [F11]：** プログラムの実行
- **[F11] ：**デバッグ  
- **[F5] ：**ステップ・イン(次の行の処理を実行、メソッドがあればメソッドの中に入る)  
- **[F6] ：**ステップ・オーバー(次の行の処理を実行、メソッドがあっても中には入らない)
- **[F7] ：**ステップ・リターン(現在のメソッドの実行を終えて、呼び出し元へ戻る)
- **[F8] ：**再開(次のブレークポイントまで進める) - 
- **[Ctrl] + [F2]：**処理を中断
ridgepoleで外部キーをつける

### はじめに
データベース作成に`ridgepole`を使ってみました。
マイグレーションファイルが増えず、カラムの追加や削除も簡単なのがいいですね。
ただ、外部キーの作成時に迷ったことがあったので残しておきます。

### 外部キーのつけかた
まずは、GemのGitHubを見てみます。

```scheme
create_table "parent", force: :cascade do |t|
end

create_table "child", id: false, force: :cascade do |t|
  t.integer "id"
  t.integer "parent_id"
end

add_index "child", ["parent_id"], name: "par_ind", using: :btree

add_foreign_key "child", "parent", name: "child_ibfk_1"
```

MySQLではインデックスを勝手に貼ってくれるみたいなので、`add_index`は書かずに、`add_foreign_key`だけ書いてみるというやり方を取ってみました。
以下は、私のソースコードです。

```scheme:Schemafile
create_table "users", force: :cascade do |t|
  t.string   "email"
  t.string   "password"
end

create_table "tasks", force: :cascade do |t|
  t.belongs_to  "user", null: false, foreign_key: true
  t.string   "title"
end

add_foreign_key "tasks", "users", name: "task_ibfk_1"
```

#### ポイント
`t.belongs_to "model", null: false, foreign_key: true`をつける

これをつけずに`t.integer "user_id"`と書いてしまうと、次のようなエラーが出ます。
bigintとintで型が違うから合わせろということみたいなのですが、デフォルトのbigintでidをつけたほうがいいと思い、上のような書き方にしました。

```zsh
Column `user_id` on table `tasks` does not match column `id` on `users`, which has type `bigint(20)`. To resolve this issue, change the type of the `user_id` column on `users` to be :bigint. (For example `t.bigint :user_id`).
```

この形にするまで結構時間がかかってしまった、、、
【JavaScript】配列の操作いろいろ②

##`配列の要素をループ処理する`##

- forEach( )を使う

```javascript
//配列.forEach((item) => {
  // itemに関する処理
  // itemは、配列の中身のうち、任意の１つを指し示す
//}
//プログラム中の「item」とは、「配列の中身のうちの１つ」という意味　名前は何でも良い
const fruits = [ "apple", "banana", "orange", "melon" ];
    //アロー関数とテンプレートリテラルを使って取り出してみる
  fruits.forEach((item) => {
  console.log(`Fruits: ${item}` ); 
 });
//実行結果
//Fruits: apple
//Fruits: banana
//Fruits: orange
//Fruits: melon
```

##`配列の要素に何らかの処理をしてそれを別の配列として定義する`##

- map( )を使う

```javascript
const prices = [180,190,200];
  //新しい配列にpricesの要素に２０足したものを代入
const upDatedPrices = prices.map(price => prices + 20);
console.log(upDatedPrices);
//実行結果
//200,210,220
```

##`配列の要素をチェックして条件に合うものだけを取り出す`##

- filter( )を使う

```javascript
const numbers = [1,4,7,8,10];
  //numberを2で割った余りが0の数だけreturnする
const newNumbers = numbers.filter(number => number % 2 === 0);

console.log(newNumbers);
//実行結果
//4,8,10
```

##`配列をオブジェクトで作る`##

- キーを使う

```javascript
//プログラム中のchocolateやcreamがキーとなる
//180や210はそのキーの値となる。
const bread = {
  chocolate: 180, 
  cream: 210
};
console.log(bread);
//実行結果
//chocolate: 180, 
//cream: 210
```
AWS Lambdaの運用監視ツール

# AWS Lambdaの運用監視ツール

便利なツールは以下の通り

* DAZN Lambda Powertools

関連性のあるLambda同士を紐づけるIDをログに出力してくれます。
LambdaからLambdaの呼び出しが複雑になる場合に、関連性のあるログを一括して検索した場合に活用できます。

参考URL：https://dev.classmethod.jp/articles/dazn-lambda-powertools/

* AWS X-Ray

AWSのサービス（Lambdaもできる）の関連性を可視化でき、分析もできます。
※画面イメージ的には、JP1とか、Jenkinsのパイプライン的な感じ。Lambdaのジョブフローが見える感じ。
※内部的には、上記で紹介した「DAZN Lambda Powertools」と同じようなことしてます。

参考URL：https://docs.aws.amazon.com/xray/index.html

DAZN Lambda Powertools＆AWS X-Rayどちらも使う場合の実装サンプルは以下。

```js
var AWSXRay = require('aws-xray-sdk-core');
const client = require('@dazn/lambda-powertools-lambda-client');
var Lambda = AWSXRay.captureAWSClient(client);
const Log = require('@dazn/lambda-powertools-logger');
const wrap = require('@dazn/lambda-powertools-pattern-basic');

exports.handler = wrap(async (event, context) => {
    Log.info('start');
    const request = {
        FunctionName: '次の関数名',
        InvokeArgs: JSON.stringify({ message: 'hello lambda' })
    };
    await Lambda.invokeAsync(request).promise();
});
```
※アクティブトレースにチェック必要（X-RAY使う為）
※レイヤーに、xrayとdaznのライブラリ追加が必要
※起点のLambdaから複数のLambdaを非同期的に呼び出す場合は、AWSXRay.captureAsyncFuncを使った方が良さげ。
※本番環境で運用する場合は、エラーハンドリングはちゃんと書いてね。

なお、X-RAYの機能は、性能分析（Lambdaの実行時間分かる）に使えるのですが、
Lambdaの中の一部分の性能をはかりたい場合には、サブセグメント（beginとend）を決め、
サブセグメントの実行時間を計測できます。

詳細は以下URL
https://docs.aws.amazon.com/ja_jp/xray/latest/devguide/xray-sdk-nodejs-subsegments.html

概念的にはJavaの実装のが理解しやすい。以下の通り
https://docs.aws.amazon.com/ja_jp/xray/latest/devguide/xray-sdk-java-subsegments.html
※Node.jsでも、Java的な書き方は可能。
SSMS のテーブルデザイナの列をカスタマイズした

テーブルデザイナの列をカスタマイズしよーと思い、弊社の先輩 xin9le 先生のブログを参照しました。
参考：[SQL Server Management Studio のテーブルデザイナの列をカスタマイズする](https://blog.xin9le.net/entry/2018/06/17/165526)

しかし、アップデートか何かでレジストリキーの場所が少々変更されていたっぽく...気になったので訂正させていただきます(笑)。
一度設定すれば良きものだし、次変更するときはまた変わるかもですが、とりあえずのメモを残しておこうと思います。

18.0 では以下の場所におりました。
```HKEY_CURRENT_USER\Software\Microsoft\SQL Server Management Studio\18.0_Isoshell\DataProject ```

んま、[編集] > [検索] から `SSVPropViewColumnsSQL70` で検索かければファイル移動されててもどこにおるか分かりますけどね。
(にしても [編集] タブに [検索] いるの可笑しい気がするのだが...？？？そう思うの私だけか？？？)
帯域幅とは

<h1>帯域幅とは</h1>
1秒間にどれだけ多くの情報を伝えられるか

<h1>ビット（bit）とは</h1>
コンピュータが処理する情報の最小値
電子信号の1単位、０か１の2進数できている
8ビットで1バイトになる

<h1>bpsとは</h1>
1秒間に転送できるビットの数

100bps=1秒に100ビット転送できる
Volume Shadow Copy Service 有りバックアップ

Volume Shadow Copy Service 有りバックアップの実力は…?

FileAccess, FileShare, LockFile 有無の別でオープンしているファイルが
各々バックアップ可能なのかどうかを検証しました。

`*Access` と `Share*` は、ファイルロックのシミュレーションプロセスで使用する [File.Open](https://docs.microsoft.com/ja-jp/dotnet/api/system.io.file.open?view=netcore-3.1#System_IO_File_Open_System_String_System_IO_FileMode_System_IO_FileAccess_System_IO_FileShare_) の引数です。`Lock` は `fs.Lock(0, 1);` でファイルの一部をロックしているものです。

|FileAccess,FileShare,LockFile の別|BunBackup (VSS 有)<br>MirrorBackup1 (VSS 有)<br>MirrorBackup2.1 (VSS 有)<br>DiffBkCli (VSS 有)|robocopy<br>xcopy<br>BunBackup (VSS 無)<br>MirrorBackup1 (VSS 無)<br>MirrorBackup2.1 (VSS 無)|DiffBkCli (VSS 無)|
|---|:-:|:-:|:-:|
|ReadAccess,ShareNone,|✔|||
|ReadAccess,ShareNone,Lock|✔|||
|ReadAccess,ShareRead,|✔|✔||
|ReadAccess,ShareRead,Lock|✔|||
|ReadAccess,ShareReadWrite,|✔|✔||
|ReadAccess,ShareReadWrite,Lock|✔|||
|ReadAccess,ShareWrite,|✔|||
|ReadAccess,ShareWrite,Lock|✔|||
|ReadWriteAccess,ShareNone,|✔|||
|ReadWriteAccess,ShareNone,Lock|✔|||
|ReadWriteAccess,ShareRead,|✔|✔||
|ReadWriteAccess,ShareRead,Lock|✔|||
|ReadWriteAccess,ShareReadWrite,|✔|✔||
|ReadWriteAccess,ShareReadWrite,Lock|✔|||
|ReadWriteAccess,ShareWrite,|✔|||
|ReadWriteAccess,ShareWrite,Lock|✔|||
|WriteAccess,ShareNone,|✔|||
|WriteAccess,ShareNone,Lock|✔|||
|WriteAccess,ShareRead,|✔|✔||
|WriteAccess,ShareRead,Lock|✔|||
|WriteAccess,ShareReadWrite,|✔|✔||
|WriteAccess,ShareReadWrite,Lock|✔|||
|WriteAccess,ShareWrite,|✔|||
|WriteAccess,ShareWrite,Lock|✔|||

VSS On だと基本的に全部いけそうですね…
spineで詰まったときのバッドノウハウ集

詰まったときにまた戻ってくこれるようにまとめておきます。

###コンストレイトが上手く動かないときはコンストレイトの上下関係を確認する
![55302664ca328aa1b337d85c5b39a392[1].png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/22850/23ba7361-4a9a-1c23-ad37-a9a1dfddf4bb.png)
コンストレイトを設定しても期待通りの動きにならないときは、コンストレイトの上下関係を変えてみると動く。実際のボーンの上下関係と合わせるようにすると動く。

###親階層のボーンしかコンストレイトの対象にはならない。
当たり前の話ではあるんだけれど、つい子要素のボーンを対象としがちなので、親または同じ階層のボーンしかコンストレイトの対象にはできない。
バッチ処理とは

<h1>バッチ処理とは</h1>
<h2>気になった過程</h2>
ウェブサーバーについて学習をしている際に、登場してきた単語。


<h2>バッチ処理とは何なのか</h2>
やらないといけない処理をひとまとめにボチッとやること
例えば、「iPhoneのバックアップ」
→まとめて夜のうちに写真、音楽、電話帳などのバックアップをとっておく

・決められたタイミングで定期的に処理が起動される

・「1日に1回」「1ヶ月に1回」など定期定期に！


<h2>何に使われているのか</h2>
システムの日々の処理や定期的なデータの集計
一度に複数のAPIリクエストを送るとRails serverがハングアップする

## 現象
- ローカルで一度に複数の API リクエストを送ると Rails server がハングアップする
    - `Ctrl + C` を押下してもプロセスを終了できなくなる
    - lsof コマンドと kill コマンドを実行するなどして、プロセス終了させる必要がある

## 再現した環境
- rails: `v5.0.7.2`
    - 注意：`v5.2` 以上では解決されている
    - 参考：https://github.com/rails/rails/pull/36939

## 解決方法
### 1. パッチを適用する
- rails に `v5.2` でマージされた修正をパッチとして適用することで解決できる
  - 参考：https://github.com/rails/rails/pull/36939

```diff:actionpack/lib/action_controller/metal/params_wrapper.rb
 def model
-  super || synchronize { super || self.model = _default_wrap_model }
+  super || self.model = _default_wrap_model
 end
```

### 2. eager_load を true にする
- eager_load を true にすることでも解決できる
  - 参考: https://github.com/rails/rails/issues/32451#issuecomment-378618765

```diff:config/environments/development.rb
- config.eager_load = false
+ config.eager_load = true
```



### 3. puma の設定を変更する
- 同時に実行できるスレッドの数を1にすることでも解決できる
    - 参考: https://github.com/rails/rails/issues/32451#issuecomment-444945569

```diff:config/puma.rb
- threads_count = ENV.fetch("RAILS_MAX_THREADS") { 5 }
+ threads_count = ENV.fetch("RAILS_MAX_THREADS") { 1 }
```
Ruby と Python で解く AtCoder JSC2019 Qual B 等差数列の和 逆元

# はじめに
*[AtCoder Problems](https://kenkoooo.com/atcoder/#/)* の Recommendation を利用して、過去の問題を解いています。
AtCoder さん、AtCoder Problems さん、ありがとうございます。
# 今回のお題
*[AtCoder JSC2019 Qual B - Kleene Inversion](https://atcoder.jp/contests/jsc2019-qual/tasks/jsc2019_qual_b)*
<font color="brown">Difficulty: 797</font>

今回のテーマ、等差数列の和 + 逆元
# Ruby
`転倒数`って初めて聞きますが、例`1 3 2`について、どのような`転倒数`になるのか見てみます。

|K|3|2|1|合計|
|:--|--:|--:|--:|--:|
|132|||1|1|
|132 132||4|1|5|
|132 132 132|7|4|1|12|
`1 3 2`が一つで`1`、二つ並んで`1 3 2 1 3 2`は`4 + 1`、三つならんで`1 3 2 1 3 2 1 3 2`は`7 + 4 + 1`と、等差数列の和になっていることが分かります。
等差数列の和の公式は、*[＿こちら＿](https://www.kwansei.ac.jp/hs/z90010/sugakua/suuretu/tousasum/tousasum.htm)* を参照しました。

```ruby.rb
n, k = gets.split.map(&:to_i)
a = gets.split.map(&:to_i)
b = a + a
c = 0
(a.size - 1).times do |i|
  (i + 1).upto(a.size - 1) do |j|
    c += 1 if a[i] > a[j]
  end
end
d = 0
(b.size - 1).times do |i|
  (i + 1).upto(b.size - 1) do |j|
    d += 1 if b[i] > b[j]
  end
end
d -= c * 2
def modpow(n, p, mod)
  r = 1
  while p > 0
    r = r * n % mod if p & 1 == 1;
    n = n * n % mod
    p >>= 1
  end
  r
end
def modinv(n, mod)
  modpow(n, mod - 2, mod)
end
MOD = 1_000_000_007
ans = (k - 1) * d % MOD
ans += 2 * c
ans %= MOD
ans *= k
ans %= MOD
ans *= modinv(2, MOD)
ans %= MOD
puts ans
```
```cal.rb
c = 0
(a.size - 1).times do |i|
  (i + 1).upto(a.size - 1) do |j|
    c += 1 if a[i] > a[j]
  end
end
d = 0
(b.size - 1).times do |i|
  (i + 1).upto(b.size - 1) do |j|
    d += 1 if b[i] > b[j]
  end
end
d -= c * 2
```
初項`c`と公差`d`はここで求めています。

```wa.rb
ans = (k - 1) * d % MOD
ans += 2 * c
ans %= MOD
ans *= k
ans %= MOD
ans *= modinv(2, MOD)
ans %= MOD
```
等差数列の和の公式部分ですが、`2`による割り算があるため、逆元を求める必要があります。
# Python
```python.py
n, k = map(int, input().split())
a = list(map(int, input().split()))
b = a + a
c = 0
for i in range(len(a)):
    for j in range(i + 1, len(a)):
        if a[i] > a[j]:
            c += 1
d = 0
for i in range(len(b)):
    for j in range(i + 1, len(b)):
        if b[i] > b[j]:
            d += 1
d -= c * 2
def modpow(n, p, mod):
    r = 1
    while p > 0:
        if p & 1 == 1:
            r = r * n % mod
        n = n * n % mod
        p >>= 1
    return r
def modinv(n, mod):
    return modpow(n, mod - 2, mod)
MOD = 10 ** 9 + 7
ans = (k - 1) * d % MOD
ans += 2 * c
ans %= MOD
ans *= k
ans %= MOD
ans *= modinv(2, MOD)
ans %= MOD
print(ans)
```
`PyPy3 (2.4.0)`でも、そのまま使用できました。

||Ruby|Python|PyPy3|
|:--:|--:|--:|--:|
|コード長 (Byte)|621|676|676|
|実行時間 (ms)|948|1903|322|
|メモリ (KB)|1916|3188|41692|
# まとめ
+ JSC2019 Qual B を解いた
+ Ruby に詳しくなった
+ Python に詳しくなった

参照したサイト
*[４ 等差数列の和](https://www.kwansei.ac.jp/hs/z90010/sugakua/suuretu/tousasum/tousasum.htm)*
React コンポーネントについて

#はじめに
Reactコンポーネントに関するまとめ

## Functional Component
- 関数定義によって定義されたコンポーネント
 
```react

import React from 'react';

const Hello = (props) => {
    return <div>こんにちは、{props.name}さん</div>
}
```

## Class Component
- クラスによって定義されたコンポーネント
- stateがある
- ライフサイクルメソッドを定義できる

```react
import React from 'react';

class Hello extends React.Component {
  render() {
    return <div>こんにちは、{props.name}さん</div>;
  }
    
}
```

## Fragmentコンポーネント
- HTMLとしての要素を持たない

```react
import React from 'react';

const HelloFragment = () => {
    return (
        <React.Fragment>
            <div>こんにちは</div>
            <div>坂本龍馬さん</div>
        </React.Fragment>
    )
}
```
- 最上位の親のタグをHTML要素のものを使用する必要はない

## データの受け渡し(props)
- propsとして受け取った型はobject型

### children 
- Reactコンポーネントの子要素がchildrenとして渡される
    - Vueのslotのようなもん？

### propsのチェック (propsTypes)
- 事前にpropsの型を定義しておけば、エディタで記載時に警告を受けられる
    - TypeScriptみたいなもん？
    - Class ComponentとFunctional Componentのどちらでも可能

```react
import PropTypes from 'prop-types';

const Hello = (props) => {
    return <div>こんにちは、{props.name}さん</div>
};

Hello.PropTypes = {
    name: PropTypes.string
};
```

## stateとイベントハンドリング
### setState
- 変更のあったstateのみ上書きするメソッド
    - stateの値を変更する場合は必ずsetStateを使用
    - 配列に追加する際はpushメソッドは用いず、concatメソッドやスプレッド構文を使用する

### イベント
- constructorでthisをバインドする
    - イベント関数内でthisが示すものを、「このコンポーネント」にする
    - そうしないとthis.stateでコンポーネントに定義した状態を呼び出せない

```react
constructor(props) {
    this.addTodo = this.addTodo.bind(this);
}
```
- アロー関数を使用すると、constructorでthisをbindしなくても良い
- 同じメソッドを複数のコンポーネントへ渡す場合、アロー関数では難しい
- 基本はconstructorでbindする方法を実施する
【AzureAD】Intuneの利用について

AzureADのintuneを2か月くらい勉強したのでアウトプットしてみました
ちょっと粗削りですが、テレワークへのセキュリティ強化に繋ればと思います
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/a3325ac8-fa7b-4912-2675-9ada3c129a0f.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/a230ffd0-9649-191c-6f8a-897714c98e8a.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/345b2829-b026-71de-1ab1-737f87414e3e.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/8ca00908-f1c4-651a-9498-d31880570d57.png)
![image.png](https://qiita-image-store.s3.ap-northeast-
1.amazonaws.com/0/480057/cb7879b3-f9be-4124-daad-e8bc8ca70dad.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/637299e7-85a4-1346-8127-5a8fd3a9967a.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/3fbae613-a91a-d77a-4328-efe576b9dac4.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/540892c9-0989-8951-5064-59b114dc5f43.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/c7826430-26ef-5c00-d926-76c9d0821c0d.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/77dad2e7-222a-fe7c-f9e2-b6b91302fd53.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/a7276799-2fcc-684b-0dcf-5bfd2c3756de.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/6f30a5ae-f222-c35d-ed4b-6dbd9ee5a582.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480057/4e3dffaa-355d-7ef3-0d3b-179e233a6dff.png)

具体的な設定等は少しずつアウトプットしていこうと思います。
PHPを使ったファイル操作の基本

簡易まとめ
## 使用した関数

```:sample
//$file_pathにあるファイルを開く
$open_file = fopen($file_path, 'r');
//ポインターの場所を取得
ftell($open_file)
//ポインターある位置の文字を取得する
fgetc($open_file)
//ポインターがある位置からその行の最後までを取得する。また、ポインターが取得したバイト数分移動する
fgets($open_file)
//ポインターの場所をファイルの先頭から指定したバイト数分移動した位置に変更する
fseek($open_file, bytes)
```

## 例

```example.txt
1line
2line
3line
4line
5line
```

```php:example.php
<?php
$file_path = "./example.txt"; //pathは自分の環境似合わせてね！
$open_file = fopen($file_path, 'r');
echo("何もしていない時のポインター位置: ".ftell($open_file)."\n");
echo(fgets($open_file));
echo("fgets()を一回実行した後のポインター位置: ".ftell($open_file)."\n");
echo(fgets($open_file));
fseek($open_file, 6);
echo("fseek($open_file, 6)を実行した後のポインター位置: ".ftell($open_file)."\n");
echo(fgets($open_file)."\n");

//おまけ
fseek($open_file, 1);
echo(fgetc($open_file)."\n");
echo(fgets($open_file));
echo(fgets($open_file));
echo(fgets($open_file));
echo(fgets($open_file));
echo(fgets($open_file));
?>
```

terminalで`php ./example.php`を実行する

```:結果
何もしていない時のポインター位置: 0
1line
fgets()を一回実行した後のポインター位置: 6
2line
fseek(Resource id #5, 6)を実行した後のポインター位置: 6
2line

l
ine
2line
3line
4line
5line
```
結構便利な８の字巻き

## 8の字巻きとは？
8の字巻きとは、ケーブルを巻く方法の一つです。
この方法をパソコンの電源ケーブルを巻く時に用いれば、絡まない、断線しづらい、綺麗、というメリットがあります。
元々は音楽関係の言葉であり、趣味や仕事で音楽をやっている人はこの巻き方が出来ないと先輩やスタッフに怒られてしまいます。(私はギター講師に舌打ちされました。)

## やり方
コードを順巻き→逆巻き→順巻き→逆巻き...と巻いていけば出来ます。
画像で見ていきましょう。

### 順巻きの手順
右手でケーブルを順手で持ちます。
<img width="400" alt="0" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429077/d0c1e248-776f-c611-cb48-56c133bcee84.jpeg">
左手の方に右手を寄せていってケーブルを巻きます。
<img width="400" alt="0" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429077/1848d727-259d-aa27-d701-4c970143c8ea.jpeg">


## 逆巻きの手順
右手でケーブルを逆手で持ちます
<img width="400" alt="0" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429077/7a6e1890-e28d-37ba-ff38-8a3938cd0caa.jpeg">
左手の方に右手を寄せていってケーブルを巻きます。
<img width="400" alt="0" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429077/bd410a8f-d6fa-ccdf-517c-9ea72fb81551.jpeg">
上記の巻き方を繰り返せばケーブルが綺麗に巻けてケースにもピッタリ収まります。
<img width="400" alt="0" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429077/21f7edf0-7410-e027-1cef-d06daa445234.jpeg">

## 実演
![IMG_0299.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/429077/c2650b8e-d322-0f5d-5142-d05bc15d465e.gif)


## 出来なかったら
多分一発では出来ません。8の字巻きを今までやってこなかった場合はケーブルに変な型がついているためです。
慣れるまでは大変ですが、毎日巻いてあげることで8の字巻きに適した型となっていきます。
めげずに頑張りましょう。
JavaScript: 正規表現で.+ .* を改行にマッチさせる

JavaScriptの正規表現の`.`は、改行文字にはマッチしません:

```js
console.log('\r\n123abc'.match(/./g))
console.log('\r\n123abc'.match(/.+/g))
```

```js:結果
[ '1', '2', '3', 'a', 'b', 'c' ]
[ '123abc' ]
```

## 正規表現で`.`を改行にマッチさせる方法 (ES2018以降)

ECMAScript 2018以降のJavaScriptで、`.`を改行にマッチさせるには、`/s`(dotAll)フラグを使います:

```js
console.log('\r\n123abc'.match(/./gs))
console.log('\r\n123abc'.match(/.+/gs))
```

```js:結果
[
  '\r', '\n', '1',
  '2',  '3',  'a',
  'b',  'c'
]
[ '\r\n123abc' ]
```

## 正規表現で`.`を改行にマッチさせる方法 (ES2018未満)

ECMAScript 2017までのJavaScriptで、`.`を改行にもマッチさせるには、`[\s\S]`を使います:

```js
console.log(`\r\n123abc`.match(/[\s\S]/g))
console.log(`\r\n123abc`.match(/[\s\S]+/g))
```

```js:結果
[
  '\r', '\n', '1',
  '2',  '3',  'a',
  'b',  'c'
]
[ '\r\n123abc' ]
```

### `[\s\S]`とは？

#### `\s`

スペース、タブ、改行など、空白文字にマッチする文字クラスです。

#### `\S`

`\s`以外の文字全てにマッチする文字クラスです。

#### `[...]`

`[`から`]`にリストアップされた文字どれかにマッチするという意味です。

例えば、`[abc]`は`'a'`、`'b'`、`'c'`にマッチします。

#### 要するに、`[\s\S]`とは？

空白文字、もしくは、空白文字以外にマッチするという意味です。

つまるところ、どんな文字にもマッチするということになります。

---

最後までお読みくださりありがとうございました。Twitterでは、Qiitaに書かない技術ネタなどもツイートしているので、よかったらフォローしてもらえると嬉しいです:relieved:→[Twitter@suin](https://twitter.com/suin)
【JavaScript】連想配列（Object）でmap関数の処理をしたい

## やりたいこと
JavaScriptのmap関数は、配列の値に対し処理を適用することで新しい配列を返す便利な関数です。これを連想配列（Object）に対しても使いたい場合、どのように書けば良いのかサンプルを紹介します。なお、map関数については[【JavaScript】map関数を用いたおしゃれな配列処理](https://qiita.com/codeship_tech/items/a4c8ba5d26a09dc79e6a)を参照ください。

## 前提や参考記事など
* JavaScriptのネイティブ関数だけで実装する前提とします。[javascript Objectでmap,filter,reduceなどを使いたい....。](https://it7c.hatenadiary.org/entry/20160201/1454325903)の記事にある通り、Objectにはmap関数はないので、`Object.keys`使ってkeyの配列を取得した上で連想配列の値に処理を適用するようにします。
* Objectのkeysを使ってmap関数を適用すると配列の中にObjectが格納され、連想配列の形になりません。今回はreduce関数を使用してこの課題を解消します。詳細は[Convert object array to hash map, indexed by an attribute value of the Object](https://stackoverflow.com/questions/26264956/convert-object-array-to-hash-map-indexed-by-an-attribute-value-of-the-object)を参照ください。
* ES2015(ES6)以降での実装を前提とします。オブジェクトのキー設定に`[]`を使用して変数展開するためです。詳細は[ES2015以降のJavaScriptでObjectのkeyに変数を使う](https://qiita.com/kmagai/items/95481a3b9fd97e4616c9)を参照ください。

## サンプルコード
```sample.js
const beforeObject = {
  test1: 1,
  test2: 2
};

// 2倍にする
const afterObject = Object.keys(beforeObject).reduce(
  (after, key) => ({
    ...after,
    [key]: beforeObject[key] * 2
  }),
  {}
);
```

## 結果
`{ test1: 1, test2: 2 }`が`{ test1: 2, test2: 4 }`に変換されます。

## 追記（2020/5/13）
@ttatsf さんにコメント頂きましたが、ES2019から追加された`Object.fromEntries`で以下のようにも書けます。
[Object.fromEntries()でオブジェクトをmapする](https://hfuji.hatenablog.jp/entry/2019/04/30/223722)の記事も参考になります。

```sample.js
const afterObject = Object.fromEntries(
  Object.entries( beforeObject )
  .map( ( [ _, value ] ) => [ _, value * 2 ] )
)
```
VBAでよく使うコード

#日付・時刻の関数
Dateserial( 年 , 月 , 日)・・・Excel関数のDate()と同じ
Timeserial(時 , 分 , 秒)・・・Excel関数のTime()と同じ

#その他関数
Sum、Average、Count、Sumifs、Averageifs、Countifs、Vlookup、等のExcel関数はVBAでも使える。但し、その場合は、
Application.WorksheetFunction.SumIfs(          )という前置き分が必要
Application.WorksheetFunction.Vlookup( 数値 , Range( Cells( , ) , Cells( , ) ) , 2, False)
みたいに書く


#列の最終行数の取得

Cells(Rows.Count,  列 ).End(xlUp).Row
もしくは
Range("A1000000").End(xlUp).Row

#別ファイルを開く
```vb

Workbooks.Open pass1

#保存せず閉じる
Workbooks(strBookName).Close SaveChanges:=False

#行のコピー
Rows(行).Copy Destination:=Rows(行)

#空白行の入れ方
Rows(行).Insert

#並び替え
Range(Cells(1, 1), Cells(Cells(Rows.Count, 1).End(xlUp).Row, 27)).Sort _
Key1:=Range("X2"), Order1:=xlAscending, Header:=xlYes, _
Key1:=Range("X2"), Order1:=xlAscending, Header:=xlYes
```
HTMLで直接色とスタイルをつける方法

#目的
SCSSデザインを少し加味し、印象付けさせる

#元のビュー
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634461/bed81cb3-8a67-5455-8a79-411c179dae20.png)

#HTMLのELEMENTで修飾した後
一例：

```application.html.erb
  <body>
    <header>
      <nav class="brown lighten-4 z-depth-2">
```
下記の図のように影を付け加えることができました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634461/9da1ecc3-5a1a-0c86-18b1-7c4e5adc6984.png)

#以上
scikit-learn使い方まとめ(機械学習)

#クラスタリング分析(k-means法)
・dfにデータフレームを、numにクラスター数を記入
・random_stateで、ランダムシードの整数を指定する

```python
def clustering_analytics(df, num):
    df_temp = df.copy()
    from sklearn.preprocessing import StandardScaler
    from sklearn.cluster import KMeans
    sc = StandardScaler()
    #標準化
    df_std = sc.fit_transform(df_temp)
    
    kmeans = KMeans(n_clusters=num, random_state=0)
    clusters = kmeans.fit(df_std)
    df_temp["cluster"] = clusters.labels_
    return df_temp
```

#主成分分析(PCA）
・dfにデータフレームを、numに主成分数を記入

```python
def PCA_analytics(df, num):
    from sklearn.preprocessing import StandardScaler
    from sklearn.decomposition import PCA
    import numpy as np
    sc = StandardScaler()
    df_temp = df.copy()
    #標準化
    df_std = sc.fit_transform(df_temp)
    pca = PCA(n_components = num)
    pca.fit(df_std)
    df_temp__pca = pca.transform(df_std)
    pca_df = pd.DataFrame(df_temp__pca)
    
    print('components、主成分')
    print(pca.components_)
    print('mean、平均')
    print(pca.mean_)
    print('covariance、共分散行列')
    print(pca.get_covariance())
    W, v = np.linalg.eig(pca.get_covariance())
    print('eigenvector、固有ベクトル')
    print(v)
    print('eigenvalue、固有値')
    print(W)
    return pca_df
```
スクレイピング関係まとめ(selenium,pyautogui)

・pip install pyautoguiとseleniumをやる

#selenium

```python

#ライブラリをインポート
from selenium import webdriver
from selenium.webdriver.support.ui import Select
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.options import Options
import os
import time
import requests
from selenium.webdriver.common.keys import Keys
import requests
from bs4 import BeautifulSoup
import pyautogui
import pandas as pd
from selenium.webdriver.common.action_chains import ActionChains
from selenium.common.exceptions import NoSuchElementException
import datetime as dt
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions

def LOG_IN():    
    #クロームドライバーを指定
    driver = webdriver.Chrome(**chromedriver.exe**)

    driver.get("hoghoge")

    #ユーザーID、パスワード、ログインボタンのタグを取得
    userId = driver.find_element_by_name('userId')
    password = driver.find_element_by_name('password')
    loginButton = driver.find_element_by_name('login')
    
    #ユーザーIDとパスワードを入力してログイン
    userId.send_keys('hogehoge')
    password.send_keys('hogehoge')
    loginButton.submit()
    
    return driver
```
・色々な指定方法

```python
#エレメントの指定
driver.find_element_by_name()
driver.find_element_by_xpath()
driver.find_element_by_id()

#操作方法
.click()
.clear()
.send_keys()
.text
```

#pyautogui

```python

import os
import pandas as pd
import pyautogui
import pyperclip
from time import sleep
import win32com.client
import win32gui
import time
import openpyxl
from tkinter import *
import glob

#今のマウスの場所を調べる
print(pyautogui.position())
pyautogui.moveTo(35,170, duration=0.1)#移動
pyautogui.click()#クリック
pyautogui.dragTo(1350,670, duration=0.3, button='left')#ドラッグ
pyautogui.typewrite(txt)#テキスト入力

#クリップボードのコピー
df = pd.read_clipboard()

#ハンドラの取得
hWnd = win32gui.FindWindow(0, "アプリ名")
if hWnd is not 0:
    win32gui.SetForegroundWindow(hWnd)
```
pyodbcを利用したSQL接続方法

#SQLでデータ取得してdataframeに入れる方法

```python

import pyodbc

cnxn = pyodbc.connect('DSN=hoge; UID=hoge; PWD=hoge')
cursor = cnxn.cursor()
cursor.execute(SELECT hogehoge FROM @hogehoge WHERE hogehoge)
rows= cursor.fetchall()
array_format = np.array(rows)
df1 = pd.DataFrame(array_format)
```
【初心者】GoogleAppsScriptでGoogleカレンダーの情報を取得し、Googleスプレッドシートに登録する基本コード


## シートの説明
* Configシート
    * カレンダーデータ取得に必要な情報が記載されているシート
* Dataシート
    * 取得したカレンダーデータを登録するシート

#### Configシート
以下のようにカレンダー取得に必要な情報を登録する。
B列の情報を利用します。

|  | A | B | C |
|:-:|:-:|:-:|:-:|
| 1 | id（データ取得する対象） | abc＠gmail.com | |
| 2 | startTime（いつから） | 2020/05/01 | |
| 3 | endTime（いつまで） | 2020/05/31 | |


## コード
```javascript
function getCalList() {

  // get Config
  var sheet = SpreadsheetApp.getActive().getSheetByName('Config');

  // get id(mail address)
  var id = sheet.getRange('B1').getValue();

  // get startdate
  var startTime = sheet.getRange('B2').getValue();

  // get enddate
  var endTime = sheet.getRange('B3').getValue();


  // get Output sheet
  var outputsheet = SpreadsheetApp.getActive().getSheetByName('Data');

  
  // get Calendar events.
  // 参考）https://tonari-it.com/gas-calendar-getevents/
  var cal = CalendarApp.getCalendarById(id);
  var events = cal.getEvents(startTime, endTime);
  
  // 取得したカレンダーデータの展開（レコード化）
  var eventList = [];
  for(const event of events){
    eventrecord = [
      event.getTitle(),
      event.getDescription(),
      event.getStartTime(),
      event.getEndTime()
    ];
    eventList.push(eventrecord);
    console.log(event.getTitle());
  }
  
  outputsheet.getRange(2, 1, eventList.length, eventList[0].length).setValues(eventList);
  
}
```

## 参考
[Google Apps Scriptで特定月のカレンダーのイベント情報を取得する](https://tonari-it.com/gas-calendar-getevents/)
OpenCV関係(動画フレーム処理、直線・円周・領域検出)

・pip install python-cv2　でインストール

#動画のフレーム処理方法
```python

video_path = ""
cap = cv2.VideoCapture(video_path)
#count数
count = cap.get(cv2.CAP_PROP_FRAME_COUNT)
#フレームレート数
fps = cap.get(cv2.CAP_PROP_FPS)


for num in range(0, int(count), int(fps)*5):

    cap.set(cv2.CAP_PROP_POS_FRAMES, num)
    img = cap.read()[1]
    img1 = img[000:1200 , 200:1300]

    msec = cap.get(cv2.CAP_PROP_POS_MSEC)
    sss = str(int( round(msec/10**3,0))).zfill(5)
    cv2.imwrite(fn1 + '_'  + sss +  '.jpg', img1)

cap.release()
```


#直線検出

```python

import cv2
import os
import numpy as np

img = cv2.imread("exam.jpg")
img2 = img.copy()
img3 = img.copy()

#グレー変換
gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY)
cv2.imwrite("calendar_mod.png", gray)

#ネガティブ変換
#gray2 = cv2.bitwise_not(gray)
#cv2.imwrite("calendar_mod2.png", gray2)

lines = cv2.HoughLinesP(gray, rho=1, theta=np.pi/360, threshold=100, minLineLength=100, maxLineGap=0.000001)

#rho, theta はデフォルトを利用
#threshold は、直線を動かして、その直線状に乗ってきた点の数がこの値を超えたら線とみなす
#minLineLength は、ここに指定された値以上の長さを持つ線の候補が見つかったら、それを線として検出する
#maxLineGapは、2つの点が1つ線上にある場合に、点と点の間の間隔がここに指定した数より小さければ、同一の線とみなす


for line in lines:
    x1, y1, x2, y2 = line[0]

    # 赤線を引く
    red_lines_img = cv2.line(img2, (x1,y1), (x2,y2), (0,0,255), 1)
    cv2.imwrite("calendar_mod3.png", red_lines_img)

    # 線を消す(白で線を引く)
    #no_lines_img = cv2.line(img3, (x1,y1), (x2,y2), (255,255,255), 3)
    #cv2.imwrite("calendar_mod4.png", no_lines_img)
```

#円周検出

```python

img = cv2.imread(path)
img_hsv = cv2.cvtColor(img,cv2.COLOR_BGR2HSV)  # 色空間をBGRからHSVに変換
s_magnification =0.0  # 彩度(Saturation)の倍率
v_magnification = 1  # 明度(Value)の倍率

img_hsv[:,:,(1)] = img_hsv[:,:,(1)]*s_magnification  # 彩度の計算
img_hsv[:,:,(2)] = img_hsv[:,:,(2)]*v_magnification  # 明度の計算
img1 = cv2.cvtColor(img_hsv,cv2.COLOR_HSV2BGR)  # 色空間をHSVからBGRに変換
h, w = img1.shape[:2]
# グレースケールに変換する。
gray = cv2.cvtColor(img1, cv2.COLOR_BGR2GRAY)

# マスク作成 (黒く塗りつぶす画素の値は0)
mask = np.zeros((h, w), dtype=np.uint8)
# ハフ変換で円検出する。
circles = cv2.HoughCircles(
    gray, cv2.HOUGH_GRADIENT, dp=1.0, minDist=30, param1=120, param2=120
)

# 検出結果を描画する。
if circles is not None:
    circles = circles.squeeze(axis=0)  # (1, NumCircles, 3) -> (NumCircles, 3)
    for cx, cy, r in circles:
        # 円の円周を描画する。
        cv2.circle(img1, (cx, cy), r, (0, 255, 0), 2)
        # 円を描画する関数 circle() を利用してマスクの残したい部分を 255 にしている。
        cv2.circle(mask, (cx, cy),r, color=255, thickness=-1)
        # 円の中心を描画する。

```

#領域検出

```python

img = cv2.imread(path)
gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY)

#2値データ
ret, gray2 = cv2.threshold(gray, 100, 255, cv2.THRESH_BINARY)
    
gray3 = cv2.bitwise_not(gray2)

#ハフ変換で領域を検索
contours, hierarchy = cv2.findContours(gray3, cv2.RETR_LIST, cv2.CHAIN_APPROX_SIMPLE)

#各領域ごとに処理を実施
        
for i in range(len(contours)):
    #面積で条件指定
    if cv2.contourArea(cnt) > 20000 and cv2.contourArea(cnt) < 250000:
        hogehoge
```
Tesseract-OCRの導入方法と使い方

#tesseract-OCRの導入方法
・https://gammasoft.jp/blog/tesseract-ocr-install-on-windows/
・tesseract-ocr-w64-setup-v5.0.0-alpha.20200223.exeを実行
・Additional script data(download)：Japanese scriptとJapanese vertical scriptにチェック
・Additional language data(download):JavaneseとJapaneseとJapanese(vertical)にチェック

・https://poppler.freedesktop.org/
・popplerのフォルダをダウンロードする

#環境変数の設定
・Tesseract-OCR
・poppler-0.67.0\bin
　上記をPATHに追加する

#コードの書き方(OCRツールとPDF化)
```python
import os
from PIL import Image
from matplotlib import pyplot as plt
import cv2
from pdf2image import convert_from_path
import pyocr
import pyocr.builders
import sys
import pandas as pd
import time
import numpy as np
import glob
import shutil
#OCRツール自体
def OCR_read(PIL_data):
    
    tools = pyocr.get_available_tools()
    if len(tools) == 0:
        print("No OCR tool found")
        sys.exit(1)

    tool = tools[0]

    txt = tool.image_to_string( # ここでOCRの対象や言語，オプションを指定する
            PIL_data,
            lang='jpn',
            builder=pyocr.builders.TextBuilder(tesseract_layout=6)
            )

    txt1 = txt.replace(' ','').replace('\n','').replace('|','')
    return txt1
#PDFファイルを画像変換
def pdftoimage(work_directory, path1):
    images = convert_from_path(path1)
    i = 0
    for image in images:
        
        
        print("Making work{}.png ...".format(i))
        image.save(work_directory +"/Output_folder/"+ "work{}.png".format(i))

        i += 1
    imax =i
    return imax
```
Gurobi風の最適化記述方法

#1. 環境設定
・pip install mypulpでライブラリをインストール

#2. 実装方法

```python
#①最適化ライブラリを呼び出す
from mypulp import *

#②モデルを定義する
model = Model("名前は何でも良い")

#③変数を宣言する
X =model.addVar(lb=0,ub=GRB.INFINITY,vtype=‘C’,name=‘’)
#C:Continuous,B:Binary,I:Inter

#④モデルをアップデートする(変数宣言後)
model.update()
#gurobiでは必要だが、pulpでは不要

#⑤制約を定義する
model.addConstr(左辺の式　==  右辺の式, name=‘名前’ ) 

#⑥目的関数を定義する
model.setObjective(目的関数の式 , GRB.MINIMIZE)

#⑦モデルを解く
model.optimize()

#⑧結果を出力する
print('Opt. Value=', model.ObjVal)
print('x=', x.X)

#最適化の結果をstatusに格納
status = model.Status()
#If status == GRB.Status.OPTIMAL:
#    ～～で処理


#定式結果を確認する方法
model.write("名前.lp")

for v in model.getVars():
	print(v, v.X)#vに変数、v.Xに最適解が入る

for c in model.getConstr():
	print(c.ConstrName, c.Slack, c.Pi)
	#C.ConstrNameに制約名、c.Slackにスラック変数、
	#c.Piにラグランジュ乗数が入る

```
ローカルでmysql2::Error::ConnectionError (Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.sock' (2)):

# AWS EC2へCapistrano自動デプロイの環境を整えていたらエラーが起きた
Capistranoによる自動デプロイが完了し、S3をローカルで紐付けする前に
「あっ、そうだ　その前にローカルで正常に動くかどうか確認しなきゃ」
ということでやってみたら案の定エラーが、、、
## やったこと　
まあとにかくsocketの記述がおかしいんでしょ？と思い *config/database.yml* を確認


```config/database.yml
default: &default
  adapter: mysql2
  encoding: utf8
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  username: root
  password: ~~~~~~
  socket: /tmp/mysql.sock
```

おかしいところはないんだけどなー？

mysqlに接続できるか確認

```
mysql -u root
```

```
ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: NO)
```
できないじゃんww

##rootユーザーのPW設定をなくす
###MySQLの停止
```
$ mysql.server stop
```
###MySQLにログイン
```
$ mysql -uroot -p
>Enter password: #現在のPWを入力
```
###PWを空（’’）に設定する
```
mysql> use mysql
mysql> update user set password='' where User='root';
mysql> flush privileges;
```
###MySQLの起動
```
$ mysql.server start
```
###ローカルサーバーの再起動
```
$ rails s
```

#Mysql2::Error::ConnectionError (Access denied for user 'root'@'localhost' (using password: YES)):ってエラー出た
もしやと思い*config/database.yml* のpasswordをコメントアウト！


```config/database.yml
default: &default
  adapter: mysql2
  encoding: utf8
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  username: root
  #password: ~~~~~~
  socket: /tmp/mysql.sock
```

すると無事に開くことができました。