OmniAICreator/Qiita-1.07M huggingface dataset:
いらないコメントを一括削除する方法

これを覚えると時間の節約になるのでおすすめです。
---
前提として、環境はMacでエディターはVSCodeです。(Atomでや他のエディターでも同様のコマンドで可能かと思います)


###Railsでテストアプリを作っている時などによく出る<font color="ForestGreen">長文のコメント</font>結構邪魔ですよね。
![スクリーンショット 2020-11-17 23.19.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/674994/9ff80428-e647-9042-a34f-c39724e74be2.png)
そんな時は　
---


- command+Fで任意のページで検索して

```
.*# .*\n
```
- このコマンドを打ちますと(今回はVScode使ってます)

![スクリーンショット 2020-11-17 23.27.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/674994/6f6fe622-07c8-5493-d1f0-05714a9d0c05.png)

- 結果はありませんとなってしまいましたが、正規表現を表す

![スクリーンショット 2020-11-17 23.31.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/674994/c2f3070d-3bee-11c7-32f2-783adc6adab0.png)
↑こちらのボタンを押すと２５個ヒットしました！

![スクリーンショット 2020-11-17 23.29.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/674994/e695db58-ea10-480d-c006-23e090686109.png)

- 全て置換すると

![スクリーンショット 2020-11-17 23.33.52（2）.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/674994/ff7d6aa0-51af-71bf-b410-177cdbf2b204.png)


コメントが一気に消えます。

![スクリーンショット 2020-11-17 23.41.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/674994/96ec05b9-3123-f89d-399e-4e40ee8760fd.png)


ちなみにバックスラッシュの打ち方は日本語キーボードですと

``` 
Option + ¥  = \
```

です。

是非試してみてくださいね。
cargoでの複数のユニットテストを順番に実行したかったのは、DB操作で汚れちまったテーブルのクリアを最後にしたかったからなのだ。

`diesel` で `MySQL` を制御している `Rust`のコードがありました。
`cargo test`で色々とデータベースを操作した後に、すっかり汚れちまったテーブルを放置しておくと次回のテストが失敗するので、ターミナルからコマンドを叩いてテーブルをクリアしていたわけです。

```
$ mysql -uroot -ppassword -h127.0.0.1 -e'truncate table test_database.test_teble;'
```
毎回叩くのも面倒なので、`cargo test`と一緒にやりたい。それがささやかな望みでした。

```
// Clean up the test_table
#[test]
fn test_cleanup_hash_file() {
    let conn = setup();
    diesel::sql_query("truncate table test_db.file_hashes").execute(&conn).unwrap();
}
```
こんな感じで、ユニットテストのコードを追加して `$ cargo test`しました。ファイルの最後に書いたので、最後に実行されてテーブルがクリアされるでしょう。そう信じて疑いませんでした。
しかし、現実は厳しいものです。そう簡単に希望を叶えてくれることはありませんでした。

とっとと結論をいいますが、`cargo test` によるユニットテストは ***並行実行*** ってコトらしいです。

今回の例でいうと、テーブルのクリアがどのタイミングで実行されるかがわからないので、テーブルクリア前提のテストは成功するか保証できないということです。

基本的に各ユニットテストはそれぞれで完結させるべきなのでしょう。

まあ、今回のように最後に後片付けしたいってコトは、DB操作とかのプログラムではありがちかもなので、どうしても順番に実行したい場合は

```
$ cargo test -- --test-threads=1
```
こうゃって。
テストを1スレッドで実行（マルチスレッドで並行実行しない）が、正解でした。

めでたしめでたし。
画面透過について

**bodyに背景画像や背景色を挿入したものの、containerなどの要素の中も透過して画像や色を反映させたいと思った事はありませんか？**

そんな時はrgba(255,255,255,0)と設定しましょう。
以下のようになります。
![スクリーンショット 2020-11-17 20.30.36のコピー.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/381701/b9a2e66d-4ea8-a3b3-6c25-e1814da39f33.png)
【Redshift】Redshiftの 可用性 / 拡張性 / セキュリティ

## 冗長化
RedshiftはマルチAZ構成をとることが出来ず、クラスターは1つのAZの中だけで構成する
→ S3に入力データをアップロードし、複数AZに展開したRedshiftにロードすることで可用性を高めることが可能

※ S3に配置されたデータに対するRedshiftからの更新は不可

**クラスター内に複数ノードがある場合**
・いずれかのノードに障害が発生すると、他のノードが障害ノードのドライブのデータコピーを参照して処理を行う
・障害は自動で検知・復旧されるため、単純にノード数を増やすことで冗長化の実現が可能

**クラスター内にノードが1つの場合**
・ドライブのデータコピーは作成されない
・障害が発生するとロードされたデータは失われる → 手動でのリカバリが必要

## バックアップ
ロードされたデータは常時S3に自動的にバックアップされる

- 自動バックアップの保持期間はデフォルトで1日、最長35日
- 手動でのスナップショット取得も可能
- AZ障害発生時には、別のAZにバックアップを復元して利用することも可能

## 拡張性
ノードタイプを変更することでスケールアップ、ノード数を増やすことでスケールアウトが可能
ノードタイプによって決められたサイズ × ノード数 = ストレージ容量

## セキュリティ
- クラスターへのアクセス制御にはセキュリティグループを使用
- SSL通信機能を利用して通信内容を暗号化することが出来る（AWS Certificate Manager を利用してクラスターに証明書をインストールする必要あり）
- クラスター作成時にKMSまたはCloudHSMを用いてデータの暗号化が可能
【React初心者】Herokuデプロイ時のエラー

#####結論：yarn.lockとpackge.lock.jsonのコンフリクトが原因。

以下デプロイできるまでの過程です。

1.creste-react-appでアプリを作成。

2.アプリをHerokuにデプロイ。git push heroku master実行も下記文言と共にエラー。

```
[rejected] master -> master (non-fast-forward)
error: failed to push some refs to 'https://git.heroku.com/*****.git'
``` 

Gitのmasterとローカルレポジトリにあるブランチの内容に不一致の場合に発生するエラーとのこと。

3.Gitでmargeをしてから再度push。また同一の文言でエラー。
masterブランチでのみの作業だったのでmargeが原因ではなさそう。

####4.Herokuのマイページにログインしてログを確認する。
これは結構大切だと思いました。エラーの原因もここでわかりました。

```
Two different lockfiles found: package-lock.json and yarn.lock
Both npm and yarn have created lockfiles for this application,
but only one can be used to install dependencies. Installing
dependencies using the wrong package manager can result in missing
packages or subtle bugs in production.
```

5.yarn.lockとpackage.lock.jsonのどちらかを削除する。
私の場合はyarnを消しました。

どちらの方が良いかは他の方の記事を参考にしてみてください。
今回はHerokuでしたが他のサーバでもエラーになるんでしょうね。
git/githubでエラーメッセージが出て困ったとき、とりあえず前の状態に戻る方法（たち）

## 野望

Gitを使えるようになりたいものだと思ってがんばっている。

（vim（emacs）のdotfileをGithubにおいて、履歴を保管しておきたいんだなあ）

いい記事がたくさんあって、なんとかなりそう……なんだけれど、ひとりでこちょこちょやっていて、意外とツラいのが「失敗したときに戻せない」ってこと。

各コマンドが思い通りに動かなかったときに、戻るやり方を調べたので記録しておきます。


## git init

```shell
$ git init
```

でローカルリポジトリをつくったけど、やっぱりやめたいとき。
対象ディレクトリに`~/.git`をつくっているだけだそうで、`.git`を削除すればおわり。

```shell
$ git -rf .git
```

なるほど！

[git init取り消し - Qiita](https://qiita.com/majihuwa_z/items/ec0d2e1ac21d68769693)


## git add

```shell
$ git add .
```

でステージングに追加した後で、やっぱりやめたいとき。
（実際、エラーメッセージがずらずら出て、どうしていいかわからなくて困った）

```shell
$ git status
```

で、何がどうなっているか調べられる。取り消すときは、`-rm`か`reset`。

```shell
$ git -rm --cached -r <dir>/<files>
$ git reset
```

`-rm`は、初回だけということだが、まだよくわかっていない。
たぶん、わけもわからず試しているようなときには、`status`→`reset`→`status`が良いのだろうと思われる。

[git add を取り消す - Qiita](https://qiita.com/yukure/items/89562e5eb1d03995dc5b)


## git remote add

```shell
$ git remote add origin <url>
$ git push -u origin master
```

とか本（やウェブサイト）に書いてある通りにやったのは良いけど、なんだかエラーメッセージが出て、そもそも、`add origin`て何やねん、となったとき。`remote -v`で調べて、名前を探して、`rm`すると良い。

```shell
$ git remote -v
$ git remote rm origin
```

[git remote add を取り消す方法 - Qiita](https://qiita.com/ngtkk/items/05097d127db6a415a7d8)


## そのあと

まだ`clone`したり`pull`したりはしていないので、なんかあったら追記します。

[commitとpushしかできない人のためのgithubの使い方まとめ
](http://myuon-myon.hatenablog.com/entry/20121114/1352906438
)　が大変勉強になって助かっております。
Pythonクイズ：CheckIOから得られた学び、

# これは何？
Python学習サイトCheckIOで見つけたえげつない解答から見出した、「自分が知らなかったこと言語仕様リスト」をクイズ形式でまとめた物です。
追記予定・・・！

# 問題①：変数nは誰なのか。
次の式を満たす変数nの値が何かを当ててください。

```Python
>>> type(n)
# <class 'float'> ; float型

>>> n < 2 * n
# False

>>> n > 2 * n
# False

>>> 1 < n
# False

>>> 1 == n
# False

>>> n < 1
# False

>>> n == n
# False

>>> n != n
# True

>>> n is n
# True
```

<details><summary>解答</summary><div>

```Python
>>>print(n)
# nan
```

nanを持つ変数と比較するとなんのエラーも出ないので、適宜math.isnanで確かめなければいけない。（深い後悔）

参考: [6.10.1.値の比較](https://docs.python.org/ja/3/reference/expressions.html#value-comparisons)、IEEE 754

</div></details>





# 問題②:単純な式
次の式は選択肢のどれと等価でしょうか。

```Python
# 問題の式
x is x>=2
# 選択肢
(x is x) >= 2 # (a)
x is (x >= 2) # (b)
それ以外 　     　　# (c)
```
<details><summary>HINT</summary><div>

x=2の時与式はTrueです。
</div></details>

<details><summary>解答</summary><div>

正解は「(c)それ以外」です！
ではどういう式なのか、が重要なのでまだ考えていない方は是非お考えください・・・！

<details><summary>式</summary><div>

```Python
(x is x) and (x >= 2)
```
と等価です。
Pythonでは ```a>b>c```等、演算子を連続させて記述することができますが、"is"もこの演算子リストに含まれており、andを使わずに表現可能です。
上記式は「複雑に見せるために」あえて「x is x」という意味のない比較をする現実的ではない問題ですが、学習になれば幸いです。

参考：[Python Docの比較](https://docs.python.org/ja/3/reference/expressions.html#comparisons)、[CiO元ネタ](https://py.checkio.org/mission/pangram/publications/schanjr/python-3/not-very-clean-but-works/?ordering=most_voted&filtering=all)(要ログイン&要解答)
</div></details>

</div></details>
LINEみたいに自分のメッセージと自分以外のメッセージの表示場所を変えたい

#はじめに
　現在作成中のチャットアプリのメッセージ画面をLINEのように自分の送ったメッセージは右、自分以外のメッセージは左に表示させよと一日苦戦した。ググってもあまり記事が見つからなかったので、ここに記録しておく。

##ポイントとして使ったもの

- renderメソッド
- if文
- deviseのメソッド


##コントローラー
```ruby:messages_controller.rb
def index
    @class_room = ClassRoom.find(params[:class_room_id])
    @messages = @class_room.messages.includes(:user)
  end
```
`@class_room`にチャットルームをparamsから呼び出し代入
`@messages`にそのチャットルームのメッセージを全て入れる。
`.includes(:user)`はN+1問題を解消するため。

##ビュー

※divタブはコードが読みにくくなるため、ここでは割愛。

```ruby
<% if message.user.id == current_user.id %>
    <%= l message.created_at %>
    <%= message.content %>
<% else %>
    <%= message.user.last_name %>
    <%= l message.created_at %>
    <%= message.content %>
<% end %>
```

if文で、メッセージのユーザーIDと現在のログインしているユーザーが同じか照会し、同じであれば（つまり、自分の送ったメッセージ）上の処理が行われ、違えば、下の処理が行われる。
自分のメッセージに送り主の表示は必要ないので、上の処理に`message.user.last_name `がない。


##その他
　CSSを整える。

##終わりに
　他のやり方として、コントローラーの時点で、自分のメッセージと自分以外のメッセージを別の変数に入れる方法も考えられる。
Docker で PureScript の開発環境を構築

# はじめに

先日、Docker コンテナ上で `spago repl` を動かすことができたので、今回は `spago init` で作成したプロジェクトのビルド、実行を確認する
[Docker コンテナ上で PureScript を動かす - Qiita](https://qiita.com/takaya030/items/992862d67dbddb4086d6)

# 検証環境

```
Windows10 Home Edition
VirtualBox 6.1.16
docker-machine.exe version 0.16.1, build cce350d7

# Docker Host OS (CoreOS)
$ uname -a
Linux default 4.14.154-boot2docker #1 SMP Thu Nov 14 19:19:08 UTC 2019 x86_64 GNU/Linux

Docker version 19.03.5, build 633a0ea838
docker-compose version 1.26.0, build d4451659
```

# ディレクトリ構成

`purescript` フォルダの中に `docker-compose.yml` と `Dockerfile` と空フォルダの `myapp` を準備する

```
purescript
├── docker-compose.yml
├── Dockerfile
└── myapp
```

## `docker-compose.yml`

```yaml:docker-compose.yml
version: "3.7"
services:
  purescript:
    build:
      context: .
      dockerfile: Dockerfile
      target: "purescript"
    image: takaya030/purescript
    command: "true"
  app:
    build:
      context: .
      dockerfile: Dockerfile
      target: "pure-app"
    image: takaya030/pure-app
    volumes:
      - ./myapp:/home/pureuser/myapp
    working_dir: /home/pureuser/myapp
    command: "spago run"
```

## `Dockerfile`

```dockerfile:Dockerfile
FROM node:12 as purescript
LABEL maintainer "takaya030"

# install purescript
RUN npm install --global --unsafe-perm purescript spago

# add user
RUN userdel node && \
	useradd -m -s /bin/bash pureuser

WORKDIR /home/pureuser
USER pureuser

RUN mkdir tmp && cd tmp && spago init

CMD cd tmp && spago repl

#=========================================
FROM purescript as pure-app

COPY ./myapp /home/pureuser/myapp
WORKDIR /home/pureuser/myapp

CMD ["spago","run"]
```

# イメージのビルド

```bash
$ cd purescript
$ docker-compose build purescript
$ docker-compose build app
```

イメージの確認

```bash
$ docker images
REPOSITORY             TAG                 IMAGE ID            CREATED             SIZE
takaya030/pure-app     latest              c018082fc97b        27 hours ago        1.08GB
takaya030/purescript   latest              fb50aeb56d04        2 days ago          1.08GB
node                   12                  1f560ce4ce7e        5 weeks ago         918MB
```

# プロジェクトの作成

下記のコマンドを実行すると `myapp` フォルダ以下に初期プロジェクトが作成される

```bash
$ docker-compose run --rm app spago init
```

プロジェクトのファイル構成

```bash
$ ls -l myapp
total 4
-rwxrwxrwx    1 docker   staff         2903 Nov 16 09:53 packages.dhall
-rwxrwxrwx    1 docker   staff          231 Nov 16 09:53 spago.dhall
drwxrwxrwx    1 docker   staff            0 Nov 16 09:57 src
drwxrwxrwx    1 docker   staff            0 Nov 16 09:53 test
```

# ビルド

自分の環境ではサンプルプログラムの絵文字が文字化けするため、以下のように変更した

```haskell:myapp/src/Main.purs
module Main where

import Prelude

import Effect (Effect)
import Effect.Console (log)

main :: Effect Unit
main = do
  log "Hello, PureScript"
```

下記コマンドでビルド

```bash
$ docker-compose run --rm app spago build

[info] Build succeeded.
```

# 実行

ビルドが成功したら下記コマンドで実行する

```bash
$ docker-compose run --rm app spago run

Hello, PureScript
```

# 参考

- [純粋関数型スクリプト言語PureScriptのはじめかた - Qiita](https://qiita.com/hiruberuto/items/2316b58162cfec150460)
Powerpoint（pptx）の表をスクレイピング

政府CIOポータルの[オープンデータ](https://cio.go.jp/policy-opendata)の[オープンデータ伝道師一覧](https://cio.go.jp/sites/default/files/uploads/documents/opendata-dendoushi_ichiran.pptx)のpptxの表をスクレイピング

```shell
wget https://cio.go.jp/sites/default/files/uploads/documents/opendata-dendoushi_ichiran.pptx -O ichiran.pptx
pip install python-pptx
```

```python
import pptx
import pandas as pd

prs = pptx.Presentation("ichiran.pptx")

dfs = []

for page in prs.slides:

    data = [[cell.text for cell in row.cells] for row in page.shapes[1].table.rows]

    dfs.append(pd.DataFrame(data[1:], columns=data[0]))

df = pd.concat(dfs).set_index("No.")

df["所属団体等"] = df["所属団体等"].str.replace("\n", "", regex=True)

df1 = df.join(
    df["氏名"].str.split("\n", expand=True).rename(columns={0: "ふりがな", 1: "名前"})
).drop("氏名", axis=1)

df2 = df1.reindex(columns=["名前", "ふりがな", "主な活動エリア", "これまでの主な実績等", "所属団体等"])

df2.to_csv("ichiran.csv", encoding="utf_8_sig")
```
メモ

基本的な形はこちら。
>/remind [@メンバー/#チャンネル/me] [何を（日本語OK）/URLもOK] [任意：いつ（英語）]
例：/remind @channel 伝票整理 発言のURL   

どちらかと言えば、コマンドで打つ方がラク
/remindだけ打っても『いつ/１時間単位で何時/説明』だけで細かい設定ができない。

#テンプレート（コピペ→適宜変更）

##＞正確な日時を指定したい場合はこちら
###■〇分後/〇時間後に通知したい場合

```
in 10 min    //10分後
in 〇 hours  //2時間後
```

###■13:00に通知したい場合

```
13:00  //時間を直接指定.以下でも可
1:00pm　

例：/remind @channel "再確認お願いします" 15:00
本日（過ぎていた場合は明日） 15:00  に #チャンネル名 でこれをリマインドします
```
※もし今の時間が設定した時間より過ぎている場合は、明日の指定した時間に設定されます。


###■11/28に通知したい場合

```
November 28 もしくは on 28 Nov 

例：/remind @channel "再確認お願いします" コピーしたリンク November 28 15:00
//11月28日 (土) 15:00  に #チャンネル名 でこれをリマインドします
```
※マウスのダブルクリックで単語が全選択できます。

| 月 | 英語表記 | 省略形 |
|:-----------:|:------------:|:------------:|
| 1月| January| Jan|
| 2月| February| Feb|
| 3月| March| Mar         |
| 4月| April| Apr|
| 5月| May| May|
| 6月| June| Jun|
| 7月| July| Jul|
| 8月| August      | Aug       |
| 9月| September| Sep|
| 10月| October| Oct|
| 11月| November| Nov|
| 12月| December| Dec|


###■毎月/毎週/毎日/隔週に通知したい場合
https://elastictechdays.info/slack-remind-command/

```
/remind me "給料日だー" on the 25th  every month //毎月25日に、自分宛に「給料日だー」と通知
※時刻指定なしだと朝 9 時にリマインドされます。

every Monday  　　　　　　//毎週の月曜日に通知

every day 15:00　　　　　 //毎日15時に通知

 on the 〇th of every month 　//毎月〇日に通知したい場合
```
・日曜日　Sunday
・月曜日　Monday
・火曜日　Tuesday
・水曜日　Wednesday
・木曜日　Thursday
・金曜日　Friday
・土曜日　Saturday

隔週はこちら

```
/remind @channel "隔週水曜日"  13:30pm every other Wednesday
// 隔週 水曜日 (次回のリマインド : 明日) 13:30  に #チャンネル名 でこれをリマインド
//上記登録時は火曜日でした。
```

###■複数曜日または、日時の両方を指定したい場合
```
every Monday, Wednesday  //毎週の月・水に通知したい場合 カンマで区切ると指定できます。

at 15:30 every Tuesday   //毎週火曜日の15:30に通知したい場合
every Friday at 3pm　    //日時逆でも可,　「at」もなくてOK

例：/remind @channel "文字やコピーしたリンクを入れてね" every Friday 15:00
毎週金曜日 15:00  に #チャンネル名 でこれをリマインドします : 

/remind @channel "文字やコピーしたリンクを入れてね" every Friday, Wednesday 1pm
毎週水曜日と金曜日 13:00  に #チャンネル名 でこれをリマインドします 
```


##前に発言したものを複数回リマインドする方法
リンクをコピーして
以下のように複数回登録する

```
一回目の発言　　//こちらのリンクをコピー

/remind @channel "1回目の周知です" リンクしたコピー 11/19 13:00 ※ここで必ずコピー推奨
//11月19日 (木) 13:00  に #チャンネル名 でこれをリマインドします  

Ctrl+Vで貼り付け「回数」と「日時」を変更
/remind @channel "2回目の周知です" リンクしたコピー 11/27 13:00 ※締め切りの３日前を想定

/remind @channel "3回目(締切日)の周知です" リンクしたコピー 11/30 13:00 ※締め切り当日
```
と1回発言した後、複数回リマインドを登録しておくことにより
好きなタイミングで周知することが可能です。




##設定したリマインドを確認・削除する方法（変更は不可能）
■リマインドの確認・削除
操作は簡単。他の人に見えないのでご安心を。
 

どのチャンネルでもいいので、メッセージ入力欄に
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/684145/1d0bd121-f9fd-1d69-4ac6-b37412f79e0a.png)
と入力してEnterを押すだけ。

リマインド登録されている一覧が表示され、
>・自分の項目：「終了」「削除」
・反復項目と他のメンバーに設定した項目：「削除」

が表示されているので、必要に応じて1クリック。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/684145/0485259d-350f-d7aa-0e66-f062c9b04ffa.png)


#Q&A
##上手く設定できない時は？
各項目の間が半角スペースで区切られていない可能性があります。
全角スペースでは、正しく設定されない場合がありますので、半角スペースで区切りましょう。


##チャンネル宛のリマインドを他の人に知られたくないんだけど…
<b>個人宛のリマインドは、登録時には自分にしか見えない</b>表示で、「～にこれをリマインドします」という確認画面が出ます。
（そのため、どのチャンネルの入力枠で登録しても、問題ないです。）

それに対して、<b>チャンネル宛</b>にリマインドを設定する場合、リマインドの登録が完了したタイミングで、該当のチャンネルに、このような表示が出ます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/684145/9f02d2e9-c7e0-d666-4741-0b6b0c52ae57.png)

ですから、サプライズには使えませんね。
pythonでgbizinfoを介して法人番号を一気に取得

##はじめに
こんなことはありませんか?
toBの企業情報は取得しているけどCRMには法人番号はない。
あるのは、法人名と設立年度などの基本情報。
こんな時に他のリストのデータセットと結合する際に、何を結合keyにすればいいのか？
悩むと思います。

行政の定める法人番号さえあれば、あらゆる企業情報を結合し、1つの情報にすることができます。
例えば,以下のように、テーブルAとテーブルBを結合したい時がありうるとします。

テーブルA(企業情報)

|会社名  |設立年  |都道府県  |
|---|---|---|
|hoge  |fuga  |3  |

テーブルB(コンタクト情報)

|会社名  |見込み金額  |受注状況  |
|---|---|---|
|hoge  |3000  |初回接続  |

##gbizinfoを使ってみる
sqlなどデータベース言語に触れることがある人ならわかると思います。
文字列同士の結合はDB負荷がかかるという事に。
法人番号さえあれば共通の結合Keyとして使用できます。
法人番号を取得する場合に、便利なのが、経産省のgbizinfoです
なんとこのサービスREST APIを備えているのです。
なので、とっても法人番号の取得が簡単です。
https://info.gbiz.go.jp/api/index.html

のちにheadersの情報でX-hojinInfo-api-tokenが必要になるので
あらかじめAPIの利用申請が必要です。

##pythonで呼んでみる
###サンプルデータ
以下のように、会社名と設立年度だけが入ったデータがあるとします。
このデータに法人番号を入れたいです。
リクエストの際のメソッドはGETです

|会社名  |設立年  |
|---|---|
|楽天モバイル株式会社  |2018  |
|株式会社松屋フーズ  |2018  |




###リクエストしてみる
```request.py
import json
import pandas as pd
import requests

class CorporateNumbers:
    def __init__(self):
        self.headers = {
            "Accept": "application/json",
            "X-hojinInfo-api-token": "###token###"
        }
        self.endpoint_url = 'https://info.gbiz.go.jp/hojin/v1/hojin'
    def _create_taeger_company_dataframe(self):
        df = pd.read_clipboard()
        return df
    def _get_corporate_number(self,df):
        #df = self._create_taeger_company_dataframe()
        name = df.name
        founded_year = df.founded
        results = []
        for name,founded in zip(name,founded_year):
            data = {
                'name':name,
                'founded':founded
            }
            res = requests.get(
                url = self.endpoint_url,
                headers = self.headers,
                params = data
            )
            json = res.json()['hojin-infos']
            results.extend(json)
            df = pd.io.json.json_normalize(results)
        return df
    def _merge_dataframe(self):
        df1 = self._create_taeger_company_dataframe()
        df2 = self._get_corporate_number(df = df1)
        df3 = pd.merge(df1,df2,on='name',how='left')
        return df3
```
### 結果
![スクリーンショット 2020-11-17 23.13.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/689282/e7e360c5-54ca-e07b-fcff-45934623117b.png)
【Ruby】値渡しと参照渡し

## 「値渡し」「参照渡し」とは
関数やメソッドにおける引数の渡し方の種類を表す用語のこと。
Rubyだけではなくどのプログラミング言語でも共通する。

## 値渡し
- 実引数の値をコピーして仮引数に渡す
- コピーを渡すので、実引数には影響なし
- Rubyは値渡し(他の言語も)

## 参照渡し
- 実引数の変数があるメモリ上の場所(メモリ番地)をコピーして仮引数に渡す
- 与えられたメモリ番地から実引数の値を辿って値を変更する
- 仮引数に変更を加えると実引数も変更される

##参照の値渡し？
- 変数が参照(メモリ番地)を保持している場合、参照がコピーされる
- 「オブジェクトの参照（メモリ番地）」をコピーして実引数に渡すので、同じオブジェクトを共有しているということになる
- つまり、引数が指すオブジェクトを変更すると元の変数のオブジェクトも変更される
- あたかも「仮引数を変更したら実引数も変更された」ように見えるだけで、実際は値渡し
- 「変数を変更する」ことと「変数が指すオブジェクトを変更する」ことは別！

## 引用元
[値渡しと参照渡しの違いを理解する](https://magazine.rubyist.net/articles/0032/0032-CallByValueAndCallByReference.html)

メモリ番地でイメージするととてもわかりやすかったです。
今日学んだことを可視化するためにとりあえず書いてみました。後程自分の中で噛み砕いてまとめます。
vue.jsにおけるエンターキー押下時の挙動をハンドリングする

#解決したい課題
エンターキー押下時に､ボタン押下と同じ挙動にしたい｡

##課題の詳細
v-form 内に v-text-field が2つある場合､v-text-fieldの韻字的なtype="button"が2つになってしまい(ここは仮定)
意図していないがエンターキーでsubmitがされない状態｡

#結論
※参考
https://qiita.com/sd131/items/06e13b5008efc41102d1
※参考サイトからの引用
v-form、v-btnコンポーネントを利用していると、 v-btnがtype="button" となる。
よって、テキストフィールドがあり、submitボタンがない状態のため 、Implicit submission （暗黙の submit）という HTML の仕様により、エンターキーで submit され、リロードされてしまう。

従って､そのtext内でエンターキーによるsubmitを有効化したいときは､
その<v-text-field>内にkeyイベントを以下のように追加してあげれば良い｡
```
<v-text-field>
@keydown.enter="submit"
</v-text-field>
```

keydownとkeyupとkeypressの違いは以下がわかりやすい｡
https://murashun.jp/blog/20191110-52.html

vuetify.jsのbuttonイベントについては以下にかなりまとまっている｡
公式:https://v15.vuetifyjs.com/ja/components/buttons/
Qiita:https://qiita.com/rubytomato@github/items/890d59804978aa959e9c

Qiita､すげーな｡｡｡
3カラムレイアウト作成

3カラムレイアウト作成

・可変レイアウト部分をflex: 1にし、残りのレイアウトを固定幅にすればok

```css
.parent {
    display: flex;
    height: 100vh;
}

.fix {
    width: 300px;
    background-color: violet;
}

.content {
    flex: 1;
    background-color: aqua;
}
```

```react
import React from 'react'
import './Column2Layout.css'

export const Column2Layout = () => {
    return (
        <div className="parent">
            <div className="fix"></div>
            <div className="content"></div>
            <div className="fix"></div>
        </div>
    )
}
```

![スクリーンショット 2020-11-17 23.07.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/278474/403fc128-0902-6e1b-18be-584ae244aa5e.png)



縦に3カラムレイアウトするには、親要素で子の整列方向を指定する。(flex-direction: column;)

```css
.parent {
    display: flex;
    height: 100vh;
    flex-direction: column;
}

.menu {
    height: 300px;
    background-color: violet;
}

.content {
    flex: 1;
    background-color: aqua;
}
```

![スクリーンショット 2020-11-17 23.09.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/278474/474fa13b-8793-5a45-89ca-2e572377385d.png)
2カラムレイアウト作成

サイトでよくある2カラムレイアウトを作成する。

・左レイアウトは300px固定で右レイアウトは可変にする。
・親要素にdisplay: flexをつける
・可変レイアウトにはflex: 1をつける


```css
.parent {
    display: flex;
    height: 100vh;
}

.menu {
    width: 300px;
    background-color: violet;
}

.content {
    flex: 1;
    background-color: aqua;
}
```

```react
import React from 'react'
import './Column2Layout.css'

export const Column2Layout = () => {
    return (
        <div className="parent">
            <div className="menu"></div>
            <div className="content"></div>
        </div>
    )
}
```

![スクリーンショット 2020-11-17 23.04.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/278474/c0949262-4ae7-ffef-b093-a97e5dcbc953.png)
ngrok使ってみた

#概要
新卒,3回目の投稿です。
ngrokを使う機会があり、非常に便利だと感じたので使い方を書いていきます。
ngrokはlocalhostで立ち上げたサーバに外部からアクセスできるようにするツールです。
今回はGoをでlocalhostを立ち上げ、私物のスマホからlocalhostにアクセスしてみました。

## ngrokをインストールする
[公式サイト](https://ngrok.com/)よりユーザー登録をしたら、zipファイルをダウンロードし、解凍します。
ユーザー登録にはgithubまたはgoogleアカウントを使うことができます。
解凍が済んだら、`ngrok.exe`を起動し、コマンドを打ち込みます。


```
ngrok http 8080
```
下記のような表示が見えれば完了です。
localhost:8080に対し、`https://66336728576f.ngrok.io`で外部環境からアクセスすることができます。

```
ngrok by @inconshreveable
(Ctrl+C to quit)
Session Status                online
Version                       2.3.35
Account                       アカウント名 (Plan: Free)
Region                        United States (us)
Web Interface                 http://127.0.0.1:4040
Forwarding                    http://66336728576f.ngrok.io -> http://localhost:8080
Forwarding                    https://66336728576f.ngrok.io -> http://localhost:8080
Connections                   ttl     opn     rt1     rt5     p50     p90
0       0       0.00    0.00    0.00    0.00
```

## 実際に外部からアクセスしてみる
``` Go
package main

import (
	"fmt"
	"net/http"
)

func main() {
	http.HandleFunc("/", handler)
	http.ListenAndServe(":8080", nil)
}
func handler(w http.ResponseWriter, r *http.Request) {
	fmt.Fprint(w, "ngrok超便利")
}

```
私物のスマホより、`https://66336728576f.ngrok.io`にアクセスすると、`ngrok超便利`が表示されました！
ngrok便利ですね。
一時ファイルを作る上で気をつけたいこと

プログラムを書く上で、一時ファイルを作る必要のある場面もあるかと思いますが、作り方に気をつけないと、セキュリティ上などの懸念が生じてしまうことにもなります。

## この記事のスコープ

この記事では、「（子プロセスなどで使う場合も含め）自分のプロセスで値を使い終える」一時ファイルについてのみ考慮します。「プロセス終了後に残しておいて、別なプロセスがあとから読み取る」ような一時ファイルについては、作成時にできることにも限りがあります。

また、セキュリティ面については、主に「同じマシンにいる、別な非rootユーザーからの攻撃」を考えていきます。root権限を持ったユーザーに対してや、同じユーザーで動く別プロセスなどに対しては、できることにも限界があります。

そして、Unix系のパーミッション環境を前提としますので、Windowsではそのまま適用できるとは限りません。

## 作成場所

まずは、作成する場所を考える必要があります。

### 専用の一時ディレクトリ

パーミッションを`700`に設定したディレクトリを用意しておけば、この中にはrootでない他人がアクセスすることはできません。他人にはファイルの有無すら知ることもできませんので、普通にファイルアクセスを行っても、共用の一時ディレクトリを使うより格段に安全性が向上します。

なお、ディレクトリに1つでもファイルが入っていれば、そのファイルの削除ができない結果、ディレクトリも他人には削除不可となりますが、空ディレクトリは**親ディレクトリ**側のパーミッションで削除できるかが決まります。不正な削除が可能とならないように注意が必要です。

専用の一時ディレクトリを用意する方法として、サーバ構築などの段階で作り付けで用意しておく方法や、共用の一時ディレクトリにサブディレクトリを作成する方法が考えられます。

### 共用の一時ディレクトリ

共用の一時ディレクトリの場合、**スティッキービット**が立っているディレクトリを使う必要があります。

単に`777`のディレクトリでは、他人からのファイルの不正な読み書きは作成時のパーミッション設定で防ぐことが可能ですが、他人が削除や名前変更することはできてしまいます。スティッキービットを立てることで、ファイルの所有者・ディレクトリの所有者・root以外にはそれらの操作が不可能となります。

## ファイル作成時

ファイル作成時には、以下のようなことに注意が必要です。

* 特に必要性があるのでもなければ、ファイル名を固定にしない
* 作成時にパーミッションを指定する（あとから指定すると、作成とパーミッション設定の間に第三者のアクセスが入る危険がある）
* 「すでにファイルが存在すれば失敗する」という設定でファイルを新規作成する（事前にファイルを用意して待ち構える攻撃への対策）

### 競合状態への対応

上の例にもありますが、「ある条件」を満たしていることをチェックしてから、その条件を前提としたアクセスを行うと、チェックと実行の間に第三者が介入する危険があります（特に、共用のテンポラリディレクトリでは第三者にもファイルの作成が可能です）。「チェックしつつ実行するような指定を行って介入の隙を作らない」あるいは「チェックしたファイルと操作をしようとするファイルが同一であることを確認する」などの防衛が必要になります。

### 即時`unlink`

子プロセスに一時ファイルのファイル名を渡す必要があるような場面では使えないですが、一時ファイルを1つのプロセスだけでしか使わない場合、「ファイルを開いたまま`unlink`する」という技が有効です。

`unlink`はファイルの名前を削除する機能なので、すでに開いたファイルハンドルは有効なままですが、`unlink`後には二度とそのファイルを開くことができなくなります。そして、アクセス可能なファイルハンドルがなくなれば、ファイルは自動で削除されます。

### 後始末の自動化

ファイルを作って処理の最後に削除、のような流れを手で書いていると、途中で例外が起きたような場合に一時ファイルが残ってしまいます。対応する方法があるなら事前対応するほうがいいでしょう。

* プロセス内でしか使わない一時ファイルであれば、即時`unlink`することで、たとえ処理系がクラッシュするようなことになってもファイルが残らなくなります。
* 言語によっては、一定のコードブロックからどんな形であれ脱出した場合に、後処理を自動で実行する構造があります（Javaのtry-with-resource、C++のRAII、Rubyのブロック付きメソッドなど）。一時ファイルについても、これらの構造がマッチするのであれば使うと便利です。


## 外部リンク

* [IPAのセキュアプログラミング講座（一時ファイルの扱い）](https://www.ipa.go.jp/security/awareness/vendor/programmingv1/b07_08.html)
PythonのTkinterメモ(自分用)

#ウィジェット

__Frame__
概要：ウィジェットを格納する枠組みを作る。

__Label__
概要：文字列やイメージを表示する。

__Message__
概要：複数行の文字列を表示する。

__Button__
概要：ボタンを作る。

__Radiobutton__
概要：ラジオボタンを作る。

__Listbox__
概要：リストボックスを作る。

__Scrollbar__
概要：スクールバーを作る。

__Scale__
概要：スケールを作る。

__Entry__
概要：１行の文字列を入力と編集。

__Menu__
概要：メニューボタンを作る。

__Menubutton__
概要：メニューボタンを作る。

__Bitmap__
概要：ビットマップを作る。

__Canvas__
概要：キャンバスを作る。

__Text__
概要：テキストの入力と編集。

__LabelFrame__
概要：ラベル付きフレーム。

__スピンボックス__
概要：スピンボックスを作る。

__PanedWindow__
概要：ペインウィンドウを作る。

-------------------------
#ウィジェットのオプション

__foreground (fg)__	
文字や線を描くのに使用する色を指定

__background (bg)__
背景色の指定

__text__
ウィジェット内に表示されるテキスト

__textvariable__
テキストを格納するオブジェクトを指定

__image__
ウィジェット内に表示されるイメージ

__bitmap__
ウィジェット内に表示されるビットマップ

__borderwidth__ (bd)
ウィジェットの枠の幅

__relief__
ウィジェットの枠のスタイル

__height__
ウィジェットの高さ

__width__
ウィジェットの幅

__anchor__
ウィジェットや表示されるデータの位置を指定
[Xcode]シュミレータのスクリーンショットを影無しで撮影する

# はじめに
AppStore用の画像を作成する際に、端末の枠付きのスクリーンショットを取得したかったが、
`command + shift + 4 + space`でクリックしたスクリーンショットには上部にツールバーが付いている。
これをトリングでツールバーを切り取った場合に、ツールバーにシャドウが付いているため、不自然な感じになってしまいます。

![Screen Shot 2020-11-17 at 22.42.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99869/14cc5b1c-d937-2d1b-79f9-21ac49c8a9cf.png)

# シュミレータをシャドウなしで撮影する方法
`command + shift + 4 + space`でクリックするさいに`option`キーを押しながら撮影するとシャドウなしのスクリーンショットが撮影できる。
これをツールバーの部分だけトリミングすればAppStoreの画像に使用できます。

![Screen Shot 2020-11-17 at 22.37.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99869/589e8bce-22f8-3ff4-a6ae-c054e9710542.png)
【PHP：条件分岐】if文、else文、elseif文の３つを具体例付きで解説！【初学者向け】

プログラミングを`Progate`や`ドットインストール`、勉強はじめた時は、覚える関数が多くて

<b>「どの関数を使うかわからない！」</b>
<b>「そもそも関数多くて覚えてられない！」</b>

などと悩んだことが多かったです。<br>

しかし、`Progate`や`ドットインストール`で紹介されている関数は網羅的なので、正直あまり使われない関数も多いです。と言うことで、この記事ではまず最初に抑えたい<b>if文</b>と言う関数を3つご紹介します。<br><br>

##if_else_elseif文 (超頻出)

###書き方

```php
<?php

  if (/* 条件式① */) {
    /* 条件式①を満たした場合の処理 */
  } elseif (/* 条件式② */) {
    /* 条件式①を満たさず、条件式②を満たした場合の処理 */
  } else {
    /* 全ての条件式を満たさなかった場合の処理 */
  }

?>
```

因みにelseif以下の部分と、else以下の部分は書いても書かなくてもOKで、その都度利用していく感じです。<br><br>

####具体例①

```php
<?php

  $a = 10;
  $b = 20;

  if ($a < $b) {
    echo "Hello";
  }

  if ($a > $b) {
    echo "World";
  }

?>
```
####出力①
```
Hello
```
具体例①の場合、一つ目のif文は条件を満たしているので処理が実行されますが、二つ目のif文は条件を満たしていない為、処理の実行はされません。<br><br>

---

####具体例②

```php
<?php

  $a = 10;
  $b = 20;

  if ($a > $b) {
    echo "Hello";
  } else {
    echo "World";
  }

?>
```
####出力②
```
World
```
具体例②の場合、if文の条件を満たしていませんが、後ろにelse文が入ってるので、そっちの処理が実行されます。(if文の条件を満たしている場合は、if文の処理が実行され、else文の処理は実行されません。)<br><br>

---

####具体例③

```php
<?php

  $a = 10;
  $b = 20;
  $c = 30;

  if ($a > $b) {
    echo "Hello";
  } elseif ($c > $b) {
    echo "World";
  } else {
    echo "PHP";
  }

?>
```
####出力③
```
World
```
具体例③の場合、if文の条件は満たしていませんが、その後のelseif文の条件は満たしている為、そっちの処理が実行されます。なおこの場合、else文の処理は無視されます。(if文の条件とelseif文の条件の、両方とも満たしていない場合は、else文の処理が実行されます。)

---

###まとめ

if文は様々な教材などで扱われる練習用のWebアプリ制作でも、かなり頻出します。またこう言うのは<b>「習うより慣れろ！」</b>なので、ぜひ実際にコードを書いて練習してみてください。

最後までご覧いただき、ありがとうございました！

筆者：yuki｜学習10日目で初案件獲得→現在はフルスタックエンジニア転職に向けて学習中
Qiita：https://qiita.com/yuki4839
Twitter：https://twitter.com/yuki35522891
VueプロジェクトにVuetify追加

すでにVueプロジェクトがある状態から始める
Vueプロジェクト作成は [こちら](https://qiita.com/yuta_ichi/items/881a2ec27bff7f1176db) を参照
Vueは3系を使用

## コンテナに入る
alpine linuxを使っているのでashです

```
⛄ docker exec -it <container-name> ash
```

## vuetify 追加

```
vue add vuetify
```

エラー出現...

```
🚀  Invoking generator for vue-cli-plugin-vuetify...
 ERROR  Error: You cannot call "get" on a collection with no paths. Instead, check the "length" property first to verify at least 1 path exists.
```

[こちら](https://github.com/vuetifyjs/vue-cli-plugins/issues/140)によると、vue3系はbetaなのでveu2系を使って欲しいとのことでした。
最新にしすぎた...

結局vue2系にダウングレードして再チャレンジ
3系のアプリはいったん削除して2系のプロジェクトを作成
（削除しないでいい方法もあると思いますが、今回は全部吹き飛ばしました）

## 再チャレンジ
```
vue add vuetify
```

成功したようなのでブラウザから確認
Portなどは環境に応じて適宜変更してください

```
http://localhost:8080/
```

以下の画面が表示されていたら、成功！
![スクリーンショット 2020-11-17 13.46.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/168995/e5c9dd14-1cd9-1da0-f327-fdb61e0cd086.png)
Linux パーミッション

#【Linux パーミッション】

##パーミッション　（例： - rwx  rw-  r--）

左から、
①番目は、ファイルの種類（- : 通常ファイル、 d : ディレクトリ、 l : シンボリックリンク）
②番目は、ユーザ（所有者）に対するパーミッション
③番目は、グループに対するパーミッション
④番目は、その他のユーザに対するパーミッション

##シンボリックモード、オクタルモード

###・シンボリックモード : 文字や記号を用いてパーミッション変更

<strong>chmod　 ①(ユーザ)　②(操作)　③(パーミッション)　ファイル名</strong>

① u : 所有者、 g : グループ、 o : その他、 a : すべてのユーザ
② + : 許可を与える、 - : 許可を削除する、 = : 許可を設定する
③ r : 読み取り権、 w : 書き込み権、 x : 実行権

###・オクタルモード : 目的のパーミッションを8進数の数値を使用して変更

<strong>①rwx  ②rw-  ③r--</strong>

① ユーザ　rwx : 4+2+1 = 7
② グループ　rw- : 4+2+0 = 6
③ その他　r-- : 4+0+0 = 4

（r : 読み取り権、 w : 書き込み権、 x : 実行権）
（読み取り権 : 4、 書き込み権 : 2、 実行権 : 1、 権限なし : 0）

##デフォルトパーミッション

<strong>ファイル</strong>
作成時にアプリケーションが指定するパーミッションは、666（rw- rw- rw-）
umask値は、002（--- --- -w-）
デフォルトのパーミッションは、664（rw- rw- r--）

<strong>ディレクトリ</strong>
作成時にアプリケーションが指定するパーミッションは、777（rwx rwx rwx）
umask値は、002（--- --- -w-）
デフォルトのパーミッションは、775（rwx rwx r-x）

##余談

少し前に、「755」というアプリが人気だったような気がしますが、パーミッションから名前を思いついたんですかね？？

755だと、rwx r-x r-x だから、ユーザは読み取り権、書き込み権、実行権がある。
グループとその他は、読み取り権と実行権はあるけど書き込み権がない？ということなのかな。全然知らないけど。
Alibaba Cloud Elastic Block Storageまとめ

Alibaba Cloudには大きく分けて3つのデータストレージプロダクトがあります。
**1.Elastic Block Storage**(以下、Block Storage)
**2.Object Storage Service**(以下、OSS)
**3.Network Attached Storage**

今回は、Block Storageについて調べたことをまとめてみました。
内容は2020/11/17時点のものです。

# Block Storageの特徴
* オンラインスケーリング
    * サービスの中断やElastic Compute Service(以下、ECS)インスタンスの再起動をせずに、ディスクをスケールアウトすることができます
* データの保護
    * ディスクのスナップショットを作成して、データの保護・リカバリ、イメージのカスタマイズやアプリケーションのディザスタリカバリをサポートしています
* データの暗号化
* I/Oの分離
    * ECSインスタンスと関連するディスク間の接続には、専用の帯域幅が割り当てられます
    * インスタンスのストレージ入出力(I/O)分離が有効

# Block Storageとは
Block Storageは、Alibaba Cloud Elastic Compute Service(以下、ECS)用のハイパフォーマンスかつ低レイテンシのブロックストレージサービスです。
サービスの中で提供されているブロックレベルのストレージプロダクトは大きく分けて3つ。
## 1.クラウドディスク
* ECS用のデータストレージプロダクト
* 複数分散システム(三重化技術)
* ハイパフォーマンス
* 低レイテンシ
など

## 2.共有ブロックストレージ
* ブロックレベルのデータストレージ
* 複数のECSインスタンスへの同時読み書きがサポートされている
* 複数分散システム(三重化技術)
* 低レイテンシ
* ハイパフォーマンス
など

## 3.ローカルディスク
* ECSインスタンスがホストされている物理サーバー(ホストマシン)に接続
* 高ストレージI/Oパフォーマンス
* 低レイテンシ
* 高ランダムIOPS
* 高スループット
など

# 対応しているリージョン
Block Storageが対応しているリージョンは、下記のエリアです。

* 中国
* 香港
* シンガポール
* オーストラリア(シドニー)
* マレーシア(クアラルンプール)
* インドネシア(ジャカルタ)
* 日本(東京)
* アメリカ(シリコンバレー/バージニア)
* ドイツ(フランクフルト)
* イギリス(ロンドン)
* インド(ムンバイ)
* ドバイ

# 料金体系
料金体系はリージョンと、用途(Storage/Snapshot)によって異なります。

## Storageの場合
Storageとして利用する場合は、さらに3タイプの料金体系になります。
**【ESSD Cloud Disk Fee】**
1.最大IOPS/最大スループット
2.キャパシティーレンジ
3.従量課金(100GB/1時間あたり)またはサブスクリプション(月額)

**【System Cloud Disk Fee】**
1.Diskタイプ(Cloud Disk/Ultra Cloud Disk/SSD Cloud Disk)
2.サイズ(100GBあたり)
3.従量課金またはサブスクリプション(月額)

**【Data Cloud Disk Fee】**
1.Diskタイプ(Cloud Disk/Ultra Cloud Disk/SSD Cloud Disk)
2.サイズ(100GBあたり)
3.従量課金またはサブスクリプション(月額)

## Snapshotの場合
スナップショットとレプリケーションサービスの料金体系に分かれています。
**【スナップショットサービス】**
標準ストレージ(2タイプ)とローカルストレージタイプの3タイプに分かれています。
標準ストレージは、容量が0～5GBまでと5GBを超える２タイプ。
ローカルストレージの容量範囲は1GBまでです。
料金は**従量課金制**となっていて、GB/月単位で課金されます。

**【スナップショットレプリケーションサービス】**
スナップショットレプリケーションは、リージョンの組み合わせによっても料金が異なります。
ただし、ドバイはスナップショットレプリケーションサービスに対応していないので注意が必要です。

# パフォーマンス
ブロックストレージのパフォーマンスについては、こちらのドキュメントをご確認ください。
[ストレージパラメータおよびパフォーマンステスト](https://www.alibabacloud.com/help/ja/doc-detail/25382.htm)

# 暗号化
暗号化には、**ECSディスクの暗号化**と**イメージの暗号化**の２タイプがあります。

## ECSディスクの暗号化
ECSディスクとは、ここではクラウドディスクと共有ブロックストレージデバイスとします。
ECSディスクの暗号化は、新しいECSディスクを暗号化することが可能なため業務セキュリティなどのニーズに対応できます。
暗号化機能を利用すると、ユーザーが独自でキー管理関連の運用が必要なくなります。
また、暗号化と復号化の処理がパフォーマンスに与える影響は少ないです。
暗号化と復号化はECSインスタンスを実行するホスト上で実行されるので、ECSインスタンスからクラウドディスクに送信されるデータは暗号化されます。
詳細は上記パフォーマンスに掲載しているドキュメントをご覧ください。

## イメージの暗号化
イメージの暗号化機能は、イメージをコピーする際にキーの追加または置き換えをすることで新しい暗号化イメージを生成できます。
キーはCMKまたはBYOKモデルを利用できます。

イメージの暗号化は、現時点ではβ版のため中国(香港)リージョンのみ利用可能となっています。
Alibaba CloudでのKeyの作成・削除・管理はKey Management Service(以下、KMS)を利用しましょう。
KMSについては、こちらをご参考ください。
[使ってますか？KMS](https://qiita.com/cube8080/items/430c64084297007627ea)
ECSイメージ暗号化機能を初めて使用する際には、KMSを有効化しておく必要があります。

イメージの暗号化には制限事項があるので、利用する前に確認することをおすすめします。

# まとめ
かなり端折った内容になりましたが、奥が深いサービスなのでドキュメントを読みつつ触ると理解が深まりそうです。
OSSやNASとの使い分けもしっかり検討して利用できると便利だと思いました。
【Laravel基礎】フォームの入力内容を制限する方法【バリデーションとフォームリクエスト】

#概要#
Laravel学習で自分がつまずいた部分を備忘録としてまとめています。
今回はフォームの入力内容の制限に関する記事です。

#つまずいたポイント#
指定条件以外のフォーム入力を弾いてくれる`バリデーション`。
そんなバリデーションですが、アクション事に毎回指定するのが面倒くさい。。
効率的な方法が無いか調べました。

どうやら、`フォームリクエスト`なるものを使うと
一括でバリデーションを指定出来るとのこと。

バリデーションの復習もかねて、下記の２つを記事にしました。

####①バリデーション####
####②フォームリクエスト####

以下、記事内容です！

#バリデーション#
まずはバリデーションの復習。
保存や編集などの、フォーム内容を受け取るアクション内で、
`$this->validate($request,[条件]);`を入力。
第2引数の入力内容が、フォームの入力条件になります。

■コントローラ

```laravel:PostsController
    public function store(Request $request) {  
 
      //バリデーションで条件を指定
       $this->validate($request, [
        'title' => 'required|min:3',
        'body' => 'required'
      ]);

      $post = new Post();
      $post->title = $request->title;
      $post->body = $request->body;
      $post->save();
      return redirect('/');
    }
```

上記の場合だと、
title => 3文字以上 , body => 入力必須
て感じですね。
この条件以外の内容がフォームから送信されると、バリデーションが弾いてくれます。



##フォームリクエスト##
次は`フォームリクエスト`です。
バリデーションはアクション毎にフォームの入力内容を指定していましたが、
フォームリクエストではそれを一括で指定することが出来ます。
以下、手順です。



```laravel:ターミナル
php artisan make:request PostRequest
```

フォームリクエストは`php artisan make:request 〜Request`で作成出来ます。
今回はPostRequestと名付けました。
作成したRequestは`App\Http\Requests`の中にあります。


■フォームリクエスト

```laravel:PostRequest.php
   //①
   public function rules()
    {
        return [
            'title' => 'required|min:3',
            'body' => 'required'
        ];
    }

    //②
    public function messages() 
    {
        return [
            'title.required' => 'タイトルを入力して下さい。'
       ];
    }

```

フォームリクエスト上での主な指定内容は２つ。
１つは入力内容の条件、もう１つはバリデーションのメッセージです。

まずは入力内容の条件から。`rulesメソッド`を使う事で条件指定できます。(①)
中身は先ほどのバリデーションと同じですね。

そして`messagesメソッド`では、
バリデーション適用時のメッセージを指定する事ができます。(②)
デフォルトでは英文が指定されているので、わかり易くするには日本語に変えておいた方が良いかもですね。

            
■コントローラー
        
```laravel:PostsController
//①
use App\Http\Requests\PostRequest;

    //②
    public function store(PostRequest $request) {   
      $post = new Post();
      $post->title = $request->title;
      $post->body = $request->body;
      $post->save();
      return redirect('/');
    }


```

コントローラでは、フォームリクエストをuseで使えるようにしましょう。(①)
そしてアクションの引数にフォームリクエストを入力。(②)
フォームリクエストで指定した内容が適用されるようになります。
バリデーションを書かないで良いので楽ですね。

フォームリクエストは以上です！
1.ターミナルからフォームリクエストを作成
2.フォームリクエストの条件を指定
3.コントローラ＋アクションでフォームリクエストを適用
という流れですね。

ちなみに、何でアクションの引数にrequestを入れるだけでフォーム内容が受け取れるのか？
疑問に思って調べましたが、「サービスコンテナ」やら「メソッドインジェクション」やら「DI(Dependency Injection = 依存性注入)」なる単語まで出てきて、脳がフリーズしたので一旦忘れます。いつかちゃんと調べて記事にします。多分。。。


##まとめ##
以上、Laravelでフォームの入力内容を制限する方法でした。
最後まで読んで頂きありがとうございました。
フォームリクエストの方がコードの量が少なくなるので楽ちんですね。
【SQL】データベースからデータを検索する

SQLを使ってデーターベースからデータを検索する方法を学習したため、アウトプットいたします。

#取得するカラムを指定する
取得するカラムを指定する方法は

```
SELECT カラム名
```

です。

```
SELECT name
FROM users

//上記はユーザーテーブルのnameカラムを取得しています
```

ちなみに
SELECT *
とすると、全てのカラムが指定されます。
SELECT句においてアスタリスクは「全てのカラムを取得するという意味になります

#WHERE句に論理演算子を指定し、検索をしよう
取得するレコードの条件を指定し、その条件のレコードを取得するには

```
WHERE 条件
```

とします。
また、WHERE句の条件には 「＝」「＜＝」のような比較演算子をしようすることもできる。

例えば

```
SELECT *
FROM users
WHERE age = 22
```

これでユーザーカラムからageが22歳のデータを取り出せます。

また、論理演算子（AND, ORなど）をも使用できる

#AND演算子

WHERE a AND b
→aかつbが正の条件

```
SELECT *
FROM users
WHERE age = 22 AND gender = "female"
```

上記ではusersテーブルから22歳かつ女性のデータを取得できる。

#OR演算子
OR演算子は複数の条件を指定して式を作る。その条件のうち、どちらかが正であれば、式も正に。

WHERE a OR b

```
SELECT *
FROM users
WHERE age = 22 OR gender = "female"
```

上記は22歳もしくは女性の値が返ってくる。

#NOT演算子
指定した条件とは異なるデータをとってくる

```
SELECT *
FROM users
WHERE NOT age = 22 
```

22歳以外のデータが返ってくる。

#IN演算子
1つのカラムに対しリストを指定して、カラムの値がそのリストに含まれるとき、式は正になるという演算子。

```
SELECT *
FROM users
WHERE age = 22 OR age = 25
//ユーザーの年齢が22歳もしくは25歳のデータが返ってくる
```

上記はIN演算子を使い以下とまったく同じ表し方ができる

```
SELECT *
FROM users
WHERE age IN(22, 25)
```
Salome-Meca2019による練習１：書籍『例題で極める非線形有限要素法』より

Salome-MecaはDEXCS2014版を長らく使っています．最近，Salome-Mecaの2019 を使い始めました．そのための練習用に，以下の本に載っているMarcでの事例をSalome-Mecaで計算しようとしています．

Markdown記法に慣れていないため読み難いかもしれません．頑張ってMarkdown記法を覚えていきます．


**例題で極める非線形有限要素法**
CAEで正しい結果を導くための理論トレーニング
発行元：丸善出版　　発行年月日：2020年10月
https://www.maruzen-publishing.co.jp/item/?book_no=304000

-----------------

##【CS02-11】 片面が完全に固定されて先端に荷重がかかる片持梁

寸法は1×1×10[mm]で， 縦弾性係数は200,000[MPa]，ポアソン比は0.3,先端の荷重は1[N]です．
（ただし、理論解と比較するためポアソン比は0で計算します。）
６面体８節点要素と４面体４節点要素で要素の代表寸法を変えた時の，先端の撓みを理論解との差を求めています．

６面体要素は書籍の図と同じように分割できましたが，４面体は少し異なりました．
６面体要素のほうが理論解に合いやすいという傾向は再現されています．

###Salome-Mecaのメッシュ作成の設定
<pre> ６面体要素の場合
   3D Hexahedron(I.J,K)
   2D Quadrangle:Mapping
   1D Wire Discreation
        Local Length
        lengthで値を設定しました　1, 0.5, 0.34, 0.25, 0.2 
</pre>
<pre> ４面体要素の場合
　　3D NETGEN 3D
　　2D Triangle:Mefisto
　　1D Wire Discreation
　エッジへのsub-mesh
　　1D　Wire Discreation
  　    Local Length
　　　　length で値を設定しました 1, 0.5, 0.34, 0.25 
</pre>

![20201117-001.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/888272/6f67661f-df00-e2e4-7475-89a0bb5e38cd.png)
![20201117-003.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/888272/02f73aa2-80df-5581-ea2c-af2ce0b3f4b5.png)


###計算結果（先端の撓み量）
Post-processでの表示から読み取ったため有効数字は２桁です．

| メッシュ代表長さ | ６面体要素 | ４面体要素 |
|:----------------|----------:|:---------:|
| 1               | 1.3e-2    | 0.83e-2   |
| 0.5             | 1.8e-2    | 1.5e-2    |
| 0.33            | 1.9e-2    | 1.6e-2    |
| 0.25            | 2.0e-2    | 1.9e-2    |
| 0.2             | 2.0e-2    |           |


![20201117-002.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/888272/5150bd21-8a69-fc2a-2cb0-f46e773e44fd.png)
４面体要素のメッシュ代表長さ0.25のプロット点の位置だけが参考書籍と大きく異なっています．メッシャーの動作の違いが出ているためと思われます．

####オイラー梁の理論解

先端での撓み　$\delta=Pl^3/3EI$
ただし，$P$ は荷重で1N，$l$ はスパンで10mm，$E$ は縦弾性係数，$I$ は断面２次モーメントです．
正方形の辺長を$a$とすると，$I=a^4/12$です．
オイラー梁はポアソン比を考えないので，シミュレーション計算でポアソン比を0にしています．
先端での撓みは,0.02mmになります．

-----------------
こちらの記事を参考にさせていただきながら、Salome-Meca2019を覚えています．

Salome-Meca 2019の使いかたの基本
https://qiita.com/Jun_Tatsuno/items/d7246abcebaff3e99b72
UIPanGestureRecognizer（パン）とUISwipeGestureRecognizer（スワイプ）をいっしょに使う

同じviewにパンとスワイプを同時に与えると、パンしか効かなくなる。
素早くスワイプした時だけスワイプを発火してそれ以外の時はパンするコードがこちら。
基本PanGestureで、Pan速度が一定を超えた時だけSwipeになります。
[スタックオーバーフローの記事の引用です。元記事には実際のジェスチャアニメーションの様子があります。](https://stackoverflow.com/questions/4875255/is-there-any-priority-condition-between-gesture-methods-pan-gesture-and-swipe-g/48235812#48235812)

```swift
let swipeVelocity: CGFloat = 500

@objc func didPan(_ sender: Any) {

guard let panGesture = sender as? UIPanGestureRecognizer else { return }

let gestureEnded = Bool(panGesture.state == UIGestureRecognizer.State.ended)
let velocity = panGesture.velocity(in: self.view)

if gestureEnded && abs(velocity.y) > swipeVelocity {
        handlePanAsSwipe(withVelocity: velocity.y)
    } else {
        handlePan(panGesture)
    }
}

func handlePan(_ recognizer: UIPanGestureRecognizer) {
    switch recognizer.state {
    // Panの操作を書く
    case .began:
    case .changed:
    default: break
    }
}

func handlePanAsSwipe(withVelocity velocity: CGFloat) {
    if velocity > 0 {
        print("down")
        // 下Swipeの操作を書く
    } else {
        print("up")
        // 上Swipeの操作を書く
    }
}
```

```swift
let panOrSwipe = UIPanGestureRecognizer(target: self, action: #selector(didPan(_:)))
view.addGestureRecognizer(panOrSwipe)
```

🐣
****
お仕事のご相談こちらまで
rockyshikoku@gmail.com

Core MLを使ったアプリを作っています。
機械学習関連の情報を発信しています。

[Twitter](https://twitter.com/JackdeS11)
[Medium](https://medium.com/@rockyshikoku)
[ホームページ](https://sites.google.com/view/mlboydaisuke/%E3%83%9B%E3%83%BC%E3%83%A0)
Slackの便利すぎるショートカット

# はじめに
業務でよく使うショートカットをまとめました

今日のテーマは
『あなたの残業時間を10分減らすこと』ですー

# ショートカット一覧

Mac ･･･ ⌘
Windows ･･･ Ctrl

## 基本編
|機能|ショートカット|
|---|---|
|ショートカット早見表|⌘ /|
|検索|⌘ g|
|直近のメッセージを(空白のテキスト入力で)編集する|⌘ ↑|
|左サイドバーを表示 / 非表示にする|⌘ Shift d|
|右サイドバーを閉じる/再度開く|⌘ .|
|履歴に戻る(マウスでいう戻る）|⌘ [|
|履歴に進む(マウスでいう進む）|⌘ ]|

## 書式設定
|機能|ショートカット|
|---|---|
|太字|⌘ b|
|斜体|⌘ i|
|取り消し線|⌘ Shift x|
|コードテキスト|⌘ Shift c|
|コードブロックとしての書式選択|⌘ Shift Alt c|
|番号付きリスト|⌘ Shift 7|
|箇条書きリスト|⌘ Shift 8|
|引用|⌘ Shift 9|
|ファイルを追加する|⌘ u|


## ワークスペースの切り替え
|機能|ショートカット|
|---|---|
|前のワークスペース|⌘ Shift [|
|次のワークスペース|⌘ Shift ]|
|特定のワークスペース|⌘ 1~9|
※⌘を長押ししていると、アイコンの下に数字が表示されます。

[公式はこちら](https://slack.com/intl/ja-jp/help/articles/201374536-Slack-のキーボードショートカット#mac-1)


# 終わりに
~~うん、この程度で残業時間は減りません！~~
個人的には、**書式設定**がおすすめですね！

完全に余談ですが、現実世界で「しょうがないからやってやるよ」ってスタンスで来られると、なんであんなに腹が立つんでしょうね（タイトルのワイ←）
5分で作るDocker＋Laravel PHP＋Vue.js開発環境構築

|開発環境|
|---|
|macOS Big Sur|



下記の記事を参考に環境構築を行ったのですが、
やれ`wget`コマンドが無いだの、`apt-get`コマンドが無いだの初心者の方への導入への障壁がいくつかあったため、
それを乗り越えるための記事にしたいと思います。（※注：下記の記事は決して悪くありません。）

|タイトル|リンク|
|---|---|
|5分で作るLaravel＋Vue.js開発環境（docker-compose）|https://qiita.com/yusukeito58/items/37bd551560e495dbd1b8|
---
# `wget`コマンドインストール
|タイトル|リンク|
|---|---|
|Mac - wgetコマンドをインストール（使えるようにする）|https://qiita.com/th4inf/items/f85c1b91065d85af67b9|
---
# ~~`apt-get`コマンドインストール~~ ←apt-getコマンドが無いかと思い調べてが結果的にいらないのでやらんで良い
|タイトル|リンク|
|---|---|
|install apt-get to Mac|https://qiita.com/th4inf/items/f85c1b91065d85af67b9|
---
# `docker-compose up -d --build`時に`mysql-client`のエラーがでたら
**エラー内容**

```sh
E: Package 'mysql-client' has no installation candidate
ERROR: Service 'app' failed to build : The command '/bin/sh -c apt-get update     && apt-get install -y zlib1g-dev mysql-client libpng-dev libjpeg-dev gnupg curl wget     && docker-php-ext-configure gd --with-png-dir=/usr/include --with-jpeg-dir=/usr/include     && docker-php-ext-install zip pdo_mysql gd' returned a non-zero code: 100
```
|タイトル|リンク|
|---|---|
|docker-compose buildするときにbundle installやmysql-clientでコケた話|https://qiita.com/aseanchild1400/items/d3580366054fee3d2703|
---
Ignition Gazebo モデル表示　メモ

個人的メモです。

##公式のモデルパスについて
https://github.com/ignitionrobotics/design/blob/master/finding_resources.md

##ダウンロードしたモデルの場所
![Screenshot from 2020-11-17 22-01-28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512516/65b43b75-591d-de15-d2c1-eddc0f7eb037.png)

##yamlファイル内容
![Screenshot from 2020-11-17 22-03-22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512516/01eb2583-ad1d-b60d-93d7-549175ae09c7.png)

##STL表示サンプル
![Screenshot from 2020-11-17 22-11-44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512516/82a1a84e-2232-7aeb-fbab-92b146d0688c.png)

![Screenshot from 2020-11-17 22-29-27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512516/c8bc00ce-6eaf-3c79-fbdb-432d2ef50b8f.png)
SAAに合格したのでどんな感じだったか書いてみる

未経験からエンジニアになって2年目になるのですが、そろそろ何かしらの資格に挑戦してみようかなあと思い、SAAを受験してみました。


勉強期間、試験内容など、どんな感じだったかまとめていきたいと思います〜


SAAの試験の概要は[こちら](https://aws.amazon.com/jp/certification/certified-solutions-architect-associate/)


## 勉強時間、勉強方法


勉強期間はトータルして大体5週間ちょっとぐらいです。9月下旬に勉強を始めて、11月16日に試験を受けたので、期間としては2ヶ月程ありますが、サボったり、仕事が忙しかったり、ドラマにはまってしまったりwと勉強してない期間も結構あったので、そこは省いた期間となります。

教材は、Udemyで、
- AWS認定ソリューションアーキテクト – アソシエイト試験突破講座
- AWS認定ソリューションアーキテクト アソシエイト模擬試験問題集

この２つを購入しました。

勉強方法としてはいたってシンプルで、

1. 教材の動画をみて内容を理解
2. 問題を解く。
3. 解けるようになるまで繰り返す。

こんな感じでやりました。

正直、これやっとけば全然受かるやろと調子こいてましたが、蓋を開けてみたら、合格ラインが720/1000のところ、741点とめっちゃギリギリで合格してました。。ひえ。。


今になってから言えることですが、結構ちゃんと勉強しないと受からない試験なんじゃないかなと思います。。

自分の場合、ただひたすら解いて覚えることに集中してしまい、

内容を根本から理解する、仕組みを理解する

といったことがちょっと甘くなってました。


これが、あまり点数が取れなかった原因だと思ってます。


ただ、このudemyの教材で、試験直前に復習していた内容が、ほぼほぼそのまま出たりもしました。(逆にそれがなかったら落ちてたんじゃないかとw)


なので、この教材はすごいおすすめです。

一つ言うなら、ちょっと解説が分かりにくいというか、足りないことがちょこちょこあるので、そういったところは、随時調べて意味を理解する、、という作業が必要になるかと思います。


## 受験時の試験内容

試験内容としては、主に

- EBS, EFS, S3 
- Auto Scaling, Ec2、CloudFrontあたりを使ったアーキテクチャ構成


この辺りの問題が結構出てきた印象でした。


試験を受けた後に、分野別にスコアと評価が見られるのですが、「高パフォーマンスアーキテクチャの設計」については、再学習した方が良いよーと書かれてました。やはり問題を解くだけでなく、特にアーキテクチャに関しては、自分で図を書いてみたり等、理解することに重点を置いた勉強も大事なのではないかと思いました。


### 受験後の感想

資格としては取得できたものの、
知識としては曖昧な部分も結構多く、決してドヤ顔はできません。

実際に触ってなんぼ、なところもあるかなと思っているので、
改めて、色々アプリを動かしてみながらインフラを触っていくことでもっとできるようになれればと思います〜
子育てサポートWebARアプリケーションを作成中！プログラム初心者パパの挑戦

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">ペンギンの「ペンペン」が現れて何かしゃべるところまで。<a href="https://twitter.com/hashtag/protoout?src=hash&amp;ref_src=twsrc%5Etfw">#protoout</a> <a href="https://twitter.com/hashtag/AR?src=hash&amp;ref_src=twsrc%5Etfw">#AR</a> <a href="https://t.co/mew6weQHUA">pic.twitter.com/mew6weQHUA</a></p>&mdash; 3do. (@3doHi) <a href="https://twitter.com/3doHi/status/1328597873378914305?ref_src=twsrc%5Etfw">November 17, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

#「イヤイヤ期」を解決する子育てサポートWebARアプリケーション
　現在、イヤイヤ期を迎えたこどもを持つパパ/ママ向けの子育てサポートWebアプリケーションを作成中です。

　試作の状態のため、「アプリケーションを作ろうと思った背景」や、「プロダクトの全体像」、「解決しようとしている課題とその狙い」などの詳細説明は、本記事では割愛しますが、<B>制作の状況や、完成品はQiitaにも都度アップデート出来ればと思っていますので、ご興味あれば引き続き記事のチェックお願いします！</B>

　ざっくり言うと、<B>こどもの『ごはんのイヤイヤ（最後まで食べずに遊びたい）と、その後のお風呂のイヤイヤ（お風呂入りたくない）を、お風呂場にあるおもちゃのARコンテンツで解決したい』</B>と思っています！

　現時点で出来ている下記2点までで、娘に使ってもらうテストをしてみましたので、その様子と、見えてきた改善点などを記事にしてみたいと思います。
・ARマーカーを読み取りマーカー上にモデルを出現させる
・モデルを画面に出現させたタイミングでmp3音源を再生する

#娘に使ってもらい、その様子を観察した

<B>１．使用感</B>
　1才11か月の娘には<B>ARの世界観を理解してもらえるか（怖がったりしないか）、反応が読めませんでした</B>が、スマホをかざすと、現実には存在しないペンギンが現れることに<B>かなり興味を示し、楽しんでる様子でした！</B>スマホの中を覗き込んだり、スマホの外からマーカーを直接見たりしながら、「現実にあるようで無い」世界観をニヤニヤしながら楽しんでいました。
　一方で、よっぽど楽しいのか何度も何度も「スマホをかずす」→「やめる」の繰り返しとなり、終わりのない感じになってしまいました。この点は、<B>アプリケーションとしての「終わり」を準備してあげる必要性を感じました。</B>
![IMG_9587.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/737339/132d067c-8a8d-a113-bee1-61728e5151a2.png)
<B>２．効果</B>
　ペンギンのARが出現したタイミングで、アプリケーション内で流れる「●●ちゃん、お風呂に入ろう！」という音声については、「･･･お風呂」と小さな声で呟いていたので、<B>「お風呂」というキーワードは認識してくれた</B>と思います。さらに妻が「ペンペン(←我が家のペンギンの愛称)がお風呂で待ってるってよ～」と促すと、<B>いつもよりスムーズにお風呂場に向かってくれました。</B>そして、お風呂場にいるペンペンに対面したときは<B>「あーペンペンだー！」</B>と言って、嬉しそうにペンギンのおもちゃを手にしていましたので、<B>お風呂に入りたくないという「イヤイヤ」の改善効果は、ある程度見込めるのではないかと思いました！</B>
　ただし、初めてだったので、<B>目新しもあり、良い反応を示したということもある</B>と思いましたので、継続して利用してもらえるように、ペンギンだけでなく「今日は誰がお風呂で待ってくれてるだろう感」が必要な気がしました。
![IMG_9588.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/737339/d17de963-c22b-be62-2994-7d6e7cd00288.png)

<B>３．妻へのヒアリング</B>
　娘の反応は結構いいね！という同じ評価をもらえましたが、下記3点の指摘ももらいました。
・ARモデルのペンペン(ペンギン)がリアルすぎてお風呂にいるおもちゃとギャップある。
・娘の操作だと、スマホが固定できずARマーカーの読み取りが途中で切れてしまうことが何度かあった。音声が途中で途切れてしまうと、「お風呂に入ろう！」というキーワードまで辿りつかない。
・うちの娘以外の反応も見てみた方が、色んな観点で評価できるのではないか。

#ということで、今後考えたい対策

|見えた課題|対策                  |
|------------|--------------------------|
|ARが楽しくて終わりがない|音声再生が終わったらペンペン(←我が家のペンギンの愛称)が自ら立ち去るようにしたい|
|継続して利用してもらえるかわからない|ペンギンだけでないARモデルも準備したい|
|ARモデルのペンペンがリアルすぎてお風呂にいるおもちゃとギャップある|もう少しデフォルメされたペンギンのARモデルを探す|
|娘の操作だと、スマホが固定できずARマーカーの読み取りが途中で切れて、音声が途切れてしまう|対策検討中（持ちやすそうなカメラ型のスマホケース買ってみたので次はそれでテスト予定）|
|我が子以外のこどもの反応が悪い可能性がある|検証に協力してくれる人を探して、色んなフィードバックをもらう|
#今回は以上。引き続き頑張ります！
　とりあえずはベースとなる機能と簡単な検証は成功したとと思うので、今回見えた課題の改善に取り組み、より良いモノを引き続き目指していきたいです！！

続く。
Error response from daemon: conflict: Dockerコンテナを作成しようとしたらコンフリクトが起きたので解決法

## 概要
コンテナを立ち上げるときにエラーが起きたので、その対処法とコマンドをまとめておきます。

## エラー文

```terminal:ターミナル
Error response from daemon: Conflict. The container name "コンテナ名" is already in use by container "コンテナID". You have to remove (or rename) that container to be able to reuse that name.
```

コンテナがすでにあるので、名前を変更するか削除するかしてください。要するに同じコンテナ名は複数つくれないということですね！！

## 仮説
- 動作しているコンテナ一覧を見る。
- 動作を止め、コンテナ削除。

## 必要になるコマンド

| Dockerコマンド | 備考 |
|:-:|:-:|
| `docker ps`           |  動作中コンテナ一覧 |
|  docker ps -a     　  | コンテナ一覧  |
|  docker stop コンテナID |   動作しているコンテナをストップ |
| docker rm (-f) コンテナID    | 停止しているコンテナを削除 ※-fオプションを付けると強制削除 |

注意が必要なのが、コンテナをストップしてからでないとコンテナ削除ができないこと。<br>動作しているコンテナを停止コマンドで停止させたあと、***そのまま削除するのではなく、動作していたコンテナが停止できたのか？を確認をしてから削除***する。また、***削除に成功したあとも削除できたのか確認する。***
もしくは`-f`オプションで強制的に削除してしまえばコンテナ起動中でも削除可能。
<br>***このようにいちいち確認する癖をつけておけば後で痛い目に合う確率が減ると思いました。***

## 再度コンテナ作成
![image.png](https://i.gyazo.com/88d42501ee7e603343c145b24f7e30b7.png)

Cookieが大きいというエラー。読み取るとおそらくCookieが溜まってるから削除して！！という感じだと思います。
早速溜まったCookieを削除し挙動を確認。

![image.png](https://i.gyazo.com/34d41a3d38669caf2b3d130d6eca0cce.png)

***仮説通りnginxコンテナを実行することができました！！***

## まとめ
- コンテナは同じ名前のものを作ることができない。
- コンテナ削除とイメージ削除で少しコマンドが違う(`rmi` か　`rm`)ので削除に失敗しても落ち着く。
- `rmi`の`i`はイメージのことで`i`を`removing`（取り除く）ということ。
- コマンドを打ったあと挙動が正しいか確認する癖をつける。


## 参考文献

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

- [Dockerイメージとコンテナの削除方法](https://qiita.com/tifa2chan/items/e9aa408244687a63a0ae)
- [Chromeに「 400 Bad Request Header Or Cookie Too Large 」が出たときの対処方法](http://hokoxjouhou.blog105.fc2.com/blog-entry-1548.html)