OmniAICreator/Qiita-1.07M huggingface dataset:
書評 DB 設計

#1　なぜこの記事を書いたか。
新人エンジニアさんでDBの設計で困っていたり、テーブルの設計ってどうやってやんのっ！！！
と発狂しかけている方もいらっしゃると思ったので、私の読んだデータベース関連の本等をここで紹介しようと思いました。

というわけで、私はこの本をいつ読んだか覚えていない前に読んだ本の紹介と感想について書いていこうと思います。

#2　私の読んだ本はこちら

https://www.amazon.co.jp/%E9%81%94%E4%BA%BA%E3%81%AB%E5%AD%A6%E3%81%B6DB%E8%A8%AD%E8%A8%88-%E5%BE%B9%E5%BA%95%E6%8C%87%E5%8D%97%E6%9B%B8-%E5%88%9D%E7%B4%9A%E8%80%85%E3%81%A7%E7%B5%82%E3%82%8F%E3%82%8A%E3%81%9F%E3%81%8F%E3%81%AA%E3%81%84%E3%81%82%E3%81%AA%E3%81%9F%E3%81%B8-%E3%83%9F%E3%83%83%E3%82%AF/dp/4798124702/ref=sr_1_1?adgrpid=105637057656&dchild=1&gclid=CjwKCAjwndCKBhAkEiwAgSDKQffuCmRBkq3F685hT4uMrhQhtGN_7rEED8Fwzfs7_qqnAUj2E2kO2RoCPEAQAvD_BwE&hvadid=451936591846&hvdev=c&hvlocphy=1009718&hvnetw=g&hvqmt=b&hvrand=18238741691621331839&hvtargid=kwd-333952426763&hydadcr=15819_11177361&jp-ad-ap=0&keywords=%E9%81%94%E4%BA%BA%E3%81%AB%E5%AD%A6%E3%81%B6db%E8%A8%AD%E8%A8%88&qid=1632939425&sr=8-1

とこちら

https://www.amazon.co.jp/%E3%82%B9%E3%83%83%E3%82%AD%E3%83%AA%E3%82%8F%E3%81%8B%E3%82%8BSQL%E5%85%A5%E9%96%80-%E7%AC%AC2%E7%89%88-%E3%83%89%E3%83%AA%E3%83%AB222%E5%95%8F%E4%BB%98%E3%81%8D-%E3%82%B9%E3%83%83%E3%82%AD%E3%83%AA%E3%82%B7%E3%83%AA%E3%83%BC%E3%82%BA-%E4%B8%AD%E5%B1%B1%E6%B8%85%E5%96%AC/dp/4295005096/ref=sr_1_1?__mk_ja_JP=%E3%82%AB%E3%82%BF%E3%82%AB%E3%83%8A&crid=3IAAH0FINA0GL&dchild=1&keywords=%E3%81%99%E3%81%A3%E3%81%8D%E3%82%8A%E3%82%8F%E3%81%8B%E3%82%8Bsql&qid=1632939554&sprefix=%E3%81%99%E3%81%A3%E3%81%8D%E3%82%8A%2Caps%2C287&sr=8-1


#3 一応、二冊紹介してはいますが・・・・・
正直、一冊目の達人に学ぶDB設計を熟読すると、必要な知識はある程度揃うのではないかと思います。

もし、他にも良い本を見つけたら、紹介しようと思っています。
タスクスケジューラでpythonスクリプトを起動する

windowsタスクスケジューラでpythonファイルを定期実行させたい場合、python.exeを指定すると起動されないことがあるようなので.....
C:\Windows\py.exe　にpyファイルを渡すといいよっていう小ネタです。
従来のAppdata\Local\.......のpython.exeにスクリプトを投げても動くので、タスクスケジューラで動かない理由がわからないのですが、友人がその状況に陥ったので念のための代案としてのメモです。　Windows10, 11両方で確認済みです


つまりTask Scheduler > Action > Create Basic Task...　で、
NameやTriggerはお好みですが、ActionはStart a programで
Program/Scriptにpy.exeのパスを指定。
Add　arguments(引数)に実行したいスクリプトの名前を拡張子付きで
Start in にその実行したいスクリプトを置いているディレクトリまでのパス　を指定するわけですね。
以下の通り。　エクスプローラーの、パスとしてコピーを使うとダブルクォーテーションがつくのでここでは外した方がいいと思います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242735/8c7629e4-e3df-5cc1-86b5-32ff867cf5c8.png)

pythonのscheduleモジュールを使用してもいいと思いますが、スリープ解除など可能か分かりませんのでタスクスケジューラが無難だと判断しています。
Cloud9で利用しているEC2の空き容量不足を解決する

### 背景

Cloud9でEC2環境を立ち上げAWS CDKでAWSリソースをデプロイしようと試していたところ、以下のようなエラーが。

```shell
$ yarn cdk list

# （略）
latest: Pulling from xxxxxxx
xxxxxxxxxxxx: Extracting [==================================================>] 507.2MB/507.2MB
failed to register layer: Error processing tar file(exit status 1): write /usr/bin/xxx : no space left on device
```

どうやら環境にアタッチされたボリュームの空き容量が足りないとのことです。
この時選択していたEC2のインスタンスタイプは `t2.micro` でしたが、インスタンスタイプを変更してもアタッチされるEBSのボリューム（10GiB）は変わりませんでした。

### 解決

調べたところ、Cloud9のEC2にアタッチされるEBSボリュームのサイズを変更することができました。具体的な手順は以下リンクから公式ドキュメントをご確認ください。

[環境の移動と Amazon EBS ボリュームのサイズ変更または暗号化 - AWS Cloud9](https://docs.aws.amazon.com/ja_jp/cloud9/latest/user-guide/move-environment.html#move-environment-resize)

#### 手順を要約すると

- Cloud9環境内でシェルファイルを作成（コードは公式が準備済み）
- 引数に変更後のサイズ（単位はGiB）を指定しシェル実行
- 環境にアタッチされたEBSボリュームのサイズが変更された！

AWSコンソールのEC2サービスページのEBSの情報からも変更を確認することができました。後から知りましたが、普通にコンソールから変更しても良いようです。

### ちなみに

Cloud9環境でのAWS CDKの利用は、以下の公式ドキュメントが参考になります。

[AWS CDK sample for AWS Cloud9 - AWS Cloud9](https://docs.aws.amazon.com/cloud9/latest/user-guide/sample-cdk.html)
(Vagrant + )Fedora CoreOS の /sysroot の拡張

ちょっと用事があって、Vagrant + Fedora CoreOS の環境を作ってみた。
DockerFileをビルドしようとしたけど、あまりにでかいイメージで、途中でbuildがこけてしまった。
No Spaceのエラーが出ているので、CoreOSのサイズを拡張しようとしたけど、ちょっと悩んだのでメモ。

1. Vagrant で CoreOS の disksizeを大きくする。  
   Vagrant の plugin である、disksizeを使っていたので、ここの値を大きくする。

     ```plaintext
     config.disksize.size = '40GB'
     ```

1. cfdisk を実行し、/dev/sda4 を resize する。
   [ここ](https://qiita.com/tabimoba/items/a446f9caab4dce59c527)を参照した 。

1. 続いて、`xfs_growfs` を実行して完了の予定、、、だったが、 `XFS_IOC_FSGROWFSDATA xfsctl failed: Read-only file system` と言われて失敗。

1.  Read-Only と言われているので、Read Write に変更してから `xfs_growfs`を実行する。
    これで、/sysrootが拡張できた。

    ```bash
    sudo su
    growpart /dev/sda 4
    sudo su -
    unshare --mount
    mount -o remount,rw /sysroot
    xfs_growfs /sysroot
    ```
ボタンでコンテンツを切り替える

##ボタンクリックでコンテンツを切り替える

```jquery:jquery

var btns = $('.btn')
var contents = $('.contents');

btns.on('click', function () {
	var idx = btns.index(this);
	contents.hide();
	btns.removeClass("active");
	contents.eq(idx).fadeIn();
	$(this).addClass("active");
});


```


参考にしました

https://web-no-hito.com/index-eq-jquery/
FlutterでStreamBuilder、FutureBuilder、ListView.builder、ListTileの3段論法みたいなやつの書き方

FlutterでStreamBuilder、FutureBuilder、ListView.builder、ListTileの3段論法みたいなやつの書き方

・ListView.builderでListTileを量産、itemCountにアイテムの個数、itemBuilderにListTileを指定
・FutureBuilderでListView.builderを監視、futureが変化した際にbuilder以下が発動
・StreamBuilderでFutureBuilderを監視、streamが変化した際にbuilder以下が発動
この3段論法みたいなのを自力でカッコよく書けるようになりたい

```dart
StreamBuilder<QuerySnapshot>(
  stream: FirebaseFirestore.instance.collection('users').snapshots(),
  builder: (context, snapshot) {
    return FutureBuilder<>(
      future: FirebaseFirestore.instance.collection('messages').snapshot(),
      builder: (context, snapshot){
        return ListView.builder(
          itemCount: snapshot.data!.length,
          itemBuilder: (context, index){
            return ListTile(
              leading: Icon(Icons.home)
              title: Text(snapshot.data![index].title),
              trailing: Icon(Icons.settings)
              onTap: () {
                // Do something
                },
            )
          }
        )
      }
    )
  }
)

```
公式ドキュメント：
https://api.flutter.dev/flutter/widgets/StreamBuilder-class.html
https://api.flutter.dev/flutter/widgets/FutureBuilder-class.html
https://api.flutter.dev/flutter/widgets/ListView-class.html
https://api.flutter.dev/flutter/material/ListTile-class.html

参考：
https://bukiyo-papa.com/streambuilder
https://zenn.dev/sqer/articles/db20a4d735fb7e5928ba
https://ryamamoto.netlify.app/2020/01/16/future-future-stream
HTTPの基本的なこと

# はじめに
本記事では、HTTPについての基本的なことをまとめました。

# HTTPとは
Webアプリケーションを表示する際に、
情報やデータなどをレスポンスしたり、リクエストするための通信方法が`HTTP通信`と言います。
クライアント→Webサーバーは`HTTPリクエスト`
Webサーバー→クライアントは`HTTPレスポンス`です。

HTTP通信は何らかの情報があり、
通信時にHTML等を画面に表示することで、
Webアプリケーションを使うことができます。

## URL
`URL`は`インターネットのサービスの場所`を表しています。住所のようなものです。
URLにアクセスすることで、
その住所のWebアプリケーションとHTTP通信を行うことができます。

## メソッド
HTTP通信には、
Webアプリケーションで使用する処理の種類ごとに`8つの種類`が存在します。
HTTP通信の中で行いたい処理の種類を`HTTPメソッド`といいます。
以下、よく使うHTTPメソッドです。

|メソッド|内容|
|-|-|
|GET|取得する|
|POST|送信する、作成する|
|PUT|更新する、作成する|
|DELETE|削除する|


## HTTPリクエストの中身を構成するパート
以下のサイトにリクエストの中身の確認方法が詳しく載っています。
[HTTPリクエストとは？HTTPリクエストを目で確認したい](https://programmer-life.work/html_css/html-request)

```
ターミナルにて以下を入力すれば確認できます。(macではすぐに確認できるみたいです)(あとめちゃ長いです)

% curl --http1.1 --get -v サイトアドレス
```

```
例

初めの1行目「リクエストライン」
> GET /html_css/html-request HTTP/1.1

ここからは「リクエストヘッダー」
> Host: programmer-life.work
> User-Agent: curl/7.64.1
> Accept: */*

空白行
>

ここからは「レスポンスヘッダー」
< HTTP/1.1 200 OK
< Server: nginx
< Date: Wed, 29 Sep 2021 16:26:53 GMT
< Content-Type: text/html; charset=UTF-8
< Transfer-Encoding: chunked
< Connection: keep-alive
< Vary: Accept-Encoding
< X-Pingback: https://programmer-life.work/xmlrpc.php
< Link: <https://programmer-life.work/wp-json/>; rel="https://api.w.org/", <https://programmer-life.work/wp-json/wp/v2/posts/1823>; rel="alternate"; type="application/json", <https://wp.me/paLGy9-tp>; rel=shortlink
< Cache-Control: max-age=1
< Expires: Wed, 29 Sep 2021 16:26:54 GMT
< Vary: Accept-Encoding
< Access-Control-Allow-Origin: https://programmer-life.work/*

空白行
< 

ここからは「リクエストボディ」
<!DOCTYPE html>
.
.
.
以下省略
```

### リクエストライン
1行目に表示されます。
GETやPOSTなどのメソッドで始まります。

### HTTPリクエストヘッダー
- HOSTのアドレス
- User-Agent（ブラウザの種類やOSの情報）
- Accept（どんなデータを受け取るか、画像の種類や、言語、文字コードなどがあります）

などのWEBサーバーへ伝えるための情報が記載されます。

### レスポンスヘッダー
１行目については、`HTTPステータス`です。
リクエストに対する状態を示すものになります。
以下HTTPステータスの一覧です。
[ステータス](https://developer.mozilla.org/ja/docs/Web/HTTP/Status/400)

### HTTPリクエストボディ
見ての通り、画面の情報です。

以上です。

# 終わりに
HTTPについての質問をされた際に、全くと言っていいほど答えられなかったので、
自分の知識不足に絶望しました。
（（質問）HTTPにメソッドはありますよね？→（私）はにゃ？って感じでした）
ので、アウトプットしました。猛省。

IT関連の知識をもっと身につけます😇

以下参考サイトです。
[HTTPリクエスト/レスポンスとは? HTTPヘッダーを理解しよう](https://webtan.impress.co.jp/e/2010/01/12/7156)
[「HTTPリクエスト」と「HTTPレスポンス」](https://itsakura.com/network-http-get-post)
[HTTPリクエストとは？HTTPリクエストを目で確認したい](https://programmer-life.work/html_css/html-request)

一個一個知らないことは潰していくしかないな。
明日も頑張ります！
極めたい、ネーミングセンス

私は、クラス名、関数名、機能名、変数名、全てにおいて名前をつけるのが苦手です。
変数や関数が増えるたびになんて名前をつけよう、、翻訳サイトで調べて、、、とりあえずこれでつけとこ、という風に命名してしまっています。

会社の方にその様子を見られ一冊の本をおすすめしてくれ、大体目を通せたので要約したり、自分の言葉でまとめたいと思います。

#ネーミングの重要性

- 名前の影響について

文書などで関数名や機能名の説明をしている際に、中身の説明を変更した際には問題はありませんが、名前を変更してしまうと他の文書にも影響が出てしまいます。

A機能…A機能とは〜〜〜です。→説明文の修正は、「〜〜〜」を変えればOK。
(別の文書)B機能…この機能はA機能を使用して、×××ます。→前述のA機能の名前を変更すると、（別の文書）に出てくるA機能という名前も変更する必要がある。

つまり、一度命名し、プロジェクトが進んでしまった後に名前と役割が合ってないのでは？とか、あまりいけてないなあ、と思ってしまってもなかなか変更しづらいしそのまま進むしかないような状況に陥ってしまうことがあリます。

- ネーミングによる不具合や、考えのすれ違いを防ぐことができる

あまりいけていない名前がついてしまった場合、後からプロジェクトに入った初見の人は理解がしづらく開発にも影響が出てくる可能性があります。
仕様書を何回も確認する必要があるかもしれないし、コーディングをする際にも機能と役割が合っていないネーミングに合わせて実装することで、何か不具合が起こるかもしれません。

# ネーミングチェックをする

では実際にどのようにネーミングセンスを極めるか、という話です。
本には一応「ネーミングに成功するための７つのワーク」として、作業工程を解説していました。
（気になる方は参考文献に載せておくので読んでみてください。）

その中で、誰でもいつでも簡単にできていいなあ、実践してみよう！と思ったものが **ループバックチェック**です。

> 「ループバックチェック」は、説明→名前→説明の順序で、くるりと回って元に戻る(ループバック)ように説明が一致すればよし、一致しなければ要注意ということです。


やり方としましては、説明文から名前を考え、今度は逆に名前から推測できる説明文を考えます。
以下に何個か例を記載します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1833388/7503788f-1317-6ba5-32bf-1cda86eb870c.png)

上記図の説明はWiki先生に書いてあったものを引っ張ってきました。
上記図だと、「お寿司」の説明として「酢飯などと、主に魚介類を組み合わせた和食」はいけている気がしますが、
「酢飯などと、主に魚介類を組み合わせた和食」から「お寿司」を推測するのは難しいのかなあと。（海鮮丼も推測されてしまいそう）

ただ、一致しなかったからといってダメ、というわけではなくあくまで「要注意」とのことです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1833388/1ac62eda-1290-3b9b-b8bc-77085e1e8784.png)

もうちょっとエンジニア寄りの話で考えるために、適当にダイエットアプリを作っている想定で機能と説明を考えてみました。
恐らくもっといい名前はあるかと思いますが、とりあえず「名前」と「説明」でぐるぐる回ればOKということで。

# 最後に

今回、ループバックチェックを食べ物や機能名を例に考えてみましたが、あくまで考え方の話なので、変数や関数やクラス名、モジュール、機能、システム等、全てのネーミングにおいても使える（＋明日からでも実践できる！）技なんじゃないかなと思い、まとめてみました。

## 参考文献

この記事は以下の情報を参考にして執筆しました。

- [ネーミングの掟と極意](https://www.shoeisha.co.jp/book/detail/9784798114330)
FlutterでPathをインポートした時、contextにエラーが出る時の解決法

# 経緯
ほぼ題名通りですが、Flutterで[path](https://pub.dev/packages/path/install)をインポートしたら、これまでエラーが出ていなかった一文、`InputDialog(context);`の`context`に以下のようなエラーが出現。

```
The argument type 'Context' can't be assigned to the parameter type 'BuildContext'.dart(argument_type_not_assignable)
Context context
package:path/path.dart

The system path context.

This differs from a context created with [new Context] in that its [Context.current] is always the current working directory, rather than being set once when the context is created.
```

pathのインポート文`import 'package:path/path.dart';`を消したら、エラーも消えるので、pathが悪さをしてるんだろうなぁという推測はできるものの、何をどうして良いのか分からず、1日を無駄にしたので、解決法を記事にします。

# 解決法
1.　インポート文を
`import 'package:path/path.dart';`
から
`import 'package:path/path.dart' as path;`
のように変更。

2.　pathパッケージを使うものは`path.xxx`のように、先頭に`path.`を付けて記述する。
例えば、
`basename(file.path)`
なら、
`path.basename(file.path)`
のように記述。

これでエラーは消える。
簡単な対応でエラーが消えるのですが、日本語記事が少なかったこと、私のようなFlutter初心者であれば自力解決が難しいと思ったこと、私自身が一日を無駄にしたことから記事にしました。

# 参考にしたサイト
[STACK OVERFLOW Flutter - I get error when i add import 'package:path/path.dart'](https://stackoverflow.com/questions/54417811/flutter-i-get-error-when-i-add-import-packagepath-path-dart)
はじめてのReactおさわりお兄さんの成長記録#1～index.htmlの所在～

#目次
・おさわりお兄さん（以下、おさ兄）の経歴について
・想定読者
・Reactのチュートリアルを終えて
・お兄さんの目標
・ホームページ的なものを作ってみよう（今ここ）

##おさわりお兄さんの経歴について
・システム会社勤務のお兄さん
・Java畑でSpring Frameworkで育ったJava脳の持ち主
・JavaとちょっとばかりのWebシステム作成に付随する知識アリマスタブン

##想定読者
・おさ兄同様Reactわかりません！やりはじめます！っていう同志たち
・おいおい見ちゃいられねえヒヨコさんだなぁ！っていうマウント兄貴
・ふふふ、頑張りなさい、、、、！っていう聖人兄貴

##Reactのチュートリアルを終えて
ごめん、ほんとは終えてねぇんだ。。。
「タイムトラベル機能の追加」からやめた
だって、ゲーム機能作りこんでいく雰囲気したから、
別にゲーム機能作りに詳しくなりたんじゃないんよ。

##お兄さんの目標
おさ兄はWebシステム、Web Appをツクレルヨウニナリタイデス・・・・
仕様とか要件とかないと、いざ作るぞ！ってなっても
さて、何作る？ってなりません？おさ兄はなります。
なのでいったんWebシステム、Web Appはこれ作るぜってなるまで
ホームページ的なものをReactで作ってみようと思ってみました。まる。

##ホームページ的なものを作ってみよう（今ここ）

###準備
チュートリアルから手順を拝借して
```npx create-react-app my-app```
を任意のディレクトリで実行
*```my-appp```は好きな名前でええんやで。ディレクトリ名になるんやで。
src配下をお掃除しーの、いざ！！

ホームページ的なものを作る入口といえば
```index.html```
ですよね。
(サーバーの作り方とか詳しいチューニングについては
まだおさ兄はｲｲﾃﾞｽ、ｵﾅｶｲｯﾊﾟｲ。。。)



チュートリアルでは作成せんかったけど、作ったろ！__←ｺﾚｶﾞﾏﾁｶﾞｴﾉﾊｼﾞﾏﾘ__
おさ兄は```src```配下に```index.js```とかと同じテンションで作って
html内に```<div id="Koko" />```みたいにして
チュートリアルで修めた感じで```indes.js```に以下のコードを書いたのよ。

```
ReactDOM.render(
  <Koko />,
  document.getElementById('Koko')
);
```
そしたら、案の定エラーだったわけです。orz
結論いうと、__ｺﾚｶﾞﾏﾁｶﾞｴﾉﾊｼﾞﾏﾘ__で示したように
src配下のindex.htmlなんかReactさんは__見ちゃいなかった__のよ。
index.htmlは自分で作らなくても```publi```配下に
ちゃっかり最初のコマンドで作られてくれていたのよね。
だからそこのコードを直さねば、私のjstx？っていうの？は
反映されることなんてなかったということ。
_以下、ディレクトリ構成抜粋_

```
PUBLIC
    favicon.ico
    index.html　←←←←←←←←←←←←←←←←←←←←←←←←←←←←←←←←
    logo192.png
    logo512.png
    manifest.json
    robots.txt
SRC
│  index.css
│  index.js
│
└─component　←おさ兄が自分で作った
        explore.js 
        top.js
```

``public``配下の``index.html``を修正することで
自分が定義したソースが反映されました！ｲｴｲ

そこからは階層的にComponentって言えばええんか？を
呼び出せる感じにもってきたとこです。
もうちょい勉強したらGitHub Pagesとやらで公開できるらしいので
楽しみです。
ただ、あくまで最終目的はWebシステム Appの作成なので
Formとかデータの受け渡しとかRDBとかとのつなげ方とか
勉強していくつもりですたい。
Javaでいうセッションとかどーなるの、とか。
課題はいくつかあるだろうから初心者に優しい記事があればご紹介いただければ
うれしく存じます。おなしゃｓｓっす。

##今後の課題まとめ
・いい感じのComponent？つまるところ部品の使いまわし、分割とかの模索
2021/09/30 ~更新#2で解決 ~~・RDBとの接続方法調査~~
2021/09/30 更新#3で解決 ~~・REST通信のやり方（javascript久しぶりなので復習的な感じなのかReactならではなのか）~~
・Cookieとかセッションとか管理どなってるの調査
・データの受け渡し、持続方法の調査
※SPA（シングルページアプリ）ならそも持続なんぞないんか？
ひらきっぱでなんか上手いことやってるからええんか？ページ遷移とかReactでは考慮せんのか？
・コードテスト（UT）の仕方の調査
※普通どこテストすんの？ビジネスロジック書くようなったらjstx？js?部分が対象になるんか？
・固定文章の保持場所はどうするのがbetter？メッセージプロパティとか用意すんの？
・環境差分のデプロイ設定ってどぅすんの？
2021/09/30 追加・render内にREST通信のメソッドいれたら無限にリクエストするのなんで？

##参考URL
https://ja.reactjs.org/tutorial/tutorial.html
階層的にComponentどやって呼び出すねん！って思って人様のGithub覗きました。
参考になったので紹介しておきますね。
https://github.com/kenmori/React-Sample


以上、こんな適当にかいたような記事をみてくださり、まことにありがとうございます。
一人でも、同じ感じの人がいらっしゃいましたら気軽に話し合えれば
楽しくモチベ継続になるので宜しくお願い致します。
scala spark勉強備忘録⑤ とりあえず機械学習

詳細は後ほど編集しなおします
とりあえずコードをこちらにうつす

```
import org.apache.spark.sql.SparkSession
import org.apache.spark.sql.functions._
import org.apache.spark.sql.types._
import org.apache.spark.ml.feature.VectorAssembler
import org.apache.spark.ml.regression.LinearRegression
import org.apache.spark.ml.Pipeline
import org.apache.spark.ml.feature.{OneHotEncoder, StringIndexer}
import org.apache.spark.ml.feature.RFormula
import org.apache.spark.ml.evaluation.RegressionEvaluator

val filePath = "/home/ubuntu/LearningSparkV2/databricks-datasets/learning-spark-v2/sf-airbnb/sf-airbnb-clean.parquet/"
val airbnbDF = spark.read.parquet(filePath)
val Array(trainDF, testDF) = airbnbDF.randomSplit(Array(.8, .2), seed=42)

val vecAssembler = new VectorAssembler().setInputCols(Array("bedrooms", "bathrooms")).setOutputCol("features")
val lr = new LinearRegression().setFeaturesCol("features").setLabelCol("price")

val pipeline = new Pipeline().setStages(Array(vecAssembler, lr))
val pipelineModel = pipeline.fit(trainDF)
val predDF = pipelineModel.transform(testDF)


val categoricalCols = trainDF.dtypes.filter(_._2 == "StringType").map(_._1)
val indexOutputCols = categoricalCols.map(_ + "index")
val oheOutputCols = categoricalCols.map(_ + "OHE")

val stringIndexer = new StringIndexer().setInputCols(categoricalCols).setOutputCols(indexOutputCols).setHandleInvalid("skip")
val oheEncoder = new OneHotEncoder().setInputCols(categoricalCols).setOutputCols(oheOutputCols)
val numericCols = trainDF.dtypes.filter{ case (field, dataType) => dataType == "DoubleType" && field != "price"}.map(_._1)
val assemblerInputs = categoricalCols ++ numericCols
val vecAssembler = new VectorAssembler().setInputCols(assemblerInputs).setOutputCol("features")

val lr = new LinearRegression().setLabelCol("price").setFeaturesCol("features
")
val pipeline = new Pipeline().setStages(Array(stringIndexer, oheEncoder, vecAssembler, lr)
val pipelineModel = pipeline.fit(trainDF)
ここでなぜかエラー
ERROR Instrumentation: java.lang.IllegalArgumentException: requirement failed: Column host_is_superhost must be of type numeric but was actually of type string.
以下でも同じらしい(強制的にoheになるからそれでいい時だけっぽい、ただoheするなら以下が処理早いそう)

val rFormula = new RFormula().setFormula("price ~ .").setFeaturesCol("features").setLabelCol("price").setHandleInvalid("skip")
val pipeline = new Pipeline().setStages(Array(rFormula, lr))
val pipelineModel = pipeline.fit(trainDF)
val predDF = pipelineModel.transform(testDF)

val regressionEvaluator = new RegressionEvaluator().setPredictionCol("prediction").setLabelCol("price").setMetricName("rmse")
val rmse = regressionEvaluator.evaluate(predDF)
```
【Salesforce】sfdxコマンドを使ったリリース手順

sfdxコマンドを使ったリリース手順を整理しました。

## リリース用メタデータの作成
- sfdxプロジェクトでsfdxコマンドを実行してリリース用メタデータを作成する

``` ​sfdxコマンド.
sfdx force:source:convert -d ./リリース用メタデータ出力先のパス -x ./リリース用package.xmlのパス
```
​

- リリース用メタデータ出力先のパスにリリース用メタデータが作成されたことを確認する
​

## メタデータのリリース検証
前項のリリース用メタデータをsfdxコマンドでリリース検証する。
※事前にデプロイ先Salesforce組織の認証を実施しておくこと。

``` sfdxコマンド（ローカルテスト全実行の場合）.
sfdx force:mdapi:deploy -d ./リリース用メタデータ出力先のパス -u リリース先環境のエイリアス --checkonly --testlevel RunLocalTests
```
​

``` sfdxコマンド（テストクラス指定実行の場合）.
sfdx force:mdapi:deploy -d ./リリース用メタデータ出力先のパス -u リリース先環境のエイリアス --checkonly --testlevel RunSpecifiedTests -r Test01,Test02
```

## メタデータのリリース検証状況の確認
Salesforceのリリース状況画面でメタデータのリリース検証状況を確認する

## 参考
■Salesforce CLI Command Reference
https://developer.salesforce.com/docs/atlas.en-us.sfdx_cli_reference.meta/sfdx_cli_reference/cli_reference_force_source.htm
【Salesforce】コンテンツ配信のPDFプレビューを高速化する方法

Salesforceにコンテンツ配信という機能がありますが、その公開リンクを表示するとSalesforce標準のファイルプレビュー画面が表示されます。
ただ、このSalesforce標準のファイルプレビュー機能は少し表示に時間がかかります。
今回はコンテンツ配信のPDFプレビューを高速化する方法を試してみました。

↓Salesforce標準のファイルプレビュー画面
![pdf01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/611228/9c8168b8-1620-2d03-3ffb-52611dcb2114.png)

## PDFプレビューを高速化する方法
コンテンツ配信リンクから元のPDFファイルを取得してiframeで表示してみました。
元のPDFファイルを取得するURLは以下です。

```コンテンツ配信から元のPDFファイルを取得するURL.
https://ドメイン/sfc/dist/version/renditionDownload?rendition=ORIGINAL_pdf&versionId=XXXX&d=XXXX&oid=XXXX
```

|パラメータ|値|
|:-:|:-:|
|rendition|ORIGINAL_pdf|
|versionId|コンテンツバージョンのID|
|d|コンテンツ配信の「ContentDownloadUrl」項目のパラメータ「d」から取得|
|oid|コンテンツ配信の「ContentDownloadUrl」項目のパラメータ「oid」から取得|

このURLをiframeで表示してみるとUIの変更はありますが、PDFプレビューの表示が確かに高速化されました。

![pdf02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/611228/593d3894-e211-a83c-e693-722435180c72.png)

## 参考
■ ContentDistribution
https://developer.salesforce.com/docs/atlas.ja-jp.api.meta/api/sforce_api_objects_contentdistribution.htm
データベースのトランザクション処理について整理する（その2）

# はじめに

[こちら](https://qiita.com/ykami/items/df59544313ad256d850b)の続きです。

# 同時実行制御

並行して実行されているトランザクションを処理するための技術。大まかに以下に分類できる。

1. 楽観的同時実行制御
    - Optimistic Concurrency Control / OCC
    - 複数のトランザクションは互いにブロックすることなく、お互いの処理がコミットされる際に競合の有無をチェックする。
    - 競合があった場合には、一方の処理が中断させられる。
1. マルチバージョン同時実行制御
    - Multiversion Concurrency Control / MVCC
    - レコードにタイムスタンプが異なる複数バージョンの存在を許容し、過去のあるタイミングにおける一貫性の取れた参照を提供する。
1. 悲観的または保守的同時実行制御
    - Pessimistic Concurrency Control / PCC
    - 以下2つに分類
        - ロックベース
            - トランザクションはレコードに対するロックを管理する必要がある。
        - ロックなし
            - 読み取り操作と書き込み操作のリストを管理し、終了していないトランザクションのスケジュールに応じて操作を制限する。

## 直列化可能性

一連のトランザクションを実行するために必要な操作のリストをスケジュールという。
あるスケジュールで、その中の各トランザクションが完全に独立して連続的に実行される場合、シリアルであるという。（すべての先行するトランザクションが実行された後で次のトランザクションが開始するような実行）
この場合、システムのスループットが著しく低下し、パフォーマンスを損なう。

パフォーマンスを損なうという問題から、シリアルなスケジュールの正確性と単純性を維持しつつ、トランザクションを並列に実行する必要性が生まれる。

## トランザクションの分離

いつどのようにしてトランザクションの各部分（途中経過など）を可視化するか、を指定するものとして分離レベルが定義される。
トランザクション分離レベルの定義に応じた読み取り・書き込みのアノマリー（異常）として、以下が想定される。

### 読み取り書き込みのアノマリー

* ダーティリード
    * あるトランザクションでコミットされていないの変更を、別のトランザクションが参照できる
* ノンリピータブルリード
    * あるトランザクションが同じ行への問い合わせを2回行い、それぞれで異なる結果を得る
        * あるトランザクションが行を読み取り、そのトランザクション内でもう一度読み取るとする。
        * 1回目の読み取りと2回めの読み取りの間に、別のトランザクションがその行を修正してコミットしていた場合、読み取りの結果が異なる。
    * ファジーリードと呼ばれる場合もある
* ファントムリード
    * トランザクション中に範囲読み取りを使用した場合に発生
    * トランザクションが同じ行のセットを2度要求し、異なる結果を受け取る
* ロストアップデート
    * 2つのトランザクションが同一の値を読み取ったとする。
    * 先のトランザクションが値を更新してコミットし、後のトランザクションも値を更新してコミットする。
    * このとき、先に更新した値は後の更新で上書きされる。
* ダーティライト
    * ダーティリードした値を更新してコミットする。
* ライトスキュー
    * 個々のトランザクションは必要な要件を満たしているが、組み合わせで要件を満たさなくなる。
        * 2つのトランザクションが、2つの口座の値を変更する状況を考える。
        * それぞれの口座残高は$100と$150とする。
        * 要件は、これらの合計が負の値にならないことであるとする。
            * 個別の口座残高が負になることはOK
        * このとき、それぞれの口座から$200引くことを試みる
            * それぞれのトランザクション開始時点では$100 + $150 = $250であることから、どちらの口座も$200引くことができる。
        * それぞれのトランザクションをコミットした後にはそれぞれ-$100と-$50となり、要件を満たさなくなる。

## 分離レベル

* read uncommited(未コミット読み取り)
    * 最も弱い分離レベル
    * ダーティリードが許容される
* read commited(コミット済み読み取り)
    * ダーティリードは許容されない
    * ファントムリード、ノンリピータブルリードは許容される
* repeatable read(反復可能な読み取り)
    * ダーティリード、ノンリピータブルリードは許容されない
    * ファントムリードは許容される
* serializability(直列化可能性)
    * 複数のトランザクションがシリアルに実行されたかのように、結果が特定の順序で現れることが保証される。
    * ダーティリード、ノンリピータブルリード、ファントムリードが許容されない

※ **MySQLのInnoDBでは、repeatable read でのファントムリードが許容されなかったりするので、DBによって差異はあることに注意**

## 楽観的同時実行制御

トランザクションの競合がめったに発生しないことを前提としたもの。

## マルチバージョン同時実行制御

複数のレコードバージョンを許容する。単調に増加するトランザクションIDやタイムスタンプを使用してトランザクションの一貫性を保つ。

## 悲観的同時実行制御

実行中にトランザクションの競合を特定してそれらの実行をブロックまたは中断する。
最も単純な考え方の一つとして、タイムスタンプによる順序付けがある。（トランザクションがそれぞれタイムスタンプを持ち、より早いタイムスタンプを持つトランザクションがコミットしているかで、実行可否を決定する。）
Watson Discovery便利プログラム ~Export編~

# コレクション内の情報をエクスポートする
collectionの内容をエクスポートしてほかのコレクションに適用したりコレクションの情報を別で保存しておきたいときがあると思います。(私があったので記事を書いているのですが…)
ということで、コレクションの情報をエクスポートするプログラムをTypescriptで作りました。
エクスポートする情報は以下です。

- コンフィグ
- ドキュメント
- トレーニングデータ
- エクスパンション(同義語)

ソースは[git](https://github.com/Ryota-Amano/ibmcloud-discovery-export)にあります。
Qiitaの記事ではプログラムの仕様や概要を説明します。利用方法はgitをご覧ください。
**ご利用は自己責任でお願いいたします。**
改善点や不明点等ございましたら連絡いただけますと嬉しいです。

# 環境
- Windows10
- Node　v14.17.0
- npm　7.15.1


# 仕様

- 資格情報はプログラム実行前に`Authentication.yaml`に記載しておく
- ドキュメントのエクスポートは1万件まで

#フォルダ構成

```
ibmcloud-discovery-export/(root)
 ├─ dist/
 ├─ node_modules/
 ├─ src/
 │   ├─ api/
 │   │   └─ Discovery.ts
 |   ├─ interface/
 │   │   └─ index.ts
 │   ├─ ConfigurationDetails.ts
 │   ├─ ExpansionList.ts
 │   ├─ Loading.ts
 │   ├─ QueryCollection.ts
 │   ├─ TrainingList.ts
 │   └─ UserInput.ts
 ├─ .gitignore
 ├─ app.ts
 ├─ Authentication.yaml
 ├─ package-lock.json
 ├─ package.json
 ├─ RRADME.md
 └─ tsconfig.json
```

**`dist/`**　tsをコンパイルした後のjsファイルが格納されている。プログラム実行時はdist/app.jsを実行する。
**`Discovery.ts`**  DiscoveryへのAPIコール処理を行うtsファイル
**`ConfigurationDetails.ts`**コンフィグの取得を行うtsファイル
**`ExpansionList.ts`** エクスパンション(同義語)の取得を行うtsファイル
**`TrainingList.ts`** トレーニングの取得を行うtsファイル
**`QueryCollection.ts`** ドキュメントの取得を行うtsファイル
**`UserInput.ts`** プログラム実行後の入力を促す処理を行うtsファイル
**`app.ts`** メインのTypeScriptファイル
**`Authentication.yaml`** Discoveryの資格情報と出力名を入力しておくyamlファイル


#フローチャート
大まかな流れをフローチャートで書きました。
綺麗なものではないですがご勘弁ください。
![discoveryExport.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649992/52bf53a4-9a33-1aaf-8cb4-4f707d6da26a.jpeg)

# 終わりに
エクスポートをしてもインポートができなければあまり意味がありません。。。。
大丈夫です！！インポートプログラムも近々で作成予定です。

**2021年10月13日追記**
Discoveryにて既存プランの廃止と新プランの発表がされました。
それに伴い上記のエクスポートで使用しているAPI(v1)は新プランでは
使用されなくなりました。(新プランではAPIはv2)
その為インポートプログラムの開発と中止しています。申し訳ございません。
Eclipse+MavenでJavaFXの環境構築を行う

Eclipse+MavenでJavaFXを使い、Eclipseからの実行と、実行可能jarの作成ができるまでの手順を記載する。
この手順で環境構築を行った例は以下。
https://github.com/tsyki/javafx-example

# JavaFX用のEclipseプラグイン「e(fx)clipse」を入れる(任意)
マーケットプレイスからインストールする。
入れなくてもJavaFXのアプリの実行はできるが、入れておくとFXMLの編集がやりやすくなる。
例えば、FXMLで指定したIDに対応するプロパティがコントローラで定義されていない、といった場合に警告を出してくれる。
2021/9版のpleiadesにe(fx)clipse3.7を入れて動作することを確認済み
# 新規Mavenプロジェクトを作成
「シンプルなプロジェクトの作成」をONにして作成する
# pom.xmlに以下を追加
```xml
		<dependency>
			<groupId>org.openjfx</groupId>
			<artifactId>javafx-controls</artifactId>
			<version>17</version>
		</dependency>
		<dependency>
			<groupId>org.openjfx</groupId>
			<artifactId>javafx-fxml</artifactId>
			<version>17</version>
		</dependency>
```
# 新規JavaFXプロジェクトを作成。作成されたファイルを上記Mavenプロジェクトにコピー
FXMLを使う想定なので、ウィザードの宣言的UIはFXMLにしておく。
これにより、`Main.java`、`SampleControler.java`、`application.css`、`Sample.fxml`の4ファイルが作成される。
JavaFXプロジェクトだと、上記fxml、cssファイルもjavaファイルと同ディレクトリに配置されるが、Mavenプロジェクトの場合、そうすると実行可能jarを作成する際にfxml、cssファイルがjarに含まれない。
このため、Mavenプロジェクトにコピーする際は、fxml、cssファイルはresources以下に配置する。
(開発時はFXMLと対応するコントローラは同ディレクトリにあった方がやりやすいのだが…)
# mainを実行するクラスを新規に追加する
上記手順で作成されたMainクラスがmainを実装しているが、これを直接Eclipseから実行しようとすると、`エラー: JavaFXランタイム・コンポーネントが不足しており、このアプリケーションの実行に必要です`のエラーが発生して実行できない。
これを避けるために、Mainクラスのmainを呼ぶだけのクラスを作成し、そこから実行するようにする。
参考：https://torutk.hatenablog.jp/entry/2018/12/01/215113
# maven-assemblyプラグインを入れる
以下をpom.xmlに追加する。これにより`mvn package`で実行可能jarが作成可能となる。

```xml
	<build>
		<plugins>
			<!-- 実行可能jarファイル用のプラグイン -->
			<plugin>
				<groupId>org.apache.maven.plugins</groupId>
				<artifactId>maven-assembly-plugin</artifactId>
				<version>3.3.0</version>
				<configuration>
					<!-- TODO jarファイルの名前になるので適宜修正 -->
					<finalName>javafx-example</finalName>
					<descriptorRefs>
						<!-- 依存するリソースをすべてjarに同梱する -->
						<descriptorRef>jar-with-dependencies</descriptorRef>
					</descriptorRefs>
					<archive>
						<manifest>
							<!-- TODO mainを実行するクラスを指定 -->
							<mainClass>jp.gr.java_conf.tsyki.javafx.EntryPoint</mainClass>
						</manifest>
					</archive>
				</configuration>
				<executions>
					<execution>
						<!-- idタグは任意の文字列であれば何でもよい -->
						<id>make-assembly</id>
						<phase>package</phase>
						<goals>
							<goal>single</goal>
						</goals>
					</execution>
				</executions>
			</plugin>
		</plugins>
	</build>
```
【Rails】homesコントローラーでビューのみ使用する場合（コントローラー記述なし/アクションのみ用意）

#はじめに
コントローラーの処理は不要で、ビューのみ表示したい場合（主にトップページ）の簡潔な記述を残します。

#やったこと

```ruby:app/controllers/homes_controller.rb
def top
end
```

いつもならこう書いていましたが、

```ruby:app/controllers/homes_controller.rb
def top: end
```

わずかにですが、一行で書けるようになります。
クリーンアーキテクチャを恋愛で例えてみた

[前回](https://qiita.com/yamachita0109/items/37e0913bfef56b1ed9c2)、クリーンアーキテクチャの構成で簡単なLambdaを構築してみましたが、デザインパターンなどのアーキテクチャの前知識がないと理解が難しい様子。

なので、今回は全人類共通言語である**恋愛**でクリーンアーキテクチャを例えたいと思います。

## そもそもクリーンアーキテクチャとは

![クリーンアーキテクチャ.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300430/3873aa08-2275-bf15-c0dd-b41ebc67a8fb.jpeg)

はい。こんな図形が有名ですが、全く意味がわからないですよね。
各レイヤーの説明と、内側へのみの単一方向依存性を表しているそうなのですが、これらの要素を**恋愛**で例えます。

## クリーンアーキテクチャ〜恋愛Ver〜

### 図解

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300430/625e3073-ca21-9b94-caa3-3aae70f1fba6.png" width="80%">

クリーンアーキテクチャ〜恋愛Ver〜を例の円形の図形に合わせて書き直してみました。
各レイヤーについて説明します。

### 各レイヤー

#### 外的要因

天気など、直接恋愛に関係ないものになります。

#### 自分自身の思考・選択

恋愛において、自分自身の**戦術の選択**及び、**行動**が**とても大事**です。
相手に合わせたデートスポットの選択は勿論、時間帯、テンションなどなど。
ここでは戦術・行動の思考・選択を行います。

#### 具体的な行動

ここは具体的な行動です。

 - ディズニーランドへ行く
 - 八景島シーパラダイスへ行く
 - ディナークルージングへ行く
 - 伊香保温泉旅行へ行く

などなど

#### 彼女

**一番大事。**

### ポイント

ポイントとしては、

 - 内側のレイヤーが恋愛において**より重要な要素**になる
 - 外側のレイヤーが内側のレイヤーへ影響を及ぼすが、**逆はない**

この2点です。
まず、「**内側のレイヤーが恋愛において重要な要素**になる」についてですが、そりゃ恋愛において**相手の存在**が一番大事ですよね？

続いて、「外側のレイヤーが内側のレイヤーへ影響を及ぼすが、**逆はない**」についてですが、
例えば、**具体的な行動**によって**彼女**へ好感度が上がったり下がったりと*影響を及ぼす*ことはありますが、**彼女**によって**具体的な行動**へは影響がないのです。

## 具体例

山田くんの恋愛ケースをサンプルとしてみてみましょう。

> 山田くん28歳。
西野ちゃんに恋心を抱いている。
ある晴れた日、ついに西野ちゃんと遊園地デートへ行くことに。

### 図解

山田くんのサンプルケースをクリーンアーキテクチャで表現すると

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300430/8c3d174f-b2e4-7762-9f80-be58520c8aac.png" width="80%">


図の通り、

1. **晴れ**たので
1. **山田くんの思考・選択**で
1. **遊園地でデート**して
1. **西野ちゃん**の好感度UP

といった流れになります。

### メリット

恋愛の要素をそれぞ**分離**し、影響関係を外から内への一方通行にすることで、各要素が**疎結合**となります。
疎結合となることで、恋愛の**メンテナンス**や**カスタマイズ**などが容易に行えるようになります。
例えば、**遊園地でデート**を**水族館でデート**に変更した場合、

1. **晴れ**たので
1. **山田くんの思考・選択**で
1. ~~遊園地~~ **水族館でデート**して
1. **西野ちゃん**の好感度UP

といった風に、3.のデート場所だけを変更すれば、その他の要素は**そのまま流用できる**ということです。

### これでいいのか・・・？

ただ、今のままでは重大な欠陥が・・・
今の構成では、**彼女**レイヤーのリアクションを受けて**自分自身の思考・選択**を行えません。
サンプルで例えると、**西野ちゃん**のリアクションお構いなしに、**山田くんが思考・行動をしている**ということになります。

そんな自己満クソ野郎では恋愛は成立しません。

クリーンアーキテクチャは欠陥なのか・・・？

いいえ、ちゃんと西野ちゃんのリアクションを考慮して山田くんが思考・行動することはできます。

## 依存関係逆転の原則(DIP)

クリーンアーキテクチャの図形右下に謎の線と箱がありましたよね。

![https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_530799_2918a4cb-10a9-6dbe-d6f7-8ea8c1e5bc4f.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300430/f43a3af7-e903-57d7-d82c-e5bc21d08664.png)

訳分からない図形ですが、これは恋愛で言うと、**誰だか知らないけど、デート楽しかった。ｷｭﾝ**という感じです。
山田くんのケースで例えましょう。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300430/8a9f2d3c-84a6-39ea-9721-426fe97c0765.png" width="60%">

山田くんのケースで言うと、
遊園地デートが終わって、**西野ちゃんがデートの感想をSNSでつぶやき**、山田くんが**西野ちゃんのSNSのつぶやきをこっそり見て**次のデートプランを考える。
といったことが可能なのです。

ここのポイントは
西野ちゃんは外側のレイヤーにいる**山田くんを考慮した動きをしていない**のにも関わらず、山田くんは**西野ちゃんのデートの感想を取得できた**。
と言うことです。

これで、山田くんは**自己満クソ野郎**ではなく、（こっそりと）相手のフィードバックを得て次のアクションを考えることができる普通の青年になることができたのでした。

## まとめ

今回の目的は、システムの設計についてあまり詳しくない人でもクリーンアーキテクチャについてふんわりと理解してもらうことでした。
達成できたのかどうかわかりませんが、かなりの怪文書になってしまいました。

この文章を読んで少しでもシステム設計に興味を持って頂けたら嬉しいです。
figma + SwiftUIでポモドーロタイマー作ってみた part2

## 前回記事
前回はタイマー処理の実装と、UIを大雑把に作成しました。
今回は時間が0になった時に音で知らせる機能の追加と、より使いやすいタイマーにするためにボタンの配置修正をします。

https://qiita.com/ysit/items/c5b54cf7b1793f3dfaf4

## 音を出す機能の追加 + 配置修正
音を出すこと考えて思いつくのは、システム音声を使うか、オリジナルのmp3などを読み込ませるかでした。
今回もなるべく楽をするために、システム音声を使うことにします。


以下のコードが音を出すために作った関数です。実装だけ見ると数行ですが、音に関連する知識はかなり広がってしますので、情報を探すのが難しいです。

```swift
import AudioToolbox //忘れずに追加
 ~~略~~
func playSound(){
    let soundIdRing:SystemSoundID = 1016
    AudioServicesPlaySystemSound(soundIdRing)
    }
}
```

まず、FrameworkのAudioToolboxについてです。オーディオの録音や再生、フォーマット変換、オーディオセッションの設定など音関連の諸々に携わっています。

今回使いたいのは再生だけなので、情報を絞っていきます。

ぴったりなのが、関数のAudioServicesPlaySystemSound(_:)です。関数の役割はシステム音の再生です。

```swift
//定義
func AudioServicesPlaySystemSound(_ inSystemSoundID: SystemSoundID)
```

https://developer.apple.com/documentation/audiotoolbox#overview

SystemSoundIDを設定するとIDに対応した音が鳴ります。
IDは公式のドキュメントを探しても見つからなかったので、GitHubの記事を参照しました。

https://github.com/TUNER88/iOSSystemSoundsLibrary

システム音の再生だけですと、これだけで実装できます。

## 配置修正

最近mocriというポモドーロしながらトークができるアプリを使っているのですが、このアプリのタイマーのUIの方が今作っているUIより100%優れていたので、参考にさせてもらいました。

再生、停止、一時停止、切り替えと４つのボタンがあるのですが、全てを常時表示する必要はないんですよね。。。

再生中は再生と切り替えが不要で、停止中は停止と一時停止が不要です。
表示するボタンを切り替える様に実装し直しました。

![画面収録 2021-09-29 22.40.48.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1707407/64217262-7cd6-2b44-c470-3c816b40bae5.gif)

今回は音関連の機能を実装しました。
次回は通知機能を実装予定です。
PCIDSS関連の記事


https://dev.classmethod.jp/articles/fin-jaws-13-report/


https://dev.classmethod.jp/articles/pci-dss-compliance-on-aws/


https://dev.classmethod.jp/articles/pcidss_aws_azure/


https://dev.classmethod.jp/articles/pci-dss-auth-by-iam/


https://dev.classmethod.jp/articles/security-hub-launches-security-checks-aligned-to-the-pcidss/


https://dev.classmethod.jp/articles/security-engineering-on-aws-links/



https://dev.classmethod.jp/articles/aws-security-operation-with-guardduty-2021/




https://dev.classmethod.jp/articles/aws-security-operation-with-securityhub-2021/
【Rails】form_with下で画像選択フォームとlabel要素を関連付ける方法

form_with下で、画像選択フォームとlabel要素を関連付ける方法を学習したので、
アウトプットしていきます。

#①前置き
通常、画像選択フォームを`<input type="file">`のような形で実装すると、
「ファイルを選択ー選択されていません」という味気のないデフォルトボタンが表示されます。
これを「画像を選択してね！」のような自分が好きな文言に変えたい時に役立つのが
**label要素**です。

**＜label要素とは？＞**
フォームの中で、フォームの項目名とフォームの入力要素（画像選択フォーム、プルダウン、チェックボックスなど）を関連付けるための要素です。

label要素の役割の1つは、label要素がクリックされたときに、子要素もクリックされたことにしてくれることです。この仕組みを使うと、見えないはずのファイル選択ボタンをクリックしたかのように動作させることができます。

#②【通常】画像選択フォームとlabel要素の関連付け

```app/views/messages/message.html.erb
<label class="form-image">
  <span class="image-file">画像を選んでね</span>
  <input type="file" class="hidden">
</label>
```

```app/assets/stylesheets/messages.css
.hidden {
  display: none;
}
```

こうすることで画像選択フォームは`display: none;`、つまり非表示となり
代わりに「画像を選んでね」というspan要素をクリックすると、画像選択画面へと移ることができます。

##③【form_with下】画像選択フォームとlabel要素の関連付け
それでは今回の本題となる、form_with下でのlabel要素との関連付けです。

```
<label class="form-image">
  <span class="image-file">画像を選んでね</span>
  <%= f.file_field :image, id:"item-image", class:"hidden" %>
</label>
```

例えば「ユーザー新規登録時に、プロフィール画像も合わせて選択させたい」という場合、
画像選択フォームのコードは、`<%= f.file_field :image, id:"item-image" %>`のようにブロック変数を元にした記述をする必要があります。
そのため②の書き方では選んだ画像とform_withが紐付かず、パラメーターに画像情報を含めることができなくなってしまいます。

したがって`<%= f.file_field :image, id:"item-image" %>`ごとlabel要素の中に入れ、`class:"hidden"`を追加し、`display: none;`を指定することで画像選択フォームとlabel要素を関連付けることができます。
<br>
以上で本記事の実装は完了です！お疲れ様でした。
ご指摘などあれば、ご教授頂けると幸いです。
【Rails】each文を一文で簡潔に書く方法

#はじめに
リーダブルコードやリファクタリングについて日々勉強をしています。
each文の簡潔な書き方に出会ったので、残しておきます。

#やったこと

いつもであれば、こう記述していました。

```ruby
temps = [1,2,3,4,5,6,7]
temps.each do |temp|
  p(puts) temp #実行する処理
end
```

これを書き換えると、

```ruby
temps.each {|temp| p(puts) temp } 
```

#終わりに

一文で書ける為、コードがスッキリします。
composer-bin-pluginを導入してDeveloperツールを管理する

# 概要
コードをフォーマット通りに整形するため、[PHP-CS-Fixer](https://github.com/FriendsOfPHP/PHP-CS-Fixer)を導入したいと思いました。
ドキュメントを確認したところ、専用のディレクトリを切ってそこにインストールするやり方が推奨されていた。どうしたものかと[ツイート](https://twitter.com/juve534/status/1443015965579440131?s=20)したところ、[composer-bin-plugin](https://github.com/bamarni/composer-bin-plugin)を教えてもらったので、そちらを使って管理する方向とし、やったことをメモしておきます。

# 本文
## [composer-bin-plugin](https://github.com/bamarni/composer-bin-plugin)とは
説明は下記のスライドに詳しく載っています。Developerツールをこのプラグインを使って管理することで、依存パッケージのver.によるコンフリクトを軽減してくれると理解しました。

https://speakerdeck.com/o0h/what-is-composer-bin-plugin

## [composer-bin-plugin](https://github.com/bamarni/composer-bin-plugin)の導入
GitHubのドキュメント通りにインストールできるので、特筆事項はありませんでした。

## [PHP-CS-Fixer](https://github.com/FriendsOfPHP/PHP-CS-Fixer)の導入
基本は[composer-bin-plugin](https://github.com/bamarni/composer-bin-plugin)のドキュメント通りなのですが、そのままインストールすると `/bin/php-cs-fixer` をプロジェクト直下に作ってしまうので、 `composer.json` に下記の設定を追加します。

```json:composer.json
"extra": {
    "bamarni-bin": {
        "bin-links": false
    }
},
```

これで `/bin/php-cs-fixer` も `vendor-bin` 配下にインストールできるので、インストールを行います。

```
composer bin 任意の名前 require friendsofphp/php-cs-fixer
```

これで導入は完了です。

# 最後に
`composer require --dev friendsofphp/php-cs-fixer` でプロジェクト直下にインストールしようとし、コンフリクトが発生したので、このツールの存在はありがたいなと思いました。

Developerツールは[composer-bin-plugin](https://github.com/bamarni/composer-bin-plugin)で管理すると良さそうですね。

# 参考資料
* 
https://speakerdeck.com/o0h/what-is-composer-bin-plugin
* [composer-bin-plugin](https://github.com/bamarni/composer-bin-plugin)
Thymeleaf 行単位でデータをpost送信する

##削除ボタンを押下してID情報を取得する例
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/637823/c9f743d2-3da1-faaf-d75b-cbdc3a728607.png)
		

##同じ\<td\>内にhiddenとsubmitタイプの\<input\>を設置する
```html
<td>
　<form method="post" th:action="@{/shopping_list}">
  　<input type="hidden" name="id" th:value="*{id}">
  　<input type="submit" value="削除">
　</form>
</td>  
```
https://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q14226271449

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/637823/9e423a3c-3820-247b-3d60-265254760a56.png)


###ビュー側
```html
<table border="5" frame="box" cellpadding="15">
  <tr>
    <th>ID</th>
    <th>商品</th>
    <th>備考</th>
    <th></th>
  </tr>

  <tr th:each="shoppingList:${List}" th:object="${shoppingList}">
    <td th:text="*{id}"></td>
    <td th:text="*{itemName}"></td>
    <td th:text="*{remark}"></td>
    <td>
      <form method="post" th:action="@{/shopping_list}">
        <input type="hidden"  name="id" th:value="*{id}">
        <input type="submit" value="削除">
      </form>
    </td>  
  </tr>
</table>

```
|ポイント|解説|備考|
|----|----|----|
|input type="hidden"|ブラウザ上は表示されないが、コントローラーに値を渡せる。<br>https://developer.mozilla.org/ja/docs/Web/HTML/Element/input||
|name="id" th:value="*{id}"|nameで指定した値とEntityクラスの変数名が紐づいているので、nameを省略したり、th:name="*{id}" 、name="aaa"等してしまうと意図した動作をしない。||
|input type="submit"|コントローラーにフォームの値を渡す||

###コントローラー側
```java
@RequestMapping("/shopping_list")
public String getShoppingList(Model model,ShoppingListForm shoppingListForm,Integer id){

  //リストの削除
  shoppingListService.deleteShoppingList(shoppingListForm);  		
  //買い物リストの生成
  List<ShoppingList> List = shoppingListService.findAll();
  model.addAttribute("List",List);       
  
  return "shopping_list";
}
```
|ポイント|解説|備考|
|----|----|----|
|Integer id|javaのEntityクラスで定義したフィールド変数と同じ型で定義にしないと、<br>型を解決出来ないためエラーになる。<br>ちなみにこの例ではjavaのformクラスにてidをInteger型で定義しているので、ここにintやlongで初期化するとエラーになる。||

##参考
###HTML Thymeleaf
https://qiita.com/YuichiTanaka007/items/f84c23f63e0843eba299

https://qiita.com/YuichiTanaka007/items/5167a9ede03a8fe2730b

###SpringBoot
https://qiita.com/YuichiTanaka007/items/b16ca3c6d1a1debfdfa7
備忘　VSCodeで`Black`に`.pyi`ファイルを`FormatOnSave`させない方法

ハマってしまってここにたどり着くまで全`pyi`ファイルに`# fmt: off`を書くという愚かしいことをしてしまった。
これで保存時に`...py`ファイルはフォーマットされて、`...pyi`ファイルはフォーマットされなくなる。

```json:settings.json
{
    "python.languageServer": "Pylance",
    "python.analysis.typeCheckingMode": "basic",
    "python.linting.enabled": true,
    "python.linting.pylintEnabled": false,
    "python.linting.flake8Enabled": true,
    "python.linting.mypyEnabled": false,
    "[python]": {
        "editor.formatOnType": true,
        "editor.formatOnSave": true
    },
    "python.formatting.provider": "black"
}
```

```toml:pyprpject.toml
[tool.black]
line-length = 100
force-exclude = '\.pyi$'
```

`Python`: `3.9.4`
`black`: `20.8b1`
ヤフーの2021サマーインターンシップに参加してきました

## はじめに
ヤフーのサマーインターンに参加してきたので、振り返りも兼ねて体験記を書いていこうと思います。私が参加したのは、ヤフー画像検索のフロントエンド開発コースです。今年はオンラインで実施され、全部で10日間の日程でした。

## 選考の流れ
### エントリーシート
希望コースと希望理由、大学での研究、開発経験などの項目がありました。希望コースは第三希望まで選べたのですが、ヤフーのサマーインターンは、フロントエンド、バックエンド、ネイティブアプリなどの分野の中で、コースが細分化されています。今年用意されていたコースは全部で90種類ありました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1620372/218ff114-34ac-eda7-8aad-b81da41d787a.png)
これだけコースがあると選ぶのはかなり大変なのですが、逆に自分の興味関心に基づいて細かくコース選びができるというのは良いところでもあるかと思います。

### コーディングテスト
競プロ系の問題が数問出題されました。ここはやはり、競プロの経験があると有利ですね。

### 面接
希望コースを担当するエンジニアの方々との面接が1回ありました。インターンの志望理由、これまでの開発経験などの質問から始まり、そこから深堀りしていくような感じでした。また、コースが細分化されているということもあり、そのコースで扱うサービスに関する質問もありました。一般の人にも公開されているサービスであれば、事前にサービスの特徴を分析しておくと良いと思います。

## インターンの内容
### 1日目
初日のランチ会、画像検索サービスの概要説明、開発環境構築などがありました。ランチ会では、ヤフー社員食堂のBASEから届いたランチセットを食べながら、エンジニアの方々と雑談しました。

### 2日目
ヤフー画像検索とその競合サービスの調査を行いました。どのサービスにも共通する機能がある一方で、各サービス独自の機能も発見することができ、競合調査は結構おもしろかったです。その後、インターンで実施する企画案の作成、エンジニアの方々からのレビュー、企画案の修正を行いました。

### 3日目〜9日目
ひたすら企画案の実装をしていました。会議などが入っていない限り、エンジニアの方々は常に開発用の部屋に接続していたので、詰まったときはすぐに相談できるようになっていました。

### 10日目
成果物の発表を行い、エンジニア、デザイナー、企画担当の方々にレビューしていただきました。その後、メンターの方とインターン全体の振り返りを行いました。インターン終了後には、懇親会がありました。他のインターン生と話をする初めての機会だったので、最初はお互いインターンでやったことについて話していました。趣味や大学などの話になってもよかったのですが、なかなか話題が切り替わらず技術的な話ばかりしていました。学生のエンジニア同士で話す機会もあまりないので、それはそれで良かった気がします。


### 1on1
毎日、退勤前に30分ほどかけてメンターの方と1日の振り返りを行う時間がありました。その日やったこと、気づいたこと、困っていることなどを事前にまとめておき、その内容を詳しく説明したり、アドバイスをもらったりしました。1on1の直前にメモを書こうとすると、書くことを思い出すのに時間がかかってしまうので、書けることがあったらこまめにメモしておいた方が効率が良かったです。また、メモの内容が充実していると1on1の質も高くなる思うので、メモはできるだけたくさん書いておくようにしました。

### フィードバック面談
これは現時点(9/19)ではまだ行われていないのですが、インターン期間中の取り組みについてフィードバックを受けることができます。私の場合、10月の初め頃に面談が予定されています。

## さいごに
10日間で企画案の作成から実装まで行うのは、実際のところかなり大変でした。企画案の実装の大部分は終えられたのですが、細かなバグの修正や実装のテストまでは行うことができませんでした。しかし、10日間という期間は、私にとっては短すぎず長すぎないちょうどよい期間だったので、集中して取り組むことができ、非常に充実したインターンになりました。インターン期間中に支えてくださったメンターの方、エンジニアの方々、人事の方々、その他お世話になった皆様に大変感謝しております。ありがとうございました。
Javaのまとめ

#はじめに
今日からJavaの学習も始めたので少しずつJavaとはどういったところが得意なのかこちらの記事でまとめてノウハウを蓄積していきたいと思います。プログラミング学習始めた時はJavaとJavascriptってややこしいなと思っていました、懐かしいですね

#Java得意なこと
Webアプリケーション、Androidアプリの開発。

#Java特徴
* コンパイラ言語
* オブジェクト指向言語

__コンパイラ言語__
コンパイラ言語とは、機械語に一括し変換してから実行するプログラミング言語。
処理が高速

__オブジェクト指向言語__
Java はオブジェクト指向。オブジェクト指向では何か特定の役割を果たすモノ(＝オブジェクト)を作成し、そのオブジェクトに対して実行する処理を指示する。

余談として同じオブジェクト指向言語には「C++」「C#」「Kotlin」などがある。

__OSを選ばない__
Javaは、Windows,MacOS,Linuxなど、どのプラットフォームでも動く。
なぜなら、JVM上で動くから。

JVM = Java Virtual Machine(Java仮想マシーン)

Javaプログラムは、このJVMがパソコンに読み取れる機械語へ変換してから実行され、どのプラットフォームでも動く。

#JVM言語
JVM上で動作する言語のこと。JVMとしてJava,Scala,Kotlinがある。

__特徴__
JVM言語は、それぞれに相互運用性があることも特徴。
相互運用性があることで、Kotlinから、Javaで作られたコードを呼び出すことも可能。

#参考
[Java超入門コース](https://www.youtube.com/watch?v=kjxetd5ylzI&ab_channel=%E3%82%AD%E3%83%8E%E3%82%B3%E3%83%BC%E3%83%89%2F%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E5%AD%A6%E7%BF%92%E3%83%81%E3%83%A3%E3%83%B3%E3%83%8D%E3%83%AB)
私の計画立案の段取り ～段階的詳細化とPFD～


# はじめに
自分なりにプロジェクトをうまく動かせていたときの立案の段取りをまとめておく。

# 段階的詳細化
## 方針
計画を段階的に、詳細化し、ゴール達成の確率を上げる。
3年後のゴールの達成確率は5%もない状態でよいが、2週間後のゴールの達成確率は95%まで上げる。

## 段取り
1. 業務の目的、目標を決める。
3年後の目指す姿を描く。

2. 人材と予算を獲得するために、3年後までの計画を立てる。
年毎の業務量がわかる粒度でよい。
できれば、必要な人材が大まかにわかるように、年毎のプロジェクトの体制図も描く。
毎年、関係会社や自社の体制と予算が決まる前に、計画を見直し、関係者と共有する。

3. 業務量に対して人材が足りているかを確認し、業務量と品質または人材を調整するために、1年後までの計画を立てる。 
月毎の業務量と人材の対応関係がわかる粒度でよい。
月毎に誰がどの案件にどの程度携わるかがわかるように、計画を表現する。
毎月、計画を見直し、関係者と共有する。

4. 納期を調整・合意するために、計画を立てる。
PFDを作り、最適な段取りを関係者と議論する。
工程毎に成果量と過去生産性を参考に見積りをする。
できる限り、作業を遅れずに、実行できる可能性が高い担当者を、割り当てる。
生産性は担当者毎に異なるため、過去に担当者が経験したことのない作業は、試行し、試行結果をもとに見積りを見直す。
成果量や生産性の見込みが変わったら、計画を見直す。
計画を見直すために、見積りと実績の差を毎週確認する。
計画は実行する担当者が合意している状態とする。

5. 各担当者（マネージャ含む）が、実行可能な計画にする＆段取りに対して助言を得る＆遅れがタイムリーに把握できるために、スケジュール表に予定を2週間分埋める。
できる限り、1時間程度の粒度の作業にして、予定を埋める。
各作業の開始時刻と終了時刻を決める。
予定は、毎朝見直す。

## 補足
業務の特徴によっては、4.は実施しない場合もある。代りに、以下の計画の立て方をすることがある。これを、4' としておく。  

4' 作業の優先度の認識ずれを防ぐために、計画を立てる。毎週、その週に終わらせる予定の作業を優先度順に並べる。

## 参考文献
[1]山路厚，「自らの改善につながる「一人ひとりの日々の“仕事ぶり”を捉える」仕組みについて ―トレーニング指向アプローチによるプロセス改善―」，SPI Japan 2010，2010
[2]promapedia，「ローリング・ウェーブ計画法とは何か？反復計画法の１つを解説」


# PFD
私の経験則では、WBS（ツリー表現）をする前に、PFD（Process Flow Diagram）を書き、関係者で共有することも効果的でした。

PFDは、清水吉男さんが発案された手法です。

以下は清水吉男さんの「PFD(Process Flow Diagram)の書き方」という資料です。
https://affordd.jp/koha_hp/process/PFDform3.pdf
この資料の中に以下の言葉があります。

> PFDは、このようなときに「別案」に気づかせてくれるツールなのです。
> ・必要のないプロセスや成果物はないか？
> ・余計な成果物を作り出そとしていないか？
> ・別の方法で同じ効果の成果物を生み出すことはできないか？
> ・プロセス内の作業の順番を変えることで遅れを隠すことはできないか？


清水さんは「プロセスを設計する」という言い方をしていらっしゃいました。
ゴールに向かって無駄なく進むために、以下が大切になると考えています。

* リスクをもとにプロセスを設計する（定義するではない）
* プロセスは自分で設計する（定義するではない）

また、ゴールは一人で向かうものじゃないから、プロセスは一人で実行するものじゃないから、プロセスの設計はペアワーク・モブワークでやるとよいというのが経験則です。
つまり、PFDやWBSを作りながら、最適な開発の進め方を関係者で議論することが大切だと思います。

## 参考文献
### 清水吉男，「これまでの「標準化」の間違い」，2003
https://affordd.jp/koha_hp/process/Proc.WhyStd.html

### 清水吉男，「ＰＦＤ（Process Flow Diagram）の書き方」，2009
https://affordd.jp/koha_hp/process/PFDform3.pdf

###Kouichi Akiyama，「35号：PFDの使い方」，2019
https://note.com/akiyama924/n/n033ae30a0cf2

###安達賢二，猪股宏史，「問題構造分析とPFDの併用による現実的・段階的な改善実践方法の提案～PFDを使いこなす能力を確実に身に着けるために」，派生開発カンファレンス2013，2013
https://affordd.jp/conference2013/xddp2013_p8.pdf


# 関連記事
https://qiita.com/kazuo_reve/items/4d74723faaad1c2875a0

https://qiita.com/kazuo_reve/items/2c9a2d13bd57282bec1f

https://qiita.com/sionn/items/63911095843e0d85f926

https://qiita.com/kaizen_nagoya/items/f2dc5d216e57df844f50
【Git】git checkoutを使ってみよう

#はじめに
今回は、`git checkout`を使って、ブランチの切り替え、ファイルの変更の取消しを行ってみましょう。

#git checkout <ブランチ名>
このコマンドを使うと、記述したブランチに切り替えることができます。
また、新しいブランチを作成して、そのブランチに切り替えるという場合は以下のように`-b`を入れます。

```git:ターミナル
git checkout -b <新しいブランチ名>
```
#git checkout --<ファイル名>

このコマンドを使うと、ファイルの変更を取り消し、ワークツリーのファイルを元の状態に戻すことができます。
ファイル名以外にも、ディレクトリや`.`を指定することで、以下のように取り消すことができます。
※新規作成したファイル（まだ`git add`していないファイル）は元に戻すことができない点に注意が必要です。

```git:ターミナル
git checkout -- <ファイル名orディレクトリ名>   //該当のファイルorディレクトリの変更を取り消す
git checkout -- .                      //すべてのファイルの変更を取り消す
```

#おわりに
「--」を付けたら変更を取り消すコマンド、「--」を付けなかったらブランチを切り替えるコマンドということをしっかり覚えておきましょう。
【Rails】ancestryを使用し、データをセレクトボックスで表示する方法

#はじめに

前回、ancestryを用いて親-子のレコードを作成しました。

https://qiita.com/ysdiary/items/62e495da15d5f6e785c2

データ登録時にセレクトボックスで、地方（親）ごとに都道府県（子）を表示、選択できるようにしました。

出来上がりイメージ↓↓
<img width="300" alt="スクリーンショット 2021-09-29 22.31.33.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1902432/8d413858-ddbd-768a-f3c8-e7221645e1fb.png">
<img width="200" alt="スクリーンショット 2021-09-29 22.28.44.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1902432/a3c92ea4-7c7e-e29b-15ea-105353d0c582.png">

#前提
前回の記事（seed作成まで）は完了していることとします。

今回はpostsテーブル/camp_sitesテーブルに、region_idというカラムを作成し、
投稿記事、キャンプサイトに地域を紐付けて保存できるようにします。

カラムの追加は完了していることとします。

#やったこと

```ruby:posts_controller.rb
  def new
    @regions = Region.where.not(ancestry: nil) #ここを追加
    @post = Post.new
  end
```
親（地方）のレコードはancestryカラムはnilとなっているので、
Region.where.not(ancestry: nil)　で親ではないレコード、つまり子のレコード（都道府県）を取得しています。

```ruby:app/views/posts/new.html.erb
<%= f.select :camp_site_id, grouped_options_for_select(@regions.map { |p| [ p.name, p.camp_sites.map { |c| [c.site_name, c.id]} ]}), prompt: "選択してください" %>
```

formに上記を追加します。

```ruby
f.select :camp_site_id
```
はformの書き方通りです。

まず、@regionsには子である都道府県のレコードが格納されています（posts_controller.rbを確認）

grouped_options_for_selectは、親をひとまとまりのgroupとして扱ってくれます。

実際にコンパイルされるとこんな感じ↓↓

<img width="400" alt="スクリーンショット 2021-09-29 22.50.50.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1902432/06215e78-5c95-de8b-cd04-804187b71263.png">

親（地方）が、optgroup
子（キャンプサイト）が、option

で括られているのがわかると思います。

このようにグループでまとめてくれるのが、このメソッドです（便利）。

```ruby
@regions.map { |p| [ p.name, p.camp_sites.map { |c| [c.site_name, c.id]} ]}
```

本題のこの記述では、

```ruby
@regions.map
```
mapメソッドで@regionsに格納されている配列データの数だけ、ブロック内で処理を行い、
最終的に配列を返してくれます。

https://pikawaka.com/ruby/map

mapメソッドの後ろについては、

```ruby
|p| #ここに@regionsのレコードの一つが入ります（.eachと同様の考え方）
p.name #レコードのnameカラムが表示されます
p.camp_site.map #@regionsのレコードの一つに紐づくcamp_sites（キャンプサイト一覧）を配列データの数だけ処理を行います
|c| #camp_sitesのレコードの一つが入ります
c.site_name, c.id #camp_sitesのレコードの一つの名前を表示します。idも一緒に渡してあげます。
```

この処理をまとめると、まず、子である都道府県名が表示され、その後camp_site.mapの処理により、１つ１つの都道府県に関連するキャンプサイトが表示されます。

そのため、

関東地方
　　東京都
　　茨城県
中部地方
　　静岡県
　　愛知県

上記のように、子（都道府県）→関連するキャンプサイト→子（都道府県）...
と表示ができます。


考え方は同じなため、camp_sites/newについてはコードのみ記載します。

```ruby:camp_sites_controller.rb
  def new
    @camp_site = CampSite.new
    @regions = Region.where(ancestry: nil) #先ほどと違って、今回は親（地方）をregionsに入れます
  end
```

```ruby:app/views/camp_sites/new.html.erb
<%= f.select :region_id, grouped_options_for_select(@regions.map { |p| [ p.name, p.children.map { |c| [c.name, c.id]} ]}), prompt: "選択してください" %>
#親(地方)と親のchildren、つまり子（都道府県）をセレクトボックスに交互に表示します。
```

#終わりに
ancestryを用いてのデータ操作に想像以上に苦戦しました。
一通り解決し、復習することで、だいぶ理解することができました。
CPUについて　[CPUの指標値]

#CPUの性能


**CPUの性能を表すには<font color="red">指標値</font>を使う**

###３つの指標値

◯クロック周波数
　　→コンピュータにはクロックという周期的な信号に合わせて装置が動くようになっている
　　　これで装置がずれることなく動作し、クロックが早いほど装置が早く動くので
　　　処理も早くなる


　　　クロックが１秒間に繰り返される回数を<font color="red">クロック周波数（Hz）</font>という

例えば・・・
　　　クロック周波数４Hzなら<font color="red">１秒間に４回クロックが繰り返される</font>ということ
　　　１秒/4クロック　　← <font color="red">クロックサイクル時間</font>という

◯CPI

　→１つの命令で何クロック必要かを表す
　　例えば・・・
　　　　２クロックサイクル必要なら２CPI

**命令の実行時間の求め方**

   <font color="red">クロックサイクル時間　× ２クロック（２CPI）</font>　　←これで求められる

◯MIPS

　→１秒間に実行できる命令の数

　　20MIPS　　←１秒間に２０００万個の命令が実行できる

**数値が大きいほど多くの命令を処理できて早い**

###命令ミックス

よく使う命令たちを１つのセットにしたもの

命令によって、クロックサイクル時間が異なるのでどの命令を当てはめて計算すればいいのかとなった時は、
命令ミックスを使う

**出現頻度を元に命令実行の平均時間を求めその数値で<font color="red">MIPS</font>を求めるだけ**


例）



　![スクリーンショット 2021-09-11 16.57.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1803385/5af28e5c-5ff6-4b10-66ea-e443bb5c1cd9.png)

![スクリーンショット 2021-09-11 16.58.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1803385/304b1358-b828-79a1-df6d-9eecf4cc8e2f.png)

>参考書籍
>>きたみりゅうじ　『キタミ式　イラストIT塾　基本情報技術者　令和０３年』 技術評論社 2020年